Storybookの @storybook/addon-info で props table が表示されない！！

Storybook + React(TypeScript) の環境で「@storybook/addon-info」と「react-docgen-typescript-loader」を使用して、コンポーネントが受け取るpropsの情報をドキュメントとして生成する事ができるが、特定のコンポーネントでのみ propTables が生成できない問題が発生した。

かなりハマって時間を費やしたが、ちゃっかり「react-docgen-typescript-loader」のREADMに対応方法が書いてあった。

github.com

デフォルトでコンポーネントをエクスポートするだけでなく、名前付きエクスポートもしないとドキュメントが生成されないとの事。

import React, { FC } from 'react';

type Props = {
  text: string;
};

// ここで個別にもエクスポートする必要がある
export const Hoge: FC<Props> = props => {
  const { text } = props;

  return <div>{text}</div>;
};

export default Hoge;

これで直面した問題の解決ができた。