Check it out these cool demos created using storybook. The source code for each example is available here

$3

$3

``javascript
var React = require('react');
var ReactDOM = require('react-dom');
var Carousel = require('react-responsive-carousel').Carousel;

var DemoCarousel = React.createClass({
render() {
return (



Legend 1

Legend 2

Legend 3

);
}
});
ReactDOM.render(, document.querySelector('.demo-carousel'));

// Don't forget to include the css in your page
//
`

| Attributes | Type | Default | Description |
| :--------- | :--: | :-----: | :----------- |
| showArrows | boolean | true | show prev and next arrows |
| showStatus | boolean | true | show index of the current item. i.e: (1/8) |
| showIndicators | boolean | true | show little dots at the bottom with links for changing the item |
| showThumbs | boolean | true | show thumbnails of the images |
| infiniteLoop | boolean | false | infinite loop sliding |
| selectedItem | number | 0 | selects an item though props / defines the initial selected item |
| axis | string | horizontal | changes orientation - accepts horizontal and vertical |
| onChange | function | - | Fired when changing positions |
| onClickItem | function | - | Fired when an item is clicked |
| onClickThumb | function | - | Fired when a thumb it clicked |
| width | string | - | Allows to set a fixed width |
| useKeyboardArrows | boolean | false | Adds support to next and prev through keyboard arrows |
| autoPlay | boolean | false | Auto play |
| stopOnHover | boolean | true | Stop auto play while mouse is over the carousel |
| interval | number | 5000 | Interval of auto play |
| transitionTime | number | 350 | Duration of slide transitions (in miliseconds) |
| useKeyboardArrows | boolean | false | Adds support to next and prev through keyboard arrows |
| swipeScrollTolerance | number | 5 | Allows scroll when the swipe movement occurs in a different direction than the carousel axis and within the tolerance - Increase for loose - Decrease for strict |
| dynamicHeight | boolean | false | Adjusts the carousel height if required. -- Do not work with vertical axis -- |
| emulateTouch | boolean | false | Allows mouse to simulate swipe |
| statusFormatter | func | (current, total) => ${current} of ${total} | Allows custom formatting of the status indicator |


=======================

$3

> The fastest dev environment is on node 6. If you have nvm installed, just run nvm use 6. Tests in travis will run on node 4 and 6

#### Running only tests
- npm test

#### Running storybook
- npm run storybook

=======================

$3

#### Publish to npm
- npm run publish-to-npm

#### Pubish to gh-pages
- npm run publish-to-gh-pages`

=======================

$3