Skip to content

Add type and props to ReactElement to permit restricting child type #619

@steinybot

Description

@steinybot

There are some long standing issues in Typescript and its types for JSX which make it impossible to restrict the type of children that a component will accept (microsoft/TypeScript#13618 which is not fixed).

The Typescript type for ReactElement does have enough information to do this:

    interface ReactElement<P = any, T extends string | JSXElementConstructor<any> = string | JSXElementConstructor<any>> {
        type: T;
        props: P;
        key: Key | null;
    }

It is the JSX that has the issue as everything ends up as ReactElement<any, any>.

AFAIK Flow already supports this: https://flow.org/en/docs/react/children/#toc-only-allowing-a-specific-element-type-as-children

Any chance of getting support for specifying P and T?

There are a few other changes that would be needed to take full advantage of this such as ensuring that WithAttrs and KeyAddingStage captures these types. FunctionalComponentCore would just work since it has Props and Result. Component et al. would need a Result type.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions