react-image-gallery - npm Package Compare versions

Comparing version 0.8.2 to 0.8.3

build/image-gallery.js

@@ -151,2 +151,3 @@ 'use strict';
         window.removeEventListener('resize', this._debounceResize);
+        this._debounceResize.cancel();
       }
@@ -877,3 +878,5 @@
             onClick: _this7.props.onClick,
-            onTouchMove: _this7.props.onTouchMove
+            onTouchMove: _this7.props.onTouchMove,
+            onTouchEnd: _this7.props.onTouchEnd,
+            onTouchStart: _this7.props.onTouchStart
           },
@@ -904,3 +907,6 @@ showItem ? renderItem(item) : _react2.default.createElement('div', { style: { height: '100%' } })
               onClick: function onClick(event) {
-                return _this7.slideToIndex.call(_this7, index, event);
+                _this7.slideToIndex.call(_this7, index, event);
+                if (_this7.props.onThumbnailClick) {
+                  _this7.props.onThumbnailClick(event, index);
+                }
               }
@@ -975,3 +981,3 @@ },
           _react2.default.createElement(
-            'ul',
+            'div',
             {
@@ -1007,3 +1013,3 @@ className: 'image-gallery-bullets-container',
       return _react2.default.createElement(
-        'section',
+        'div',
         {
@@ -1044,3 +1050,2 @@ ref: function ref(i) {
                   style: thumbnailStyle,
-                  role: 'navigation',
                   'aria-label': 'Thumbnail Navigation'
@@ -1091,3 +1096,7 @@ },
   onImageError: _propTypes2.default.func,
+  onTouchMove: _propTypes2.default.func,
+  onTouchEnd: _propTypes2.default.func,
+  onTouchStart: _propTypes2.default.func,
   onThumbnailError: _propTypes2.default.func,
+  onThumbnailClick: _propTypes2.default.func,
   renderCustomControls: _propTypes2.default.func,
@@ -1094,0 +1103,0 @@ renderLeftNav: _propTypes2.default.func,

package.json

 {
   "name": "react-image-gallery",
-  "version": "0.8.2",
+  "version": "0.8.3",
   "description": "Responsive and flexible carousel component with thumbnail support",
@@ -5,0 +5,0 @@ "main": "./build/image-gallery",

README.md

@@ -123,6 +123,2 @@ React Image Gallery
   * handles both slide image, and thumbnail image
-* `onImageError`: Function, `callback(event)`
-  * overrides defaultImage
-* `onThumbnailError`: Function, `callback(event)`
-  * overrides defaultImage
 * `indexSeparator`: String, default `' / '`, ignored if `showIndex` is false
@@ -135,2 +131,7 @@ * `slideDuration`: Integer, default `450`
 * `startIndex`: Integer, default `0`
+* `onImageError`: Function, `callback(event)`
+  * overrides defaultImage
+* `onThumbnailError`: Function, `callback(event)`
+  * overrides defaultImage
+* `onThumbnailClick`: Function, `callback(event, index)`
 * `onImageLoad`: Function, `callback(event)`
@@ -143,2 +144,4 @@ * `onSlide`: Function, `callback(currentIndex)`
 * `onTouchMove`: Function, `callback(event)`
+* `onTouchEnd`: Function, `callback(event)`
+* `onTouchStart`: Function, `callback(event)`
 * `renderCustomControls`: Function, custom controls rendering
@@ -145,0 +148,0 @@ * Use this to render custom controls or other elements on the currently displayed image (like the fullscreen button)

src/ImageGallery.jsx

@@ -64,3 +64,7 @@ import React from 'react';
     onImageError: PropTypes.func,
+    onTouchMove: PropTypes.func,
+    onTouchEnd: PropTypes.func,
+    onTouchStart: PropTypes.func,
     onThumbnailError: PropTypes.func,
+    onThumbnailClick: PropTypes.func,
     renderCustomControls: PropTypes.func,
@@ -218,2 +222,3 @@ renderLeftNav: PropTypes.func,
       window.removeEventListener('resize', this._debounceResize);
+      this._debounceResize.cancel();
     }
@@ -888,2 +893,4 @@
           onTouchMove={this.props.onTouchMove}
+          onTouchEnd={this.props.onTouchEnd}
+          onTouchStart={this.props.onTouchStart}
         >
@@ -917,3 +924,8 @@ {showItem ? renderItem(item) : <div style={{ height: '100%' }}></div>}
             }
-            onClick={event => this.slideToIndex.call(this, index, event)}
+            onClick={event => {
+              this.slideToIndex.call(this, index, event);
+              if (this.props.onThumbnailClick) {
+                this.props.onThumbnailClick(event, index);
+              }
+            }}
           >
@@ -1000,3 +1012,3 @@ {renderThumbInner(item)}
             <div className='image-gallery-bullets'>
-              <ul
+              <div
                 className='image-gallery-bullets-container'
@@ -1007,3 +1019,3 @@ role='navigation'
                 {bullets}
-              </ul>
+              </div>
             </div>
@@ -1029,3 +1041,3 @@ }
     return (
-      <section
+      <div
         ref={i => this._imageGallery = i}
@@ -1059,3 +1071,2 @@ className={
                     style={thumbnailStyle}
-                    role='navigation'
                     aria-label='Thumbnail Navigation'
@@ -1075,3 +1086,3 @@ >
 
-      </section>
+      </div>
     );
@@ -1078,0 +1089,0 @@ }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

116661

increased by0.8%

Lines of code

2601

increased by0.77%

Number of lines in readme file

249

increased by1.22%

No dependency changes