This PR fixes an issue where the `--default(…)` function that can be
used as part of `@utility` definitions goes through the same
pre-processing treatment as `--value(…)` and `--modifier(…)`.
Instead the `--default(…)` value should be emitted as-is.
The pre-processing treatment that's in place today is just to normalize
the value(s) that could be formatted in a strange way if you are dealing
with older Prettier / Biome versions.
Some of the transformations we do ahead of time:
- `--value(--spacing)` -> `--value(--spacing-*)`
- `--value(--spacing- *)` -> `--value(--spacing-*)`
- `--value(--text- * --line-height)` -> `--value(--text-*--line-height)`
- `--value(--text --line-height)` -> `--value(--text-*--line-height)`
- `--value(--text-\\* --line-height)` ->
`--value(--text-*--line-height)`
- `--value([ *])` -> `--value([*])`
One of these steps is getting rid of the spaces, that means that if your
`--default(…)` uses spaces, then we will get rid of it.
```css
@theme inline {
--text-box-trim-start: trim-start;
--text-box-trim-end: trim-end;
--text-box-trim-both: trim-both;
--text-box-edge-cap: cap alphabetic;
--text-box-edge-cap-text: cap text;
--text-box-edge-ex: ex alphabetic;
--text-box-edge-ex-text: ex text;
--text-box-edge-text: text alphabetic;
--text-box-edge-text-text: text text;
}
@utility trim-* {
text-box: --value('normal', 'inherit', 'initial', 'revert', 'revert-layer', 'unset');
text-box: --value(--text-box-trim-*) --modifier(--text-box-edge-*, --default(box alphabetic));
}
```
When you try to use this:
```html
<div className="trim-both" />
```
Then we get the following CSS out:
```css
.trim-both {
text-box: trim-both boxalphabetic;
}
```
This PR fixes that, and now the proper CSS will be emitted:
```css
.trim-both {
text-box: trim-both box alphabetic;
}
```
Fixes: #20391
## Test plan
1. Added an regression test to make sure that `--default(…)` values are
emitted as-is.
e566a926e7