remove initialAnimation prop

README.md

@@ -61,7 +61,6 @@ const percentage = 66;
 | `strokeWidth` | Width of circular line as a percentage relative to total width of component. Default: `8`. |
 | `background` | Whether to display background color. Default: `false`. |
 | `backgroundPadding` | Padding between background and edge of svg as a percentage relative to total width of component. Default: `null`. |
-| `initialAnimation` | Toggle whether to animate progress starting from 0% on initial mount. Default: `false`. |
 | `counterClockwise` | Toggle whether to rotate progressbar in counterclockwise direction. Default: `false`. |
 | `circleRatio` | Number from 0-1 representing ratio of the full circle diameter the progressbar should use. Default: `1`. |
 | `classes` | Object allowing overrides of classNames of each svg subcomponent (root, trail, path, text, background). Enables styling with react-jss. See [this PR](https://github.com/kevinsqi/react-circular-progressbar/pull/25) for more detail. |

src/CircularProgressbar.tsx

@@ -18,16 +18,12 @@ class CircularProgressbar extends React.Component<
   CircularProgressbarProps,
   CircularProgressbarState
 > {
-  initialTimeout: number | undefined = undefined;
-  requestAnimationFrame: number | undefined = undefined;
-
   static defaultProps: CircularProgressbarDefaultProps = {
     strokeWidth: 8,
     className: '',
     text: '',
     background: false,
     backgroundPadding: 0,
-    initialAnimation: false,
     counterClockwise: false,
     circleRatio: 1,
     classes: {
@@ -46,39 +42,6 @@ class CircularProgressbar extends React.Component<
     },
   };
 
-  constructor(props: CircularProgressbarProps) {
-    super(props);
-
-    this.state = {
-      percentage: props.initialAnimation ? 0 : props.percentage,
-    };
-  }
-
-  componentDidMount() {
-    if (this.props.initialAnimation) {
-      this.initialTimeout = window.setTimeout(() => {
-        this.requestAnimationFrame = window.requestAnimationFrame(() => {
-          this.setState({
-            percentage: this.props.percentage,
-          });
-        });
-      }, 0);
-    }
-  }
-
-  componentWillReceiveProps(nextProps: CircularProgressbarProps) {
-    this.setState({
-      percentage: nextProps.percentage,
-    });
-  }
-
-  componentWillUnmount() {
-    clearTimeout(this.initialTimeout);
-    if (this.requestAnimationFrame) {
-      window.cancelAnimationFrame(this.requestAnimationFrame);
-    }
-  }
-
   getBackgroundPadding() {
     if (this.props.background) {
       // Default padding to be the same as strokeWidth

src/types.ts

@@ -14,7 +14,6 @@ export type CircularProgressbarDefaultProps = {
   text: string;
   background: boolean;
   backgroundPadding: number;
-  initialAnimation: boolean;
   counterClockwise: boolean;
   circleRatio: number;
   classes: {
@@ -36,7 +35,6 @@ export type CircularProgressbarWrapperProps = {
   text?: string;
   background?: boolean;
   backgroundPadding?: number;
-  initialAnimation?: boolean;
   counterClockwise?: boolean;
   circleRatio?: number;
   classes?: {

test/CircularProgressbarWithChildren.test.tsx

@@ -26,7 +26,6 @@ describe('<CircularProgressbarWithChildren />', () => {
       },
       className: 'johnny',
       counterClockwise: false,
-      initialAnimation: true,
       percentage: 50,
       strokeWidth: 2,
       styles: {},