initialSlide prop is not working correctly when combined with loop and slidesPerView props

[pioso]

Check that this is really a bug

• I confirm

Reproduction link

https://codesandbox.io/p/devbox/swiper-react-watch-slides-visibility-forked-vhflff

Bug description

When using Swiper React component with loop={true} and slidesPerView={3}, the initialSlide prop doesn't work correctly when there aren't enough remaining slides to fill the view.
For example, with 9 total slides, slidesPerView={3}, and initialSlide={8}, the slider should show slides [9,1,2] initially (due to loop), but instead defaults to showing last 3 slides (7,8,9)
The issue occurs because there aren't enough slides to fill the remaining 2 visible positions after slide 9, even though loop mode should handle this by showing slides 1 and 2.

Expected Behavior

With configuration:

loop={true}
slidesPerView={3}
initialSlide={8}
total of 9 slides

The slider should:

Show slide 9 as the main/first visible slide
Due to loop mode, show slides 1 and 2 in the remaining visible positions
Maintain proper loop functionality while preserving this initial state

Actual Behavior

The slider:

Ignores the specified initialSlide={8} value
Defaults to showing last 3 slides instead looping to requested index and filling the view with missing slides from the beginning of the loop
Does not properly utilize the loop functionality for initial slide positioning when there aren't enough remaining slides to fill the view

Swiper version

11.1.14

Platform/Target and Browser Versions

macOS Chrome 129.0.6668.103

Validations

• Follow our Code of Conduct
• Read the docs.
• Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
• Make sure this is a Swiper issue and not a framework-specific issue

Would you like to open a PR for this bug?

• I'm willing to open a PR

[asadmalik]

Same for vue, using swiper elements.

• "swiper": "^11.1.14"
• "nuxt": "3.12.2",
• SSR: enabled

code example
<ClientOnly> {{ lastSlide }} <swiper-container events-prefix="swiper-" :slidesPerView="'auto'" loop="true" height="500" :centeredSlides="true" :spaceBetween="0" :pagination="{ clickable: true, }" :modules="modules" class="mySwiper" id="mySwiper" :initialSlide="lastSlide"> <swiper-slide> 1 </swiper-slide> <swiper-slide> 2 </swiper-slide> <swiper-slide> 3 </swiper-slide> <swiper-slide> 4 </swiper-slide> </swiper-container> </ClientOnly>