Typed Event Emitter

index.ts

type EventMap = Record<string, any>;

export class TypedEventEmitter<Events extends EventMap> extends EventTarget {
  on<K extends keyof Events>(type: K, listener: (event: Events[K]) => void): void {
    const wrapper = (e: Event) => listener((e as CustomEvent).detail);
    // @ts-ignore store wrapper so .off() can remove it later
    listener.__wrapper__ = wrapper;
    this.addEventListener(type as string, wrapper as EventListener);
  }

  off<K extends keyof Events>(type: K, listener: (event: Events[K]) => void): void {
    // @ts-ignore remove stored wrapper
    this.removeEventListener(type as string, listener.__wrapper__ as EventListener);
  }

  once<K extends keyof Events>(type: K, listener: (event: Events[K]) => void): void {
    const wrapper = (e: Event) => {
      listener((e as CustomEvent).detail);
      this.removeEventListener(type as string, wrapper);
    };
    this.addEventListener(type as string, wrapper as EventListener);
  }

  emit<K extends keyof Events>(type: K, detail: Events[K]): void {
    this.dispatchEvent(new CustomEvent(type as string, { detail }));
  }
}