react-responsive-carousel - npm Package Compare versions

Comparing version 3.0.13 to 3.0.14

lib/components/Carousel.js

@@ -0,1 +1,3 @@
+'use strict';
+
 var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
@@ -29,3 +31,3 @@
 
-    getDefaultProps() {
+    getDefaultProps: function getDefaultProps() {
         return {
@@ -40,4 +42,3 @@ showIndicators: true,
     },
-
-    getInitialState() {
+    getInitialState: function getInitialState() {
         return {
@@ -49,4 +50,3 @@ // index of the image to be shown.
     },
-
-    componentWillReceiveProps(props, state) {
+    componentWillReceiveProps: function componentWillReceiveProps(props, state) {
         if (props.selectedItem !== this.state.selectedItem) {
@@ -59,4 +59,3 @@ this.updateSizes();
     },
-
-    componentWillMount() {
+    componentWillMount: function componentWillMount() {
         // as the widths are calculated, we need to resize
@@ -68,4 +67,3 @@ // the carousel when the window is resized
     },
-
-    componentWillUnmount() {
+    componentWillUnmount: function componentWillUnmount() {
         // removing listeners
@@ -75,4 +73,3 @@ window.removeEventListener("resize", this.updateSizes);
     },
-
-    componentDidMount(nextProps) {
+    componentDidMount: function componentDidMount(nextProps) {
         // when the component is rendered we need to calculate
@@ -87,4 +84,3 @@ // the container size to adjust the responsive behaviour
     },
-
-    updateSizes() {
+    updateSizes: function updateSizes() {
         var firstItem = ReactDOM.findDOMNode(this.item0);
@@ -94,4 +90,3 @@ this.itemSize = this.isHorizontal ? firstItem.clientWidth : firstItem.clientHeight;
     },
-
-    setMountState() {
+    setMountState: function setMountState() {
         this.setState({ hasMount: true });
@@ -101,4 +96,3 @@ this.updateSizes();
     },
-
-    handleClickItem(index, item) {
+    handleClickItem: function handleClickItem(index, item) {
         var handler = this.props.onClickItem;
@@ -116,4 +110,3 @@
     },
-
-    handleOnChange(index, item) {
+    handleOnChange: function handleOnChange(index, item) {
         var handler = this.props.onChange;
@@ -125,4 +118,3 @@
     },
-
-    handleClickThumb(index, item) {
+    handleClickThumb: function handleClickThumb(index, item) {
         var handler = this.props.onClickThumb;
@@ -138,4 +130,3 @@
     },
-
-    onSwipeStart() {
+    onSwipeStart: function onSwipeStart() {
         this.setState({
@@ -145,4 +136,3 @@ swiping: true
     },
-
-    onSwipeEnd() {
+    onSwipeEnd: function onSwipeEnd() {
         this.setState({
@@ -152,4 +142,5 @@ swiping: false
     },
+    onSwipeMove: function onSwipeMove(delta) {
+        var _this = this;
 
-    onSwipeMove(delta) {
         var list = ReactDOM.findDOMNode(this.itemList);
@@ -177,16 +168,13 @@ var isHorizontal = this.props.axis === 'horizontal';
 
-        ['WebkitTransform', 'MozTransform', 'MsTransform', 'OTransform', 'transform', 'msTransform'].forEach(prop => {
-            list.style[prop] = CSSTranslate(position, this.props.axis);
+        ['WebkitTransform', 'MozTransform', 'MsTransform', 'OTransform', 'transform', 'msTransform'].forEach(function (prop) {
+            list.style[prop] = CSSTranslate(position, _this.props.axis);
         });
     },
-
-    decrement(positions) {
+    decrement: function decrement(positions) {
         this.moveTo(this.state.selectedItem - (typeof positions === 'Number' ? positions : 1));
     },
-
-    increment(positions) {
+    increment: function increment(positions) {
         this.moveTo(this.state.selectedItem + (typeof positions === 'Number' ? positions : 1));
     },
-
-    moveTo(position) {
+    moveTo: function moveTo(position) {
         // position can't be lower than 0
@@ -202,4 +190,3 @@ position = position < 0 ? 0 : position;
     },
-
-    changeItem(e) {
+    changeItem: function changeItem(e) {
         var newIndex = e.target.value;
@@ -211,17 +198,19 @@
     },
-
-    selectItem(state) {
+    selectItem: function selectItem(state) {
         this.setState(state);
         this.handleOnChange(state.selectedItem, this.props.children[state.selectedItem]);
     },
+    renderItems: function renderItems() {
+        var _this2 = this;
 
-    renderItems() {
-        return React.Children.map(this.props.children, (item, index) => {
-            var hasMount = this.state.hasMount;
-            var itemClass = klass.ITEM(true, index === this.state.selectedItem);
+        return React.Children.map(this.props.children, function (item, index) {
+            var hasMount = _this2.state.hasMount;
+            var itemClass = klass.ITEM(true, index === _this2.state.selectedItem);
 
             return React.createElement(
                 'li',
-                { ref: node => this["item" + index] = node, key: "itemKey" + index, className: itemClass,
-                    onClick: this.handleClickItem.bind(this, index, item) },
+                { ref: function ref(node) {
+                        return _this2["item" + index] = node;
+                    }, key: "itemKey" + index, className: itemClass,
+                    onClick: _this2.handleClickItem.bind(_this2, index, item) },
                 item
@@ -231,4 +220,5 @@ );
     },
+    renderControls: function renderControls() {
+        var _this3 = this;
 
-    renderControls() {
         if (!this.props.showIndicators) {
@@ -241,9 +231,8 @@ return null;
             { className: 'control-dots' },
-            React.Children.map(this.props.children, (item, index) => {
-                return React.createElement('li', { className: klass.DOT(index === this.state.selectedItem), onClick: this.changeItem, value: index, key: index });
+            React.Children.map(this.props.children, function (item, index) {
+                return React.createElement('li', { className: klass.DOT(index === _this3.state.selectedItem), onClick: _this3.changeItem, value: index, key: index });
             })
         );
     },
-
-    renderStatus() {
+    renderStatus: function renderStatus() {
         if (!this.props.showStatus) {
@@ -261,4 +250,3 @@ return null;
     },
-
-    renderThumbs() {
+    renderThumbs: function renderThumbs() {
         if (!this.props.showThumbs) {
@@ -274,4 +262,5 @@ return null;
     },
+    render: function render() {
+        var _this4 = this;
 
-    render() {
         var itemsLength = this.props.children.length;
@@ -313,3 +302,5 @@
             style: itemListStyles,
-            ref: node => this.itemList = node
+            ref: function ref(node) {
+                return _this4.itemList = node;
+            }
         };
@@ -343,3 +334,5 @@
                     'div',
-                    { className: klass.WRAPPER(true, this.props.axis), style: containerStyles, ref: node => this.itemsWrapper = node },
+                    { className: klass.WRAPPER(true, this.props.axis), style: containerStyles, ref: function ref(node) {
+                            return _this4.itemsWrapper = node;
+                        } },
                     React.createElement(
@@ -346,0 +339,0 @@ Swipe,

lib/components/Thumbs.js

@@ -0,1 +1,3 @@
+'use strict';
+
 var React = require('react');
@@ -21,3 +23,3 @@ var ReactDOM = require('react-dom');
 
-    getDefaultProps() {
+    getDefaultProps: function getDefaultProps() {
         return {
@@ -28,4 +30,3 @@ selectedItem: 0,
     },
-
-    getInitialState() {
+    getInitialState: function getInitialState() {
         return {
@@ -37,4 +38,3 @@ selectedItem: this.props.selectedItem,
     },
-
-    componentWillReceiveProps(props, state) {
+    componentWillReceiveProps: function componentWillReceiveProps(props, state) {
         if (props.selectedItem !== this.state.selectedItem) {
@@ -47,4 +47,3 @@ this.setState({
     },
-
-    componentWillMount() {
+    componentWillMount: function componentWillMount() {
         // as the widths are calculated, we need to resize
@@ -56,4 +55,3 @@ // the carousel when the window is resized
     },
-
-    componentWillUnmount() {
+    componentWillUnmount: function componentWillUnmount() {
         // removing listeners
@@ -63,4 +61,3 @@ window.removeEventListener("resize", this.updateStatics);
     },
-
-    componentDidMount(nextProps) {
+    componentDidMount: function componentDidMount(nextProps) {
         // when the component is rendered we need to calculate
@@ -73,4 +70,3 @@ // the container size to adjust the responsive behaviour
     },
-
-    updateStatics() {
+    updateStatics: function updateStatics() {
         var total = this.props.children.length;
@@ -83,8 +79,6 @@ this.wrapperSize = this.itemsWrapper.clientWidth;
     },
-
-    setMountState() {
+    setMountState: function setMountState() {
         this.setState({ hasMount: true });
     },
-
-    handleClickItem(index, item) {
+    handleClickItem: function handleClickItem(index, item) {
         var handler = this.props.onSelectItem;
@@ -96,4 +90,3 @@
     },
-
-    onSwipeStart() {
+    onSwipeStart: function onSwipeStart() {
         this.setState({
@@ -103,4 +96,3 @@ swiping: true
     },
-
-    onSwipeEnd() {
+    onSwipeEnd: function onSwipeEnd() {
         this.setState({
@@ -110,4 +102,5 @@ swiping: false
     },
+    onSwipeMove: function onSwipeMove(deltaX) {
+        var _this = this;
 
-    onSwipeMove(deltaX) {
         var leftBoundry = 0;
@@ -134,16 +127,13 @@ var list = ReactDOM.findDOMNode(this.itemList);
         // if 3d isn't available we will use left to move
-        ['WebkitTransform', 'MozTransform', 'MsTransform', 'OTransform', 'transform', 'msTransform'].forEach(prop => {
-            list.style[prop] = CSSTranslate(position, this.props.axis);
+        ['WebkitTransform', 'MozTransform', 'MsTransform', 'OTransform', 'transform', 'msTransform'].forEach(function (prop) {
+            list.style[prop] = CSSTranslate(position, _this.props.axis);
         });
     },
-
-    slideRight(positions) {
+    slideRight: function slideRight(positions) {
         this.moveTo(this.state.firstItem - (typeof positions === 'Number' ? positions : 1));
     },
-
-    slideLeft(positions) {
+    slideLeft: function slideLeft(positions) {
         this.moveTo(this.state.firstItem + (typeof positions === 'Number' ? positions : 1));
     },
-
-    moveTo(position) {
+    moveTo: function moveTo(position) {
         // position can't be lower than 0
@@ -160,4 +150,3 @@ position = position < 0 ? 0 : position;
     },
-
-    getFirstItem(selectedItem) {
+    getFirstItem: function getFirstItem(selectedItem) {
         if (!this.showArrows) {
@@ -183,6 +172,7 @@ return 0;
     },
+    renderItems: function renderItems() {
+        var _this2 = this;
 
-    renderItems() {
-        return React.Children.map(this.props.children, (item, index) => {
-            var itemClass = klass.ITEM(false, index === this.state.selectedItem && this.state.hasMount);
+        return React.Children.map(this.props.children, function (item, index) {
+            var itemClass = klass.ITEM(false, index === _this2.state.selectedItem && _this2.state.hasMount);
 
@@ -192,3 +182,5 @@ var img = item;
             if (item.type !== "img") {
-                img = item.props.children.filter(children => children.type === "img")[0];
+                img = item.props.children.filter(function (children) {
+                    return children.type === "img";
+                })[0];
             }
@@ -202,4 +194,6 @@
                 'li',
-                { key: index, ref: node => this["thumb" + index] = node, className: itemClass,
-                    onClick: this.handleClickItem.bind(this, index, item) },
+                { key: index, ref: function ref(node) {
+                        return _this2["thumb" + index] = node;
+                    }, className: itemClass,
+                    onClick: _this2.handleClickItem.bind(_this2, index, item) },
                 img
@@ -209,4 +203,5 @@ );
     },
+    render: function render() {
+        var _this3 = this;
 
-    render() {
         if (this.props.children.length === 0) {
@@ -241,3 +236,5 @@ return null;
                 'div',
-                { className: klass.WRAPPER(false), ref: node => this.itemsWrapper = node },
+                { className: klass.WRAPPER(false), ref: function ref(node) {
+                        return _this3.itemsWrapper = node;
+                    } },
                 React.createElement('button', { type: 'button', className: klass.ARROW_PREV(!hasPrev), onClick: this.slideRight }),
@@ -255,3 +252,5 @@ React.createElement(
                         style: itemListStyles,
-                        ref: node => this.itemList = node },
+                        ref: function ref(node) {
+                            return _this3.itemList = node;
+                        } },
                     this.renderItems()
@@ -258,0 +257,0 @@ ),

lib/cssClasses.js

@@ -0,5 +1,7 @@
+"use strict";
+
 var classNames = require('classnames');
 
 module.exports = {
-	CAROUSEL(isSlider) {
+	CAROUSEL: function CAROUSEL(isSlider) {
 		return classNames({
@@ -10,4 +12,3 @@ "carousel": true,
 	},
-
-	WRAPPER(isSlider, axis) {
+	WRAPPER: function WRAPPER(isSlider, axis) {
 		return classNames({
@@ -20,4 +21,3 @@ "thumbs-wrapper": !isSlider,
 	},
-
-	SLIDER(isSlider, isSwiping) {
+	SLIDER: function SLIDER(isSlider, isSwiping) {
 		return classNames({
@@ -29,4 +29,3 @@ "thumbs": !isSlider,
 	},
-
-	ITEM(isSlider, selected) {
+	ITEM: function ITEM(isSlider, selected) {
 		return classNames({
@@ -38,4 +37,3 @@ "thumb": !isSlider,
 	},
-
-	ARROW_PREV(disabled) {
+	ARROW_PREV: function ARROW_PREV(disabled) {
 		return classNames({
@@ -46,4 +44,3 @@ "control-arrow control-prev": true,
 	},
-
-	ARROW_NEXT(disabled) {
+	ARROW_NEXT: function ARROW_NEXT(disabled) {
 		return classNames({
@@ -54,4 +51,3 @@ "control-arrow control-next": true,
 	},
-
-	DOT(selected) {
+	DOT: function DOT(selected) {
 		return classNames({
@@ -58,0 +54,0 @@ "dot": true,

lib/CSSTranslate.js

@@ -0,1 +1,3 @@
+'use strict';
+
 var has3d = require('./has3d');
@@ -2,0 +4,0 @@

lib/dimensions.js

@@ -0,3 +1,5 @@
+"use strict";
+
 module.exports = {
-	outerWidth: el => {
+	outerWidth: function outerWidth(el) {
 		var width = el.offsetWidth;
@@ -4,0 +6,0 @@ var style = getComputedStyle(el);

lib/has3d.js

@@ -0,1 +1,3 @@
+'use strict';
+
 module.exports = function has3d() {
@@ -2,0 +4,0 @@ if (typeof window === 'undefined' || !window.getComputedStyle) {

lib/index.js

@@ -0,1 +1,3 @@
+'use strict';
+
 module.exports = {
@@ -2,0 +4,0 @@ Carousel: require('./components/Carousel'),

lib/object-assign.js

@@ -0,1 +1,3 @@
+'use strict';
+
 module.exports = function (target) {
@@ -2,0 +4,0 @@ if (target === undefined || target === null) {

package.json

 {
   "name": "react-responsive-carousel",
-  "version": "3.0.13",
+  "version": "3.0.14",
   "description": "React Responsive Carousel",
@@ -48,2 +48,3 @@ "author": {
     "babel-jest": "^14.1.0",
+    "babel-preset-es2015": "^6.14.0",
     "babel-preset-react": "^6.11.1",
@@ -56,13 +57,11 @@ "browserify": "^12.0.1",
     "gulp-concat": "^2.3.4",
-    "gulp-connect": "~2.2.0",
+    "gulp-connect": "^5.0.0",
     "gulp-copy": "0.0.2",
-    "gulp-cssmin": "^0.1.6",
-    "gulp-if": "^1.2.4",
-    "gulp-livereload": "^2.1.1",
-    "gulp-notify": "^1.4.2",
+    "gulp-if": "^2.0.1",
+    "gulp-notify": "^2.2.0",
     "gulp-rename": "^1.2.0",
     "gulp-sass": "^2.2.0",
     "gulp-shell": "^0.2.10",
-    "gulp-streamify": "0.0.5",
-    "gulp-uglify": "^0.3.1",
+    "gulp-streamify": "1.0.2",
+    "gulp-uglify": "^2.0.0",
     "gulp-util": "^3.0.0",
@@ -69,0 +68,0 @@ "jest-cli": "^14.1.0",

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

49452

increased by4.49%

Dev dependency count

28

decreased by-3.45%

Number of package files

19

increased by5.56%

Lines of code

1031

increased by2.89%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes