React Round Carousel

Install

npm install react-round-carousel

# or

yarn add react-round-carousel
			

Use the module

import * as React from 'react';
import { createRoot } from 'react-dom/client';

import { Carousel, CarouselItem, CarouselRef } from 'react-round-carousel';

// Create an array of Carousel Items
const items: CarouselItem[] = Array(20)
  .fill('')
  .map((_: string, index: number) => ({
    alt: 'A random photo',
    image: `https://picsum.photos/${210 + index}`,
    content: (
      <div>
        <strong>Round Carousel</strong>
        <span>Slide number {index + 1}</span>
      </div>
    )
  }));

const App = () => {
	const carouselRef = React.createRef();

	return (
		<Carousel
			ref={carouselRef}
			items={items}
			slideOnClick
		/>;
	)
}

createRoot(document.getElementById('root')!).render(<App />);