ArgsTable doesn't show Children

[Bowriverstudio]

Describe the bug

import React, { FC } from "react";

type Props = {
  title?: string;
};

const TestComp: FC<Props> = ({ title="Hello", children }) => {
return (
    <>
      {title}
      {children}
    </>
  );
}

In my story file.

<ArgsTable of={TestComp} />

Which Results in:

I expect to see the Children

System
Environment Info:

System:
OS: macOS 11.2.3
CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
Binaries:
Node: 14.17.6 - /usr/local/bin/node
Yarn: 1.22.10 - /usr/local/bin/yarn
npm: 8.1.1 - /usr/local/bin/npm
Browsers:
Chrome: 99.0.4844.51
Edge: 99.0.1150.39
Safari: 14.0.3
npmPackages:
@storybook/addon-a11y: ^6.4.19 => 6.4.19
@storybook/addon-console: ^1.2.3 => 1.2.3
@storybook/addon-docs: ^6.4.19 => 6.4.19
@storybook/addon-essentials: ^6.4.19 => 6.4.19
@storybook/builder-webpack5: ^6.4.19 => 6.4.19
@storybook/manager-webpack5: ^6.4.19 => 6.4.19
@storybook/react: ^6.4.19 => 6.4.19

[shilman]

We’re cleaning house! Storybook has changed a lot since this issue was created and we don’t know if it’s still valid. Please open a new issue referencing this one if:

• this is still a problem in SB 7.x
• you can provide a consistent reproduction in 7.x (at https://storybook.new/ or per repro docs).

[developerdanwu]

If anyone comes across I added skipChildrenPropWithoutDoc: false to my config object in .storybook/main.ts and all the children props came back. Seems you only need to specify this if you use the old ArgsTable. The new Controls table in storybook 7 is fine.

const config: StorybookConfig = {
  typescript: {
    reactDocgen: 'react-docgen-typescript',
    reactDocgenTypescriptOptions: {
      skipChildrenPropWithoutDoc: false,
      tsconfigPath: './tsconfig.json',
      propFilter: (prop) => {
        if (prop.name === 'children') {
          return true;
        }

        if (prop.parent) {
          return (
            !/@types\/react/.test(prop.parent.fileName) &&
            !/@emotion/.test(prop.parent.fileName)
          );
        }
        return true;
      },
    },
  },
  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
   ...
};