Variable: Carousel

@arolariu/components

---

@arolariu/components / Carousel

Variable: Carousel

const Carousel: ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & CarouselProps & RefAttributes<HTMLDivElement>>

Defined in: components/ui/carousel.tsx:109

Provides a compound carousel container powered by Embla.

Remarks

• Renders a <div> element
• Built on embla-carousel-react
• Exposes context for content, items, and navigation controls

Examples

<Carousel>
  <CarouselContent>
    <CarouselItem>Slide 1</CarouselItem>
    <CarouselItem>Slide 2</CarouselItem>
  </CarouselContent>
  <CarouselPrevious />
  <CarouselNext />
</Carousel>

import Autoplay from "embla-carousel-autoplay";

<Carousel plugins={[Autoplay({delay: 3000})]}>
  <CarouselContent>...</CarouselContent>
</Carousel>

Param

Embla options forwarded to the carousel instance. Common options include loop for infinite scrolling, align for slide alignment, slidesToScroll to control navigation increments, dragFree for momentum dragging, duration for transition timing, and startIndex for the initial slide.

Param

Embla plugins applied to the carousel instance.

Param

Optional callback for advanced Embla API access after initialization, useful for custom controls, analytics, or external state synchronization.

See

Embla React Docs