@deck.gl-community/editable-layers 9.2.0-beta.6 → 9.2.5

package/src/edit-modes/draw-polygon-by-dragging-mode.ts

@@ -4,20 +4,20 @@
 
 import throttle from 'lodash.throttle';
 import {ClickEvent, StartDraggingEvent, StopDraggingEvent, DraggingEvent, ModeProps} from './types';
-import {Polygon, FeatureCollection} from '../utils/geojson-types';
+import {Polygon, SimpleFeatureCollection} from '../utils/geojson-types';
 import {getPickedEditHandle} from './utils';
 import {DrawPolygonMode} from './draw-polygon-mode';
 
-type DraggingHandler = (event: DraggingEvent, props: ModeProps<FeatureCollection>) => void;
+type DraggingHandler = (event: DraggingEvent, props: ModeProps<SimpleFeatureCollection>) => void;
 
 export class DrawPolygonByDraggingMode extends DrawPolygonMode {
   handleDraggingThrottled: DraggingHandler | null | undefined = null;
 
-  handleClick(event: ClickEvent, props: ModeProps<FeatureCollection>) {
+  handleClick(event: ClickEvent, props: ModeProps<SimpleFeatureCollection>) {
     // No-op
   }
 
-  handleStartDragging(event: StartDraggingEvent, props: ModeProps<FeatureCollection>) {
+  handleStartDragging(event: StartDraggingEvent, props: ModeProps<SimpleFeatureCollection>) {
     event.cancelPan();
     if (props.modeConfig && props.modeConfig.throttleMs) {
       // eslint-disable-next-line @typescript-eslint/unbound-method
@@ -28,7 +28,7 @@ export class DrawPolygonByDraggingMode extends DrawPolygonMode {
     }
   }
 
-  handleStopDragging(event: StopDraggingEvent, props: ModeProps<FeatureCollection>) {
+  handleStopDragging(event: StopDraggingEvent, props: ModeProps<SimpleFeatureCollection>) {
     this.addClickSequence(event);
     const clickSequence = this.getClickSequence();
     // @ts-expect-error cancel() not typed
@@ -52,7 +52,7 @@ export class DrawPolygonByDraggingMode extends DrawPolygonMode {
     this.resetClickSequence();
   }
 
-  handleDraggingAux(event: DraggingEvent, props: ModeProps<FeatureCollection>) {
+  handleDraggingAux(event: DraggingEvent, props: ModeProps<SimpleFeatureCollection>) {
     const {picks} = event;
     const clickedEditHandle = getPickedEditHandle(picks);
 
@@ -69,13 +69,13 @@ export class DrawPolygonByDraggingMode extends DrawPolygonMode {
     }
   }
 
-  handleDragging(event: DraggingEvent, props: ModeProps<FeatureCollection>) {
+  handleDragging(event: DraggingEvent, props: ModeProps<SimpleFeatureCollection>) {
     if (this.handleDraggingThrottled) {
       this.handleDraggingThrottled(event, props);
     }
   }
 
-  handleKeyUp(event: KeyboardEvent, props: ModeProps<FeatureCollection>) {
+  handleKeyUp(event: KeyboardEvent, props: ModeProps<SimpleFeatureCollection>) {
     if (event.key === 'Enter') {
       const clickSequence = this.getClickSequence();
       if (clickSequence.length > 2) {

package/src/edit-modes/draw-polygon-mode.ts

@@ -2,10 +2,11 @@
 // SPDX-License-Identifier: MIT
 // Copyright (c) vis.gl contributors
 
-import lineIntersect from '@turf/line-intersect';
-import { polygon as turfPolygon} from '@turf/helpers';
-import booleanWithin from "@turf/boolean-within";
-
+import {lineIntersect} from '@turf/line-intersect';
+import {polygon as turfPolygon} from '@turf/helpers';
+import {booleanWithin} from '@turf/boolean-within';
+import type {Geometry} from 'geojson';
+import {kinks} from '@turf/kinks';
 
 import {
   ClickEvent,
@@ -16,94 +17,88 @@ import {
   GuideFeature,
   DoubleClickEvent
 } from './types';
-import {Position, FeatureCollection, Geometry} from '../utils/geojson-types';
+import {Position, FeatureCollection, SimpleFeatureCollection} from '../utils/geojson-types';
 import {getPickedEditHandle} from './utils';
 import {GeoJsonEditMode} from './geojson-edit-mode';
-import { ImmutableFeatureCollection } from './immutable-feature-collection';
-
+import {ImmutableFeatureCollection} from './immutable-feature-collection';
 
 export class DrawPolygonMode extends GeoJsonEditMode {
-
-  holeSequence: Position[] = [];  
+  holeSequence: Position[] = [];
   isDrawingHole = false;
 
   createTentativeFeature(props: ModeProps<FeatureCollection>): TentativeFeature {
-    const { lastPointerMoveEvent } = props;
+    const {lastPointerMoveEvent} = props;
     const clickSequence = this.getClickSequence();
     const holeSequence = this.holeSequence;
-    const lastCoords = lastPointerMoveEvent
-      ? [lastPointerMoveEvent.mapCoords]
-      : [];
+    const lastCoords = lastPointerMoveEvent ? [lastPointerMoveEvent.mapCoords] : [];
 
     let geometry: Geometry;
 
     if (this.isDrawingHole && holeSequence.length > 1) {
       geometry = {
-        type: "Polygon",
+        type: 'Polygon',
         coordinates: [
           [...clickSequence, clickSequence[0]],
-          [...holeSequence, ...lastCoords, holeSequence[0]],
-        ],
+          [...holeSequence, ...lastCoords, holeSequence[0]]
+        ]
       };
     } else if (clickSequence.length > 2) {
       geometry = {
-        type: "Polygon",
-        coordinates: [[...clickSequence, ...lastCoords, clickSequence[0]]],
+        type: 'Polygon',
+        coordinates: [[...clickSequence, ...lastCoords, clickSequence[0]]]
       };
     } else {
       geometry = {
-        type: "LineString",
-        coordinates: [...clickSequence, ...lastCoords],
+        type: 'LineString',
+        coordinates: [...clickSequence, ...lastCoords]
       };
     }
 
     return {
-      type: "Feature",
+      type: 'Feature',
       properties: {
-        guideType: "tentative",
+        guideType: 'tentative'
       },
-      geometry,
+      geometry
     };
   }
 
   getGuides(props: ModeProps<FeatureCollection>): GuideFeatureCollection {
     const guides: GuideFeatureCollection = {
-          type: "FeatureCollection",
-          features: [],
-        };
-    
-        const tentative = this.createTentativeFeature(props);
-        if (tentative) guides.features.push(tentative);
-    
-        const sequence = this.isDrawingHole
-          ? this.holeSequence
-          : this.getClickSequence();
-    
-        const handles: GuideFeature[] = sequence.map((coord, index) => ({
-          type: "Feature",
-          properties: {
-            guideType: "editHandle",
-            editHandleType: "existing",
-            featureIndex: -1,
-            positionIndexes: [index],
-          },
-          geometry: {
-            type: "Point",
-            coordinates: coord,
-          },
-        }));
-    
-        guides.features.push(...handles);
-        return guides;
+      type: 'FeatureCollection',
+      features: []
+    };
+
+    const tentative = this.createTentativeFeature(props);
+    if (tentative) guides.features.push(tentative);
+
+    const sequence = this.isDrawingHole ? this.holeSequence : this.getClickSequence();
+
+    const handles: GuideFeature[] = sequence.map((coord, index) => ({
+      type: 'Feature',
+      properties: {
+        guideType: 'editHandle',
+        editHandleType: 'existing',
+        featureIndex: -1,
+        positionIndexes: [index]
+      },
+      geometry: {
+        type: 'Point',
+        coordinates: coord
+      }
+    }));
+
+    guides.features.push(...handles);
+    return guides;
   }
 
   // eslint-disable-next-line complexity, max-statements
-  handleClick(event: ClickEvent, props: ModeProps<FeatureCollection>) {
+  handleClick(event: ClickEvent, props: ModeProps<SimpleFeatureCollection>) {
     const {picks} = event;
     const clickedEditHandle = getPickedEditHandle(picks);
     const clickSequence = this.getClickSequence();
     const coords = event.mapCoords;
-    
+
     // Check if they clicked on an edit handle to complete the polygon
     if (
       !this.isDrawingHole &&
@@ -117,7 +112,7 @@ export class DrawPolygonMode extends GeoJsonEditMode {
       this.finishDrawing(props);
       return;
     }
-    
+
     // Check if they clicked near the first point to complete the polygon
     if (!this.isDrawingHole && clickSequence.length > 2) {
       if (isNearFirstPoint(coords, clickSequence[0])) {
@@ -126,28 +121,25 @@ export class DrawPolygonMode extends GeoJsonEditMode {
         return;
       }
     }
-    
+
     if (this.isDrawingHole) {
       const current = this.holeSequence;
       current.push(coords);
 
       if (current.length > 2) {
         const poly: Geometry = {
-          type: "Polygon",
+          type: 'Polygon',
           coordinates: [
             [...clickSequence, clickSequence[0]],
-            [...current, current[0]],
-          ],
+            [...current, current[0]]
+          ]
         };
 
         this.resetClickSequence();
         this.holeSequence = [];
         this.isDrawingHole = false;
 
-        const editAction = this.getAddFeatureOrBooleanPolygonAction(
-          poly,
-          props,
-        );
+        const editAction = this.getAddFeatureOrBooleanPolygonAction(poly, props);
         if (editAction) props.onEdit(editAction);
       }
       return;
@@ -173,24 +165,24 @@ export class DrawPolygonMode extends GeoJsonEditMode {
     }
   }
 
-  handleDoubleClick(_event: DoubleClickEvent, props: ModeProps<FeatureCollection>) {
+  handleDoubleClick(_event: DoubleClickEvent, props: ModeProps<SimpleFeatureCollection>) {
     this.finishDrawing(props);
     this.resetClickSequence();
   }
 
-  handleKeyUp(event: KeyboardEvent, props: ModeProps<FeatureCollection>) {
-    if (event.key === "Enter") {
+  handleKeyUp(event: KeyboardEvent, props: ModeProps<SimpleFeatureCollection>) {
+    if (event.key === 'Enter') {
       this.finishDrawing(props);
       this.resetClickSequence();
-    } else if (event.key === "Escape") {
+    } else if (event.key === 'Escape') {
       this.resetClickSequence();
       this.holeSequence = [];
       this.isDrawingHole = false;
 
       props.onEdit({
         updatedData: props.data,
-        editType: "cancelFeature",
-        editContext: {},
+        editType: 'cancelFeature',
+        editContext: {}
       });
     }
   }
@@ -201,7 +193,7 @@ export class DrawPolygonMode extends GeoJsonEditMode {
   }
 
   // eslint-disable-next-line max-statements, complexity
-  finishDrawing(props: ModeProps<FeatureCollection>) {
+  finishDrawing(props: ModeProps<SimpleFeatureCollection>) {
     const clickSequence = this.getClickSequence();
     const polygon = [...clickSequence, clickSequence[0]];
 
@@ -210,27 +202,16 @@ export class DrawPolygonMode extends GeoJsonEditMode {
     const canAddHole = canAddHoleToPolygon(props);
     const canOverlap = canPolygonOverlap(props);
 
-
     // Check if the polygon intersects itself (excluding shared start/end point)
     if (!canOverlap) {
-      const overlapping = lineIntersect(
-        newPolygon,
-        newPolygon,
-      ).features.filter(
-        (intersection) =>
-          !newPolygon.geometry.coordinates[0].some(
-            (coord) =>
-              coord[0] === intersection.geometry.coordinates[0] &&
-              coord[1] === intersection.geometry.coordinates[1],
-          ),
-      );
-  
+      const overlapping = kinks(newPolygon).features;
+
       if (overlapping.length > 0) {
         // ❌ Invalid polygon: overlaps
         props.onEdit({
           updatedData: props.data,
-          editType: "invalidPolygon",
-          editContext: { reason: "overlaps" },
+          editType: 'invalidPolygon',
+          editContext: {reason: 'overlaps'}
         });
         this.resetClickSequence();
         return;
@@ -244,14 +225,14 @@ export class DrawPolygonMode extends GeoJsonEditMode {
         return;
       }
     }
-    
+
     // If no valid hole was found, add the polygon as a new feature
     const editAction = this.getAddFeatureOrBooleanPolygonAction(
       {
-        type: "Polygon",
-        coordinates: [[...this.getClickSequence(), this.getClickSequence()[0]]],
+        type: 'Polygon',
+        coordinates: [[...this.getClickSequence(), this.getClickSequence()[0]]]
       },
-      props,
+      props
     );
     if (editAction) props.onEdit(editAction);
     this.resetClickSequence();
@@ -261,18 +242,24 @@ export class DrawPolygonMode extends GeoJsonEditMode {
   private tryAddHoleToExistingPolygon(
     newPolygon: any,
     polygon: Position[],
-    props: ModeProps<FeatureCollection>
-  ): { handled: boolean } {
+    props: ModeProps<SimpleFeatureCollection>
+  ): {handled: boolean} {
     for (const [featureIndex, feature] of props.data.features.entries()) {
-      if (feature.geometry.type === "Polygon") {
-        const result = this.validateAndCreateHole(feature, featureIndex, newPolygon, polygon, props);
+      if (feature.geometry.type === 'Polygon') {
+        const result = this.validateAndCreateHole(
+          feature,
+          featureIndex,
+          newPolygon,
+          polygon,
+          props
+        );
         if (result.handled) {
           return result;
         }
       }
     }
-    
-    return { handled: false };
+
+    return {handled: false};
   }
 
   private validateAndCreateHole(
@@ -280,31 +267,31 @@ export class DrawPolygonMode extends GeoJsonEditMode {
     featureIndex: number,
     newPolygon: any,
     polygon: Position[],
-    props: ModeProps<FeatureCollection>
-  ): { handled: boolean } {
+    props: ModeProps<SimpleFeatureCollection>
+  ): {handled: boolean} {
     const outer = turfPolygon(feature.geometry.coordinates);
 
     // Check existing holes for conflicts
     for (let i = 1; i < feature.geometry.coordinates.length; i++) {
       const hole = turfPolygon([feature.geometry.coordinates[i]]);
       const intersection = lineIntersect(hole, newPolygon);
-      
+
       if (intersection.features.length > 0) {
         props.onEdit({
           updatedData: props.data,
-          editType: "invalidHole",
-          editContext: { reason: "intersects-existing-hole" },
+          editType: 'invalidHole',
+          editContext: {reason: 'intersects-existing-hole'}
         });
-        return { handled: true };
+        return {handled: true};
       }
 
       if (booleanWithin(hole, newPolygon) || booleanWithin(newPolygon, hole)) {
         props.onEdit({
           updatedData: props.data,
-          editType: "invalidHole",
-          editContext: { reason: "contains-or-contained-by-existing-hole" },
+          editType: 'invalidHole',
+          editContext: {reason: 'contains-or-contained-by-existing-hole'}
         });
-        return { handled: true };
+        return {handled: true};
       }
     }
 
@@ -313,19 +300,19 @@ export class DrawPolygonMode extends GeoJsonEditMode {
     if (intersectionWithOuter.features.length > 0) {
       props.onEdit({
         updatedData: props.data,
-        editType: "invalidPolygon",
-        editContext: { reason: "intersects-existing-polygon" },
+        editType: 'invalidPolygon',
+        editContext: {reason: 'intersects-existing-polygon'}
       });
-      return { handled: true };
+      return {handled: true};
     }
 
     if (booleanWithin(outer, newPolygon)) {
       props.onEdit({
         updatedData: props.data,
-        editType: "invalidPolygon",
-        editContext: { reason: "contains-existing-polygon" },
+        editType: 'invalidPolygon',
+        editContext: {reason: 'contains-existing-polygon'}
       });
-      return { handled: true };
+      return {handled: true};
     }
 
     // Check if new polygon is within outer polygon (valid hole)
@@ -333,45 +320,37 @@ export class DrawPolygonMode extends GeoJsonEditMode {
       const updatedData = new ImmutableFeatureCollection(props.data)
         .replaceGeometry(featureIndex, {
           ...feature.geometry,
-          coordinates: [...feature.geometry.coordinates, polygon],
+          coordinates: [...feature.geometry.coordinates, polygon]
         })
         .getObject();
 
       props.onEdit({
         updatedData,
-        editType: "addHole",
-        editContext: { hole: newPolygon.geometry },
+        editType: 'addHole',
+        editContext: {hole: newPolygon.geometry}
       });
-      return { handled: true };
+      return {handled: true};
     }
-    return { handled: false };
+    return {handled: false};
   }
 }
 
 // Helper function to check if a point is near the first point in the sequence
-function isNearFirstPoint(
-  click: Position,
-  first: Position,
-  threshold = 1e-4,
-): boolean {
+function isNearFirstPoint(click: Position, first: Position, threshold = 1e-4): boolean {
   const dx = click[0] - first[0];
   const dy = click[1] - first[1];
   return dx * dx + dy * dy < threshold * threshold;
 }
 
 // Helper function to determine if a hole can be added to a polygon
-function canAddHoleToPolygon(
-  props: ModeProps<FeatureCollection>
-): boolean {
+function canAddHoleToPolygon(props: ModeProps<FeatureCollection>): boolean {
   // For simplicity, always return true in this example.
   // Implement your own logic based on application requirements.
   return props.modeConfig?.allowHoles ?? false;
 }
 
 // Helper function to determine if a polygon can intersect itself
-function canPolygonOverlap(
-  props: ModeProps<FeatureCollection>
-): boolean {
+function canPolygonOverlap(props: ModeProps<FeatureCollection>): boolean {
   // Return the value of allowSelfIntersection (defaults to false for safety)
   return props.modeConfig?.allowSelfIntersection ?? false;
 }

package/src/edit-modes/draw-rectangle-from-center-mode.ts

@@ -3,11 +3,11 @@
 // Copyright (c) vis.gl contributors
 
 import bboxPolygon from '@turf/bbox-polygon';
-import {Position, Polygon, FeatureOf} from '../utils/geojson-types';
+import {Position, Polygon, Feature} from '../utils/geojson-types';
 import {TwoClickPolygonMode} from './two-click-polygon-mode';
 
 export class DrawRectangleFromCenterMode extends TwoClickPolygonMode {
-  getTwoClickPolygon(coord1: Position, coord2: Position, modeConfig: any): FeatureOf<Polygon> {
+  getTwoClickPolygon(coord1: Position, coord2: Position, modeConfig: any): Feature<Polygon> {
     const longitude =
       coord1[0] > coord2[0]
         ? coord1[0] + Math.abs(coord1[0] - coord2[0])
@@ -21,7 +21,6 @@ export class DrawRectangleFromCenterMode extends TwoClickPolygonMode {
     rectangle.properties = rectangle.properties || {};
     rectangle.properties.shape = 'Rectangle';
 
-    // @ts-expect-error turf typing too wide
     return rectangle;
   }
 }

package/src/edit-modes/draw-rectangle-mode.ts

@@ -3,16 +3,15 @@
 // Copyright (c) vis.gl contributors
 
 import bboxPolygon from '@turf/bbox-polygon';
-import {Position, Polygon, FeatureOf} from '../utils/geojson-types';
+import {Position, Polygon, Feature} from '../utils/geojson-types';
 import {TwoClickPolygonMode} from './two-click-polygon-mode';
 
 export class DrawRectangleMode extends TwoClickPolygonMode {
-  getTwoClickPolygon(coord1: Position, coord2: Position, modeConfig: any): FeatureOf<Polygon> {
+  getTwoClickPolygon(coord1: Position, coord2: Position, modeConfig: any): Feature<Polygon> {
     const rectangle = bboxPolygon([coord1[0], coord1[1], coord2[0], coord2[1]]);
     rectangle.properties = rectangle.properties || {};
     rectangle.properties.shape = 'Rectangle';
 
-    // @ts-expect-error turf typing too wide
     return rectangle;
   }
 }

package/src/edit-modes/draw-rectangle-using-three-points-mode.ts

@@ -3,7 +3,7 @@
 // Copyright (c) vis.gl contributors
 
 import {generatePointsParallelToLinePoints} from './utils';
-import {Position, Polygon, FeatureOf} from '../utils/geojson-types';
+import {Position, Polygon, Feature} from '../utils/geojson-types';
 import {ThreeClickPolygonMode} from './three-click-polygon-mode';
 
 export class DrawRectangleUsingThreePointsMode extends ThreeClickPolygonMode {
@@ -12,7 +12,7 @@ export class DrawRectangleUsingThreePointsMode extends ThreeClickPolygonMode {
     coord2: Position,
     coord3: Position,
     modeConfig: any
-  ): FeatureOf<Polygon> | null | undefined {
+  ): Feature<Polygon> | null | undefined {
     const [p3, p4] = generatePointsParallelToLinePoints(coord1, coord2, coord3);
 
     return {

package/src/edit-modes/draw-square-from-center-mode.ts

@@ -6,11 +6,11 @@ import bboxPolygon from '@turf/bbox-polygon';
 import turfDistance from '@turf/distance';
 import turfAlong from '@turf/along';
 import {point, lineString as turfLineString} from '@turf/helpers';
-import {Position, Polygon, FeatureOf} from '../utils/geojson-types';
+import {Position, Polygon, Feature} from '../utils/geojson-types';
 import {TwoClickPolygonMode} from './two-click-polygon-mode';
 
 export class DrawSquareFromCenterMode extends TwoClickPolygonMode {
-  getTwoClickPolygon(coord1: Position, coord2: Position, modeConfig: any): FeatureOf<Polygon> {
+  getTwoClickPolygon(coord1: Position, coord2: Position, modeConfig: any): Feature<Polygon> {
     // get the coordinates of the other two rectangle vertices
     const coord3 = [coord2[0], coord1[1]];
     const coord4 = [coord1[0], coord2[1]];
@@ -44,7 +44,6 @@ export class DrawSquareFromCenterMode extends TwoClickPolygonMode {
     square.properties = square.properties || {};
     square.properties.shape = 'Square';
 
-    // @ts-expect-error turf typing too wide
     return square;
   }
 }

package/src/edit-modes/draw-square-mode.ts

@@ -6,11 +6,11 @@ import bboxPolygon from '@turf/bbox-polygon';
 import turfDistance from '@turf/distance';
 import turfAlong from '@turf/along';
 import {point, lineString as turfLineString} from '@turf/helpers';
-import {Position, Polygon, FeatureOf} from '../utils/geojson-types';
+import {Position, Polygon, Feature} from '../utils/geojson-types';
 import {TwoClickPolygonMode} from './two-click-polygon-mode';
 
 export class DrawSquareMode extends TwoClickPolygonMode {
-  getTwoClickPolygon(coord1: Position, coord2: Position, modeConfig: any): FeatureOf<Polygon> {
+  getTwoClickPolygon(coord1: Position, coord2: Position, modeConfig: any): Feature<Polygon> {
     // get the coordinates of the other two rectangle vertices
     const coord3 = [coord2[0], coord1[1]];
     const coord4 = [coord1[0], coord2[1]];
@@ -34,7 +34,6 @@ export class DrawSquareMode extends TwoClickPolygonMode {
     square.properties = square.properties || {};
     square.properties.shape = 'Square';
 
-    // @ts-expect-error turf types too wide
     return square;
   }
 }

package/src/edit-modes/duplicate-mode.ts

@@ -3,11 +3,11 @@
 // Copyright (c) vis.gl contributors
 
 import {StartDraggingEvent, ModeProps} from './types';
-import {FeatureCollection} from '../utils/geojson-types';
+import {FeatureCollection, SimpleFeatureCollection} from '../utils/geojson-types';
 import {TranslateMode} from './translate-mode';
 
 export class DuplicateMode extends TranslateMode {
-  handleStartDragging(event: StartDraggingEvent, props: ModeProps<FeatureCollection>) {
+  handleStartDragging(event: StartDraggingEvent, props: ModeProps<SimpleFeatureCollection>) {
     super.handleStartDragging(event, props);
 
     if (this._geometryBeforeTranslate) {

package/src/edit-modes/extend-line-string-mode.ts

@@ -2,13 +2,20 @@
 // SPDX-License-Identifier: MIT
 // Copyright (c) vis.gl contributors
 
-import {Position, LineString, FeatureCollection} from '../utils/geojson-types';
+import {
+  Position,
+  LineString,
+  FeatureCollection,
+  SimpleFeatureCollection
+} from '../utils/geojson-types';
 import {ClickEvent, PointerMoveEvent, ModeProps, GuideFeatureCollection} from './types';
 import {GeoJsonEditMode} from './geojson-edit-mode';
 import {ImmutableFeatureCollection} from './immutable-feature-collection';
 
 export class ExtendLineStringMode extends GeoJsonEditMode {
-  getSingleSelectedLineString(props: ModeProps<FeatureCollection>): LineString | null | undefined {
+  getSingleSelectedLineString(
+    props: ModeProps<SimpleFeatureCollection>
+  ): LineString | null | undefined {
     const selectedGeometry = this.getSelectedGeometry(props);
 
     if (selectedGeometry && selectedGeometry.type === 'LineString') {
@@ -17,7 +24,7 @@ export class ExtendLineStringMode extends GeoJsonEditMode {
     return null;
   }
 
-  handleClick(event: ClickEvent, props: ModeProps<FeatureCollection>) {
+  handleClick(event: ClickEvent, props: ModeProps<SimpleFeatureCollection>) {
     const {selectedIndexes} = props;
     const selectedLineString = this.getSingleSelectedLineString(props);
 
@@ -49,7 +56,7 @@ export class ExtendLineStringMode extends GeoJsonEditMode {
     });
   }
 
-  getGuides(props: ModeProps<FeatureCollection>): GuideFeatureCollection {
+  getGuides(props: ModeProps<SimpleFeatureCollection>): GuideFeatureCollection {
     const guides: GuideFeatureCollection = {
       type: 'FeatureCollection',
       features: []