react-responsive-carousel - npm Package Compare versions

Comparing version 3.0.17 to 3.0.18

lib/components/Carousel.js

@@ -23,2 +23,3 @@ 'use strict';
         showIndicators: React.PropTypes.bool,
+        infiniteLoop: React.PropTypes.bool,
         showThumbs: React.PropTypes.bool,
@@ -40,2 +41,3 @@ selectedItem: React.PropTypes.number,
             showThumbs: true,
+            infiniteLoop: false,
             selectedItem: 0,
@@ -61,5 +63,2 @@ axis: 'horizontal',
     },
-    componentWillUnmount: function componentWillUnmount() {
-        this.unbindEvents();
-    },
     componentDidMount: function componentDidMount(nextProps) {
@@ -78,2 +77,5 @@ this.bindEvents();
     },
+    componentWillUnmount: function componentWillUnmount() {
+        this.unbindEvents();
+    },
     bindEvents: function bindEvents() {
@@ -203,7 +205,12 @@ // as the widths are calculated, we need to resize
     moveTo: function moveTo(position) {
-        // position can't be lower than 0
-        position = position < 0 ? 0 : position;
-        // position can't be higher than last postion
-        position = position >= this.props.children.length - 1 ? this.props.children.length - 1 : position;
+        var lastPosition = this.props.children.length - 1;
 
+        if (position < 0) {
+            position = this.props.infiniteLoop ? lastPosition : 0;
+        }
+
+        if (position > lastPosition) {
+            position = this.props.infiniteLoop ? 0 : lastPosition;
+        }
+
         this.selectItem({
@@ -295,5 +302,5 @@ // if it's not a slider, we don't need to set position here
         // show left arrow?
-        var hasPrev = canShowArrows && this.state.selectedItem > 0;
+        var hasPrev = canShowArrows && this.state.selectedItem > 0 || this.props.infiniteLoop;
         // show right arrow
-        var hasNext = canShowArrows && this.state.selectedItem < itemsLength - 1;
+        var hasNext = canShowArrows && this.state.selectedItem < itemsLength - 1 || this.props.infiniteLoop;
         // obj to hold the transformations and styles
@@ -300,0 +307,0 @@ var itemListStyles = {};

package.json

 {
   "name": "react-responsive-carousel",
-  "version": "3.0.17",
+  "version": "3.0.18",
   "description": "React Responsive Carousel",
@@ -5,0 +5,0 @@ "author": {

README.md

@@ -6,3 +6,3 @@ # React Responsive Carousel
 
-#### Demo
+### Demo
 <http://leandrowd.github.io/react-responsive-carousel/>
@@ -13,6 +13,6 @@
 
-#### Installing as a package
+### Installing as a package
 `npm install react-responsive-carousel --save`
 
-#### Usage
+### Usage
 
@@ -56,2 +56,3 @@ ```javascript
 | 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 |
@@ -66,22 +67,43 @@ | axis       | `string`  | `horizontal` | changes orientation - accepts `horizontal` and `vertical` |
 
-#### Contributing
-Please, feel free to contribute. You may file an issue or submit a pull request!
+=======================
 
-##### Setting up development environment
+### Contributing
+Feel free to submit a PR or raise issues. When submitting a PR, please:
+- add the required tests and an example of usage to `stories/index.js`
+- don't submit changes to the `/lib` folder as it will be generated again after the merge.
+- ensure you have the editorConfig plugin or the same code style settings as defined in `.editorConfig` to avoid excess of spaces in diffs
+
+=======================
+
+### Setting up development environment
 - `git clone [e-mail]:leandrowd/react-responsive-carousel.git`
 - `npm install`
 - `npm start`
-- Open your favourite browser on `localhost:8000` - livereload will be enabled
+- Open your favourite browser on `localhost:8000` - livereload will be enabled and tests will run on each change
 
-##### Running tests
+> 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`
 
-##### Publishing to npm
+#### Running storybook
+- `npm run storybook`
+
+=======================
+
+### Only after merged back to master
+
+#### Publish to npm
 - `npm run publish-to-npm`
 
-##### Pubishing to gh-pages
+#### Pubish to gh-pages
 - `npm run publish-to-gh-pages`
 
+=======================
+
 ### Examples
 #### webpack + es6 setup
 <https://github.com/leandrowd/demo-react-responsive-carousel-es6>
+
+#### Storybook
+<http://react-responsive-carousel.js.org/storybook/>

No alert changes

Improved metrics

Total package byte prevSize

903340

increased by0.09%

Lines of code

1226

increased by0.41%

Number of lines in readme file

106

increased by26.19%

No dependency changes