Simple Image Carousel Library

[![NPM version]](https://www.npmjs.com/package/image-show-react)

A simple and customizable image carousel component library for React.

Features

- Easy to use and integrate.
- Fully customizable.
- Supports automatic slide transitions.

Installation

You can install the package using npm or yarn:

``bash
npm install react-image-carousel

or

yarn add react-image-carousel

`

Usage

Here's a basic example of how to use the ImageCarousel component in your React project:

$3

`bash

import React from 'react';
import ImageCarousel from 'react-image-carousel';
import 'react-image-carousel/dist/index.css';

`

$3

`bash

const images = [
'https://via.placeholder.com/800x300',
'https://via.placeholder.com/800x300',
'https://via.placeholder.com/800x300',
];

const App = () => {
return (


`

Props

| Name | Type | Default | Description |
| :---------------------- | :------------------------------------------------------------------------------------------------------------------------------------------------: | :-------------------------------: | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| images | Array | [] | Array of images |
| itemWidth | number | '' | Image Width |
| itemHeight | number | false | Image Height |
| animation | string | default | Image Slide Animation |
| autoPlay | boolean | false | Auto playing of Images |
| loop | boolean | true | Loop over the Images |
| dotStyle | style | {} | Nav Dot Style |
| navDotsContainerStyle | style | {} | Nav Dot Container Style |
| imageContainerStyle | string | {} | Image Container Style Prop |
| imagePropsStyle | style | {} | Each image Style Prop |
| buttonContainerStyle | style | {} | Previous & Next Button Container Style Prop |
| leftButtonStyle | style | {} | Previous Button Style Prop |
| rightButtonStyle | style | {} | Next Button Style Prop |
| onImageLoad | function | null | A Callback called after Image Load |
| onLeftBtnPress | function | null | A Callback on Left Button Press |
| onRightBtnPress | function | null | A Callback on Right Button Press. |
| autoPlayDuration | number | 5000 | Auto Play animation Duration in ms |
| fadeInEffectDuration | number | 3000 | Fade In Animation Duration in ms |
| activeNavDotWidth | number | 10 | Active Nav Dot Width |
| nonActiveNavDotWidth | number | 5 | Non Active Nav Dot Width |
| activeNavDotColor | string | #ffff | Active Nav Dot Color |
| nonActiveNavDotColor | string | grey | Non Active Nav Dot Color |
| imageCarouselContainerStyle | style | {} | Image Carousel Container Style
| showVerticalScrollBar | boolean | true` | Show Scroll Bar