@fr0st/ui-sortable 3.0.0 → 3.0.1

package/src/sortable.js

@@ -59,6 +59,7 @@ export default class Sortable extends BaseComponent {
     #currentSortable;
     #dragging;
     #enabled;
+    #initialCursorNodes = [];
     #pos;
     #scrollFrame;
     #selector;
@@ -73,15 +74,22 @@ export default class Sortable extends BaseComponent {
     constructor(node, options) {
         super(node, options);
 
-        this.#selector = this.options.handle ?
-            `:is(${this.options.items}) :is(${this.options.handle})` :
-            this.options.items;
-
-        this.#dragging = false;
-        this.#enabled = !this.options.disabled;
-
-        setCursor($.find(this.#selector, this.node), this.options.cursor);
-        this.#events();
+        try {
+            this.#selector = this.options.handle ?
+                `:is(${this.options.items}) :is(${this.options.handle})` :
+                this.options.items;
+
+            this.#dragging = false;
+            this.#enabled = !this.options.disabled;
+
+            this.#initialCursorNodes = $.find(this.#selector, this.node);
+            setCursor(this.#initialCursorNodes, this.options.cursor);
+            this.#events();
+            this.#initialCursorNodes = null;
+        } catch (error) {
+            this.dispose();
+            throw error;
+        }
     }
 
     /**
@@ -99,7 +107,7 @@ export default class Sortable extends BaseComponent {
 
         $.removeEventDelegate(this.node, 'mousedown.ui.sortable touchstart.ui.sortable');
         $.removeEvent(this.node, 'receive.ui.sortable');
-        resetCursor($.find(this.#selector, this.node));
+        resetCursor(this.#initialCursorNodes ?? $.find(this.#selector, this.node));
 
         if (this.#target && this.options.helperClass) {
             $.removeClass(this.#target, this.options.helperClass);
@@ -107,6 +115,8 @@ export default class Sortable extends BaseComponent {
 
         this.#resetDrag();
 
+        this.#initialCursorNodes = null;
+
         super.dispose();
     }
 
@@ -183,16 +193,16 @@ export default class Sortable extends BaseComponent {
      * Attaches events for the Sortable.
      */
     #events() {
-        const downEvent = (e) => {
+        const downEvent = (event) => {
             const cancelled = this.options.cancel &&
                 (
-                    $.is(e.target, this.options.cancel) ||
-                    $.is(e.currentTarget, this.options.cancel) ||
-                    $.closest(e.target, this.options.cancel, this.node).length
+                    $.is(event.target, this.options.cancel) ||
+                    $.is(event.currentTarget, this.options.cancel) ||
+                    $.closest(event.target, this.options.cancel, this.node).length
                 );
 
             if (
-                e.button ||
+                event.button ||
                 !this.#enabled ||
                 cancelled ||
                 $.getDataset(this.node, 'uiDragging')
@@ -201,21 +211,21 @@ export default class Sortable extends BaseComponent {
             }
 
             this.#target = this.options.handle ?
-                this.items().find((node) => $.hasDescendent(node, e.currentTarget)) :
-                e.currentTarget;
+                this.items().find((node) => $.hasDescendent(node, event.currentTarget)) :
+                event.currentTarget;
 
             if (!this.#target) {
                 return false;
             }
         };
 
-        const moveEvent = (e) => {
+        const moveEvent = (event) => {
             if (!this.node || !this.#target) {
                 return;
             }
 
             const previousPos = this.#pos;
-            this.#pos = getPosition(e);
+            this.#pos = getPosition(event);
             const deltaX = previousPos ?
                 this.#pos.x - previousPos.x :
                 0;
@@ -255,7 +265,7 @@ export default class Sortable extends BaseComponent {
             this.#scheduleScroll();
         };
 
-        const upEvent = (e) => {
+        const upEvent = (event) => {
             if (!this.node) {
                 return;
             }
@@ -265,8 +275,8 @@ export default class Sortable extends BaseComponent {
                 return;
             }
 
-            if (e.type === 'mouseup') {
-                e.preventDefault();
+            if (event.type === 'mouseup') {
+                event.preventDefault();
             }
 
             const source = this.node;
@@ -314,7 +324,7 @@ export default class Sortable extends BaseComponent {
             dragEvent,
         );
 
-        $.addEvent(this.node, 'receive.ui.sortable', (_) => {
+        $.addEvent(this.node, 'receive.ui.sortable', () => {
             setCursor($.find(this.#selector, this.node), this.options.cursor);
         });
     }
@@ -353,7 +363,7 @@ export default class Sortable extends BaseComponent {
             return;
         }
 
-        this.#scrollFrame = window.requestAnimationFrame((_) => {
+        this.#scrollFrame = window.requestAnimationFrame(() => {
             this.#checkScroll();
         });
     }