Make it possible to change the location of the selection area at any …

…time Closes #210
simonwep · Jan 16, 2025 · 7f1b1eb · 7f1b1eb
1 parent af58186
commit 7f1b1eb
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 7 deletions.
diff --git a/packages/vanilla/README.md b/packages/vanilla/README.md
@@ -225,6 +225,9 @@ Use the `on(event, cb)` and `off(event, cb)` functions to bind / unbind event-li
 | `deselect(query: SelectAllSelectors, quiet = false): Element[]` | Manually deselect elements, if `quiet` is set to `true` this will not fire the `move` & `stop` event.                                               |
 | `clearSelection(includeStored = true, quiet = false): void`     | Clears the selection, pass `false` to keep previously selected elements.  If `quiet` is set to `true` this will not fire the `move` & `stop` event. |
 | `trigger(evt: MouseEvent / TouchEvent, silent = true): void`    | Manually trigger a selection.                                                                                                                       |
+| `getSelectables(): Element[]`                                   | Returns all selectables.                                                                                                                            |
+| `getAreaLocation(): AreaLocation`                               | Returns the current location of the selection area.                                                                                                 |
+| `setAreaLocation(location: AreaLocation): void`                 | Update the location of the selection area.                                                                                                          |
 
 
 ### Example

diff --git a/packages/vanilla/src/index.ts b/packages/vanilla/src/index.ts
@@ -718,22 +718,22 @@ export default class SelectionArea extends EventTarget<SelectionEvents> {
     /**
      * Manually triggers the start of a selection
      * @param evt A MouseEvent / TouchEvent-like object
-     * @param silent If beforestart should be fired,
+     * @param silent If beforestart should be fired
      */
     trigger(evt: MouseEvent | TouchEvent, silent = true): void {
         this._onTapStart(evt, silent);
     }
 
     /**
-     * Can be used if during a selection elements have been added.
-     * Will update everything that can be selected.
+     * Can be used if during a selection elements have been added
+     * Will update everything that can be selected
      */
     resolveSelectables(): void {
         this._selectables = selectAll(this._options.selectables, this._options.document);
     }
 
     /**
-     * Same as deselecting, but for all elements currently selected.
+     * Same as deselecting, but for all elements currently selected
      * @param includeStored If the store should also get cleared
      * @param quiet If move / stop events should be fired
      */
@@ -771,7 +771,31 @@ export default class SelectionArea extends EventTarget<SelectionEvents> {
     }
 
     /**
-     * Cancel the current selection process, pass true to fire a stop event after cancel.
+     * @returns {Element[]} Available selectable elements for current selection
+     */
+    getSelectables(): Element[] {
+        return this._selectables;
+    }
+
+    /**
+     * Set the location of the selection area
+     * @param location A partial AreaLocation object
+     */
+    setAreaLocation(location: Partial<AreaLocation>) {
+        Object.assign(this._areaLocation, location);
+        this._redrawSelectionArea();
+    }
+
+    /**
+     * @returns {AreaLocation} The current location of the selection area
+     */
+    getAreaLocation(): AreaLocation {
+        return this._areaLocation;
+    }
+
+    /**
+     * Cancel the current selection process, pass true to fire a stop event after cancel
+     * @param keepEvent - If a stop event should be fired
      */
     cancel(keepEvent = false): void {
         this._onTapStop(null, !keepEvent);
@@ -787,9 +811,16 @@ export default class SelectionArea extends EventTarget<SelectionEvents> {
         super.unbindAllListeners();
     }
 
-    disable = this._toggleStartEvents.bind(this, false);
+    /**
+     * Enable selecting elements
+     */
     enable = this._toggleStartEvents;
 
+    /**
+     * Disable selecting elements
+     */
+    disable = this._toggleStartEvents.bind(this, false);
+
     /**
      * Adds elements to the selection
      * @param query - CSS Query, can be an array of queries
@@ -821,7 +852,7 @@ export default class SelectionArea extends EventTarget<SelectionEvents> {
     }
 
     /**
-     * Removes a particular element from the selection.
+     * Removes a particular element from the selection
      * @param query - CSS Query, can be an array of queries
      * @param quiet - If this should not trigger the move event
      */