Carousel

Carousel component.

Use Carousel to cycle through a set of items.

import { Carousel, CarouselContent, CarouselItem, CarouselPrevious, CarouselNext } from '@tile-ui/react';

export default function CarouselDemo() {
	return (
		<Carousel>
			<CarouselContent>

Registry install

pnpm dlx shadcn@latest add @tile-ui/carousel

Package usage

import { Carousel, CarouselContent, CarouselItem, CarouselPrevious, CarouselNext } from '@tile-ui/react';
 
<Carousel>
	<CarouselContent>
		<CarouselItem>Slide one</CarouselItem>
		<CarouselItem>Slide two</CarouselItem>
	</CarouselContent>
	<CarouselPrevious />
	<CarouselNext />
</Carousel>

Highlights

  • Horizontal and vertical
  • Content, item, previous, and next

Registry dependencies

ItemPurpose
carouselComponent source and module styles
coreFramework-agnostic logic helpers
stylesShared SCSS tokens and globals

API reference

PropTypeDefault
orientation'horizontal' | 'vertical''horizontal'