Adds min prop to set opacity

README.md

@@ -81,6 +81,11 @@ export default App;
 
 Offset in px swiped to consider as swipe
 
+#### min
+`Number`
+
+Offset when opacity fade should start
+
 #### onBeforeSwipe
 `Function`
 

src/Swipeable.js

@@ -20,6 +20,7 @@ const SWIPE_CONFIG = {
 
 const DEFAULT_PROPS = {
   limit: 120,
+  min: 40,
 };
 
 const INITIAL_STATE = {
@@ -130,15 +131,15 @@ export default class Swipeable extends PureComponent {
 
   render() {
     const {offset, swiped, pristine, forced} = this.state;
-    const {children, limit, buttons} = this.props;
+    const {children, limit, buttons, min} = this.props;
 
     return (
       <Fragment>
         <Spring
           from={{offset: 0, opacity: 1}}
           to={{
             offset,
-            opacity: getOpacity(offset, limit),
+            opacity: getOpacity(offset, limit, min),
           }}
           onRest={() => swiped && this.onAfterSwipe()}
           immediate={pristine || (!forced && Math.abs(offset) >= limit)}

src/helpers.js

@@ -1,7 +1,11 @@
 export const getDirection = offset => (offset > 0 ? "right" : "left");
-export const getOpacity = (offset, limit) => 1 - Math.abs(offset) / limit;
 export const getOffset = (start, end) => -((start - end) * 0.75);
 export const getEvent = e => (e.touches ? e.touches[0] : e);
 export const withX = fn => e => fn(getEvent(e).pageX);
 export const getLimitOffset = (limit, direction) =>
   direction === "right" ? limit : -limit;
+export const getOpacity = (offset, limit, min) =>
+  1 -
+  (Math.abs(offset) < min
+    ? 0
+    : (Math.abs(offset) - min) / Math.abs(limit - min));