Skip to content

No props data outputted for components typed with React.FC<> #393

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
juzerzarif opened this issue Oct 15, 2021 · 7 comments
Closed

No props data outputted for components typed with React.FC<> #393

juzerzarif opened this issue Oct 15, 2021 · 7 comments
Labels
stale There is no activity for a long time.

Comments

@juzerzarif
Copy link

Hi, I have a component that looks like this

interface Props {
  a: string;
  b: number;
}

const MyComponent: React.FC<Props> = (props) => {...}

export default MyComponent

When parsing props for this component I get no props output => require('react-docgen-typescript').parse(...) returns an empty array.
Changing to the following returns props as expected:

const MyComponentt = (props: Props) => {...}

Would it be possible to support the React.FC type assignment as well? That is my preferred way to type my functional components since it takes care of typing things like props.children correctly without an explicit field in the interface.

@273403986
Copy link

I have the same problem, whether we can support this way

@MilesWellsSVT
Copy link

I've run into the same problem in storybook attempting to create a guide for our customized react-bootstrap components. I've yet to discover a workaround.

Potentially related issues I found when trying to resolve this problem:
storybookjs/storybook#14118
#323

This is outside my domain of expertise but if a steward of this repo could point me to a good starting place I could make an attempt at a PR.

@MilesWellsSVT
Copy link

MilesWellsSVT commented Oct 29, 2021

After poking around the repo a bit I've discovered several tests actually do use React.FC and are successful. #323 appears to be the culprit.

@upalatucci
Copy link

upalatucci commented Feb 10, 2022

Yes. I can confirm this. I had the same issue and using this import * as React from 'react'; instead of import React from 'react'; works

@splunkmoody
Copy link

Can confirm the solution @upalatucci provided worked for me. Thank you so much for finding that!

@github-actions
Copy link

There was no activity for a long time. The issue will be closed soon.

@github-actions github-actions bot added the stale There is no activity for a long time. label Mar 29, 2023
@github-actions
Copy link

github-actions bot commented Apr 5, 2023

Closing this issue as obsolete.

@github-actions github-actions bot closed this as completed Apr 5, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
stale There is no activity for a long time.
Projects
None yet
Development

No branches or pull requests

5 participants