INTRINSICATTRIBUTES TYPESST
// IntrinsicAttributes is specific to JSX
/** IntrinsicAttributes are attributes of IntrinsicElements. Intrinsic elements are
* looked up on the special interface JSX.IntrinsicElements. By default, if this
* interface is not specified, then anything goes and intrinsic elements will not be
* type checked. However, if this interface is present, then the name of the intrinsic
* element is looked up as a property on the JSX.IntrinsicElements interface.
* The JSX.IntrinsicAttributes interface can be used to specify extra properties
* used by the JSX framework which are not generally used by the components’ props
* or arguments - for instance the key prop in React.
*/
// Intrinsic Elements example
declare namespace JSX {
interface IntrinsicElements {
foo: any;
}
}
<foo />; // ok
<bar />; // error
// Intrinsic Attributes example
declare namespace JSX {
interface IntrinsicElements {
foo: { requiredProp: string; optionalProp?: number };
}
}
<foo requiredProp="bar" />; // ok
<foo requiredProp="bar" optionalProp={0} />; // ok
<foo />; // error, requiredProp is missing
<foo requiredProp={0} />; // error, requiredProp should be a string
<foo requiredProp="bar" unknownProp />; // error, unknownProp does not exist
<foo requiredProp="bar" some-unknown-prop />; // ok, because 'some-unknown-prop' is not a valid identifier
Tomanator