camelCase lineCap-prop. Documentation update

README.md

@@ -80,12 +80,12 @@ You can configure the passing by following props:
 - **backgroundWidth** - thickness of the background line
 - **fill** - current, percentage fill (from 0 to 100)
 - **prefill** - percentage fill before the animation (from 0 to 100)
-- **tintColor** - color of a progress line
-- **backgroundColor** - color of a background for progress line. Use 'transparent' to hide
+- **tintColor** - color of the progress line
+- **backgroundColor** - color of the background for the progress line. If unspecified, no background will be rendered
 - **rotation** - by default, progress starts from the angle = 90⦝, you can change it by setting value from -360 to 360
 - **tension** - the tension value for the spring animation (see [here](https://facebook.github.io/react-native/docs/animations.html#core-api))
 - **friction** - the friction value for the spring animation (see [here](https://facebook.github.io/react-native/docs/animations.html#core-api))
-- **linecap** - the shape to be used at the ends of the circle. Possible values: butt (default), round or square. (see [here](https://developer.mozilla.org/en/docs/Web/SVG/Attribute/stroke-linecap))
+- **lineCap** - the shape to be used at the ends of the circle. Possible values: butt (default), round or square. (see [here](https://developer.mozilla.org/en/docs/Web/SVG/Attribute/stroke-linecap))
 - **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 is complete. (see [here](https://facebook.github.io/react-native/docs/animated.html#working-with-animations))

example/App.js

@@ -74,7 +74,7 @@ export default class Example extends React.Component {
           backgroundColor="#3d5875"
           arcSweepAngle={240}
           rotation={240}
-          linecap="round"
+          lineCap="round"
         />
 
         <AnimatedCircularProgress

src/CircularProgress.js

@@ -40,7 +40,7 @@ export default class CircularProgress extends React.Component {
       backgroundColor,
       style,
       rotation,
-      linecap,
+      lineCap,
       arcSweepAngle,
       children
     } = this.props;
@@ -75,14 +75,14 @@ export default class CircularProgress extends React.Component {
                 d={backgroundPath}
                 stroke={backgroundColor}
                 strokeWidth={backgroundWidth || width}
-                strokeCap={linecap}
+                strokeCap={lineCap}
               />
             )}
             <Shape
               d={circlePath}
               stroke={tintColor}
               strokeWidth={width}
-              strokeCap={linecap}
+              strokeCap={lineCap}
             />
           </Group>
         </Surface>
@@ -105,7 +105,7 @@ CircularProgress.propTypes = {
   tintColor: PropTypes.string,
   backgroundColor: PropTypes.string,
   rotation: PropTypes.number,
-  linecap: PropTypes.string,
+  lineCap: PropTypes.string,
   arcSweepAngle: PropTypes.number,
   children: PropTypes.func
 }
@@ -113,6 +113,6 @@ CircularProgress.propTypes = {
 CircularProgress.defaultProps = {
   tintColor: 'black',
   rotation: 90,
-  linecap: 'butt',
+  lineCap: 'butt',
   arcSweepAngle: 360
 }