Skip to content
New issue

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

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

Already on GitHub? # to your account

Typescript: Component props not parsed with 'call signature' type #897

Open
isaac-y-baron opened this issue Feb 6, 2024 · 0 comments
Open

Comments

@isaac-y-baron
Copy link

Description

In Typescript, it's possible to type a function using a call signature.

For example, this is valid TS:

interface A {
  foo: string;
}

type FnType = (props: A) => string;

const Fn1: FnType = (props) => props.foo; // valid
const Fn2 = (props: A) => props.foo; // also valid

See example in TS Playground

In the above example, react-docgen generates types for Fn2, but does not generate types for Fn1 which is defined with a call signature type.

Expected Behavior

This code:

// component.tsx
interface A {
  foo: string;
}

type ComponentType = (props: A) => JSX.Element;

const Component1: ComponentType = (props) => <div />; // does not include generated props
const Component2 = (props: A) => <div />; // includes generated props

Produces this output:

[
  {
    "description": "",
    "displayName": "Component1",
    "methods": [],
    "props": {
      "foo": {
        "required": true,
        "tsType": {
          "name": "string"
        },
        "description": ""
      }
    }
  },
  {
    "description": "",
    "displayName": "Component2",
    "methods": [],
    "props": {
      "foo": {
        "required": true,
        "tsType": {
          "name": "string"
        },
        "description": ""
      }
    }
  }
]

Actual Behavior

The same code produces this output:

[
  {
    "description": "",
    "displayName": "Component1",
    "methods": []
  },
  {
    "description": "",
    "displayName": "Component2",
    "methods": [],
    "props": {
      "foo": {
        "required": true,
        "tsType": {
          "name": "string"
        },
        "description": ""
      }
    }
  }
]

Steps to Reproduce

Paste the .tsx sample code from the "Expected Behavior" section in the react-docgen playground with Language set to Typescript.

# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant