What version of prettier-plugin-tailwindcss are you using?

v0.2.5

What version of Tailwind CSS are you using?

v3.2.7

What version of Node.js are you using?

v18.14.2

What package manager are you using?

Yarn

What operating system are you using?

macOS

Reproduction URL

https://github.com/piedrahitapablo/prettier-tailwind-bug

Steps:

git clone [email protected]:piedrahitapablo/prettier-tailwind-bug.git
yarn install
yarn format

that should show you the git diff for the classes that are reordered

Describe your issue

The issue is that this plugin does not order classes that are specified in a variable outside the className prop. If you go to the minimal reproduction repo, you can see that I defined two variables (classes and classes2) that are later used inside the className prop, one inside a template string and the other one as the full value of className but the plugin does not reorder them. In line 24 I used the classnames package inside the className prop and the plugin picks the classes and reorders them, so it's not an issue with that package.

The behavior I would expect is that the plugin reorders those values. I know that can be tricky in some situations and using classnames inside the className prop should cover most cases.

Finally, if the plugin is working as intended, I think adding some clarification on the docs would be great, just saying that the plugin only reorders the classes defined inside the prop.

Happy to help if I can make a PR, just need some pointers on where to start.

Thanks!