feat: support beforeSelected, startSelected property in select events

daybrush · Sep 13, 2022 · bf906bb · bf906bb
1 parent 1030bb3
commit bf906bb
Show file tree

Hide file tree

Showing 2 changed files with 46 additions and 27 deletions.
diff --git a/packages/selecto/src/SelectoManager.tsx b/packages/selecto/src/SelectoManager.tsx
@@ -144,15 +144,17 @@ class Selecto extends EventEmitter<SelectoEvents> {
     public setSelectedTargets(
         selectedTargets: Array<HTMLElement | SVGElement>
     ): SelectedTargets {
+        const beforeSelected = this.selectedTargets;
         const { added, removed, prevList, list } = diff(
-            this.selectedTargets,
+            beforeSelected,
             selectedTargets
         );
         this.selectedTargets = selectedTargets;
 
         return {
             added: added.map(index => list[index]),
             removed: removed.map(index => prevList[index]),
+            beforeSelected,
             selected: selectedTargets,
         };
     }
@@ -605,9 +607,7 @@ class Selecto extends EventEmitter<SelectoEvents> {
     ) {
         const inputEvent = e.inputEvent;
         const data = e.data;
-
-
-        const { added, removed } = this.setSelectedTargets(selectedTargets);
+        const result = this.setSelectedTargets(selectedTargets);
 
         if (isStart) {
             /**
@@ -641,15 +641,13 @@ class Selecto extends EventEmitter<SelectoEvents> {
              * });
              */
             this.emit("selectStart", {
-                selected: selectedTargets,
-                added,
-                removed,
+                ...result,
                 rect,
                 inputEvent,
                 data: data.data,
             });
         }
-        if (added.length || removed.length) {
+        if (result.added.length || result.removed.length) {
             /**
              * When the select in real time, the select event is called.
              * @memberof Selecto
@@ -674,9 +672,7 @@ class Selecto extends EventEmitter<SelectoEvents> {
              * });
              */
             this.emit("select", {
-                selected: selectedTargets,
-                added,
-                removed,
+                ...result,
                 rect,
                 inputEvent,
                 data: data.data,
@@ -734,6 +730,8 @@ class Selecto extends EventEmitter<SelectoEvents> {
          * });
          */
         this.emit("selectEnd", {
+            startSelected: startPassedTargets,
+            beforeSelected: startPassedTargets,
             selected: this.selectedTargets,
             added: added.map((index) => list[index]),
             removed: removed.map((index) => prevList[index]),

diff --git a/packages/selecto/src/types.ts b/packages/selecto/src/types.ts
@@ -185,9 +185,11 @@ export interface Point {
 /**
  * @memberof Selecto
  * @typedef
- * @property - An Selecto instance itself
  */
 export interface CurrentTarget<T = Selecto> {
+    /**
+     * An Selecto instance itself
+     */
     currentTarget: T;
 }
 
@@ -196,6 +198,10 @@ export interface CurrentTarget<T = Selecto> {
  * @typedef
  */
 export interface SelectedTargets {
+    /**
+     * before selecting elements
+     */
+    beforeSelected: Array<HTMLElement | SVGElement>;
     /**
      * selected elements
      */
@@ -216,42 +222,57 @@ export interface SelectedTargets {
  */
 export interface SelectedTargetsWithRect extends SelectedTargets {
     /**
-     * @property - Rect of Selection Element
+     * Rect of Selection Element
      */
     rect: Rect;
 }
 
 /**
  * @memberof Selecto
- * @extends Selecto.SelectedTargets
+ * @extends Selecto.CurrentTarget
+ * @extends Selecto.SelectedTargetsWithRect
  * @typedef
- * @property - An Selecto instance itself
- * @property - inputEvent
- * @property - Data shared from dragStart, selectStart to dragEnd, selectEnd
  */
-export interface OnSelect<T = Selecto> extends CurrentTarget<T>, SelectedTargets {
-    selected: Array<HTMLElement | SVGElement>;
-    added: Array<HTMLElement | SVGElement>;
-    removed: Array<HTMLElement | SVGElement>;
-    rect: Rect;
+export interface OnSelect<T = Selecto> extends CurrentTarget<T>, SelectedTargetsWithRect {
+    /**
+     * inputEvent
+     */
     inputEvent: any;
+    /**
+     * Data shared from dragStart, selectStart to dragEnd, selectEnd
+     */
     data: Record<string, any>;
 }
 /**
  * @memberof Selecto
  * @extends Selecto.OnSelect
+ * @extends Selecto.CurrentTarget
  * @typedef
- * @property - after added elements
- * @property - after removed elements
- * @property - Whether it is a mousedown or touchstart event
- * @property - Whether it is click
- * @property - Wheter it is double click or double start
  */
 export interface OnSelectEnd<T = Selecto> extends OnSelect<T>, CurrentTarget<T> {
+    /**
+     * start selected elements
+     */
+    startSelected: Array<HTMLElement | SVGElement>;
+    /**
+     * after added elements
+     */
     afterAdded: Array<HTMLElement | SVGElement>;
+    /**
+     * after removed elements
+     */
     afterRemoved: Array<HTMLElement | SVGElement>;
+    /**
+     * Whether it is a mousedown or touchstart event
+     */
     isDragStart: boolean;
+    /**
+     * Whether it is click
+     */
     isClick: boolean;
+    /**
+     * Wheter it is double click or double start
+     */
     isDouble: boolean;
 }