leaflet-polydraw 2.0.1 → 2.0.2

package/dist/polydraw.es.js

@@ -15606,6 +15606,7 @@ class PolygonInteractionManager {
     __publicField(this, "_boundDragEndListener", null);
     __publicField(this, "dragUsesPointerEvents", false);
     __publicField(this, "polygonTouchStartListeners", /* @__PURE__ */ new WeakMap());
+    __publicField(this, "polygonNativeStartListeners", /* @__PURE__ */ new WeakMap());
     __publicField(this, "_openMenuPopup", null);
     __publicField(this, "transformModeActive", false);
     __publicField(this, "transformControllers", /* @__PURE__ */ new WeakMap());
@@ -15760,7 +15761,6 @@ class PolygonInteractionManager {
     switch (operation2) {
       case "addVertex":
       case "removeVertex":
-      case "removeHole":
       case "toggleOptimization":
         return operation2;
       case "modifierSubtract":
@@ -16348,6 +16348,9 @@ class PolygonInteractionManager {
                   const { level: optimizationLevel, original: originalOptimizationLevel } = this.getOptimizationMetadataFromFeatureGroup(featureGroup);
                   const featureMetadataState = this.getFeatureMetadataState(featureGroup);
                   const newPolygon = this.turfHelper.getMultiPolygon([coords]);
+                  if (this.saveHistoryState) {
+                    this.saveHistoryState("removeHole");
+                  }
                   this.cleanupFeatureGroup(featureGroup);
                   this.removeFeatureGroup(featureGroup);
                   this.emitPolygonUpdated({
@@ -16478,6 +16481,92 @@ class PolygonInteractionManager {
     if (!this.layerManager) return true;
     return this.layerManager.isInActiveLayer(fg) && this.layerManager.isFeatureGroupEditable(fg);
   }
+  beginPolygonDrag(polygon2, startLatLng, originalEvent, options = {}) {
+    var _a2, _b2;
+    if (this.transformModeActive) return false;
+    if (!this.isPolygonInActiveLayer(polygon2)) return false;
+    if (!this.isPolygonDragModeActive()) return false;
+    if (!this.modeManager.canPerformAction("polygonDrag")) return false;
+    if (!startLatLng) return false;
+    (_a2 = originalEvent.stopPropagation) == null ? void 0 : _a2.call(originalEvent);
+    if (originalEvent.cancelable) {
+      (_b2 = originalEvent.preventDefault) == null ? void 0 : _b2.call(originalEvent);
+    }
+    const existingDragData = polygon2._polydrawDragData;
+    if (this.currentDragPolygon === polygon2 && (existingDragData == null ? void 0 : existingDragData.isDragging)) {
+      return true;
+    }
+    const isCloneMode = this.modeManager.getCurrentMode() === DrawMode.Clone;
+    const isModifierPressed = isCloneMode ? false : this.detectDragSubtractModifierKey(originalEvent);
+    this.currentDragIsClone = isCloneMode;
+    this.currentModifierDragMode = isModifierPressed;
+    this.isModifierKeyHeld = isModifierPressed;
+    if (this.saveHistoryState) {
+      this.saveHistoryState(isCloneMode ? "polygonClone" : "polygonDrag");
+    }
+    polygon2._polydrawDragData = {
+      ...polygon2._polydrawDragData ?? {
+        originalOpacity: polygon2.options.fillOpacity
+      },
+      isDragging: true,
+      startPosition: startLatLng,
+      startLatLngs: polygon2.getLatLngs()
+    };
+    polygon2.setStyle({ fillOpacity: this.config.interaction.drag.opacity });
+    if (isCloneMode) {
+      this.showCloneGhost(polygon2._polydrawDragData.startLatLngs);
+    } else {
+      this.clearCloneGhost();
+    }
+    if (this.map.dragging) {
+      this.map.dragging.disable();
+    }
+    this.setSubtractVisualMode(polygon2, isModifierPressed);
+    this.setMarkerVisibility(polygon2, false);
+    try {
+      const container = this.map.getContainer();
+      container.style.cursor = this.config.interaction.drag.dragCursor || "move";
+    } catch {
+    }
+    if (options.attachTouchListeners) {
+      this.attachDragTouchListeners();
+    }
+    this.attachDragDocumentListeners();
+    this.attachDragCancelHandlers();
+    this.currentDragPolygon = polygon2;
+    return true;
+  }
+  attachPolygonNativeStartListeners(polygon2) {
+    if (this.polygonNativeStartListeners.has(polygon2)) return;
+    const startFromNativeEvent = (event) => {
+      if (!this.isPolygonDragModeActive()) return;
+      const latlng = EventAdapter.extractCoordinates(
+        event,
+        this.map
+      );
+      this.beginPolygonDrag(polygon2, latlng, event, {
+        attachTouchListeners: event.type === "touchstart"
+      });
+    };
+    const listeners = {
+      mousedown: (event) => startFromNativeEvent(event),
+      pointerdown: (event) => startFromNativeEvent(event),
+      touchstart: (event) => startFromNativeEvent(event)
+    };
+    this.polygonNativeStartListeners.set(polygon2, listeners);
+    const attach = () => {
+      const el = polygon2._path;
+      if (!el) return;
+      el.addEventListener("mousedown", listeners.mousedown, { capture: true });
+      el.addEventListener("pointerdown", listeners.pointerdown, { capture: true });
+      el.addEventListener("touchstart", listeners.touchstart, { capture: true, passive: false });
+    };
+    if (polygon2._path) {
+      attach();
+    } else {
+      polygon2.once("add", attach);
+    }
+  }
   /**
    * Enable polygon dragging functionality
    */
@@ -16491,151 +16580,34 @@ class PolygonInteractionManager {
       originalOpacity: polygon2.options.fillOpacity
     };
     polygon2.on("mousedown", (e) => {
-      if (this.transformModeActive) {
-        return;
-      }
-      if (!this.isPolygonInActiveLayer(polygon2)) {
-        return;
-      }
       if (!this.isPolygonDragModeActive()) {
         L.DomEvent.stopPropagation(e);
         this.map.fire("mousedown", e);
         return;
       }
-      if (!this.modeManager.canPerformAction("polygonDrag")) {
-        return;
-      }
-      L.DomEvent.stopPropagation(e.originalEvent);
-      L.DomEvent.preventDefault(e.originalEvent);
-      const isCloneMode = this.modeManager.getCurrentMode() === DrawMode.Clone;
-      const isModifierPressed = isCloneMode ? false : this.detectDragSubtractModifierKey(e.originalEvent);
-      this.currentDragIsClone = isCloneMode;
-      this.currentModifierDragMode = isModifierPressed;
-      this.isModifierKeyHeld = isModifierPressed;
-      if (this.saveHistoryState) {
-        this.saveHistoryState(isCloneMode ? "polygonClone" : "polygonDrag");
-      }
-      polygon2._polydrawDragData.isDragging = true;
-      polygon2._polydrawDragData.startPosition = e.latlng;
-      polygon2._polydrawDragData.startLatLngs = polygon2.getLatLngs();
-      polygon2.setStyle({ fillOpacity: this.config.interaction.drag.opacity });
-      if (isCloneMode) {
-        this.showCloneGhost(polygon2._polydrawDragData.startLatLngs);
-      } else {
-        this.clearCloneGhost();
-      }
-      if (this.map.dragging) {
-        this.map.dragging.disable();
-      }
-      this.setSubtractVisualMode(polygon2, isModifierPressed);
-      this.setMarkerVisibility(polygon2, false);
-      try {
-        const container = this.map.getContainer();
-        container.style.cursor = this.config.interaction.drag.dragCursor || "move";
-      } catch {
-      }
-      this.attachDragDocumentListeners();
-      this.attachDragCancelHandlers();
-      this.currentDragPolygon = polygon2;
+      this.beginPolygonDrag(polygon2, e.latlng, e.originalEvent);
     });
     polygon2.on("pointerdown", ((event) => {
       const e = event;
-      if (this.transformModeActive) {
-        return;
-      }
-      if (!this.isPolygonInActiveLayer(polygon2)) {
-        return;
-      }
       if (!this.isPolygonDragModeActive()) {
         const originalEvent = e.originalEvent ?? e;
         L.DomEvent.stopPropagation(originalEvent);
         this.map.fire("pointerdown", e);
         return;
       }
-      if (!this.modeManager.canPerformAction("polygonDrag")) {
-        return;
-      }
       const orig = e.originalEvent ?? e;
-      L.DomEvent.stopPropagation(orig);
-      L.DomEvent.preventDefault(orig);
-      const isCloneMode = this.modeManager.getCurrentMode() === DrawMode.Clone;
-      const isModifierPressed = isCloneMode ? false : this.detectDragSubtractModifierKey(orig);
-      this.currentDragIsClone = isCloneMode;
-      this.currentModifierDragMode = isModifierPressed;
-      this.isModifierKeyHeld = isModifierPressed;
-      if (this.saveHistoryState) {
-        this.saveHistoryState(isCloneMode ? "polygonClone" : "polygonDrag");
-      }
-      polygon2._polydrawDragData.isDragging = true;
-      polygon2._polydrawDragData.startPosition = e.latlng;
-      polygon2._polydrawDragData.startLatLngs = polygon2.getLatLngs();
-      polygon2.setStyle({ fillOpacity: this.config.interaction.drag.opacity });
-      if (isCloneMode) {
-        this.showCloneGhost(polygon2._polydrawDragData.startLatLngs);
-      } else {
-        this.clearCloneGhost();
-      }
-      if (this.map.dragging) {
-        this.map.dragging.disable();
-      }
-      this.setSubtractVisualMode(polygon2, isModifierPressed);
-      this.setMarkerVisibility(polygon2, false);
-      try {
-        const container = this.map.getContainer();
-        container.style.cursor = this.config.interaction.drag.dragCursor || "move";
-      } catch {
-      }
-      this.attachDragDocumentListeners();
-      this.attachDragCancelHandlers();
-      this.currentDragPolygon = polygon2;
+      this.beginPolygonDrag(polygon2, e.latlng, orig);
     }));
     if (LeafletVersionDetector.isV1()) {
       const onTouchStart = (e) => {
-        if (this.transformModeActive) return;
-        if (!this.isPolygonInActiveLayer(polygon2)) return;
         if (!this.isPolygonDragModeActive()) {
           return;
         }
-        if (!this.modeManager.canPerformAction("polygonDrag")) {
-          return;
-        }
-        e.stopPropagation();
-        e.preventDefault();
         const latlng = EventAdapter.extractCoordinates(
           e,
           this.map
         );
-        if (!latlng) return;
-        const isCloneMode = this.modeManager.getCurrentMode() === DrawMode.Clone;
-        this.currentDragIsClone = isCloneMode;
-        this.currentModifierDragMode = false;
-        this.isModifierKeyHeld = false;
-        if (this.saveHistoryState) {
-          this.saveHistoryState(isCloneMode ? "polygonClone" : "polygonDrag");
-        }
-        polygon2._polydrawDragData.isDragging = true;
-        polygon2._polydrawDragData.startPosition = latlng;
-        polygon2._polydrawDragData.startLatLngs = polygon2.getLatLngs();
-        polygon2.setStyle({ fillOpacity: this.config.interaction.drag.opacity });
-        if (isCloneMode) {
-          this.showCloneGhost(polygon2._polydrawDragData.startLatLngs);
-        } else {
-          this.clearCloneGhost();
-        }
-        if (this.map.dragging) {
-          this.map.dragging.disable();
-        }
-        this.setSubtractVisualMode(polygon2, false);
-        this.setMarkerVisibility(polygon2, false);
-        try {
-          const container = this.map.getContainer();
-          container.style.cursor = this.config.interaction.drag.dragCursor || "move";
-        } catch {
-        }
-        this.attachDragTouchListeners();
-        this.attachDragDocumentListeners();
-        this.attachDragCancelHandlers();
-        this.currentDragPolygon = polygon2;
+        this.beginPolygonDrag(polygon2, latlng, e, { attachTouchListeners: true });
       };
       this.polygonTouchStartListeners.set(polygon2, onTouchStart);
       const attachTouch = () => {
@@ -16652,6 +16624,7 @@ class PolygonInteractionManager {
         polygon2.once("add", attachTouch);
       }
     }
+    this.attachPolygonNativeStartListeners(polygon2);
     polygon2.on("mouseover", () => {
       if (!this.isPolygonInActiveLayer(polygon2)) return;
       if (!polygon2._polydrawDragData || !polygon2._polydrawDragData.isDragging) {
@@ -16677,6 +16650,7 @@ class PolygonInteractionManager {
    */
   updateMarkerDraggableState() {
     const shouldBeDraggable = this.modeManager.canPerformAction("markerDrag");
+    const markersShouldCapturePointer = this.modeManager.getCurrentMode() !== DrawMode.Clone;
     this.getFeatureGroups().forEach((featureGroup) => {
       const isActiveLayer = this.isFeatureGroupInActiveLayer(featureGroup);
       const effectiveDraggable = shouldBeDraggable && isActiveLayer;
@@ -16685,6 +16659,10 @@ class PolygonInteractionManager {
           const marker = layer;
           try {
             marker.options.draggable = effectiveDraggable;
+            const element = marker.getElement();
+            if (element) {
+              element.style.pointerEvents = markersShouldCapturePointer ? "auto" : "none";
+            }
             if (marker.dragging) {
               if (effectiveDraggable) {
                 marker.dragging.enable();
@@ -16779,6 +16757,7 @@ class PolygonInteractionManager {
       if (layer instanceof L.Marker) {
         this.cleanupMarker(layer);
       } else if (layer instanceof L.Polygon) {
+        this.detachPolygonNativeStartListeners(layer);
         this.detachPolygonTouchStart(layer);
         this.polygonFeatureGroupMap.delete(layer);
       }
@@ -17281,7 +17260,6 @@ class PolygonInteractionManager {
     if (this.dragUsesPointerEvents) {
       document.addEventListener("pointermove", this._boundDragMoveListener);
       document.addEventListener("pointerup", this._boundDragEndListener);
-      return;
     }
     document.addEventListener("mousemove", this._boundDragMoveListener);
     document.addEventListener("mouseup", this._boundDragEndListener);
@@ -17290,17 +17268,15 @@ class PolygonInteractionManager {
     if (this._boundDragMoveListener) {
       if (this.dragUsesPointerEvents) {
         document.removeEventListener("pointermove", this._boundDragMoveListener);
-      } else {
-        document.removeEventListener("mousemove", this._boundDragMoveListener);
       }
+      document.removeEventListener("mousemove", this._boundDragMoveListener);
       this._boundDragMoveListener = null;
     }
     if (this._boundDragEndListener) {
       if (this.dragUsesPointerEvents) {
         document.removeEventListener("pointerup", this._boundDragEndListener);
-      } else {
-        document.removeEventListener("mouseup", this._boundDragEndListener);
       }
+      document.removeEventListener("mouseup", this._boundDragEndListener);
       this._boundDragEndListener = null;
     }
     this.dragUsesPointerEvents = false;
@@ -17333,6 +17309,17 @@ class PolygonInteractionManager {
     }
     this.polygonTouchStartListeners.delete(polygon2);
   }
+  detachPolygonNativeStartListeners(polygon2) {
+    const listeners = this.polygonNativeStartListeners.get(polygon2);
+    if (!listeners) return;
+    const el = polygon2._path;
+    if (el) {
+      el.removeEventListener("mousedown", listeners.mousedown, { capture: true });
+      el.removeEventListener("pointerdown", listeners.pointerdown, { capture: true });
+      el.removeEventListener("touchstart", listeners.touchstart, { capture: true });
+    }
+    this.polygonNativeStartListeners.delete(polygon2);
+  }
   attachDragCancelHandlers() {
     if (this.dragCancelHandlersAttached) return;
     this.dragCancelHandlersAttached = true;