# react-carousel-liron

> A react carousel

Latest version **1.0.25** (published 2019-06-25) · ISC license · 0 weekly downloads

## Install

```sh
npm install react-carousel-liron
pnpm add react-carousel-liron
yarn add react-carousel-liron
bun add react-carousel-liron
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.25 |
| Published | 2019-06-25 |
| First published | 2019-02-13 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 4 |
| Unpacked size | 147.9 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Liron Weiner |
| Maintainers | lironweiner |

## Links

- npm: https://www.npmjs.com/package/react-carousel-liron
- npm.io page: https://npm.io/package/react-carousel-liron

## Dependencies (4)

- [react](https://npm.io/package/react.md) ^16.8.1
- [react-dom](https://npm.io/package/react-dom.md) ^16.8.1
- [prop-types](https://npm.io/package/prop-types.md) ^15.7.1
- [react-transition-group](https://npm.io/package/react-transition-group.md) ^2.5.3

## Recent versions

- 1.0.25 (latest) — 2019-06-25
- 1.0.24 — 2019-06-25
- 1.0.23 — 2019-02-20
- 1.0.22 — 2019-02-14
- 1.0.21 — 2019-02-14
- 1.0.20 — 2019-02-14
- 1.0.19 — 2019-02-14
- 1.0.18 — 2019-02-14
- 1.0.17 — 2019-02-14
- 1.0.16 — 2019-02-13
- 1.0.15 — 2019-02-13
- 1.0.14 — 2019-02-13
- 1.0.13 — 2019-02-13
- 1.0.12 — 2019-02-13
- 1.0.11 — 2019-02-13
- … 10 more at https://npm.io/package/react-carousel-liron/versions

## README

# React Carousel Liron
A responsive carousel for react that is very easy to use.
Comes with a simple fading animation between slides.
You can also have auto cycling between slides by adding some props.

### Features
* Responsive
* Mobile friendly  
* Custom auto play interval
* Stop play when mouse inside carousel and continue auto play when mouse outside the carousel
* Infinite loop
* Supports images , text content or anything you want.
* Each direct child represents one slide.
* Supports previuos/next
* Custom active slide
    
### Installing as a package
`npm i react-carousel-liron --save`

### Usage
```javascript
import React, { Component } from 'react';
import ReactDOM from 'react-dom';   
import Carousel from 'react-carousel-liron';
class DemoCarousel extends Component {
  render() {        
    return (
      <div className="container">
        <Carousel>
            <div>
                <img src="assets/someimage1.jpg" />
                <h1>some text 1</h1>
                <p>some paragraph text 1</p>
            </div>
            <div>
                <img src="assets/someimage2.jpg" />
                <h1>some text 2</h1>
                <p>some paragraph text 2</p>
            </div>              
        </Carousel>
      </div>
    );
  }
}
ReactDOM.render(<DemoCarousel />, document.querySelector('.demo-carousel'));
```

# API
### Carousel
```javascript
import Carousel from 'react-carousel-liron'
```
Name |Type |Default |Description
---- | --- | ------ | ----------
timer | number | null | The amount of time to delay between automatically cycling an item. If *null*, carousel will not automatically cycle
selectedIndex | number | 0 | Controls the current visible slide

### Demo
https://codesandbox.io/s/1o5lmx9kjj

---
_Source: https://npm.io/package/react-carousel-liron · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._