diff --git a/package-lock.json b/package-lock.json
index 0da23f13..1d27ba96 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -28,6 +28,7 @@
         "maplibre-gl": "^4.0.2",
         "read-excel-file": "^5.7.1",
         "route-snapper": "^0.3.0",
+        "route-snapper-ts": "^0.0.3",
         "svelte": "^4.2.10",
         "svelte-maplibre": "^0.9.2",
         "uuid": "^9.0.1"
@@ -3074,6 +3075,15 @@
       "resolved": "https://registry.npmjs.org/route-snapper/-/route-snapper-0.3.0.tgz",
       "integrity": "sha512-5a9fMq05zftlFCp8Smnw+5k6CP871sYgEaD30o9KX4VARUaACkJDWCCq76KZ3tmP/Vv/KupZOVHnPtxcDWSmpQ=="
     },
+    "node_modules/route-snapper-ts": {
+      "version": "0.0.3",
+      "resolved": "https://registry.npmjs.org/route-snapper-ts/-/route-snapper-ts-0.0.3.tgz",
+      "integrity": "sha512-uUin96b1vrPWwmX0KkDdDZ+qDltL279ibLo1P3O04+mZIkomd6QAOTyBSXsoSWwqNNxVuLlJKTdtv4x+QYmX3Q==",
+      "dependencies": {
+        "maplibre-gl": "^4.0.0",
+        "route-snapper": "^0.4.0"
+      }
+    },
     "node_modules/run-parallel": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
diff --git a/package.json b/package.json
index 15aeacb6..bcf2a2ba 100644
--- a/package.json
+++ b/package.json
@@ -54,8 +54,14 @@
     "maplibre-gl": "^4.0.2",
     "read-excel-file": "^5.7.1",
     "route-snapper": "^0.3.0",
+    "route-snapper-ts": "^0.0.3",
     "svelte": "^4.2.10",
     "svelte-maplibre": "^0.9.2",
     "uuid": "^9.0.1"
+  },
+  "overrides": {
+    "route-snapper-ts": {
+      "route-snapper": "^0.3.0"
+    }
   }
 }
diff --git a/src/lib/draw/EditGeometryMode.svelte b/src/lib/draw/EditGeometryMode.svelte
index 227429b7..5af8628b 100644
--- a/src/lib/draw/EditGeometryMode.svelte
+++ b/src/lib/draw/EditGeometryMode.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-  import type { LineString, Point, Polygon } from "geojson";
+  import type { Feature, LineString, Point, Polygon } from "geojson";
   import {
     gjSchemeCollection,
     mode,
@@ -12,11 +12,12 @@
   import { interventionName } from "lib/sidebar/scheme_data";
   import { schema } from "stores";
   import { onDestroy, onMount } from "svelte";
-  import type { Feature, FeatureUnion } from "types";
+  import type { FeatureUnion } from "types";
   import PointControls from "./point/PointControls.svelte";
   import PolygonControls from "./polygon/PolygonControls.svelte";
   import RouteControls from "./route/RouteControls.svelte";
   import SnapPolygonControls from "./snap_polygon/SnapPolygonControls.svelte";
+  import { type Props } from "route-snapper-ts";
 
   export let id: number;
 
@@ -39,14 +40,14 @@
     name = interventionName(feature);
 
     if (feature.geometry.type == "LineString") {
-      $routeTool?.editExistingRoute(feature as Feature<LineString>);
+      $routeTool?.editExistingRoute(feature as Feature<LineString, Props>);
       $routeTool?.addEventListenerSuccess(onSuccess);
       $routeTool?.addEventListenerUpdated(onUpdate);
       $routeTool?.addEventListenerFailure(onFailure);
       controls = "route";
     } else if (feature.geometry.type == "Polygon") {
       if (feature.properties.waypoints) {
-        $routeTool?.editExistingArea(feature as Feature<Polygon>);
+        $routeTool?.editExistingArea(feature as Feature<Polygon, Props>);
         $routeTool?.addEventListenerSuccess(onSuccess);
         $routeTool?.addEventListenerUpdated(onUpdate);
         $routeTool?.addEventListenerFailure(onFailure);
diff --git a/src/lib/draw/route/RouteSnapperLoader.svelte b/src/lib/draw/route/RouteSnapperLoader.svelte
index 1b709bb1..fb0fa9e2 100644
--- a/src/lib/draw/route/RouteSnapperLoader.svelte
+++ b/src/lib/draw/route/RouteSnapperLoader.svelte
@@ -1,10 +1,10 @@
 <script lang="ts">
   import { routeTool } from "lib/draw/stores";
   import { ErrorMessage } from "govuk-svelte";
-  import init from "route-snapper";
   import { map } from "stores";
   import { onMount } from "svelte";
-  import { RouteTool } from "./route_tool";
+  import { init, RouteTool } from "route-snapper-ts";
+  import { routeToolGj, snapMode, undoLength } from "./stores";
 
   export let url: string;
 
@@ -19,7 +19,9 @@
     console.log(`Grabbing ${url}`);
     try {
       const graphBytes = await fetchWithProgress(url);
-      routeTool.set(new RouteTool($map, graphBytes));
+      routeTool.set(
+        new RouteTool($map, graphBytes, routeToolGj, snapMode, undoLength),
+      );
       progress = 100;
       routeToolReady = true;
     } catch (err) {
diff --git a/src/lib/draw/route/route_tool.ts b/src/lib/draw/route/route_tool.ts
deleted file mode 100644
index 956986df..00000000
--- a/src/lib/draw/route/route_tool.ts
+++ /dev/null
@@ -1,317 +0,0 @@
-import type { LineString, Polygon, Position } from "geojson";
-import type { FeatureWithProps } from "lib/maplibre";
-import type { Map, MapMouseEvent } from "maplibre-gl";
-import { JsRouteSnapper } from "route-snapper";
-import { routeToolGj, snapMode, undoLength } from "./stores";
-
-const snapDistancePixels = 30;
-
-export class RouteTool {
-  map: Map;
-  inner: JsRouteSnapper;
-  active: boolean;
-  eventListenersSuccess: ((
-    f: FeatureWithProps<LineString | Polygon>,
-  ) => void)[];
-  eventListenersUpdated: ((
-    f: FeatureWithProps<LineString | Polygon>,
-  ) => void)[];
-  eventListenersFailure: (() => void)[];
-
-  constructor(map: Map, graphBytes: Uint8Array) {
-    this.map = map;
-    console.time("Deserialize and setup JsRouteSnapper");
-    this.inner = new JsRouteSnapper(graphBytes);
-    console.timeEnd("Deserialize and setup JsRouteSnapper");
-    this.active = false;
-    this.eventListenersSuccess = [];
-    this.eventListenersUpdated = [];
-    this.eventListenersFailure = [];
-
-    this.map.on("mousemove", this.onMouseMove);
-    this.map.on("click", this.onClick);
-    this.map.on("dblclick", this.onDoubleClick);
-    this.map.on("dragstart", this.onDragStart);
-    this.map.on("mouseup", this.onMouseUp);
-    document.addEventListener("keydown", this.onKeyDown);
-    document.addEventListener("keypress", this.onKeyPress);
-  }
-
-  tearDown() {
-    this.map.off("mousemove", this.onMouseMove);
-    this.map.off("click", this.onClick);
-    this.map.off("dblclick", this.onDoubleClick);
-    this.map.off("dragstart", this.onDragStart);
-    this.map.off("mouseup", this.onMouseUp);
-    document.removeEventListener("keydown", this.onKeyDown);
-    document.removeEventListener("keypress", this.onKeyPress);
-  }
-
-  onMouseMove = (e: MapMouseEvent) => {
-    if (!this.active) {
-      return;
-    }
-    const nearbyPoint: [number, number] = [
-      e.point.x - snapDistancePixels,
-      e.point.y,
-    ];
-    const circleRadiusMeters = this.map
-      .unproject(e.point)
-      .distanceTo(this.map.unproject(nearbyPoint));
-    if (
-      this.inner.onMouseMove(e.lngLat.lng, e.lngLat.lat, circleRadiusMeters)
-    ) {
-      this.redraw();
-      // TODO We'll call this too frequently
-      this.dataUpdated();
-    }
-  };
-
-  onClick = () => {
-    if (!this.active) {
-      return;
-    }
-    this.inner.onClick();
-    this.redraw();
-    this.dataUpdated();
-  };
-
-  onDoubleClick = (e: MapMouseEvent) => {
-    if (!this.active) {
-      return;
-    }
-    // When we finish, we'll re-enable doubleClickZoom, but we don't want this to zoom in
-    e.preventDefault();
-    // Double clicks happen as [click, click, dblclick]. The first click adds a
-    // point, the second immediately deletes it, and so we simulate a third
-    // click to add it again.
-    this.inner.onClick();
-    this.finish();
-  };
-
-  onDragStart = () => {
-    if (!this.active) {
-      return;
-    }
-    if (this.inner.onDragStart()) {
-      this.map.dragPan.disable();
-    }
-  };
-
-  onMouseUp = () => {
-    if (!this.active) {
-      return;
-    }
-    if (this.inner.onMouseUp()) {
-      this.map.dragPan.enable();
-    }
-  };
-
-  onKeyDown = (e: KeyboardEvent) => {
-    if (!this.active) {
-      return;
-    }
-    if (e.key == "Escape") {
-      e.stopPropagation();
-      this.cancel();
-    }
-  };
-
-  onKeyPress = (e: KeyboardEvent) => {
-    if (!this.active) {
-      return;
-    }
-    // Ignore keypresses if we're not focused on the map
-    if ((e.target as HTMLElement).tagName == "INPUT") {
-      return;
-    }
-
-    if (e.key == "Enter") {
-      e.stopPropagation();
-      this.finish();
-    } else if (e.key == "s" || e.key == "S") {
-      e.stopPropagation();
-      this.inner.toggleSnapMode();
-      this.redraw();
-    } else if (e.key == "z" && e.ctrlKey) {
-      this.undo();
-    }
-  };
-
-  // Activate the tool with blank state.
-  startRoute() {
-    // If we were already active, don't do anything
-    // TODO Or... error? Why'd this happen?
-    if (this.active) {
-      return;
-    }
-
-    this.active = true;
-
-    // Otherwise, shift+click breaks
-    this.map.boxZoom.disable();
-    // Otherwise, double clicking to finish breaks
-    this.map.doubleClickZoom.disable();
-  }
-
-  // Activate the tool with blank state.
-  startArea() {
-    // If we were already active, don't do anything
-    // TODO Or... error? Why'd this happen?
-    if (this.active) {
-      return;
-    }
-
-    this.inner.setAreaMode();
-    this.active = true;
-    this.map.boxZoom.disable();
-    this.map.doubleClickZoom.disable();
-  }
-
-  // Deactivate the tool, clearing all state. No events are fired for eventListenersFailure.
-  stop() {
-    this.active = false;
-    this.inner.clearState();
-    this.redraw();
-    this.map.boxZoom.enable();
-    this.map.doubleClickZoom.enable();
-  }
-
-  // This takes a GeoJSON feature previously returned. It must have all
-  // properties returned originally. If waypoints are missing (maybe because
-  // the route was produced by a different tool, or an older version of this
-  // tool), the edited line-string may differ from the input.
-  editExistingRoute(feature: FeatureWithProps<LineString>) {
-    if (this.active) {
-      window.alert("Bug: editExistingRoute called when tool is already active");
-    }
-
-    if (!feature.properties.waypoints) {
-      // Only use the first and last points as waypoints, and assume they're
-      // snapped. This only works for the simplest cases.
-      feature.properties.waypoints = [
-        {
-          lon: feature.geometry.coordinates[0][0],
-          lat: feature.geometry.coordinates[0][1],
-          snapped: true,
-        },
-        {
-          lon: feature.geometry.coordinates[
-            feature.geometry.coordinates.length - 1
-          ][0],
-          lat: feature.geometry.coordinates[
-            feature.geometry.coordinates.length - 1
-          ][1],
-          snapped: true,
-        },
-      ];
-    }
-
-    this.startRoute();
-    this.inner.editExisting(feature.properties.waypoints);
-    this.redraw();
-  }
-
-  // This only handles features previously returned by this tool.
-  editExistingArea(feature: FeatureWithProps<Polygon>) {
-    if (this.active) {
-      window.alert("Bug: editExistingArea called when tool is already active");
-    }
-
-    if (!feature.properties.waypoints) {
-      window.alert(
-        "Bug: editExistingArea called for a polygon not produced by the route-snapper",
-      );
-    }
-
-    this.startArea();
-    this.inner.editExisting(feature.properties.waypoints);
-    this.redraw();
-  }
-
-  addEventListenerSuccess(
-    callback: (f: FeatureWithProps<LineString | Polygon>) => void,
-  ) {
-    this.eventListenersSuccess.push(callback);
-  }
-  addEventListenerUpdated(
-    callback: (f: FeatureWithProps<LineString | Polygon>) => void,
-  ) {
-    this.eventListenersUpdated.push(callback);
-  }
-  addEventListenerFailure(callback: () => void) {
-    this.eventListenersFailure.push(callback);
-  }
-  clearEventListeners() {
-    this.eventListenersSuccess = [];
-    this.eventListenersUpdated = [];
-    this.eventListenersFailure = [];
-  }
-
-  isActive(): boolean {
-    return this.active;
-  }
-
-  // Either a success or failure event will happen, depending on current state
-  finish() {
-    let rawJSON = this.inner.toFinalFeature();
-    if (rawJSON) {
-      // Pass copies to each callback
-      for (let cb of this.eventListenersSuccess) {
-        cb(JSON.parse(rawJSON) as FeatureWithProps<LineString | Polygon>);
-      }
-    } else {
-      for (let cb of this.eventListenersFailure) {
-        cb();
-      }
-    }
-    this.stop();
-  }
-
-  // This stops the tool and fires a failure event
-  cancel() {
-    this.inner.clearState();
-    this.finish();
-  }
-
-  setRouteConfig(config: {
-    avoid_doubling_back: boolean;
-    extend_route: boolean;
-  }) {
-    this.inner.setRouteConfig(config);
-    this.redraw();
-  }
-
-  addSnappedWaypoint(pt: Position) {
-    this.inner.addSnappedWaypoint(pt[0], pt[1]);
-    this.redraw();
-  }
-
-  undo() {
-    this.inner.undo();
-    this.redraw();
-  }
-
-  toggleSnapMode() {
-    this.inner.toggleSnapMode();
-    this.redraw();
-  }
-
-  private redraw() {
-    let gj = JSON.parse(this.inner.renderGeojson());
-    routeToolGj.set(gj);
-    this.map.getCanvas().style.cursor = gj.cursor;
-    snapMode.set(gj.snap_mode);
-    undoLength.set(gj.undo_length);
-  }
-
-  private dataUpdated() {
-    let rawJSON = this.inner.toFinalFeature();
-    if (rawJSON) {
-      // Pass copies to each callback
-      for (let cb of this.eventListenersUpdated) {
-        cb(JSON.parse(rawJSON) as FeatureWithProps<LineString | Polygon>);
-      }
-    }
-  }
-}
diff --git a/src/lib/draw/stores.ts b/src/lib/draw/stores.ts
index e766a948..3d843aac 100644
--- a/src/lib/draw/stores.ts
+++ b/src/lib/draw/stores.ts
@@ -3,7 +3,7 @@ import { writable, type Writable } from "svelte/store";
 import type { Mode, SchemeCollection } from "types";
 import { PointTool } from "./point/point_tool";
 import { PolygonTool } from "maplibre-draw-polygon";
-import { RouteTool } from "./route/route_tool";
+import { RouteTool } from "route-snapper-ts";
 
 // TODO Should we instead store a map from ID to feature?
 export const gjSchemeCollection: Writable<SchemeCollection> =