@emuanalytics/flow-rdf-core 4.0.3 → 4.0.5

package/dist/lib/map/plugins/index.mjs

@@ -1,1811 +1,11 @@
-import { M as MapEvent, a as assert, b as MapFeatureStream, F as FlowError, c as FlowMapError, d as MapDataSource, e as MapLayer, R as ReactiveExpression } from '../../../shared/flow-rdf-core.65045caf.mjs';
-export { P as PluginManager } from '../../../shared/flow-rdf-core.65045caf.mjs';
-import MapboxDraw from '@emuanalytics/mapbox-gl-draw';
-import turfArea from '@turf/area';
-import turfBBox from '@turf/bbox';
-import turfBooleanEqual from '@turf/boolean-equal';
-import turfBuffer from '@turf/buffer';
-import turfLength from '@turf/length';
-import Debug from 'debug';
-import { c as isPolygon, i as isLineString, b as isPoint } from '../../../shared/flow-rdf-core.1f0901c5.mjs';
-import { d as isDefined, j as isArray, g as isStringFull, x as isFunction, f as isString, e as ensureArray, o as isNumber, A as randomId, z as isURL, k as isArrayFull, b as isNil, a as isNull, m as isObject } from '../../../shared/flow-rdf-core.25e5f6d7.mjs';
-import EventEmitter$1, { EventEmitter } from 'eventemitter3';
-import maplibre from '@emuanalytics/maplibre-gl';
-import * as lit from 'lit-html';
-import turfCircle from '@turf/circle';
-import turfDistance from '@turf/distance';
-import { point } from '@turf/helpers';
-import { autorun, toJS } from 'mobx';
-import saveAs from 'file-saver';
-// import '@emuanalytics/maplibre-gl-style-spec';
-// import 'mobx-utils';
-import 'parsimmon';
-import 'colorbrewer';
-import '@turf/invariant';
-// import 'nanoid';
-
-var __defProp$c = Object.defineProperty;
-var __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$c(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$c = (obj, key, value) => {
-  __defNormalProp$c(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-class AnnotationEvent extends MapEvent {
-  constructor(type, map, data) {
-    super(type, map);
-    __publicField$c(this, "mode");
-    __publicField$c(this, "canUndo");
-    __publicField$c(this, "canRedo");
-    __publicField$c(this, "activeFeatureId");
-    __publicField$c(this, "activeFeatureType");
-    __publicField$c(this, "features");
-    this.mode = data.mode;
-    this.canUndo = data.canUndo;
-    this.canRedo = data.canRedo;
-    this.activeFeatureId = data.activeFeatureId;
-    this.activeFeatureType = data.activeFeatureType;
-    this.features = data.features;
-  }
-}
-
-var __defProp$b = Object.defineProperty;
-var __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$b(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$b = (obj, key, value) => {
-  __defNormalProp$b(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-class MapPluginBase extends EventEmitter {
-  constructor(pluginManager, options) {
-    super();
-    __publicField$b(this, "_pluginManager");
-    __publicField$b(this, "options");
-    this._pluginManager = pluginManager;
-    this.options = options ?? {};
-  }
-  get map() {
-    return this._pluginManager.map;
-  }
-  get pluginManager() {
-    return this._pluginManager;
-  }
-}
-
-function isFeatureWithId(f) {
-  return isDefined(f) && isDefined(f.source) && isDefined(f.id);
-}
-
-var __defProp$a = Object.defineProperty;
-var __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$a(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$a = (obj, key, value) => {
-  __defNormalProp$a(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-Debug("flow:map-popup");
-class MapPopup extends EventEmitter$1 {
-  /**
-   * Constructs a new `MapPopup` instance.
-   *
-   * This is called by the `FlowMap::openPopup` method.
-   *
-   * @param map Parent Flo.w map.
-   * @param options Popup options.
-   */
-  constructor(map, options) {
-    super();
-    this.map = map;
-    this.options = options;
-    __publicField$a(this, "_feature");
-    __publicField$a(this, "_contentContainer");
-    __publicField$a(this, "_featureStream", null);
-    //private _featureStreamSubscription: ISubscription | null = null;
-    __publicField$a(this, "_maplibrePopup", null);
-    __publicField$a(this, "_featureStreamDisposer");
-    this.options = {
-      // Defaults
-      closeButton: true,
-      closeOnClick: false,
-      closeOnMove: false,
-      maxWidth: "300px",
-      trackFeature: true,
-      //
-      ...this.options
-    };
-  }
-  get feature() {
-    return this._feature;
-  }
-  /**
-   * Close the popup.
-   */
-  close() {
-    if (this._maplibrePopup) {
-      this._maplibrePopup.remove();
-      this._maplibrePopup = null;
-    }
-  }
-  /**
-   * Move the popup to a new location.
-   *
-   * @param lngLat New location.
-   */
-  moveTo(lngLat) {
-    this._maplibrePopup.setLngLat(lngLat);
-  }
-  open(eventOrLngLat, feature) {
-    if (this._maplibrePopup) {
-      return;
-    }
-    if (!isArray(eventOrLngLat)) {
-      if (isFeatureWithId(eventOrLngLat.features[0])) {
-        feature = eventOrLngLat.features[0];
-      }
-      eventOrLngLat = eventOrLngLat.lngLat;
-    }
-    if (feature) {
-      assert(isFeatureWithId(feature), "MapPopup.open(): feature must have unique ID");
-    }
-    this._maplibrePopup = new maplibre.Popup({
-      className: this.cssClasses().join(" "),
-      closeButton: this.options.closeButton,
-      closeOnClick: this.options.closeOnClick,
-      closeOnMove: this.options.closeOnMove,
-      maxWidth: this.options.maxWidth
-    });
-    this._maplibrePopup.once("close", this.popupCloseHandler.bind(this));
-    this._contentContainer = document.createElement("div");
-    this._contentContainer.classList.add("flow-map-popup-content");
-    this._maplibrePopup.setDOMContent(this._contentContainer);
-    this._maplibrePopup.addTo(this.map.maplibreMap);
-    if (feature) {
-      this._feature = feature;
-      this._featureStream = new MapFeatureStream({
-        map: this.map,
-        source: feature.source,
-        sourceLayer: feature.sourceLayer,
-        featureIds: [feature.id]
-      });
-      this._featureStreamDisposer = this.map.context.state.autorun(() => {
-        const data = this._featureStream?.featureData;
-        if (data) {
-          this.handleFeatureUpdate(data[feature.id]);
-        }
-      });
-    } else {
-      this.moveTo(eventOrLngLat);
-      this.renderContent(null);
-    }
-  }
-  cssClasses() {
-    const classes = ["flow-map-popup"];
-    if (isStringFull(this.options.class)) {
-      classes.push(this.options.class);
-    }
-    if (this.options.closeButton) {
-      classes.push("flow-map-popup--with-close");
-    }
-    return classes;
-  }
-  handleFeatureUpdate(feature) {
-    if (!feature) {
-      this.close();
-      return;
-    }
-    if (this.options.trackFeature) {
-      switch (feature.geometry.type) {
-        case "Point":
-          this.moveTo(feature.geometry.coordinates);
-          break;
-        case "MultiPoint":
-          this.moveTo(feature.geometry.coordinates[0]);
-          break;
-      }
-    }
-    this.renderContent(feature);
-  }
-  popupCloseHandler() {
-    if (this._featureStreamDisposer) {
-      this._featureStreamDisposer();
-      this._featureStreamDisposer = void 0;
-    }
-    this.emit("closed", this);
-    this.removeAllListeners();
-  }
-  renderContent(feature) {
-    const state = this.map.context.state;
-    const content = isFunction(this.options.content) ? this.options.content(feature, state) : this.options.content;
-    if (isString(content)) {
-      this._contentContainer.innerHTML = content;
-    } else if (content instanceof Node) {
-      this._contentContainer.innerHTML = "";
-      this._contentContainer.appendChild(content);
-    } else {
-      lit.render(content, this._contentContainer);
-    }
-  }
-}
-
-var __defProp$9 = Object.defineProperty;
-var __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$9(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$9 = (obj, key, value) => {
-  __defNormalProp$9(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-class PopupPlugin extends MapPluginBase {
-  constructor(pluginManager) {
-    super(pluginManager);
-    __publicField$9(this, "_popupTemplates", /* @__PURE__ */ new Map());
-    __publicField$9(this, "_popups", /* @__PURE__ */ new Set());
-    __publicField$9(this, "name", "PopupPlugin");
-  }
-  registerPopup(id, options) {
-    this._popupTemplates.set(id, options);
-  }
-  openPopup(id, eventOrLngLat, feature) {
-    const popupOptions = this._popupTemplates.get(id);
-    if (!popupOptions) {
-      throw new FlowError(`MapPopup: no popup with id '${id}'`);
-    }
-    const popup = new MapPopup(this.map, popupOptions);
-    this._popups.add(popup);
-    popup.once("closed", () => {
-      this._popups.delete(popup);
-    });
-    if (isArray(eventOrLngLat)) {
-      popup.open(eventOrLngLat, feature);
-    } else {
-      popup.open(eventOrLngLat);
-    }
-    return popup;
-  }
-  closeAllPopups() {
-    this._popups.forEach((popup) => popup.close());
-    this._popups.clear();
-  }
-  closePopupsForSources(sources) {
-    sources = ensureArray(sources);
-    this._popups.forEach((popup) => {
-      if (popup.feature?.source && sources.indexOf(popup.feature?.source) >= 0) {
-        popup.close();
-        this._popups.delete(popup);
-      }
-    });
-  }
-}
-
-var __defProp$8 = Object.defineProperty;
-var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$8 = (obj, key, value) => {
-  __defNormalProp$8(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-class SelectionEvent extends MapEvent {
-  constructor(type, map, sourceIdentifier, features) {
-    super(type, map);
-    __publicField$8(this, "source");
-    __publicField$8(this, "sourceLayer");
-    __publicField$8(this, "features");
-    this.source = sourceIdentifier.source;
-    this.sourceLayer = sourceIdentifier.sourceLayer;
-    this.features = features;
-  }
-}
-
-var __defProp$7 = Object.defineProperty;
-var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$7 = (obj, key, value) => {
-  __defNormalProp$7(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-class SourceSelection {
-  constructor(plugin, source, options) {
-    __publicField$7(this, "_featureStream");
-    __publicField$7(this, "_map");
-    __publicField$7(this, "_options");
-    __publicField$7(this, "_plugin");
-    __publicField$7(this, "_popups", /* @__PURE__ */ new Map());
-    __publicField$7(this, "_selectedFeatureIds", /* @__PURE__ */ new Set());
-    __publicField$7(this, "_sourceId");
-    __publicField$7(this, "_stateSubscription", null);
-    this._plugin = plugin;
-    this._map = plugin.map;
-    this._options = options;
-    const sourceType = plugin.map.getSource(source).type;
-    this._sourceId = {
-      source,
-      sourceLayer: sourceType === "vector" ? options.sourceLayer ?? "geometry" : void 0
-    };
-    this._featureStream = this._map.featureStream({
-      source,
-      sourceLayer: options.sourceLayer,
-      featureIds: []
-    });
-    if (options.selectionState) {
-      this._stateSubscription = this._map.context.state.toStream(options.selectionState, true).subscribe((val) => {
-        val = new Set(ensureArray(val));
-        this.updateSelection(val);
-      });
-    }
-  }
-  get options() {
-    return this._options;
-  }
-  get selectedFeatureIds() {
-    return this._selectedFeatureIds;
-  }
-  get selectedFeatureStream() {
-    return this._featureStream;
-  }
-  destroy() {
-    this._popups.forEach((popup) => popup.close());
-    this._stateSubscription?.unsubscribe();
-    this._selectedFeatureIds = /* @__PURE__ */ new Set();
-    this.updateMapSelectionState();
-  }
-  handleClick(lngLat, feature, selectionOptions, multiSelect, enablePopups) {
-    if (this._options.mode === "none") {
-      return;
-    }
-    const selectedFeatureIDs = new Set(this._selectedFeatureIds);
-    let clearSelection = false;
-    let toggleFeature = false;
-    let showPopup = false;
-    if (feature && feature.source === this._sourceId.source) {
-      if (this._options.mode === "single") {
-        if (selectedFeatureIDs.has(feature.id)) {
-          toggleFeature = true;
-        } else {
-          clearSelection = true;
-          toggleFeature = true;
-        }
-      } else {
-        if (!multiSelect) {
-          clearSelection = true;
-        }
-        toggleFeature = true;
-      }
-    } else if (feature && feature.source !== this._sourceId.source) {
-      clearSelection = this._options.clear === "group" ? selectionOptions?.group === this._options.group : !!this._options.clear;
-    } else {
-      clearSelection = !multiSelect;
-    }
-    if (clearSelection) {
-      selectedFeatureIDs.clear();
-    }
-    if (toggleFeature) {
-      assert(isFeatureWithId(feature));
-      if (selectedFeatureIDs.has(feature.id) && multiSelect) {
-        selectedFeatureIDs.delete(feature.id);
-        if (this._popups.has(feature.id))
-          this._popups.get(feature.id).close();
-      } else {
-        selectedFeatureIDs.add(feature.id);
-        showPopup = true;
-      }
-    }
-    this.updateSelection(selectedFeatureIDs);
-    if (enablePopups && showPopup && this._options.popup) {
-      assert(isFeatureWithId(feature));
-      if (!this._popups.has(feature.id)) {
-        const popup = this._map.getPlugin(PopupPlugin).openPopup(this._options.popup, lngLat, feature);
-        if (popup) {
-          popup.on("closed", () => {
-            this._popups.delete(feature.id);
-          });
-          this._popups.set(feature.id, popup);
-        }
-      }
-    }
-  }
-  updateSelection(featureIds) {
-    if (!this.areSetsEqual(featureIds, this._selectedFeatureIds)) {
-      this._selectedFeatureIds = featureIds;
-      this.updateMapSelectionState();
-      this.updateStateStore();
-      this._featureStream.featureIds = Array.from(featureIds);
-      this._popups.forEach((popup) => {
-        assert(isFeatureWithId(popup.feature));
-        if (popup.feature.id && !featureIds.has(popup.feature.id)) {
-          popup.close();
-        }
-      });
-      const event = new SelectionEvent(
-        "selectionChanged",
-        this._map,
-        this._sourceId,
-        Array.from(this._selectedFeatureIds)
-      );
-      this._plugin.emit(event.type, event);
-    }
-  }
-  areSetsEqual(a, b) {
-    return a.size === b.size && [...a].every((value) => b.has(value));
-  }
-  updateMapSelectionState() {
-    this._map.removeFeatureState(this._sourceId, "selected", false);
-    this._selectedFeatureIds.forEach(
-      (id) => this._map.setFeatureState({ ...this._sourceId, id }, { selected: true }, false)
-    );
-  }
-  updateStateStore() {
-    if (isStringFull(this._options.selectionState)) {
-      const selectedIds = Array.from(this._selectedFeatureIds);
-      if (this._options.mode === "single") {
-        this._map.context.state.set(this._options.selectionState, selectedIds[0]);
-      } else if (this._options.mode === "multi") {
-        this._map.context.state.set(this._options.selectionState, selectedIds);
-      }
-    }
-  }
-}
-
-var __defProp$6 = Object.defineProperty;
-var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$6 = (obj, key, value) => {
-  __defNormalProp$6(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-class SelectionPlugin extends MapPluginBase {
-  constructor(pluginManager) {
-    super(pluginManager);
-    __publicField$6(this, "_sourceSelections", /* @__PURE__ */ new Map());
-    __publicField$6(this, "_enablePopups", true);
-    __publicField$6(this, "name", "SelectionPlugin");
-  }
-  clearSelection(source) {
-    const sourceSelection = this._sourceSelections.get(source);
-    if (!sourceSelection) {
-      return;
-    }
-    switch (sourceSelection.options.mode) {
-      case "single":
-      case "multi":
-        sourceSelection.updateSelection(/* @__PURE__ */ new Set());
-    }
-  }
-  deselectFeatures(source, features) {
-    const sourceSelection = this._sourceSelections.get(source);
-    if (!sourceSelection) {
-      return;
-    }
-    features = ensureArray(features);
-    const currentSelection = new Set(sourceSelection.selectedFeatureIds);
-    switch (sourceSelection.options.mode) {
-      case "single":
-      case "multi":
-        features.forEach((f) => currentSelection.delete(f));
-        sourceSelection.updateSelection(currentSelection);
-    }
-  }
-  destroy() {
-    this._sourceSelections.forEach((sel) => sel.destroy());
-    this._sourceSelections.clear();
-  }
-  disableSelection(source) {
-    if (this._sourceSelections.has(source)) {
-      this._sourceSelections.get(source).destroy();
-      this._sourceSelections.delete(source);
-    }
-  }
-  enableSelection(source, options) {
-    if (options.popup) {
-      try {
-        this.map.getPlugin(PopupPlugin);
-      } catch (e) {
-        throw new FlowMapError(`enableSelection(): Popup plugin is required for automatic selection popups`);
-      }
-    }
-    this.disableSelection(source);
-    this._sourceSelections.set(source, new SourceSelection(this, source, options));
-  }
-  handleBeforeSourceRemoved(event) {
-    if (this._sourceSelections.has(event.source)) {
-      this._sourceSelections.get(event.source)?.destroy();
-      this._sourceSelections.delete(event.source);
-    }
-  }
-  handleClick(event) {
-    const multiSelect = event.originalEvent.shiftKey || event.originalEvent.altKey || event.originalEvent.metaKey;
-    const clickedFeature = event.features[0];
-    const clickedSource = clickedFeature?.source;
-    const selectionOptions = this._sourceSelections.get(clickedSource)?.options;
-    this._sourceSelections.forEach(
-      (sel) => sel.handleClick(event.lngLat, clickedFeature, selectionOptions, multiSelect, this._enablePopups)
-    );
-  }
-  selectFeatures(source, features) {
-    const sourceSelection = this._sourceSelections.get(source);
-    if (!sourceSelection) {
-      return;
-    }
-    features = ensureArray(features);
-    if (features.length === 0) {
-      this.clearSelection(source);
-      return;
-    }
-    let currentSelection = new Set(sourceSelection.selectedFeatureIds);
-    switch (sourceSelection.options.mode) {
-      case "single":
-        currentSelection = /* @__PURE__ */ new Set([features[0]]);
-        sourceSelection.updateSelection(currentSelection);
-        break;
-      case "multi":
-        features.forEach((f) => currentSelection.add(f));
-        sourceSelection.updateSelection(currentSelection);
-        break;
-    }
-    if (sourceSelection.selectedFeatureIds.size && isStringFull(sourceSelection.options.group)) {
-      this._sourceSelections.forEach((s) => {
-        if (s != sourceSelection && s.options.clear === "group" && s.options.group == sourceSelection.options.group) {
-          s.updateSelection(/* @__PURE__ */ new Set());
-        }
-      });
-    }
-  }
-  selectedFeatureIds(source) {
-    const sourceSelection = this._sourceSelections.get(source);
-    if (!sourceSelection) {
-      return [];
-    }
-    return Array.from(sourceSelection.selectedFeatureIds);
-  }
-  selectedFeatureStream(source) {
-    const sourceSelection = this._sourceSelections.get(source);
-    if (!sourceSelection) {
-      throw new FlowMapError("no source selection");
-    }
-    return sourceSelection.selectedFeatureStream;
-  }
-  enablePopups(enabled = true) {
-    this._enablePopups = true;
-  }
-  disablePopups() {
-    if (this._enablePopups) {
-      this.map.getPlugin(PopupPlugin).closeAllPopups();
-      this._enablePopups = false;
-    }
-  }
-}
-
-function addAnnotationLayers(map) {
-  map.transaction(() => {
-    const annotationSource = new MapDataSource({
-      id: "map-annotations",
-      type: "geojson",
-      src: { type: "FeatureCollection", features: [] },
-      featureId: "id"
-    });
-    map.addSource(annotationSource);
-    const polygonFillLayer = new MapLayer({
-      id: "map-annotations-polygon-fill",
-      type: "fill",
-      source: annotationSource.id,
-      filter: `geometry-type() == 'Polygon' && coalesce(@visible, true)`,
-      style: `
-      fill-color: @fillColor;
-      `
-    });
-    map.addLayer(polygonFillLayer);
-    const polygonStrokeLayer = new MapLayer({
-      id: "map-annotations-polygon-stroke",
-      type: "line",
-      source: annotationSource.id,
-      filter: `geometry-type() == 'Polygon' && coalesce(@visible, true)`,
-      style: `
-    line-color: @strokeColor;
-    line-width: @strokeWidth;
-    `
-    });
-    map.addLayer(polygonStrokeLayer);
-    const lineStrokeLayer = new MapLayer({
-      id: "map-annotations-line-stroke",
-      type: "line",
-      source: annotationSource.id,
-      filter: `geometry-type() == 'LineString' && coalesce(@visible, true)`,
-      style: `
-    line-color: @strokeColor;
-    line-width: @strokeWidth;
-    `
-    });
-    map.addLayer(lineStrokeLayer);
-    const pointLayer = new MapLayer({
-      id: "map-annotations-point",
-      type: "circle",
-      source: annotationSource.id,
-      filter: `geometry-type() == 'Point' && coalesce(@visible, true)`,
-      style: `
-        circle-radius: @radius;
-        circle-color: @fillColor;
-        circle-stroke-color: @strokeColor;
-        circle-stroke-width: @strokeWidth;
-      `
-    });
-    map.addLayer(pointLayer);
-    const polygonLabelsLayer = new MapLayer({
-      id: "map-annotations-polygon-labels",
-      type: "symbol",
-      source: annotationSource.id,
-      filter: `geometry-type() == 'Polygon' && to-boolean(@labelText) && coalesce(@visible, true)`,
-      interactive: false,
-      style: `
-        symbol-placement: 'point';
-        text-field: @labelText;
-        text-color: @labelColor;
-        text-size: @labelSize;
-        text-anchor: @polygonLabelAnchor;
-        /* text-offset: @labelOffset; */
-        text-justify: @labelJustify;
-        text-max-width: @labelMaxWidth;
-        text-allow-overlap: true;
-      `
-    });
-    map.addLayer(polygonLabelsLayer);
-    const pointLabelsLayer = new MapLayer({
-      id: "map-annotations-point-labels",
-      type: "symbol",
-      source: annotationSource.id,
-      filter: `geometry-type() == 'Point' && to-boolean(@labelText) && coalesce(@visible, true)`,
-      interactive: false,
-      style: `
-        symbol-placement: 'point';
-        text-field: @labelText;
-        text-color: @labelColor;
-        text-size: @labelSize;
-        text-anchor: @labelAnchor;
-        text-offset: @labelOffset;
-        /* text-radial-offset: (@radius + 8) / coalesce(@labelSize, {{annotationsStyleDefaults.labelSize}}); */
-        text-justify: @labelJustify;
-        text-max-width: @labelMaxWidth;
-        text-allow-overlap: true;
-      `
-    });
-    map.addLayer(pointLabelsLayer);
-    const lineLabelsLayer = new MapLayer({
-      id: "map-annotations-line-labels",
-      type: "symbol",
-      source: annotationSource.id,
-      filter: `geometry-type() == 'LineString' && to-boolean(@labelText) && coalesce(@visible, true)`,
-      interactive: false,
-      style: `
-        symbol-placement: 'line-center';
-        text-field: @labelText;
-        text-color: @labelColor;
-        text-anchor: @labelAnchor;
-        text-size: @labelSize;
-        /* text-offset: @labelOffset; */
-        text-justify: @labelJustify;
-        text-max-width: @labelMaxWidth;
-        text-allow-overlap: true;
-        text-ignore-placement: true;
-    `
-    });
-    map.addLayer(lineLabelsLayer);
-    const polygonSelectionLayer = new MapLayer({
-      id: "map-annotations-polygon-selection",
-      type: "line",
-      source: annotationSource.id,
-      filter: `geometry-type() == 'Polygon' && coalesce(@visible, true)`,
-      interactive: false,
-      style: `
-        line-color: @@selected ? @selectionStrokeColor : @@hover ? @hoverStrokeColor : transparent;
-        line-width: @selectionWidth;
-        line-opacity: @selectionStrokeOpacity;
-      `
-    });
-    map.addLayer(polygonSelectionLayer);
-    const pointSelectionLayer = new MapLayer({
-      id: "map-annotations-point-selection",
-      type: "circle",
-      source: annotationSource.id,
-      filter: `geometry-type() == 'Point' && coalesce(@visible, true)`,
-      interactive: false,
-      style: `
-        circle-radius: @radius + 1;
-        circle-color: transparent;
-        circle-stroke-color: @@selected ? @selectionStrokeColor : @@hover ? @hoverStrokeColor : transparent;
-        circle-stroke-width: @selectionWidth;
-        circle-stroke-opacity: @selectionStrokeOpacity;
-      `
-    });
-    map.addLayer(pointSelectionLayer);
-    const lineSelectionLayer = new MapLayer({
-      id: "map-annotations-line-selection",
-      type: "line",
-      source: annotationSource.id,
-      filter: `geometry-type() == 'LineString' && coalesce(@visible, true)`,
-      interactive: false,
-      style: `
-        line-color: @@selected ? @selectionStrokeColor : @@hover ? @hoverStrokeColor : transparent;
-        line-opacity: @selectionStrokeOpacity;
-        line-width: @selectionWidth/2;
-        line-gap-width: @strokeWidth;
-      `
-    });
-    map.addLayer(lineSelectionLayer);
-  });
-  return map.getSource("map-annotations");
-}
-
-function createSupplementaryPointsForCircle(geojson) {
-  const { properties, geometry } = geojson;
-  if (properties.user_type !== "Circle")
-    return null;
-  const supplementaryPoints = [];
-  const vertices = geometry.coordinates[0].slice(0, -1);
-  for (let index = 0; index < vertices.length; index += Math.round(vertices.length / 4)) {
-    supplementaryPoints.push(MapboxDraw.lib.createVertex(properties.id, vertices[index], `0.${index}`, false));
-  }
-  return supplementaryPoints;
-}
-
-const DirectModeOverride = MapboxDraw.modes.direct_select;
-const moveFeatures = MapboxDraw.lib.moveFeatures;
-const constrainFeatureMovement = MapboxDraw.lib.constrainFeatureMovement;
-const createSupplementaryPoints = MapboxDraw.lib.createSupplementaryPoints;
-const Constants$1 = MapboxDraw.constants;
-DirectModeOverride.dragFeature = function(state, e, delta) {
-  moveFeatures(this.getSelected(), delta);
-  this.getSelected().filter((feature) => feature.properties.type === "Circle").map((circle) => circle.properties.circleCenter).forEach((center) => {
-    center[0] += delta.lng;
-    center[1] += delta.lat;
-  });
-  state.dragMoveLocation = e.lngLat;
-};
-DirectModeOverride.dragVertex = function(state, e, delta) {
-  if (state.feature.properties.type === "Circle") {
-    const center = state.feature.properties.circleCenter;
-    const movedVertex = [e.lngLat.lng, e.lngLat.lat];
-    const radius = turfDistance(point(center), point(movedVertex), { units: "kilometers" });
-    const circleFeature = turfCircle(center, radius);
-    state.feature.incomingCoords(circleFeature.geometry.coordinates);
-    state.feature.properties.circleRadius = radius;
-  } else {
-    const selectedCoords = state.selectedCoordPaths.map((coord_path) => state.feature.getCoordinate(coord_path));
-    const selectedCoordPoints = selectedCoords.map((coords) => ({
-      type: Constants$1.geojsonTypes.FEATURE,
-      properties: {},
-      geometry: {
-        type: Constants$1.geojsonTypes.POINT,
-        coordinates: coords
-      }
-    }));
-    const constrainedDelta = constrainFeatureMovement(selectedCoordPoints, delta);
-    for (let i = 0; i < selectedCoords.length; i++) {
-      const coord = selectedCoords[i];
-      state.feature.updateCoordinate(state.selectedCoordPaths[i], coord[0] + constrainedDelta.lng, coord[1] + constrainedDelta.lat);
-    }
-  }
-};
-DirectModeOverride.toDisplayFeatures = function(state, geojson, push) {
-  if (state.featureId === geojson.properties.id) {
-    geojson.properties.active = Constants$1.activeStates.ACTIVE;
-    push(geojson);
-    const supplementaryPoints = geojson.properties.user_type === "Circle" ? createSupplementaryPointsForCircle(geojson) : createSupplementaryPoints(geojson, {
-      map: this.map,
-      midpoints: true,
-      selectedPaths: state.selectedCoordPaths
-    });
-    supplementaryPoints.forEach(push);
-  } else {
-    geojson.properties.active = Constants$1.activeStates.INACTIVE;
-    push(geojson);
-  }
-  this.fireActionable(state);
-};
-const DirectMode = DirectModeOverride;
-
-const dragPan = {
-  enable(ctx) {
-    setTimeout(() => {
-      if (!ctx.map || !ctx.map.dragPan || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue)
-        return;
-      if (!ctx._ctx.store.getInitialConfigValue("dragPan"))
-        return;
-      ctx.map.dragPan.enable();
-    }, 0);
-  },
-  disable(ctx) {
-    setTimeout(() => {
-      if (!ctx.map || !ctx.map.doubleClickZoom)
-        return;
-      ctx.map.dragPan.disable();
-    }, 0);
-  }
-};
-
-const DragCircleMode = { ...MapboxDraw.modes.draw_polygon };
-const Constants = MapboxDraw.constants;
-DragCircleMode.onSetup = function(opts) {
-  const polygon = this.newFeature({
-    type: Constants.geojsonTypes.FEATURE,
-    properties: {
-      type: "Circle",
-      circleCenter: []
-    },
-    geometry: {
-      type: Constants.geojsonTypes.POLYGON,
-      coordinates: []
-    }
-  });
-  this.addFeature(polygon);
-  this.clearSelectedFeatures();
-  dragPan.disable(this);
-  this.updateUIClasses({ mouse: Constants.cursors.ADD });
-  this.activateUIButton(Constants.types.POLYGON);
-  this.setActionableState({
-    trash: true
-  });
-  return {
-    polygon,
-    currentVertexPosition: 0
-  };
-};
-DragCircleMode.onMouseDown = DragCircleMode.onTouchStart = function(state, e) {
-  const currentCenter = state.polygon.properties.circleCenter;
-  if (currentCenter.length === 0) {
-    state.polygon.properties.circleCenter = [e.lngLat.lng, e.lngLat.lat];
-  }
-};
-DragCircleMode.onDrag = DragCircleMode.onMouseMove = function(state, e) {
-  const center = state.polygon.properties.circleCenter;
-  if (center.length > 0) {
-    const distanceInKm = turfDistance(
-      point(center),
-      point([e.lngLat.lng, e.lngLat.lat]),
-      { units: "kilometers" }
-    );
-    const circleFeature = turfCircle(center, distanceInKm);
-    state.polygon.incomingCoords(circleFeature.geometry.coordinates);
-    state.polygon.properties.circleRadius = distanceInKm;
-  }
-};
-DragCircleMode.onMouseUp = DragCircleMode.onTouchEnd = function(state) {
-  dragPan.enable(this);
-  return this.changeMode(Constants.modes.SIMPLE_SELECT, { featureIds: [state.polygon.id] });
-};
-DragCircleMode.onClick = DragCircleMode.onTap = function(state) {
-  state.polygon.properties.circleCenter = [];
-};
-DragCircleMode.toDisplayFeatures = function(state, geojson, display) {
-  const isActivePolygon = geojson.properties.id === state.polygon.id;
-  geojson.properties.active = isActivePolygon ? Constants.activeStates.ACTIVE : Constants.activeStates.INACTIVE;
-  return display(geojson);
-};
-const DragCircleMode$1 = DragCircleMode;
-
-var __defProp$5 = Object.defineProperty;
-var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$5 = (obj, key, value) => {
-  __defNormalProp$5(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-Debug("flow:annotation-plugin");
-const _AnnotationPlugin = class _AnnotationPlugin extends MapPluginBase {
-  constructor(pluginManager, options) {
-    super(pluginManager, options);
-    __publicField$5(this, "name", "AnnotationPlugin");
-    // Feature data model
-    __publicField$5(this, "_features", /* @__PURE__ */ new Map());
-    __publicField$5(this, "_featureIds", []);
-    // Undo/redo stacks
-    __publicField$5(this, "_undoStack", []);
-    __publicField$5(this, "_redoStack", []);
-    // Editing state
-    __publicField$5(this, "_mode", "idle");
-    __publicField$5(this, "_activeFeatureId", null);
-    __publicField$5(this, "_activeFeatureType", null);
-    __publicField$5(this, "_onCommitCleanup", []);
-    __publicField$5(this, "_annotationDataSource");
-    __publicField$5(this, "_drawControl", null);
-    __publicField$5(this, "_removeKeyboardShortcuts", null);
-    this.options = { ..._AnnotationPlugin._defaultOptions, ...options };
-    this.options.defaultStyle = { ..._AnnotationPlugin._defaultOptions.defaultStyle, ...options?.defaultStyle };
-  }
-  initialize() {
-    this._annotationDataSource = addAnnotationLayers(this.map);
-    if (this.options.selectionOptions) {
-      this.map.getPlugin(SelectionPlugin).enableSelection(this._annotationDataSource.id, this.options.selectionOptions);
-    }
-    if (this.options.interactive) {
-      this._removeKeyboardShortcuts = this.pluginManager.addKeyboardShortcuts({
-        "Enter,Escape": () => {
-          this.commit();
-        },
-        "Delete,Backspace": () => this.deleteSelectedFeature(),
-        "Ctrl+KeyZ": () => {
-          this.undo();
-        },
-        "Ctrl+Shift+KeyZ": () => {
-          this.redo();
-        },
-        KeyP: () => this.createFeature("Polygon"),
-        KeyL: () => this.createFeature("LineString"),
-        KeyM: () => this.createFeature("Point"),
-        KeyC: () => this.createFeature("Circle")
-      });
-    }
-  }
-  destroy() {
-    if (this._removeKeyboardShortcuts)
-      this._removeKeyboardShortcuts();
-  }
-  clear() {
-    this.commit();
-    this._featureIds = [];
-    this._features = /* @__PURE__ */ new Map();
-    this._undoStack = [];
-    this._redoStack = [];
-    this._mode = "idle";
-    this._activeFeatureId = null;
-    this._activeFeatureType = null;
-    this.render();
-    return this;
-  }
-  undo() {
-    const operation = this._undoStack.pop();
-    if (operation) {
-      operation.undo();
-      this._redoStack.push(operation);
-      this.render();
-    }
-    return this;
-  }
-  /**
-   * Redo the last undone operation.
-   */
-  redo() {
-    const operation = this._redoStack.pop();
-    if (operation) {
-      operation.do();
-      this._undoStack.push(operation);
-      this.render();
-    }
-    return this;
-  }
-  getFeature(featureId) {
-    const feature = this._features.get(featureId);
-    if (!feature) {
-      throw new FlowError(`<AnnotationPlugin>: No feature with id '${featureId}'`);
-    }
-    return feature;
-  }
-  getFeatures() {
-    return this._featureIds.map((id) => this._features.get(id));
-  }
-  setFeatures(features) {
-    this.commit();
-    const normalizedFeatures = features.map((f) => this.applyDefaults(f));
-    const oldFeatures = this._features;
-    const oldFeatureIds = this._featureIds;
-    const operation = {
-      do: () => {
-        this._featureIds = normalizedFeatures.map((f) => f.id);
-        this._features = new Map(normalizedFeatures.map((f) => [f.id, f]));
-      },
-      undo: () => {
-        this._featureIds = oldFeatureIds;
-        this._features = oldFeatures;
-      }
-    };
-    this.performOperation(operation);
-    return this;
-  }
-  addFeature(feature) {
-    this.commit();
-    const fullFeature = this.applyDefaults(feature);
-    const operation = {
-      do: () => {
-        this._features.set(fullFeature.id, fullFeature);
-        this._featureIds.push(fullFeature.id);
-      },
-      undo: () => {
-        this._features.delete(fullFeature.id);
-        const index = this._featureIds.indexOf(fullFeature.id);
-        if (index !== -1) {
-          this._featureIds.splice(index, 1);
-        }
-      }
-    };
-    this.performOperation(operation);
-    return fullFeature;
-  }
-  deleteFeature(featureId) {
-    this.commit();
-    if (!featureId) {
-      return this;
-    }
-    this.deselectFeature(featureId);
-    const feature = this.getFeature(featureId);
-    const operation = {
-      do: () => {
-        this._features.delete(featureId);
-        const index = this._featureIds.indexOf(featureId);
-        if (index !== -1) {
-          this._featureIds.splice(index, 1);
-        }
-      },
-      undo: () => {
-        this._features.set(featureId, feature);
-        this._featureIds.push(featureId);
-      }
-    };
-    this.performOperation(operation);
-    return this;
-  }
-  createFeature(featureType) {
-    this.commit();
-    this.startDrawing();
-    this._drawControl.changeMode(this.drawModeForFeatureType(featureType));
-    this._mode = "creating";
-    this._activeFeatureId = null;
-    this._activeFeatureType = featureType;
-    this.emitStateChange();
-    const commitChanges = () => {
-      setTimeout(() => this.commit(), 0);
-    };
-    this.map.maplibreMap.once("draw.create", commitChanges);
-    this.map.maplibreMap.once("draw.modechange", commitChanges);
-    this._onCommitCleanup.push(() => {
-      this.map.maplibreMap.off("draw.create", commitChanges);
-      this.map.maplibreMap.off("draw.modechange", commitChanges);
-    });
-  }
-  editFeature(featureId) {
-    const feature = this.getFeature(featureId);
-    this._mode = "editing";
-    this._activeFeatureId = featureId;
-    this._activeFeatureType = feature.properties.type;
-    const commitChanges = () => {
-      setTimeout(() => this.commit(), 0);
-    };
-    this.startDrawing();
-    this._drawControl.add(feature);
-    this.setFeatureProperty(featureId, "visible", false);
-    this.render();
-    switch (this.editModeForFeature(feature)) {
-      case "direct_select":
-        this._drawControl.changeMode("direct_select", {
-          featureId
-        });
-        this.map.maplibreMap.once("draw.modechange", commitChanges);
-        this._onCommitCleanup.push(() => this.map.maplibreMap.off("draw.modechange", commitChanges));
-        break;
-      case "simple_select":
-        this._drawControl.changeMode("simple_select", {
-          featureIds: [featureId]
-        });
-        this.map.maplibreMap.once("draw.selectionchange", commitChanges);
-        this._onCommitCleanup.push(() => this.map.maplibreMap.off("draw.selectionchange", commitChanges));
-        break;
-    }
-  }
-  zoomToFeature(featureId, animationOptions) {
-    const feature = this.getFeature(featureId);
-    if (!feature)
-      return this;
-    const bbox = feature.properties.type === "Point" ? turfBBox(turfBuffer(feature, 50)) : turfBBox(feature);
-    this.map.setBounds(bbox, animationOptions);
-    return this;
-  }
-  setFeatureProperty(featureId, property, value) {
-    const feature = this.getFeature(featureId);
-    const featureCopy = {
-      ...feature,
-      properties: { ...feature.properties, [property]: value }
-    };
-    this._features.set(featureId, featureCopy);
-    return this;
-  }
-  setFeatureProperties(featureId, properties) {
-    const feature = this.getFeature(featureId);
-    const featureCopy = {
-      ...feature,
-      properties: { ...feature.properties, ...properties }
-    };
-    this._features.set(featureId, featureCopy);
-    return this;
-  }
-  commit() {
-    this._onCommitCleanup.forEach((f) => f());
-    this._onCommitCleanup = [];
-    if (this._mode === "idle")
-      return this;
-    const drawControlFeature = this._drawControl.getAll().features[0];
-    let operation = null;
-    if (this._mode === "editing") {
-      const mapFeature = this.getFeature(this._activeFeatureId);
-      this.setFeatureProperty(mapFeature.id, "visible", true);
-      if (!turfBooleanEqual(mapFeature.geometry, drawControlFeature.geometry)) {
-        operation = {
-          do: () => {
-            this.setFeatureGeometry(mapFeature.id, drawControlFeature.geometry);
-            if (drawControlFeature.properties.type === "Circle") {
-              this.setFeatureProperty(mapFeature.id, "center", drawControlFeature.properties.circleCenter);
-              this.setFeatureProperty(mapFeature.id, "radiusInKm", drawControlFeature.properties.circleRadius);
-            }
-          },
-          undo: () => {
-            this.setFeatureGeometry(mapFeature.id, mapFeature.geometry);
-            if (mapFeature.properties.type === "Circle") {
-              this.setFeatureProperty(mapFeature.id, "center", mapFeature.properties.circleCenter);
-              this.setFeatureProperty(mapFeature.id, "radiusInKm", mapFeature.properties.circleRadius);
-            }
-          }
-        };
-      }
-    } else if (this._mode === "creating") {
-      if (this.isValidGeometry(drawControlFeature)) {
-        let createdFeature = drawControlFeature;
-        createdFeature.id = "";
-        this.applyDefaults(createdFeature);
-        operation = {
-          do: () => {
-            this._features.set(drawControlFeature.id, drawControlFeature);
-            this._featureIds.push(drawControlFeature.id);
-            if (this.options.selectionOptions?.mode === "single" || this.options.selectionOptions?.mode === "multi") {
-              this.map.getPlugin(SelectionPlugin).selectFeatures(this._annotationDataSource.id, drawControlFeature.id);
-            }
-          },
-          undo: () => {
-            createdFeature = this._features.get(createdFeature.id);
-            this._features.delete(createdFeature.id);
-            const index = this._featureIds.indexOf(createdFeature.id);
-            if (index !== -1) {
-              this._featureIds.splice(index, 1);
-            }
-          }
-        };
-      }
-    }
-    if (operation) {
-      this.performOperation(operation);
-    }
-    this._mode = "idle";
-    this._activeFeatureId = null;
-    this._activeFeatureType = null;
-    this.endDrawing();
-    this.render();
-    return this;
-  }
-  cancel() {
-    this._onCommitCleanup.forEach((f) => f());
-    this._onCommitCleanup = [];
-    if (this._mode === "idle")
-      return this;
-    if (this._mode === "editing") {
-      this.setFeatureProperty(this._activeFeatureId, "visible", true);
-    }
-    this._activeFeatureId = null;
-    this._activeFeatureType = null;
-    this._mode = "idle";
-    this.endDrawing();
-    this.render();
-    return this;
-  }
-  render() {
-    const renderedFeatures = {
-      type: "FeatureCollection",
-      features: this._featureIds.map((id) => this._features.get(id))
-    };
-    this._annotationDataSource.setSrc(renderedFeatures);
-    this.emitStateChange();
-    return this;
-  }
-  handleDblClick(event) {
-    if (!this.options.interactive) {
-      return;
-    }
-    const clickedFeature = event.features[0];
-    if (clickedFeature && clickedFeature.source === this._annotationDataSource.id) {
-      this.editFeature(clickedFeature.id.toString());
-    }
-  }
-  handleBeforeStyleChanged(event) {
-    const { oldStyle, newStyle } = event;
-    if (this._drawControl) {
-      if (oldStyle.sources["mapbox-gl-draw"]) {
-        newStyle.sources["mapbox-gl-draw"] = oldStyle.sources["mapbox-gl-draw"];
-      }
-      oldStyle.layers.filter((l) => l.id.startsWith("gl-draw")).forEach((l) => newStyle.layers.push(l));
-    }
-    return newStyle;
-  }
-  startDrawing() {
-    if (this._drawControl) {
-      return this._drawControl;
-    }
-    this.pluginManager.setExclusivePlugin(this);
-    this._drawControl = new MapboxDraw({
-      displayControlsDefault: false,
-      keybindings: false,
-      modes: {
-        ...MapboxDraw.modes,
-        drag_circle: DragCircleMode$1,
-        direct_select: DirectMode
-        //...options.modes
-      },
-      userProperties: true
-    });
-    this.map.maplibreMap.addControl(this._drawControl);
-    return this._drawControl;
-  }
-  endDrawing() {
-    this.pluginManager.removeExclusivePlugin(this);
-    if (this._drawControl) {
-      this.map.maplibreMap.removeControl(this._drawControl);
-      this._drawControl = null;
-    }
-  }
-  applyDefaults(feature) {
-    feature.id = feature.properties.id = this.generateFeatureId(feature);
-    feature.properties = {
-      id: this.generateFeatureId(feature),
-      name: this.generateFeatureName(feature),
-      type: feature.properties.type ?? feature.geometry.type,
-      selected: false,
-      ...this.options.defaultStyle,
-      ...feature.properties
-    };
-    feature.id = feature.properties.id;
-    return feature;
-  }
-  generateFeatureId(feature) {
-    if (isNumber(feature.id) || isStringFull(feature.id)) {
-      return feature.id.toString();
-    } else {
-      return randomId("feature");
-    }
-  }
-  generateFeatureName(feature) {
-    const type = feature.properties.type ?? feature.geometry.type;
-    return `${type} ${this._featureIds.length}`;
-  }
-  performOperation(operation) {
-    this._undoStack.push(operation);
-    this._redoStack.length = 0;
-    operation.do();
-  }
-  deselectFeature(featureId) {
-    if (this.options.selectionOptions?.mode === "single" || this.options.selectionOptions?.mode === "multi") {
-      this.map.getPlugin(SelectionPlugin).deselectFeatures(this._annotationDataSource.id, featureId);
-    }
-  }
-  deleteSelectedFeature() {
-    if (this.options.selectionOptions?.mode === "single" || this.options.selectionOptions?.mode === "multi") {
-      const selected = this.map.getPlugin(SelectionPlugin).selectedFeatureIds(this._annotationDataSource.id);
-      selected.forEach((id) => this.deleteFeature(id));
-      this.render();
-    }
-  }
-  editModeForFeature(feature) {
-    switch (feature.geometry.type) {
-      case "Point":
-        return "simple_select";
-      default:
-        return "direct_select";
-    }
-  }
-  drawModeForFeatureType(featureType) {
-    switch (featureType) {
-      case "Polygon":
-        return "draw_polygon";
-      case "LineString":
-        return "draw_line_string";
-      case "Point":
-        return "draw_point";
-      case "Circle":
-        return "drag_circle";
-      default:
-        throw new Error(`Unrecognized feature type: ${featureType}`);
-    }
-  }
-  setFeatureGeometry(featureId, geometry) {
-    const feature = this.getFeature(featureId);
-    const featureCopy = {
-      ...feature,
-      geometry
-    };
-    this._features.set(featureId, featureCopy);
-    return featureCopy;
-  }
-  isValidGeometry(feature) {
-    if (isPolygon(feature)) {
-      return feature.geometry.coordinates[0][0] !== null && feature.geometry.coordinates[0].length > 3 && turfArea(feature) > 0;
-    } else if (isLineString(feature)) {
-      return feature.geometry.coordinates.length > 1 && turfLength(feature) > 0;
-    } else if (isPoint(feature)) {
-      return feature.geometry.coordinates.length > 0;
-    }
-    return false;
-  }
-  emitStateChange() {
-    const eventData = {
-      mode: this._mode,
-      canUndo: this._undoStack.length > 0,
-      canRedo: this._redoStack.length > 0,
-      activeFeatureId: this._activeFeatureId,
-      activeFeatureType: this._activeFeatureType,
-      features: this._featureIds.map((id) => this._features.get(id))
-    };
-    this.emit("annotationStateChanged", new AnnotationEvent("annotationStateChanged", this.map, eventData));
-  }
-};
-__publicField$5(_AnnotationPlugin, "_defaultOptions", {
-  interactive: true,
-  defaultStyle: {
-    labelSize: 10,
-    labelColor: "#ffffff",
-    labelMaxWidth: 10,
-    labelOffset: [0, 0.5],
-    labelJustify: "auto",
-    labelAnchor: "top",
-    polygonLabelAnchor: "center",
-    radius: 5,
-    fillColor: "rgba(204,204,204,0.65)",
-    strokeWidth: 1,
-    strokeColor: "#ffffff",
-    selectionStrokeColor: "orange",
-    selectionStrokeOpacity: 0.5,
-    selectionWidth: 3,
-    hoverStrokeColor: "transparent"
-  }
-});
-let AnnotationPlugin = _AnnotationPlugin;
-
-var __defProp$4 = Object.defineProperty;
-var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$4 = (obj, key, value) => {
-  __defNormalProp$4(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-const debug$1 = Debug("flow:data-join-map-plugin");
-const _DataJoin = class _DataJoin {
-  constructor(id, map, options) {
-    this.id = id;
-    this.map = map;
-    __publicField$4(this, "autorunDisposer", null);
-    __publicField$4(this, "dataExpression", null);
-    __publicField$4(this, "options");
-    __publicField$4(this, "parameterExpressions", {});
-    this.options = {
-      ..._DataJoin.defaultOptions,
-      ...options
-    };
-  }
-  get source() {
-    return this.options.source;
-  }
-  start() {
-    this.stop();
-    if (isString(this.options.data)) {
-      if (isURL(this.options.data))
-        this.options.data = `'${this.options.data}'`;
-      this.dataExpression = new ReactiveExpression(this.options.data);
-      this.dataExpression.bindState(this.map.context.state);
-    } else {
-      this.dataExpression = null;
-    }
-    if (isArrayFull(this.options.parameters)) {
-      this.parameterExpressions = this.options.parameters.reduce((accum, param) => {
-        const expr = new ReactiveExpression(param.value.toString());
-        expr.bindState(this.map.context.state);
-        accum[param.name] = expr;
-        return accum;
-      }, {});
-    }
-    this.autorunDisposer = autorun(
-      async () => {
-        let data = this.dataExpression ? toJS(this.dataExpression.value) : this.options.data;
-        const missingParams = this.options.parameters.map((p) => p.required && isNil(this.parameterExpressions[p.name].value) ? p.name : void 0).filter((p) => !!p);
-        if (isNull(data)) {
-          debug$1(`FlowMap<${this.map.id}>: Skipping data join '${this.id}' (null data)`);
-          return;
-        }
-        if (missingParams.length) {
-          debug$1(
-            `FlowMap<${this.map.id}>: Skipping data join '${this.id}' (null required parameters: ${missingParams.join(
-              ", "
-            )})`
-          );
-          return;
-        }
-        debug$1(`FlowMap<${this.map.id}>: Performing data join '${this.id}'`);
-        if (isString(data)) {
-          try {
-            data = await this.loadData(data);
-          } catch (e) {
-            this.map.emitError(`Failed to load data for data join '${this.id}' - ${e.message}`, e);
-            data = [];
-          }
-        }
-        this.doDataJoin(data);
-      },
-      { name: `FlowDataJoin.${this.map.id}.${this.id})` }
-    );
-  }
-  stop() {
-    if (this.autorunDisposer) {
-      this.autorunDisposer();
-      this.autorunDisposer = null;
-    }
-  }
-  doDataJoin(data) {
-    const source = this.map.getSource(this.options.source);
-    const sourceLayer = source.type === "vector" ? this.options.sourceLayer || "geometry" : void 0;
-    if (this.options.clear) {
-      this.map.removeFeatureState({ source: source.id, sourceLayer }, this.id);
-    }
-    const featureData = data.reduce((accum, d) => {
-      accum[d[this.options.foreignKey]] = { [this.id]: d };
-      return accum;
-    }, {});
-    this.map.setFeatureStateBulk({ source: source.id, sourceLayer }, featureData);
-  }
-  loadData(datasetOrUrl) {
-    if (isURL(datasetOrUrl)) {
-      const url = new URL(datasetOrUrl);
-      const params = new URLSearchParams(url.searchParams);
-      if (isArrayFull(this.options.parameters)) {
-        this.options.parameters.forEach((p) => {
-          params.append(p.name, this.parameterExpressions[p.name].value);
-        });
-      }
-      url.search = params.toString();
-      const headers = new Headers({ Accept: "application/json" });
-      const request = new Request(url.toString(), {
-        method: "GET",
-        mode: "cors",
-        headers,
-        cache: "default"
-      });
-      return fetch(request).then((response) => {
-        if (!response.ok) {
-          throw new Error(`status=${response.status} ${response.statusText}`);
-        }
-        return response.json();
-      });
-    } else {
-      const params = {};
-      if (isArrayFull(this.options.parameters)) {
-        this.options.parameters.forEach((p) => {
-          params[p.name] = this.parameterExpressions[p.name].value;
-        });
-      }
-      return this.map.context.flowClient.datasets.query(datasetOrUrl, {}, params);
-    }
-  }
-};
-__publicField$4(_DataJoin, "defaultOptions", {
-  clear: false,
-  parameters: []
-});
-let DataJoin = _DataJoin;
-class DataJoinPlugin extends MapPluginBase {
-  constructor(pluginManager) {
-    super(pluginManager);
-    __publicField$4(this, "_joins", /* @__PURE__ */ new Map());
-    __publicField$4(this, "name", "DataJoinPlugin");
-  }
-  addDataJoin(id, options) {
-    const dataJoin = new DataJoin(id, this.map, options);
-    this._joins.set(id, dataJoin);
-    dataJoin.start();
-  }
-  bindState(state) {
-    this._joins.forEach((join) => join.start());
-  }
-  destroy() {
-    this._joins.forEach((join) => join.stop());
-    this._joins.clear();
-  }
-  handleSourceRemoved(event) {
-    this._joins.forEach((join) => {
-      if (join.source === event.source) {
-        join.stop();
-        this._joins.delete(join.id);
-      }
-    });
-  }
-  removeDataJoin(id) {
-    const dataJoin = this._joins.get(id);
-    if (dataJoin) {
-      dataJoin.stop();
-      this._joins.delete(id);
-    } else {
-      throw new FlowError(`Cannot remove unrecognized data join '${id}'`);
-    }
-  }
-}
-
-var __defProp$3 = Object.defineProperty;
-var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$3 = (obj, key, value) => {
-  __defNormalProp$3(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-const _MapExporter = class _MapExporter {
-  constructor(map) {
-    this.map = map;
-    __publicField$3(this, "nativePixelRatio", window.devicePixelRatio);
-  }
-  async export(options) {
-    options = { ..._MapExporter.defaultOptions, ...options };
-    const [container, mapCopy] = await this.createMapCopy(options);
-    return new Promise((resolve, reject) => {
-      const fileName = `${options.name}.${options.format}`;
-      const mapCanvas = mapCopy.getCanvas();
-      const exportCanvas = this.createExportCanvas(container, mapCanvas);
-      const exportContext = exportCanvas.getContext("2d");
-      if (!exportContext) {
-        this.destroyMapCopy(container, mapCopy);
-        reject(new Error("Failed to create export canvas context"));
-        return;
-      }
-      const drawOverlayCallback = (err) => {
-        if (err) {
-          this.destroyMapCopy(container, mapCopy);
-          reject(err);
-        } else {
-          switch (options.format) {
-            case "png":
-              exportCanvas.toBlob((blob) => {
-                blob && saveAs(blob, fileName);
-              });
-              break;
-            case "pdf":
-              throw new Error("Export to PDF is not currently supported");
-          }
-          this.destroyMapCopy(container, mapCopy);
-          resolve(fileName);
-        }
-      };
-      const mapImage = new Image();
-      mapImage.onload = () => {
-        exportContext.drawImage(mapImage, 0, 0);
-        if (isFunction(options.drawOverlayFn)) {
-          options.drawOverlayFn(
-            exportContext,
-            exportCanvas.width,
-            exportCanvas.height,
-            options.dpmm,
-            drawOverlayCallback
-          );
-        } else {
-          drawOverlayCallback(null);
-        }
-      };
-      mapImage.src = mapCopy.getCanvas().toDataURL();
-    });
-  }
-  createMapCopy(options) {
-    const geoBounds = options.bounds || this.map.maplibreMap.getBounds().toArray().flat();
-    const geoBottomLeft = [geoBounds[0], geoBounds[1]];
-    const geoTopRight = [geoBounds[2], geoBounds[3]];
-    const geoCenter = [
-      (geoBottomLeft[0] + geoTopRight[0]) / 2,
-      (geoBottomLeft[1] + geoTopRight[1]) / 2
-    ];
-    const pxBottomLeft = this.map.maplibreMap.project(geoBottomLeft);
-    const pxTopRight = this.map.maplibreMap.project(geoTopRight);
-    const pxWidth = pxTopRight.x - pxBottomLeft.x;
-    const pxHeight = pxBottomLeft.y - pxTopRight.y;
-    const exportWidth = options.width * options.dpmm;
-    const exportHeight = options.height * options.dpmm;
-    const aspectRatios = {
-      width: pxWidth / exportWidth,
-      height: pxHeight / exportHeight
-    };
-    const coverRatio = Math.max(aspectRatios.width, aspectRatios.height);
-    const copyWidth = exportWidth * coverRatio;
-    const copyHeight = exportHeight * coverRatio;
-    const pixelRatio = exportWidth / copyWidth;
-    this.setDevicePixelRatio(pixelRatio);
-    const container = document.createElement("div");
-    container.id = randomId("export");
-    container.classList.add("maplibregl-export-container");
-    container.style.width = `${copyWidth}px`;
-    container.style.height = `${copyHeight}px`;
-    this.map.container.insertBefore(container, this.map.container.firstChild);
-    const mapCopy = new maplibre.Map({
-      container,
-      center: geoCenter,
-      zoom: this.map.maplibreMap.getZoom(),
-      style: { ...this.map.maplibreMap.getStyle(), transition: { delay: 0, duration: 0 } },
-      bearing: this.map.maplibreMap.getBearing(),
-      pitch: this.map.maplibreMap.getPitch(),
-      interactive: false,
-      attributionControl: false,
-      fadeDuration: 0,
-      preserveDrawingBuffer: true,
-      transformRequest: this.transformMapRequest.bind(this)
-    });
-    mapCopy.on("styleimagemissing", this.handleMissingImage.bind(this));
-    return new Promise((resolve) => {
-      mapCopy.once("load", () => {
-        Object.keys(this.map.maplibreMap.style.sourceCaches).forEach((sourceId) => {
-          mapCopy.style.sourceCaches[sourceId]._state.stateChanges = this.map.maplibreMap.style.sourceCaches[sourceId]._state.state;
-        });
-        mapCopy._update();
-        setTimeout(() => resolve([container, mapCopy]), 500);
-      });
-    });
-  }
-  destroyMapCopy(container, map) {
-    this.setDevicePixelRatio(this.nativePixelRatio);
-    map.remove();
-    container.parentNode.removeChild(container);
-  }
-  createExportCanvas(container, mapCanvas) {
-    const canvasContainer = container.getElementsByClassName("maplibregl-canvas-container")[0];
-    const overlayCanvas = document.createElement("canvas");
-    overlayCanvas.id = randomId("overlay");
-    overlayCanvas.width = mapCanvas.width;
-    overlayCanvas.height = mapCanvas.height;
-    overlayCanvas.style.position = "absolute";
-    overlayCanvas.style.width = mapCanvas.style.width;
-    overlayCanvas.style.height = mapCanvas.style.height;
-    canvasContainer.appendChild(overlayCanvas);
-    return overlayCanvas;
-  }
-  setDevicePixelRatio(pixelRatio) {
-    Object.defineProperty(window, "devicePixelRatio", {
-      get: () => pixelRatio
-    });
-  }
-  async handleMissingImage(e) {
-    const imageInfo = this.map.imageRegistry.getImage(e.id);
-    if (imageInfo === this.map.imageRegistry.unknownImage) {
-      console.error(`Map ${this.map.id}: Image '${e.id}' not registered`);
-    }
-    if (!imageInfo.image.complete) {
-      imageInfo.image.onload = () => {
-        this.map.maplibreMap.updateImage(e.id, imageInfo.image);
-        this.map.maplibreMap.redraw();
-      };
-    }
-    this.map.maplibreMap.addImage(e.id, imageInfo.image, {
-      pixelRatio: imageInfo.pixelDensity,
-      sdf: imageInfo.recolor
-    });
-  }
-  transformMapRequest(url, _resourceType) {
-    if (this.map.context.flowClient.accessToken && url.startsWith(this.map.context.flowClient.baseUrl)) {
-      return {
-        url,
-        headers: { Authorization: `Bearer ${this.map.context.flowClient.accessToken}` }
-      };
-    } else {
-      return { url };
-    }
-  }
-};
-__publicField$3(_MapExporter, "defaultOptions", {
-  name: "map",
-  width: 297,
-  height: 210,
-  dpmm: 12,
-  format: "png"
-});
-let MapExporter = _MapExporter;
-
-var __defProp$2 = Object.defineProperty;
-var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$2 = (obj, key, value) => {
-  __defNormalProp$2(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-class ExportPlugin extends MapPluginBase {
-  constructor(pluginManager) {
-    super(pluginManager);
-    __publicField$2(this, "name", "ExportPlugin");
-  }
-  exportMap(options) {
-    const mapExporter = new MapExporter(this.map);
-    return mapExporter.export(options);
-  }
-}
-
-var __defProp$1 = Object.defineProperty;
-var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$1 = (obj, key, value) => {
-  __defNormalProp$1(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-class HoverEffectPlugin extends MapPluginBase {
-  constructor(pluginManager) {
-    super(pluginManager);
-    __publicField$1(this, "hoveredFeature", null);
-    __publicField$1(this, "name", "HoverEffectPlugin");
-  }
-  handleMouseMove(event) {
-    const hoveredFeature = event.features[0];
-    if (hoveredFeature) {
-      this.map.maplibreMap._container.classList.add("feature-hovered");
-    } else {
-      this.map.maplibreMap._container.classList.remove("feature-hovered");
-    }
-    if (!this.compareFeatures(hoveredFeature, this.hoveredFeature)) {
-      this.clearHover();
-      if (isFeatureWithId(hoveredFeature) && isDefined(this.map.getSource(hoveredFeature.source)?.featureId)) {
-        this.map.setFeatureState(hoveredFeature, { hover: true }, false);
-        this.hoveredFeature = hoveredFeature;
-      }
-    }
-  }
-  handleMouseOut(event) {
-    this.clearHover();
-  }
-  handleSetExclusivePlugin(exclusivePlugins) {
-    if (exclusivePlugins.length) {
-      this.clearHover();
-      this.map.maplibreMap._container.classList.remove("feature-hovered");
-    }
-  }
-  compareFeatures(f1, f2) {
-    if (f1 === f2) {
-      return true;
-    }
-    if (isObject(f1) && isObject(f2)) {
-      return f1.id == f2.id && f1.source === f2.source && f1.sourceLayer == f2.sourceLayer;
-    }
-    return false;
-  }
-  clearHover() {
-    if (this.hoveredFeature && this.map.getSource(this.hoveredFeature.source)) {
-      this.map.removeFeatureState(this.hoveredFeature, "hover", false);
-      this.hoveredFeature = null;
-    }
-  }
-}
-
-var __defProp = Object.defineProperty;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => {
-  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-const debug = Debug("flow:url-sync-plugin");
-class UrlSyncPlugin extends MapPluginBase {
-  constructor(pluginManager) {
-    super(pluginManager);
-    __publicField(this, "name", "UrlSyncPlugin");
-  }
-  initialize() {
-    const searchParams = new URLSearchParams(window.location.search);
-    const hash = searchParams.get(this.map.id);
-    if (hash) {
-      const center = this.hashToMapState(hash);
-      debug("Setting map position from URL", center);
-      this.map.setCenter(center);
-    }
-  }
-  handleMoveEnd(event) {
-    const center = this.mapStateToHash(this.map.getCenter());
-    const searchParams = new URLSearchParams(window.location.search);
-    searchParams.set(this.map.id, center);
-    const newUrl = `${location.pathname}?${searchParams.toString()}`;
-    debug("Updating URL with map position", center);
-    window.history.replaceState({}, "", newUrl);
-  }
-  mapStateToHash(mapCenter) {
-    const state = {
-      z: mapCenter.zoom.toFixed(3),
-      x: mapCenter.lng.toFixed(3),
-      y: mapCenter.lat.toFixed(3),
-      pitch: mapCenter.pitch.toFixed(1),
-      bearing: mapCenter.bearing.toFixed(1)
-    };
-    return `${state.z}_${state.x}_${state.y}_${state.pitch}_${state.bearing}`;
-  }
-  hashToMapState(hash) {
-    const [zoom, x, y, pitch, bearing] = hash.split("_");
-    return {
-      lng: +x,
-      lat: +y,
-      zoom: +zoom,
-      pitch: +pitch,
-      bearing: +bearing
-    };
-  }
-}
-
-export { AnnotationEvent, AnnotationPlugin, DataJoin, DataJoinPlugin, ExportPlugin, HoverEffectPlugin, MapPluginBase, PopupPlugin, SelectionEvent, SelectionPlugin, UrlSyncPlugin };
+export { AnnotationEvent } from './annotations/annotation.events.mjs';
+export { AnnotationPlugin } from './annotations/annotation.plugin.mjs';
+export { DataJoin, DataJoinPlugin } from './data-join.plugin.mjs';
+export { ExportPlugin } from './export/export.plugin.mjs';
+export { HoverEffectPlugin } from './hover-effect.plugin.mjs';
+export { MapPluginBase } from './map-plugin-base.mjs';
+export { PluginManager } from './plugin-manager.mjs';
+export { PopupPlugin } from './popup.plugin.mjs';
+export { SelectionEvent } from './selection/selection.events.mjs';
+export { SelectionPlugin } from './selection/selection.plugin.mjs';
+export { UrlSyncPlugin } from './url-sync.plugin.mjs';