More typings for direct_select

src/modes/direct_select.ts

@@ -11,20 +11,30 @@ import { doubleClickZoom } from '../lib/double_click_zoom';
 import * as Constants from '../constants';
 import moveFeatures from '../lib/move_features';
 
-import type { ModeState, DrawCustomMode, MapMouseEvent } from '../types/types';
+import type { DirectSelectState, DrawCustomMode, MapMouseEvent, MapTouchEvent, DrawCoords } from '../types/types';
 
 const isVertex = isOfMetaType(Constants.meta.VERTEX);
 const isMidpoint = isOfMetaType(Constants.meta.MIDPOINT);
 
+type Event = MapMouseEvent | MapTouchEvent;
+
 interface DirectSelectMode extends DrawCustomMode {
   fireUpdate(): void;
   clickInactive(): void;
-  fireActionable(state: ModeState): void;
-  clickNoTarget(state: ModeState, e: MapMouseEvent): void;
-  startDragging(state: ModeState, e: MapMouseEvent): void;
-  stopDragging(state: ModeState): void;
-  onVertex(state: ModeState, e: MapMouseEvent): void;
-  onMidpoint(state: ModeState, e: MapMouseEvent): void;
+  fireActionable(state: DirectSelectState): void;
+  clickNoTarget(state: DirectSelectState, e: Event): void;
+  startDragging(state: DirectSelectState, e: Event): void;
+  stopDragging(state: DirectSelectState): void;
+  onVertex(state: DirectSelectState, e: Event): void;
+  onMidpoint(state: DirectSelectState, e: Event): void;
+  onFeature(state: DirectSelectState, e: Event): void;
+  dragFeature(state: DirectSelectState, e: Event, delta: { lng: number, lat: number }): void;
+  dragVertex(state: DirectSelectState, e: Event, delta: { lng: number, lat: number }): void;
+  clickActiveFeature(state: DirectSelectState): void;
+  pathsToCoordinates(featureId: string, paths: []): DrawCoords;
+  _start(state: DirectSelectState, e: Event): void;
+  _select(state: DirectSelectState, e: Event): void;
+  _end(state: DirectSelectState): void;
 }
 
 const DirectSelect: DirectSelectMode = {
@@ -68,12 +78,13 @@ const DirectSelect: DirectSelectMode = {
 
   onVertex: function (state, e) {
     this.startDragging(state, e);
-    const about = e.featureTarget.properties;
-    const selectedIndex = state.selectedCoordPaths.indexOf(about.coord_path);
-    if (!isShiftDown(e) && selectedIndex === -1) {
-      state.selectedCoordPaths = [about.coord_path];
-    } else if (isShiftDown(e) && selectedIndex === -1) {
-      state.selectedCoordPaths.push(about.coord_path);
+    const { coord_path } = e.featureTarget.properties;
+
+    const selectedIndex = state.selectedCoordPaths.indexOf(coord_path);
+    if (!isShiftDown(e as MapMouseEvent) && selectedIndex === -1) {
+      state.selectedCoordPaths = [coord_path];
+    } else if (isShiftDown(e as MapMouseEvent) && selectedIndex === -1) {
+      state.selectedCoordPaths.push(coord_path);
     }
 
     const selectedCoordinates = this.pathsToCoordinates(
@@ -84,9 +95,6 @@ const DirectSelect: DirectSelectMode = {
   },
 
   onMidpoint: function (state, e) {
-
-    console.log('STATE LOOKS LIKE THIS', state);
-
     this.startDragging(state, e);
     const about = e.featureTarget.properties;
     state.feature.addCoordinate(about.coord_path, about.lng, about.lat);
@@ -237,7 +245,7 @@ const DirectSelect: DirectSelectMode = {
     if (isMidpoint(e)) return this.onMidpoint(state, e);
   },
 
-  TouchStart: function (state, e) { return this._start(state, e); },
+  onTouchStart: function (state, e) { return this._start(state, e); },
   onMouseDown: function (state, e) { return this._start(state, e); },
 
   onDrag: function (state, e) {
@@ -275,7 +283,7 @@ const DirectSelect: DirectSelectMode = {
   onMouseUp: function (state) { return this._end(state); },
   onTouchEnd: function (state) { return this._end(state); },
 
-  toDisplayFeatures: function (state: ModeState, geojson, push) {
+  toDisplayFeatures: function (state, geojson, push) {
     if (state.featureId === geojson.properties.id) {
       geojson.properties.active = Constants.activeStates.ACTIVE;
       push(geojson);

src/modes/mode_interface_accessors.ts

@@ -71,7 +71,7 @@ export default class ModeInterface {
     this._ctx.store.deselect(id);
   }
 
-  deleteFeature(id: string, opts: Record<string, any> = {}): void {
+  deleteFeature(id: string | string[], opts: Record<string, any> = {}): void {
     this._ctx.store.delete(id, opts);
   }
 

src/types/types.ts

@@ -59,6 +59,8 @@ export type XY = { x: number; y: number };
 
 export type Coords = Array<[number, number]>;
 
+export type DrawCoords = Array<{ coord_path: string; feature_id: string }>
+
 export interface Entry {
   point: XY;
   time: number;
@@ -159,9 +161,9 @@ interface DrawControls {
 }
 
 interface DrawActionableState {
-  trash: boolean;
-  combineFeatures: boolean;
-  uncombineFeatures: boolean;
+  trash?: boolean;
+  combineFeatures?: boolean;
+  uncombineFeatures?: boolean;
 }
 
 interface DrawFeatureBase<Coordinates> {
@@ -223,14 +225,14 @@ interface DrawPolygon extends DrawFeatureBase<Position[][]> {
   removeCoordinate(path: string): void;
 }
 
-export interface ModeState {
+export interface DirectSelectState {
   featureId: string;
   canDragMove: boolean;
   dragMoveLocation: { lng: number; lat: number; } | undefined
   dragMoving: boolean;
-  feature: DrawFeature;
+  feature: DrawPolygon;
   initialDragPanState?: boolean;
-  selectedCoordPaths: [];
+  selectedCoordPaths: number[];
 }
 
 export type DrawFeature =
@@ -309,7 +311,7 @@ export interface DrawCustomModeThis {
   drawConfig: DrawOptions;
   setSelected(features?: DrawFeature[]): void;
   setSelectedCoordinates(
-    coords: Array<{ coord_path: string; feature_id: string }>
+    coords: DrawCoords
   ): void;
   getSelected(): DrawFeature[];
   getSelectedIds(): string[];
@@ -396,8 +398,8 @@ export interface DrawCustomMode<CustomModeState = any, CustomModeOptions = any>
   toDisplayFeatures(
     this: DrawCustomModeThis & this,
     state: CustomModeState,
-    geojson: GeoJSON,
-    display: (geojson: GeoJSON) => void
+    geojson: StrictFeature,
+    display: (geojson: StrictFeature) => void
   ): void;
 }
 
@@ -655,7 +657,7 @@ interface DrawStore {
   featureChanged(id: string, options?: DrawStoreOptions): boolean;
   setSelected(features?: DrawFeature[]): void;
   setSelectedCoordinates(
-    coords: Array<{ coord_path: string; feature_id: string }>
+    coords: DrawCoords
   ): void;
   getSelectedCoordinates(): Coords[];
   getSelected(): DrawFeature[];
@@ -665,7 +667,7 @@ interface DrawStore {
   getFeature(id: string): DrawFeature;
   select(id: string): void;
   deselect(features: string | string[]): void;
-  delete(id: string, opts: Record<string, any>): void;
+  delete(id: string | string[], opts: Record<string, any>): void;
   deleteFeature(id: string, opts?: unknown): void;
   add(feature: DrawFeature, opts: Record<string, unknown>): void;
   addFeature(feature: DrawFeature, opts: Record<string, unknown>): void;