From be69e984086834b5781fa22ca1642ec31c30a039 Mon Sep 17 00:00:00 2001
From: Chua Wei Kuan <khankuan@gmail.com>
Date: Fri, 9 Dec 2016 23:42:27 -0800
Subject: [PATCH 1/2] Allow TransitionChild to passprops. Useful for component
 wrapper that clone children and modify props, new props should be passed down
 to child.

---
 package.json                    |  1 +
 src/CSSTransitionGroupChild.js  |  4 +++-
 test/CSSTransitionGroup-test.js | 42 +++++++++++++++++++++++++++++++++
 3 files changed, 46 insertions(+), 1 deletion(-)

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..1838e6f7 100644
--- a/src/CSSTransitionGroupChild.js
+++ b/src/CSSTransitionGroupChild.js
@@ -157,7 +157,9 @@ class CSSTransitionGroupChild extends React.Component {
   }
 
   render() {
-    return React.Children.only(this.props.children);
+    const props = { ...this.props };
+    Object.keys(propTypes).forEach(key => delete props[key]);
+    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 (
+          <div>
+            {
+              React.Children.map(this.props.children,
+                child => React.cloneElement(child, { className: extraClassNameProp }))
+            }
+          </div>
+        );
+      }
+    }
+
+    class Child extends React.Component {
+      render() {
+        return <div {...this.props} />;
+      }
+    }
+
+    class Component extends React.Component {
+      render() {
+        return (
+          <CSSTransitionGroup
+            transitionName="yolo"
+            component={Wrapper}
+          >
+            <Child />
+          </CSSTransitionGroup>
+        );
+      }
+    }
+
+    const a = ReactDOM.render(<Component />, container);
+    const child = ReactDOM.findDOMNode(a).childNodes[0];
+    expect(hasClass(child, extraClassNameProp)).toBe(true);
+
+    // Testing that no exception is thrown here, as the timeout has been cleared.
+    jest.runAllTimers();
+  });
 });

From b26fc0b8a8748901aec2378ac002be3060b8198b Mon Sep 17 00:00:00 2001
From: Chua Wei Kuan <khankuan@gmail.com>
Date: Sat, 10 Dec 2016 07:23:44 -0800
Subject: [PATCH 2/2] delete specific props instead of relying on propTypes.

---
 src/CSSTransitionGroupChild.js | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/CSSTransitionGroupChild.js b/src/CSSTransitionGroupChild.js
index 1838e6f7..d3f5baa5 100644
--- a/src/CSSTransitionGroupChild.js
+++ b/src/CSSTransitionGroupChild.js
@@ -158,7 +158,13 @@ class CSSTransitionGroupChild extends React.Component {
 
   render() {
     const props = { ...this.props };
-    Object.keys(propTypes).forEach(key => delete props[key]);
+    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);
   }
 }