react-image-gallery - npm Package Compare versions

Comparing version 0.7.1 to 0.7.2

build/image-gallery.js

@@ -761,3 +761,3 @@ 'use strict';
         if (_this7.props.showBullets) {
-          bullets.push(_react2.default.createElement('li', {
+          bullets.push(_react2.default.createElement('button', {
             key: index,
@@ -787,4 +787,3 @@ className: 'image-gallery-bullet ' + (currentIndex === index ? 'active' : ''),
             'div',
-            {
-              className: 'image-gallery-slide-wrapper' },
+            { className: 'image-gallery-slide-wrapper' },
             this.props.showFullscreenButton && _react2.default.createElement('a', {
@@ -802,3 +801,3 @@ className: 'image-gallery-fullscreen-button' + (isFullscreen ? ' active' : ''),
               { key: 'navigation' },
-              _react2.default.createElement('a', {
+              _react2.default.createElement('button', {
                 className: 'image-gallery-left-nav',
@@ -808,3 +807,3 @@ disabled: !this._canSlideLeft(),
                 onClick: slideLeft }),
-              _react2.default.createElement('a', {
+              _react2.default.createElement('button', {
                 className: 'image-gallery-right-nav',
@@ -814,3 +813,7 @@ disabled: !this._canSlideRight(),
                 onClick: slideRight })
-            ), _react2.default.createElement(
+            ), this.props.disableSwipe ? _react2.default.createElement(
+              'div',
+              { className: 'image-gallery-slides', key: 'slides' },
+              slides
+            ) : _react2.default.createElement(
               _reactSwipeable2.default,
@@ -910,2 +913,3 @@ {
   disableArrowKeys: _react2.default.PropTypes.bool,
+  disableSwipe: _react2.default.PropTypes.bool,
   defaultImage: _react2.default.PropTypes.string,
@@ -916,2 +920,3 @@ indexSeparator: _react2.default.PropTypes.string,
   onSlide: _react2.default.PropTypes.func,
+  onScreenChange: _react2.default.PropTypes.func,
   onPause: _react2.default.PropTypes.func,
@@ -940,2 +945,3 @@ onPlay: _react2.default.PropTypes.func,
   disableArrowKeys: false,
+  disableSwipe: false,
   indexSeparator: ' / ',
@@ -942,0 +948,0 @@ startIndex: 0,

package.json

 {
   "name": "react-image-gallery",
-  "version": "0.7.1",
+  "version": "0.7.2",
   "description": "React Carousel, React Image gallery, React Slide Show component",
@@ -5,0 +5,0 @@ "main": "./build/image-gallery",

README.md

@@ -105,2 +105,3 @@ React Image Gallery
 * `disableArrowKeys`: Boolean, default `false`
+* `disableSwipe`: Boolean, default `false`
 * `defaultImage`: String, default `undefined`
@@ -107,0 +108,0 @@ * an image src pointing to your default image if an image fails to load

src/ImageGallery.jsx

@@ -691,3 +691,3 @@ import React from 'react';
         bullets.push(
-          <li
+          <button
             key={index}
@@ -700,3 +700,3 @@ className={
             onClick={event => this.slideToIndex.call(this, index, event)}>
-          </li>
+          </button>
         );
@@ -713,4 +713,3 @@ }
         <div className={`image-gallery-content${isFullscreen ? ' fullscreen' : ''}`}>
-          <div
-            className='image-gallery-slide-wrapper'>
+          <div className='image-gallery-slide-wrapper'>
 
@@ -739,3 +738,3 @@ {
                     <span key='navigation'>
-                      <a
+                      <button
                         className='image-gallery-left-nav'
@@ -746,3 +745,3 @@ disabled={!this._canSlideLeft()}
 
-                      <a
+                      <button
                         className='image-gallery-right-nav'
@@ -754,15 +753,20 @@ disabled={!this._canSlideRight()}
 
-                    <Swipeable
-                      className='image-gallery-swipe'
-                      key='swipeable'
-                      delta={1}
-                      onSwipingLeft={this._handleSwiping.bind(this, -1)}
-                      onSwipingRight={this._handleSwiping.bind(this, 1)}
-                      onSwiped={this._handleOnSwiped.bind(this)}
-                      onSwipedLeft={this._handleOnSwipedTo.bind(this, 1)}
-                      onSwipedRight={this._handleOnSwipedTo.bind(this, -1)}
-                    >
-                      <div className='image-gallery-slides'>
+                    this.props.disableSwipe ?
+                      <div className='image-gallery-slides' key='slides'>
                         {slides}
                       </div>
+                    :
+                      <Swipeable
+                        className='image-gallery-swipe'
+                        key='swipeable'
+                        delta={1}
+                        onSwipingLeft={this._handleSwiping.bind(this, -1)}
+                        onSwipingRight={this._handleSwiping.bind(this, 1)}
+                        onSwiped={this._handleOnSwiped.bind(this)}
+                        onSwipedLeft={this._handleOnSwipedTo.bind(this, 1)}
+                        onSwipedRight={this._handleOnSwipedTo.bind(this, -1)}
+                      >
+                        <div className='image-gallery-slides'>
+                          {slides}
+                        </div>
                     </Swipeable>
@@ -836,2 +840,3 @@ ]
   disableArrowKeys: React.PropTypes.bool,
+  disableSwipe: React.PropTypes.bool,
   defaultImage: React.PropTypes.string,
@@ -842,2 +847,3 @@ indexSeparator: React.PropTypes.string,
   onSlide: React.PropTypes.func,
+  onScreenChange: React.PropTypes.func,
   onPause: React.PropTypes.func,
@@ -866,2 +872,3 @@ onPlay: React.PropTypes.func,
   disableArrowKeys: false,
+  disableSwipe: false,
   indexSeparator: ' / ',
@@ -868,0 +875,0 @@ startIndex: 0,

No alert changes

Improved metrics

Total package byte prevSize

301227

increased by0.4%

Lines of code

2805

increased by0.68%

Number of lines in readme file

178

increased by0.56%

No dependency changes