Interval option not working (ReactJs)

[Khendrickthe5th]

Hello, I have been on this for over a day now, I'm pretty new to ReactJs so working with packages/libraries still feels new to me. i have managed to get my slider working with AutoScroll extension but i cant figure out how to add delays for each slide.
Say after Slide 1 completes, it waits for x amount of milliseconds before slide 2 commences, it further applies this method to all slides.
Below is my react component.

import { Splide, SplideSlide, SplideTrack } from '@splidejs/react-splide';
import '@splidejs/react-splide/css';
import { AutoScroll } from '@splidejs/splide-extension-auto-scroll';


function Reviews(){

    return(
        <Splide hasTrack={false} aria-label="Reviews of customers" className="w-[50%] h-fit m-auto"
        options={{
            type: 'loop',
            arrows: true,
            perPage: 2,
            pagination: false,
            interval: 1000,
            autoScroll: {
                pauseOnHover: true,
                speed: 8,

            },
        }}
        extensions={{ AutoScroll }}
        >

            <SplideTrack className="w-[100%] h-[100%] rounded-3xl">
                <SplideSlide className="h-[400px] w-[500px] bg-purple-700"> Lorem ipsum dolor sit, amet consectetur adipisicing elit. Quas, minima. </SplideSlide>
                <SplideSlide className="h-[400px] w-[500px] bg-teal-700"> Lorem ipsum dolor sit amet consectetur adipisicing elit. Repudiandae, error! </SplideSlide>
                <SplideSlide className="h-[400px] w-[500px] bg-yellow-700"> Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa, quas. </SplideSlide>

            </SplideTrack>
        </Splide>
        
    )

}

export default Reviews;

Will greatly appreciate all inputs as this issue is a barrier to progressing on the next part of my project, Thanks