WIP removing classForPercentage/textForPercentage

README.md

@@ -65,8 +65,6 @@ const percentage = 66;
 | `counterClockwise` | Toggle whether to rotate progressbar in counterclockwise direction. Default: `false`. |
 | `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/iqnivek/react-circular-progressbar/pull/25) for more detail. |
 | `styles` | Object allowing customization of styles of each svg subcomponent (root, trail, path, text, background). |
-| `classForPercentage` | **Deprecated** - please use `className` prop instead. Example: `(percent) => percent < 100 ? 'incomplete' : 'complete'`. |
-| `textForPercentage` | **Deprecated** - please use `text` prop instead. [See this post](https://github.com/iqnivek/react-circular-progressbar/issues/29#issuecomment-341628016) on how to migrate. Example: ``(pct) => `${pct}%`. |
 
 
 ## Customizing styles

docs/demo.jsx

@@ -82,6 +82,7 @@ class Demo extends React.Component {
               backgroundPadding={5}
               strokeWidth={6}
               percentage={66}
+              text={`${66}%`}
             />
           </Example>
 
@@ -92,7 +93,6 @@ class Demo extends React.Component {
               <div style={{ position: 'absolute', width: '100%' }}>
                 <CircularProgressbar
                   percentage={50}
-                  textForPercentage={null}
                 />
               </div>
               <div style={{ width: '100%', padding: '10%' }}>

src/index.jsx

@@ -87,13 +87,6 @@ class CircularProgressbar extends React.Component {
     return FULL_RADIUS - (this.props.strokeWidth / 2) - this.getBackgroundPadding();
   }
 
-  getText() {
-    if (this.props.text) {
-      return this.props.text;
-    }
-    return this.props.textForPercentage ? this.props.textForPercentage(this.props.percentage) : null;
-  }
-
   render() {
     const {
       percentage,
@@ -101,14 +94,13 @@ class CircularProgressbar extends React.Component {
       classes,
       styles,
       strokeWidth,
+      text,
     } = this.props;
-    const classForPercentage = this.props.classForPercentage ? this.props.classForPercentage(percentage) : '';
     const pathDescription = this.getPathDescription();
-    const text = this.getText();
 
     return (
       <svg
-        className={`${classes.root} ${className} ${classForPercentage}`}
+        className={`${classes.root} ${className}`}
         style={styles.root}
         viewBox={`0 0 ${MAX_X} ${MAX_Y}`}
       >
@@ -168,8 +160,6 @@ CircularProgressbar.propTypes = {
   backgroundPadding: PropTypes.number,
   initialAnimation: PropTypes.bool,
   counterClockwise: PropTypes.bool,
-  classForPercentage: PropTypes.func,
-  textForPercentage: PropTypes.func,
 };
 
 CircularProgressbar.defaultProps = {
@@ -194,8 +184,6 @@ CircularProgressbar.defaultProps = {
   backgroundPadding: null,
   initialAnimation: false,
   counterClockwise: false,
-  classForPercentage: null,
-  textForPercentage: (percentage) => `${percentage}%`,
 };
 
 export default CircularProgressbar;