rc-progress@2.6.1

import 'rc-progress/assets/index.css';
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { Line, Circle } from 'rc-progress';

class App extends Component {
  constructor() {
    super();
    this.state = {
      percent: 0,
    };
    this.increase = this.increase.bind(this);
    this.restart = this.restart.bind(this);
  }

  componentDidMount() {
    this.increase();
  }

  increase() {
    const { percent } = this.state;
    const newPercent = percent + 1;
    if (newPercent >= 100) {
      clearTimeout(this.tm);
      return;
    }
    this.setState({ percent: newPercent });
    this.tm = setTimeout(this.increase, 10);
  }

  restart() {
    clearTimeout(this.tm);
    this.setState({ percent: 0 }, () => {
      this.increase();
    });
  }

  render() {
    const { percent } = this.state;
    return (
      <div style={{ margin: 10, width: 200 }}>
        <Circle strokeWidth="6" percent={percent} />
        <Line strokeWidth="4" percent={percent} />
        <button type="button" onClick={this.restart}>
          Restart
        </button>
      </div>
    );
  }
}

ReactDOM.render(<App />, document.getElementById('__react-content'));