From 9e59f47eb16ea63fbc5acaf054d1c3d5cd799a5a Mon Sep 17 00:00:00 2001
From: arifali123 <51419655+arifali123@users.noreply.github.com>
Date: Thu, 27 Jan 2022 20:43:45 -0800
Subject: [PATCH] add key prop in slider to remove warning

---
 src/carousel.tsx | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/carousel.tsx b/src/carousel.tsx
index 5ef3531..c42c6e8 100755
--- a/src/carousel.tsx
+++ b/src/carousel.tsx
@@ -80,8 +80,8 @@ export const Carousel = ({
     }, [index])
 
     React.useEffect(() => {
-        if(!autoPlay) {
-            return;
+        if (!autoPlay) {
+            return
         }
         const timer = setInterval(() => handleNext(), interval)
         return clearInterval(timer)
@@ -90,7 +90,7 @@ export const Carousel = ({
     return (
         <Contaier ref={containerRef}>
             {childrens.map((child, i) => (
-                <Slider onDragEnd={handleEndDrag} x={x} i={i}>
+                <Slider onDragEnd={handleEndDrag} x={x} i={i} key={i}>
                     {child}
                 </Slider>
             ))}
@@ -114,7 +114,11 @@ export const Carousel = ({
             {renderDots ? (
                 renderDots({ setActiveIndex: setIndex, activeIndex: index })
             ) : (
-                <Dots length={childrens.length} setActiveIndex={setIndex} activeIndex={index} />
+                <Dots
+                    length={childrens.length}
+                    setActiveIndex={setIndex}
+                    activeIndex={index}
+                />
             )}
         </Contaier>
     )