React: Add test for react-docgen FC

code/renderers/react/template/stories/docgen-components/ts-react-fc/argTypes.snapshot

@@ -0,0 +1,3 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties ts-react-fc 1`] = `Object {}`;

code/renderers/react/template/stories/docgen-components/ts-react-fc/docgen.snapshot

@@ -0,0 +1,33 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties ts-react-fc 1`] = `
+"import React from 'react';
+function concat(a, b) {
+  return a + b;
+}
+var DefaultEnum = /*#__PURE__*/function (DefaultEnum) {
+  DefaultEnum[DefaultEnum[\\"TopLeft\\"] = 0] = \\"TopLeft\\";
+  DefaultEnum[DefaultEnum[\\"TopRight\\"] = 1] = \\"TopRight\\";
+  DefaultEnum[DefaultEnum[\\"TopCenter\\"] = 2] = \\"TopCenter\\";
+  return DefaultEnum;
+}(DefaultEnum || {});
+var NumericEnum = /*#__PURE__*/function (NumericEnum) {
+  NumericEnum[NumericEnum[\\"TopLeft\\"] = 0] = \\"TopLeft\\";
+  NumericEnum[NumericEnum[\\"TopRight\\"] = 1] = \\"TopRight\\";
+  NumericEnum[NumericEnum[\\"TopCenter\\"] = 2] = \\"TopCenter\\";
+  return NumericEnum;
+}(NumericEnum || {});
+var StringEnum = /*#__PURE__*/function (StringEnum) {
+  StringEnum[\\"TopLeft\\"] = \\"top-left\\";
+  StringEnum[\\"TopRight\\"] = \\"top-right\\";
+  StringEnum[\\"TopCenter\\"] = \\"top-center\\";
+  return StringEnum;
+}(StringEnum || {});
+export const TypeScriptProps = () => /*#__PURE__*/React.createElement(\\"div\\", null, \\"TypeScript!\\");
+export const component = TypeScriptProps;
+TypeScriptProps.__docgenInfo = {
+  \\"description\\": \\"\\",
+  \\"methods\\": [],
+  \\"displayName\\": \\"TypeScriptProps\\"
+};"
+`;

code/renderers/react/template/stories/docgen-components/ts-react-fc/input.tsx

@@ -0,0 +1,97 @@
+import type { FC } from 'react';
+import React from 'react';
+
+function concat(a: string, b: string): string {
+  return a + b;
+}
+
+interface ItemInterface {
+  text: string;
+  value: string;
+}
+
+interface PersonInterface {
+  name: string;
+}
+
+type InterfaceIntersection = ItemInterface & PersonInterface;
+
+interface GenericInterface<T> {
+  value: T;
+}
+
+enum DefaultEnum {
+  TopLeft,
+  TopRight,
+  TopCenter,
+}
+
+enum NumericEnum {
+  TopLeft = 0,
+  TopRight,
+  TopCenter,
+}
+
+enum StringEnum {
+  TopLeft = 'top-left',
+  TopRight = 'top-right',
+  TopCenter = 'top-center',
+}
+
+type EnumUnion = DefaultEnum | NumericEnum;
+
+type StringLiteralUnion = 'top-left' | 'top-right' | 'top-center';
+type NumericLiteralUnion = 0 | 1 | 2;
+
+type StringAlias = string;
+type NumberAlias = number;
+type AliasesIntersection = StringAlias & NumberAlias;
+type AliasesUnion = StringAlias | NumberAlias;
+interface GenericAlias<T> {
+  value: T;
+}
+
+interface TypeScriptPropsProps {
+  any: any;
+  string: string;
+  bool: boolean;
+  number: number;
+  voidFunc: () => void;
+  funcWithArgsAndReturns: (a: string, b: string) => string;
+  funcWithunionArg: (a: string | number) => string;
+  funcWithMultipleUnionReturns: () => string | ItemInterface;
+  funcWithIndexTypes: <T, K extends keyof T>(o: T, propertyNames: K[]) => T[K][];
+  symbol: symbol;
+  interface: ItemInterface;
+  genericInterface: GenericInterface<string>;
+  arrayOfPrimitive: string[];
+  arrayOfComplexObject: ItemInterface[];
+  tupleOfPrimitive: [string, number];
+  tupleWithComplexType: [string, ItemInterface];
+  defaultEnum: DefaultEnum;
+  numericEnum: NumericEnum;
+  stringEnum: StringEnum;
+  enumUnion: EnumUnion;
+  recordOfPrimitive: Record<string, number>;
+  recordOfComplexObject: Record<string, ItemInterface>;
+  intersectionType: InterfaceIntersection;
+  intersectionWithInlineType: ItemInterface & { inlineValue: string };
+  unionOfPrimitive: string | number;
+  unionOfComplexType: ItemInterface | InterfaceIntersection;
+  nullablePrimitive?: string;
+  nullableComplexType?: ItemInterface;
+  nullableComplexTypeUndefinedDefaultValue?: ItemInterface;
+  readonly readonlyPrimitive: string;
+  typeAlias: StringAlias;
+  aliasesIntersection: AliasesIntersection;
+  aliasesUnion: AliasesUnion;
+  genericAlias: GenericAlias<string>;
+  namedStringLiteralUnion: StringLiteralUnion;
+  inlinedStringLiteralUnion: 'bottom-left' | 'bottom-right' | 'bottom-center';
+  namedNumericLiteralUnion: NumericLiteralUnion;
+  inlinedNumericLiteralUnion: 0 | 1 | 2;
+}
+
+export const TypeScriptProps: FC<TypeScriptPropsProps> = () => <div>TypeScript!</div>;
+
+export const component = TypeScriptProps;

code/renderers/react/template/stories/docgen-components/ts-react-fc/properties.snapshot

@@ -0,0 +1,7 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`react component properties ts-react-fc 1`] = `
+Object {
+  "rows": Array [],
+}
+`;

code/renderers/react/template/stories/ts-argtypes.stories.tsx

@@ -25,6 +25,7 @@ import { component as TsComponentPropsComponent } from './docgen-components/9922
 import { component as TsJsdocComponent } from './docgen-components/ts-jsdoc/input';
 import { component as TsTypesComponent } from './docgen-components/ts-types/input';
 import { component as TsHtmlComponent } from './docgen-components/ts-html/input';
+import { component as TsFCComponent } from './docgen-components/ts-react-fc/input';
 
 export default {
   component: {},
@@ -78,6 +79,8 @@ export const TsComponentProps = { parameters: { component: TsComponentPropsCompo
 
 export const TsJsdoc = { parameters: { component: TsJsdocComponent } };
 
+export const TsFC = { parameters: { component: TsFCComponent } };
+
 const addChromaticIgnore = async (element: HTMLElement) => {
   const row = element.parentElement?.parentElement;
   if (row?.nodeName === 'TR') {