Skip to content

Instantly share code, notes, and snippets.

@guiseek

guiseek/define.ts

Created June 11, 2024 17:31
Show Gist options
  • Save guiseek/11fb549122f2e0c443e033b6146b43d3 to your computer and use it in GitHub Desktop.
Save guiseek/11fb549122f2e0c443e033b6146b43d3 to your computer and use it in GitHub Desktop.
Download ZIP
Define typed custom element
Raw
define.ts
type Tag = `${string}-${string}`;
type TagMap = HTMLElementTagNameMap;
interface CustomElement<T> extends CustomElementConstructor {
new (...params: any[]): T;
}
function define<S extends Tag, K extends keyof TagMap>(selector: S, is?: K) {
return (target: CustomElement<TagMap[K]>) => {
customElements.define(selector, target, is ? { extends: is } : {});
};
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment