Last active
May 6, 2024 05:09
-
-
Save treshugart/7220c2ee1a3952bbb995c52fab663cdd to your computer and use it in GitHub Desktop.
I want to get type checking working for custom elements in JSX. The following examples should work.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
type HTMLElementPrototype = HTMLElement extends { prototype: infer Prototype } | |
? Prototype | |
: never; | |
declare namespace h { | |
namespace JSX { | |
interface Element {} | |
type LibraryManagedAttributes<E, _> = E extends { | |
prototype: infer Prototype; | |
} | |
? Pick<Prototype, Extract<keyof HTMLElementPrototype, keyof Prototype>> | |
: _; | |
} | |
} | |
class CustomElement extends HTMLElement { | |
// Prop 1 should be required. | |
prop1: string; | |
// This should not be required. | |
prop2?: string; | |
} | |
<CustomElement title="This should work because HTMLElement." />; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment