Display or link nested types/interfaces

[Christos-Zacharopoulos]

It would be nice to have some way to display nested types or link them.

Example:

Clicky clicky to Row or ExtendedColumn should display the nested type or redirect to a page for this type or something.

After investigating on how to do this, I found these issues:

storybookjs/storybook#13459
storybookjs/storybook#7944
storybookjs/storybook#15008
storybookjs/storybook#13459

If any of these get resolve then Bob's your uncle.

[mrose-acertus]

I read in the related issues that the holdup is react-docgen-typescript? May I propose a simpler solution? Extracting the details of interfaces in any given TypeScript source file is pretty straightforward....

const ts = require("typescript");

export const describeInterfaces = (filePath) => {
    const program = ts.createProgram([ filePath ], {
        allowJs: true
    });
    const sourceFile = program.getSourceFile(filePath);
    const typeChecker = program.getTypeChecker();
    ts.forEachChild(sourceFile, node => {
        if (node.kind !== ts.SyntaxKind.InterfaceDeclaration) {
            return;
        }
        const interfaceName = node.name.escapedText;
        console.log(interfaceName);
        node.members.forEach(member => {
            const memberName = member.name.escapedText;
            const memberType = typeChecker.getTypeAtLocation(member.type);
            const memberTypeName = typeChecker.typeToString(memberType);
            console.log("\t" + memberName + " : " + memberTypeName);
        })
    });
};

A DocBlock that provided a capability like this would be awesome....

[dcantu96]

This would be amazing and super useful!

[Dina-Lai]

I really need this!