Expose more props for added flexability (#157)

* accept onScroll prop

* snap

* added scrollEnabled update prop

* fix paging

* fix propTypes

Author: ZachMayry

src/SortableList.js

@@ -27,8 +27,12 @@ export default class SortableList extends Component {
     showsHorizontalScrollIndicator: PropTypes.bool,
     refreshControl: PropTypes.element,
     autoscrollAreaSize: PropTypes.number,
+    snapToAlignment: PropTypes.string,
     rowActivationTime: PropTypes.number,
     manuallyActivateRows: PropTypes.bool,
+    scrollEventThrottle: PropTypes.number,
+    decelerationRate: PropTypes.oneOf([PropTypes.string, PropTypes.number]),
+    pagingEnabled: PropTypes.bool,
     nestedScrollEnabled: PropTypes.bool,
     disableIntervalMomentum: PropTypes.bool,
 
@@ -39,15 +43,21 @@ export default class SortableList extends Component {
     onChangeOrder: PropTypes.func,
     onActivateRow: PropTypes.func,
     onReleaseRow: PropTypes.func,
+    onScroll: PropTypes.func,
   };
 
   static defaultProps = {
     sortingEnabled: true,
     scrollEnabled: true,
     autoscrollAreaSize: 60,
+    snapToAlignment: 'start',
     manuallyActivateRows: false,
     showsVerticalScrollIndicator: true,
-    showsHorizontalScrollIndicator: true
+    showsHorizontalScrollIndicator: true,
+    scrollEventThrottle: 2,
+    decelerationRate: 'normal',
+    pagingEnabled: false,
+    onScroll: () => {}
   }
 
   /**
@@ -134,12 +144,15 @@ export default class SortableList extends Component {
   }
 
   componentDidUpdate(prevProps, prevState) {
-    const {data} = this.state;
+    const {data, scrollEnabled} = this.state;
     const {data: prevData} = prevState;
 
     if (data && prevData && !shallowEqual(data, prevData)) {
       this._onUpdateLayouts();
     }
+    if (prevProps.scrollEnabled !== scrollEnabled) {
+      this.setState({scrollEnabled: prevProps.scrollEnabled})
+    }
   }
 
   scrollBy({dx = 0, dy = 0, animated = false}) {
@@ -194,7 +207,20 @@ export default class SortableList extends Component {
   }
 
   render() {
-    let {contentContainerStyle, innerContainerStyle, horizontal, style, showsVerticalScrollIndicator, showsHorizontalScrollIndicator, nestedScrollEnabled, disableIntervalMomentum} = this.props;
+    let {
+      contentContainerStyle, 
+      innerContainerStyle, 
+      horizontal, 
+      style, 
+      showsVerticalScrollIndicator, 
+      showsHorizontalScrollIndicator, 
+      snapToAlignment,
+      scrollEventThrottle,
+      decelerationRate,
+      pagingEnabled,
+      nestedScrollEnabled,
+      disableIntervalMomentum,
+    } = this.props;
     const {animated, contentHeight, contentWidth, scrollEnabled} = this.state;
     const containerStyle = StyleSheet.flatten([style, {opacity: Number(animated)}])
     innerContainerStyle = [
@@ -219,11 +245,15 @@ export default class SortableList extends Component {
           ref={this._onRefScrollView}
           horizontal={horizontal}
           contentContainerStyle={contentContainerStyle}
-          scrollEventThrottle={2}
+          scrollEventThrottle={scrollEventThrottle}
+          pagingEnabled={pagingEnabled}
+          decelerationRate={decelerationRate}
           scrollEnabled={scrollEnabled}
           showsHorizontalScrollIndicator={showsHorizontalScrollIndicator}
           showsVerticalScrollIndicator={showsVerticalScrollIndicator}
-          onScroll={this._onScroll}>
+          snapToAlignment={snapToAlignment}
+          onScroll={this._onScroll}
+        >
           {this._renderHeader()}
           <View style={innerContainerStyle}>
             {this._renderRows()}
@@ -625,8 +655,9 @@ export default class SortableList extends Component {
     }
   };
 
-  _onScroll = ({nativeEvent: {contentOffset}}) => {
-      this._contentOffset = contentOffset;
+  _onScroll = (e) => {
+      this._contentOffset = e.nativeEvent.contentOffset;
+      this.props.onScroll(e)
   };
 
   _onRefContainer = (component) => {