[react-transition-group] Restrict Transition child function's argument type (#27894)

> A `function` child can be used instead of a React element.
> This function is called with the current transition status
> ('entering', 'entered', 'exiting', 'exited', 'unmounted'), which can be used
> to apply context specific props to a component.

https://github.com/reactjs/react-transition-group/blob/b8da4f2f2314b23a6471d78cb14c22efe13481dd/src/Transition.js#L379

See also #27693

types/react-transition-group/Transition.d.ts

@@ -16,7 +16,13 @@ export interface TransitionActions {
     exit?: boolean;
 }
 
-export type TransitionChildren = React.ReactNode | ((status: string) => React.ReactNode);
+type TransitionStatus =
+    typeof ENTERING |
+    typeof ENTERED |
+    typeof EXITING |
+    typeof EXITED |
+    typeof UNMOUNTED;
+export type TransitionChildren = React.ReactNode | ((status: TransitionStatus) => React.ReactNode);
 export interface TransitionProps extends TransitionActions {
     in?: boolean;
     mountOnEnter?: boolean;

types/react-transition-group/index.d.ts

@@ -2,6 +2,7 @@
 // Project: https://github.com/reactjs/react-transition-group
 // Definitions by: Karol Janyst <https://github.com/LKay>
 //                 Epskampie <https://github.com/Epskampie>
+//                 Masafumi Koba <https://github.com/ybiquitous>
 // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
 // TypeScript Version: 2.8
 

types/react-transition-group/react-transition-group-tests.tsx

@@ -52,7 +52,16 @@ const Test: React.StatelessComponent = () => {
                 <div>{ "test" }</div>
             </Components.Transition>
             <Components.Transition in timeout={500}>
-                {(status) => <div>{status}</div>}
+                {(status) => {
+                     switch (status) {
+                         case ENTERING:
+                         case ENTERED:
+                         case EXITING:
+                         case EXITED:
+                         case UNMOUNTED:
+                             return <div>{status}</div>;
+                     }
+                }}
             </Components.Transition>
 
             <Transition