This PR improves the upgrade tool to make sure that newly upgraded `--spacing(2)` CSS functions is pretty printed to prevent unambiguous looking classes (even though it compiles correctly). If you have a class such as `m-[calc(100dvh-theme(spacing.2))]`, then we used to convert it to `m-[calc(100dvh-calc(var(--spacing)*2))]`. But recently we introduced the `--spacing(2)` CSS function which means that the output now looks like this instead: `m-[calc(100dvh---spacing(2))]`. The triple `-` is valid because the first `-` is the minus sign, the next two `-` characters are from the function. One solution is to introduce spaces via underscores: ``` m-[calc(100dvh_-_--spacing(2))] ``` But a simpler solution, is to wrap the `--spacing(2)` in parens to remove the underscores and improve the readability of the `---` characters. ``` m-[calc(100dvh-(--spacing(2)))] ``` |
||
|---|---|---|
| .. | ||
| codemods | ||
| commands/help | ||
| template | ||
| utils | ||
| index.test.ts | ||
| index.ts | ||
| migrate-js-config.ts | ||
| migrate-postcss.ts | ||
| migrate-prettier.ts | ||
| migrate.ts | ||
| stylesheet.ts | ||