Skip to content

Carousel doesn't react to slideCount changeΒ #2610

@gex

Description

@gex

Description

when the slideCount prop changes on the Carousel.Root component, the PrevButton, NextButton or setting autoplay to true don't react accordingly, they still use the initial state. this can happen when the slides are coming from a remote call for example. i checked the API of the Carousel.Root but i don't see any way to kinda initialize the state with the new value.

slightly related, but i'd expect the same reactivity for the autoplay prop as well. this value can come from a prop or a context instead of a literal boolean value but the carousel doesn't reflect on this change, it uses the value from the first render.

Link to Reproduction (or Detailed Explanation)

https://stackblitz.com/edit/vitejs-vite-g9tquxh7?file=src%2FApp.tsx

Steps to Reproduce

autoplay:

  1. let autoplay scroll through the slides first, it will go through all the slides
  2. with the add slide button add a couple of slides
  3. autoplay will skip the newly created slides

prev/next buttons:

  1. use the previous/next buttons, you can switch to all the slides
  2. with the add slide button add a couple of slides
  3. the previous/next buttons can cycle through the original slides only

Ark UI Version

5.18.3

Framework

  • React
  • Solid
  • Vue
  • Svelte

Browser

Safari 18.5, Chrome 138

Additional Information

might be a bug in the underlying zag state machine like my previous issue (what you fixed in no time, thank you! πŸ™).

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions