Preact: Remove irrelevant types from JSX namespace

[remcohaszing]

The JSX namespace in TypeScript has a special meaning. There’s a specific set of types that can be defined in a JSX namespace to make JSX behave in a certain way. This is (partially) documented here.

The following properties have a special meaning:

• Element
• ElementClass
• ElementAttributesProperty
• ElementChildrenAttribute
• IntrinsicAttributes
• IntrinsicElements
• LibraryManagedAttributes

However, in the Preact typings the following types are also defined on the JSX namespace:

• SVGAttributes
• PathAttributes
• DOMAttributes
• HTMLAttributes

Events and event handlers

• TargetedEvent
• TargetedAnimationEvent
• TargetedClipboardEvent
• TargetedCompositionEvent
• TargetedDragEvent
• TargetedFocusEvent
• TargetedKeyboardEvent
• TargetedMouseEvent
• TargetedPointerEvent
• TargetedTouchEvent
• TargetedTransitionEvent
• TargetedUIEvent
• TargetedWheelEvent
• EventHandler
• AnimationEventHandler
• ClipboardEventHandler
• CompositionEventHandler
• DragEventHandler
• FocusEventHandler
• GenericEventHandler
• KeyboardEventHandler
• MouseEventHandler
• PointerEventHandler
• TouchEventHandler
• TransitionEventHandler
• UIEventHandler
• WheelEventHandler

The JSX namespace in Preact is called JSXInternal. This makes it unclear if these types are supposed to be consumed or not.

Since these types are useful, especially the event handlers, I propose to move all these types to the preact namespace instead. The JSXInternal namespace can import these types an expose type aliases using the @deprecated annotation. They can be removed in the next major release.

[marvinhagemeister]

That's awesome, sounds like you spent already a bit of time going through everything. Would love to have a PR for this :+1:

[andrewiggins]

Makes sense to me. Seems this matches what the React types are doing as well so we are in good company to move these out.

[marvinhagemeister]

FYI: We consciously moved away from the global JSX type so that we can co-exist with other JSX typings being present. This should remain. See the last section of the TypeScript docs on this page for more information: https://www.typescriptlang.org/docs/handbook/jsx.html#factory-functions

[remcohaszing]

I learnt some things about TypeScript and JSX while writing mini-jsx.

I noticed in props.js a similar way is used to assign props to DOM nodes. This means the existing builtin TypeScript types from HTMLElementTagNameMap and SVGElementTagNameMap could be used to avoid the need to maintain most of the current HTMLAttributes interface in Preact.

This will also improve typings, i.e. an input has a checked property in the TypeScript DOM types, but not a div element. In Preact there’s currently no distinction.

Instead of introducing the deprecation policy I described in the original comment, I’d prefer to take the liberty to make some breaking changes.

Is there an ETA for Preact 11? I think it’s better to make these changes for a major release.

[marvinhagemeister]

There is no ETA for Preact 11 and it's probably few months away. Personally I'm fine with doing this change in a 10.x release. Adding invalid props to DOM nodes should be a TypeError and even if the new typings will lead to new errors for existing code bases, that's ok for me. It's an error regardless and I'd spin it that our types simply missed that case.

The thing with TS types is that any change is a breaking one unless only new properties are added :shrug: