Add defaults for translate utilities. Fixes #2.

tailwindcss-animate.css

@@ -167,62 +167,108 @@
   animation-play-state: paused;
 }
 
+@utility fade-in {
+  --tw-enter-opacity: 0;
+}
 @utility fade-in-* {
   --tw-enter-opacity: --value(--percentage-*, [*]);
 }
+
+@utility fade-out {
+  --tw-exit-opacity: 0;
+}
 @utility fade-out-* {
   --tw-exit-opacity: --value(--percentage-*, [*]);
 }
 
+@utility zoom-in {
+  --tw-enter-scale: 0;
+}
 @utility zoom-in-* {
   --tw-enter-scale: calc(--value([percentage]) / 100%);
   --tw-enter-scale: calc(--value([ratio], [number]));
   --tw-enter-scale: --value(--percentage-*);
 }
+
+@utility zoom-out {
+  --tw-exit-scale: 0;
+}
 @utility zoom-out-* {
   --tw-exit-scale: calc(--value([percentage]) / 100%);
   --tw-exit-scale: calc(--value([ratio], [number]));
   --tw-exit-scale: --value(--percentage-*);
 }
 
+@utility spin-in {
+  --tw-enter-rotate: 30deg;
+}
 @utility spin-in-* {
   --tw-enter-rotate: calc(--value(number) * 1deg);
   --tw-enter-rotate: --value(--rotate-*, [angle]);
 }
+
+@utility spin-out {
+  --tw-exit-rotate: 30deg;
+}
 @utility spin-out-* {
   --tw-exit-rotate: calc(--value(number) * 1deg);
   --tw-exit-rotate: --value(--rotate-*, [angle]);
 }
 
+@utility slide-in-from-top {
+  --tw-enter-translate-y: -100%;
+}
 @utility slide-in-from-top-* {
   --tw-enter-translate-y: calc(--value(integer) * var(--spacing) * -1);
   --tw-enter-translate-y: calc(--value(--translate-*, [percentage], ratio, [length]) * -1);
 }
+
+@utility slide-in-from-bottom {
+  --tw-enter-translate-y: 100%;
+}
 @utility slide-in-from-bottom-* {
   --tw-enter-translate-y: calc(--value(integer) * var(--spacing));
   --tw-enter-translate-y: --value(--translate-*, [percentage], ratio, [length]);
 }
+@utility slide-in-from-left {
+  --tw-enter-translate-x: -100%;
+}
 @utility slide-in-from-left-* {
   --tw-enter-translate-x: calc(--value(integer) * var(--spacing) * -1);
   --tw-enter-translate-x: calc(--value(--translate-*, [percentage], ratio, [length]) * -1);
 }
+@utility slide-in-from-right {
+  --tw-enter-translate-x: 100%;
+}
 @utility slide-in-from-right-* {
   --tw-enter-translate-x: calc(--value(integer) * var(--spacing));
   --tw-enter-translate-x: --value(--translate-*, [percentage], ratio, [length]);
 }
 
+@utility slide-out-to-top {
+  --tw-exit-translate-y: -100%;
+}
 @utility slide-out-to-top-* {
   --tw-exit-translate-y: calc(--value(integer) * var(--spacing) * -1);
   --tw-exit-translate-y: calc(--value(--translate-*, [percentage], ratio, [length]) * -1);
 }
+@utility slide-out-to-bottom {
+  --tw-exit-translate-y: 100%;
+}
 @utility slide-out-to-bottom-* {
   --tw-exit-translate-y: calc(--value(integer) * var(--spacing));
   --tw-exit-translate-y: --value(--translate-*, [percentage], ratio, [length]);
 }
+@utility slide-out-to-left {
+  --tw-exit-translate-x: -100%;
+}
 @utility slide-out-to-left-* {
   --tw-exit-translate-x: calc(--value(integer) * var(--spacing) * -1);
   --tw-exit-translate-x: calc(--value(--translate-*, [percentage], ratio, [length]) * -1);
 }
+@utility slide-out-to-right {
+  --tw-exit-translate-x: 100%;
+}
 @utility slide-out-to-right-* {
   --tw-exit-translate-x: calc(--value(integer) * var(--spacing));
   --tw-exit-translate-x: --value(--translate-*, [percentage], ratio, [length]);