Allow JSX element attributes type to be an intersection

[jbrantly]

Consider the following:

declare module JSX {
    interface ElementAttributesProperty { props: {}; }
}

class Component<P> {
    props: P & { ref?: string };
}

This results in the error: JSX element attributes type '[type parameter] & { ref?: string; }' must be an object type.

An alternative would be an additional member of the JSX namespace that allowed specifying "global" attributes (that would apply to both value-based and intrinsic elements). For example:

declare module JSX {
    interface GlobalAttributes {
        ref?: string
    }
}

See also DefinitelyTyped/DefinitelyTyped#5347

[RyanCavanaugh]

Removing this restriction for the sake of intersection types makes sense. It was put in place because we don't really correctly support the JSX Attributes type being a union type.

[JsonFreeman]

What should happen if it is an intersection of unions? Or an intersection of type parameters that could be instantiated to unions?

[Pajn]

A GlobalAttributes interface would be great because it would make it possible to add global attributes without redefining the entire typing file of for example react.

[JsonFreeman]

What does this proposal allow exactly? The attributes type can be any type in the world? Or just an intersection of object types? Keep in mind that an intersection of object types would not fix the Component<P> example above because P is a type parameter.

If the attributes can be any type in the world, what are the semantics for union types, primitives, tuples, and type parameters?

[phiresky]

My use case is the following:

abstract class TestA<T> extends React.Component<{x:number}&T, {}> {
   ...
}
class TestB extends TestA<{y:number}> {
   render() {...}
}

Declaration works fine, but it can't be used because (I think) of the above problem.

[RyanCavanaugh]

Fixed in nightly build

[phiresky]

@RyanCavanaugh Thank you!