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

package/dist/index.cjs

@@ -34,9 +34,8 @@ var __publicField = (obj, key, value) => {
 // dist/index.js
 var dist_exports = {};
 __export(dist_exports, {
-  ArrowStyles: () => ArrowStyles,
   CompositeMode: () => CompositeMode,
-  DEFAULT_ARROWS: () => DEFAULT_ARROWS,
+  DeleteMode: () => DeleteMode,
   Draw90DegreePolygonMode: () => Draw90DegreePolygonMode,
   DrawCircleByDiameterMode: () => DrawCircleByDiameterMode,
   DrawCircleFromCenterMode: () => DrawCircleFromCenterMode,
@@ -55,33 +54,24 @@ __export(dist_exports, {
   EditModeTrayWidget: () => EditModeTrayWidget,
   EditableGeoJsonLayer: () => EditableGeoJsonLayer,
   EditableH3ClusterLayer: () => EditableH3ClusterLayer,
+  EditorToolbarWidget: () => EditorToolbarWidget,
   ElevatedEditHandleLayer: () => ElevatedEditHandleLayer,
   ElevationMode: () => ElevationMode,
   ExtendLineStringMode: () => ExtendLineStringMode,
   ExtrudeMode: () => ExtrudeMode,
-  Feature: () => Feature,
   GeoJsonEditMode: () => GeoJsonEditMode,
   ImmutableFeatureCollection: () => ImmutableFeatureCollection,
   JunctionScatterplotLayer: () => JunctionScatterplotLayer,
-  JunctionsLayer: () => JunctionsLayer,
-  LayerMouseEvent: () => LayerMouseEvent,
-  MAX_ARROWS: () => MAX_ARROWS,
   MeasureAngleMode: () => MeasureAngleMode,
   MeasureAreaMode: () => MeasureAreaMode,
   MeasureDistanceMode: () => MeasureDistanceMode,
   ModifyMode: () => ModifyMode,
-  NebulaCore: () => NebulaCore,
-  NebulaLayer: () => NebulaLayer,
-  PROJECTED_PIXEL_SIZE_MULTIPLIER: () => PROJECTED_PIXEL_SIZE_MULTIPLIER,
   ResizeCircleMode: () => ResizeCircleMode,
   RotateMode: () => RotateMode,
-  SELECTION_TYPE: () => SELECTION_TYPE,
   ScaleMode: () => ScaleMode,
-  SegmentsLayer: () => SegmentsLayer,
   SelectionLayer: () => SelectionLayer,
   SnappableMode: () => SnappableMode,
   SplitPolygonMode: () => SplitPolygonMode,
-  TextsLayer: () => TextsLayer,
   TransformMode: () => TransformMode,
   TranslateMode: () => TranslateMode,
   ViewMode: () => ViewMode,
@@ -93,302 +83,6 @@ __export(dist_exports, {
 });
 module.exports = __toCommonJS(dist_exports);
 
-// dist/lib/style.js
-var ArrowStyles = {
-  NONE: 0,
-  FORWARD: 1,
-  BACKWARD: 2,
-  BOTH: 3
-};
-var DEFAULT_ARROWS = 1;
-var MAX_ARROWS = 3;
-var DEFAULT_STYLE = {
-  arrowColor: [0, 0, 0, 1],
-  arrowCount: DEFAULT_ARROWS,
-  arrowStyle: ArrowStyles.NONE,
-  fillColor: [0, 0, 0, 1],
-  lineColor: [0, 0, 0, 1],
-  lineWidthMeters: 5,
-  outlineRadiusMeters: 0,
-  opacity: 1,
-  zLevel: 0
-};
-
-// dist/lib/deck-renderer/deck-drawer.js
-var import_layers = require("@deck.gl/layers");
-var import_helpers = require("@turf/helpers");
-var import_bbox = __toESM(require("@turf/bbox"), 1);
-var import_bbox_polygon = __toESM(require("@turf/bbox-polygon"), 1);
-var import_buffer = __toESM(require("@turf/buffer"), 1);
-var import_difference = __toESM(require("@turf/difference"), 1);
-var import_distance = __toESM(require("@turf/distance"), 1);
-var POLYGON_LINE_COLOR = [0, 255, 0, 255];
-var POLYGON_FILL_COLOR = [255, 255, 255, 90];
-var POLYGON_LINE_WIDTH = 2;
-var POLYGON_THRESHOLD = 0.01;
-var EXPANSION_KM = 10;
-var LAYER_ID_VIEW = "DeckDrawerView";
-var LAYER_ID_PICK = "DeckDrawerPick";
-var SELECTION_TYPE = {
-  NONE: null,
-  RECTANGLE: "rectangle",
-  POLYGON: "polygon"
-};
-var DeckDrawer = class {
-  nebula;
-  usePolygon;
-  validPolygon;
-  landPoints;
-  mousePoints;
-  constructor(nebula) {
-    this.nebula = nebula;
-    this.usePolygon = false;
-    this.validPolygon = true;
-    this.landPoints = [];
-    this.mousePoints = [];
-  }
-  _getLayerIds() {
-    return this.nebula.deckgl.props.layers.filter((l) => l && l.props && l.props.nebulaLayer && l.props.nebulaLayer.enableSelection).map((l) => l.id);
-  }
-  _selectFromPickingInfos(pickingInfos) {
-    const objects = pickingInfos.map(({ layer, index, object }) => object.original || layer.props.nebulaLayer.deckCache.originals[index]);
-    this.nebula.props.onSelection(objects);
-  }
-  _getBoundingBox() {
-    const { mousePoints } = this;
-    const allX = mousePoints.map((mousePoint) => mousePoint[0]);
-    const allY = mousePoints.map((mousePoint) => mousePoint[1]);
-    const x = Math.min(...allX);
-    const y = Math.min(...allY);
-    const maxX = Math.max(...allX);
-    const maxY = Math.max(...allY);
-    return { x, y, width: maxX - x, height: maxY - y };
-  }
-  _selectRectangleObjects() {
-    if (this.landPoints.length !== 2)
-      return;
-    const [x1, y1] = this.mousePoints[0];
-    const [x2, y2] = this.mousePoints[1];
-    const pickingInfos = this.nebula.deckgl.pickObjects({
-      x: Math.min(x1, x2),
-      y: Math.min(y1, y2),
-      width: Math.abs(x2 - x1),
-      height: Math.abs(y2 - y1),
-      layerIds: this._getLayerIds()
-    });
-    this._selectFromPickingInfos(pickingInfos);
-  }
-  _selectPolygonObjects() {
-    const pickingInfos = this.nebula.deckgl.pickObjects({
-      ...this._getBoundingBox(),
-      layerIds: [LAYER_ID_PICK, ...this._getLayerIds()]
-    });
-    this._selectFromPickingInfos(pickingInfos.filter((item) => item.layer.id !== LAYER_ID_PICK));
-  }
-  _getMousePosFromEvent(event) {
-    const { offsetX, offsetY } = event;
-    return [offsetX, offsetY];
-  }
-  // eslint-disable-next-line max-statements, complexity
-  handleEvent(event, lngLat, selectionType) {
-    if (event.type !== "mouseup")
-      event.stopPropagation();
-    this.usePolygon = selectionType === SELECTION_TYPE.POLYGON;
-    let redraw = false;
-    let deactivate = false;
-    const { usePolygon, landPoints, mousePoints } = this;
-    if (event.type === "mousedown") {
-      if (usePolygon && landPoints.length) {
-        if (this.landPoints.length < 3 || this.validPolygon) {
-          landPoints.push(lngLat);
-          mousePoints.push(this._getMousePosFromEvent(event));
-        }
-      } else {
-        this.landPoints = [lngLat, lngLat];
-        const m = this._getMousePosFromEvent(event);
-        this.mousePoints = [m, m];
-      }
-      redraw = true;
-    } else if (event.type === "mousemove" && landPoints.length) {
-      landPoints[landPoints.length - 1] = lngLat;
-      mousePoints[mousePoints.length - 1] = this._getMousePosFromEvent(event);
-      redraw = true;
-    } else if (event.type === "mouseup") {
-      if (usePolygon) {
-        if (landPoints.length > 4 && (0, import_distance.default)(landPoints[0], landPoints[landPoints.length - 1]) < POLYGON_THRESHOLD && this.validPolygon) {
-          this._selectPolygonObjects();
-          this.reset();
-          redraw = true;
-          deactivate = true;
-        }
-      } else {
-        this._selectRectangleObjects();
-        this.reset();
-        redraw = true;
-        deactivate = true;
-      }
-    }
-    return { redraw, deactivate };
-  }
-  reset() {
-    this.landPoints = [];
-    this.mousePoints = [];
-  }
-  _makeStartPointHighlight(center) {
-    const buffer = (0, import_buffer.default)((0, import_helpers.point)(center), POLYGON_THRESHOLD / 4);
-    return (0, import_bbox_polygon.default)((0, import_bbox.default)(buffer)).geometry.coordinates;
-  }
-  render() {
-    const data = [];
-    const dataPick = [];
-    if (!this.usePolygon && this.landPoints.length === 2) {
-      const [[x1, y1], [x2, y2]] = this.mousePoints;
-      const selPolygon = [
-        [x1, y1],
-        [x1, y2],
-        [x2, y2],
-        [x2, y1],
-        [x1, y1]
-      ].map((mousePos) => this.nebula.unprojectMousePosition(mousePos));
-      data.push({
-        polygon: selPolygon,
-        lineColor: POLYGON_LINE_COLOR,
-        fillColor: POLYGON_FILL_COLOR
-      });
-    } else if (this.usePolygon && this.landPoints.length) {
-      data.push({
-        polygon: this.landPoints,
-        lineColor: POLYGON_LINE_COLOR,
-        fillColor: POLYGON_FILL_COLOR
-      });
-      if (this.landPoints.length >= 3) {
-        const landPointsPoly = (0, import_helpers.polygon)([[...this.landPoints, this.landPoints[0]]]);
-        const bigBuffer = (0, import_buffer.default)((0, import_helpers.point)(this.landPoints[0]), EXPANSION_KM);
-        let bigPolygon;
-        try {
-          bigPolygon = (0, import_difference.default)(bigBuffer, landPointsPoly);
-          dataPick.push({
-            polygon: bigPolygon.geometry.coordinates,
-            fillColor: [0, 0, 0, 1]
-          });
-          this.validPolygon = true;
-        } catch (e) {
-          this.validPolygon = false;
-        }
-      }
-    }
-    if (this.landPoints.length) {
-      data.push({
-        polygon: this._makeStartPointHighlight(this.landPoints[0]),
-        lineColor: [0, 0, 0, 0],
-        fillColor: POLYGON_LINE_COLOR
-      });
-    }
-    data.push({ polygon: [[0, 0]] });
-    dataPick.push({ polygon: [[0, 0]] });
-    return [
-      new import_layers.PolygonLayer({
-        id: LAYER_ID_VIEW,
-        data,
-        fp64: false,
-        opacity: 1,
-        pickable: false,
-        lineWidthMinPixels: POLYGON_LINE_WIDTH,
-        lineWidthMaxPixels: POLYGON_LINE_WIDTH,
-        lineDashJustified: true,
-        // TODO(v9) Add extension
-        // getLineDashArray: (x) => POLYGON_DASHES,
-        getLineColor: (obj) => obj.lineColor || [0, 0, 0, 255],
-        getFillColor: (obj) => obj.fillColor || [0, 0, 0, 255],
-        getPolygon: (o) => o.polygon
-      }),
-      new import_layers.PolygonLayer({
-        id: LAYER_ID_PICK,
-        data: dataPick,
-        getLineColor: (obj) => obj.lineColor || [0, 0, 0, 255],
-        getFillColor: (obj) => obj.fillColor || [0, 0, 0, 255],
-        fp64: false,
-        opacity: 1,
-        stroked: false,
-        pickable: true,
-        getPolygon: (o) => o.polygon
-      })
-    ];
-  }
-};
-
-// dist/lib/feature.js
-var Feature = class {
-  // geo json coordinates
-  geoJson;
-  style;
-  original;
-  metadata;
-  constructor(geoJson, style, original = null, metadata = {}) {
-    this.geoJson = geoJson;
-    this.style = style;
-    this.original = original;
-    this.metadata = metadata;
-  }
-  getCoords() {
-    return this.geoJson.geometry.coordinates;
-  }
-};
-
-// dist/lib/layer-mouse-event.js
-var LayerMouseEvent = class {
-  canceled = false;
-  // original item that this event is related to
-  data;
-  // internal nebula info about the object
-  metadata;
-  // the mouse [lng,lat] raycasted onto the ground
-  groundPoint;
-  // browser event
-  nativeEvent;
-  // reference to nebula
-  nebula;
-  constructor(nativeEvent, { data, groundPoint, nebula, metadata }) {
-    this.nativeEvent = nativeEvent;
-    this.data = data;
-    this.groundPoint = groundPoint;
-    this.nebula = nebula;
-    this.metadata = metadata;
-  }
-  stopPropagation() {
-    this.nativeEvent.stopPropagation();
-    this.canceled = true;
-  }
-};
-
-// dist/lib/nebula-layer.js
-var import_eventemitter3 = require("eventemitter3");
-var import_uuid = require("uuid");
-var NebulaLayer = class extends import_eventemitter3.EventEmitter {
-  getData;
-  toNebulaFeature;
-  id;
-  helperLayers;
-  // flags
-  usesMapEvents = false;
-  enablePicking = false;
-  enableSelection = false;
-  //
-  constructor({ getData, on, toNebulaFeature }) {
-    super();
-    this.id = (0, import_uuid.v4)();
-    this.getData = getData;
-    this.toNebulaFeature = toNebulaFeature;
-    this.helperLayers = [];
-    if (on) {
-      Object.keys(on).forEach((key) => this.on(key, on[key]));
-    }
-  }
-  render(config) {
-    return null;
-  }
-};
-
 // dist/utils/utils.js
 var utils_exports = {};
 __export(utils_exports, {
@@ -403,8 +97,8 @@ __export(utils_exports, {
 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 = require("viewport-mercator-project");
+var import_helpers = require("@turf/helpers");
+var import_web_mercator = require("@math.gl/web-mercator");
 function toDeckColor(color, defaultColor = [255, 0, 0, 255]) {
   if (!Array.isArray(color)) {
     return defaultColor;
@@ -428,7 +122,7 @@ function generatePointsParallelToLinePoints(p1, p2, mapCoords2) {
     type: "LineString",
     coordinates: [p1, p2]
   };
-  const pt = (0, import_helpers2.point)(mapCoords2);
+  const pt = (0, import_helpers.point)(mapCoords2);
   const ddistance = (0, import_point_to_line_distance.default)(pt, lineString3);
   const lineBearing = (0, import_bearing.default)(p1, p2);
   const isPointToLeftOfLine = (mapCoords2[0] - p1[0]) * (p2[1] - p1[1]) - (mapCoords2[1] - p1[1]) * (p2[0] - p1[0]);
@@ -446,7 +140,7 @@ function mix(a, b, ratio) {
   return b * ratio + a * (1 - ratio);
 }
 function nearestPointOnProjectedLine(line, inPoint, viewport) {
-  const wmViewport = new import_viewport_mercator_project.WebMercatorViewport(viewport);
+  const wmViewport = new import_web_mercator.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);
@@ -499,479 +193,13 @@ function insertBefore(base, insertBeforeText, toInsert) {
   return base.slice(0, at) + toInsert + base.slice(at);
 }
 
-// dist/lib/deck-renderer/deck-cache.js
-var DeckCache = class {
-  objects;
-  originals;
-  updateTrigger;
-  _idToPosition;
-  _getData;
-  _convert;
-  constructor(getData, convert) {
-    this.objects = [];
-    this.originals = [];
-    this.updateTrigger = 0;
-    this._idToPosition = /* @__PURE__ */ new Map();
-    this._getData = getData;
-    this._convert = convert;
-  }
-  updateAllDeckObjects() {
-    if (!this._getData || !this._convert)
-      return;
-    this.originals.length = 0;
-    this.objects.length = 0;
-    this._idToPosition.clear();
-    this._getData().forEach((d) => {
-      this._idToPosition.set(d.id, this.objects.length);
-      this.originals.push(d);
-      this.objects.push(this._convert(d));
-    });
-    this.triggerUpdate();
-  }
-  updateDeckObjectsByIds(ids) {
-    if (!this._getData || !this._convert)
-      return;
-    ids.forEach((id) => {
-      const p = this._idToPosition.get(id);
-      if (p !== void 0) {
-        this.objects[p] = this._convert(this.originals[p]);
-      }
-    });
-    this.triggerUpdate();
-  }
-  triggerUpdate() {
-    this.updateTrigger++;
-  }
-  getDeckObjectById(id) {
-    const p = this._idToPosition.get(id);
-    return p !== void 0 ? this.objects[p] : null;
-  }
-  getOriginalById(id) {
-    const p = this._idToPosition.get(id);
-    return p !== void 0 ? this.originals[p] : null;
-  }
-};
-
-// dist/editable-layers/junction-scatterplot-layer.js
-var import_core = require("@deck.gl/core");
-var import_layers2 = require("@deck.gl/layers");
-var JunctionScatterplotLayer = class extends import_core.CompositeLayer {
-  renderLayers() {
-    const { id, getFillColor, getStrokeColor, getInnerRadius, updateTriggers } = this.props;
-    return [
-      // the full circles
-      new import_layers2.ScatterplotLayer({
-        ...this.props,
-        id: `${id}-full`,
-        data: this.props.data,
-        getLineColor: getStrokeColor,
-        updateTriggers: {
-          ...updateTriggers,
-          getStrokeColor: updateTriggers.getStrokeColor
-        }
-      }),
-      // the inner part
-      new import_layers2.ScatterplotLayer({
-        ...this.props,
-        id: `${id}-inner`,
-        data: this.props.data,
-        getFillColor,
-        getRadius: getInnerRadius,
-        pickable: false,
-        updateTriggers: {
-          ...updateTriggers,
-          getFillColor: updateTriggers.getFillColor,
-          getRadius: updateTriggers.getInnerRadius
-        }
-      })
-    ];
-  }
-};
-__publicField(JunctionScatterplotLayer, "layerName", "JunctionScatterplotLayer");
-__publicField(JunctionScatterplotLayer, "defaultProps", {
-  ...import_layers2.ScatterplotLayer.defaultProps,
-  getFillColor: (d) => [0, 0, 0, 255],
-  getStrokeColor: (d) => [255, 255, 255, 255],
-  getInnerRadius: (d) => 1
-});
-
-// dist/lib/layers/junctions-layer.js
-var JunctionsLayer = class extends NebulaLayer {
-  deckCache;
-  constructor(config) {
-    super(config);
-    this.deckCache = new DeckCache(config.getData, (data) => config.toNebulaFeature(data));
-    this.enablePicking = true;
-  }
-  render({ nebula }) {
-    const defaultColor = [0, 0, 0, 255];
-    const { objects, updateTrigger } = this.deckCache;
-    return new JunctionScatterplotLayer({
-      id: `junctions-${this.id}`,
-      data: objects,
-      opacity: 1,
-      pickable: true,
-      getPosition: (nf) => nf.geoJson.geometry.coordinates,
-      getFillColor: (nf) => toDeckColor(nf.style.fillColor) || defaultColor,
-      getStrokeColor: (nf) => toDeckColor(nf.style.outlineColor) || toDeckColor(nf.style.fillColor) || defaultColor,
-      getRadius: (nf) => nf.style.pointRadiusMeters + nf.style.outlineRadiusMeters || 1,
-      getInnerRadius: (nf) => nf.style.pointRadiusMeters || 0.5,
-      parameters: {
-        depthCompare: "always"
-      },
-      updateTriggers: { all: updateTrigger },
-      // @ts-expect-error TODO
-      nebulaLayer: this
-    });
-  }
-};
-
-// dist/lib/layers/texts-layer.js
-var import_layers3 = require("@deck.gl/layers");
-
-// dist/lib/constants.js
-var PROJECTED_PIXEL_SIZE_MULTIPLIER = 2 / 3;
-
-// dist/lib/layers/texts-layer.js
-var TextsLayer = class extends NebulaLayer {
-  deckCache;
-  constructor(config) {
-    super(config);
-    this.deckCache = new DeckCache(config.getData, (data) => config.toNebulaFeature(data));
-  }
-  render({ nebula }) {
-    const defaultColor = [0, 0, 0, 255];
-    const { objects, updateTrigger } = this.deckCache;
-    const { zoom } = nebula.props.viewport;
-    return new import_layers3.TextLayer({
-      id: `texts-${this.id}`,
-      data: objects,
-      opacity: 1,
-      fp64: false,
-      pickable: false,
-      getText: (nf) => nf.style.text,
-      getPosition: (nf) => nf.geoJson.geometry.coordinates,
-      getColor: (nf) => toDeckColor(nf.style.fillColor) || defaultColor,
-      // TODO: layer should offer option to scale with zoom
-      sizeScale: 1 / Math.pow(2, 20 - zoom),
-      getSize: PROJECTED_PIXEL_SIZE_MULTIPLIER,
-      updateTriggers: { all: updateTrigger },
-      nebulaLayer: this
-    });
-  }
-};
-
-// dist/lib/layers/segments-layer.js
-var import_layers4 = require("@deck.gl-community/layers");
-var NEBULA_TO_DECK_DIRECTIONS = {
-  [ArrowStyles.NONE]: { forward: false, backward: false },
-  [ArrowStyles.FORWARD]: { forward: true, backward: false },
-  [ArrowStyles.BACKWARD]: { forward: false, backward: true },
-  [ArrowStyles.BOTH]: { forward: true, backward: true }
-};
-var SegmentsLayer = class extends NebulaLayer {
-  deckCache;
-  noBlend;
-  highlightColor;
-  arrowSize;
-  jointRounded;
-  capRounded;
-  dashed;
-  markerLayerProps;
-  constructor(config) {
-    super(config);
-    this.deckCache = new DeckCache(config.getData, (data) => config.toNebulaFeature(data));
-    this.enableSelection = true;
-    this.enablePicking = config.enablePicking ?? true;
-    this.noBlend = config.noBlend ?? false;
-    this.jointRounded = config.jointRounded ?? true;
-    this.capRounded = config.capRounded ?? true;
-    this.dashed = config.dashed ?? false;
-    this.markerLayerProps = config.markerLayerProps ?? null;
-    this.highlightColor = [1, 1, 1, 1];
-    this.arrowSize = 1;
-  }
-  getMouseOverSegment() {
-    return null;
-  }
-  _calcMarkerPercentages(nf) {
-    const { arrowPercentages } = nf.style;
-    if (arrowPercentages) {
-      return arrowPercentages;
-    }
-    const arrowStyle = nf.style.arrowStyle || DEFAULT_STYLE.arrowStyle;
-    if (arrowStyle === ArrowStyles.NONE)
-      return [];
-    const arrowCount = Math.min(nf.style.arrowCount || DEFAULT_STYLE.arrowCount, MAX_ARROWS);
-    return [[0.5], [0.33, 0.66], [0.25, 0.5, 0.75]][arrowCount - 1];
-  }
-  _getHighlightedObjectIndex({ nebula }) {
-    const { deckglMouseOverInfo } = nebula;
-    if (deckglMouseOverInfo) {
-      const { originalLayer, index } = deckglMouseOverInfo;
-      if (originalLayer === this) {
-        return index;
-      }
-    }
-    return -1;
-  }
-  render({ nebula }) {
-    const defaultColor = [0, 0, 0, 255];
-    const { objects, updateTrigger } = this.deckCache;
-    return new import_layers4.PathMarkerLayer({
-      id: `segments-${this.id}`,
-      data: objects,
-      opacity: 1,
-      fp64: false,
-      jointRounded: this.jointRounded,
-      capRounded: this.capRounded,
-      pickable: true,
-      sizeScale: this.arrowSize || 6,
-      parameters: {
-        depthCompare: "always",
-        blendColorOperation: this.noBlend ? void 0 : "max"
-      },
-      getPath: (nf) => nf.geoJson.geometry.coordinates,
-      getColor: (nf) => toDeckColor(nf.style.lineColor, defaultColor),
-      getWidth: (nf) => nf.style.lineWidthMeters || 1,
-      getZLevel: (nf) => nf.style.zLevel * 255,
-      getDirection: (nf) => NEBULA_TO_DECK_DIRECTIONS[nf.style.arrowStyle],
-      getMarkerColor: (nf) => toDeckColor(nf.style.arrowColor, defaultColor),
-      // eslint-disable-next-line @typescript-eslint/unbound-method
-      getMarkerPercentages: this._calcMarkerPercentages,
-      updateTriggers: { all: updateTrigger },
-      highlightedObjectIndex: this._getHighlightedObjectIndex({ nebula }),
-      highlightColor: toDeckColor(this.highlightColor),
-      dashJustified: this.dashed,
-      getDashArray: this.dashed ? (nf) => nf.style.dashArray : void 0,
-      markerLayerProps: this.markerLayerProps || import_layers4.PathMarkerLayer.defaultProps.markerLayerProps,
-      nebulaLayer: this
-    });
-  }
-};
-
-// dist/lib/nebula-core.js
-var import_eventemitter32 = require("eventemitter3");
-var import_core2 = require("@deck.gl/core");
-var LOGGER_PREFIX = "Nebula: ";
-var NebulaCore = class {
-  init(props) {
-    this.props = props;
-    this.wmViewport = new import_core2.WebMercatorViewport(this.props.viewport);
-    ["click", "mousemove", "mouseup", "mousedown"].forEach((name) => document.addEventListener(name, this._onMouseEvent, true));
-  }
-  detach() {
-    ["click", "mousemove", "mouseup", "mousedown"].forEach((name) => document.removeEventListener(name, this._onMouseEvent, true));
-  }
-  updateProps(newProps) {
-    this.props = newProps;
-    const { viewport } = this.props;
-    this.wmViewport = new import_core2.WebMercatorViewport(viewport);
-  }
-  props = null;
-  deckgl = null;
-  mainContainer = null;
-  deckglMouseOverInfo = null;
-  _deckDrawer = null;
-  _mouseWasDown = null;
-  wmViewport = null;
-  queryObjectEvents = new import_eventemitter32.EventEmitter();
-  forceUpdate = null;
-  inited = null;
-  log(message) {
-    const { logger } = this.props;
-    if (logger && logger.info) {
-      logger.info(LOGGER_PREFIX + message);
-    }
-  }
-  updateAllDeckObjects() {
-    this.getAllLayers().forEach((layer) => {
-      if (layer && layer.deckCache) {
-        layer.deckCache.updateAllDeckObjects();
-      }
-    });
-    this.forceUpdate();
-  }
-  updateDeckObjectsByIds(ids) {
-    this.getAllLayers().forEach((layer) => {
-      if (layer && layer.deckCache) {
-        layer.deckCache.updateDeckObjectsByIds(ids);
-      }
-    });
-    this.forceUpdate();
-  }
-  rerenderLayers() {
-    this.updateAllDeckObjects();
-  }
-  _isNebulaEvent({ buttons, target, type }) {
-    const { viewport } = this.props;
-    if (this._mouseWasDown && type === "mouseup") {
-      this._mouseWasDown = false;
-      return true;
-    }
-    if (type === "mousemove" && buttons > 0) {
-      return true;
-    }
-    if (!target.getBoundingClientRect) {
-      return false;
-    }
-    const rect = target.getBoundingClientRect();
-    return Math.round(rect.width) === Math.round(viewport.width) && Math.round(rect.height) === Math.round(viewport.height);
-  }
-  _onMouseEvent = (event) => {
-    if (!this._isNebulaEvent(event)) {
-      return;
-    }
-    if (event.type === "mousedown") {
-      this._mouseWasDown = true;
-    }
-    const { top = 0, left = 0 } = this.mainContainer ? this.mainContainer.getBoundingClientRect() : {};
-    const proxyEvent = new Proxy(event, {
-      get: (original, propertyName) => {
-        if (propertyName === "offsetX") {
-          return original.pageX - left;
-        }
-        if (propertyName === "offsetY") {
-          return original.pageY - top;
-        }
-        if (propertyName === "type") {
-          return original.type.replace("pointer", "mouse");
-        }
-        const result = original[propertyName];
-        if (typeof result === "function") {
-          return result.bind(original);
-        }
-        return result;
-      }
-    });
-    this._handleDeckGLEvent(proxyEvent);
-  };
-  getMouseGroundPosition(event) {
-    return this.wmViewport.unproject([event.offsetX, event.offsetY]);
-  }
-  unprojectMousePosition(mousePosition) {
-    return this.wmViewport.unproject(mousePosition);
-  }
-  // eslint-disable-next-line max-statements, complexity
-  _handleDeckGLEvent(event) {
-    const { deckgl, props: { onMapMouseEvent, selectionType, eventFilter } } = this;
-    let sendMapEvent = true;
-    let cursor = "auto";
-    if (event && deckgl && selectionType) {
-      if (!this._deckDrawer)
-        this._deckDrawer = new DeckDrawer(this);
-      const lngLat = this.getMouseGroundPosition(event);
-      if (eventFilter && !eventFilter(lngLat, event))
-        return;
-      const drawerResult = this._deckDrawer.handleEvent(event, lngLat, selectionType);
-      if (drawerResult.redraw)
-        this.forceUpdate();
-      return;
-    }
-    if (event && deckgl && (!event.buttons || event.type !== "mousemove")) {
-      const layerIds = deckgl.props.layers.filter((l) => l && l.props && l.props.nebulaLayer && l.props.nebulaLayer.enablePicking).map((l) => l.id);
-      const pickingInfo = deckgl.pickObject({
-        x: event.offsetX,
-        y: event.offsetY,
-        radius: 5,
-        layerIds
-      });
-      this.queryObjectEvents.emit("pick", { event, pickingInfo });
-      if (pickingInfo) {
-        sendMapEvent = false;
-        const { index, lngLat } = pickingInfo;
-        if (eventFilter && !eventFilter(lngLat, event))
-          return;
-        const { layer: deckLayer, object } = pickingInfo;
-        if (deckLayer && deckLayer.props && deckLayer.props.nebulaLayer && deckLayer.props.nebulaLayer.eventHandler) {
-          deckLayer.props.nebulaLayer.eventHandler(event, pickingInfo);
-        }
-        const original = object.original || deckLayer.props.nebulaLayer && deckLayer.props.nebulaLayer.deckCache && deckLayer.props.nebulaLayer.deckCache.originals[index];
-        if (original) {
-          this.deckglMouseOverInfo = { originalLayer: deckLayer.props.nebulaLayer, index };
-          const nebulaMouseEvent = new LayerMouseEvent(event, {
-            data: original,
-            metadata: object.metadata,
-            groundPoint: lngLat,
-            nebula: this
-          });
-          deckLayer.props.nebulaLayer.emit(event.type, nebulaMouseEvent);
-          this.forceUpdate();
-        }
-        cursor = "pointer";
-      }
-    }
-    if (document.documentElement) {
-      document.documentElement.style.cursor = cursor;
-    }
-    if (sendMapEvent) {
-      this.deckglMouseOverInfo = null;
-      const lngLat = this.getMouseGroundPosition(event);
-      if (eventFilter && !eventFilter(lngLat, event))
-        return;
-      const nebulaMouseEvent = new LayerMouseEvent(event, {
-        groundPoint: lngLat,
-        nebula: this
-      });
-      this.getAllLayers().filter((layer) => layer && layer.usesMapEvents).forEach((layer) => layer.emit("mapMouseEvent", nebulaMouseEvent));
-      this.getAllLayers().filter((layer) => layer && layer.props && layer.props.nebulaLayer && layer.props.nebulaLayer.mapMouseEvent).forEach((layer) => layer.props.nebulaLayer.mapMouseEvent(nebulaMouseEvent, layer));
-      if (onMapMouseEvent) {
-        onMapMouseEvent(event, lngLat);
-      }
-    }
-  }
-  getExtraDeckLayers() {
-    const result = [];
-    if (this._deckDrawer)
-      result.push(...this._deckDrawer.render());
-    return result;
-  }
-  renderDeckLayers() {
-    return this.getAllLayers().map((layer) => layer instanceof NebulaLayer ? layer.render({ nebula: this }) : layer).filter(Boolean);
-  }
-  getAllLayers() {
-    const result = [];
-    this.props.layers.filter(Boolean).forEach((layer) => {
-      result.push(layer);
-      if (layer instanceof NebulaLayer) {
-        result.push(...layer.helperLayers);
-      }
-    });
-    return result.filter(Boolean);
-  }
-  getRenderedLayers() {
-    return [...this.renderDeckLayers(), ...this.getExtraDeckLayers()];
-  }
-  updateAndGetRenderedLayers(layers, viewport, container) {
-    if (this.inited) {
-      this.updateProps({ layers, viewport });
-      this.forceUpdate = () => container.forceUpdate();
-    } else {
-      this.inited = true;
-      this.init({ layers, viewport });
-      this.forceUpdate = () => container.forceUpdate();
-      this.updateAllDeckObjects();
-    }
-    return this.getRenderedLayers();
-  }
-  setDeck(deckgl) {
-    if (deckgl) {
-      this.deckgl = deckgl;
-    }
-  }
-  setMainContainer(mainContainer) {
-    if (mainContainer) {
-      this.mainContainer = mainContainer;
-    }
-  }
-};
-
 // dist/editable-layers/editable-geojson-layer.js
-var import_layers6 = require("@deck.gl/layers");
+var import_layers2 = require("@deck.gl/layers");
 
 // dist/edit-modes/geojson-edit-mode.js
+var import_helpers3 = require("@turf/helpers");
 var import_union = __toESM(require("@turf/union"), 1);
-var import_difference2 = __toESM(require("@turf/difference"), 1);
+var import_difference = __toESM(require("@turf/difference"), 1);
 var import_intersect = __toESM(require("@turf/intersect"), 1);
 var import_rewind = __toESM(require("@turf/rewind"), 1);
 
@@ -980,9 +208,9 @@ var import_destination2 = __toESM(require("@turf/destination"), 1);
 var import_bearing2 = __toESM(require("@turf/bearing"), 1);
 var import_point_to_line_distance2 = __toESM(require("@turf/point-to-line-distance"), 1);
 var import_meta = require("@turf/meta");
-var import_helpers3 = require("@turf/helpers");
+var import_helpers2 = require("@turf/helpers");
 var import_invariant = require("@turf/invariant");
-var import_viewport_mercator_project2 = require("viewport-mercator-project");
+var import_web_mercator2 = require("@math.gl/web-mercator");
 function recursivelyTraverseNestedArrays2(array, prefix, fn) {
   if (!Array.isArray(array[0])) {
     return true;
@@ -1000,7 +228,7 @@ function generatePointsParallelToLinePoints2(p1, p2, coords) {
     type: "LineString",
     coordinates: [p1, p2]
   };
-  const pt = (0, import_helpers3.point)(coords);
+  const pt = (0, import_helpers2.point)(coords);
   const ddistance = (0, import_point_to_line_distance2.default)(pt, lineString3);
   const lineBearing = (0, import_bearing2.default)(p1, p2);
   const isPointToLeftOfLine = (coords[0] - p1[0]) * (p2[1] - p1[1]) - (coords[1] - p1[1]) * (p2[0] - p1[0]);
@@ -1018,7 +246,7 @@ function mix2(a, b, ratio) {
   return b * ratio + a * (1 - ratio);
 }
 function nearestPointOnProjectedLine2(line, inPoint, viewport) {
-  const wmViewport = new import_viewport_mercator_project2.WebMercatorViewport(viewport);
+  const wmViewport = new import_web_mercator2.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);
@@ -1067,9 +295,9 @@ function nearestPointOnLine(lines, inPoint, viewport) {
   var _a, _b;
   let mercator;
   if (viewport) {
-    mercator = new import_viewport_mercator_project2.WebMercatorViewport(viewport);
+    mercator = new import_web_mercator2.WebMercatorViewport(viewport);
   }
-  let closestPoint = (0, import_helpers3.point)([Infinity, Infinity], {
+  let closestPoint = (0, import_helpers2.point)([Infinity, Infinity], {
     dist: Infinity
   });
   if (!((_a = lines.geometry) == null ? void 0 : _a.coordinates.length) || ((_b = lines.geometry) == null ? void 0 : _b.coordinates.length) < 2) {
@@ -1143,7 +371,7 @@ function nearestPointOnLine(lines, inPoint, viewport) {
         from
       };
     }
-    closestPoint = (0, import_helpers3.point)([snapPoint.x, snapPoint.y], {
+    closestPoint = (0, import_helpers2.point)([snapPoint.x, snapPoint.y], {
       dist: Math.abs(snapPoint.from - snapPoint.to),
       index: snapPoint.idx
     });
@@ -1270,8 +498,8 @@ function shouldCancelPan(event) {
 // dist/edit-modes/immutable-feature-collection.js
 var ImmutableFeatureCollection = class {
   featureCollection;
-  constructor(featureCollection4) {
-    this.featureCollection = featureCollection4;
+  constructor(featureCollection7) {
+    this.featureCollection = featureCollection7;
   }
   getObject() {
     return this.featureCollection;
@@ -1506,9 +734,9 @@ function pruneGeometryIfNecessary(geometry) {
   }
 }
 function prunePolygonIfNecessary(geometry) {
-  const polygon3 = geometry.coordinates;
-  for (let holeIndex = 1; holeIndex < polygon3.length; holeIndex++) {
-    if (removeHoleIfNecessary(polygon3, holeIndex)) {
+  const polygon2 = geometry.coordinates;
+  for (let holeIndex = 1; holeIndex < polygon2.length; holeIndex++) {
+    if (removeHoleIfNecessary(polygon2, holeIndex)) {
       holeIndex--;
     }
   }
@@ -1524,23 +752,23 @@ function pruneMultiLineStringIfNecessary(geometry) {
 }
 function pruneMultiPolygonIfNecessary(geometry) {
   for (let polygonIndex = 0; polygonIndex < geometry.coordinates.length; polygonIndex++) {
-    const polygon3 = geometry.coordinates[polygonIndex];
-    const outerRing = polygon3[0];
+    const polygon2 = geometry.coordinates[polygonIndex];
+    const outerRing = polygon2[0];
     if (outerRing.length <= 3) {
       geometry.coordinates.splice(polygonIndex, 1);
       polygonIndex--;
     }
-    for (let holeIndex = 1; holeIndex < polygon3.length; holeIndex++) {
-      if (removeHoleIfNecessary(polygon3, holeIndex)) {
+    for (let holeIndex = 1; holeIndex < polygon2.length; holeIndex++) {
+      if (removeHoleIfNecessary(polygon2, holeIndex)) {
         holeIndex--;
       }
     }
   }
 }
-function removeHoleIfNecessary(polygon3, holeIndex) {
-  const hole = polygon3[holeIndex];
+function removeHoleIfNecessary(polygon2, holeIndex) {
+  const hole = polygon2[holeIndex];
   if (hole.length <= 3) {
-    polygon3.splice(holeIndex, 1);
+    polygon2.splice(holeIndex, 1);
     return true;
   }
   return false;
@@ -1667,11 +895,11 @@ var GeoJsonEditMode = class {
       };
       let updatedGeometry;
       if (modeConfig.booleanOperation === "union") {
-        updatedGeometry = (0, import_union.default)(selectedFeature, feature);
+        updatedGeometry = (0, import_union.default)((0, import_helpers3.featureCollection)([selectedFeature, feature]));
       } else if (modeConfig.booleanOperation === "difference") {
-        updatedGeometry = (0, import_difference2.default)(selectedFeature, feature);
+        updatedGeometry = (0, import_difference.default)((0, import_helpers3.featureCollection)([selectedFeature, feature]));
       } else if (modeConfig.booleanOperation === "intersection") {
-        updatedGeometry = (0, import_intersect.default)(selectedFeature, feature);
+        updatedGeometry = (0, import_intersect.default)((0, import_helpers3.featureCollection)([selectedFeature, feature]));
       } else {
         console.warn(`Invalid booleanOperation ${modeConfig.booleanOperation}`);
         return null;
@@ -1744,10 +972,10 @@ var ViewMode = class extends GeoJsonEditMode {
 
 // dist/edit-modes/translate-mode.js
 var import_bearing3 = __toESM(require("@turf/bearing"), 1);
-var import_distance2 = __toESM(require("@turf/distance"), 1);
+var import_distance = __toESM(require("@turf/distance"), 1);
 var import_clone = __toESM(require("@turf/clone"), 1);
 var import_helpers4 = require("@turf/helpers");
-var import_viewport_mercator_project3 = require("viewport-mercator-project");
+var import_web_mercator3 = require("@math.gl/web-mercator");
 
 // dist/utils/translate-from-center.js
 var import_center = __toESM(require("@turf/center"), 1);
@@ -1819,7 +1047,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.WebMercatorViewport(viewportDesc);
+      const viewport = viewportDesc.project ? viewportDesc : new import_web_mercator3.WebMercatorViewport(viewportDesc);
       const from = viewport.project(startDragPoint);
       const to = viewport.project(currentPoint);
       const dx = to[0] - from[0];
@@ -1847,7 +1075,7 @@ var TranslateMode = class extends GeoJsonEditMode {
     } else {
       const p1 = (0, import_helpers4.point)(startDragPoint);
       const p2 = (0, import_helpers4.point)(currentPoint);
-      const distanceMoved = (0, import_distance2.default)(p1, p2);
+      const distanceMoved = (0, import_distance.default)(p1, p2);
       const direction = (0, import_bearing3.default)(p1, p2);
       const movedFeatures = this._geometryBeforeTranslate.features.map((feature) => translateFromCenter((0, import_clone.default)(feature), distanceMoved, direction));
       for (let i = 0; i < selectedIndexes.length; i++) {
@@ -1894,12 +1122,7 @@ var ModifyMode = class extends GeoJsonEditMode {
         const referencePoint = (0, import_helpers5.point)(mapCoords2);
         recursivelyTraverseNestedArrays2(featureAsPick.object.geometry.coordinates, [], (lineString3, prefix) => {
           const lineStringFeature = (0, import_helpers5.lineString)(lineString3);
-          const candidateIntermediatePoint = this.getNearestPoint(
-            // @ts-expect-error turf types too wide
-            lineStringFeature,
-            referencePoint,
-            props.modeConfig && props.modeConfig.viewport
-          );
+          const candidateIntermediatePoint = this.getNearestPoint(lineStringFeature, referencePoint, props.modeConfig && props.modeConfig.viewport);
           if (!intermediatePoint || candidateIntermediatePoint.properties.dist < intermediatePoint.properties.dist) {
             intermediatePoint = candidateIntermediatePoint;
             positionIndexPrefix = prefix;
@@ -1940,31 +1163,35 @@ var ModifyMode = class extends GeoJsonEditMode {
     return nearestPointOnLine(line, inPoint, viewport);
   }
   handleClick(event, props) {
-    var _a;
+    var _a, _b;
     const pickedExistingHandle = getPickedExistingEditHandle(event.picks);
     const pickedIntermediateHandle = getPickedIntermediateEditHandle(event.picks);
     if (pickedExistingHandle) {
       const { featureIndex, positionIndexes } = pickedExistingHandle.properties;
-      let updatedData;
-      try {
-        updatedData = new ImmutableFeatureCollection(props.data).removePosition(featureIndex, positionIndexes).getObject();
-      } catch (ignored) {
-      }
-      if (updatedData) {
-        props.onEdit({
-          updatedData,
-          editType: "removePosition",
-          editContext: {
-            featureIndexes: [featureIndex],
-            positionIndexes,
-            position: pickedExistingHandle.geometry.coordinates
-          }
-        });
+      const feature = props.data.features[featureIndex];
+      const canRemovePosition = !(((_a = props.modeConfig) == null ? void 0 : _a.lockRectangles) && (feature == null ? void 0 : feature.properties.shape) === "Rectangle");
+      if (canRemovePosition) {
+        let updatedData;
+        try {
+          updatedData = new ImmutableFeatureCollection(props.data).removePosition(featureIndex, positionIndexes).getObject();
+        } catch (ignored) {
+        }
+        if (updatedData) {
+          props.onEdit({
+            updatedData,
+            editType: "removePosition",
+            editContext: {
+              featureIndexes: [featureIndex],
+              positionIndexes,
+              position: pickedExistingHandle.geometry.coordinates
+            }
+          });
+        }
       }
     } else if (pickedIntermediateHandle) {
       const { featureIndex, positionIndexes } = pickedIntermediateHandle.properties;
       const feature = props.data.features[featureIndex];
-      const canAddPosition = !(((_a = props.modeConfig) == null ? void 0 : _a.lockRectangles) && (feature == null ? void 0 : feature.properties.shape) === "Rectangle");
+      const canAddPosition = !(((_b = props.modeConfig) == null ? void 0 : _b.lockRectangles) && (feature == null ? void 0 : feature.properties.shape) === "Rectangle");
       if (canAddPosition) {
         const updatedData = new ImmutableFeatureCollection(props.data).addPosition(featureIndex, positionIndexes, pickedIntermediateHandle.geometry.coordinates).getObject();
         if (updatedData) {
@@ -2035,7 +1262,7 @@ var ModifyMode = class extends GeoJsonEditMode {
   }
   handleStopDragging(event, props) {
     const selectedFeatureIndexes = props.selectedIndexes;
-    const editHandle = getPickedEditHandle(event.picks);
+    const editHandle = getPickedEditHandle(event.pointerDownPicks);
     if (selectedFeatureIndexes.length && editHandle) {
       this._dragEditHandle("finishMovePosition", props, editHandle, event);
     }
@@ -2051,14 +1278,14 @@ var ModifyMode = class extends GeoJsonEditMode {
 };
 
 // dist/edit-modes/scale-mode.js
-var import_bbox2 = __toESM(require("@turf/bbox"), 1);
+var import_bbox = __toESM(require("@turf/bbox"), 1);
 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_bbox_polygon = __toESM(require("@turf/bbox-polygon"), 1);
 var import_helpers6 = require("@turf/helpers");
 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_distance2 = __toESM(require("@turf/distance"), 1);
 var import_transform_scale = __toESM(require("@turf/transform-scale"), 1);
 var import_invariant2 = require("@turf/invariant");
 var ScaleMode = class extends GeoJsonEditMode {
@@ -2107,12 +1334,7 @@ var ScaleMode = class extends GeoJsonEditMode {
     const oppositeHandle = this._getOppositeScaleHandle(this._selectedEditHandle);
     const origin = (0, import_invariant2.getCoord)(oppositeHandle);
     const scaleFactor = getScaleFactor(origin, startDragPoint, currentPoint);
-    const scaledFeatures = (0, import_transform_scale.default)(
-      // @ts-expect-error turf types diff
-      this._geometryBeingScaled,
-      scaleFactor,
-      { origin }
-    );
+    const scaledFeatures = (0, import_transform_scale.default)(this._geometryBeingScaled, scaleFactor, { origin });
     return {
       updatedData: this._getUpdatedData(props, scaledFeatures),
       editType,
@@ -2186,7 +1408,7 @@ var ScaleMode = class extends GeoJsonEditMode {
     if (this._isSinglePointGeometrySelected(selectedGeometry)) {
       return { type: "FeatureCollection", features: [] };
     }
-    const boundingBox = (0, import_bbox_polygon2.default)((0, import_bbox2.default)(selectedGeometry));
+    const boundingBox = (0, import_bbox_polygon.default)((0, import_bbox.default)(selectedGeometry));
     boundingBox.properties.mode = "scale";
     const cornerGuidePoints = [];
     (0, import_meta2.coordEach)(boundingBox, (coord, coordIndex) => {
@@ -2204,17 +1426,17 @@ var ScaleMode = class extends GeoJsonEditMode {
   }
 };
 function getScaleFactor(centroid, startDragPoint, currentPoint) {
-  const startDistance = (0, import_distance3.default)(centroid, startDragPoint);
-  const endDistance = (0, import_distance3.default)(centroid, currentPoint);
+  const startDistance = (0, import_distance2.default)(centroid, startDragPoint);
+  const endDistance = (0, import_distance2.default)(centroid, currentPoint);
   return endDistance / startDistance;
 }
 
 // dist/edit-modes/rotate-mode.js
-var import_bbox3 = __toESM(require("@turf/bbox"), 1);
+var import_bbox2 = __toESM(require("@turf/bbox"), 1);
 var import_centroid2 = __toESM(require("@turf/centroid"), 1);
 var import_bearing5 = __toESM(require("@turf/bearing"), 1);
-var import_bbox_polygon3 = __toESM(require("@turf/bbox-polygon"), 1);
-var import_distance4 = __toESM(require("@turf/distance"), 1);
+var import_bbox_polygon2 = __toESM(require("@turf/bbox-polygon"), 1);
+var import_distance3 = __toESM(require("@turf/distance"), 1);
 var import_meta3 = require("@turf/meta");
 var import_invariant3 = require("@turf/invariant");
 var import_helpers7 = require("@turf/helpers");
@@ -2241,7 +1463,7 @@ var RotateMode = class extends GeoJsonEditMode {
     if (this._isRotating) {
       return (0, import_helpers7.featureCollection)([(0, import_centroid2.default)(selectedGeometry)]);
     }
-    const boundingBox = (0, import_bbox_polygon3.default)((0, import_bbox3.default)(selectedGeometry));
+    const boundingBox = (0, import_bbox_polygon2.default)((0, import_bbox2.default)(selectedGeometry));
     let previousCoord = null;
     let topEdgeMidpointCoords = null;
     let longestEdgeLength = 0;
@@ -2251,7 +1473,7 @@ var RotateMode = class extends GeoJsonEditMode {
         if (!topEdgeMidpointCoords || edgeMidpoint[1] > topEdgeMidpointCoords[1]) {
           topEdgeMidpointCoords = edgeMidpoint;
         }
-        const edgeDistance = (0, import_distance4.default)(coord, previousCoord);
+        const edgeDistance = (0, import_distance3.default)(coord, previousCoord);
         longestEdgeLength = Math.max(longestEdgeLength, edgeDistance);
       }
       previousCoord = coord;
@@ -2315,15 +1537,10 @@ var RotateMode = class extends GeoJsonEditMode {
       return null;
     }
     const centroid = (0, import_centroid2.default)(this._geometryBeingRotated);
-    const angle = getRotationAngle(centroid, startDragPoint, currentPoint);
-    const rotatedFeatures = (0, import_transform_rotate.default)(
-      // @ts-expect-error turf types too wide
-      this._geometryBeingRotated,
-      angle,
-      {
-        pivot: centroid
-      }
-    );
+    const angle = getRotationAngle(centroid.geometry.coordinates, startDragPoint, currentPoint);
+    const rotatedFeatures = (0, import_transform_rotate.default)(this._geometryBeingRotated, angle, {
+      pivot: centroid
+    });
     let updatedData = new ImmutableFeatureCollection(props.data);
     const selectedIndexes = props.selectedIndexes;
     for (let i = 0; i < selectedIndexes.length; i++) {
@@ -2365,12 +1582,12 @@ var DuplicateMode = class extends TranslateMode {
 
 // dist/edit-modes/split-polygon-mode.js
 var import_boolean_point_in_polygon = __toESM(require("@turf/boolean-point-in-polygon"), 1);
-var import_difference3 = __toESM(require("@turf/difference"), 1);
-var import_buffer2 = __toESM(require("@turf/buffer"), 1);
+var import_difference2 = __toESM(require("@turf/difference"), 1);
+var import_buffer = __toESM(require("@turf/buffer"), 1);
 var import_line_intersect = __toESM(require("@turf/line-intersect"), 1);
 var import_helpers8 = require("@turf/helpers");
 var import_bearing6 = __toESM(require("@turf/bearing"), 1);
-var import_distance5 = __toESM(require("@turf/distance"), 1);
+var import_distance4 = __toESM(require("@turf/distance"), 1);
 var import_destination3 = __toESM(require("@turf/destination"), 1);
 var import_polygon_to_line3 = __toESM(require("@turf/polygon-to-line"), 1);
 var import_nearest_point_on_line = __toESM(require("@turf/nearest-point-on-line"), 1);
@@ -2389,7 +1606,7 @@ var SplitPolygonMode = class extends GeoJsonEditMode {
       let closestPoint = null;
       lines.forEach((line) => {
         const snapPoint = (0, import_nearest_point_on_line.default)(line, firstPoint);
-        const distanceFromOrigin = (0, import_distance5.default)(snapPoint, firstPoint);
+        const distanceFromOrigin = (0, import_distance4.default)(snapPoint, firstPoint);
         if (minDistance > distanceFromOrigin) {
           minDistance = distanceFromOrigin;
           closestPoint = snapPoint;
@@ -2397,7 +1614,7 @@ var SplitPolygonMode = class extends GeoJsonEditMode {
       });
       if (closestPoint) {
         const lastBearing = (0, import_bearing6.default)(firstPoint, closestPoint);
-        const currentDistance = (0, import_distance5.default)(firstPoint, mapCoords2, { units: "meters" });
+        const currentDistance = (0, import_distance4.default)(firstPoint, mapCoords2, { units: "meters" });
         return (0, import_destination3.default)(firstPoint, currentDistance, lastBearing, {
           units: "meters"
         }).geometry.coordinates;
@@ -2473,8 +1690,8 @@ var SplitPolygonMode = class extends GeoJsonEditMode {
       gap = 0.1;
       units = "centimeters";
     }
-    const buffer = (0, import_buffer2.default)(tentativeFeature, gap, { units });
-    const updatedGeometry = (0, import_difference3.default)(selectedGeometry, buffer);
+    const buffer = (0, import_buffer.default)(tentativeFeature, gap, { units });
+    const updatedGeometry = (0, import_difference2.default)((0, import_helpers8.featureCollection)([(0, import_helpers8.feature)(selectedGeometry), buffer]));
     if (!updatedGeometry) {
       console.warn("Canceling edit. Split Polygon erased");
       return null;
@@ -2749,7 +1966,7 @@ var DrawPointMode = class extends GeoJsonEditMode {
 };
 
 // dist/edit-modes/draw-line-string-mode.js
-var import_distance6 = __toESM(require("@turf/distance"), 1);
+var import_distance5 = __toESM(require("@turf/distance"), 1);
 
 // dist/utils/memoize.js
 function isEqual(a, b) {
@@ -2906,7 +2123,7 @@ var DrawLineStringMode = class extends GeoJsonEditMode {
   calculateInfoDraw(clickSequence) {
     if (clickSequence.length > 1) {
       this.position = clickSequence[clickSequence.length - 1];
-      this.dist += (0, import_distance6.default)(clickSequence[clickSequence.length - 2], clickSequence[clickSequence.length - 1]);
+      this.dist += (0, import_distance5.default)(clickSequence[clickSequence.length - 2], clickSequence[clickSequence.length - 1]);
     }
   }
   /**
@@ -2936,9 +2153,10 @@ var DrawLineStringMode = class extends GeoJsonEditMode {
 };
 
 // dist/edit-modes/draw-polygon-mode.js
-var import_line_intersect2 = __toESM(require("@turf/line-intersect"), 1);
+var import_line_intersect2 = require("@turf/line-intersect");
 var import_helpers9 = require("@turf/helpers");
-var import_boolean_within = __toESM(require("@turf/boolean-within"), 1);
+var import_boolean_within = require("@turf/boolean-within");
+var import_kinks = require("@turf/kinks");
 var DrawPolygonMode = class extends GeoJsonEditMode {
   holeSequence = [];
   isDrawingHole = false;
@@ -3079,12 +2297,12 @@ var DrawPolygonMode = class extends GeoJsonEditMode {
   // eslint-disable-next-line max-statements, complexity
   finishDrawing(props) {
     const clickSequence = this.getClickSequence();
-    const polygon3 = [...clickSequence, clickSequence[0]];
-    const newPolygon = (0, import_helpers9.polygon)([polygon3]);
+    const polygon2 = [...clickSequence, clickSequence[0]];
+    const newPolygon = (0, import_helpers9.polygon)([polygon2]);
     const canAddHole = canAddHoleToPolygon(props);
     const canOverlap = canPolygonOverlap(props);
     if (!canOverlap) {
-      const overlapping = (0, import_line_intersect2.default)(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 = (0, import_kinks.kinks)(newPolygon).features;
       if (overlapping.length > 0) {
         props.onEdit({
           updatedData: props.data,
@@ -3096,7 +2314,7 @@ var DrawPolygonMode = class extends GeoJsonEditMode {
       }
     }
     if (canAddHole) {
-      const holeResult = this.tryAddHoleToExistingPolygon(newPolygon, polygon3, props);
+      const holeResult = this.tryAddHoleToExistingPolygon(newPolygon, polygon2, props);
       if (holeResult.handled) {
         this.resetClickSequence();
         return;
@@ -3111,10 +2329,10 @@ var DrawPolygonMode = class extends GeoJsonEditMode {
     this.resetClickSequence();
     return;
   }
-  tryAddHoleToExistingPolygon(newPolygon, polygon3, props) {
+  tryAddHoleToExistingPolygon(newPolygon, polygon2, props) {
     for (const [featureIndex, feature] of props.data.features.entries()) {
       if (feature.geometry.type === "Polygon") {
-        const result = this.validateAndCreateHole(feature, featureIndex, newPolygon, polygon3, props);
+        const result = this.validateAndCreateHole(feature, featureIndex, newPolygon, polygon2, props);
         if (result.handled) {
           return result;
         }
@@ -3122,11 +2340,11 @@ var DrawPolygonMode = class extends GeoJsonEditMode {
     }
     return { handled: false };
   }
-  validateAndCreateHole(feature, featureIndex, newPolygon, polygon3, props) {
+  validateAndCreateHole(feature, featureIndex, newPolygon, polygon2, props) {
     const outer = (0, import_helpers9.polygon)(feature.geometry.coordinates);
     for (let i = 1; i < feature.geometry.coordinates.length; i++) {
       const hole = (0, import_helpers9.polygon)([feature.geometry.coordinates[i]]);
-      const intersection = (0, import_line_intersect2.default)(hole, newPolygon);
+      const intersection = (0, import_line_intersect2.lineIntersect)(hole, newPolygon);
       if (intersection.features.length > 0) {
         props.onEdit({
           updatedData: props.data,
@@ -3135,7 +2353,7 @@ var DrawPolygonMode = class extends GeoJsonEditMode {
         });
         return { handled: true };
       }
-      if ((0, import_boolean_within.default)(hole, newPolygon) || (0, import_boolean_within.default)(newPolygon, hole)) {
+      if ((0, import_boolean_within.booleanWithin)(hole, newPolygon) || (0, import_boolean_within.booleanWithin)(newPolygon, hole)) {
         props.onEdit({
           updatedData: props.data,
           editType: "invalidHole",
@@ -3144,7 +2362,7 @@ var DrawPolygonMode = class extends GeoJsonEditMode {
         return { handled: true };
       }
     }
-    const intersectionWithOuter = (0, import_line_intersect2.default)(outer, newPolygon);
+    const intersectionWithOuter = (0, import_line_intersect2.lineIntersect)(outer, newPolygon);
     if (intersectionWithOuter.features.length > 0) {
       props.onEdit({
         updatedData: props.data,
@@ -3153,7 +2371,7 @@ var DrawPolygonMode = class extends GeoJsonEditMode {
       });
       return { handled: true };
     }
-    if ((0, import_boolean_within.default)(outer, newPolygon)) {
+    if ((0, import_boolean_within.booleanWithin)(outer, newPolygon)) {
       props.onEdit({
         updatedData: props.data,
         editType: "invalidPolygon",
@@ -3161,10 +2379,10 @@ var DrawPolygonMode = class extends GeoJsonEditMode {
       });
       return { handled: true };
     }
-    if ((0, import_boolean_within.default)(newPolygon, outer)) {
+    if ((0, import_boolean_within.booleanWithin)(newPolygon, outer)) {
       const updatedData = new ImmutableFeatureCollection(props.data).replaceGeometry(featureIndex, {
         ...feature.geometry,
-        coordinates: [...feature.geometry.coordinates, polygon3]
+        coordinates: [...feature.geometry.coordinates, polygon2]
       }).getObject();
       props.onEdit({
         updatedData,
@@ -3191,7 +2409,7 @@ function canPolygonOverlap(props) {
 }
 
 // dist/edit-modes/draw-rectangle-mode.js
-var import_bbox_polygon4 = __toESM(require("@turf/bbox-polygon"), 1);
+var import_bbox_polygon3 = __toESM(require("@turf/bbox-polygon"), 1);
 
 // dist/edit-modes/two-click-polygon-mode.js
 var import_lodash = __toESM(require("lodash.omit"), 1);
@@ -3248,15 +2466,15 @@ var TwoClickPolygonMode = class extends GeoJsonEditMode {
     }
     const corner1 = clickSequence[0];
     const corner2 = lastPointerMoveEvent.mapCoords;
-    const polygon3 = this.getTwoClickPolygon(corner1, corner2, modeConfig);
-    if (polygon3) {
+    const polygon2 = this.getTwoClickPolygon(corner1, corner2, modeConfig);
+    if (polygon2) {
       guides.features.push({
         type: "Feature",
         properties: {
-          ...polygon3.properties,
+          ...polygon2.properties,
           guideType: "tentative"
         },
-        geometry: polygon3.geometry
+        geometry: polygon2.geometry
       });
     }
     return guides;
@@ -3283,7 +2501,7 @@ var TwoClickPolygonMode = class extends GeoJsonEditMode {
 // dist/edit-modes/draw-rectangle-mode.js
 var DrawRectangleMode = class extends TwoClickPolygonMode {
   getTwoClickPolygon(coord1, coord2, modeConfig) {
-    const rectangle = (0, import_bbox_polygon4.default)([coord1[0], coord1[1], coord2[0], coord2[1]]);
+    const rectangle = (0, import_bbox_polygon3.default)([coord1[0], coord1[1], coord2[0], coord2[1]]);
     rectangle.properties = rectangle.properties || {};
     rectangle.properties.shape = "Rectangle";
     return rectangle;
@@ -3291,22 +2509,22 @@ var DrawRectangleMode = class extends TwoClickPolygonMode {
 };
 
 // dist/edit-modes/draw-square-mode.js
-var import_bbox_polygon5 = __toESM(require("@turf/bbox-polygon"), 1);
-var import_distance7 = __toESM(require("@turf/distance"), 1);
+var import_bbox_polygon4 = __toESM(require("@turf/bbox-polygon"), 1);
+var import_distance6 = __toESM(require("@turf/distance"), 1);
 var import_along = __toESM(require("@turf/along"), 1);
 var import_helpers10 = require("@turf/helpers");
 var DrawSquareMode = class extends TwoClickPolygonMode {
   getTwoClickPolygon(coord1, coord2, modeConfig) {
     const coord3 = [coord2[0], coord1[1]];
     const coord4 = [coord1[0], coord2[1]];
-    const distance1 = (0, import_distance7.default)((0, import_helpers10.point)(coord3), (0, import_helpers10.point)(coord1));
-    const distance22 = (0, import_distance7.default)((0, import_helpers10.point)(coord4), (0, import_helpers10.point)(coord1));
+    const distance1 = (0, import_distance6.default)((0, import_helpers10.point)(coord3), (0, import_helpers10.point)(coord1));
+    const distance22 = (0, import_distance6.default)((0, import_helpers10.point)(coord4), (0, import_helpers10.point)(coord1));
     const shortestDistance = distance1 <= distance22 ? distance1 : distance22;
     const closestPoint = distance1 <= distance22 ? coord3 : coord4;
     const line = (0, import_helpers10.lineString)([closestPoint, coord2]);
     const newPoint = (0, import_along.default)(line, shortestDistance);
     const corner = newPoint.geometry.coordinates;
-    const square = (0, import_bbox_polygon5.default)([coord1[0], coord1[1], corner[0], corner[1]]);
+    const square = (0, import_bbox_polygon4.default)([coord1[0], coord1[1], corner[0], corner[1]]);
     square.properties = square.properties || {};
     square.properties.shape = "Square";
     return square;
@@ -3314,12 +2532,12 @@ var DrawSquareMode = class extends TwoClickPolygonMode {
 };
 
 // dist/edit-modes/draw-rectangle-from-center-mode.js
-var import_bbox_polygon6 = __toESM(require("@turf/bbox-polygon"), 1);
+var import_bbox_polygon5 = __toESM(require("@turf/bbox-polygon"), 1);
 var DrawRectangleFromCenterMode = class extends TwoClickPolygonMode {
   getTwoClickPolygon(coord1, coord2, modeConfig) {
     const longitude = coord1[0] > coord2[0] ? coord1[0] + Math.abs(coord1[0] - coord2[0]) : coord1[0] - Math.abs(coord1[0] - coord2[0]);
     const latitude = coord1[1] > coord2[1] ? coord1[1] + Math.abs(coord1[1] - coord2[1]) : coord1[1] - Math.abs(coord1[1] - coord2[1]);
-    const rectangle = (0, import_bbox_polygon6.default)([longitude, latitude, coord2[0], coord2[1]]);
+    const rectangle = (0, import_bbox_polygon5.default)([longitude, latitude, coord2[0], coord2[1]]);
     rectangle.properties = rectangle.properties || {};
     rectangle.properties.shape = "Rectangle";
     return rectangle;
@@ -3327,16 +2545,16 @@ var DrawRectangleFromCenterMode = class extends TwoClickPolygonMode {
 };
 
 // dist/edit-modes/draw-square-from-center-mode.js
-var import_bbox_polygon7 = __toESM(require("@turf/bbox-polygon"), 1);
-var import_distance8 = __toESM(require("@turf/distance"), 1);
+var import_bbox_polygon6 = __toESM(require("@turf/bbox-polygon"), 1);
+var import_distance7 = __toESM(require("@turf/distance"), 1);
 var import_along2 = __toESM(require("@turf/along"), 1);
 var import_helpers11 = require("@turf/helpers");
 var DrawSquareFromCenterMode = class extends TwoClickPolygonMode {
   getTwoClickPolygon(coord1, coord2, modeConfig) {
     const coord3 = [coord2[0], coord1[1]];
     const coord4 = [coord1[0], coord2[1]];
-    const distance1 = (0, import_distance8.default)((0, import_helpers11.point)(coord3), (0, import_helpers11.point)(coord1));
-    const distance22 = (0, import_distance8.default)((0, import_helpers11.point)(coord4), (0, import_helpers11.point)(coord1));
+    const distance1 = (0, import_distance7.default)((0, import_helpers11.point)(coord3), (0, import_helpers11.point)(coord1));
+    const distance22 = (0, import_distance7.default)((0, import_helpers11.point)(coord4), (0, import_helpers11.point)(coord1));
     const shortestDistance = distance1 <= distance22 ? distance1 : distance22;
     const closestPoint = distance1 <= distance22 ? coord3 : coord4;
     const line = (0, import_helpers11.lineString)([closestPoint, coord2]);
@@ -3344,7 +2562,7 @@ var DrawSquareFromCenterMode = class extends TwoClickPolygonMode {
     const corner = newPoint.geometry.coordinates;
     const longitude = coord1[0] > corner[0] ? coord1[0] + Math.abs(coord1[0] - corner[0]) : coord1[0] - Math.abs(coord1[0] - corner[0]);
     const latitude = coord1[1] > corner[1] ? coord1[1] + Math.abs(coord1[1] - corner[1]) : coord1[1] - Math.abs(coord1[1] - corner[1]);
-    const square = (0, import_bbox_polygon7.default)([longitude, latitude, corner[0], corner[1]]);
+    const square = (0, import_bbox_polygon6.default)([longitude, latitude, corner[0], corner[1]]);
     square.properties = square.properties || {};
     square.properties.shape = "Square";
     return square;
@@ -3353,7 +2571,7 @@ var DrawSquareFromCenterMode = class extends TwoClickPolygonMode {
 
 // dist/edit-modes/draw-circle-from-center-mode.js
 var import_circle = __toESM(require("@turf/circle"), 1);
-var import_distance9 = __toESM(require("@turf/distance"), 1);
+var import_distance8 = __toESM(require("@turf/distance"), 1);
 var import_area = __toESM(require("@turf/area"), 1);
 var DrawCircleFromCenterMode = class extends TwoClickPolygonMode {
   radius = null;
@@ -3367,7 +2585,7 @@ var DrawCircleFromCenterMode = class extends TwoClickPolygonMode {
       console.warn("Minimum steps to draw a circle is 4 ");
       options.steps = 4;
     }
-    this.radius = Math.max((0, import_distance9.default)(coord1, coord2), 1e-3);
+    this.radius = Math.max((0, import_distance8.default)(coord1, coord2), 1e-3);
     const geometry = (0, import_circle.default)(coord1, this.radius, options);
     geometry.properties = geometry.properties || {};
     geometry.properties.shape = "Circle";
@@ -3421,7 +2639,7 @@ var DrawCircleFromCenterMode = class extends TwoClickPolygonMode {
 
 // dist/edit-modes/draw-circle-by-diameter-mode.js
 var import_circle2 = __toESM(require("@turf/circle"), 1);
-var import_distance10 = __toESM(require("@turf/distance"), 1);
+var import_distance9 = __toESM(require("@turf/distance"), 1);
 var import_area2 = __toESM(require("@turf/area"), 1);
 var DrawCircleByDiameterMode = class extends TwoClickPolygonMode {
   radius = null;
@@ -3436,8 +2654,8 @@ var DrawCircleByDiameterMode = class extends TwoClickPolygonMode {
       options.steps = 4;
     }
     const centerCoordinates = getIntermediatePosition(coord1, coord2);
-    this.radius = Math.max((0, import_distance10.default)(coord1, centerCoordinates), 1e-3);
-    this.diameter = Math.max((0, import_distance10.default)(coord1, coord2), 1e-3);
+    this.radius = Math.max((0, import_distance9.default)(coord1, centerCoordinates), 1e-3);
+    this.diameter = Math.max((0, import_distance9.default)(coord1, coord2), 1e-3);
     this.position = centerCoordinates;
     const geometry = (0, import_circle2.default)(centerCoordinates, this.radius, options);
     geometry.properties = geometry.properties || {};
@@ -3495,8 +2713,8 @@ var DrawCircleByDiameterMode = class extends TwoClickPolygonMode {
 };
 
 // dist/edit-modes/draw-ellipse-by-bounding-box-mode.js
-var import_bbox_polygon8 = __toESM(require("@turf/bbox-polygon"), 1);
-var import_distance11 = __toESM(require("@turf/distance"), 1);
+var import_bbox_polygon7 = __toESM(require("@turf/bbox-polygon"), 1);
+var import_distance10 = __toESM(require("@turf/distance"), 1);
 var import_ellipse = __toESM(require("@turf/ellipse"), 1);
 var import_helpers12 = require("@turf/helpers");
 var DrawEllipseByBoundingBoxMode = class extends TwoClickPolygonMode {
@@ -3505,11 +2723,11 @@ var DrawEllipseByBoundingBoxMode = class extends TwoClickPolygonMode {
     const minY = Math.min(coord1[1], coord2[1]);
     const maxX = Math.max(coord1[0], coord2[0]);
     const maxY = Math.max(coord1[1], coord2[1]);
-    const polygonPoints = (0, import_bbox_polygon8.default)([minX, minY, maxX, maxY]).geometry.coordinates[0];
+    const polygonPoints = (0, import_bbox_polygon7.default)([minX, minY, maxX, maxY]).geometry.coordinates[0];
     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);
-    const geometry = (0, import_ellipse.default)(centerCoordinates, xSemiAxis, ySemiAxis);
+    const xSemiAxis = Math.max((0, import_distance10.default)((0, import_helpers12.point)(polygonPoints[0]), (0, import_helpers12.point)(polygonPoints[1])), 1e-3);
+    const ySemiAxis = Math.max((0, import_distance10.default)((0, import_helpers12.point)(polygonPoints[0]), (0, import_helpers12.point)(polygonPoints[3])), 1e-3);
+    const geometry = (0, import_ellipse.default)(centerCoordinates, xSemiAxis, ySemiAxis, {});
     geometry.properties = geometry.properties || {};
     geometry.properties.editProperties = geometry.properties.editProperties || {};
     geometry.properties.editProperties.shape = "Ellipse";
@@ -3522,14 +2740,14 @@ var DrawEllipseByBoundingBoxMode = class extends TwoClickPolygonMode {
 };
 
 // dist/edit-modes/three-click-polygon-mode.js
-var import_lodash2 = __toESM(require("lodash.omit"), 1);
 var ThreeClickPolygonMode = class extends GeoJsonEditMode {
   handleClick(event, props) {
     this.addClickSequence(event);
+    const { modeConfig } = props;
     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, (0, import_lodash2.default)(tentativeFeature.properties, "guideType"));
+    if (clickSequence.length > 2) {
+      const { geometry, properties } = this.getThreeClickPolygon(clickSequence[0], clickSequence[1], clickSequence[2], modeConfig);
+      const editAction = this.getAddFeatureOrBooleanPolygonAction(geometry, props, properties);
       this.resetClickSequence();
       if (editAction) {
         props.onEdit(editAction);
@@ -3543,11 +2761,11 @@ var ThreeClickPolygonMode = class extends GeoJsonEditMode {
       type: "FeatureCollection",
       features: []
     };
-    if (clickSequence.length === 0) {
-      return guides;
-    }
-    const hoveredCoord = lastPointerMoveEvent.mapCoords;
-    if (clickSequence.length === 1) {
+    const coords = [
+      ...clickSequence,
+      ...lastPointerMoveEvent ? [lastPointerMoveEvent.mapCoords] : []
+    ];
+    if (coords.length === 2) {
       guides.features.push({
         type: "Feature",
         properties: {
@@ -3555,19 +2773,18 @@ var ThreeClickPolygonMode = class extends GeoJsonEditMode {
         },
         geometry: {
           type: "LineString",
-          coordinates: [clickSequence[0], hoveredCoord]
+          coordinates: [coords[0], coords[1]]
         }
       });
-    } else {
-      const polygon3 = this.getThreeClickPolygon(clickSequence[0], clickSequence[1], hoveredCoord, modeConfig);
-      if (polygon3) {
+    } else if (coords.length > 2) {
+      const polygon2 = this.getThreeClickPolygon(coords[0], coords[1], coords[2], modeConfig);
+      if (polygon2) {
         guides.features.push({
-          type: "Feature",
+          ...polygon2,
           properties: {
-            ...polygon3.properties,
+            ...polygon2.properties,
             guideType: "tentative"
-          },
-          geometry: polygon3.geometry
+          }
         });
       }
     }
@@ -3621,15 +2838,15 @@ var DrawRectangleUsingThreePointsMode = class extends ThreeClickPolygonMode {
 };
 
 // dist/edit-modes/draw-ellipse-using-three-points-mode.js
-var import_distance12 = __toESM(require("@turf/distance"), 1);
+var import_distance11 = __toESM(require("@turf/distance"), 1);
 var import_ellipse2 = __toESM(require("@turf/ellipse"), 1);
 var import_bearing8 = __toESM(require("@turf/bearing"), 1);
 var import_helpers13 = require("@turf/helpers");
 var DrawEllipseUsingThreePointsMode = class extends ThreeClickPolygonMode {
   getThreeClickPolygon(coord1, coord2, coord3, modeConfig) {
     const centerCoordinates = getIntermediatePosition(coord1, coord2);
-    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 xSemiAxis = Math.max((0, import_distance11.default)(centerCoordinates, (0, import_helpers13.point)(coord3)), 1e-3);
+    const ySemiAxis = Math.max((0, import_distance11.default)(coord1, coord2), 1e-3) / 2;
     const options = { angle: (0, import_bearing8.default)(coord1, coord2) };
     const geometry = (0, import_ellipse2.default)(centerCoordinates, xSemiAxis, ySemiAxis, options);
     geometry.properties = geometry.properties || {};
@@ -3647,7 +2864,7 @@ var DrawEllipseUsingThreePointsMode = class extends ThreeClickPolygonMode {
 var import_destination4 = __toESM(require("@turf/destination"), 1);
 var import_bearing9 = __toESM(require("@turf/bearing"), 1);
 var import_line_intersect3 = __toESM(require("@turf/line-intersect"), 1);
-var import_distance13 = __toESM(require("@turf/distance"), 1);
+var import_distance12 = __toESM(require("@turf/distance"), 1);
 var import_helpers14 = require("@turf/helpers");
 var Draw90DegreePolygonMode = class extends GeoJsonEditMode {
   createTentativeFeature(props) {
@@ -3718,13 +2935,13 @@ var Draw90DegreePolygonMode = class extends GeoJsonEditMode {
       const lineString3 = tentativeFeature.geometry;
       clickSequence[clickSequence.length - 1] = lineString3.coordinates[lineString3.coordinates.length - 1];
     } else if (clickSequence.length > 3 && tentativeFeature.geometry.type === "Polygon") {
-      const polygon3 = tentativeFeature.geometry;
-      clickSequence[clickSequence.length - 1] = polygon3.coordinates[0][polygon3.coordinates[0].length - 2];
+      const polygon2 = tentativeFeature.geometry;
+      clickSequence[clickSequence.length - 1] = polygon2.coordinates[0][polygon2.coordinates[0].length - 2];
       const clickedEditHandle = getPickedEditHandle(picks);
-      if (clickedEditHandle && Array.isArray(clickedEditHandle.properties.positionIndexes) && (clickedEditHandle.properties.positionIndexes[1] === 0 || clickedEditHandle.properties.positionIndexes[1] === polygon3.coordinates[0].length - 3)) {
+      if (clickedEditHandle && Array.isArray(clickedEditHandle.properties.positionIndexes) && (clickedEditHandle.properties.positionIndexes[1] === 0 || clickedEditHandle.properties.positionIndexes[1] === polygon2.coordinates[0].length - 3)) {
         const polygonToAdd = {
           type: "Polygon",
-          coordinates: this.finalizedCoordinates([...polygon3.coordinates[0]])
+          coordinates: this.finalizedCoordinates([...polygon2.coordinates[0]])
         };
         this.resetClickSequence();
         const editAction = this.getAddFeatureOrBooleanPolygonAction(polygonToAdd, props);
@@ -3777,7 +2994,7 @@ var Draw90DegreePolygonMode = class extends GeoJsonEditMode {
         const newAngle2 = angle2 + factor * 90;
         angles.second.push(newAngle2 > 180 ? newAngle2 - 360 : newAngle2);
       });
-      const distance7 = (0, import_distance13.default)((0, import_helpers14.point)(p1), (0, import_helpers14.point)(p3));
+      const distance7 = (0, import_distance12.default)((0, import_helpers14.point)(p1), (0, import_helpers14.point)(p3));
       [0, 1, 2].forEach((indexFirst) => {
         const line1 = (0, import_helpers14.lineString)([
           p1,
@@ -3800,7 +3017,7 @@ var Draw90DegreePolygonMode = class extends GeoJsonEditMode {
 };
 
 // dist/edit-modes/draw-polygon-by-dragging-mode.js
-var import_lodash3 = __toESM(require("lodash.throttle"), 1);
+var import_lodash2 = __toESM(require("lodash.throttle"), 1);
 var DrawPolygonByDraggingMode = class extends DrawPolygonMode {
   handleDraggingThrottled = null;
   handleClick(event, props) {
@@ -3808,7 +3025,7 @@ var DrawPolygonByDraggingMode = class extends DrawPolygonMode {
   handleStartDragging(event, props) {
     event.cancelPan();
     if (props.modeConfig && props.modeConfig.throttleMs) {
-      this.handleDraggingThrottled = (0, import_lodash3.default)(this.handleDraggingAux, props.modeConfig.throttleMs);
+      this.handleDraggingThrottled = (0, import_lodash2.default)(this.handleDraggingAux, props.modeConfig.throttleMs);
     } else {
       this.handleDraggingThrottled = this.handleDraggingAux;
     }
@@ -4107,12 +3324,12 @@ var DeleteMode = class extends GeoJsonEditMode {
 };
 
 // dist/constants.js
-var PROJECTED_PIXEL_SIZE_MULTIPLIER2 = 2 / 3;
+var PROJECTED_PIXEL_SIZE_MULTIPLIER = 2 / 3;
 
 // dist/editable-layers/editable-layer.js
-var import_core3 = require("@deck.gl/core");
+var import_core = require("@deck.gl/core");
 var EVENT_TYPES = ["click", "pointermove", "panstart", "panmove", "panend", "keyup", "dblclick"];
-var EditableLayer = class extends import_core3.CompositeLayer {
+var EditableLayer = class extends import_core.CompositeLayer {
   state = void 0;
   // Overridable interaction event handlers
   onLayerClick(event) {
@@ -4305,7 +3522,7 @@ var EditableLayer = class extends import_core3.CompositeLayer {
 __publicField(EditableLayer, "layerName", "EditableLayer");
 
 // dist/editable-layers/editable-path-layer.js
-var import_layers5 = require("@deck.gl/layers");
+var import_layers = require("@deck.gl/layers");
 var uniformBlock = `uniform pickingLineWidthUniforms {
   float extraPixels;
 } pickingLineWidth;
@@ -4319,10 +3536,10 @@ var pickingUniforms = {
   }
 };
 var defaultProps = {
-  ...import_layers5.PathLayer.defaultProps,
+  ...import_layers.PathLayer.defaultProps,
   pickingLineWidthExtraPixels: { type: "number", min: 0, value: Number.MAX_SAFE_INTEGER }
 };
-var EditablePathLayer = class extends import_layers5.PathLayer {
+var EditablePathLayer = class extends import_layers.PathLayer {
   getShaders() {
     const shaders = super.getShaders();
     shaders.vs = insertBefore(shaders.vs, "vec3 width;", `
@@ -4360,7 +3577,7 @@ var DEFAULT_EDITING_POINT_OUTLINE_COLOR = [255, 255, 255, 255];
 var DEFAULT_EDITING_EXISTING_POINT_RADIUS = 5;
 var DEFAULT_EDITING_INTERMEDIATE_POINT_RADIUS = 3;
 var DEFAULT_EDITING_SNAP_POINT_RADIUS = 7;
-var DEFAULT_TOOLTIP_FONT_SIZE = 32 * PROJECTED_PIXEL_SIZE_MULTIPLIER2;
+var DEFAULT_TOOLTIP_FONT_SIZE = 32 * PROJECTED_PIXEL_SIZE_MULTIPLIER;
 var DEFAULT_EDIT_MODE = DrawPolygonMode;
 function guideAccessor(accessor) {
   if (!accessor || typeof accessor !== "function") {
@@ -4412,7 +3629,7 @@ var defaultProps2 = {
   fp64: false,
   filled: true,
   stroked: true,
-  lineWidthScale: PROJECTED_PIXEL_SIZE_MULTIPLIER2,
+  lineWidthScale: PROJECTED_PIXEL_SIZE_MULTIPLIER,
   lineWidthMinPixels: 1,
   lineWidthMaxPixels: Number.MAX_SAFE_INTEGER,
   pickingLineWidthExtraPixels: 0,
@@ -4527,13 +3744,29 @@ var EditableGeoJsonLayer = class extends EditableLayer {
         }
       },
       updateTriggers: {
-        getLineColor: [this.props.selectedFeatureIndexes, this.props.mode],
-        getFillColor: [this.props.selectedFeatureIndexes, this.props.mode],
-        getPointRadius: [this.props.selectedFeatureIndexes, this.props.mode],
-        getLineWidth: [this.props.selectedFeatureIndexes, this.props.mode]
+        getLineColor: [
+          this.props.updateTriggers.getLineColor,
+          this.props.selectedFeatureIndexes,
+          this.props.mode
+        ],
+        getFillColor: [
+          this.props.updateTriggers.getFillColor,
+          this.props.selectedFeatureIndexes,
+          this.props.mode
+        ],
+        getPointRadius: [
+          this.props.updateTriggers.getPointRadius,
+          this.props.selectedFeatureIndexes,
+          this.props.mode
+        ],
+        getLineWidth: [
+          this.props.updateTriggers.getLineWidth,
+          this.props.selectedFeatureIndexes,
+          this.props.mode
+        ]
       }
     });
-    let layers = [new import_layers6.GeoJsonLayer(subLayerProps)];
+    let layers = [new import_layers2.GeoJsonLayer(subLayerProps)];
     layers = layers.concat(this.createGuidesLayers(), this.createTooltipsLayers());
     return layers;
   }
@@ -4647,7 +3880,7 @@ var EditableGeoJsonLayer = class extends EditableLayer {
     };
     if (this.props.editHandleType === "icon") {
       subLayerProps["points-icon"] = {
-        type: import_layers6.IconLayer,
+        type: import_layers2.IconLayer,
         iconAtlas: this.props.editHandleIconAtlas,
         iconMapping: this.props.editHandleIconMapping,
         sizeUnits: this.props.editHandleIconSizeUnits,
@@ -4660,7 +3893,7 @@ var EditableGeoJsonLayer = class extends EditableLayer {
       };
     } else {
       subLayerProps["points-circle"] = {
-        type: import_layers6.ScatterplotLayer,
+        type: import_layers2.ScatterplotLayer,
         radiusScale: this.props.editHandlePointRadiusScale,
         stroked: this.props.editHandlePointOutline,
         getLineWidth: this.props.editHandlePointStrokeWidth,
@@ -4673,7 +3906,7 @@ var EditableGeoJsonLayer = class extends EditableLayer {
         billboard: this.props.billboard
       };
     }
-    const layer = new import_layers6.GeoJsonLayer(this.getSubLayerProps({
+    const layer = new import_layers2.GeoJsonLayer(this.getSubLayerProps({
       id: "guides",
       data: guides,
       fp64: this.props.fp64,
@@ -4696,7 +3929,7 @@ var EditableGeoJsonLayer = class extends EditableLayer {
   createTooltipsLayers() {
     const mode = this.getActiveMode();
     const tooltips = mode.getTooltips(this.getModeProps(this.props));
-    const layer = new import_layers6.TextLayer({
+    const layer = new import_layers2.TextLayer({
       getSize: DEFAULT_TOOLTIP_FONT_SIZE,
       ...this.getSubLayerProps({
         id: "tooltips",
@@ -4762,7 +3995,7 @@ var defaultProps3 = {
   selectedIndexes: [],
   filled: false,
   stroked: true,
-  lineWidthScale: PROJECTED_PIXEL_SIZE_MULTIPLIER2,
+  lineWidthScale: PROJECTED_PIXEL_SIZE_MULTIPLIER,
   lineWidthMinPixels: 1,
   lineWidthMaxPixels: Number.MAX_SAFE_INTEGER,
   lineWidthUnits: "pixels",
@@ -4896,25 +4129,25 @@ __publicField(EditableH3ClusterLayer, "layerName", "EditableH3ClusterLayer");
 __publicField(EditableH3ClusterLayer, "defaultProps", defaultProps3);
 
 // dist/editable-layers/selection-layer.js
-var import_core4 = require("@deck.gl/core");
-var import_layers7 = require("@deck.gl/layers");
+var import_core2 = require("@deck.gl/core");
+var import_layers3 = require("@deck.gl/layers");
 var import_helpers16 = require("@turf/helpers");
-var import_buffer3 = __toESM(require("@turf/buffer"), 1);
-var import_difference4 = __toESM(require("@turf/difference"), 1);
-var SELECTION_TYPE2 = {
+var import_buffer2 = __toESM(require("@turf/buffer"), 1);
+var import_difference3 = __toESM(require("@turf/difference"), 1);
+var SELECTION_TYPE = {
   NONE: null,
   RECTANGLE: "rectangle",
   POLYGON: "polygon"
 };
 var MODE_MAP = {
-  [SELECTION_TYPE2.RECTANGLE]: DrawRectangleMode,
-  [SELECTION_TYPE2.POLYGON]: DrawPolygonMode
+  [SELECTION_TYPE.RECTANGLE]: DrawRectangleMode,
+  [SELECTION_TYPE.POLYGON]: DrawPolygonMode
 };
 var MODE_CONFIG_MAP = {
-  [SELECTION_TYPE2.RECTANGLE]: { dragToDraw: true }
+  [SELECTION_TYPE.RECTANGLE]: { dragToDraw: true }
 };
 var defaultProps4 = {
-  selectionType: SELECTION_TYPE2.RECTANGLE,
+  selectionType: SELECTION_TYPE.RECTANGLE,
   layerIds: [],
   onSelect: () => {
   }
@@ -4923,7 +4156,7 @@ var EMPTY_DATA = {
   type: "FeatureCollection",
   features: []
 };
-var EXPANSION_KM2 = 50;
+var EXPANSION_KM = 50;
 var LAYER_ID_GEOJSON = "selection-geojson";
 var LAYER_ID_BLOCKER = "selection-blocker";
 var PASS_THROUGH_PROPS = [
@@ -4948,7 +4181,7 @@ var PASS_THROUGH_PROPS = [
   "getTentativeFillColor",
   "getTentativeLineWidth"
 ];
-var SelectionLayer = class extends import_core4.CompositeLayer {
+var SelectionLayer = class extends import_core2.CompositeLayer {
   state = void 0;
   _selectRectangleObjects(coordinates) {
     const { layerIds, onSelect } = this.props;
@@ -4973,10 +4206,10 @@ var SelectionLayer = class extends import_core4.CompositeLayer {
     const maxX = Math.max(...allX);
     const maxY = Math.max(...allY);
     const landPointsPoly = (0, import_helpers16.polygon)(coordinates);
-    const bigBuffer = (0, import_buffer3.default)(landPointsPoly, EXPANSION_KM2);
+    const bigBuffer = (0, import_buffer2.default)(landPointsPoly, EXPANSION_KM);
     let bigPolygon;
     try {
-      bigPolygon = (0, import_difference4.default)(bigBuffer, landPointsPoly);
+      bigPolygon = (0, import_difference3.default)((0, import_helpers16.featureCollection)([bigBuffer, landPointsPoly]));
     } catch (e) {
       console.log("turfDifference() error", e);
       return;
@@ -5020,9 +4253,9 @@ var SelectionLayer = class extends import_core4.CompositeLayer {
         onEdit: ({ updatedData, editType }) => {
           if (editType === "addFeature") {
             const { coordinates } = updatedData.features[0].geometry;
-            if (this.props.selectionType === SELECTION_TYPE2.RECTANGLE) {
+            if (this.props.selectionType === SELECTION_TYPE.RECTANGLE) {
               this._selectRectangleObjects(coordinates);
-            } else if (this.props.selectionType === SELECTION_TYPE2.POLYGON) {
+            } else if (this.props.selectionType === SELECTION_TYPE.POLYGON) {
               this._selectPolygonObjects(coordinates);
             }
           }
@@ -5032,7 +4265,7 @@ var SelectionLayer = class extends import_core4.CompositeLayer {
     ];
     if (pendingPolygonSelection) {
       const { bigPolygon } = pendingPolygonSelection;
-      layers.push(new import_layers7.PolygonLayer(this.getSubLayerProps({
+      layers.push(new import_layers3.PolygonLayer(this.getSubLayerProps({
         id: LAYER_ID_BLOCKER,
         pickable: true,
         stroked: false,
@@ -5053,16 +4286,16 @@ __publicField(SelectionLayer, "layerName", "SelectionLayer");
 __publicField(SelectionLayer, "defaultProps", defaultProps4);
 
 // dist/editable-layers/elevated-edit-handle-layer.js
-var import_core5 = require("@deck.gl/core");
-var import_layers8 = require("@deck.gl/layers");
+var import_core3 = require("@deck.gl/core");
+var import_layers4 = require("@deck.gl/layers");
 var defaultProps5 = {};
-var ElevatedEditHandleLayer = class extends import_core5.CompositeLayer {
+var ElevatedEditHandleLayer = class extends import_core3.CompositeLayer {
   renderLayers() {
-    const handles = new import_layers8.ScatterplotLayer(Object.assign({}, this.props, {
+    const handles = new import_layers4.ScatterplotLayer(Object.assign({}, this.props, {
       id: `${this.props.id}-ScatterplotLayer`,
       data: this.props.data
     }));
-    const lines = new import_layers8.LineLayer(Object.assign({}, this.props, {
+    const lines = new import_layers4.LineLayer(Object.assign({}, this.props, {
       id: `${this.props.id}-LineLayer`,
       data: this.props.data,
       pickable: false,
@@ -5080,7 +4313,7 @@ __publicField(ElevatedEditHandleLayer, "defaultProps", defaultProps5);
 // dist/widgets/edit-mode-tray-widget.js
 var import_jsx_runtime = require("preact/jsx-runtime");
 var import_preact = require("preact");
-var import_core6 = require("@deck.gl/core");
+var import_core4 = require("@deck.gl/core");
 var ROOT_STYLE = {
   position: "absolute",
   display: "flex",
@@ -5124,7 +4357,7 @@ var BUTTON_LABEL_STYLE = {
   marginTop: "2px",
   lineHeight: "12px"
 };
-var _EditModeTrayWidget = class extends import_core6.Widget {
+var _EditModeTrayWidget = class extends import_core4.Widget {
   placement = "top-left";
   className = "deck-widget-edit-mode-tray";
   layout = "vertical";
@@ -5288,6 +4521,7 @@ var _EditModeTrayWidget = class extends import_core6.Widget {
 var EditModeTrayWidget = _EditModeTrayWidget;
 __publicField(EditModeTrayWidget, "defaultProps", {
   id: "edit-mode-tray",
+  _container: null,
   placement: "top-left",
   layout: "vertical",
   modes: [],
@@ -5295,11 +4529,223 @@ __publicField(EditModeTrayWidget, "defaultProps", {
   className: ""
 });
 
+// dist/widgets/editor-toolbar-widget.js
+var import_jsx_runtime2 = require("preact/jsx-runtime");
+var import_preact2 = require("preact");
+var import_core5 = require("@deck.gl/core");
+var ROOT_STYLE2 = {
+  position: "absolute",
+  display: "flex",
+  flexDirection: "column",
+  gap: "6px",
+  pointerEvents: "auto",
+  userSelect: "none",
+  zIndex: "99"
+};
+var TRAY_STYLE = {
+  display: "flex",
+  gap: "4px",
+  background: "rgba(36, 40, 41, 0.88)",
+  borderRadius: "999px",
+  padding: "5px 8px",
+  alignItems: "center",
+  justifyContent: "center",
+  boxShadow: "0 4px 12px rgba(0, 0, 0, 0.25)"
+};
+var BUTTON_STYLE = {
+  appearance: "none",
+  background: "transparent",
+  border: "none",
+  color: "#f0f0f0",
+  height: "30px",
+  padding: "0 8px",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  gap: "4px",
+  borderRadius: "15px",
+  cursor: "pointer",
+  fontSize: "11px",
+  fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+  fontWeight: "500",
+  transition: "background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease",
+  whiteSpace: "nowrap"
+};
+var BUTTON_ACTIVE_STYLE2 = {
+  background: "#0071e3",
+  color: "#ffffff",
+  boxShadow: "0 0 0 2px rgba(255, 255, 255, 0.35)"
+};
+var DIVIDER_STYLE = {
+  width: "1px",
+  height: "20px",
+  background: "rgba(255, 255, 255, 0.2)",
+  margin: "0 2px",
+  flexShrink: "0"
+};
+var BADGE_STYLE = {
+  color: "rgba(255, 255, 255, 0.6)",
+  fontSize: "11px",
+  padding: "0 6px",
+  fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+  whiteSpace: "nowrap"
+};
+function PencilIcon() {
+  return (0, import_jsx_runtime2.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: (0, import_jsx_runtime2.jsx)("path", { d: "M10 1.5l2.5 2.5L4.5 12H2v-2.5z" }) });
+}
+function SubtractIcon() {
+  return (0, import_jsx_runtime2.jsxs)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.1", children: [(0, import_jsx_runtime2.jsx)("rect", { x: "1", y: "1", width: "8", height: "8", rx: "1.5" }), (0, import_jsx_runtime2.jsx)("rect", { x: "5", y: "5", width: "8", height: "8", rx: "1.5", fill: "rgba(36,40,41,0.88)" })] });
+}
+function UnionIcon() {
+  return (0, import_jsx_runtime2.jsxs)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.1", children: [(0, import_jsx_runtime2.jsx)("rect", { x: "1", y: "1", width: "8", height: "8", rx: "1.5" }), (0, import_jsx_runtime2.jsx)("rect", { x: "5", y: "5", width: "8", height: "8", rx: "1.5" })] });
+}
+function IntersectIcon() {
+  return (0, import_jsx_runtime2.jsxs)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", strokeWidth: "1.1", children: [(0, import_jsx_runtime2.jsx)("rect", { x: "1", y: "1", width: "8", height: "8", rx: "1.5", stroke: "currentColor", opacity: "0.4" }), (0, import_jsx_runtime2.jsx)("rect", { x: "5", y: "5", width: "8", height: "8", rx: "1.5", stroke: "currentColor", opacity: "0.4" }), (0, import_jsx_runtime2.jsx)("rect", { x: "5", y: "5", width: "4", height: "4", fill: "currentColor", opacity: "0.6" })] });
+}
+function TrashIcon() {
+  return (0, import_jsx_runtime2.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.3", strokeLinecap: "round", strokeLinejoin: "round", children: (0, import_jsx_runtime2.jsx)("path", { d: "M2.5 4h9M5.5 4V2.5h3V4M3.5 4l.5 8h6l.5-8" }) });
+}
+function DownloadIcon() {
+  return (0, import_jsx_runtime2.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", stroke: "currentColor", strokeWidth: "1.3", strokeLinecap: "round", strokeLinejoin: "round", children: (0, import_jsx_runtime2.jsx)("path", { d: "M7 2v7M4.5 6.5L7 9l2.5-2.5M2.5 11.5h9" }) });
+}
+var BOOLEAN_OPS = [
+  { op: null, icon: PencilIcon, label: "Edit", title: "Draw new features" },
+  { op: "difference", icon: SubtractIcon, label: "Sub", title: "Subtract from selection" },
+  { op: "union", icon: UnionIcon, label: "Union", title: "Union with selection" },
+  { op: "intersection", icon: IntersectIcon, label: "Sect", title: "Intersect with selection" }
+];
+var _EditorToolbarWidget = class extends import_core5.Widget {
+  placement = "bottom-left";
+  className = "deck-widget-editor-toolbar";
+  deck = null;
+  appliedCustomClassName = null;
+  constructor(props = {}) {
+    super({ ..._EditorToolbarWidget.defaultProps, ...props });
+    this.placement = props.placement ?? _EditorToolbarWidget.defaultProps.placement;
+  }
+  setProps(props) {
+    if (props.placement !== void 0) {
+      this.placement = props.placement;
+    }
+    super.setProps(props);
+    this.renderToolbar();
+  }
+  onAdd({ deck }) {
+    this.deck = deck;
+  }
+  onRemove() {
+    this.deck = null;
+    const root = this.rootElement;
+    if (root) {
+      (0, import_preact2.render)(null, root);
+    }
+    this.rootElement = null;
+  }
+  onRenderHTML(rootElement) {
+    const style = { ...ROOT_STYLE2, ...this.props.style };
+    Object.assign(rootElement.style, style);
+    if (this.appliedCustomClassName && this.appliedCustomClassName !== this.props.className) {
+      rootElement.classList.remove(this.appliedCustomClassName);
+      this.appliedCustomClassName = null;
+    }
+    if (this.props.className) {
+      rootElement.classList.add(this.props.className);
+      this.appliedCustomClassName = this.props.className;
+    }
+    rootElement.classList.add(this.className);
+    this.renderToolbar();
+  }
+  renderToolbar() {
+    const root = this.rootElement;
+    if (!root) {
+      return;
+    }
+    const booleanOp = this.props.booleanOperation ?? null;
+    const featureCount = this.props.featureCount ?? 0;
+    const stopEvent = (event) => {
+      event.stopPropagation();
+      if (typeof event.stopImmediatePropagation === "function") {
+        event.stopImmediatePropagation();
+      }
+    };
+    const ui = (0, import_jsx_runtime2.jsxs)("div", { style: TRAY_STYLE, onPointerDown: stopEvent, onPointerMove: stopEvent, onPointerUp: stopEvent, onMouseDown: stopEvent, onMouseMove: stopEvent, onMouseUp: stopEvent, onTouchStart: stopEvent, onTouchMove: stopEvent, onTouchEnd: stopEvent, children: [BOOLEAN_OPS.map(({ op, icon: Icon, label, title }) => {
+      const active = booleanOp === op;
+      return (0, import_jsx_runtime2.jsxs)("button", { type: "button", title, "aria-pressed": active, style: { ...BUTTON_STYLE, ...active ? BUTTON_ACTIVE_STYLE2 : {} }, onClick: (event) => {
+        var _a, _b;
+        stopEvent(event);
+        (_b = (_a = this.props).onSetBooleanOperation) == null ? void 0 : _b.call(_a, op);
+      }, children: [(0, import_jsx_runtime2.jsx)(Icon, {}), (0, import_jsx_runtime2.jsx)("span", { children: label })] }, label);
+    }), (0, import_jsx_runtime2.jsx)("div", { style: DIVIDER_STYLE }), (0, import_jsx_runtime2.jsx)("button", { type: "button", title: "Clear all features", style: BUTTON_STYLE, onClick: (event) => {
+      var _a, _b;
+      stopEvent(event);
+      (_b = (_a = this.props).onClear) == null ? void 0 : _b.call(_a);
+    }, children: (0, import_jsx_runtime2.jsx)(TrashIcon, {}) }), (0, import_jsx_runtime2.jsx)("button", { type: "button", title: "Download as GeoJSON", style: BUTTON_STYLE, onClick: (event) => {
+      var _a, _b;
+      stopEvent(event);
+      (_b = (_a = this.props).onExport) == null ? void 0 : _b.call(_a);
+    }, children: (0, import_jsx_runtime2.jsx)(DownloadIcon, {}) }), (0, import_jsx_runtime2.jsx)("div", { style: DIVIDER_STYLE }), (0, import_jsx_runtime2.jsxs)("span", { style: BADGE_STYLE, children: [featureCount, " feature", featureCount !== 1 ? "s" : ""] })] });
+    (0, import_preact2.render)(ui, root);
+  }
+};
+var EditorToolbarWidget = _EditorToolbarWidget;
+__publicField(EditorToolbarWidget, "defaultProps", {
+  id: "editor-toolbar",
+  _container: null,
+  placement: "bottom-left",
+  booleanOperation: null,
+  featureCount: 0,
+  style: {},
+  className: ""
+});
+
+// dist/editable-layers/junction-scatterplot-layer.js
+var import_core6 = require("@deck.gl/core");
+var import_layers5 = require("@deck.gl/layers");
+var JunctionScatterplotLayer = class extends import_core6.CompositeLayer {
+  renderLayers() {
+    const { id, getFillColor, getStrokeColor, getInnerRadius, updateTriggers } = this.props;
+    return [
+      // the full circles
+      new import_layers5.ScatterplotLayer({
+        ...this.props,
+        id: `${id}-full`,
+        data: this.props.data,
+        getLineColor: getStrokeColor,
+        updateTriggers: {
+          ...updateTriggers,
+          getStrokeColor: updateTriggers.getStrokeColor
+        }
+      }),
+      // the inner part
+      new import_layers5.ScatterplotLayer({
+        ...this.props,
+        id: `${id}-inner`,
+        data: this.props.data,
+        getFillColor,
+        getRadius: getInnerRadius,
+        pickable: false,
+        updateTriggers: {
+          ...updateTriggers,
+          getFillColor: updateTriggers.getFillColor,
+          getRadius: updateTriggers.getInnerRadius
+        }
+      })
+    ];
+  }
+};
+__publicField(JunctionScatterplotLayer, "layerName", "JunctionScatterplotLayer");
+__publicField(JunctionScatterplotLayer, "defaultProps", {
+  ...import_layers5.ScatterplotLayer.defaultProps,
+  getFillColor: (d) => [0, 0, 0, 255],
+  getStrokeColor: (d) => [255, 255, 255, 255],
+  getInnerRadius: (d) => 1
+});
+
 // dist/edit-modes/resize-circle-mode.js
 var import_nearest_point_on_line2 = __toESM(require("@turf/nearest-point-on-line"), 1);
 var import_helpers17 = require("@turf/helpers");
 var import_circle3 = __toESM(require("@turf/circle"), 1);
-var import_distance14 = __toESM(require("@turf/distance"), 1);
+var import_distance13 = __toESM(require("@turf/distance"), 1);
 var import_center2 = __toESM(require("@turf/center"), 1);
 var ResizeCircleMode = class extends GeoJsonEditMode {
   _selectedEditHandle;
@@ -5319,12 +4765,7 @@ var ResizeCircleMode = class extends GeoJsonEditMode {
         const referencePoint = (0, import_helpers17.point)(mapCoords2);
         recursivelyTraverseNestedArrays2(featureAsPick.object.geometry.coordinates, [], (lineString3, prefix) => {
           const lineStringFeature = (0, import_helpers17.lineString)(lineString3);
-          const candidateIntermediatePoint = this.getNearestPoint(
-            // @ts-expect-error turf types too wide
-            lineStringFeature,
-            referencePoint,
-            props.modeConfig && props.modeConfig.viewport
-          );
+          const candidateIntermediatePoint = this.getNearestPoint(lineStringFeature, referencePoint, props.modeConfig && props.modeConfig.viewport);
           if (!intermediatePoint || candidateIntermediatePoint.properties.dist < intermediatePoint.properties.dist) {
             intermediatePoint = candidateIntermediatePoint;
             positionIndexPrefix = prefix;
@@ -5372,7 +4813,7 @@ var ResizeCircleMode = class extends GeoJsonEditMode {
       const feature = this.getSelectedFeature(props);
       const center = (0, import_center2.default)(feature).geometry.coordinates;
       const numberOfSteps = Object.entries(feature.geometry.coordinates[0]).length - 1;
-      const radius = Math.max((0, import_distance14.default)(center, event.mapCoords), 1e-3);
+      const radius = Math.max((0, import_distance13.default)(center, event.mapCoords), 1e-3);
       const { steps = numberOfSteps } = {};
       const options = { steps };
       const updatedFeature = (0, import_circle3.default)(center, radius, options);
@@ -5488,7 +4929,7 @@ var ExtendLineStringMode = class extends GeoJsonEditMode {
 };
 
 // dist/edit-modes/measure-distance-mode.js
-var import_distance15 = __toESM(require("@turf/distance"), 1);
+var import_distance14 = __toESM(require("@turf/distance"), 1);
 var import_midpoint = __toESM(require("@turf/midpoint"), 1);
 var MeasureDistanceMode = class extends GeoJsonEditMode {
   _isMeasuringSessionFinished = false;
@@ -5496,7 +4937,7 @@ var MeasureDistanceMode = class extends GeoJsonEditMode {
   _currentDistance = 0;
   _calculateDistanceForTooltip = ({ positionA, positionB, modeConfig }) => {
     const { turfOptions, measurementCallback } = modeConfig || {};
-    const distance7 = (0, import_distance15.default)(positionA, positionB, turfOptions);
+    const distance7 = (0, import_distance14.default)(positionA, positionB, turfOptions);
     if (measurementCallback) {
       measurementCallback(distance7);
     }