Skip to content

Commit 54ddbb1

Browse files
authored
Ensure spacing utilities with no value (e.g. px) don't generate CSS (#14911)
This PR fixes an issue where utilities like `px` would read the `--spacing` variable and use its value as the utility value, similar to how `shadow` reads `--shadow` by default. That doesn't make sense for these utilities since `--spacing` is reserved as a special multiplier variable. --------- Co-authored-by: Adam Wathan <4323180+adamwathan@users.noreply.github.com>
1 parent 99c4c04 commit 54ddbb1

File tree

3 files changed

+18
-1
lines changed

3 files changed

+18
-1
lines changed

CHANGELOG.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
3232
- Rebase `url()` inside imported CSS files when using Vite ([#14877](https://github.com/tailwindlabs/tailwindcss/pull/14877))
3333
- Ensure that CSS transforms from other Vite plugins correctly work in full builds (e.g. `:deep()` in Vue) ([#14871](https://github.com/tailwindlabs/tailwindcss/pull/14871))
3434
- Don't unset keys like `--inset-shadow-*` when unsetting keys like `--inset-*` ([#14906](https://github.com/tailwindlabs/tailwindcss/pull/14906))
35+
- Ensure spacing utilities with no value (e.g. `px` or `translate-y`) don't generate CSS ([#14911](https://github.com/tailwindlabs/tailwindcss/pull/14911))
3536
- _Upgrade (experimental)_: Install `@tailwindcss/postcss` next to `tailwindcss` ([#14830](https://github.com/tailwindlabs/tailwindcss/pull/14830))
3637
- _Upgrade (experimental)_: Remove whitespace around `,` separator when print arbitrary values ([#14838](https://github.com/tailwindlabs/tailwindcss/pull/14838))
3738
- _Upgrade (experimental)_: Fix crash during upgrade when content globs escape root of project ([#14896](https://github.com/tailwindlabs/tailwindcss/pull/14896))

packages/tailwindcss/src/utilities.test.ts

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16124,6 +16124,18 @@ describe('spacing utilities', () => {
1612416124
}"
1612516125
`)
1612616126
})
16127+
16128+
test('spacing utilities must have a value', async () => {
16129+
let { build } = await compile(css`
16130+
@theme reference {
16131+
--spacing: 4px;
16132+
}
16133+
@tailwind utilities;
16134+
`)
16135+
let compiled = build(['px'])
16136+
16137+
expect(optimizeCss(compiled).trim()).toEqual('')
16138+
})
1612716139
})
1612816140

1612916141
describe('custom utilities', () => {

packages/tailwindcss/src/utilities.ts

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -278,7 +278,10 @@ export function createUtilities(theme: Theme) {
278278
// `defaultValue` (for candidates like `grow` that have no theme values)
279279
// or a bare theme value (like `--radius` for `rounded`). No utility
280280
// will ever support both of these.
281-
value = desc.defaultValue ?? theme.resolve(null, desc.themeKeys ?? [])
281+
value =
282+
desc.defaultValue !== undefined
283+
? desc.defaultValue
284+
: theme.resolve(null, desc.themeKeys ?? [])
282285
} else if (candidate.value.kind === 'arbitrary') {
283286
if (candidate.modifier) return
284287
value = candidate.value.value
@@ -394,6 +397,7 @@ export function createUtilities(theme: Theme) {
394397
themeKeys,
395398
supportsFractions,
396399
supportsNegative,
400+
defaultValue: null,
397401
handleBareValue: ({ value }) => {
398402
let multiplier = theme.resolve(null, ['--spacing'])
399403
if (!multiplier) return null

0 commit comments

Comments
 (0)