enforces-canonical-classname: --fix rewrites the wrong classes when two classes share a canonical form #490

enforces-canonical-classname reports and fixes the wrong classes when two classes in the same list canonicalize to the same value.

repro (eslint-plugin-tailwindcss 4.4.0, tailwindcss 4.3.3, eslint 9.39):

export const A = () => <div className="p-[1rem] grid p-4 md:px-6" />;

1:40  warning  Class 'p-[1rem]' can be written as 'p-4'
1:54  warning  Class 'p-4' can be written as 'md:px-6'

--fix output:

export const A = () => <div className="md:px-6 grid md:px-6 md:px-6" />;

expected: only p-[1rem] is reported, and the fix gives p-4 grid p-4 md:px-6.

it's because canonicalizeCandidates dedupes its output, so in the canonicalize-candidates case of src/utils/tailwindcss-api/worker/tailwind-api.mjs the result is shorter than the input and canonical[index] points to the next class after the first duplicate:

const canonical = context.canonicalizeCandidates(classNames);
return classNames.map((className, index) => canonical[index] ?? className);

calling it once per class keeps the indexes aligned:

return classNames.map(
  (className) => context.canonicalizeCandidates([className])[0] ?? className,
);

we hit the same bug in eslint-plugin-tailwind-canonical-classes, fixed in MaisonnatM/eslint-plugin-tailwind-canonical-classes#20. happy to open a pr here too if that helps :)