feat: Adds option create write typings to top-level (#116)

This options adds the ability to create typings definition which could be used to add them to npm
packages

Author: KnisterPeter

README.md

@@ -36,7 +36,11 @@ npm install -g react-to-typescript-definitions
 ## CLI
 
 ```sh
+# Create a definition which exports a module named 'module-name'
 cat <some/react/component.jsx> |react2dts --name module-name
+
+# Create a definition which exports top level definitions
+cat <some/react/component.jsx> |react2dts --top-level-module
 ```
 
 ## API

cli.js

@@ -3,7 +3,11 @@ var react2dts = require('./index');
 var minimist = require('minimist');
 
 var options = minimist(process.argv.slice(2), {
-  string: ['name']
+  string: ['name', 'module-name'],
+  boolean: ['top-level-module'],
+  alias: {
+    'module-name': 'name'
+  }
 });
 
 react2dts.cli(options);

index.ts

@@ -46,19 +46,22 @@ export function cli(options: any): void {
     }
   });
   process.stdin.on('end', () => {
-    if (!options.name) {
-      console.error('Failed to specify --name parameter');
+    if (options['top-level-module']) {
+      process.stdout.write(generateFromSource(null, stdinCode.join('')));
+    } else if (options['module-name']) {
+      process.stdout.write(generateFromSource(options['module-name'], stdinCode.join('')));
+    } else {
+      console.error('Failed to specify --module-name or --top-level-module parameter');
       process.exit(1);
     }
-    process.stdout.write(generateFromSource(options.name, stdinCode.join('')));
   });
 }
 
-export function generateFromFile(name: string, path: string, options?: IOptions): string {
-  return generateFromSource(name, fs.readFileSync(path).toString(), options);
+export function generateFromFile(moduleName: string, path: string, options?: IOptions): string {
+  return generateFromSource(moduleName, fs.readFileSync(path).toString(), options);
 }
 
-export function generateFromSource(name: string, code: string, options: IOptions = {}): string {
+export function generateFromSource(moduleName: string, code: string, options: IOptions = {}): string {
   const ast: any = babylon.parse(code, {
     sourceType: 'module',
     allowReturnOutsideFunction: true,
@@ -81,15 +84,16 @@ export function generateFromSource(name: string, code: string, options: IOptions
       'functionSent'
     ]
   });
-  return generateFromAst(name, ast, options);
+  return generateFromAst(moduleName, ast, options);
 }
 
 const defaultInstanceOfResolver: InstanceOfResolver = (name: string): string => undefined;
 
-export function generateFromAst(name: string, ast: any, options: IOptions = {}): string {
+export function generateFromAst(moduleName: string, ast: any, options: IOptions = {}): string {
   const {exportType, classname, propTypes}: IParsingResult = parseAst(ast, options.instanceOfResolver);
   const generator: Generator = options.generator || new Generator();
-  generator.declareModule(name, () => {
+
+  const generateTypings: () => void = () => {
     generator.import('* as React', 'react');
     if (propTypes) {
       Object.keys(propTypes).forEach((propName: string) => {
@@ -105,7 +109,13 @@ export function generateFromAst(name: string, ast: any, options: IOptions = {}):
     generator.exportDeclaration(exportType, () => {
       generator.class(classname, !!propTypes);
     });
-  });
+  };
+
+  if (moduleName === null) {
+    generateTypings();
+  } else {
+    generator.declareModule(moduleName, generateTypings);
+  }
   return generator.toString();
 }
 

tests/es7-class-top-level-module.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import Message from './path/to/Message';
+
+export interface ComponentProps {
+	/**
+	 * This is a jsdoc comment for optionalAny.
+	 */
+	optionalAny?: any;
+	optionalArray?: any[];
+	optionalBool?: boolean;
+	optionalFunc?: (...args: any[]) => any;
+	optionalNumber?: number;
+	optionalObject?: Object;
+	optionalString?: string;
+	optionalNode?: React.ReactNode;
+	optionalElement?: React.ReactElement<any>;
+	optionalMessage?: typeof Message;
+	optionalUnion?: string|number;
+	optionalArrayOf?: number[];
+	requiredFunc: (...args: any[]) => any;
+	requiredAny: any;
+	requiredUnion: any[]|boolean;
+	requiredArrayOf: string[];
+}
+
+export default class Component extends React.Component<ComponentProps, any> {
+}

tests/parsing-test.ts

@@ -23,4 +23,13 @@ describe('Parsing', () => {
       fs.readFileSync(path.join(__dirname, 'es7-class.d.ts')).toString()
     );
   });
+  it('should create top-level module definition from es7 class component', () => {
+    const opts: react2dts.IOptions = {
+      instanceOfResolver: (name: string): string => './path/to/Message'
+    };
+    assert.equal(
+      react2dts.generateFromFile(null, path.join(__dirname, 'es7-class.jsx'), opts),
+      fs.readFileSync(path.join(__dirname, 'es7-class-top-level-module.d.ts')).toString()
+    );
+  });
 });

tsconfig.json

@@ -10,6 +10,7 @@
   "exclude": [
     "node_modules",
     "tests/es6-class.d.ts",
-    "tests/es7-class.d.ts"
+    "tests/es7-class.d.ts",
+    "tests/es7-class-top-level-module.d.ts"
   ]
 }