Allow track press to change slider position

Author: mendyEdri

src/components/slider/index.js

@@ -1,7 +1,13 @@
 import _ from 'lodash';
 import PropTypes from 'prop-types';
 import React from 'react';
-import {StyleSheet, PanResponder, ViewPropTypes, AccessibilityInfo, Animated} from 'react-native';
+import {
+  StyleSheet,
+  PanResponder,
+  ViewPropTypes,
+  AccessibilityInfo,
+  Animated
+} from 'react-native';
 import {Constants} from '../../helpers';
 import {PureBaseComponent} from '../../commons';
 import {Colors} from '../../style';
@@ -339,6 +345,17 @@ export default class Slider extends PureBaseComponent {
     return scaleRatioFromSize || defaultScaleFactor;
   };
 
+  updateTrackStepAndStyle = ({nativeEvent}) => {
+    this._x = nativeEvent.locationX;
+    this.updateValue(nativeEvent.locationX);
+  
+    if (this.props.step > 0) {
+      this.bounceToStep();
+    } else {
+      this.updateStyles(nativeEvent.locationX);
+    }
+  }
+
   /* Events */
 
   onValueChange = value => {
@@ -365,6 +382,15 @@ export default class Slider extends PureBaseComponent {
     this.handleMeasure('thumbSize', nativeEvent);
   };
 
+  handleTrackPress = ({nativeEvent}) => {
+    if (this.props.disabled) {
+      return;
+    }
+    
+    this.updateTrackStepAndStyle({nativeEvent});
+    this.onSeekEnd();
+  };
+
   handleMeasure = (name, nativeEvent) => {
     const {width, height} = nativeEvent.layout;
     const size = {width, height};
@@ -498,8 +524,9 @@ export default class Slider extends PureBaseComponent {
             />
           </View>
         )}
+        
+        <View style={styles.touchArea} onTouchEnd={this.handleTrackPress}/>
         {this.renderThumb()}
-        {/* <View style={styles.touchArea}/> */}
       </View>
     );
   }