diff --git a/README.md b/README.md
index 0d20ead..f592b86 100644
--- a/README.md
+++ b/README.md
@@ -13,10 +13,10 @@
 
 ## Installation
 
-Install `rn-bottom-drawer`.
+Install `react-native-bottom-drawer-view`.
 
 ```
-npm install rn-bottom-drawer --save
+npm install react-native-bottom-drawer-view --save
 ```
 
 ## Usage Example
@@ -25,29 +25,29 @@ npm install rn-bottom-drawer --save
 ```javascript
 import React from 'react';
 import { View, Text } from 'react-native';
-import BottomDrawer from 'rn-bottom-drawer';
+import BottomDrawer from 'react-native-bottom-drawer-view';
 
 const TAB_BAR_HEIGHT = 49;
 
 export default class App extends React.Component {
-  renderContent = () => {
-    return (
-      <View>
-        <Text>Get directions to your location</Text>
-      </View>
-    )
-  }
+    renderContent = () => {
+        return (
+            <View>
+                <Text>Get directions to your location</Text>
+            </View>
+        )
+    }
 
-  render() {
-    return (
-      <BottomDrawer
-        containerHeight={100}
-        offset={TAB_BAR_HEIGHT}
-      >
-        {this.renderContent()}
-      </BottomDrawer>
-    )
-  }
+    render() {
+        return (
+            <BottomDrawer
+                containerHeight={100}
+                offset={TAB_BAR_HEIGHT}
+            >
+                {this.renderContent()}
+            </BottomDrawer>
+        )
+    }
 }
 
 ```
@@ -66,6 +66,11 @@ export default class App extends React.Component {
 | shadow | bool | true | if **true**, the top of the drawer will have a shadow. |
 | onExpanded | func | -- | A callback function triggered when the drawer is swiped into up position |
 | onCollapsed | func | -- | A callback function triggered when the drawer is swiped into down position |
+| borderRadius | number | 0 |A number of border radius |
+| borderBottomLeftRadius | number | 0 | A number of bottom left border radius |
+| borderBottomRightRadius | number | 0 | A number of bottom right border radius |
+| borderTopLeftRadius | number | 0 | A number of top left border radius |
+| borderTopRightRadius | number | 0 | A number of top right border radius |
 
 ### Questions?
 Feel free to contact me at [jackdillklein@gmail.com](mailto:jackdillklein@gmail.com) or [create an issue](https://github.com/jacklein/rn-bottom-drawer/issues/new)
diff --git a/package-lock.json b/package-lock.json
index fa19175..280119e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
-  "name": "rn-bottom-drawer",
-  "version": "1.4.3",
+  "name": "react-native-bottom-drawer-jyn",
+  "version": "1.0.0",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -2415,7 +2415,8 @@
         "ansi-regex": {
           "version": "2.1.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "aproba": {
           "version": "1.2.0",
@@ -2436,12 +2437,14 @@
         "balanced-match": {
           "version": "1.0.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "brace-expansion": {
           "version": "1.1.11",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "balanced-match": "^1.0.0",
             "concat-map": "0.0.1"
@@ -2456,17 +2459,20 @@
         "code-point-at": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "concat-map": {
           "version": "0.0.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "console-control-strings": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "core-util-is": {
           "version": "1.0.2",
@@ -2583,7 +2589,8 @@
         "inherits": {
           "version": "2.0.3",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "ini": {
           "version": "1.3.5",
@@ -2595,6 +2602,7 @@
           "version": "1.0.0",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "number-is-nan": "^1.0.0"
           }
@@ -2609,6 +2617,7 @@
           "version": "3.0.4",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "brace-expansion": "^1.1.7"
           }
@@ -2616,12 +2625,14 @@
         "minimist": {
           "version": "0.0.8",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "minipass": {
           "version": "2.2.4",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "safe-buffer": "^5.1.1",
             "yallist": "^3.0.0"
@@ -2640,6 +2651,7 @@
           "version": "0.5.1",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "minimist": "0.0.8"
           }
@@ -2720,7 +2732,8 @@
         "number-is-nan": {
           "version": "1.0.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "object-assign": {
           "version": "4.1.1",
@@ -2732,6 +2745,7 @@
           "version": "1.4.0",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "wrappy": "1"
           }
@@ -2817,7 +2831,8 @@
         "safe-buffer": {
           "version": "5.1.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "safer-buffer": {
           "version": "2.1.2",
@@ -2853,6 +2868,7 @@
           "version": "1.0.2",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "code-point-at": "^1.0.0",
             "is-fullwidth-code-point": "^1.0.0",
@@ -2872,6 +2888,7 @@
           "version": "3.0.1",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "ansi-regex": "^2.0.0"
           }
@@ -2915,12 +2932,14 @@
         "wrappy": {
           "version": "1.0.2",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "yallist": {
           "version": "3.0.2",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         }
       }
     },
diff --git a/package.json b/package.json
index 25a73d5..eb35ab5 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
-  "name": "rn-bottom-drawer",
-  "version": "1.4.3",
+  "name": "react-native-bottom-drawer-view",
+  "version": "1.0.2",
   "description": "a bottom drawer component for react native",
   "main": "index.js",
   "scripts": {
@@ -8,7 +8,7 @@
   },
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/jacklein/rn-bottom-drawer.git"
+    "url": "git+https://github.com/jynlele/rn-bottom-drawer.git"
   },
   "keywords": [
     "react-native",
@@ -17,9 +17,9 @@
   "author": "Jack K",
   "license": "ISC",
   "bugs": {
-    "url": "https://github.com/jacklein/rn-bottom-drawer/issues"
+    "url": "https://github.com/jynlele/rn-bottom-drawer/"
   },
-  "homepage": "https://github.com/jacklein/rn-bottom-drawer#readme",
+  "homepage": "https://github.com/jynlele/rn-bottom-drawer/blob/master/README.md",
   "dependencies": {
     "prop-types": "^15.6.2"
   },
@@ -27,5 +27,8 @@
     "metro-react-native-babel-preset": "^0.51.0",
     "react": "^16.6.3",
     "react-native": "^0.57.8"
+  },
+  "directories": {
+    "example": "example"
   }
 }
diff --git a/src/Animator.js b/src/Animator.js
index 0917141..d38f75a 100644
--- a/src/Animator.js
+++ b/src/Animator.js
@@ -1,5 +1,5 @@
 import React, { Component } from 'react';
-import { 
+import {
   PanResponder,
   Animated,
   Dimensions,
@@ -12,7 +12,7 @@ const SCREEN_WIDTH = Dimensions.get('window').width;
 export default class Animator extends Component{
   constructor(props){
     super(props);
-    
+
     this.position = new Animated.ValueXY(this.props.currentPosition);
 
     this._panResponder = PanResponder.create({
@@ -24,27 +24,27 @@ export default class Animator extends Component{
 
   render() {
     return (
-      <Animated.View 
-        style={[
-          {...this.position.getLayout(), left: 0},
-          StyleSheet.flatten([
-            styles.animationContainer(this.props.containerHeight, this.props.backgroundColor),
-            styles.roundedEdges(this.props.roundedEdges),
-            styles.shadow(this.props.shadow)
-          ])
-        ]}
-        {...this._panResponder.panHandlers}
-      >
-        {this.props.children}
-      </Animated.View>
+        <Animated.View
+            style={[
+              {...this.position.getLayout(), left: 0},
+              StyleSheet.flatten([
+                styles.animationContainer(this.props.containerHeight, this.props.backgroundColor),
+                styles.roundedEdges(this.props.roundedEdges),
+                styles.shadow(this.props.shadow),
+              ])
+            ]}
+            {...this._panResponder.panHandlers}
+        >
+          {this.props.children}
+        </Animated.View>
     )
   }
 
   _handlePanResponderMove = (e, gesture) => {
     if (this._swipeInBounds(gesture)) {
-      this.position.setValue({ y: this.props.currentPosition.y + gesture.dy });
+      this.position.setValue({x: 0, y: this.props.currentPosition.y + gesture.dy });
     } else {
-      this.position.setValue({ y: this.props.upPosition.y - this._calculateEase(gesture) });
+      this.position.setValue({x: 0, y: this.props.upPosition.y - this._calculateEase(gesture) });
     }
   }
 
@@ -53,7 +53,18 @@ export default class Animator extends Component{
       this._transitionTo(this.props.downPosition, this.props.onCollapsed);
     } else if (gesture.dy < -this.props.toggleThreshold && this.props.currentPosition === this.props.downPosition) {
       this._transitionTo(this.props.upPosition, this.props.onExpanded);
-    } else {
+    }else if(gesture.dy > this.props.toggleThreshold && this.props.currentPosition === this.props.downPosition){
+      if(!this.props.downPosition){
+        return
+      }
+      this._transitionTo(this.props.alldownPosition, this.props.onCollapsed);
+    }else if(gesture.dy < -this.props.toggleThreshold && this.props.currentPosition === this.props.alldownPosition){
+      if(!this.props.downPosition){
+        return
+      }
+      this._transitionTo(this.props.downPosition, this.props.onCollapsed);
+    }
+    else {
       this._resetPosition();
     }
   }
@@ -69,16 +80,18 @@ export default class Animator extends Component{
 
   _transitionTo(position, callback) {
     Animated.spring(this.position, {
-      toValue: position
-    }).start(() => this.props.onExpanded());
-    
+      toValue: position,
+      useNativeDriver: false,
+    }).start();44
+
     this.props.setCurrentPosition(position);
     callback();
   }
 
   _resetPosition() {
     Animated.spring(this.position, {
-      toValue: this.props.currentPosition
+      toValue: this.props.currentPosition,
+      useNativeDriver: false
     }).start();
   }
 }
@@ -91,16 +104,16 @@ const styles = {
     backgroundColor: color,
   }),
   roundedEdges: rounded => {
-    return rounded == true && {
+    return rounded === true && {
       borderTopLeftRadius: 10,
       borderTopRightRadius: 10,
     }
   },
   shadow: shadow => {
-    return shadow == true && {
+    return shadow === true && {
       shadowColor: '#CECDCD',
       shadowRadius: 3,
       shadowOpacity: 5,
     }
   },
-}
\ No newline at end of file
+}
diff --git a/src/BottomDrawer.js b/src/BottomDrawer.js
index df13974..2e936f4 100644
--- a/src/BottomDrawer.js
+++ b/src/BottomDrawer.js
@@ -1,6 +1,6 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
-import { 
+import {
   View,
   Dimensions,
 } from 'react-native';
@@ -12,13 +12,13 @@ const SCREEN_HEIGHT = Dimensions.get('window').height;
 export default class BottomDrawer extends Component{
   static propTypes = {
     /**
-     * Height of the drawer. 
+     * Height of the drawer.
      */
     containerHeight: PropTypes.number.isRequired,
 
     /**
      * The amount of offset to apply to the drawer's position.
-     * If the app uses a header and tab navigation, offset should equal 
+     * If the app uses a header and tab navigation, offset should equal
      * the sum of those two components' heights.
      */
     offset: PropTypes.number,
@@ -29,7 +29,7 @@ export default class BottomDrawer extends Component{
     startUp: PropTypes.bool,
 
     /**
-     * How much the drawer's down display falls beneath the up display. 
+     * How much the drawer's down display falls beneath the up display.
      * Ex: if set to 20, the down display will be 20 points underneath the up display.
      */
     downDisplay: PropTypes.number,
@@ -57,17 +57,53 @@ export default class BottomDrawer extends Component{
     /**
      * A callback function triggered when the drawer swiped into down position
      */
-    onCollapsed: PropTypes.func
+    onCollapsed: PropTypes.func,
+
+    /**
+     * Set bottom left border raidus
+     */
+    borderBottomLeftRadius: PropTypes.number,
+
+    /**
+     * Set bottom right border raidus
+     */
+    borderBottomRightRadius: PropTypes.number,
+
+    /**
+     * Set border raidus
+     */
+    borderRadius: PropTypes.number,
+
+    /**
+     * Set top left border raidus
+     */
+    borderTopLeftRadius: PropTypes.number,
+
+    /**
+     * Set top right border raidus
+     */
+    borderTopRightRadius: PropTypes.number,
+    /**
+     * Set all the way down positon
+     */
+    alldownDisplay: PropTypes.number,
+
   }
 
   static defaultProps = {
     offset: 0,
     startUp: true,
     backgroundColor: '#ffffff',
+    borderRadius: 0,
+    borderBottomLeftRadius: 0,
+    borderBottomRightRadius: 0,
+    borderTopLeftRadius: 0,
+    borderTopRightRadius: 0,
     roundedEdges: true,
     shadow: true,
     onExpanded: () => {},
-    onCollapsed: () => {}
+    onCollapsed: () => {},
+    alldownDisplay: 0
   }
 
   constructor(props){
@@ -86,29 +122,40 @@ export default class BottomDrawer extends Component{
      */
     this.UP_POSITION = this._calculateUpPosition(SCREEN_HEIGHT, this.props.containerHeight, this.props.offset)
     this.DOWN_POSITION = this._calculateDownPosition(this.UP_POSITION, this.DOWN_DISPLAY)
+    this.ALL_DOWN_POSITION = {x:0, y:this.props.alldownDisplay}
 
     this.state = { currentPosition: this.props.startUp ? this.UP_POSITION : this.DOWN_POSITION };
   }
 
-  render() {   
+  render() {
     return (
-      <Animator
-        currentPosition = {this.state.currentPosition}
-        setCurrentPosition = {(position) => this.setCurrentPosition(position)}
-        toggleThreshold = {this.TOGGLE_THRESHOLD}
-        upPosition = {this.UP_POSITION}
-        downPosition = {this.DOWN_POSITION}
-        roundedEdges = {this.props.roundedEdges}
-        shadow = {this.props.shadow}
-        containerHeight = {this.props.containerHeight}
-        backgroundColor = {this.props.backgroundColor}
-        onExpanded = {() => this.props.onExpanded()}
-        onCollapsed = {() => this.props.onCollapsed()}
-      >
-        {this.props.children}
-
-        <View style={{height: Math.sqrt(SCREEN_HEIGHT), backgroundColor: this.props.backgroundColor}} />
-      </Animator>
+        <Animator
+            currentPosition = {this.state.currentPosition}
+            setCurrentPosition = {(position) => this.setCurrentPosition(position)}
+            toggleThreshold = {this.TOGGLE_THRESHOLD}
+            upPosition = {this.UP_POSITION}
+            downPosition = {this.DOWN_POSITION}
+            roundedEdges = {this.props.roundedEdges}
+            shadow = {this.props.shadow}
+            containerHeight = {this.props.containerHeight}
+            backgroundColor = {this.props.backgroundColor}
+            onExpanded = {() => this.props.onExpanded()}
+            onCollapsed = {() => this.props.onCollapsed()}
+            alldownPosition = {this.ALL_DOWN_POSITION}
+        >
+          {this.props.children}
+
+          <View style={{height: Math.sqrt(SCREEN_HEIGHT),
+            backgroundColor: this.props.backgroundColor,
+            borderRadius: this.props.borderRadius,
+            borderBottomLeftRadius: this.props.borderBottomLeftRadius,
+            borderBottomRightRadius: this.props.borderBottomRightRadius,
+            borderTopLeftRadius: this.props.borderTopLeftRadius,
+            borderTopRightRadius: this.props.borderTopRightRadius,
+          }}
+
+          />
+        </Animator>
     )
   }
 
@@ -118,15 +165,15 @@ export default class BottomDrawer extends Component{
 
   _calculateUpPosition(screenHeight, containerHeight, offset) {
     return {
-      x: 0, 
-      y: screenHeight - (containerHeight + offset) 
+      x: 0,
+      y: screenHeight - (containerHeight + offset)
     }
   }
 
   _calculateDownPosition(upPosition, downDisplay) {
-    return { 
+    return {
       x: 0,
       y: upPosition.y + downDisplay
     };
   }
-}
\ No newline at end of file
+}