[@simonwep/selection-js] Follow API changes in 1.2.0 (#37585)

types/simonwep__selection-js/index.d.ts

@@ -1,4 +1,4 @@
-// Type definitions for simonwep__selection-js 0.2
+// Type definitions for simonwep__selection-js 1.2
 // Project: https://github.com/Simonwep/selection
 // Definitions by: Mitsuka Hanakura a.k.a. ragg <https://github.com/ra-gg>
 // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
@@ -8,27 +8,16 @@ type ElementList = Element | readonly Element[] | NodeList | HTMLCollection;
 
 declare namespace Selection {
     interface SelectionEvent {
-        selection: Selection;
-        eventName: string;
-        areaElement: readonly Element[];
-        originalEvent: MouseEvent | TouchEvent;
-        selectedElements: readonly Element[];
-        changedElements: {
+        oe: MouseEvent | TouchEvent;
+        inst: Selection;
+        area: Element;
+        selected: readonly Element[];
+        changed: {
             added: readonly Element[];
             removed: readonly Element[];
         };
     }
 
-    interface SingleSelectionEvent extends SelectionEvent {
-        target: Element;
-    }
-
-    interface SelectionFilterEvent {
-        eventName: 'selectionFilter';
-        element: Element;
-        selection: Selection;
-    }
-
     type Mode = 'touch' | 'center' | 'cover';
 
     interface SelectionOptions {
@@ -42,12 +31,6 @@ declare namespace Selection {
         startareas?: ReadonlyArray<string>;
         boundaries?: ReadonlyArray<string>;
         selectionAreaContainer?: string | HTMLElement | ReadonlyArray<string | HTMLElement>;
-        validateStart?(evt: MouseEvent | TouchEvent): boolean;
-        onStart?(evt: SelectionEvent): void;
-        onSelect?(evt: SingleSelectionEvent): void;
-        onMove?(evt: SelectionEvent): void;
-        onStop?(evt: SelectionEvent): void;
-        selectionFilter?(evt: SelectionFilterEvent): boolean;
     }
 
     interface SelectionUtils {
@@ -72,12 +55,21 @@ declare namespace Selection {
     }
 }
 
+interface SelectionEvents {
+    beforestart: (e: Selection.SelectionEvent) => boolean;
+    start: (e: Selection.SelectionEvent) => void;
+    move: (e: Selection.SelectionEvent) => void;
+    stop: (e: Selection.SelectionEvent) => void;
+}
+
 declare class Selection {
     static create(options: Selection.SelectionOptions): Selection;
     static utils: Selection.SelectionUtils;
     static version: string;
 
     constructor(options: Selection.SelectionOptions);
+    on<E extends keyof SelectionEvents>(ev: E, cb: SelectionEvents[E]): this;
+    off<E extends keyof SelectionEvents>(ev: E, cb: SelectionEvents[E]): this;
     resolveSelectables(): void;
     keepSelection(): void;
     clearSelection(): void;

types/simonwep__selection-js/simonwep__selection-js-tests.ts

@@ -10,33 +10,31 @@ const selection = Selection.create({
     startareas: ['html'],
     singleClick: true,
     startThreshold: 10,
-    scrollSpeedDivider: 10,
-    onStart(ev) {
-        ev.originalEvent.currentTarget;
-        ev.changedElements.added.slice();
-        ev.changedElements.removed.slice();
-    },
-    onSelect(ev) {
-        ev.target;
-    },
-    onMove(ev) {
-        ev.selection;
-    },
-
-    validateStart(ev) {
-        return (ev.currentTarget as HTMLElement).matches('.selectable');
-    },
-    onStop(ev) {
-        ev.changedElements.added.slice();
-        ev.changedElements.removed.slice();
-    },
-    selectionFilter(ev) {
-        return ev.element.matches('.selectable');
-    },
+    scrollSpeedDivider: 10
 });
 
 const selectable = document.createElement('div');
 
+selection.on('beforestart', (e) => (e.oe.target as HTMLElement).matches('.selectable'));
+selection.on('move', e => {
+    e.inst.cancel();
+    e.area.matches('.area');
+    e.changed.added;
+    e.changed.removed;
+});
+selection.on('start', () => {});
+selection.on('stop', () => {});
+
+selection.off('beforestart', (e) => (e.oe.target as HTMLElement).matches('.selectable'));
+selection.off('move', e => {
+    e.inst.cancel();
+    e.area.matches('.area');
+    e.changed.added;
+    e.changed.removed;
+});
+selection.off('start', () => {});
+selection.off('stop', () => {});
+
 selection.cancel();
 selection.clearSelection();
 selection.destroy();
@@ -44,8 +42,9 @@ selection.disable();
 selection.enable();
 selection.getSelection();
 selection.keepSelection();
+
 // 2nd args not accept undefined
-// SEE: https://github.com/Simonwep/selection/blob/master/src/selection.js#L528
+// SEE: https://github.com/Simonwep/selection/blob/0f5de7710200bf76b2f31389ab81ff73392c98d1/src/selection.js#L563
 selection.option('class', null);
 selection.option('class', '.selection');
 selection.removeFromSelection(selectable);