diff --git a/CHANGELOG.md b/CHANGELOG.md index 1bbc4667aa93..e4ab8ed4103c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -16,6 +16,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Allow spaces spaces around operators in attribute selector variants ([#14703](https://github.com/tailwindlabs/tailwindcss/pull/14703)) - _Upgrade (experimental)_: Migrate `flex-grow` to `grow` and `flex-shrink` to `shrink` ([#14721](https://github.com/tailwindlabs/tailwindcss/pull/14721)) - _Upgrade (experimental)_: Minify arbitrary values when printing candidates ([#14720](https://github.com/tailwindlabs/tailwindcss/pull/14720)) +- _Upgrade (experimental)_: Migrate arbitrary values to bare values for the `from-*`, `via-*`, and `to-*` utilities ([#14725](https://github.com/tailwindlabs/tailwindcss/pull/14725)) ### Changed diff --git a/packages/@tailwindcss-upgrade/src/template/codemods/arbitrary-value-to-bare-value.test.ts b/packages/@tailwindcss-upgrade/src/template/codemods/arbitrary-value-to-bare-value.test.ts index 411f0eb9ee3a..273d8114f5e8 100644 --- a/packages/@tailwindcss-upgrade/src/template/codemods/arbitrary-value-to-bare-value.test.ts +++ b/packages/@tailwindcss-upgrade/src/template/codemods/arbitrary-value-to-bare-value.test.ts @@ -17,6 +17,14 @@ test.each([ // Should stay as-is ['font-stretch-[1/2]', 'font-stretch-[1/2]'], + // Bare value with % is valid for these utilities + ['from-[28%]', 'from-28%'], + ['via-[28%]', 'via-28%'], + ['to-[28%]', 'to-28%'], + ['from-[28.5%]', 'from-[28.5%]'], + ['via-[28.5%]', 'via-[28.5%]'], + ['to-[28.5%]', 'to-[28.5%]'], + // This test in itself is a bit flawed because `text-[1/2]` currently // generates something. Converting it to `text-1/2` doesn't produce anything. ['text-[1/2]', 'text-[1/2]'], diff --git a/packages/@tailwindcss-upgrade/src/template/codemods/arbitrary-value-to-bare-value.ts b/packages/@tailwindcss-upgrade/src/template/codemods/arbitrary-value-to-bare-value.ts index 44aa2675db83..52f3dc4c05c4 100644 --- a/packages/@tailwindcss-upgrade/src/template/codemods/arbitrary-value-to-bare-value.ts +++ b/packages/@tailwindcss-upgrade/src/template/codemods/arbitrary-value-to-bare-value.ts @@ -14,16 +14,24 @@ export function arbitraryValueToBareValue( let clone = structuredClone(candidate) let changed = false - // Convert font-stretch-* utilities + // Convert utilities that accept bare values ending in % if ( clone.kind === 'functional' && clone.value?.kind === 'arbitrary' && clone.value.dataType === null && - clone.root === 'font-stretch' + (clone.root === 'from' || + clone.root === 'via' || + clone.root === 'to' || + clone.root === 'font-stretch') ) { if (clone.value.value.endsWith('%') && isPositiveInteger(clone.value.value.slice(0, -1))) { let percentage = parseInt(clone.value.value) - if (percentage >= 50 && percentage <= 200) { + if ( + clone.root === 'from' || + clone.root === 'via' || + clone.root === 'to' || + (clone.root === 'font-stretch' && percentage >= 50 && percentage <= 200) + ) { changed = true clone.value = { kind: 'named',