diff --git a/docs/components/carousel/carousel.md b/docs/components/carousel/carousel.md index 5e41553..75dcd56 100644 --- a/docs/components/carousel/carousel.md +++ b/docs/components/carousel/carousel.md @@ -1,8 +1,17 @@ # Carousel +Use the carousel component to slide through multiple elements and images using custom controls, indicators, intervals, and options + +## Default slider + ```vue + +``` +## Prop - indicators + +```typescript +const props = defineProps({ + indicators: { + type: Boolean, + default: true, + }, +}) +``` + + + +```vue + + +``` + +## Prop - slide + +```typescript +const props = defineProps({ + slide: { + type: Boolean, + default: false, + }, +}) +``` + + + +```vue + + +``` + +## Prop - slide interval + +```typescript +const props = defineProps({ + slideInterval: { + type: Number, + default: 3000, + }, +}) +``` + + + +```vue + + +``` + +## Prop - pictures + +```typescript +const props = defineProps({ + pictures: { + type: Array, + default() { + return [ + { + 'src': 'https://flowbite.com/docs/images/carousel/carousel-1.svg', + 'alt': 'Picture 1', + }, + { + 'src': 'https://flowbite.com/docs/images/carousel/carousel-2.svg', + 'alt': 'Picture 2', + }, + { + 'src': 'https://flowbite.com/docs/images/carousel/carousel-3.svg', + 'alt': 'Picture 3', + }, + ] + }, + }, +}) +``` + + + +```vue + + +``` \ No newline at end of file