holo website

A dynamic component that presents a rotating display of content items within a confined space.

Carousel

bash npm install @holo/carousel

import {
  Card,
  CardContent,
  Carousel,
  CarouselContent,
  CarouselItem,
  CarouselNext,
  CarouselPrevious,
} from "@holo/core";

Use the orientation prop to define the carousel's orientation

Apply the basis utility class on the <CarouselItem /> to adjust the item size.

Apply the pl-[VALUE] utility on the <CarouselItem /> and a negative -ml-[VALUE] on the <CarouselContent /> to set the spacing between items.

Utilize a state and the setApi props to acquire an instance of the carousel API.

Slide 0 of 0

Integrate plugins into the carousel effortlessly by using the plugins prop.