@mk-drag-and-drop/dom 0.1.0 → 0.3.0

package/dist/input/pointer-activation.js

@@ -5,7 +5,7 @@ export class PointerActivationController {
         this.options = options;
     }
     request(request) {
-        this.cancel();
+        this.cancelPendingActivation();
         if (this.options.isDragging()) {
             return;
         }
@@ -25,8 +25,8 @@ export class PointerActivationController {
             pointerId: request.pointerId,
             initialPointerPosition,
             latestPointerPosition: initialPointerPosition,
-            timeoutId: null,
-            cleanupWindowListeners: () => { },
+            activationTimerId: null,
+            releasePendingPointerListeners: null,
         };
         const handlePointerMove = (event) => {
             if (event.pointerId !== pendingActivation.pointerId) {
@@ -45,46 +45,58 @@ export class PointerActivationController {
             const distanceSquared = distanceX * distanceX + distanceY * distanceY;
             const activationDistanceSquared = activationDistance * activationDistance;
             if (distanceSquared >= activationDistanceSquared) {
-                this.activatePending(pendingActivation);
+                this.activatePendingPointerDrag(pendingActivation);
             }
         };
         const handlePointerEnd = (event) => {
             if (event.pointerId !== pendingActivation.pointerId) {
                 return;
             }
-            this.cancel();
+            this.cancelPendingActivation();
         };
         window.addEventListener("pointermove", handlePointerMove);
         window.addEventListener("pointerup", handlePointerEnd);
         window.addEventListener("pointercancel", handlePointerEnd);
-        pendingActivation.cleanupWindowListeners = () => {
+        pendingActivation.releasePendingPointerListeners = () => {
             window.removeEventListener("pointermove", handlePointerMove);
             window.removeEventListener("pointerup", handlePointerEnd);
             window.removeEventListener("pointercancel", handlePointerEnd);
         };
+        this.pendingActivation = pendingActivation;
         if (activationDelay !== null) {
-            pendingActivation.timeoutId = window.setTimeout(() => {
-                this.activatePending(pendingActivation);
+            pendingActivation.activationTimerId = window.setTimeout(() => {
+                this.activatePendingPointerDrag(pendingActivation);
             }, activationDelay);
         }
-        this.pendingActivation = pendingActivation;
     }
-    cancel() {
+    cancelPendingActivation() {
         const pendingActivation = this.pendingActivation;
         if (!pendingActivation) {
             return;
         }
-        if (pendingActivation.timeoutId !== null) {
-            window.clearTimeout(pendingActivation.timeoutId);
+        this.clearPendingActivation(pendingActivation);
+    }
+    clearPendingActivation(pendingActivation) {
+        if (this.pendingActivation === pendingActivation) {
+            this.pendingActivation = null;
+        }
+        this.clearPendingActivationTimer(pendingActivation);
+        const releasePendingPointerListeners = pendingActivation.releasePendingPointerListeners;
+        pendingActivation.releasePendingPointerListeners = null;
+        releasePendingPointerListeners?.();
+    }
+    clearPendingActivationTimer(pendingActivation) {
+        if (pendingActivation.activationTimerId === null) {
+            return;
         }
-        pendingActivation.cleanupWindowListeners();
-        this.pendingActivation = null;
+        window.clearTimeout(pendingActivation.activationTimerId);
+        pendingActivation.activationTimerId = null;
     }
-    activatePending(pendingActivation) {
+    activatePendingPointerDrag(pendingActivation) {
         if (this.pendingActivation !== pendingActivation) {
             return;
         }
-        this.cancel();
+        this.clearPendingActivation(pendingActivation);
         this.options.activate({
             draggableId: pendingActivation.draggableId,
             group: pendingActivation.group,

package/dist/integration/index.d.ts

@@ -1,5 +1,5 @@
-export { createDragRuntimeHandle, type DragRuntimeHandle, type DragRuntimeHandleConfigureInput, type DragRuntimeHandleOptions, } from "../runtime/drag-runtime-handle.js";
-export type { DragOverlayHostUpdate, DragOverlayPhase, DragOverlayRenderState, DragState, } from "../runtime/types.js";
+export { createDragRuntimeScope, type DragRuntimeScope, type DragRuntimeScopeConfigureInput, type DragRuntimeScopeOptions, } from "../runtime/drag-runtime-scope.js";
+export type { DragOverlayHostUpdate, DragOverlayPhase, DragOverlayRenderState, DragState, OverlayReleaseMode, } from "../runtime/types.js";
 export type { DragRuntimeSubscription } from "../runtime/lifecycle.js";
 export { createDomDraggable, type CreateDomDraggableInput, type DomDraggableBehavior, type DomDraggableKeyDownEvent, type DomDraggablePointerDownEvent, type DomDraggableRuntime, } from "../draggable/create-draggable.js";
 export { createDomDroppable, type CreateDomDroppableInput, type DomDroppableBehavior, type DomDroppableRuntime, } from "../droppable/create-droppable.js";

package/dist/integration/index.js

@@ -1,4 +1,4 @@
-export { createDragRuntimeHandle, } from "../runtime/drag-runtime-handle.js";
+export { createDragRuntimeScope, } from "../runtime/drag-runtime-scope.js";
 export { createDomDraggable, } from "../draggable/create-draggable.js";
 export { createDomDroppable, } from "../droppable/create-droppable.js";
 export { createDomDropContainer, } from "../droppable/create-drop-container.js";

package/dist/runtime/drag-runtime-scope.d.ts

@@ -0,0 +1,21 @@
+import type { DragRect } from "../geometry/rects.js";
+import type { DomDraggableRuntime } from "../draggable/create-draggable.js";
+import type { DomDropContainerRuntime } from "../droppable/create-drop-container.js";
+import type { DomDroppableRuntime } from "../droppable/create-droppable.js";
+import type { DomSortableRuntime } from "../sortable/sortable-registry.js";
+import { type StaleDomBindingRecord } from "./drag-runtime.js";
+import type { DragRuntimeConfigureInput, DragRuntimeOptions } from "./types.js";
+export type DragRuntimeScopeOptions = DragRuntimeOptions;
+export type DragRuntimeScopeConfigureInput = DragRuntimeConfigureInput;
+export type DragRuntimeScope = DomDraggableRuntime & DomDroppableRuntime & DomDropContainerRuntime & DomSortableRuntime & {
+    configure: (input: DragRuntimeScopeConfigureInput) => void;
+    cancelDrag: () => void;
+    releaseActiveDragResources: () => void;
+    setOverlayRect: (overlayRect: DragRect | null) => void;
+};
+export type InternalStaleDomBindingRuntime = {
+    registerStaleDomBinding: (record: StaleDomBindingRecord) => () => void;
+    pruneDisconnectedDomBindings: () => void;
+    getStaleDomBindingRecordCount: () => number;
+};
+export declare function createDragRuntimeScope(options?: DragRuntimeScopeOptions): DragRuntimeScope;

package/dist/runtime/{drag-runtime-handle.js → drag-runtime-scope.js}

@@ -1,10 +1,10 @@
 import { DragRuntime } from "./drag-runtime.js";
-export function createDragRuntimeHandle(options) {
+export function createDragRuntimeScope(options) {
     const runtime = new DragRuntime(options);
-    const handle = {
+    const scope = {
         configure: (input) => runtime.configure(input),
-        cleanup: () => runtime.cleanup(),
-        dispose: () => runtime.dispose(),
+        cancelDrag: () => runtime.cancelDrag(),
+        releaseActiveDragResources: () => runtime.releaseActiveDragResources(),
         setOverlayRect: (overlayRect) => runtime.setOverlayRect(overlayRect),
         requestDragStart: (input) => runtime.requestDragStart(input),
         isKeyboardDragEnabled: () => runtime.isKeyboardDragEnabled(),
@@ -23,11 +23,10 @@ export function createDragRuntimeHandle(options) {
         },
         getDropTargetRegistration: (dropTargetId, group) => runtime.getDropTargetRegistration(dropTargetId, group),
         subscribe: (subscription) => runtime.subscribe(subscription),
-        onDispose: (callback) => runtime.onDispose(callback),
         remeasureDropTargets: (input) => runtime.remeasureDropTargets(input),
-        registerBindingCleanup: (record) => runtime.registerBindingCleanup(record),
-        pruneDisconnectedBindingCleanups: () => runtime.pruneDisconnectedBindingCleanups(),
-        getBindingCleanupRecordCount: () => runtime.getBindingCleanupRecordCount(),
+        registerStaleDomBinding: (record) => runtime.registerStaleDomBinding(record),
+        pruneDisconnectedDomBindings: () => runtime.pruneDisconnectedDomBindings(),
+        getStaleDomBindingRecordCount: () => runtime.getStaleDomBindingRecordCount(),
     };
-    return handle;
+    return scope;
 }

package/dist/runtime/drag-runtime.d.ts

@@ -3,8 +3,8 @@ import { type KeyboardMoveDirection, type SourceKeyboardDragKeyDownInput as Keyb
 import { type DragGroup, type RegisterDropTargetOptions, type RemeasureDropTargetsInput } from "./drop-target-registry.js";
 import type { DragRuntimeSubscription } from "./lifecycle.js";
 import type { DragRuntimeConfigureInput, DragRuntimeOptions, Point, RequestDragStartInput, RequestKeyboardDragStartInput } from "./types.js";
-export type BindingCleanupRecord = {
-    cleanup: () => void;
+export type StaleDomBindingRecord = {
+    release: () => void;
     isConnected: () => boolean;
 };
 export declare class DragRuntime {
@@ -16,13 +16,12 @@ export declare class DragRuntime {
     private session;
     private modifiers;
     private activeDragModifiers;
-    private cleanupWindowListeners;
-    private cleanupTextSelectionSuppression;
+    private releaseActiveInputListeners;
+    private restoreTextSelectionSuppression;
     private queuedPointerPosition;
     private pointerFrameId;
     private subscriptions;
-    private disposeCallbacks;
-    private bindingCleanupRecords;
+    private staleDomBindingRecords;
     private lifecycleCallbacks;
     private lifecycleHelpers;
     private lifecycleDropTargetRectSnapshot;
@@ -32,7 +31,7 @@ export declare class DragRuntime {
     private updateOverlayHost;
     private targetingAlgorithm;
     private hasDragOverlay;
-    private keepOverlayOnDrop;
+    private overlayRelease;
     private targetingConstraint;
     private pointerActivation;
     private keyboardDrag;
@@ -45,31 +44,35 @@ export declare class DragRuntime {
     moveKeyboardDrag(direction: KeyboardMoveDirection): void;
     updatePointer(rawPointerPosition: Point): void;
     private updatePointerNow;
+    private updatePointerNowOrRelease;
+    private finishDragAfterQueuedPointerUpdate;
     endDrag(): void;
     cancelDrag(): void;
+    cancelPendingActivation(): void;
     registerDropTarget(dropTargetId: string, element: HTMLElement, group: DragGroup, options?: RegisterDropTargetOptions): void;
     unregisterDropTarget(dropTargetId: string, element?: HTMLElement): void;
     registerDropContainer(containerId: string, element: HTMLElement, group: DragGroup): void;
     unregisterDropContainer(containerId: string, element?: HTMLElement): void;
-    cleanup(): void;
+    releaseActiveDragResources(): void;
+    private releaseActiveDragResourcesAndRethrow;
     getDropTargetRect(dropTargetId: string): DragRect | null;
     getDropTargetRegistration(dropTargetId: string, group?: DragGroup): import("./drop-target-registry.js").DropTargetRegistration | null;
     getCurrentDragRect(): DragRect | null;
     setOverlayRect(overlayRect: DragRect | null): void;
     remeasureDropTargets(input?: RemeasureDropTargetsInput): void;
     subscribe(subscription: DragRuntimeSubscription): () => void;
-    onDispose(callback: () => void): () => void;
-    registerBindingCleanup(record: BindingCleanupRecord): () => void;
-    pruneDisconnectedBindingCleanups(): void;
-    getBindingCleanupRecordCount(): number;
-    dispose(): void;
+    registerStaleDomBinding(record: StaleDomBindingRecord): () => void;
+    pruneDisconnectedDomBindings(): void;
+    getStaleDomBindingRecordCount(): number;
     private startDragNow;
     private finishDrag;
+    private releaseOverlayAfterDrag;
     private bindPointerWindowListeners;
     private bindKeyboardWindowListeners;
     private suppressTextSelection;
     private resetActiveDragState;
-    private cleanupActiveDragResources;
+    private releaseActiveInputResources;
+    private clearOverlayHost;
     private flushQueuedPointerUpdate;
     private cancelQueuedPointerUpdate;
     private setSession;
@@ -85,12 +88,13 @@ export declare class DragRuntime {
     private getAvailableDropTargets;
     private getCurrentDragRectAt;
     private removeDisconnectedDropTargets;
-    private pruneDisconnectedBindingCleanupRecords;
-    private disposeBindingCleanupRecords;
+    private pruneDisconnectedDomBindingRecords;
     private clearActiveDropTargetIdIfRemoved;
-    private notifyDragStart;
+    private notifyDragStartSubscriptions;
+    private notifyDragStartLifecycle;
     private notifyDragUpdate;
     private notifyDragEnd;
     private notifyDrop;
+    private notifyActiveDragReset;
 }
 export declare function createDragRuntime(options?: DragRuntimeOptions): DragRuntime;