<script setup>
    const props = defineProps(["items"])
</script>

<template>
    <div class="border rounded-lg p-4">
        <UCarousel
            v-slot="{ item }"
            loop
            arrows
            :autoplay="{ delay: 2500 }"
            wheel-gestures
            :prev="{ variant: 'solid' }"
            :next="{ variant: 'solid' }"
            :items="items" :ui="{
                item: 'basis-1/3 ps-0',
                prev: 'sm:start-8',
                next: 'sm:end-8',
                container: 'ms-0'
            }">
            <img :src="item" width="640" height="640">
        </UCarousel>
    </div>
</template>
