@deck.gl-community/editable-layers 9.0.2 → 9.1.0-beta.2

package/dist/editable-layers/junction-scatterplot-layer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"junction-scatterplot-layer.d.ts","sourceRoot":"","sources":["../../src/editable-layers/junction-scatterplot-layer.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAC,mBAAmB,EAAE,YAAY,EAAC,MAAM,eAAe,CAAC;AACrE,OAAO,EAAC,cAAc,EAAC,MAAM,eAAe,CAAC;AAC7C,OAAO,KAAK,EAAC,qBAAqB,EAAC,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAC,gBAAgB,EAAC,MAAM,iBAAiB,CAAC;AAEjD,OAAO,EAAC,KAAK,EAAC,0BAAuB;AAErC,KAAK,6BAA6B,GAAG,mBAAmB,GACtD,IAAI,CAAC,qBAAqB,EAAE,cAAc,CAAC,GAAG;IAC5C,YAAY,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC,KAAA,KAAK,KAAK,CAAC,CAAC;IACtC,cAAc,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC,KAAA,KAAK,KAAK,CAAC,CAAC;IACxC,cAAc,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,CAAC,KAAA,KAAK,MAAM,CAAC,CAAC;CAC3C,CAAC;AAEJ,qBAAa,wBAAyB,SAAQ,cAAc,CAAC,6BAA6B,CAAC;IACzF,MAAM,CAAC,SAAS,SAA8B;IAC9C,MAAM,CAAC,YAAY,EAAE,YAAY,CAAC,6BAA6B,CAAC,CAK9D;IAEF,YAAY;CA+Bb"}

package/dist/editable-layers/selection-layer.d.ts

@@ -1,4 +1,5 @@
-import { CompositeLayer, CompositeLayerProps, DefaultProps } from '@deck.gl/core';
+import type { CompositeLayerProps, DefaultProps } from '@deck.gl/core';
+import { CompositeLayer } from '@deck.gl/core';
 import turfDifference from '@turf/difference';
 export declare const SELECTION_TYPE: {
     NONE: any;
@@ -24,3 +25,4 @@ export declare class SelectionLayer<DataT, ExtraPropsT> extends CompositeLayer<E
     shouldUpdateState({ changeFlags: { stateChanged, propsOrDataChanged } }: Record<string, any>): any;
 }
 export {};
+//# sourceMappingURL=selection-layer.d.ts.map

package/dist/editable-layers/selection-layer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"selection-layer.d.ts","sourceRoot":"","sources":["../../src/editable-layers/selection-layer.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAC,mBAAmB,EAAE,YAAY,EAAC,MAAM,eAAe,CAAC;AACrE,OAAO,EAAC,cAAc,EAAC,MAAM,eAAe,CAAC;AAI7C,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAO9C,eAAO,MAAM,cAAc;;;;CAI1B,CAAC;AAWF,UAAU,mBAAmB,CAAC,KAAK,CAAE,SAAQ,mBAAmB;IAC9D,QAAQ,EAAE,GAAG,EAAE,CAAC;IAChB,QAAQ,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,GAAG,CAAC;IAC7B,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;CAC9B;AAuCD,qBAAa,cAAc,CAAC,KAAK,EAAE,WAAW,CAAE,SAAQ,cAAc,CACpE,WAAW,GAAG,QAAQ,CAAC,mBAAmB,CAAC,KAAK,CAAC,CAAC,CACnD;IACC,MAAM,CAAC,SAAS,SAAoB;IACpC,MAAM,CAAC,YAAY,yCAAgB;IAEnC,KAAK,EAAE;QACL,uBAAuB,EAAE;YACvB,UAAU,EAAE,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;SAC/C,CAAC;KACH,CAAc;IAEf,uBAAuB,CAAC,WAAW,EAAE,GAAG;IAexC,qBAAqB,CAAC,WAAW,EAAE,GAAG;IAkDtC,YAAY;IAyDZ,iBAAiB,CAAC,EAAC,WAAW,EAAE,EAAC,YAAY,EAAE,kBAAkB,EAAC,EAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;CAGzF"}

package/dist/editable-layers/selection-layer.js

@@ -1,16 +1,15 @@
 // deck.gl-community
 // SPDX-License-Identifier: MIT
 // Copyright (c) vis.gl contributors
-/* eslint-env browser */
 import { CompositeLayer } from '@deck.gl/core';
 import { PolygonLayer } from '@deck.gl/layers';
 import { polygon } from '@turf/helpers';
 import turfBuffer from '@turf/buffer';
 import turfDifference from '@turf/difference';
-import { EditableGeoJsonLayer } from './editable-geojson-layer';
-import { DrawRectangleMode } from '../edit-modes/draw-rectangle-mode';
-import { DrawPolygonMode } from '../edit-modes/draw-polygon-mode';
-import { ViewMode } from '../edit-modes/view-mode';
+import { EditableGeoJsonLayer } from "./editable-geojson-layer.js";
+import { DrawRectangleMode } from "../edit-modes/draw-rectangle-mode.js";
+import { DrawPolygonMode } from "../edit-modes/draw-polygon-mode.js";
+import { ViewMode } from "../edit-modes/view-mode.js";
 export const SELECTION_TYPE = {
     NONE: null,
     RECTANGLE: 'rectangle',

package/dist/index.cjs

@@ -403,7 +403,7 @@ var import_destination = __toESM(require("@turf/destination"), 1);
 var import_bearing = __toESM(require("@turf/bearing"), 1);
 var import_point_to_line_distance = __toESM(require("@turf/point-to-line-distance"), 1);
 var import_helpers2 = require("@turf/helpers");
-var import_viewport_mercator_project = __toESM(require("viewport-mercator-project"), 1);
+var import_viewport_mercator_project = require("viewport-mercator-project");
 function toDeckColor(color, defaultColor = [255, 0, 0, 255]) {
   if (!Array.isArray(color)) {
     return defaultColor;
@@ -445,7 +445,7 @@ function mix(a, b, ratio) {
   return b * ratio + a * (1 - ratio);
 }
 function nearestPointOnProjectedLine(line, inPoint, viewport) {
-  const wmViewport = new import_viewport_mercator_project.default(viewport);
+  const wmViewport = new import_viewport_mercator_project.WebMercatorViewport(viewport);
   const coordinates = line.geometry.coordinates;
   const projectedCoords = coordinates.map(([x3, y3, z = 0]) => wmViewport.project([x3, y3, z]));
   const [x, y] = wmViewport.project(inPoint.geometry.coordinates);
@@ -490,8 +490,8 @@ function nearestPointOnProjectedLine(line, inPoint, viewport) {
     }
   };
 }
-function insertBefore(base, insertBefore2, toInsert) {
-  const at = base.indexOf(insertBefore2);
+function insertBefore(base, insertBeforeText, toInsert) {
+  const at = base.indexOf(insertBeforeText);
   if (at < 0) {
     return base;
   }
@@ -981,7 +981,7 @@ var import_point_to_line_distance2 = __toESM(require("@turf/point-to-line-distan
 var import_meta = require("@turf/meta");
 var import_helpers3 = require("@turf/helpers");
 var import_invariant = require("@turf/invariant");
-var import_viewport_mercator_project2 = __toESM(require("viewport-mercator-project"), 1);
+var import_viewport_mercator_project2 = require("viewport-mercator-project");
 function recursivelyTraverseNestedArrays2(array, prefix, fn) {
   if (!Array.isArray(array[0])) {
     return true;
@@ -1017,7 +1017,7 @@ function mix2(a, b, ratio) {
   return b * ratio + a * (1 - ratio);
 }
 function nearestPointOnProjectedLine2(line, inPoint, viewport) {
-  const wmViewport = new import_viewport_mercator_project2.default(viewport);
+  const wmViewport = new import_viewport_mercator_project2.WebMercatorViewport(viewport);
   const coordinates = line.geometry.coordinates;
   const projectedCoords = coordinates.map(([x3, y3, z = 0]) => wmViewport.project([x3, y3, z]));
   const [x, y] = wmViewport.project(inPoint.geometry.coordinates);
@@ -1066,7 +1066,7 @@ function nearestPointOnLine(lines, inPoint, viewport) {
   var _a, _b;
   let mercator;
   if (viewport) {
-    mercator = new import_viewport_mercator_project2.default(viewport);
+    mercator = new import_viewport_mercator_project2.WebMercatorViewport(viewport);
   }
   let closestPoint = (0, import_helpers3.point)([Infinity, Infinity], {
     dist: Infinity
@@ -1262,6 +1262,9 @@ function mapCoords(coords, callback) {
     return mapCoords(coord, callback);
   }).filter(Boolean);
 }
+function shouldCancelPan(event) {
+  return event.picks.length && event.picks.find((p) => p.featureType === "points");
+}
 
 // dist/edit-modes/immutable-feature-collection.js
 var ImmutableFeatureCollection = class {
@@ -1606,11 +1609,12 @@ var GeoJsonEditMode = class {
     }
     return feature;
   }
-  getAddFeatureAction(featureOrGeometry, features) {
+  getAddFeatureAction(featureOrGeometry, features, featureProperties) {
     const featureOrGeometryAsAny = featureOrGeometry;
+    featureProperties = featureProperties || {};
     const feature = featureOrGeometryAsAny.type === "Feature" ? featureOrGeometryAsAny : {
       type: "Feature",
-      properties: {},
+      properties: featureProperties,
       geometry: featureOrGeometryAsAny
     };
     const rewindFeature = this.rewindPolygon(feature);
@@ -1645,8 +1649,10 @@ var GeoJsonEditMode = class {
       }
     };
   }
-  getAddFeatureOrBooleanPolygonAction(featureOrGeometry, props) {
+  // eslint-disable-next-line complexity
+  getAddFeatureOrBooleanPolygonAction(featureOrGeometry, props, featureProperties) {
     const featureOrGeometryAsAny = featureOrGeometry;
+    featureProperties = featureProperties || {};
     const selectedFeature = this.getSelectedFeature(props);
     const { modeConfig } = props;
     if (modeConfig && modeConfig.booleanOperation) {
@@ -1684,7 +1690,7 @@ var GeoJsonEditMode = class {
       };
       return editAction;
     }
-    return this.getAddFeatureAction(featureOrGeometry, props.data);
+    return this.getAddFeatureAction(featureOrGeometry, props.data, featureProperties);
   }
   createTentativeFeature(props) {
     return null;
@@ -1738,7 +1744,7 @@ var import_bearing3 = __toESM(require("@turf/bearing"), 1);
 var import_distance2 = __toESM(require("@turf/distance"), 1);
 var import_clone = __toESM(require("@turf/clone"), 1);
 var import_helpers4 = require("@turf/helpers");
-var import_viewport_mercator_project3 = __toESM(require("viewport-mercator-project"), 1);
+var import_viewport_mercator_project3 = require("viewport-mercator-project");
 
 // dist/utils/translate-from-center.js
 var import_center = __toESM(require("@turf/center"), 1);
@@ -1749,9 +1755,9 @@ function translateFromCenter(feature, distance7, direction) {
   const initialCenterPoint = (0, import_center.default)(feature);
   const movedCenterPoint = (0, import_rhumb_destination.default)(initialCenterPoint, distance7, direction);
   const movedCoordinates = mapCoords(feature.geometry.coordinates, (coordinate) => {
-    const distance8 = (0, import_rhumb_distance.default)(initialCenterPoint.geometry.coordinates, coordinate);
-    const direction2 = (0, import_rhumb_bearing.default)(initialCenterPoint.geometry.coordinates, coordinate);
-    const movedPosition = (0, import_rhumb_destination.default)(movedCenterPoint.geometry.coordinates, distance8, direction2).geometry.coordinates;
+    const rhumbDistance = (0, import_rhumb_distance.default)(initialCenterPoint.geometry.coordinates, coordinate);
+    const rhumbDirection = (0, import_rhumb_bearing.default)(initialCenterPoint.geometry.coordinates, coordinate);
+    const movedPosition = (0, import_rhumb_destination.default)(movedCenterPoint.geometry.coordinates, rhumbDistance, rhumbDirection).geometry.coordinates;
     return movedPosition;
   });
   feature.geometry.coordinates = movedCoordinates;
@@ -1782,6 +1788,7 @@ var TranslateMode = class extends GeoJsonEditMode {
     if (!this._isTranslatable) {
       return;
     }
+    event.cancelPan();
     this._geometryBeforeTranslate = this.getSelectedFeaturesAsFeatureCollection(props);
   }
   handleStopDragging(event, props) {
@@ -1809,7 +1816,7 @@ var TranslateMode = class extends GeoJsonEditMode {
     const selectedIndexes = props.selectedIndexes;
     const { viewport: viewportDesc, screenSpace } = props.modeConfig || {};
     if (viewportDesc && screenSpace) {
-      const viewport = viewportDesc.project ? viewportDesc : new import_viewport_mercator_project3.default(viewportDesc);
+      const viewport = viewportDesc.project ? viewportDesc : new import_viewport_mercator_project3.WebMercatorViewport(viewportDesc);
       const from = viewport.project(startDragPoint);
       const to = viewport.project(currentPoint);
       const dx = to[0] - from[0];
@@ -2004,6 +2011,9 @@ var ModifyMode = class extends GeoJsonEditMode {
     props.onUpdateCursor(cursor);
   }
   handleStartDragging(event, props) {
+    if (shouldCancelPan(event)) {
+      event.cancelPan();
+    }
     const selectedFeatureIndexes = props.selectedIndexes;
     const editHandle = getPickedIntermediateEditHandle(event.picks);
     if (selectedFeatureIndexes.length && editHandle) {
@@ -2043,7 +2053,7 @@ var import_centroid = __toESM(require("@turf/centroid"), 1);
 var import_bearing4 = __toESM(require("@turf/bearing"), 1);
 var import_bbox_polygon2 = __toESM(require("@turf/bbox-polygon"), 1);
 var import_helpers6 = require("@turf/helpers");
-var import_polygon_to_line = __toESM(require("@turf/polygon-to-line"), 1);
+var import_polygon_to_line = require("@turf/polygon-to-line");
 var import_meta2 = require("@turf/meta");
 var import_distance3 = __toESM(require("@turf/distance"), 1);
 var import_transform_scale = __toESM(require("@turf/transform-scale"), 1);
@@ -2138,6 +2148,7 @@ var ScaleMode = class extends GeoJsonEditMode {
   }
   handleStartDragging(event, props) {
     if (this._selectedEditHandle) {
+      event.cancelPan();
       this._isScaling = true;
       this._geometryBeingScaled = this.getSelectedFeaturesAsFeatureCollection(props);
     }
@@ -2186,7 +2197,7 @@ var ScaleMode = class extends GeoJsonEditMode {
       }
     });
     this._cornerGuidePoints = cornerGuidePoints;
-    return (0, import_helpers6.featureCollection)([(0, import_polygon_to_line.default)(boundingBox), ...this._cornerGuidePoints]);
+    return (0, import_helpers6.featureCollection)([(0, import_polygon_to_line.polygonToLine)(boundingBox), ...this._cornerGuidePoints]);
   }
 };
 function getScaleFactor(centroid, startDragPoint, currentPoint) {
@@ -2205,7 +2216,7 @@ var import_meta3 = require("@turf/meta");
 var import_invariant3 = require("@turf/invariant");
 var import_helpers7 = require("@turf/helpers");
 var import_transform_rotate = __toESM(require("@turf/transform-rotate"), 1);
-var import_polygon_to_line2 = __toESM(require("@turf/polygon-to-line"), 1);
+var import_polygon_to_line2 = require("@turf/polygon-to-line");
 var RotateMode = class extends GeoJsonEditMode {
   _selectedEditHandle;
   _geometryBeingRotated;
@@ -2251,7 +2262,7 @@ var RotateMode = class extends GeoJsonEditMode {
       guideType: "editHandle",
       editHandleType: "rotate"
     });
-    const outFeatures = [(0, import_polygon_to_line2.default)(boundingBox), rotateHandle, lineFromEnvelopeToRotateHandle];
+    const outFeatures = [(0, import_polygon_to_line2.polygonToLine)(boundingBox), rotateHandle, lineFromEnvelopeToRotateHandle];
     return (0, import_helpers7.featureCollection)(outFeatures);
   }
   handleDragging(event, props) {
@@ -2273,6 +2284,7 @@ var RotateMode = class extends GeoJsonEditMode {
   }
   handleStartDragging(event, props) {
     if (this._selectedEditHandle) {
+      event.cancelPan();
       this._isRotating = true;
       this._geometryBeingRotated = this.getSelectedFeaturesAsFeatureCollection(props);
     }
@@ -2522,6 +2534,9 @@ var ExtrudeMode = class extends ModifyMode {
     }
   }
   handleStartDragging(event, props) {
+    if (shouldCancelPan(event)) {
+      event.cancelPan();
+    }
     const selectedFeatureIndexes = props.selectedIndexes;
     const editHandle = getPickedIntermediateEditHandle(event.picks);
     if (selectedFeatureIndexes.length && editHandle) {
@@ -3056,6 +3071,7 @@ var DrawPolygonMode = class extends GeoJsonEditMode {
 var import_bbox_polygon4 = __toESM(require("@turf/bbox-polygon"), 1);
 
 // dist/edit-modes/two-click-polygon-mode.js
+var import_lodash = require("lodash");
 var TwoClickPolygonMode = class extends GeoJsonEditMode {
   handleClick(event, props) {
     if (props.modeConfig && props.modeConfig.dragToDraw) {
@@ -3084,9 +3100,7 @@ var TwoClickPolygonMode = class extends GeoJsonEditMode {
     if (clickSequence.length > 1 && tentativeFeature && tentativeFeature.geometry.type === "Polygon") {
       const feature = {
         type: "Feature",
-        properties: {
-          shape: tentativeFeature.properties.shape
-        },
+        properties: (0, import_lodash.omit)(tentativeFeature.properties, "guideType"),
         geometry: {
           type: "Polygon",
           coordinates: tentativeFeature.geometry.coordinates
@@ -3116,7 +3130,7 @@ var TwoClickPolygonMode = class extends GeoJsonEditMode {
       guides.features.push({
         type: "Feature",
         properties: {
-          shape: polygon3.properties && polygon3.properties.shape,
+          ...polygon3.properties,
           guideType: "tentative"
         },
         geometry: polygon3.geometry
@@ -3234,6 +3248,10 @@ var DrawCircleFromCenterMode = class extends TwoClickPolygonMode {
     const geometry = (0, import_circle.default)(coord1, this.radius, options);
     geometry.properties = geometry.properties || {};
     geometry.properties.shape = "Circle";
+    geometry.properties.editProperties = geometry.properties.editProperties || {};
+    geometry.properties.editProperties.shape = "Circle";
+    geometry.properties.editProperties.radius = { value: this.radius, unit: "kilometers" };
+    geometry.properties.editProperties.center = coord1;
     this.areaCircle = (0, import_area.default)(geometry);
     return geometry;
   }
@@ -3301,6 +3319,10 @@ var DrawCircleByDiameterMode = class extends TwoClickPolygonMode {
     const geometry = (0, import_circle2.default)(centerCoordinates, this.radius, options);
     geometry.properties = geometry.properties || {};
     geometry.properties.shape = "Circle";
+    geometry.properties.editProperties = geometry.properties.editProperties || {};
+    geometry.properties.editProperties.shape = "Circle";
+    geometry.properties.editProperties.radius = { value: this.radius, unit: "kilometers" };
+    geometry.properties.editProperties.center = centerCoordinates;
     this.areaCircle = (0, import_area2.default)(geometry);
     return geometry;
   }
@@ -3364,18 +3386,27 @@ var DrawEllipseByBoundingBoxMode = class extends TwoClickPolygonMode {
     const centerCoordinates = getIntermediatePosition(coord1, coord2);
     const xSemiAxis = Math.max((0, import_distance11.default)((0, import_helpers12.point)(polygonPoints[0]), (0, import_helpers12.point)(polygonPoints[1])), 1e-3);
     const ySemiAxis = Math.max((0, import_distance11.default)((0, import_helpers12.point)(polygonPoints[0]), (0, import_helpers12.point)(polygonPoints[3])), 1e-3);
-    return (0, import_ellipse.default)(centerCoordinates, xSemiAxis, ySemiAxis);
+    const geometry = (0, import_ellipse.default)(centerCoordinates, xSemiAxis, ySemiAxis);
+    geometry.properties = geometry.properties || {};
+    geometry.properties.editProperties = geometry.properties.editProperties || {};
+    geometry.properties.editProperties.shape = "Ellipse";
+    geometry.properties.editProperties.xSemiAxis = { value: xSemiAxis, unit: "kilometers" };
+    geometry.properties.editProperties.ySemiAxis = { value: ySemiAxis, unit: "kilometers" };
+    geometry.properties.editProperties.angle = 0;
+    geometry.properties.editProperties.center = centerCoordinates;
+    return geometry;
   }
 };
 
 // dist/edit-modes/three-click-polygon-mode.js
+var import_lodash2 = require("lodash");
 var ThreeClickPolygonMode = class extends GeoJsonEditMode {
   handleClick(event, props) {
     this.addClickSequence(event);
     const clickSequence = this.getClickSequence();
     const tentativeFeature = this.getTentativeGuide(props);
     if (clickSequence.length > 2 && tentativeFeature && tentativeFeature.geometry.type === "Polygon") {
-      const editAction = this.getAddFeatureOrBooleanPolygonAction(tentativeFeature.geometry, props);
+      const editAction = this.getAddFeatureOrBooleanPolygonAction(tentativeFeature.geometry, props, (0, import_lodash2.omit)(tentativeFeature.properties, "guideType"));
       this.resetClickSequence();
       if (editAction) {
         props.onEdit(editAction);
@@ -3410,6 +3441,7 @@ var ThreeClickPolygonMode = class extends GeoJsonEditMode {
         guides.features.push({
           type: "Feature",
           properties: {
+            ...polygon3.properties,
             guideType: "tentative"
           },
           geometry: polygon3.geometry
@@ -3476,7 +3508,15 @@ var DrawEllipseUsingThreePointsMode = class extends ThreeClickPolygonMode {
     const xSemiAxis = Math.max((0, import_distance12.default)(centerCoordinates, (0, import_helpers13.point)(coord3)), 1e-3);
     const ySemiAxis = Math.max((0, import_distance12.default)(coord1, coord2), 1e-3) / 2;
     const options = { angle: (0, import_bearing8.default)(coord1, coord2) };
-    return (0, import_ellipse2.default)(centerCoordinates, xSemiAxis, ySemiAxis, options);
+    const geometry = (0, import_ellipse2.default)(centerCoordinates, xSemiAxis, ySemiAxis, options);
+    geometry.properties = geometry.properties || {};
+    geometry.properties.editProperties = geometry.properties.editProperties || {};
+    geometry.properties.editProperties.shape = "Ellipse";
+    geometry.properties.editProperties.xSemiAxis = { value: xSemiAxis, unit: "kilometers" };
+    geometry.properties.editProperties.ySemiAxis = { value: ySemiAxis, unit: "kilometers" };
+    geometry.properties.editProperties.angle = options.angle;
+    geometry.properties.editProperties.center = centerCoordinates;
+    return geometry;
   }
 };
 
@@ -3637,7 +3677,7 @@ var Draw90DegreePolygonMode = class extends GeoJsonEditMode {
 };
 
 // dist/edit-modes/draw-polygon-by-dragging-mode.js
-var import_lodash = __toESM(require("lodash.throttle"), 1);
+var import_lodash3 = __toESM(require("lodash.throttle"), 1);
 var DrawPolygonByDraggingMode = class extends DrawPolygonMode {
   handleDraggingThrottled = null;
   handleClick(event, props) {
@@ -3645,7 +3685,7 @@ var DrawPolygonByDraggingMode = class extends DrawPolygonMode {
   handleStartDragging(event, props) {
     event.cancelPan();
     if (props.modeConfig && props.modeConfig.throttleMs) {
-      this.handleDraggingThrottled = (0, import_lodash.default)(this.handleDraggingAux, props.modeConfig.throttleMs);
+      this.handleDraggingThrottled = (0, import_lodash3.default)(this.handleDraggingAux, props.modeConfig.throttleMs);
     } else {
       this.handleDraggingThrottled = this.handleDraggingAux;
     }
@@ -3884,6 +3924,9 @@ var TransformMode = class extends CompositeMode {
     let scaleMode = null;
     let translateMode = null;
     const filteredModes = [];
+    if (event.picks.length) {
+      event.cancelPan();
+    }
     this._modes.forEach((mode) => {
       if (mode instanceof TranslateMode) {
         translateMode = mode;
@@ -3917,12 +3960,35 @@ var TransformMode = class extends CompositeMode {
   }
 };
 
+// dist/edit-modes/delete-mode.js
+var DeleteMode = class extends GeoJsonEditMode {
+  handleClick(_event, props) {
+    const selectedFeatureIndexes = props.lastPointerMoveEvent.picks.map((pick) => pick.index);
+    if (selectedFeatureIndexes.length > 0) {
+      const indexToDelete = selectedFeatureIndexes[0];
+      const features = props.data.features.filter((_, index) => index !== indexToDelete);
+      const updatedData = {
+        ...props.data,
+        features
+      };
+      const editAction = {
+        updatedData,
+        editType: "deleteFeature",
+        editContext: {
+          featureIndexes: selectedFeatureIndexes
+        }
+      };
+      props.onEdit(editAction);
+    }
+  }
+};
+
 // dist/constants.js
 var PROJECTED_PIXEL_SIZE_MULTIPLIER2 = 2 / 3;
 
 // dist/editable-layers/editable-layer.js
 var import_core3 = require("@deck.gl/core");
-var EVENT_TYPES = ["anyclick", "pointermove", "panstart", "panmove", "panend", "keyup"];
+var EVENT_TYPES = ["click", "pointermove", "panstart", "panmove", "panend", "keyup"];
 var EditableLayer = class extends import_core3.CompositeLayer {
   state = void 0;
   // Overridable interaction event handlers
@@ -3986,7 +4052,7 @@ var EditableLayer = class extends import_core3.CompositeLayer {
     }
     func(event);
   }
-  _onanyclick({ srcEvent }) {
+  _onclick({ srcEvent }) {
     const screenCoords = this.getScreenCoords(srcEvent);
     const mapCoords2 = this.getMapCoords(screenCoords);
     const picks = this.getPicks(screenCoords);
@@ -4018,7 +4084,12 @@ var EditableLayer = class extends import_core3.CompositeLayer {
       mapCoords: mapCoords2,
       pointerDownScreenCoords: screenCoords,
       pointerDownMapCoords: mapCoords2,
-      cancelPan: event.stopImmediatePropagation,
+      cancelPan: () => {
+        if (this.props.onCancelPan) {
+          this.props.onCancelPan();
+        }
+        event.stopImmediatePropagation();
+      },
       sourceEvent: event.srcEvent
     });
   }
@@ -4107,35 +4178,41 @@ __publicField(EditableLayer, "layerName", "EditableLayer");
 
 // dist/editable-layers/editable-path-layer.js
 var import_layers5 = require("@deck.gl/layers");
+var uniformBlock = `uniform pickingLineWidthUniforms {
+  float extraPixels;
+} pickingLineWidth;
+`;
+var pickingUniforms = {
+  name: "pickingLineWidth",
+  vs: uniformBlock,
+  fs: uniformBlock,
+  uniformTypes: {
+    extraPixels: "f32"
+  }
+};
 var defaultProps = {
   ...import_layers5.PathLayer.defaultProps,
   pickingLineWidthExtraPixels: { type: "number", min: 0, value: Number.MAX_SAFE_INTEGER }
 };
 var EditablePathLayer = class extends import_layers5.PathLayer {
   getShaders() {
-    var _a;
     const shaders = super.getShaders();
     shaders.vs = insertBefore(shaders.vs, "vec3 width;", `
        if(bool(picking.isActive)){
-        widthPixels.xy += pickingLineWidthExtraPixels;
+        widthPixels.xy += pickingLineWidth.extraPixels;
        }
       `);
     return {
       ...shaders,
-      inject: {
-        ...shaders.inject || {},
-        "vs:#decl": (((_a = shaders.inject) == null ? void 0 : _a["vs:#decl"]) || "").concat("uniform float pickingLineWidthExtraPixels;")
-      }
+      modules: [...shaders.modules, pickingUniforms]
     };
   }
   draw(props) {
-    super.draw({
-      ...props,
-      uniforms: {
-        ...props.uniforms,
-        pickingLineWidthExtraPixels: this.props.pickingLineWidthExtraPixels
-      }
-    });
+    const { pickingLineWidthExtraPixels } = this.props;
+    const pickingProps = { extraPixels: pickingLineWidthExtraPixels };
+    const model = this.state.model;
+    model.shaderInputs.setProps({ pickingLineWidth: pickingProps });
+    super.draw(props);
   }
 };
 EditablePathLayer.defaultProps = defaultProps;
@@ -4261,6 +4338,7 @@ var modeNameMapping = {
   split: SplitPolygonMode,
   extrude: ExtrudeMode,
   elevation: ElevationMode,
+  delete: DeleteMode,
   // Draw modes
   drawPoint: DrawPointMode,
   drawLineString: DrawLineStringMode,
@@ -4968,6 +5046,7 @@ var ResizeCircleMode = class extends GeoJsonEditMode {
   }
   handleStartDragging(event, props) {
     if (this._selectedEditHandle) {
+      event.cancelPan();
       this._isResizing = true;
     }
   }
@@ -5030,6 +5109,9 @@ var ExtendLineStringMode = class extends GeoJsonEditMode {
       return guides;
     }
     const mapCoords2 = props.lastPointerMoveEvent && props.lastPointerMoveEvent.mapCoords;
+    if (!mapCoords2) {
+      return guides;
+    }
     let startPosition = null;
     const { modeConfig } = props;
     if (modeConfig && modeConfig.drawAtFront) {