Migrate from, via, and to arbitrary values to bare values (#14725)

This PR migrates arbitrary values for the `from-*`, `via-*` and `to-*`
utilities
to bare values.

Input:
```html
<div class="from-[28%]"></div>
<div class="via-[28%]"></div>
<div class="to-[28%]"></div>
```

Output:
```html
<div class="from-28%"></div>
<div class="via-28%"></div>
<div class="to-28%"></div>
```

---------

Co-authored-by: Adam Wathan <4323180+adamwathan@users.noreply.github.com>
Co-authored-by: Adam Wathan <adam.wathan@gmail.com>
This commit is contained in:
Robin Malfait 2024-10-19 15:05:38 +02:00 • committed by GitHub
parent 2abf228124
commit fd8315bec7
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 20 additions and 3 deletions

View file

@ -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

View file

@ -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]'],

View file

@ -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',