Mapbox-gl-draw duplicating points on drag when editing linestring from geojson

Question

When I select a point on the map and drag the point to move it, it duplicates the point and creates a new line between the two points surrounding the selected point, which ultimately results in a triangle instead of me being able to just modify the existing line. triangle created by duplicated point

I hastily threw this jsfiddle together but it demonstrates the issue i'm having when modifying an existing line (line is in blue, zoom in, click on it, select a point and draw):

map.on('load', function () {
  map.addSource('multiple-lines-source', {
    'type': 'geojson',
    'data': geojson,
  });

  map.addLayer({
    'id': 'multiple-lines-layer',
    'type': 'line',
    'source': 'multiple-lines-source',
    'layout': {
    },
    'paint': {
      'line-color': 'black',
    },
  });
  
  let draw = new MapboxDraw()
  map.addControl(draw)
  draw.add(geojson)
});

jsfiddle

Anyone know how to fix this behavior? I just want to be able to move points and reposition them without creating a new point. When I draw a line from scratch and modify a point on that line it works perfectly.