Rebase on top of #5619

Author: cristianoc

jscomp/gentype_tests/typescript-react-example/src/ExportWithRename.gen.tsx

@@ -9,4 +9,4 @@ const ExportWithRenameBS: any = ExportWithRenameBS__Es6Import;
 // tslint:disable-next-line:interface-over-type-literal
 export type props<s> = { readonly key?: string; readonly s: s };
 
-export const ExportWithRename: (_1:props<string>) => JSX.Element = ExportWithRenameBS.make;
+export const ExportWithRename: React.ComponentType<{ readonly s: string }> = ExportWithRenameBS.make;

jscomp/gentype_tests/typescript-react-example/src/Hooks.gen.tsx

@@ -2,6 +2,8 @@
 /* eslint-disable import/first */
 
 
+import * as React from 'react';
+
 // @ts-ignore: Implicit any on import
 import * as Curry__Es6Import from 'rescript/lib/es6/curry.js';
 const Curry: any = Curry__Es6Import;
@@ -102,21 +104,21 @@ export type DD_props<array,name> = {
   readonly name: name
 };
 
-export const $$default: (_1:props<vehicle>) => JSX.Element = HooksBS.default;
+export const $$default: React.ComponentType<{ readonly vehicle: vehicle }> = HooksBS.default;
 
 export default $$default;
 
-export const Another_anotherComponent: (_1:Another_props<vehicle,(() => void)>) => JSX.Element = HooksBS.Another.anotherComponent;
+export const Another_anotherComponent: React.ComponentType<{ readonly vehicle: vehicle; readonly callback: () => void }> = HooksBS.Another.anotherComponent;
 
-export const Inner_make: (_1:Inner_props<vehicle>) => JSX.Element = HooksBS.Inner.make;
+export const Inner_make: React.ComponentType<{ readonly vehicle: vehicle }> = HooksBS.Inner.make;
 
-export const Inner_Another_anotherComponent: (_1:Inner_Another_props<vehicle>) => JSX.Element = HooksBS.Inner.Another.anotherComponent;
+export const Inner_Another_anotherComponent: React.ComponentType<{ readonly vehicle: vehicle }> = HooksBS.Inner.Another.anotherComponent;
 
-export const Inner_Inner2_make: (_1:Inner_Inner2_props<vehicle>) => JSX.Element = HooksBS.Inner.Inner2.make;
+export const Inner_Inner2_make: React.ComponentType<{ readonly vehicle: vehicle }> = HooksBS.Inner.Inner2.make;
 
-export const Inner_Inner2_Another_anotherComponent: (_1:Inner_Inner2_Another_props<vehicle>) => JSX.Element = HooksBS.Inner.Inner2.Another.anotherComponent;
+export const Inner_Inner2_Another_anotherComponent: React.ComponentType<{ readonly vehicle: vehicle }> = HooksBS.Inner.Inner2.Another.anotherComponent;
 
-export const NoProps_make: (_1:NoProps_props) => JSX.Element = HooksBS.NoProps.make;
+export const NoProps_make: React.ComponentType<{}> = HooksBS.NoProps.make;
 
 export const functionWithRenamedArgs: (_1:{
   readonly to: vehicle; 
@@ -130,11 +132,16 @@ export const functionWithRenamedArgs: (_1:{
   return result
 };
 
-export const WithRename_componentWithRenamedArgs: (_1:WithRename_props<vehicle,vehicle,cb>) => JSX.Element = function (Arg1: any) {
-  const result = HooksBS.WithRename.componentWithRenamedArgs({key:Arg1.key, _to:Arg1._to, _Type:Arg1._Type, cb:function (Argto: any) {
+export const WithRename_componentWithRenamedArgs: React.ComponentType<{
+  readonly _to: vehicle; 
+  readonly _Type: vehicle; 
+  readonly cb: cb
+}> = function Hooks_WithRename_componentWithRenamedArgs(Arg1: any) {
+  const $props = {_to:Arg1._to, _Type:Arg1._Type, cb:function (Argto: any) {
       const result1 = Arg1.cb({to:Argto});
       return result1
-    }});
+    }};
+  const result = React.createElement(HooksBS.WithRename.componentWithRenamedArgs, $props);
   return result
 };
 
@@ -143,45 +150,53 @@ export const WithRef_makeWithRef: (_1:WithRef_props<vehicle>, _2:(null | undefin
   return result
 };
 
-export const testForwardRef: (_1:WithRef_props<vehicle>) => JSX.Element = HooksBS.testForwardRef;
+export const testForwardRef: React.ComponentType<{ readonly vehicle: vehicle }> = HooksBS.testForwardRef;
 
-export const ForwardRef_input: (_1:ForwardRef_props<r>) => JSX.Element = HooksBS.ForwardRef.input;
+export const ForwardRef_input: React.ComponentType<{ readonly ref?: any; readonly r: r }> = HooksBS.ForwardRef.input;
 
-export const Poly_polymorphicComponent: <T1>(_1:Poly_props<[vehicle, T1]>) => JSX.Element = HooksBS.Poly.polymorphicComponent;
+export const Poly_polymorphicComponent: React.ComponentType<{ readonly p: [vehicle, any] }> = HooksBS.Poly.polymorphicComponent;
 
-export const Fun_functionReturningReactElement: (_1:Fun_props<string>) => JSX.Element = HooksBS.Fun.functionReturningReactElement;
+export const Fun_functionReturningReactElement: React.ComponentType<{ readonly name: string }> = HooksBS.Fun.functionReturningReactElement;
 
-export const RenderPropRequiresConversion_make: (_1:RenderPropRequiresConversion_props<React.ComponentType<{ readonly number: number; readonly vehicle: vehicle }>>) => JSX.Element = HooksBS.RenderPropRequiresConversion.make;
+export const RenderPropRequiresConversion_make: React.ComponentType<{ readonly renderVehicle: React.ComponentType<{ readonly number: number; readonly vehicle: vehicle }> }> = HooksBS.RenderPropRequiresConversion.make;
 
-export const WithChildren_aComponentWithChildren: (_1:WithChildren_props<vehicle,JSX.Element>) => JSX.Element = HooksBS.WithChildren.aComponentWithChildren;
+export const WithChildren_aComponentWithChildren: React.ComponentType<{ readonly vehicle: vehicle; readonly children: React.ReactNode }> = HooksBS.WithChildren.aComponentWithChildren;
 
-export const DD_make: (_1:DD_props<Js_TypedArray2_Uint8Array_t,string>) => JSX.Element = HooksBS.DD.make;
+export const DD_make: React.ComponentType<{ readonly array: Js_TypedArray2_Uint8Array_t; readonly name: string }> = HooksBS.DD.make;
 
-export const NoProps: { make: (_1:NoProps_props) => JSX.Element } = HooksBS.NoProps
+export const NoProps: { make: React.ComponentType<{}> } = HooksBS.NoProps
 
 export const Inner: {
   Inner2: {
     Another: {
-      anotherComponent: (_1:Inner_Inner2_Another_props<vehicle>) => JSX.Element
+      anotherComponent: React.ComponentType<{
+        readonly vehicle: vehicle
+      }>
     }; 
-    make: (_1:Inner_Inner2_props<vehicle>) => JSX.Element
+    make: React.ComponentType<{
+      readonly vehicle: vehicle
+    }>
   }; 
   Another: {
-    anotherComponent: (_1:Inner_Another_props<vehicle>) => JSX.Element
+    anotherComponent: React.ComponentType<{
+      readonly vehicle: vehicle
+    }>
   }; 
-  make: (_1:Inner_props<vehicle>) => JSX.Element
+  make: React.ComponentType<{
+    readonly vehicle: vehicle
+  }>
 } = HooksBS.Inner
 
-export const RenderPropRequiresConversion: { make: (_1:RenderPropRequiresConversion_props<React.ComponentType<{ readonly number: number; readonly vehicle: vehicle }>>) => JSX.Element } = HooksBS.RenderPropRequiresConversion
+export const RenderPropRequiresConversion: { make: React.ComponentType<{ readonly renderVehicle: React.ComponentType<{ readonly number: number; readonly vehicle: vehicle }> }> } = HooksBS.RenderPropRequiresConversion
 
-export const ForwardRef: { input: (_1:ForwardRef_props<r>) => JSX.Element } = HooksBS.ForwardRef
+export const ForwardRef: { input: React.ComponentType<{ readonly ref?: any; readonly r: r }> } = HooksBS.ForwardRef
 
-export const Fun: { functionReturningReactElement: (_1:Fun_props<string>) => JSX.Element } = HooksBS.Fun
+export const Fun: { functionReturningReactElement: React.ComponentType<{ readonly name: string }> } = HooksBS.Fun
 
-export const WithChildren: { aComponentWithChildren: (_1:WithChildren_props<vehicle,JSX.Element>) => JSX.Element } = HooksBS.WithChildren
+export const WithChildren: { aComponentWithChildren: React.ComponentType<{ readonly vehicle: vehicle; readonly children: React.ReactNode }> } = HooksBS.WithChildren
 
-export const DD: { make: (_1:DD_props<Js_TypedArray2_Uint8Array_t,string>) => JSX.Element } = HooksBS.DD
+export const DD: { make: React.ComponentType<{ readonly array: Js_TypedArray2_Uint8Array_t; readonly name: string }> } = HooksBS.DD
 
-export const Another: { anotherComponent: (_1:Another_props<vehicle,(() => void)>) => JSX.Element } = HooksBS.Another
+export const Another: { anotherComponent: React.ComponentType<{ readonly vehicle: vehicle; readonly callback: () => void }> } = HooksBS.Another
 
-export const Poly: { polymorphicComponent: <T1>(_1:Poly_props<[vehicle, T1]>) => JSX.Element } = HooksBS.Poly
+export const Poly: { polymorphicComponent: React.ComponentType<{ readonly p: [vehicle, any] }> } = HooksBS.Poly

jscomp/gentype_tests/typescript-react-example/src/ImportHookDefault.gen.tsx

@@ -7,16 +7,32 @@ import {default as makeNotChecked} from './hookExample';
 import {default as defaultNotChecked} from './hookExample';
 
 // In case of type error, check the type of 'make' in 'ImportHookDefault.re' and './hookExample'.
-export const makeTypeChecked: (_1:props<person,JSX.Element,ImportHooks_renderMe<string>>) => JSX.Element = makeNotChecked;
+export const makeTypeChecked: React.ComponentType<{
+  readonly person: person; 
+  readonly children: React.ReactNode; 
+  readonly renderMe: ImportHooks_renderMe<string>
+}> = makeNotChecked;
 
 // Export 'make' early to allow circular import from the '.bs.js' file.
-export const make: unknown = makeTypeChecked as (_1:props<person,JSX.Element,ImportHooks_renderMe<string>>) => JSX.Element;
+export const make: unknown = makeTypeChecked as React.ComponentType<{
+  readonly person: person; 
+  readonly children: React.ReactNode; 
+  readonly renderMe: ImportHooks_renderMe<string>
+}>;
 
 // In case of type error, check the type of 'default' in 'ImportHookDefault.re' and './hookExample'.
-export const defaultTypeChecked: (_1:MM_props<person,JSX.Element,ImportHooks_renderMe<string>>) => JSX.Element = defaultNotChecked;
+export const defaultTypeChecked: React.ComponentType<{
+  readonly person: person; 
+  readonly children: React.ReactNode; 
+  readonly renderMe: ImportHooks_renderMe<string>
+}> = defaultNotChecked;
 
 // Export '$$default' early to allow circular import from the '.bs.js' file.
-export const $$default: unknown = defaultTypeChecked as (_1:MM_props<person,JSX.Element,ImportHooks_renderMe<string>>) => JSX.Element;
+export const $$default: unknown = defaultTypeChecked as React.ComponentType<{
+  readonly person: person; 
+  readonly children: React.ReactNode; 
+  readonly renderMe: ImportHooks_renderMe<string>
+}>;
 
 import type {renderMe as ImportHooks_renderMe} from './ImportHooks.gen';
 

jscomp/gentype_tests/typescript-react-example/src/ImportHooks.gen.tsx

@@ -7,10 +7,20 @@ import {makeRenamed as makeRenamedNotChecked} from './hookExample';
 import {foo as fooNotChecked} from './hookExample';
 
 // In case of type error, check the type of 'makeRenamed' in 'ImportHooks.re' and './hookExample'.
-export const makeRenamedTypeChecked: <a>(_1:props<JSX.Element,person,JSX.Element,renderMe<a>>) => JSX.Element = makeRenamedNotChecked;
+export const makeRenamedTypeChecked: React.ComponentType<{
+  readonly actions?: JSX.Element; 
+  readonly person: person; 
+  readonly children: React.ReactNode; 
+  readonly renderMe: renderMe<any>
+}> = makeRenamedNotChecked;
 
 // Export 'makeRenamed' early to allow circular import from the '.bs.js' file.
-export const makeRenamed: unknown = makeRenamedTypeChecked as <a>(_1:props<JSX.Element,person,JSX.Element,renderMe<a>>) => JSX.Element;
+export const makeRenamed: unknown = makeRenamedTypeChecked as React.ComponentType<{
+  readonly actions?: JSX.Element; 
+  readonly person: person; 
+  readonly children: React.ReactNode; 
+  readonly renderMe: renderMe<any>
+}>;
 
 // In case of type error, check the type of 'foo' in 'ImportHooks.re' and './hookExample'.
 export const fooTypeChecked: (_1:{ readonly person: person }) => string = fooNotChecked;

jscomp/gentype_tests/typescript-react-example/src/ImportIndex.gen.tsx

@@ -5,10 +5,10 @@
 import {default as defaultNotChecked} from './';
 
 // In case of type error, check the type of 'default' in 'ImportIndex.re' and './'.
-export const defaultTypeChecked: (_1:props<"push" | "replace">) => JSX.Element = defaultNotChecked;
+export const defaultTypeChecked: React.ComponentType<{ readonly method?: "push" | "replace" }> = defaultNotChecked;
 
 // Export '$$default' early to allow circular import from the '.bs.js' file.
-export const $$default: unknown = defaultTypeChecked as (_1:props<"push" | "replace">) => JSX.Element;
+export const $$default: unknown = defaultTypeChecked as React.ComponentType<{ readonly method?: "push" | "replace" }>;
 
 // tslint:disable-next-line:interface-over-type-literal
 export type props<method> = { readonly key?: string; readonly method?: method };

jscomp/gentype_tests/typescript-react-example/src/MyInput.gen.tsx

@@ -5,10 +5,10 @@
 import {default as defaultNotChecked} from './MyInput';
 
 // In case of type error, check the type of 'default' in 'MyInput.re' and './MyInput'.
-export const defaultTypeChecked: (_1:props<((_1:inputFocusEvent) => void)>) => JSX.Element = defaultNotChecked;
+export const defaultTypeChecked: React.ComponentType<{ readonly onFocus?: (_1:inputFocusEvent) => void }> = defaultNotChecked;
 
 // Export '$$default' early to allow circular import from the '.bs.js' file.
-export const $$default: unknown = defaultTypeChecked as (_1:props<((_1:inputFocusEvent) => void)>) => JSX.Element;
+export const $$default: unknown = defaultTypeChecked as React.ComponentType<{ readonly onFocus?: (_1:inputFocusEvent) => void }>;
 
 import type {inputFocusEvent as $$inputFocusEvent} from './shims/ReactEvent.shim';
 

jscomp/gentype_tests/typescript-react-example/src/OnClick2.gen.tsx

@@ -9,4 +9,4 @@ const OnClick2BS: any = OnClick2BS__Es6Import;
 // tslint:disable-next-line:interface-over-type-literal
 export type props<onClick> = { readonly key?: string; readonly onClick: onClick };
 
-export const make: (_1:props<((_1:MouseEvent) => void)>) => JSX.Element = OnClick2BS.make;
+export const make: React.ComponentType<{ readonly onClick: (_1:MouseEvent) => void }> = OnClick2BS.make;