feat: export EventEmitter class (#2467)

Author: ogonkov

src/components/Toaster/Toaster.ts

@@ -1,4 +1,4 @@
-import {EventEmitter} from '../../utils/EventEmitter/EventEmitter';
+import {EventEmitter} from '../../utils/EventEmitter';
 
 import type {InternalToastProps, ToastProps} from './types';
 import {getToastIndex} from './utilities/getToastIndex';
@@ -9,7 +9,8 @@ export class Toaster {
     /** We were tried to notify about toaster changes, but no one were listened */
     private hasUndelivered = false;
     private toasts: InternalToastProps[] = [];
-    private eventEmitter: EventEmitter<InternalToastProps[]> = new EventEmitter();
+    private eventEmitter: EventEmitter<{'toasts-change': [InternalToastProps[]]}> =
+        new EventEmitter();
 
     destroy() {
         this.removeAll();
@@ -71,7 +72,7 @@ export class Toaster {
     }
 
     subscribe(listener: (toasts: InternalToastProps[]) => void) {
-        const unsubscribe = this.eventEmitter.subscribe(listener);
+        const unsubscribe = this.eventEmitter.subscribe('toasts-change', listener);
 
         if (this.hasUndelivered) {
             this.notify();
@@ -81,7 +82,7 @@ export class Toaster {
     }
 
     private notify() {
-        const isDelivered = this.eventEmitter.notify(this.toasts);
+        const isDelivered = this.eventEmitter.notify('toasts-change', [this.toasts]);
 
         this.hasUndelivered = !isDelivered;
     }

src/index.ts

@@ -1,5 +1,7 @@
 export {Lang, configure, getConfig} from './utils/configure';
 export type {StringWithSuggest} from './utils/types';
+export {EventEmitter} from './utils/EventEmitter';
+export type {EventListeners} from './utils/EventEmitter';
 export * from './components';
 export * from './hooks';
 export * from './utils/dom';

src/utils/EventEmitter/EventEmitter.ts

@@ -1,35 +1,52 @@
-type EventListener<T> = (data: T) => void;
-
-export class EventEmitter<T> {
-    private listeners: EventListener<T>[];
+import type {EventListeners} from './types';
+
+/**
+ * Class for emitting events
+ * @example
+ * import {EventEmitter} from '@gravity-ui/uikit';
+ *
+ * const emitter = new EventEmitter<{
+ *   foobar: [string, number]
+ * }>();
+ *
+ * emitter.notify('foobar', ['foo', 0]); // returns "false", because there is no attached listeners yet
+ *
+ * const unsubscribe = emitter.subscribe('foobar', (a, b) => {
+ *   console.log(a, b);
+ * });
+ *
+ * emitter.notify('foobar', ['foo', 1]); // returns "true", because listener is appeared
+ */
+export class EventEmitter<T extends Record<string, unknown[]>> {
+    private listeners: EventListeners<T>;
 
     constructor() {
-        this.listeners = [];
+        this.listeners = {};
     }
 
     destroy() {
-        this.listeners = [];
+        this.listeners = {};
     }
 
-    subscribe(listener: EventListener<T>) {
+    subscribe<Event extends keyof T>(event: Event, listener: (...args: T[Event]) => void) {
         if (typeof listener === 'function') {
-            this.listeners.push(listener);
+            this.listeners[event] = (this.listeners[event] || []).concat(listener);
         }
 
         return () => {
-            this.listeners = this.listeners.filter(
+            this.listeners[event] = this.listeners[event]?.filter(
                 (currentListener) => listener !== currentListener,
             );
         };
     }
 
-    notify(data: T) {
-        if (this.listeners.length === 0) {
+    notify<Event extends keyof T>(event: Event, data: T[Event]) {
+        if (!this.listeners[event]?.length) {
             return false;
         }
 
-        for (const listener of this.listeners) {
-            listener(data);
+        for (const listener of this.listeners[event]) {
+            listener(...data);
         }
 
         return true;

src/utils/EventEmitter/__tests__/EventEmitter.test.ts

@@ -0,0 +1,22 @@
+import {EventEmitter} from '../EventEmitter';
+
+test('should subscribe for events', (done) => {
+    const emitter = new EventEmitter<{foo: [string, string, string]}>();
+
+    expect(emitter.notify('foo', ['foo', 'bar', '1qux'])).toBe(false);
+
+    const unsubscribe1 = emitter.subscribe('foo', (...data) => {
+        expect(data).toEqual(['foo', 'bar', 'qux']);
+    });
+
+    const unsubscribe2 = emitter.subscribe('foo', (...data) => {
+        expect(data).toEqual(['foo', 'bar', 'qux']);
+
+        done();
+    });
+
+    expect(emitter.notify('foo', ['foo', 'bar', 'qux'])).toBe(true);
+
+    unsubscribe1();
+    unsubscribe2();
+});

src/utils/EventEmitter/index.ts

@@ -0,0 +1,2 @@
+export {EventEmitter} from './EventEmitter';
+export type {EventListeners} from './types';

src/utils/EventEmitter/types.ts

@@ -0,0 +1,3 @@
+export type EventListeners<T extends Record<string, unknown[]>> = {
+    [Event in keyof T]?: ((...args: T[Event]) => void)[];
+};