From 486ee33dce9a4660273732cb9b01259f9680fc59 Mon Sep 17 00:00:00 2001
From: Eldemarkki <38920928+Eldemarkki@users.noreply.github.com>
Date: Fri, 14 Apr 2023 19:07:09 +0300
Subject: [PATCH] fix: fix TextLoop flashing when cycling

---
 components/TextLoop/TextLoop.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/components/TextLoop/TextLoop.tsx b/components/TextLoop/TextLoop.tsx
index d36cb0ac..1ec58b91 100644
--- a/components/TextLoop/TextLoop.tsx
+++ b/components/TextLoop/TextLoop.tsx
@@ -24,7 +24,7 @@ const TextLoopElement = styled.span<{
   stayTimeRatio: number;
   duration: number;
 }>`
-  animation: ${props => TextLoopAnimation(props.stayTimeRatio)} ${(props) => props.duration}s ease-in-out;
+  animation: ${props => TextLoopAnimation(props.stayTimeRatio)} ${(props) => props.duration}s ease-in-out infinite;
 `
 
 type TextLoopProps = PropsWithChildren<{
@@ -42,7 +42,7 @@ export const TextLoop = ({ children, duration = 3, stayTimeRatio = 95 }: TextLoo
     key={index}
     duration={duration}
     stayTimeRatio={stayTimeRatio}
-    onAnimationEnd={incrementIndex}
+    onAnimationIteration={incrementIndex}
   >
     {childrenArray[index]}
   </TextLoopElement>;