diff --git a/package.json b/package.json index e96bbb6d..f1cc260a 100644 --- a/package.json +++ b/package.json @@ -50,6 +50,7 @@ "babel-plugin-add-module-exports": "^0.2.1", "babel-plugin-dev-expression": "^0.2.1", "babel-preset-latest": "^6.16.0", + "babel-preset-react": "^6.16.0", "babel-preset-stage-2": "^6.18.0", "eslint": "^3.10.2", "eslint-config-airbnb": "^13.0.0", diff --git a/src/CSSTransitionGroupChild.js b/src/CSSTransitionGroupChild.js index 00e209ce..d3f5baa5 100644 --- a/src/CSSTransitionGroupChild.js +++ b/src/CSSTransitionGroupChild.js @@ -157,7 +157,15 @@ class CSSTransitionGroupChild extends React.Component { } render() { - return React.Children.only(this.props.children); + const props = { ...this.props }; + delete props.name; + delete props.appear; + delete props.enter; + delete props.leave; + delete props.appearTimeout; + delete props.enterTimeout; + delete props.leaveTimeout; + return React.cloneElement(React.Children.only(this.props.children), props); } } diff --git a/test/CSSTransitionGroup-test.js b/test/CSSTransitionGroup-test.js index 092b0892..6a0a8976 100644 --- a/test/CSSTransitionGroup-test.js +++ b/test/CSSTransitionGroup-test.js @@ -319,4 +319,46 @@ describe('CSSTransitionGroup', () => { // Testing that no exception is thrown here, as the timeout has been cleared. jest.runAllTimers(); }); + + it('should work with custom component wrapper cloning children', () => { + const extraClassNameProp = 'wrapper-item'; + class Wrapper extends React.Component { + render() { + return ( +