Improve documentation and update dependencies

README.md

@@ -1,19 +1,21 @@
+# react-native-circular-progress
+
 [![license](https://img.shields.io/github/license/mashape/apistatus.svg)]()
 [![Version](https://img.shields.io/npm/v/react-native-circular-progress.svg)](https://www.npmjs.com/package/react-native-circular-progress)
 [![npm](https://img.shields.io/npm/dt/react-native-circular-progress.svg)](https://www.npmjs.com/package/react-native-circular-progress)
 
-# react-native-circular-progress
 
 React Native component for creating animated, circular progress. Useful for displaying users points for example. **Works on iOS & Android.**
 
 ## Example app
+
 ![image](screenshot.gif)
 
 ## Installation
 
 1. Install this component and `react-native-svg`:
 
-`npm i --save react-native-circular-progress react-native-svg`
+    `npm i --save react-native-circular-progress react-native-svg`
 
 2. Link native code for SVG:
 
@@ -65,6 +67,7 @@ Finally, you can manually trigger a duration-based timing animation by putting a
   ...
 />
 ```
+
 ```javascript
 this.circularProgress.animate(100, 8000, Easing.quad); // Will fill the progress bar linearly in 8 seconds
 ```
@@ -89,8 +92,9 @@ You can configure the passing by following props:
 - **arcSweepAngle** - the angle that you want your arc to sweep in the case where you don't want a full circle. Default is 360.
 - **children(fill)** - you can pass function as a child to receive current fill
 - **onAnimationComplete** - you can pass a callback function that will be invoked when animation completes. (see [here](https://facebook.github.io/react-native/docs/animated.html#working-with-animations))
+- **reAnimate(prefill, toVal, dur, ease)** - Run the animation again
 
-## Running example app
+## Running example app (Expo)
 
 ```sh
 git clone https://github.com/bgryszko/react-native-circular-progress.git
@@ -99,13 +103,16 @@ yarn
 yarn start
 ```
 
-## Author
+## Authors
 
 Bartosz Gryszko (b@gryszko.com)
+Markus Lindqvist
+Special thanks to all contributors!
 
 ## License
 
 MIT
 
 ## Special thanks
+
 Special thanks to [Chalk+Chisel](http://chalkchisel.com) for creating working environment where people grow. This component was created for one of the projects we're working on.

example/App.js

@@ -28,7 +28,7 @@ export default class App extends React.Component {
       },
       onPanResponderTerminationRequest: (evt, gestureState) => true,
       onPanResponderRelease: (evt, gestureState) => {
-        this.refs.circularProgress.animate(100, 2000);
+        this.refs.circularProgress.animate(100, 3000);
         let points = this.state.points + this.state.pointsDelta;
         console.log(Math.min(points, MAX_POINTS));
         this.setState({

example/README.md

@@ -0,0 +1,8 @@
+# Example App
+
+First install Expo. Then run the Expo app:
+
+```bash
+npm i
+yarn start
+```

package-lock.json

@@ -14,7 +14,7 @@
       "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.3.1.tgz",
       "integrity": "sha1-0aitM/qc4OcT1l/dCsi3SNR4yEg=",
       "requires": {
-        "js-tokens": "3.0.2"
+        "js-tokens": "^3.0.0"
       }
     },
     "object-assign": {
@@ -27,8 +27,8 @@
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.2.tgz",
       "integrity": "sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ==",
       "requires": {
-        "loose-envify": "1.3.1",
-        "object-assign": "4.1.1"
+        "loose-envify": "^1.3.1",
+        "object-assign": "^4.1.1"
       }
     }
   }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-circular-progress",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "React Native component for creating animated, circular progress with react-native-svg",
   "main": "index.js",
   "repository": {
@@ -25,11 +25,11 @@
   },
   "homepage": "https://github.com/bgryszko/react-native-circular-progress",
   "dependencies": {
-    "prop-types": "^15.6.0"
+    "prop-types": "^15.6.2"
   },
   "peerDependencies": {
-    "react": ">=16.0.0",
-    "react-native": ">=0.39.0",
-    "react-native-svg": "^6.3.1"
+    "react": ">=16.7.0",
+    "react-native": "^0.57.8",
+    "react-native-svg": "^8.0.10"
   }
 }