verstak 0.24.124 → 0.24.127

package/build/dist/source/archive/RxDomV1.js

@@ -85,7 +85,7 @@ RxNodeInstanceImpl.gUuid = 0;
 __decorate([
     reactive,
     options({
-        reentrance: Reentrance.CancelPrevious,
+        reentrance: Reentrance.cancelPrevious,
         triggeringArgs: true,
         noSideEffects: true
     }),

package/build/dist/source/html/El.d.ts

@@ -2,12 +2,10 @@ import { RxNode, BaseDriver } from "reactronic";
 export declare class ElDriver<T extends Element, M = unknown> extends BaseDriver<El<T, M>> {
     allocate(node: RxNode<El<T, M>>): El<T, M>;
 }
-export type BaseEl<T = any, M = any> = {
+export type El<T = any, M = any> = {
     readonly node: RxNode<El<T, M>>;
-    model: M;
-};
-export type El<T = any, M = any> = BaseEl<T, M> & {
     native: T;
+    model: M;
     kind: ElKind;
     area: ElArea;
     widthGrowth: number;

package/build/dist/source/html/Elements.d.ts

@@ -1,4 +1,4 @@
-import { RxNodeDecl, RxNode } from "reactronic";
+import { RxNodeDecl, RxNode, Delegate } from "reactronic";
 import { El, ElArea } from "./El.js";
 import { HtmlElementDriver } from "./HtmlDriver.js";
 export declare function Section<M = unknown>(declaration?: RxNodeDecl<El<HTMLElement, M>>, preset?: RxNodeDecl<El<HTMLElement, M>>): RxNode<El<HTMLElement, M>>;
@@ -9,7 +9,8 @@ export declare function cursor(areaParams: ElArea): void;
 export declare function Note(content: string, declaration?: RxNodeDecl<El<HTMLElement, void>>): RxNode<El<HTMLElement, void>>;
 export declare function HtmlNote(content: string, declaration?: RxNodeDecl<El<HTMLElement, void>>): RxNode<El<HTMLElement, void>>;
 export declare function Group<M = unknown, R = void>(declaration?: RxNodeDecl<El<HTMLElement, M>>, preset?: RxNodeDecl<El<HTMLElement, M>>): RxNode<El<HTMLElement, M>>;
-export declare function PseudoElement<M = unknown>(declaration?: RxNodeDecl<El<void, M>>, preset?: RxNodeDecl<El<void, M>>): RxNode<El<void, M>>;
+export declare function Handler<M = unknown>(update: Delegate<El<void, M>>): RxNode<El<void, M>>;
+export declare function SyntheticElement<M = unknown>(declaration?: RxNodeDecl<El<void, M>>, preset?: RxNodeDecl<El<void, M>>): RxNode<El<void, M>>;
 export declare class VerstakElementDriver<T extends HTMLElement> extends HtmlElementDriver<T> {
     update(node: RxNode<El<T>>): void | Promise<void>;
 }

package/build/dist/source/html/Elements.js

@@ -1,4 +1,4 @@
-import { RxNode } from "reactronic";
+import { RxNode, Mode } from "reactronic";
 import { Constants, CursorCommandDriver, ElKind, ElDriver } from "./El.js";
 import { HtmlElementDriver } from "./HtmlDriver.js";
 export function Section(declaration, preset) {
@@ -38,7 +38,10 @@ export function HtmlNote(content, declaration) {
 export function Group(declaration, preset) {
     return RxNode.acquire(Drivers.group, declaration, preset);
 }
-export function PseudoElement(declaration, preset) {
+export function Handler(update) {
+    return SyntheticElement({ mode: Mode.independentUpdate, update });
+}
+export function SyntheticElement(declaration, preset) {
     return RxNode.acquire(Drivers.pseudo, declaration, preset);
 }
 export class VerstakElementDriver extends HtmlElementDriver {

package/build/dist/source/html/Handlers.d.ts

@@ -0,0 +1,6 @@
+import { ToggleRef } from "reactronic";
+import { FocusModel } from "./sensors/FocusSensor.js";
+import { ResizedElement } from "./sensors/ResizeSensor.js";
+export declare function OnClick(target: HTMLElement, action: (() => void) | ToggleRef | undefined, key?: string): void;
+export declare function OnResize(target: HTMLElement, action: ((element: ResizedElement) => void) | undefined, key?: string): void;
+export declare function OnFocus(target: HTMLElement, model: FocusModel, switchEditMode?: ((model?: FocusModel) => void) | undefined, key?: string): void;

package/build/dist/source/html/Handlers.js

@@ -0,0 +1,55 @@
+import { Mode, ToggleRef, unobs } from "reactronic";
+import { SyntheticElement } from "./Elements.js";
+export function OnClick(target, action, key) {
+    if (action !== undefined) {
+        SyntheticElement({
+            key,
+            mode: Mode.independentUpdate,
+            triggers: { target },
+            update() {
+                const pointer = target.sensors.pointer;
+                if (pointer.clicked) {
+                    if (action instanceof Function) {
+                        unobs(() => action());
+                    }
+                    else if (action instanceof ToggleRef) {
+                        unobs(() => action.toggle());
+                    }
+                }
+            },
+        });
+    }
+}
+export function OnResize(target, action, key) {
+    if (action) {
+        SyntheticElement({
+            key,
+            mode: Mode.independentUpdate,
+            triggers: { target },
+            update() {
+                const resize = target.sensors.resize;
+                resize.resizedElements.forEach(x => {
+                    action(x);
+                });
+            },
+        });
+    }
+}
+export function OnFocus(target, model, switchEditMode = undefined, key) {
+    SyntheticElement({
+        key,
+        mode: Mode.independentUpdate,
+        triggers: { target, model },
+        initialize(b) {
+            b.node.configureReactronic({ throttling: 0 });
+        },
+        update() {
+            if (switchEditMode !== undefined) {
+                switchEditMode(model);
+            }
+            else {
+                model.isEditMode ? target.focus() : target.blur();
+            }
+        },
+    });
+}

package/build/dist/source/html/HtmlApiExt.d.ts

@@ -1,6 +1,8 @@
 import { DataForSensor } from "./sensors/DataForSensor.js";
+import { HtmlSensors } from "./sensors/HtmlSensors.js";
 declare global {
     interface Element {
+        sensors: HtmlSensors;
         dataForSensor: DataForSensor;
         resizeObserver?: ResizeObserver;
     }

package/build/dist/source/html/HtmlApiExt.js

@@ -1,6 +1,16 @@
-import { SymDataForSensor, SymResizeObserver } from "./sensors/DataForSensor.js";
+import { SymDataForSensor, SymHtmlSensors, SymResizeObserver } from "./sensors/DataForSensor.js";
+import { HtmlSensors } from "./sensors/HtmlSensors.js";
 const ElementType = global.Element;
 if (ElementType !== undefined) {
+    Object.defineProperty(ElementType.prototype, "sensors", {
+        configurable: false, enumerable: false,
+        get() {
+            let result = this[SymHtmlSensors];
+            if (result === undefined)
+                result = this[SymHtmlSensors] = new HtmlSensors(this);
+            return result;
+        },
+    });
     Object.defineProperty(ElementType.prototype, "dataForSensor", {
         configurable: false, enumerable: false,
         get() {

package/build/dist/source/html/api.d.ts

@@ -4,7 +4,7 @@ export * from "./HtmlDriver.js";
 export * from "./HtmlElements.js";
 export * from "./HtmlApiExt.js";
 export * from "./Elements.js";
-export * from "./ReactingFocuser.js";
+export * from "./Handlers.js";
 export * from "./sensors/Sensor.js";
 export * from "./sensors/PointerSensor.js";
 export * from "./sensors/BasePointerSensor.js";

package/build/dist/source/html/api.js

@@ -4,7 +4,7 @@ export * from "./HtmlDriver.js";
 export * from "./HtmlElements.js";
 export * from "./HtmlApiExt.js";
 export * from "./Elements.js";
-export * from "./ReactingFocuser.js";
+export * from "./Handlers.js";
 export * from "./sensors/Sensor.js";
 export * from "./sensors/PointerSensor.js";
 export * from "./sensors/BasePointerSensor.js";

package/build/dist/source/html/sensors/BasePointerSensor.d.ts

@@ -12,7 +12,7 @@ export declare class BasePointerSensor extends HtmlElementSensor {
     positionX: number;
     positionY: number;
     modifiers: KeyboardModifiers;
-    constructor(focusSensor?: FocusSensor, windowSensor?: WindowSensor);
+    constructor(element: HTMLElement | SVGElement, focusSensor?: FocusSensor, windowSensor?: WindowSensor);
 }
 export declare function extractPointerButton(e: MouseEvent): PointerButton;
 export declare function isPointerButtonDown(button: PointerButton, buttonsMask: number): boolean;

package/build/dist/source/html/sensors/BasePointerSensor.js

@@ -8,8 +8,8 @@ export var PointerButton;
     PointerButton[PointerButton["Middle"] = 4] = "Middle";
 })(PointerButton || (PointerButton = {}));
 export class BasePointerSensor extends HtmlElementSensor {
-    constructor(focusSensor, windowSensor) {
-        super(focusSensor, windowSensor);
+    constructor(element, focusSensor, windowSensor) {
+        super(element, focusSensor, windowSensor);
         this.positionX = Infinity;
         this.positionY = Infinity;
         this.modifiers = KeyboardModifiers.None;

package/build/dist/source/html/sensors/ButtonSensor.d.ts

@@ -15,8 +15,8 @@ export declare class ButtonSensor extends BasePointerSensor {
     selectedX: number;
     selectedY: number;
     selected: boolean;
-    constructor(focusSensor: FocusSensor, windowSensor: WindowSensor);
-    listen(element: HTMLElement | undefined, enabled?: boolean): void;
+    constructor(element: HTMLElement | SVGElement, focusSensor: FocusSensor, windowSensor: WindowSensor);
+    listen(enabled?: boolean): void;
     protected onPointerDown(e: PointerEvent): void;
     protected onPointerMove(e: PointerEvent): void;
     protected onPointerUp(e: PointerEvent): void;

package/build/dist/source/html/sensors/ButtonSensor.js

@@ -19,8 +19,8 @@ export var ButtonState;
     ButtonState[ButtonState["Released"] = 3] = "Released";
 })(ButtonState || (ButtonState = {}));
 export class ButtonSensor extends BasePointerSensor {
-    constructor(focusSensor, windowSensor) {
-        super(focusSensor, windowSensor);
+    constructor(element, focusSensor, windowSensor) {
+        super(element, focusSensor, windowSensor);
         this.state = ButtonState.Released;
         this.pointerButton = PointerButton.None;
         this.originData = undefined;
@@ -29,24 +29,21 @@ export class ButtonSensor extends BasePointerSensor {
         this.selectedY = Infinity;
         this.selected = false;
     }
-    listen(element, enabled = true) {
-        const existing = this.sourceElement;
-        if (element !== existing) {
-            if (existing) {
-                existing.removeEventListener("pointerdown", this.onPointerDown.bind(this), { capture: true });
-                existing.removeEventListener("pointermove", this.onPointerMove.bind(this), { capture: true });
-                existing.removeEventListener("pointerup", this.onPointerUp.bind(this), { capture: true });
-                existing.removeEventListener("lostpointercapture", this.onLostPointerCapture.bind(this), { capture: true });
-                existing.removeEventListener("keydown", this.onKeyDown.bind(this), { capture: true });
-            }
-            this.sourceElement = element;
-            if (element && enabled) {
-                element.addEventListener("pointerdown", this.onPointerDown.bind(this), { capture: true });
-                element.addEventListener("pointermove", this.onPointerMove.bind(this), { capture: true });
-                element.addEventListener("pointerup", this.onPointerUp.bind(this), { capture: true });
-                element.addEventListener("lostpointercapture", this.onLostPointerCapture.bind(this), { capture: true });
-                element.addEventListener("keydown", this.onKeyDown.bind(this), { capture: true });
-            }
+    listen(enabled = true) {
+        const element = this.sourceElement;
+        if (enabled) {
+            element.addEventListener("pointerdown", this.onPointerDown.bind(this), { capture: true });
+            element.addEventListener("pointermove", this.onPointerMove.bind(this), { capture: true });
+            element.addEventListener("pointerup", this.onPointerUp.bind(this), { capture: true });
+            element.addEventListener("lostpointercapture", this.onLostPointerCapture.bind(this), { capture: true });
+            element.addEventListener("keydown", this.onKeyDown.bind(this), { capture: true });
+        }
+        else {
+            element.removeEventListener("pointerdown", this.onPointerDown.bind(this), { capture: true });
+            element.removeEventListener("pointermove", this.onPointerMove.bind(this), { capture: true });
+            element.removeEventListener("pointerup", this.onPointerUp.bind(this), { capture: true });
+            element.removeEventListener("lostpointercapture", this.onLostPointerCapture.bind(this), { capture: true });
+            element.removeEventListener("keydown", this.onKeyDown.bind(this), { capture: true });
         }
     }
     onPointerDown(e) {
@@ -161,12 +158,6 @@ export class ButtonSensor extends BasePointerSensor {
         this.revision++;
     }
 }
-__decorate([
-    transactional,
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object, Boolean]),
-    __metadata("design:returntype", void 0)
-], ButtonSensor.prototype, "listen", null);
 __decorate([
     transactional,
     options({ logging: LoggingLevel.Off }),
@@ -176,7 +167,7 @@ __decorate([
 ], ButtonSensor.prototype, "press", null);
 __decorate([
     transactional,
-    options({ reentrance: Reentrance.CancelPrevious, logging: LoggingLevel.Off }),
+    options({ reentrance: Reentrance.cancelPrevious, logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [PointerEvent]),
     __metadata("design:returntype", void 0)

package/build/dist/source/html/sensors/DataForSensor.d.ts

@@ -13,6 +13,7 @@ export type DataForSensor = {
     htmlDraggable?: unknown;
     button?: unknown;
 };
+export declare const SymHtmlSensors: unique symbol;
 export declare const SymDataForSensor: unique symbol;
 export declare const SymResizeObserver: unique symbol;
 export declare const EmptyDataArray: any[];

package/build/dist/source/html/sensors/DataForSensor.js

@@ -1,3 +1,4 @@
+export const SymHtmlSensors = Symbol("HtmlSensors");
 export const SymDataForSensor = Symbol("DataForSensor");
 export const SymResizeObserver = Symbol("ResizeObserver");
 export const EmptyDataArray = [];

package/build/dist/source/html/sensors/FocusSensor.d.ts

@@ -15,9 +15,9 @@ export declare class FocusSensor extends HtmlElementSensor {
     activeData: unknown;
     oldActiveData: unknown;
     contextElementDataList: unknown[];
-    constructor(windowSensor: WindowSensor);
+    constructor(element: HTMLElement | SVGElement, windowSensor: WindowSensor);
     setActiveData(data: unknown, debugHint?: string): void;
-    listen(element: HTMLElement | undefined, enabled?: boolean): void;
+    listen(enabled?: boolean): void;
     reset(): void;
     protected onFocusIn(e: FocusEvent): void;
     protected onFocusOut(e: FocusEvent): void;

package/build/dist/source/html/sensors/FocusSensor.js

@@ -12,8 +12,8 @@ import { objectHasMember } from "../ElUtils.js";
 import { grabElementDataList, SymDataForSensor } from "./DataForSensor.js";
 import { HtmlElementSensor } from "./HtmlElementSensor.js";
 export class FocusSensor extends HtmlElementSensor {
-    constructor(windowSensor) {
-        super(undefined, windowSensor);
+    constructor(element, windowSensor) {
+        super(element, undefined, windowSensor);
         this.activeData = undefined;
         this.oldActiveData = undefined;
         this.contextElementDataList = [];
@@ -36,20 +36,17 @@ export class FocusSensor extends HtmlElementSensor {
             this.activeData = data;
         }
     }
-    listen(element, enabled = true) {
-        const existing = this.sourceElement;
-        if (element !== existing) {
-            if (existing) {
-                existing.removeEventListener("focusin", this.onFocusIn.bind(this), { capture: true });
-                existing.removeEventListener("focusout", this.onFocusOut.bind(this), { capture: true });
-                existing.removeEventListener("mousedown", this.onMouseDown.bind(this), { capture: true });
-            }
-            this.sourceElement = element;
-            if (element && enabled) {
-                element.addEventListener("focusin", this.onFocusIn.bind(this), { capture: true });
-                element.addEventListener("focusout", this.onFocusOut.bind(this), { capture: true });
-                element.addEventListener("mousedown", this.onMouseDown.bind(this), { capture: true });
-            }
+    listen(enabled = true) {
+        const element = this.sourceElement;
+        if (enabled) {
+            element.addEventListener("focusin", this.onFocusIn.bind(this), { capture: true });
+            element.addEventListener("focusout", this.onFocusOut.bind(this), { capture: true });
+            element.addEventListener("mousedown", this.onMouseDown.bind(this), { capture: true });
+        }
+        else {
+            element.removeEventListener("focusin", this.onFocusIn.bind(this), { capture: true });
+            element.removeEventListener("focusout", this.onFocusOut.bind(this), { capture: true });
+            element.removeEventListener("mousedown", this.onMouseDown.bind(this), { capture: true });
         }
     }
     reset() {
@@ -138,7 +135,7 @@ __decorate([
 __decorate([
     transactional,
     __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object, Boolean]),
+    __metadata("design:paramtypes", [Boolean]),
     __metadata("design:returntype", void 0)
 ], FocusSensor.prototype, "listen", null);
 __decorate([

package/build/dist/source/html/sensors/HoverSensor.d.ts

@@ -1,10 +1,21 @@
 import { BasePointerSensor } from "./BasePointerSensor.js";
+export type IHoverable = {
+    isHovered: boolean;
+    onHoverStart?: (hover: HoverSensor) => void;
+    onHoverEnd?: (hover: HoverSensor) => void;
+};
 export declare class HoverSensor extends BasePointerSensor {
+    isHovered: boolean;
     target: unknown;
-    constructor();
-    listen(element: HTMLElement | undefined, enabled?: boolean): void;
+    constructor(element: HTMLElement | SVGElement);
+    listen(enabled?: boolean): void;
+    protected onPointerEnter(e: PointerEvent): void;
     protected onPointerOver(e: PointerEvent): void;
-    protected onPointerOut(e: PointerEvent): void;
+    protected onPointerMove(e: PointerEvent): void;
+    protected onPointerLeave(e: PointerEvent): void;
+    protected doPointerEnter(e: PointerEvent): void;
     protected doPointerOver(e: PointerEvent): void;
-    protected doPointerOut(): void;
+    protected doPointerMove(e: PointerEvent): void;
+    protected doPointerLeave(e: PointerEvent): void;
+    protected reset(): void;
 }

package/build/dist/source/html/sensors/HoverSensor.js

@@ -8,34 +8,48 @@ var __metadata = (this && this.__metadata) || function (k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 };
 import { options, transactional, LoggingLevel } from "reactronic";
-import { findTargetElementData, SymDataForSensor } from "./DataForSensor.js";
-import { extractModifierKeys, KeyboardModifiers } from "./KeyboardSensor.js";
+import { SymDataForSensor, findTargetElementData } from "./DataForSensor.js";
 import { BasePointerSensor } from "./BasePointerSensor.js";
+import { KeyboardModifiers, extractModifierKeys } from "./KeyboardSensor.js";
 export class HoverSensor extends BasePointerSensor {
-    constructor() {
-        super();
+    constructor(element) {
+        super(element);
         this.target = undefined;
+        this.isHovered = false;
         this.target = undefined;
     }
-    listen(element, enabled = true) {
-        const existing = this.sourceElement;
-        if (element !== existing) {
-            if (existing) {
-                existing.removeEventListener("pointerover", this.onPointerOver.bind(this), { capture: true });
-                existing.removeEventListener("pointerout", this.onPointerOut.bind(this), { capture: true });
-            }
-            this.sourceElement = element;
-            if (element && enabled) {
-                element.addEventListener("pointerover", this.onPointerOver.bind(this), { capture: true });
-                element.addEventListener("pointerout", this.onPointerOut.bind(this), { capture: true });
-            }
+    listen(enabled = true) {
+        const element = this.sourceElement;
+        if (enabled) {
+            element.addEventListener("pointerenter", this.onPointerEnter.bind(this));
+            element.addEventListener("pointerover", this.onPointerOver.bind(this), { capture: true });
+            element.addEventListener("pointermove", this.onPointerMove.bind(this), { capture: true });
+            element.addEventListener("pointerleave", this.onPointerLeave.bind(this));
         }
+        else {
+            element.removeEventListener("pointerenter", this.onPointerEnter.bind(this));
+            element.removeEventListener("pointerover", this.onPointerOver.bind(this), { capture: true });
+            element.removeEventListener("pointermove", this.onPointerMove.bind(this), { capture: true });
+            element.removeEventListener("pointerleave", this.onPointerLeave.bind(this));
+        }
+    }
+    onPointerEnter(e) {
+        this.doPointerEnter(e);
     }
     onPointerOver(e) {
         this.doPointerOver(e);
     }
-    onPointerOut(e) {
-        this.doPointerOut();
+    onPointerMove(e) {
+        this.doPointerMove(e);
+    }
+    onPointerLeave(e) {
+        this.doPointerLeave(e);
+    }
+    doPointerEnter(e) {
+        this.preventDefault = false;
+        this.stopPropagation = false;
+        this.isHovered = true;
+        this.revision++;
     }
     doPointerOver(e) {
         var _a;
@@ -49,21 +63,34 @@ export class HoverSensor extends BasePointerSensor {
         this.positionY = e.clientY;
         this.revision++;
     }
-    doPointerOut() {
+    doPointerMove(e) {
+        this.preventDefault = false;
+        this.stopPropagation = false;
+        this.modifiers = extractModifierKeys(e);
+        this.positionX = e.clientX;
+        this.positionY = e.clientY;
+        this.revision++;
+    }
+    doPointerLeave(e) {
+        this.reset();
+    }
+    reset() {
         this.preventDefault = false;
         this.stopPropagation = false;
+        this.isHovered = false;
+        this.target = undefined;
         this.positionX = Infinity;
         this.positionY = Infinity;
         this.modifiers = KeyboardModifiers.None;
-        this.target = undefined;
     }
 }
 __decorate([
     transactional,
+    options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object, Boolean]),
+    __metadata("design:paramtypes", [PointerEvent]),
     __metadata("design:returntype", void 0)
-], HoverSensor.prototype, "listen", null);
+], HoverSensor.prototype, "doPointerEnter", null);
 __decorate([
     transactional,
     options({ logging: LoggingLevel.Off }),
@@ -71,10 +98,24 @@ __decorate([
     __metadata("design:paramtypes", [PointerEvent]),
     __metadata("design:returntype", void 0)
 ], HoverSensor.prototype, "doPointerOver", null);
+__decorate([
+    transactional,
+    options({ logging: LoggingLevel.Off }),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [PointerEvent]),
+    __metadata("design:returntype", void 0)
+], HoverSensor.prototype, "doPointerMove", null);
+__decorate([
+    transactional,
+    options({ logging: LoggingLevel.Off }),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [PointerEvent]),
+    __metadata("design:returntype", void 0)
+], HoverSensor.prototype, "doPointerLeave", null);
 __decorate([
     transactional,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", []),
     __metadata("design:returntype", void 0)
-], HoverSensor.prototype, "doPointerOut", null);
+], HoverSensor.prototype, "reset", null);

package/build/dist/source/html/sensors/HtmlDragSensor.d.ts

@@ -33,12 +33,12 @@ export declare class HtmlDragSensor extends HtmlElementSensor {
     immediatePositionX: number;
     immediatePositionY: number;
     immediateModifiers: KeyboardModifiers;
-    constructor(focusSensor: FocusSensor, windowSensor: WindowSensor);
+    constructor(element: HTMLElement | SVGElement, focusSensor: FocusSensor, windowSensor: WindowSensor);
     getData(format: string): unknown;
     setData(format: string, value: unknown): void;
     clearData(format?: string): void;
     setDragImage(value: HTMLElement, x: number, y: number): void;
-    listen(element: HTMLElement | undefined, enabled?: boolean): void;
+    listen(enabled?: boolean): void;
     protected onDragStart(e: DragEvent): void;
     protected onDrag(e: DragEvent): void;
     protected onDragEnter(e: DragEvent): void;

package/build/dist/source/html/sensors/HtmlDragSensor.js

@@ -12,8 +12,8 @@ import { findTargetElementData, SymDataForSensor } from "./DataForSensor.js";
 import { HtmlElementSensor } from "./HtmlElementSensor.js";
 import { extractModifierKeys, KeyboardModifiers } from "./KeyboardSensor.js";
 export class HtmlDragSensor extends HtmlElementSensor {
-    constructor(focusSensor, windowSensor) {
-        super(focusSensor, windowSensor);
+    constructor(element, focusSensor, windowSensor) {
+        super(element, focusSensor, windowSensor);
         this.draggable = undefined;
         this.dragSource = undefined;
         this.dragTarget = undefined;
@@ -60,28 +60,25 @@ export class HtmlDragSensor extends HtmlElementSensor {
         this.draggingImageX = x;
         this.draggingImageY = y;
     }
-    listen(element, enabled = true) {
-        const existing = this.sourceElement;
-        if (element !== existing) {
-            if (existing) {
-                existing.removeEventListener("dragstart", this.onDragStart.bind(this), { capture: true });
-                existing.removeEventListener("drag", this.onDrag.bind(this), { capture: true });
-                existing.removeEventListener("dragenter", this.onDragEnter.bind(this), { capture: false });
-                existing.removeEventListener("dragleave", this.onDragLeave.bind(this), { capture: false });
-                existing.removeEventListener("dragover", this.onDragOver.bind(this), { capture: true });
-                existing.removeEventListener("drop", this.onDrop.bind(this), { capture: true });
-                existing.removeEventListener("dragend", this.onDragEnd.bind(this), { capture: true });
-            }
-            this.sourceElement = element;
-            if (element && enabled) {
-                element.addEventListener("dragstart", this.onDragStart.bind(this), { capture: true });
-                element.addEventListener("drag", this.onDrag.bind(this), { capture: true });
-                element.addEventListener("dragenter", this.onDragEnter.bind(this), { capture: false });
-                element.addEventListener("dragleave", this.onDragLeave.bind(this), { capture: false });
-                element.addEventListener("dragover", this.onDragOver.bind(this), { capture: true });
-                element.addEventListener("drop", this.onDrop.bind(this), { capture: true });
-                element.addEventListener("dragend", this.onDragEnd.bind(this), { capture: true });
-            }
+    listen(enabled = true) {
+        const element = this.sourceElement;
+        if (enabled) {
+            element.addEventListener("dragstart", this.onDragStart.bind(this), { capture: true });
+            element.addEventListener("drag", this.onDrag.bind(this), { capture: true });
+            element.addEventListener("dragenter", this.onDragEnter.bind(this), { capture: false });
+            element.addEventListener("dragleave", this.onDragLeave.bind(this), { capture: false });
+            element.addEventListener("dragover", this.onDragOver.bind(this), { capture: true });
+            element.addEventListener("drop", this.onDrop.bind(this), { capture: true });
+            element.addEventListener("dragend", this.onDragEnd.bind(this), { capture: true });
+        }
+        else {
+            element.removeEventListener("dragstart", this.onDragStart.bind(this), { capture: true });
+            element.removeEventListener("drag", this.onDrag.bind(this), { capture: true });
+            element.removeEventListener("dragenter", this.onDragEnter.bind(this), { capture: false });
+            element.removeEventListener("dragleave", this.onDragLeave.bind(this), { capture: false });
+            element.removeEventListener("dragover", this.onDragOver.bind(this), { capture: true });
+            element.removeEventListener("drop", this.onDrop.bind(this), { capture: true });
+            element.removeEventListener("dragend", this.onDragEnd.bind(this), { capture: true });
         }
     }
     onDragStart(e) {
@@ -291,12 +288,6 @@ __decorate([
     raw,
     __metadata("design:type", Boolean)
 ], HtmlDragSensor.prototype, "dropAllowed", void 0);
-__decorate([
-    transactional,
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object, Boolean]),
-    __metadata("design:returntype", void 0)
-], HtmlDragSensor.prototype, "listen", null);
 __decorate([
     transactional,
     options({ logging: LoggingLevel.Off }),

package/build/dist/source/html/sensors/HtmlElementSensor.d.ts

@@ -2,12 +2,12 @@ import { DataForSensor } from "./DataForSensor.js";
 import { Sensor } from "./Sensor.js";
 import { WindowSensor } from "./WindowSensor.js";
 export declare class HtmlElementSensor extends Sensor {
+    readonly sourceElement: HTMLElement | SVGElement;
     readonly focusSensor?: any;
     readonly windowSensor?: WindowSensor;
-    sourceElement: HTMLElement | undefined;
     preventDefault: boolean;
     stopPropagation: boolean;
-    constructor(focusSensor?: any, windowSensor?: WindowSensor);
-    protected getDefaultSensorData(): DataForSensor | undefined;
+    constructor(sourceElement: HTMLElement | SVGElement, focusSensor?: any, windowSensor?: WindowSensor);
+    protected getDefaultSensorData(): DataForSensor;
     protected setPreventDefaultAndStopPropagation(e: Event): void;
 }