Carregando…
Carregando…
Carregando…Horizontal/vertical image or card carousel with dots and auto-play.
$ npx kikitocn add carouselimport { Carousel } from "@/components/ui/cn/carousel/Carousel";
export function CarouselExample() {
return (
<Carousel>
<div className="p-8 bg-raised rounded-lg">Slide 1</div>
<div className="p-8 bg-raised rounded-lg">Slide 2</div>
<div className="p-8 bg-raised rounded-lg">Slide 3</div>
</Carousel>
);
}| Prop | Tipo | Padrão | Descrição |
|---|---|---|---|
items* | CarouselItem[] | — | Array de { id, content } |
autoPlay | boolean | false | Rotação automática |
autoPlayInterval | number | 3000 | Intervalo de rotação (ms) |
loop | boolean | true | Volta ao primeiro após o último |
showDots | boolean | true | Exibir indicadores de página |
showArrows | boolean | true | Exibir botões de navegação |
orientation | 'horizontal' | 'vertical' | 'horizontal' | Orientação do carrossel |
className | string | — | Classes CSS extras |
Horizontal with dots