From 5901c6caf0680f4c6357e5a66fb9805a6d5dc560 Mon Sep 17 00:00:00 2001
From: IMythx <mahmoudhelal9888@gmail.com>
Date: Sat, 5 Oct 2024 23:47:07 +0300
Subject: [PATCH 1/2] fix:moved animation name and duration to theme extension
 for the sake of css modules

---
 index.js | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

diff --git a/index.js b/index.js
index 1021698..1c11826 100644
--- a/index.js
+++ b/index.js
@@ -9,11 +9,7 @@ function filterDefault(values) {
 module.exports = plugin(
 	({ addUtilities, matchUtilities, theme }) => {
 		addUtilities({
-			"@keyframes enter": theme("keyframes.enter"),
-			"@keyframes exit": theme("keyframes.exit"),
 			".animate-in": {
-				animationName: "enter",
-				animationDuration: theme("animationDuration.DEFAULT"),
 				"--tw-enter-opacity": "initial",
 				"--tw-enter-scale": "initial",
 				"--tw-enter-rotate": "initial",
@@ -21,8 +17,6 @@ module.exports = plugin(
 				"--tw-enter-translate-y": "initial",
 			},
 			".animate-out": {
-				animationName: "exit",
-				animationDuration: theme("animationDuration.DEFAULT"),
 				"--tw-exit-opacity": "initial",
 				"--tw-exit-scale": "initial",
 				"--tw-exit-rotate": "initial",
@@ -166,6 +160,10 @@ module.exports = plugin(
 					1: "1",
 					infinite: "infinite",
 				},
+				animation: ({ theme }) => ({
+					out: `leave ${theme("animationDuration.DEFAULT")}`,
+					in: `enter ${theme("animationDuration.DEFAULT")}`,
+				}),
 				keyframes: {
 					enter: {
 						from: {

From 06cc81cd97fdae97bcf9aa76a865517993789f9a Mon Sep 17 00:00:00 2001
From: IMythx <88852348+IMythx@users.noreply.github.com>
Date: Sun, 6 Oct 2024 01:27:39 +0300
Subject: [PATCH 2/2] Update index.js

---
 index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/index.js b/index.js
index 1c11826..806ec88 100644
--- a/index.js
+++ b/index.js
@@ -161,7 +161,7 @@ module.exports = plugin(
 					infinite: "infinite",
 				},
 				animation: ({ theme }) => ({
-					out: `leave ${theme("animationDuration.DEFAULT")}`,
+					out: `exit ${theme("animationDuration.DEFAULT")}`,
 					in: `enter ${theme("animationDuration.DEFAULT")}`,
 				}),
 				keyframes: {