fix: disable scroll on carousel swipe

Author: Robert-brainhub

src/components/Carousel.js

@@ -82,8 +82,8 @@ export default class Carousel extends Component {
     if (this.node) {
       this.node.ownerDocument.addEventListener('mousemove', this.onMouseMove, true);
       this.node.ownerDocument.addEventListener('mouseup', this.onMouseUpTouchEnd, true);
-      this.node.ownerDocument.addEventListener('touchstart', this.onTouchStart, { passive: false });
-      this.node.ownerDocument.addEventListener('touchmove', this.onTouchMove, true);
+      this.node.ownerDocument.addEventListener('touchstart', this.onTouchStart, true);
+      this.node.ownerDocument.addEventListener('touchmove', this.onTouchMove, { passive: false });
       this.node.ownerDocument.addEventListener('touchend', this.onMouseUpTouchEnd, true);
     }
 
@@ -313,10 +313,6 @@ export default class Carousel extends Component {
    * @param {number} index of the element drag started on
    */
   onTouchStart = (e, index) => {
-    if (this.state.dragStart) {
-      e.preventDefault();
-      e.stopPropagation();
-    }
     this.setState({
       clicked: index,
       dragStart: e.changedTouches[0].pageX,
@@ -328,6 +324,10 @@ export default class Carousel extends Component {
    * @param {event} e event
    */
   onTouchMove = e => {
+    if (Math.abs(this.state.dragOffset) > 10) {
+      e.preventDefault();
+      e.stopPropagation();
+    }
     if (this.state.dragStart !== null) {
       this.setState({
         dragOffset: e.changedTouches[0].pageX - this.state.dragStart,