Add support for rendering nested IndexSignatures

packages/react-docs/src/components/interface.tsx

@@ -2,7 +2,7 @@ import * as _ from 'lodash';
 import * as React from 'react';
 
 import { DocsInfo } from '../docs_info';
-import { CustomType, TypeDocTypes } from '../types';
+import { CustomType } from '../types';
 
 import { Signature } from './signature';
 import { Type } from './type';
@@ -19,9 +19,7 @@ export const Interface = (props: InterfaceProps) => {
         return (
             <span key={`property-${property.name}-${property.type}-${type.name}`}>
                 {property.name}:{' '}
-                {property.type && property.type.typeDocType !== TypeDocTypes.Reflection ? (
-                    <Type type={property.type} sectionName={props.sectionName} docsInfo={props.docsInfo} />
-                ) : (
+                {property.type && !_.isUndefined(property.type.method) ? (
                     <Signature
                         name={property.type.method.name}
                         returnType={property.type.method.returnType}
@@ -32,6 +30,8 @@ export const Interface = (props: InterfaceProps) => {
                         shouldUseArrowSyntax={true}
                         docsInfo={props.docsInfo}
                     />
+                ) : (
+                    <Type type={property.type} sectionName={props.sectionName} docsInfo={props.docsInfo} />
                 )},
             </span>
         );

packages/react-docs/src/components/signature.tsx

@@ -3,7 +3,6 @@ import * as React from 'react';
 
 import { DocsInfo } from '../docs_info';
 import { Parameter, Type as TypeDef, TypeDefinitionByName, TypeParameter } from '../types';
-import { constants } from '../utils/constants';
 
 import { Type } from './type';
 

packages/react-docs/src/components/type.tsx

@@ -93,19 +93,38 @@ export function Type(props: TypeProps): any {
             break;
 
         case TypeDocTypes.Reflection:
-            typeName = (
-                <Signature
-                    name={type.method.name}
-                    returnType={type.method.returnType}
-                    parameters={type.method.parameters}
-                    typeParameter={type.method.typeParameter}
-                    sectionName={props.sectionName}
-                    shouldHideMethodName={true}
-                    shouldUseArrowSyntax={true}
-                    docsInfo={props.docsInfo}
-                    typeDefinitionByName={props.typeDefinitionByName}
-                />
-            );
+            if (!_.isUndefined(type.method)) {
+                typeName = (
+                    <Signature
+                        name={type.method.name}
+                        returnType={type.method.returnType}
+                        parameters={type.method.parameters}
+                        typeParameter={type.method.typeParameter}
+                        sectionName={props.sectionName}
+                        shouldHideMethodName={true}
+                        shouldUseArrowSyntax={true}
+                        docsInfo={props.docsInfo}
+                        typeDefinitionByName={props.typeDefinitionByName}
+                    />
+                );
+            } else if (!_.isUndefined(type.indexSignature)) {
+                const is = type.indexSignature;
+                const param = (
+                    <span key={`indexSigParams-${is.keyName}-${is.keyType}-${type.name}`}>
+                        {is.keyName}:{' '}
+                        <Type type={is.keyType} sectionName={props.sectionName} docsInfo={props.docsInfo} />
+                    </span>
+                );
+                typeName = (
+                    <span key={`indexSignature-${type.name}-${is.keyType.name}`}>
+                        {'{'}[{param}]: {is.valueName}
+                        {'}'}
+                    </span>
+                );
+            } else {
+                throw new Error(`Unrecognized Reflection type that isn't a Method nor an Index Signature`);
+            }
+
             break;
 
         case TypeDocTypes.TypeParameter:

packages/react-docs/src/types.ts

@@ -35,6 +35,7 @@ export interface TypeDocType {
     typeArguments?: TypeDocType[];
     declaration: TypeDocNode;
     elementType?: TypeDocType;
+    indexSignature?: TypeDocNode;
 }
 
 export interface TypeDocFlags {
@@ -64,7 +65,7 @@ export interface TypeDocNode {
     returns?: string;
     declaration: TypeDocNode;
     flags?: TypeDocFlags;
-    indexSignature?: TypeDocNode | TypeDocNode[]; // TypeDocNode in TypeDoc <V0.9.0, TypeDocNode[] in >V0.9.0
+    indexSignature?: TypeDocNode;
     signatures?: TypeDocNode[];
     parameters?: TypeDocNode[];
     typeParameter?: TypeDocNode[];
@@ -156,6 +157,7 @@ export interface Type {
     elementType?: ElementType;
     types?: Type[];
     method?: TypescriptMethod;
+    indexSignature?: IndexSignature;
 }
 
 export interface ElementType {

packages/react-docs/src/utils/typedoc_utils.ts

@@ -63,9 +63,12 @@ export const typeDocUtils = {
         const exportPathToTypedocName = generatedDocJson.metadata.exportPathToTypedocName;
         const typeDocJson = generatedDocJson.typedocJson;
 
-        const typeDocNameOrder = _.map(exportPathOrder, exportPath => {
-            return exportPathToTypedocName[exportPath];
-        });
+        // TODO: Extract the non typeDoc exports, and render them somehow
+        const typeDocNameOrder = _.compact(
+            _.map(exportPathOrder, exportPath => {
+                return exportPathToTypedocName[exportPath];
+            }),
+        );
 
         const docAgnosticFormat: DocAgnosticFormat = {};
         const typeEntities: TypeDocNode[] = [];
@@ -111,14 +114,16 @@ export const typeDocUtils = {
                 }
             });
         });
-        docsInfo.sections[constants.TYPES_SECTION_NAME] = constants.TYPES_SECTION_NAME;
-        docsInfo.menu[constants.TYPES_SECTION_NAME] = [constants.TYPES_SECTION_NAME];
-        const docSection = typeDocUtils._convertEntitiesToDocSection(
-            typeEntities,
-            docsInfo,
-            constants.TYPES_SECTION_NAME,
-        );
-        docAgnosticFormat[constants.TYPES_SECTION_NAME] = docSection;
+        if (!_.isEmpty(typeEntities)) {
+            docsInfo.sections[constants.TYPES_SECTION_NAME] = constants.TYPES_SECTION_NAME;
+            docsInfo.menu[constants.TYPES_SECTION_NAME] = [constants.TYPES_SECTION_NAME];
+            const docSection = typeDocUtils._convertEntitiesToDocSection(
+                typeEntities,
+                docsInfo,
+                constants.TYPES_SECTION_NAME,
+            );
+            docAgnosticFormat[constants.TYPES_SECTION_NAME] = docSection;
+        }
 
         return docAgnosticFormat;
     },
@@ -218,13 +223,7 @@ export const typeDocUtils = {
             ? typeDocUtils._convertMethod(entity.declaration, isConstructor, sections, sectionName, docId)
             : undefined;
         const doesIndexSignatureExist = !_.isUndefined(entity.indexSignature);
-        const isIndexSignatureArray = _.isArray(entity.indexSignature);
-        // HACK: TypeDoc Versions <0.9.0 indexSignature is of type TypeDocNode[]
-        // Versions >0.9.0 have it as type TypeDocNode
-        const indexSignature =
-            doesIndexSignatureExist && isIndexSignatureArray
-                ? (entity.indexSignature as TypeDocNode[])[0]
-                : (entity.indexSignature as TypeDocNode);
+        const indexSignature = entity.indexSignature as TypeDocNode;
         const indexSignatureIfExists = doesIndexSignatureExist
             ? typeDocUtils._convertIndexSignature(indexSignature, sections, sectionName, docId)
             : undefined;
@@ -305,6 +304,9 @@ export const typeDocUtils = {
         sectionName: string,
         docId: string,
     ): TypescriptMethod {
+        if (_.isUndefined(entity.signatures)) {
+            console.log(entity);
+        }
         const signature = entity.signatures[0];
         const source = entity.sources[0];
         const hasComment = !_.isUndefined(signature.comment);
@@ -436,9 +438,17 @@ export const typeDocUtils = {
         });
 
         const isConstructor = false;
-        const methodIfExists = !_.isUndefined(entity.declaration)
-            ? typeDocUtils._convertMethod(entity.declaration, isConstructor, sections, sectionName, docId)
-            : undefined;
+        const doesIndexSignatureExist =
+            !_.isUndefined(entity.declaration) && !_.isUndefined(entity.declaration.indexSignature);
+        let indexSignatureIfExists;
+        if (doesIndexSignatureExist) {
+            const indexSignature = entity.declaration.indexSignature as TypeDocNode;
+            indexSignatureIfExists = typeDocUtils._convertIndexSignature(indexSignature, sections, sectionName, docId);
+        }
+        const methodIfExists =
+            !_.isUndefined(entity.declaration) && !doesIndexSignatureExist
+                ? typeDocUtils._convertMethod(entity.declaration, isConstructor, sections, sectionName, docId)
+                : undefined;
 
         const elementTypeIfExists = !_.isUndefined(entity.elementType)
             ? {
@@ -455,6 +465,7 @@ export const typeDocUtils = {
             elementType: elementTypeIfExists,
             types,
             method: methodIfExists,
+            indexSignature: indexSignatureIfExists,
         };
         return type;
     },