Founding price: $35, then $79.99 after 23:59 UTC on 4 November, then $79.99
Get ProA carousel with no carousel library: a native scroll-snap row with buttons that scroll by a page and a position readout.
This item has no props to tune. Use the lens above to change theme, density, direction and more.
Use it when you want the smallest carousel: the browser does touch, trackpad and keyboard scrolling and you add buttons on top.
Do not use it when you need loops, effects, autoplay or momentum control. Those need Embla.
import { CarouselSnap } from "@/components/ui/carousel-snap"<CarouselSnap
label="Browse the shelf"
slideClassName="basis-[80%] sm:basis-[45%]"
items={items}
/>| Part | Prop | Type | Default | Description |
|---|---|---|---|---|
CarouselSnap | items | CarouselItem[] | required | { id, label, content }. |
CarouselSnap | label | string | required | Accessible name of the carousel. |
CarouselSnap | slideClassName | string | "basis-[80%] sm:basis-[45%]" | Slide width classes. |
The component ships with a Testing Library test (carousel-snap.test.tsx). Embla needs layout to count snaps, and jsdom has none, so the repo's mockCarouselLayout helper gives the viewport and slides real sizes in tests.