I am using DaisyUI's carousel component in my React/Vite/Tailwind project. When I add 2 carousels to the page, you can't switch carousels (scroll through another) until the previous carousel is done scrolling. I want to scroll through one carousel and immediately switch and start scrolling the next.
Here is a link to my public repo: https://github.com/ColeWhaley1/YourStory
I found a decent solution. The downside is that it stops the scroll completely after exiting the carousel. Meaning, it does not take into account any momentum from the mouse velocity; it just stops immediately. However, in my opinion, it's a style choice rather than a downside.
By using style={{ overflowX: "auto", scrollSnapType: 'none' }} in the carousel div and style={{ scrollSnapAlign: 'none' }} for each carousel item, I was able to 'solve' the multiple carousel bug.