Merge pull request #30541 from TiuSh/recompose-0.30

[recompose] Update to 0.30

types/recompose/index.d.ts

@@ -1,10 +1,11 @@
-// Type definitions for Recompose 0.27
+// Type definitions for Recompose 0.30
 // Project: https://github.com/acdlite/recompose
 // Definitions by: Iskander Sierra <https://github.com/iskandersierra>
 //                 Curtis Layne <https://github.com/clayne11>
 //                 Rasmus Eneman <https://github.com/Pajn>
 //                 Lucas Terra <https://github.com/lucasterra>
 //                 Brian Adams <https://github.com/brian-lives-outdoors>
+//                 Mathieu Masy <https://github.com/TiuSh>
 // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
 // TypeScript Version: 2.8
 
@@ -265,6 +266,17 @@ declare module 'recompose' {
     // toClass: https://github.com/acdlite/recompose/blob/master/docs/API.md#toClass
     export const toClass: InferableComponentEnhancer<{}>;
 
+    // toRenderProps: https://github.com/acdlite/recompose/blob/master/docs/API.md#torenderprops
+    export function toRenderProps<TInner, TOutter>(
+        hoc: InferableComponentEnhancerWithProps<TInner & TOutter, TOutter>
+    ): StatelessComponent<TOutter & { children: (props: TInner) => React.ReactElement<any> }>;
+
+    // fromRenderProps: https://github.com/acdlite/recompose/blob/master/docs/API.md#fromrenderprops
+    export function fromRenderProps<TInner, TOutter, TRenderProps = {}>(
+        RenderPropsComponent: StatelessComponent<any>,
+        propsMapper: (props: TRenderProps) => Partial<TInner>,
+        renderPropName?: string
+    ): ComponentEnhancer<TInner, TOutter>;
 
     // Static property helpers: https://github.com/acdlite/recompose/blob/master/docs/API.md#static-property-helpers
 
@@ -586,6 +598,18 @@ declare module 'recompose/toClass' {
     export default toClass;
 }
 
+// https://github.com/acdlite/recompose/blob/master/docs/API.md#torenderprops
+declare module 'recompose/toRenderProps' {
+    import { toRenderProps } from 'recompose';
+    export default toRenderProps;
+}
+
+// https://github.com/acdlite/recompose/blob/master/docs/API.md#fromrenderprops
+declare module 'recompose/fromRenderProps' {
+    import { fromRenderProps } from 'recompose';
+    export default fromRenderProps;
+}
+
 // https://github.com/acdlite/recompose/blob/master/docs/API.md#setstatic
 declare module 'recompose/setStatic' {
     import { setStatic } from 'recompose';

types/recompose/recompose-tests.tsx

@@ -7,7 +7,7 @@ import {
     withState, withReducer, branch, renderComponent,
     renderNothing, shouldUpdate, pure, onlyUpdateForKeys,
     onlyUpdateForPropTypes, withContext, getContext,
-    lifecycle, toClass, withStateHandlers,
+    lifecycle, toClass, toRenderProps, fromRenderProps, withStateHandlers,
     // Static property helpers
     setStatic, setPropTypes, setDisplayName,
     // Utilities
@@ -51,6 +51,8 @@ import withContextStandalone from "recompose/withContext";
 import getContextStandalone from "recompose/getContext";
 import lifecycleStandalone from "recompose/lifecycle";
 import toClassStandalone from "recompose/toClass";
+import toRenderPropsStandalone from "recompose/toRenderProps";
+import fromRenderPropsStandalone from "recompose/fromRenderProps";
 import setStaticStandalone from "recompose/setStatic";
 import setPropTypesStandalone from "recompose/setPropTypes";
 import setDisplayNameStandalone from "recompose/setDisplayName";
@@ -496,3 +498,47 @@ function testSetDisplayName() {
     ClassResult = hoc(ClassComp);
     ClassResult = hoc(SfcComp); // $ExpectError
 }
+
+function testToRenderProps() {
+    interface OutterProps {
+        foo: number;
+    }
+
+    interface InnerProps {
+        fooPlusOne: number;
+    }
+
+    const enhance = withProps<InnerProps, OutterProps>(({ foo }) => ({ fooPlusOne: foo + 1 }));
+    const Enhanced = toRenderProps<InnerProps, OutterProps>(enhance);
+
+    return <Enhanced foo={1}>{({ fooPlusOne }) => <h1>{fooPlusOne}</h1>}</Enhanced>;
+}
+
+function testFromRenderProps() {
+    interface RenderProps {
+        value: string;
+    }
+
+    interface InnerProps {
+        renderValue: string;
+        outterValue: number;
+    }
+
+    interface OutterProps {
+        outterValue: number;
+    }
+
+    const RenderPropComponent: React.StatelessComponent<{
+        render: (renderProps: RenderProps) => React.ReactElement<any>;
+    }> = ({ render }) => render({ value: 'test' });
+
+    const component: React.StatelessComponent<InnerProps> = ({ renderValue }) => <div>{renderValue}</div>;
+
+    const Enhanced = fromRenderProps<InnerProps, OutterProps, RenderProps>(
+        RenderPropComponent,
+        ({ value }) => ({ renderValue: value }),
+        'render'
+    )(component);
+
+    return <Enhanced outterValue={1} />;
+}