feat: add compatibility with tailwindcss v4

[zbigniewstefaniuk]

Hi there, huuge fan of tailwindcss-animate here

I've updated peer dependencies to play nicley with tailwind v4

@jamiebuilds

[kimonneuhoff]

@jamiebuilds can you please merge this pr? :)

[ktisakib]

please merge the pr we want to use v4 with this

[M-51]

In the meantime, you can override tailwindcss-animate peer dependency, by adding this:

 "overrides": {
    "tailwindcss-animate": {
      "tailwindcss": "$tailwindcss"
    }
  },

to your package.json.

tailwindcss-animate will use tailwindcss version specified in your package.json file.

[matthewgapp]

For those looking for a plug-n-play solution: I published a fork as a short-term workaround where I'm folding in some of the outstanding PRs, since this repo hasn't had activity in 2 years. https://github.com/nobie-org/tailwindcss-animate.

npm: https://www.npmjs.com/package/@nobie-org/tailwindcss-animate

[Wombosvideo]

I've translated this plugin to the new CSS-first format and uploaded the code to https://github.com/Wombosvideo/tailwindcss-animate-v4. Maybe this helps someone

[adielhercules]

I was having the same issue and found a workaround, I found this is working properly:

In your app.css, you can add the plugin like this:

@import "tailwindcss";
@plugin "tailwindcss-animate";
/* ... rest of theme and styles */

This is described in their documentation:

Use the @plugin directive to load a legacy JavaScript-based plugin

Link: https://tailwindcss.com/docs/functions-and-directives#plugin-directive

[Wombosvideo]

@adielhercules Sure but you will still get some glitches

[markosmk]

I've translated this plugin to the new CSS-first format and uploaded the code to https://github.com/Wombosvideo/tailwindcss-animate-v4. Maybe this helps someone

This is the best response, and better adapted to the V4 of Tailwindcss, thanks

[altanbgn]

still not merged? It this project abandoned?

[WilsonNet]

@adielhercules Sure but you will still get some glitches

thank you so much, it worked, it is much prettier as a css file