Carousel image not show and random slide

[dediananto]

Describe the bug I found 2 bugs that happen to me.

1. Carousel does not show if I only have images less than 4 (3, 2, or 1)
2. when the Carousel show (with the minimum image is 4) I realize that the order of the images doesn't match with the image order from my code.

To Reproduce first bug:

1. using flowbite-react on NextJS
2. try to create a carousel component with 2 images. is the carousel appear properly? in my case, it doesn't show the slide, only the next and prev control button.
   second bug:
3. I use example code on documentation.

   <Carousel slideInterval={5000}>
   <img
   src="https://flowbite.com/docs/images/carousel/carousel-1.svg"
   alt="..."
   />
   <img
   src="https://flowbite.com/docs/images/carousel/carousel-2.svg"
   alt="..."
   />
   <img
   src="https://flowbite.com/docs/images/carousel/carousel-3.svg"
   alt="..."
   />
   <img
   src="https://flowbite.com/docs/images/carousel/carousel-4.svg"
   alt="..."
   />
   <img
   src="https://flowbite.com/docs/images/carousel/carousel-5.svg"
   alt="..."
   />
   </Carousel>

4. in my case, carousel-5.svg becomes first slide, 4th and 5th slide.

Expected behavior the image appears as slide and order position same as the code

Screenshots I add some note on the pictures, hopefully it will help

Desktop

• OS: Windows
• Browser Firefox v99 and Chrome v100
• Flowbite-react version 0.0.18

[rluders]

Can anyone confirm this bug? @tulup-conner @bacali95 @mouracamila

[rluders]

I guess that the issue could be related to NextJS + Flowbite React. I tried to reproduce the error without using NextJS and it doesn't happen to me.

[bacali95]

I couldn't reproduce it as well, @dediananto can you please provide a repo example?

[dediananto]

hai @bacali95 you can use this repo to reproduce the issue. this repo uses NextJS + Flowbite React. I also have screen recording, please kindly check on this

[dediananto]

I guess that the issue could be related to NextJS + Flowbite React. I tried to reproduce the error without using NextJS and it doesn't happen to me.

I think so, I try regular flowbite + NextJS and the result is the carousel is not shown. with flowbite react, the carousel is shown but has this issue

[bacali95]

@dediananto i see you are using version 0.0.10 of the library which indeed has the described problem, can you please try to use the latest version and check if it works?

[dediananto]

@bacali95 ah it's because I install 0.0.18 the first time, and get this issue, I try every previous version to make sure this issue happens from the beginning, and now, the latest version is 0.0.20. I can confirm this issue was gone

[rluders]

Since the user confirmed that the issue was gone by updating the library, I'm now closing this issue.

If you feel that this isn't solved feel free to reopen the issue.