Merge branch 'master' into greenkeeper/@types/react-15.0.17

Author: KnisterPeter

CHANGELOG.md

@@ -2,6 +2,23 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+<a name="0.20.0"></a>
+# [0.20.0](https://github.com/knisterpeter/react-to-typescript-definitions/compare/v0.19.1...v0.20.0) (2017-03-21)
+
+
+### Bug Fixes
+
+* **package:** update babel-generator to version 6.24.0 ([20b8840](https://github.com/knisterpeter/react-to-typescript-definitions/commit/20b8840))
+* **package:** update dts-dom to version 0.1.16 ([2b0cf25](https://github.com/knisterpeter/react-to-typescript-definitions/commit/2b0cf25))
+* **package:** update pascal-case to version 2.0.1 ([fe8ad84](https://github.com/knisterpeter/react-to-typescript-definitions/commit/fe8ad84))
+
+
+### Features
+
+* handle array props with shapes in extractComplexTypes ([efb0fa8](https://github.com/knisterpeter/react-to-typescript-definitions/commit/efb0fa8))
+
+
+
 <a name="0.19.1"></a>
 ## [0.19.1](https://github.com/knisterpeter/react-to-typescript-definitions/compare/v0.19.0...v0.19.1) (2017-03-02)
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-to-typescript-definitions",
-  "version": "0.19.1",
+  "version": "0.20.0",
   "description": "Create typescript definitions files (d.ts) from react components",
   "main": "dist/src/index.js",
   "bin": {

src/typings.ts

@@ -126,23 +126,25 @@ function extractComplexTypes(m: dom.ModuleDeclaration, interf: dom.InterfaceDecl
     if (member.kind === 'property' && isExtractableType(member.type)) {
       const name = `${componentName}${pascalCase(member.name)}`;
       const extractedMember = createModuleMember(name, member.type);
-      extractedMember.flags = dom.DeclarationFlags.Export;
-      m.members.push(extractedMember);
-      member.type = dom.create.namedTypeReference(name);
+      if (extractedMember) {
+        extractedMember.flags = dom.DeclarationFlags.Export;
+        m.members.push(extractedMember);
+        member.type = createTypeReference(name, member.type);
+      }
     }
   });
 }
 
-type ExtractableType = dom.UnionType | dom.IntersectionType | dom.ObjectType;
+type ExtractableType = dom.UnionType | dom.IntersectionType | dom.ObjectType | dom.ArrayTypeReference;
 
 function isExtractableType(type: dom.Type): type is ExtractableType {
   if (typeof type === 'object') {
-    return ['union', 'intersection', 'object'].indexOf(type.kind) > -1;
+    return ['union', 'intersection', 'object', 'array'].indexOf(type.kind) > -1;
   }
   return false;
 }
 
-function createModuleMember(name: string, type: ExtractableType): dom.ModuleMember {
+function createModuleMember(name: string, type: ExtractableType): dom.ModuleMember | undefined {
   switch (type.kind) {
     case 'intersection':
     case 'union':
@@ -151,6 +153,17 @@ function createModuleMember(name: string, type: ExtractableType): dom.ModuleMemb
       const interf = dom.create.interface(name);
       interf.members = type.members;
       return interf;
+    case 'array':
+      return isExtractableType(type.type) ? createModuleMember(name, type.type) : undefined;
+  }
+}
+
+function createTypeReference(name: string, type: ExtractableType): dom.TypeReference {
+  const namedTypeReference = dom.create.namedTypeReference(name);
+  if (type.kind === 'array') {
+    return dom.create.array(namedTypeReference);
+  } else {
+    return namedTypeReference;
   }
 }
 

tests/es6-class.d.ts

@@ -14,6 +14,17 @@ declare module 'component' {
 
   export type ComponentRequiredUnion = any[] | boolean;
 
+  export interface ComponentRequiredArrayOfObjectsWithShape {
+    color?: string;
+    fontSize?: number;
+  }
+
+  export interface ComponentDeeplyNested {
+    arrayInDeeplyNested?: {
+      foo?: number;
+    }[];
+  }
+
   export interface ComponentProps {
     /**
      * This is a jsdoc comment for optionalAny.
@@ -36,10 +47,8 @@ declare module 'component' {
     requiredAny: any;
     requiredUnion: ComponentRequiredUnion;
     requiredArrayOf: string[];
-    requiredArrayOfObjectsWithShape: {
-      color?: string;
-      fontSize?: number;
-    }[];
+    requiredArrayOfObjectsWithShape: ComponentRequiredArrayOfObjectsWithShape[];
+    deeplyNested: ComponentDeeplyNested[];
     requiredSymbol: typeof Symbol;
   }
 

tests/es6-class.jsx

@@ -45,5 +45,10 @@ Component.propTypes = {
 		color: React.PropTypes.string,
 		fontSize: React.PropTypes.number
 	})).isRequired,
+	deeplyNested: React.PropTypes.arrayOf(React.PropTypes.shape({
+		arrayInDeeplyNested: React.PropTypes.arrayOf(React.PropTypes.shape({
+			foo: React.PropTypes.number
+		}))
+	})).isRequired,
 	requiredSymbol: React.PropTypes.symbol.isRequired,
 };