tailwindcss/packages/@tailwindcss-upgrade/src/codemods/template
Robin Malfait 01d1e98259
Canonicalization constant folding and handling zeros (#19095)
The main goal of this PR was to support canonicalization of zero like
values. We essentially want to canonicalize `-mt-0` as `mt-0`, but also
`mt-[0px]`, `mt-[0rem]`, and other length-like units to just `mt-0`.

To do this, we had to handle 2 things:

1. We introduced some more constant folding, including making `0px` and
`0rem` fold to `0`. We only do this for length units. We also normalize
`-0`, `+0`, `-0.0` and so on to `0`.
2. While pre-computing utilities in our lookup table, we make sure that
we prefer `mt-0` over `-mt-0` if both result in the same signature.

Moved some of the constant folding logic into its own function and added
a bunch of separate tests for it.

## Test plan

Added more unit tests where we normalize different zero-like values to
`0`.

Running the canonicalization logic:
```js
designSystem.canonicalizeCandidates([
  '-m-0',
  '-m-[-0px]',
  '-m-[-0rem]',
  '-m-[0px]',
  '-m-[0rem]',
  'm-0',
  'm-[-0px]',
  'm-[-0rem]',
  'm-[0px]',
  'm-[0rem]',
  'm-[calc(var(--spacing)*0)]',
  'm-[--spacing(0)]',
  'm-[--spacing(0.0)]',
  'm-[+0]',
  'm-[-0]',
  '-m-[-0]',
  '-m-[+0]',
]) // → ['m-0']
```

---------

Co-authored-by: Jordan Pittman <jordan@cryptica.me>
2025-10-09 18:09:29 +00:00
..
candidates.test.ts Introduce canonicalizeCandidates on the internal Design System (#19059) 2025-10-07 12:41:12 +02:00
candidates.ts Improve performance of cloning AST nodes (#19067) 2025-10-07 10:46:37 +00:00
is-safe-migration.test.ts Ensure first class inside className in React is migrated (#19031) 2025-09-30 11:13:14 -04:00
is-safe-migration.ts Ensure first class inside className in React is migrated (#19031) 2025-09-30 11:13:14 -04:00
migrate-arbitrary-variants.ts Improve performance of cloning AST nodes (#19067) 2025-10-07 10:46:37 +00:00
migrate-automatic-var-injection.test.ts Improve upgrade migrations (#18184) 2025-05-30 13:32:59 +00:00
migrate-automatic-var-injection.ts Improve performance of cloning AST nodes (#19067) 2025-10-07 10:46:37 +00:00
migrate-camelcase-in-named-value.test.ts Change casing of utilities with named values to kebab-case to match u… (#18017) 2025-05-14 14:51:51 +02:00
migrate-camelcase-in-named-value.ts Improve performance of cloning AST nodes (#19067) 2025-10-07 10:46:37 +00:00
migrate-canonicalize-candidate.test.ts Make candidate template migrations faster (#18025) 2025-05-15 11:17:39 +00:00
migrate-canonicalize-candidate.ts Make candidate template migrations faster (#18025) 2025-05-15 11:17:39 +00:00
migrate-handle-empty-arbitrary-values.test.ts Ensure @tailwindcss/upgrade runs on Tailwind CSS v4 projects and is idempotent (#17717) 2025-04-22 11:10:46 -04:00
migrate-handle-empty-arbitrary-values.ts Ensure @tailwindcss/upgrade runs on Tailwind CSS v4 projects and is idempotent (#17717) 2025-04-22 11:10:46 -04:00
migrate-legacy-arbitrary-values.test.ts Refactor codemod structure (#17484) 2025-04-01 17:12:22 +02:00
migrate-legacy-arbitrary-values.ts Improve performance of cloning AST nodes (#19067) 2025-10-07 10:46:37 +00:00
migrate-legacy-classes.test.ts Make candidate template migrations faster (#18025) 2025-05-15 11:17:39 +00:00
migrate-legacy-classes.ts Improve performance of cloning AST nodes (#19067) 2025-10-07 10:46:37 +00:00
migrate-max-width-screen.test.ts Refactor codemod structure (#17484) 2025-04-01 17:12:22 +02:00
migrate-max-width-screen.ts Design system driven upgrade migrations (#17831) 2025-05-02 23:18:06 +02:00
migrate-modernize-arbitrary-values.test.ts Introduce canonicalizeCandidates on the internal Design System (#19059) 2025-10-07 12:41:12 +02:00
migrate-modernize-arbitrary-values.ts Improve performance of cloning AST nodes (#19067) 2025-10-07 10:46:37 +00:00
migrate-prefix.test.ts Ensure @tailwindcss/upgrade runs on Tailwind CSS v4 projects and is idempotent (#17717) 2025-04-22 11:10:46 -04:00
migrate-prefix.ts Make candidate template migrations faster (#18025) 2025-05-15 11:17:39 +00:00
migrate-simple-legacy-classes.test.ts Ensure @tailwindcss/upgrade runs on Tailwind CSS v4 projects and is idempotent (#17717) 2025-04-22 11:10:46 -04:00
migrate-simple-legacy-classes.ts Design system driven upgrade migrations (#17831) 2025-05-02 23:18:06 +02:00
migrate-theme-to-var.ts Canonicalization constant folding and handling zeros (#19095) 2025-10-09 18:09:29 +00:00
migrate-variant-order.test.ts Ensure @tailwindcss/upgrade runs on Tailwind CSS v4 projects and is idempotent (#17717) 2025-04-22 11:10:46 -04:00
migrate-variant-order.ts Design system driven upgrade migrations (#17831) 2025-05-02 23:18:06 +02:00
migrate.test.ts Canonicalization constant folding and handling zeros (#19095) 2025-10-09 18:09:29 +00:00
migrate.ts Introduce canonicalizeCandidates on the internal Design System (#19059) 2025-10-07 12:41:12 +02:00
prepare-config.ts Refactor codemod structure (#17484) 2025-04-01 17:12:22 +02:00