arrows don't work correctly in this situation

[SantoJambit]

Checks

• [X] Not a duplicate.
• [X] Not a question, feature request, or anything other than a bug report directly related to Splide. Use Discussions for these topics: https://github.com/Splidejs/splide/discussions

Version

v4.x.x

Description

  const splideSettings: SplideProps = {
    options: {
      rewind: true,
      arrows: true,
      perMove: 3,
      perPage: 3,
    },
  };

When the above settings are used on a splide with 5 slides, the arrow buttons don't work correctly:

• When the first item is visible, pressing the right arrow does nothing.
• When the last item is visible, pressing the left arrow does nothing.
• When the first item is visible, pressing the left arrow scrolls correctly to the last item
• When the last item is visible, pressing the right arrow scrolls correctly to the first item

It starts appearing with react-splide 0.7.8, which was released june 11th, so I'm guessing it has to do with splide 4.0.7, which shows me #813, but that is about the type "loop" and my example is without type.

Removing that !perMove && fixes the issue, but I guess it might cause the other issue to re-emerge. I hope this pre-analysis helps.

Reproduction Link

https://codesandbox.io/s/keen-visvesvaraya-k5dx8f?file=/src/App.tsx

Steps to Reproduce

1. Load the codesandbox
2. Press the right arrow key => nothing happens (should scroll to the end)
3. Press the left arrow key => works as expected (scrolls to the end)
4. Press the left arrow key again => nothing happens (should scroll to the beginning)
5. Press the right arrow key => works as expected (scrolls to the beginning)

Expected Behaviour

Documented in the steps to reproduce