Run codemod react-codemod/transforms/class again (#7679)

ref. #7321
(cherry picked from commit df03318)

src/addons/transitions/ReactCSSTransitionGroup.js

@@ -46,10 +46,10 @@ function createTransitionTimeoutPropValidator(transitionType) {
  * enters or leaves the DOM.
  * See https://facebook.github.io/react/docs/animation.html#high-level-api-reactcsstransitiongroup
  */
-var ReactCSSTransitionGroup = React.createClass({
-  displayName: 'ReactCSSTransitionGroup',
+class ReactCSSTransitionGroup extends React.Component {
+  static displayName = 'ReactCSSTransitionGroup';
 
-  propTypes: {
+  static propTypes = {
     transitionName: ReactCSSTransitionGroupChild.propTypes.name,
 
     transitionAppear: React.PropTypes.bool,
@@ -58,17 +58,15 @@ var ReactCSSTransitionGroup = React.createClass({
     transitionAppearTimeout: createTransitionTimeoutPropValidator('Appear'),
     transitionEnterTimeout: createTransitionTimeoutPropValidator('Enter'),
     transitionLeaveTimeout: createTransitionTimeoutPropValidator('Leave'),
-  },
+  };
 
-  getDefaultProps: function() {
-    return {
-      transitionAppear: false,
-      transitionEnter: true,
-      transitionLeave: true,
-    };
-  },
+  static defaultProps = {
+    transitionAppear: false,
+    transitionEnter: true,
+    transitionLeave: true,
+  };
 
-  _wrapChild: function(child) {
+  _wrapChild = (child) => {
     // We need to provide this childFactory so that
     // ReactCSSTransitionGroupChild can receive updates to name, enter, and
     // leave while it is leaving.
@@ -85,14 +83,14 @@ var ReactCSSTransitionGroup = React.createClass({
       },
       child
     );
-  },
+  };
 
-  render: function() {
+  render() {
     return React.createElement(
       ReactTransitionGroup,
       Object.assign({}, this.props, {childFactory: this._wrapChild})
     );
-  },
-});
+  }
+}
 
 module.exports = ReactCSSTransitionGroup;

src/addons/transitions/ReactTransitionGroup.js

@@ -22,44 +22,40 @@ var emptyFunction = require('emptyFunction');
  * special lifecycle hooks are called.
  * See https://facebook.github.io/react/docs/animation.html#low-level-api-reacttransitiongroup
  */
-var ReactTransitionGroup = React.createClass({
-  displayName: 'ReactTransitionGroup',
+class ReactTransitionGroup extends React.Component {
+  static displayName = 'ReactTransitionGroup';
 
-  propTypes: {
+  static propTypes = {
     component: React.PropTypes.any,
     childFactory: React.PropTypes.func,
-  },
-
-  getDefaultProps: function() {
-    return {
-      component: 'span',
-      childFactory: emptyFunction.thatReturnsArgument,
-    };
-  },
-
-  getInitialState: function() {
-    return {
-      // TODO: can we get useful debug information to show at this point?
-      children: ReactTransitionChildMapping.getChildMapping(this.props.children),
-    };
-  },
-
-  componentWillMount: function() {
+  };
+
+  static defaultProps = {
+    component: 'span',
+    childFactory: emptyFunction.thatReturnsArgument,
+  };
+
+  state = {
+    // TODO: can we get useful debug information to show at this point?
+    children: ReactTransitionChildMapping.getChildMapping(this.props.children),
+  };
+
+  componentWillMount() {
     this.currentlyTransitioningKeys = {};
     this.keysToEnter = [];
     this.keysToLeave = [];
-  },
+  }
 
-  componentDidMount: function() {
+  componentDidMount() {
     var initialChildMapping = this.state.children;
     for (var key in initialChildMapping) {
       if (initialChildMapping[key]) {
         this.performAppear(key);
       }
     }
-  },
+  }
 
-  componentWillReceiveProps: function(nextProps) {
+  componentWillReceiveProps(nextProps) {
     var nextChildMapping;
     if (__DEV__) {
       nextChildMapping = ReactTransitionChildMapping.getChildMapping(
@@ -99,19 +95,19 @@ var ReactTransitionGroup = React.createClass({
     }
 
     // If we want to someday check for reordering, we could do it here.
-  },
+  }
 
-  componentDidUpdate: function() {
+  componentDidUpdate() {
     var keysToEnter = this.keysToEnter;
     this.keysToEnter = [];
     keysToEnter.forEach(this.performEnter);
 
     var keysToLeave = this.keysToLeave;
     this.keysToLeave = [];
     keysToLeave.forEach(this.performLeave);
-  },
+  }
 
-  performAppear: function(key) {
+  performAppear = (key) => {
     this.currentlyTransitioningKeys[key] = true;
 
     var component = this.refs[key];
@@ -123,9 +119,9 @@ var ReactTransitionGroup = React.createClass({
     } else {
       this._handleDoneAppearing(key);
     }
-  },
+  };
 
-  _handleDoneAppearing: function(key) {
+  _handleDoneAppearing = (key) => {
     var component = this.refs[key];
     if (component.componentDidAppear) {
       component.componentDidAppear();
@@ -149,9 +145,9 @@ var ReactTransitionGroup = React.createClass({
       // This was removed before it had fully appeared. Remove it.
       this.performLeave(key);
     }
-  },
+  };
 
-  performEnter: function(key) {
+  performEnter = (key) => {
     this.currentlyTransitioningKeys[key] = true;
 
     var component = this.refs[key];
@@ -163,9 +159,9 @@ var ReactTransitionGroup = React.createClass({
     } else {
       this._handleDoneEntering(key);
     }
-  },
+  };
 
-  _handleDoneEntering: function(key) {
+  _handleDoneEntering = (key) => {
     var component = this.refs[key];
     if (component.componentDidEnter) {
       component.componentDidEnter();
@@ -189,9 +185,9 @@ var ReactTransitionGroup = React.createClass({
       // This was removed before it had fully entered. Remove it.
       this.performLeave(key);
     }
-  },
+  };
 
-  performLeave: function(key) {
+  performLeave = (key) => {
     this.currentlyTransitioningKeys[key] = true;
 
     var component = this.refs[key];
@@ -203,9 +199,9 @@ var ReactTransitionGroup = React.createClass({
       // is done.
       this._handleDoneLeaving(key);
     }
-  },
+  };
 
-  _handleDoneLeaving: function(key) {
+  _handleDoneLeaving = (key) => {
     var component = this.refs[key];
 
     if (component.componentDidLeave) {
@@ -236,9 +232,9 @@ var ReactTransitionGroup = React.createClass({
         return {children: newChildren};
       });
     }
-  },
+  };
 
-  render: function() {
+  render() {
     // TODO: we could get rid of the need for the wrapper node
     // by cloning a single child
     var childrenToRender = [];
@@ -274,7 +270,7 @@ var ReactTransitionGroup = React.createClass({
       props,
       childrenToRender
     );
-  },
-});
+  }
+}
 
 module.exports = ReactTransitionGroup;

src/renderers/dom/client/wrappers/__tests__/ReactDOMInput-test.js

@@ -859,15 +859,14 @@ describe('ReactDOMInput', () => {
   });
 
   it('does not raise a validation warning when it switches types', () => {
-    var Input = React.createClass({
-      getInitialState() {
-        return { type: 'number', value: 1000 };
-      },
+    class Input extends React.Component {
+      state = { type: 'number', value: 1000 };
+
       render() {
         var { value, type } = this.state;
         return (<input onChange={() => {}} type={type} value={value} />);
-      },
-    });
+      }
+    }
 
     var input = ReactTestUtils.renderIntoDocument(<Input />);
     var node = ReactDOM.findDOMNode(input);