@artstesh/maps 5.1.7 → 6.0.1

package/dist/fesm2022/maps-components.mjs

@@ -29,2155 +29,2155 @@ import Style from 'ol/style/Style';
 import { Icon, Circle, Fill, Stroke, Text } from 'ol/style';
 import { METERS_PER_UNIT } from 'ol/proj/epsg4326';
 
-class DestructibleComponent {
-    subs = [];
-    onDestroy;
-    ngOnDestroy() {
-        this.subs.forEach((s) => s.unsubscribe());
-        if (this.onDestroy)
-            this.onDestroy();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DestructibleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DestructibleComponent, selector: "ng-component", ngImport: i0, template: '', isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DestructibleComponent, decorators: [{
-            type: Component,
-            args: [{ template: '' }]
+class DestructibleComponent {
+    subs = [];
+    onDestroy;
+    ngOnDestroy() {
+        this.subs.forEach((s) => s.unsubscribe());
+        if (this.onDestroy)
+            this.onDestroy();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: DestructibleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: DestructibleComponent, selector: "ng-component", ngImport: i0, template: '', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: DestructibleComponent, decorators: [{
+            type: Component,
+            args: [{ template: '' }]
         }] });
 
-var MapLyrs;
-(function (MapLyrs) {
-    MapLyrs[MapLyrs["Hybrid"] = 1] = "Hybrid";
-    MapLyrs[MapLyrs["Satellite"] = 2] = "Satellite";
-    MapLyrs[MapLyrs["Streets"] = 3] = "Streets";
-    MapLyrs[MapLyrs["Terrain"] = 4] = "Terrain";
-})(MapLyrs || (MapLyrs = {}));
-class MapLyrsLabel {
-    static lyrs = {
-        [MapLyrs.Hybrid]: 's,h',
-        [MapLyrs.Satellite]: 's',
-        [MapLyrs.Streets]: 'm',
-        [MapLyrs.Terrain]: 'p',
-    };
-    static get(lyrs) {
-        return MapLyrsLabel.lyrs[lyrs];
-    }
-}
-
-class MapSettings {
-    center = [0, 0];
-    maxZoom = 19;
-    minZoom = 0;
-    zoom = 4;
-    lyrs = MapLyrs.Hybrid;
-    language = 'en';
-    static copy(model) {
-        const result = new MapSettings();
-        result.center = model.center;
-        result.maxZoom = model.maxZoom;
-        result.minZoom = model.minZoom;
-        result.zoom = model.zoom;
-        result.lyrs = model.lyrs;
-        result.language = model.language;
-        return result;
-    }
-    setCenter(center) {
-        return MapSettings.copy({ ...this, center });
-    }
-    setMaxZoom(maxZoom) {
-        return MapSettings.copy({ ...this, maxZoom });
-    }
-    setMinZoom(minZoom) {
-        return MapSettings.copy({ ...this, minZoom });
-    }
-    setZoom(zoom) {
-        return MapSettings.copy({ ...this, zoom });
-    }
-    setLyrs(lyrs) {
-        return MapSettings.copy({ ...this, lyrs });
-    }
-    setLanguage(language) {
-        return MapSettings.copy({ ...this, language });
-    }
-    isSame(model) {
-        if (this.maxZoom !== model.maxZoom)
-            return false;
-        if (this.minZoom !== model.minZoom)
-            return false;
-        if (this.zoom !== model.zoom)
-            return false;
-        if (this.lyrs !== model.lyrs)
-            return false;
-        if (this.language !== model.language)
-            return false;
-        return this.center.length === model.center.length && !this.center.filter((c, i) => c !== model.center[i]).length;
-    }
-}
-
-class IdGenerator {
-    static collection = 'ABCDEFGHIJKLMNOPQRSTUVWXTZ0123456789'.split('');
-    static get() {
-        let result = [];
-        for (let i = 0; i < 7; i++) {
-            result.push(IdGenerator.collection
-                .sort(() => 0.5 - Math.random())
-                .slice(0, 5)
-                .join(''));
-        }
-        return result.join('-');
-    }
-}
-
-class MapConstants {
-    static FeatureInfo = 'f-info';
-    static DrawingLayerId = '93a981756ec7';
-}
-
-class MarkerModel {
-    lat;
-    lng;
-    info;
-    id;
-    constructor(lat, lng, id, info) {
-        this.lat = lat;
-        this.lng = lng;
-        this.info = info;
-        this.id = id == null ? IdGenerator.get() : id;
-        this._feature = this.getFeature();
-    }
-    _feature;
-    get feature() {
-        return this._feature;
-    }
-    getFeature() {
-        const feature = new Feature(new Point([this.lng, this.lat]));
-        feature.setId(this.id);
-        if (this.info)
-            feature.set(MapConstants.FeatureInfo, this.info);
-        return feature;
-    }
-}
-
-class PolygonModel {
-    info;
-    id;
-    lat;
-    lng;
-    _feature;
-    static fromGeoJson(id, json, info) {
-        let feature = new GeoJSON().readFeature(json);
-        feature.setId(id);
-        return new PolygonModel(feature, id, info);
-    }
-    static fromWKT(id, wkt, info) {
-        let feature = new WKT().readFeature(wkt);
-        feature.setId(id);
-        return new PolygonModel(feature, id, info);
-    }
-    constructor(feature, id, info) {
-        this.info = info;
-        this.id = id == null ? IdGenerator.get() : id;
-        this._feature = feature;
-        if (this.info)
-            this._feature?.set(MapConstants.FeatureInfo, this.info);
-        [this.lng, this.lat] = getCenter(this._feature.getGeometry()?.getExtent());
-    }
-    get feature() {
-        return this._feature;
-    }
-}
-
-var DrawingType;
-(function (DrawingType) {
-    DrawingType[DrawingType["Polygon"] = 1] = "Polygon";
-    DrawingType[DrawingType["Circle"] = 2] = "Circle";
-    DrawingType[DrawingType["Square"] = 3] = "Square";
-    DrawingType[DrawingType["Box"] = 4] = "Box";
+var MapLyrs;
+(function (MapLyrs) {
+    MapLyrs[MapLyrs["Hybrid"] = 1] = "Hybrid";
+    MapLyrs[MapLyrs["Satellite"] = 2] = "Satellite";
+    MapLyrs[MapLyrs["Streets"] = 3] = "Streets";
+    MapLyrs[MapLyrs["Terrain"] = 4] = "Terrain";
+})(MapLyrs || (MapLyrs = {}));
+class MapLyrsLabel {
+    static lyrs = {
+        [MapLyrs.Hybrid]: 's,h',
+        [MapLyrs.Satellite]: 's',
+        [MapLyrs.Streets]: 'm',
+        [MapLyrs.Terrain]: 'p',
+    };
+    static get(lyrs) {
+        return MapLyrsLabel.lyrs[lyrs];
+    }
+}
+
+class MapSettings {
+    center = [0, 0];
+    maxZoom = 19;
+    minZoom = 0;
+    zoom = 4;
+    lyrs = MapLyrs.Hybrid;
+    language = 'en';
+    static copy(model) {
+        const result = new MapSettings();
+        result.center = model.center;
+        result.maxZoom = model.maxZoom;
+        result.minZoom = model.minZoom;
+        result.zoom = model.zoom;
+        result.lyrs = model.lyrs;
+        result.language = model.language;
+        return result;
+    }
+    setCenter(center) {
+        return MapSettings.copy({ ...this, center });
+    }
+    setMaxZoom(maxZoom) {
+        return MapSettings.copy({ ...this, maxZoom });
+    }
+    setMinZoom(minZoom) {
+        return MapSettings.copy({ ...this, minZoom });
+    }
+    setZoom(zoom) {
+        return MapSettings.copy({ ...this, zoom });
+    }
+    setLyrs(lyrs) {
+        return MapSettings.copy({ ...this, lyrs });
+    }
+    setLanguage(language) {
+        return MapSettings.copy({ ...this, language });
+    }
+    isSame(model) {
+        if (this.maxZoom !== model.maxZoom)
+            return false;
+        if (this.minZoom !== model.minZoom)
+            return false;
+        if (this.zoom !== model.zoom)
+            return false;
+        if (this.lyrs !== model.lyrs)
+            return false;
+        if (this.language !== model.language)
+            return false;
+        return this.center.length === model.center.length && !this.center.filter((c, i) => c !== model.center[i]).length;
+    }
+}
+
+class IdGenerator {
+    static collection = 'ABCDEFGHIJKLMNOPQRSTUVWXTZ0123456789'.split('');
+    static get() {
+        let result = [];
+        for (let i = 0; i < 7; i++) {
+            result.push(IdGenerator.collection
+                .sort(() => 0.5 - Math.random())
+                .slice(0, 5)
+                .join(''));
+        }
+        return result.join('-');
+    }
+}
+
+class MapConstants {
+    static FeatureInfo = 'f-info';
+    static DrawingLayerId = '93a981756ec7';
+}
+
+class MarkerModel {
+    lat;
+    lng;
+    info;
+    id;
+    constructor(lat, lng, id, info) {
+        this.lat = lat;
+        this.lng = lng;
+        this.info = info;
+        this.id = id == null ? IdGenerator.get() : id;
+        this._feature = this.getFeature();
+    }
+    _feature;
+    get feature() {
+        return this._feature;
+    }
+    getFeature() {
+        const feature = new Feature(new Point([this.lng, this.lat]));
+        feature.setId(this.id);
+        if (this.info)
+            feature.set(MapConstants.FeatureInfo, this.info);
+        return feature;
+    }
+}
+
+class PolygonModel {
+    info;
+    id;
+    lat;
+    lng;
+    _feature;
+    static fromGeoJson(id, json, info) {
+        let feature = new GeoJSON().readFeature(json);
+        feature.setId(id);
+        return new PolygonModel(feature, id, info);
+    }
+    static fromWKT(id, wkt, info) {
+        let feature = new WKT().readFeature(wkt);
+        feature.setId(id);
+        return new PolygonModel(feature, id, info);
+    }
+    constructor(feature, id, info) {
+        this.info = info;
+        this.id = id == null ? IdGenerator.get() : id;
+        this._feature = feature;
+        if (this.info)
+            this._feature?.set(MapConstants.FeatureInfo, this.info);
+        [this.lng, this.lat] = getCenter(this._feature.getGeometry()?.getExtent());
+    }
+    get feature() {
+        return this._feature;
+    }
+}
+
+var DrawingType;
+(function (DrawingType) {
+    DrawingType[DrawingType["Polygon"] = 1] = "Polygon";
+    DrawingType[DrawingType["Circle"] = 2] = "Circle";
+    DrawingType[DrawingType["Square"] = 3] = "Square";
+    DrawingType[DrawingType["Box"] = 4] = "Box";
 })(DrawingType || (DrawingType = {}));
 
-var FeatureOutputFormat;
-(function (FeatureOutputFormat) {
-    FeatureOutputFormat[FeatureOutputFormat["GeoJson"] = 1] = "GeoJson";
-    FeatureOutputFormat[FeatureOutputFormat["WKT"] = 2] = "WKT";
+var FeatureOutputFormat;
+(function (FeatureOutputFormat) {
+    FeatureOutputFormat[FeatureOutputFormat["GeoJson"] = 1] = "GeoJson";
+    FeatureOutputFormat[FeatureOutputFormat["WKT"] = 2] = "WKT";
 })(FeatureOutputFormat || (FeatureOutputFormat = {}));
 
-/**
- *
- * A control is a visible widget with a DOM element in a fixed position on the screen. They can involve user input (buttons), or be informational only; the position is determined using CSS. By default these are placed in the container with CSS class name ol-overlaycontainer-stopevent, but can use any outside DOM element.
- * This is the base class for controls. You can use it for simple custom controls by creating the element with listeners, creating an instance:
- * var myControl = new Control({element: myElement}); and then adding this to the map.
- * The main advantage of having this as a control rather than a simple separate DOM element is that preventing propagation is handled for you. Controls will also be objects in a module:ol/Collection~Collection, so you can use their methods.
- * You can also extend this base for your own control class. See examples/custom-controls for an example of how to do this.
- */
-class MapControl extends Control {
-    constructor(options) {
-        super(options);
-    }
-}
-
-class MapRenderedEvent extends PostboyGenericMessage {
-    map;
-    static ID = 'b6121807-3b89-4cd3-82cf-089d2cefdc4f';
-    constructor(map) {
-        super();
-        this.map = map;
-    }
-    get id() {
-        return MapRenderedEvent.ID;
-    }
-}
-
-class MapClickEvent extends PostboyGenericMessage {
-    coordinates;
-    entities;
-    features;
-    static ID = '323df526-8d9c-49c6-83e8-6e9a1e7762f7';
-    constructor(coordinates, entities, features) {
-        super();
-        this.coordinates = coordinates;
-        this.entities = entities;
-        this.features = features;
-    }
-    get id() {
-        return MapClickEvent.ID;
-    }
-}
-
-class MapMoveEndEvent extends PostboyGenericMessage {
-    zoom;
-    extent;
-    static ID = 'f21f783e-b5af-4489-9fec-8027fd07a8ad';
-    constructor(zoom, extent) {
-        super();
-        this.zoom = zoom;
-        this.extent = extent;
-    }
-    get id() {
-        return MapMoveEndEvent.ID;
-    }
-}
-
-class CloseTooltipCommand extends PostboyGenericMessage {
-    tooltipId;
-    static ID = '4896d52c-e34f-4994-bcfd-32832d12dbe4';
-    constructor(tooltipId) {
-        super();
-        this.tooltipId = tooltipId;
-    }
-    get id() {
-        return CloseTooltipCommand.ID;
-    }
-}
-
-class StartDrawingCommand extends PostboyCallbackMessage {
-    type;
-    style;
-    format;
-    static ID = 'da904f4b-a1c8-4db7-a6af-14d9ee18ec8c';
-    constructor(type, style, format = FeatureOutputFormat.GeoJson) {
-        super();
-        this.type = type;
-        this.style = style;
-        this.format = format;
-    }
-    get id() {
-        return StartDrawingCommand.ID;
-    }
-}
-
-class CancelDrawingCommand extends PostboyGenericMessage {
-    static ID = '7d38d983-feba-4176-a66b-18175e5ecd6b';
-    get id() {
-        return CancelDrawingCommand.ID;
-    }
-}
-
-class DrawSelectionAreaCommand extends PostboyCallbackMessage {
-    type;
-    style;
-    ignore;
-    static ID = '573d8a0d-f25b-42b7-9ad7-0ac6d86ac362';
-    constructor(type, style, ignore = new Set()) {
-        super();
-        this.type = type;
-        this.style = style;
-        this.ignore = ignore;
-    }
-    get id() {
-        return DrawSelectionAreaCommand.ID;
-    }
-}
-
-class ModifyFeatureCommand extends PostboyCallbackMessage {
-    model;
-    style;
-    format;
-    static ID = 'ead85caa-24c6-4844-a68c-2cea91774c8c';
-    constructor(model, style, format = FeatureOutputFormat.GeoJson) {
-        super();
-        this.model = model;
-        this.style = style;
-        this.format = format;
-    }
-    get id() {
-        return ModifyFeatureCommand.ID;
-    }
-}
-
-class CancelFeatureModificationCommand extends PostboyGenericMessage {
-    static ID = '9c9fb40f-ea95-4704-8177-0e9ecabf36fa';
-    get id() {
-        return CancelFeatureModificationCommand.ID;
-    }
-}
-
-class AddControlCommand extends PostboyGenericMessage {
-    item;
-    static ID = '8e1c06eb-b395-4fe1-929c-ebf0805eeb49';
-    constructor(item) {
-        super();
-        this.item = item;
-    }
-    get id() {
-        return AddControlCommand.ID;
-    }
-}
-
-class RemoveControlCommand extends PostboyGenericMessage {
-    item;
-    static ID = '361641e0-804a-4930-8c27-0cea6330dbfc';
-    constructor(item) {
-        super();
-        this.item = item;
-    }
-    get id() {
-        return RemoveControlCommand.ID;
-    }
-}
-
-/**
- * Forces map to move to a specific point
- */
-class SetMapCenterCommand extends PostboyGenericMessage {
-    lat;
-    lng;
-    zoom;
-    static ID = 'd50e89c9-6707-4f8c-ab57-65fcef232182';
-    /**
-     *
-     * @param lat - the desired latitude
-     * @param lng - the desired longitude
-     * @param zoom - the desired zoom; doesn't change zoom if undefined
-     */
-    constructor(lat, lng, zoom) {
-        super();
-        this.lat = lat;
-        this.lng = lng;
-        this.zoom = zoom;
-    }
-    get id() {
-        return SetMapCenterCommand.ID;
-    }
-}
-
-class CalculateAreaExecutor extends PostboyExecutor {
-    polygon;
-    static ID = '172ecf46-86b5-4f46-a5f1-96ba2cbb1694';
-    constructor(polygon) {
-        super();
-        this.polygon = polygon;
-    }
-    get id() {
-        return CalculateAreaExecutor.ID;
-    }
-}
-
-class FitToPolygonsCommand extends PostboyGenericMessage {
-    features;
-    zoomAfter;
-    static ID = 'a9e42b23-ffaf-4c46-8370-e0432cd14d60';
-    constructor(features, zoomAfter = 0) {
-        super();
-        this.features = features;
-        this.zoomAfter = zoomAfter;
-    }
-    get id() {
-        return FitToPolygonsCommand.ID;
-    }
-}
-
-class AddLayerCommand extends PostboyGenericMessage {
-    layer;
-    static ID = 'd93e250f-92bc-43ac-9c6a-46c521a1aaa5';
-    constructor(layer) {
-        super();
-        this.layer = layer;
-    }
-    get id() {
-        return AddLayerCommand.ID;
-    }
-}
-
-class PlaceLayerFeaturesCommand extends PostboyGenericMessage {
-    layer;
-    features;
-    static ID = '8caf86bc-869b-426f-b36d-4642f6b8aab0';
-    constructor(layer, features) {
-        super();
-        this.layer = layer;
-        this.features = features;
-    }
-    get id() {
-        return PlaceLayerFeaturesCommand.ID;
-    }
-}
-
-class RemoveLayerCommand extends PostboyGenericMessage {
-    layer;
-    static ID = 'ab484e0e-e185-45cd-8434-12101f3c7eb1';
-    constructor(layer) {
-        super();
-        this.layer = layer;
-    }
-    get id() {
-        return RemoveLayerCommand.ID;
-    }
-}
-
-class AddTileCommand extends PostboyGenericMessage {
-    layer;
-    static ID = '25b7df28-72ce-4453-9fe6-54285a2fdc57';
-    constructor(layer) {
-        super();
-        this.layer = layer;
-    }
-    get id() {
-        return AddTileCommand.ID;
-    }
-}
-
-class RemoveTileCommand extends PostboyGenericMessage {
-    layer;
-    static ID = 'c36ccc0b-5638-4819-b148-2de57a59a5b7';
-    constructor(layer) {
-        super();
-        this.layer = layer;
-    }
-    get id() {
-        return RemoveTileCommand.ID;
-    }
-}
-
-class FitToFeaturesCommand extends PostboyGenericMessage {
-    features;
-    zoomAfter;
-    static ID = '76cdc091-3793-4b6c-82f7-1e0334cf08a8';
-    constructor(features, zoomAfter = 0) {
-        super();
-        this.features = features;
-        this.zoomAfter = zoomAfter;
-    }
-    get id() {
-        return FitToFeaturesCommand.ID;
-    }
-}
-
-class GetLayerQuery extends PostboyCallbackMessage {
-    name;
-    static ID = '5c04c87b-8a93-4c2a-979e-d1e313d860ed';
-    constructor(name) {
-        super();
-        this.name = name;
-    }
-    get id() {
-        return GetLayerQuery.ID;
-    }
-}
-
-class DrawingFinishedEvent extends PostboyGenericMessage {
-    static ID = 'c724b68e-b4eb-4783-90f1-a8e31973fd36';
-    constructor() {
-        super();
-    }
-    get id() {
-        return DrawingFinishedEvent.ID;
-    }
-}
-
-class DrawingGenerationService {
-    static getDraw(ev) {
-        return new Draw({
-            source: ev.layer.getSource(),
-            type: ev.type === DrawingType.Polygon ? 'Polygon' : 'Circle',
-            style: ev.style,
-            geometryFunction: DrawingGenerationService.geometryFunc(ev.type),
-        });
-    }
-    static geometryFunc(type) {
-        switch (type) {
-            case DrawingType.Circle:
-                return createRegularPolygon(32);
-            case DrawingType.Box:
-                return createBox();
-            case DrawingType.Square:
-                return createRegularPolygon(4);
-        }
-        return undefined;
-    }
-}
-
-class FeatureService {
-    constructor() { }
-    static filterFeaturesInArea(query) {
-        return query.features.filter((f) => FeatureService.booleanIntersects(query.area, f.getGeometry()));
-    }
-    static booleanIntersects(g1, g2) {
-        if (g2.getType() === 'Point')
-            return g1.intersectsCoordinate(g2.getCoordinates());
-        if (g2.getType() === 'Circle')
-            return g1.intersectsCoordinate(g2.getCenter());
-        if (g2.getType() === 'Polygon')
-            return g1.intersectsCoordinate(g2.getInteriorPoint().getCoordinates());
-        return false;
-    }
-    static calculateArea(g) {
-        if (!g)
-            return 0;
-        return Sphere.getArea(g, { projection: 'EPSG:4326' });
-    }
-}
-
-class GetFeaturesInAreaQuery extends PostboyCallbackMessage {
-    area;
-    ignore;
-    static ID = 'efcf4271-a07a-40e0-9f02-d4dade40b8ac';
-    constructor(area, ignore = new Set()) {
-        super();
-        this.area = area;
-        this.ignore = ignore;
-    }
-    get id() {
-        return GetFeaturesInAreaQuery.ID;
-    }
-}
-
-class FilterFeaturesInAreaExecutor extends PostboyExecutor {
-    area;
-    features;
-    static ID = '36bb2d94-8028-4512-90dd-2386af3fc67c';
-    constructor(area, features) {
-        super();
-        this.area = area;
-        this.features = features;
-    }
-    get id() {
-        return FilterFeaturesInAreaExecutor.ID;
-    }
-}
-
-class GenerateDrawExecutor extends PostboyExecutor {
-    layer;
-    style;
-    type;
-    static ID = 'f01c99ba-0953-4ab5-82f9-04e6fbb678c1';
-    constructor(layer, style, type) {
-        super();
-        this.layer = layer;
-        this.style = style;
-        this.type = type;
-    }
-    get id() {
-        return GenerateDrawExecutor.ID;
-    }
-}
-
-class GenerateZoomControlExecutor extends PostboyExecutor {
-    settings;
-    static ID = 'ff16a833-c68e-4b1a-bc23-c0d16b002810';
-    constructor(settings) {
-        super();
-        this.settings = settings;
-    }
-    get id() {
-        return GenerateZoomControlExecutor.ID;
-    }
-}
-
-class ZoomControlFactory {
-    static build(settings) {
-        return new Zoom({
-            zoomInTipLabel: settings.zoomInLabel,
-            zoomOutTipLabel: settings.zoomOutLabel,
-            zoomInClassName: settings.zoomInClass,
-            zoomOutClassName: settings.zoomOutClass,
-            className: settings.controlClass,
-        });
-    }
-}
-
-class MapPostboyService extends PostboyService {
-    constructor() {
-        super();
-        this.addLocker({ locker: StartDrawingCommand.ID, unlocker: DrawingFinishedEvent.ID, locking: [MapClickEvent.ID] });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapPostboyService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapPostboyService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapPostboyService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return []; } });
-
-class MapManagementService {
-    postboy;
-    map;
-    layers = new Dictionary();
-    constructor(postboy) {
-        this.postboy = postboy;
-    }
-    up() {
-        this.observeMapRender();
-        this.observeAddLayer();
-        this.observeRemoveLayer();
-        this.observePlaceFeatures();
-        this.observeAddTile();
-        this.observeRemoveTile();
-        this.observeLayerQuery();
-        this.observeFeaturesInArea();
-    }
-    observeRemoveTile() {
-        this.postboy.subscribe(RemoveTileCommand.ID).subscribe((c) => {
-            if (!this.map)
-                return;
-            this.map.removeLayer(c.layer);
-        });
-    }
-    observeLayerQuery() {
-        this.postboy.subscribe(GetLayerQuery.ID).subscribe((ev) => ev.finish(this.layers.take(ev.name)));
-    }
-    observeAddTile() {
-        this.postboy.subscribe(AddTileCommand.ID).subscribe((c) => {
-            if (!this.map)
-                return;
-            this.map.addLayer(c.layer);
-        });
-    }
-    observeMapRender() {
-        this.postboy.subscribe(MapRenderedEvent.ID).subscribe((m) => {
-            this.map = m.map;
-        });
-    }
-    observeAddLayer() {
-        this.postboy.subscribe(AddLayerCommand.ID).subscribe((c) => {
-            if (!this.map)
-                return;
-            this.layers.put(c.layer.get('name'), c.layer);
-            this.map.addLayer(c.layer);
-        });
-    }
-    observePlaceFeatures() {
-        this.postboy.subscribe(PlaceLayerFeaturesCommand.ID).subscribe((c) => {
-            if (!this.layers.has(c.layer))
-                return;
-            let source = this.layers.take(c.layer).getSource();
-            if (!!source['getSource'])
-                source = source?.getSource();
-            source?.clear();
-            !!c.features?.length && source?.addFeatures(c.features);
-        });
-    }
-    observeRemoveLayer() {
-        this.postboy.subscribe(RemoveLayerCommand.ID).subscribe((c) => {
-            if (!this.map)
-                return;
-            this.layers.rmv(c.layer.get('name'));
-            this.map.removeLayer(c.layer);
-        });
-    }
-    observeFeaturesInArea() {
-        this.postboy.subscribe(GetFeaturesInAreaQuery.ID).subscribe((qr) => {
-            let result = new Dictionary();
-            this.layers.forEach((l) => {
-                let layerName = l.get('name');
-                if (qr.ignore.has(layerName) || layerName === MapConstants.DrawingLayerId)
-                    return;
-                let source = l.getSource();
-                if (!!source['getSource'])
-                    source = source?.getSource();
-                let features = this.postboy.execute(new FilterFeaturesInAreaExecutor(qr.area, source?.getFeatures() ?? []));
-                result.put(layerName, features.map((e) => ({ id: e.getId(), ...e.get(MapConstants.FeatureInfo) })));
-            });
-            qr.finish(result);
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapManagementService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapManagementService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapManagementService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
-
-class MapStateService {
-    postboy;
-    map;
-    constructor(postboy) {
-        this.postboy = postboy;
-    }
-    up() {
-        this.observeMapRendering();
-        this.observeCenter();
-    }
-    observeMapRendering() {
-        this.postboy
-            .subscribe(MapRenderedEvent.ID)
-            .pipe(first())
-            .subscribe((ev) => {
-            this.map = ev.map;
-            this.map?.on('moveend', () => {
-                const zoom = Math.floor(this.map?.getView().getZoom() || -1);
-                const extent = this.map?.getView().calculateExtent() || [];
-                this.postboy.fire(new MapMoveEndEvent(zoom, extent));
-            });
-        });
-    }
-    observeCenter() {
-        this.postboy.subscribe(SetMapCenterCommand.ID).subscribe((c) => {
-            this.map?.getView().setCenter([c.lng, c.lat]);
-            if (c.zoom)
-                this.map?.getView().setZoom(c.zoom);
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapStateService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapStateService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapStateService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
-
-class MapFeatureService {
-    postboy;
-    map;
-    fitPolygonsWaiting;
-    constructor(postboy) {
-        this.postboy = postboy;
-    }
-    up() {
-        this.observeMapRender();
-        this.observeFitToFeatures();
-        this.observeFitToPolygons();
-    }
-    observeMapRender() {
-        this.postboy.subscribe(MapRenderedEvent.ID).subscribe((m) => {
-            this.map = m.map;
-            if (this.fitPolygonsWaiting)
-                this.postboy.fire(this.fitPolygonsWaiting);
-        });
-    }
-    observeFitToFeatures() {
-        this.postboy.subscribe(FitToFeaturesCommand.ID).subscribe((cmd) => {
-            this.fitToGeometries(cmd.features.map((f) => f.getGeometry()), cmd.zoomAfter);
-        });
-    }
-    observeFitToPolygons() {
-        this.postboy.subscribe(FitToPolygonsCommand.ID).subscribe((cmd) => {
-            if (!this.map) {
-                this.fitPolygonsWaiting = cmd;
-                return;
-            }
-            this.fitPolygonsWaiting = undefined;
-            this.fitToGeometries(cmd.features.map((f) => f.feature.getGeometry()), cmd.zoomAfter);
-        });
-    }
-    fitToGeometries(geometries, zoomAfter) {
-        if (!geometries?.length || !this.map)
-            return;
-        const extent = createEmpty();
-        geometries.forEach((g) => extend(extent, g.getExtent()));
-        this.map.getView().fit(extent);
-        this.map.getView().setZoom(this.map.getView().getZoom() + zoomAfter);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapFeatureService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapFeatureService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapFeatureService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
-
-class MapClickService {
-    postboy;
-    map;
-    constructor(postboy) {
-        this.postboy = postboy;
-    }
-    up() {
-        this.observeMapRender();
-    }
-    observeMapRender() {
-        this.postboy.subscribe(MapRenderedEvent.ID).subscribe((m) => {
-            this.map = m.map;
-            this.map?.on('singleclick', (e) => {
-                this.postboy.fire(this.onClick(e));
-            });
-        });
-    }
-    onClick(ev) {
-        const model = new MapClickEvent(ev.coordinate, {}, {});
-        this.map?.forEachFeatureAtPixel(ev.pixel, (f, l) => {
-            this.getFeatureCollectionWithInner([f])
-                .filter((f) => f.getId() != null)
-                .forEach((fs) => {
-                let layerName = l.get('name');
-                if (!model.entities[layerName])
-                    model.entities[layerName] = [];
-                if (!model.features[layerName])
-                    model.features[layerName] = [];
-                model.entities[layerName].push({ id: fs.getId(), ...fs.get(MapConstants.FeatureInfo) });
-                model.features[layerName].push(fs);
-            });
-        });
-        return model;
-    }
-    getFeatureCollectionWithInner(features) {
-        const result = [];
-        features?.forEach((f) => {
-            const innerFeatures = f.get('features');
-            innerFeatures?.length ? result.push(...innerFeatures) : result.push(f);
-        });
-        return result;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapClickService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapClickService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapClickService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
-
-class DrawingService {
-    postboy;
-    drawInteraction;
-    map;
-    constructor(postboy) {
-        this.postboy = postboy;
-    }
-    up() {
-        this.observeDrawing();
-        this.observeSelectArea();
-        this.observeMapRender();
-    }
-    observeSelectArea() {
-        this.postboy.subscribe(DrawSelectionAreaCommand.ID).subscribe((ev) => {
-            const drawingCommand = new StartDrawingCommand(ev.type, ev.style);
-            drawingCommand.result.subscribe((r) => {
-                if (!r) {
-                    ev.finish(new Dictionary());
-                    return;
-                }
-                const area = PolygonModel.fromGeoJson(1, r).feature.getGeometry();
-                const getFeaturesCommand = new GetFeaturesInAreaQuery(area, ev.ignore);
-                getFeaturesCommand.result.subscribe((result) => ev.finish(result));
-                this.postboy.fire(getFeaturesCommand);
-            });
-            this.postboy.fire(drawingCommand);
-        });
-    }
-    observeDrawing() {
-        this.postboy.subscribe(StartDrawingCommand.ID).subscribe((ev) => {
-            this.draw((l) => {
-                if (!l || !this.map) {
-                    this.clearInteraction(l);
-                    return;
-                }
-                const cancelSub = this.observeCancelation(ev, l);
-                this.drawInteraction = this.postboy.execute(new GenerateDrawExecutor(l, ev.style, ev.type));
-                this.map?.addInteraction(this.drawInteraction);
-                this.drawInteraction.on('drawend', (evt) => {
-                    cancelSub.unsubscribe();
-                    this.onEnd(evt, ev, l);
-                });
-            });
-        });
-    }
-    onEnd(evt, command, layer) {
-        command.finish(command.format === FeatureOutputFormat.GeoJson
-            ? new GeoJSON().writeFeature(evt.feature)
-            : new WKT().writeFeature(evt.feature));
-        this.clearInteraction(layer);
-    }
-    observeMapRender() {
-        this.postboy.subscribe(MapRenderedEvent.ID).subscribe((m) => {
-            this.map = m.map;
-        });
-    }
-    draw(action) {
-        const query = new GetLayerQuery(MapConstants.DrawingLayerId);
-        query.result.subscribe((l) => action(l));
-        this.postboy.fire(query);
-    }
-    observeCancelation(ev, layer) {
-        return this.postboy
-            .subscribe(CancelDrawingCommand.ID)
-            .pipe(first())
-            .subscribe(() => {
-            ev.finish(null);
-            this.clearInteraction(layer);
-        });
-    }
-    clearInteraction(layer) {
-        if (!!this.drawInteraction) {
-            this.map?.removeInteraction(this.drawInteraction);
-            layer?.setSource(new Vector({}));
-        }
-        setTimeout(() => this.postboy.fire(new DrawingFinishedEvent()), 300);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrawingService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrawingService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrawingService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
-
-class FeatureModificationService {
-    postboy;
-    modify;
-    translate;
-    map;
-    constructor(postboy) {
-        this.postboy = postboy;
-    }
-    up() {
-        this.observeModification();
-        this.observeMapRender();
-    }
-    observeModification() {
-        this.postboy.subscribe(ModifyFeatureCommand.ID).subscribe((ev) => {
-            this.defineLayer((l) => {
-                if (!l || !this.map) {
-                    this.clearInteraction(l);
-                    return;
-                }
-                this.observeCancelation(ev, l);
-                this.initFeature(l, ev.model.feature);
-                this.addModify(ev);
-                this.addDragging(ev);
-            });
-        });
-    }
-    initFeature(layer, feature) {
-        layer.getSource()?.clear();
-        layer.getSource()?.addFeature(feature);
-    }
-    addModify(command) {
-        this.modify = new Modify({
-            features: new Collection([command.model.feature]),
-            style: command.style,
-        });
-        this.modify.on('modifyend', () => {
-            this.onModified(command);
-            command.model.feature.changed();
-        });
-        this.map?.addInteraction(this.modify);
-    }
-    addDragging(command) {
-        this.translate = new Translate({
-            features: new Collection([command.model.feature]),
-            condition: (ev) => {
-                const clone = command.model.feature.clone();
-                clone.getGeometry()?.scale(0.999);
-                return clone.getGeometry().intersectsCoordinate(ev.coordinate);
-            },
-        });
-        this.translate.on('translateend', () => this.onModified(command));
-        this.map?.addInteraction(this.translate);
-    }
-    onModified(command) {
-        command.next(command.format === FeatureOutputFormat.GeoJson
-            ? new GeoJSON().writeFeature(command.model.feature)
-            : new WKT().writeFeature(command.model.feature));
-    }
-    observeMapRender() {
-        this.postboy.subscribe(MapRenderedEvent.ID).subscribe((m) => {
-            this.map = m.map;
-        });
-    }
-    defineLayer(action) {
-        const query = new GetLayerQuery(MapConstants.DrawingLayerId);
-        query.result.subscribe((l) => action(l));
-        this.postboy.fire(query);
-    }
-    observeCancelation(ev, layer) {
-        return this.postboy
-            .subscribe(CancelFeatureModificationCommand.ID)
-            .pipe(first())
-            .subscribe(() => {
-            ev.finish(null);
-            this.clearInteraction(layer);
-        });
-    }
-    clearInteraction(layer) {
-        if (this.modify)
-            this.map?.removeInteraction(this.modify);
-        if (this.translate)
-            this.map?.removeInteraction(this.translate);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FeatureModificationService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FeatureModificationService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FeatureModificationService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
-
-class ControlsService {
-    postboy;
-    map;
-    constructor(postboy) {
-        this.postboy = postboy;
-    }
-    up() {
-        this.observeMapRender();
-    }
-    observeMapRender() {
-        this.postboy
-            .subscribe(MapRenderedEvent.ID)
-            .pipe(first())
-            .subscribe((m) => {
-            this.map = m.map;
-            this.observeAdding();
-            this.observeRemoving();
-        });
-    }
-    observeAdding() {
-        this.postboy.subscribe(AddControlCommand.ID).subscribe((c) => this.map?.addControl(c.item));
-    }
-    observeRemoving() {
-        this.postboy
-            .subscribe(RemoveControlCommand.ID)
-            .subscribe((c) => this.map?.removeControl(c.item));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ControlsService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ControlsService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ControlsService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
-
-class MessageRegistratorService extends PostboyAbstractRegistrator {
-    constructor(service, management, state, mapFeature, interaction, drawing, featureModification, controls) {
-        super(service);
-        this.registerServices([management, state, interaction, mapFeature, drawing, featureModification, controls]);
-    }
-    _up() {
-        this.registerReplay(MapRenderedEvent.ID);
-        this.registerReplay(PlaceLayerFeaturesCommand.ID);
-        this.registerReplay(RemoveControlCommand.ID);
-        this.registerReplay(AddControlCommand.ID);
-        this.registerReplay(SetMapCenterCommand.ID);
-        this.registerSubject(AddLayerCommand.ID);
-        this.registerSubject(RemoveLayerCommand.ID);
-        this.registerSubject(AddTileCommand.ID);
-        this.registerSubject(RemoveTileCommand.ID);
-        this.registerSubject(MapClickEvent.ID);
-        this.registerSubject(CloseTooltipCommand.ID);
-        this.registerSubject(FitToFeaturesCommand.ID);
-        this.registerSubject(FitToPolygonsCommand.ID);
-        this.registerSubject(MapMoveEndEvent.ID);
-        this.registerSubject(CancelDrawingCommand.ID);
-        this.registerSubject(StartDrawingCommand.ID);
-        this.registerSubject(GetLayerQuery.ID);
-        this.registerSubject(DrawingFinishedEvent.ID);
-        this.registerSubject(GetFeaturesInAreaQuery.ID);
-        this.registerSubject(DrawSelectionAreaCommand.ID);
-        this.registerSubject(CancelFeatureModificationCommand.ID);
-        this.registerSubject(ModifyFeatureCommand.ID);
-        this.setExecutors();
-    }
-    setExecutors() {
-        this.registerExecutor(FilterFeaturesInAreaExecutor.ID, (e) => FeatureService.filterFeaturesInArea(e));
-        this.registerExecutor(CalculateAreaExecutor.ID, (e) => FeatureService.calculateArea(e.polygon?.feature?.getGeometry()));
-        this.registerExecutor(GenerateDrawExecutor.ID, (e) => DrawingGenerationService.getDraw(e));
-        this.registerExecutor(GenerateZoomControlExecutor.ID, (e) => ZoomControlFactory.build(e.settings));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MessageRegistratorService, deps: [{ token: MapPostboyService }, { token: MapManagementService }, { token: MapStateService }, { token: MapFeatureService }, { token: MapClickService }, { token: DrawingService }, { token: FeatureModificationService }, { token: ControlsService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MessageRegistratorService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MessageRegistratorService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: MapPostboyService }, { type: MapManagementService }, { type: MapStateService }, { type: MapFeatureService }, { type: MapClickService }, { type: DrawingService }, { type: FeatureModificationService }, { type: ControlsService }]; } });
-
-class TileLayerSettings {
-    maxZoom = 19;
-    minZoom = 0;
-    opacity = 0.6;
-    url = '';
-    projection = 'EPSG:3857';
-    static copy(model) {
-        const result = new TileLayerSettings();
-        result.maxZoom = model.maxZoom;
-        result.minZoom = model.minZoom;
-        result.projection = model.projection;
-        result.opacity = model.opacity;
-        result.url = model.url;
-        return result;
-    }
-    setUrl(url) {
-        return TileLayerSettings.copy({ ...this, url });
-    }
-    setMaxZoom(maxZoom) {
-        return TileLayerSettings.copy({ ...this, maxZoom });
-    }
-    setMinZoom(minZoom) {
-        return TileLayerSettings.copy({ ...this, minZoom });
-    }
-    setOpacity(opacity) {
-        return TileLayerSettings.copy({ ...this, opacity });
-    }
-    setProjection(projection) {
-        return TileLayerSettings.copy({ ...this, projection });
-    }
-    isSame(model) {
-        if (this.maxZoom !== model.maxZoom)
-            return false;
-        if (this.minZoom !== model.minZoom)
-            return false;
-        if (this.url !== model.url)
-            return false;
-        if (this.projection !== model.projection)
-            return false;
-        if (this.opacity !== model.opacity)
-            return false;
-        return true;
-    }
-}
-
-class TileLayerFactory {
-    build(settings) {
-        const source = new XYZ({
-            tileSize: 256,
-            maxZoom: settings.maxZoom || 14,
-            minZoom: settings.minZoom || 1,
-            projection: get(settings.projection),
-            tileUrlFunction: this.getTileFunc(settings),
-            crossOrigin: 'Anonymous',
-        });
-        return new TileLayer({ source, opacity: settings.opacity });
-    }
-    getTileFunc(settings) {
-        return (tileCoord) => {
-            const zoom = tileCoord[0];
-            const x = tileCoord[1];
-            const y = tileCoord[2];
-            const normalizedCoord = this.getNormalizedCoord({ x: x, y: y }, zoom);
-            const bound = 1 << zoom;
-            return settings.url
-                .replace('{x}', String(normalizedCoord?.x || x))
-                .replace('{z}', String(zoom))
-                .replace('{y}', String(bound - (normalizedCoord?.y || y) - 1));
-        };
-    }
-    getNormalizedCoord(coord, zoom) {
-        const y = coord.y;
-        let x = coord.x;
-        const tileRange = 1 << zoom;
-        if (y < 0 || y >= tileRange)
-            return null;
-        if (x < 0 || x >= tileRange)
-            x = ((x % tileRange) + tileRange) % tileRange;
-        return { x: x, y: y };
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayerFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayerFactory, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayerFactory, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
+/**
+ *
+ * A control is a visible widget with a DOM element in a fixed position on the screen. They can involve user input (buttons), or be informational only; the position is determined using CSS. By default these are placed in the container with CSS class name ol-overlaycontainer-stopevent, but can use any outside DOM element.
+ * This is the base class for controls. You can use it for simple custom controls by creating the element with listeners, creating an instance:
+ * var myControl = new Control({element: myElement}); and then adding this to the map.
+ * The main advantage of having this as a control rather than a simple separate DOM element is that preventing propagation is handled for you. Controls will also be objects in a module:ol/Collection~Collection, so you can use their methods.
+ * You can also extend this base for your own control class. See examples/custom-controls for an example of how to do this.
+ */
+class MapControl extends Control {
+    constructor(options) {
+        super(options);
+    }
+}
+
+class MapRenderedEvent extends PostboyGenericMessage {
+    map;
+    static ID = 'b6121807-3b89-4cd3-82cf-089d2cefdc4f';
+    constructor(map) {
+        super();
+        this.map = map;
+    }
+    get id() {
+        return MapRenderedEvent.ID;
+    }
+}
+
+class MapClickEvent extends PostboyGenericMessage {
+    coordinates;
+    entities;
+    features;
+    static ID = '323df526-8d9c-49c6-83e8-6e9a1e7762f7';
+    constructor(coordinates, entities, features) {
+        super();
+        this.coordinates = coordinates;
+        this.entities = entities;
+        this.features = features;
+    }
+    get id() {
+        return MapClickEvent.ID;
+    }
+}
+
+class MapMoveEndEvent extends PostboyGenericMessage {
+    zoom;
+    extent;
+    static ID = 'f21f783e-b5af-4489-9fec-8027fd07a8ad';
+    constructor(zoom, extent) {
+        super();
+        this.zoom = zoom;
+        this.extent = extent;
+    }
+    get id() {
+        return MapMoveEndEvent.ID;
+    }
+}
+
+class CloseTooltipCommand extends PostboyGenericMessage {
+    tooltipId;
+    static ID = '4896d52c-e34f-4994-bcfd-32832d12dbe4';
+    constructor(tooltipId) {
+        super();
+        this.tooltipId = tooltipId;
+    }
+    get id() {
+        return CloseTooltipCommand.ID;
+    }
+}
+
+class StartDrawingCommand extends PostboyCallbackMessage {
+    type;
+    style;
+    format;
+    static ID = 'da904f4b-a1c8-4db7-a6af-14d9ee18ec8c';
+    constructor(type, style, format = FeatureOutputFormat.GeoJson) {
+        super();
+        this.type = type;
+        this.style = style;
+        this.format = format;
+    }
+    get id() {
+        return StartDrawingCommand.ID;
+    }
+}
+
+class CancelDrawingCommand extends PostboyGenericMessage {
+    static ID = '7d38d983-feba-4176-a66b-18175e5ecd6b';
+    get id() {
+        return CancelDrawingCommand.ID;
+    }
+}
+
+class DrawSelectionAreaCommand extends PostboyCallbackMessage {
+    type;
+    style;
+    ignore;
+    static ID = '573d8a0d-f25b-42b7-9ad7-0ac6d86ac362';
+    constructor(type, style, ignore = new Set()) {
+        super();
+        this.type = type;
+        this.style = style;
+        this.ignore = ignore;
+    }
+    get id() {
+        return DrawSelectionAreaCommand.ID;
+    }
+}
+
+class ModifyFeatureCommand extends PostboyCallbackMessage {
+    model;
+    style;
+    format;
+    static ID = 'ead85caa-24c6-4844-a68c-2cea91774c8c';
+    constructor(model, style, format = FeatureOutputFormat.GeoJson) {
+        super();
+        this.model = model;
+        this.style = style;
+        this.format = format;
+    }
+    get id() {
+        return ModifyFeatureCommand.ID;
+    }
+}
+
+class CancelFeatureModificationCommand extends PostboyGenericMessage {
+    static ID = '9c9fb40f-ea95-4704-8177-0e9ecabf36fa';
+    get id() {
+        return CancelFeatureModificationCommand.ID;
+    }
+}
+
+class AddControlCommand extends PostboyGenericMessage {
+    item;
+    static ID = '8e1c06eb-b395-4fe1-929c-ebf0805eeb49';
+    constructor(item) {
+        super();
+        this.item = item;
+    }
+    get id() {
+        return AddControlCommand.ID;
+    }
+}
+
+class RemoveControlCommand extends PostboyGenericMessage {
+    item;
+    static ID = '361641e0-804a-4930-8c27-0cea6330dbfc';
+    constructor(item) {
+        super();
+        this.item = item;
+    }
+    get id() {
+        return RemoveControlCommand.ID;
+    }
+}
+
+/**
+ * Forces map to move to a specific point
+ */
+class SetMapCenterCommand extends PostboyGenericMessage {
+    lat;
+    lng;
+    zoom;
+    static ID = 'd50e89c9-6707-4f8c-ab57-65fcef232182';
+    /**
+     *
+     * @param lat - the desired latitude
+     * @param lng - the desired longitude
+     * @param zoom - the desired zoom; doesn't change zoom if undefined
+     */
+    constructor(lat, lng, zoom) {
+        super();
+        this.lat = lat;
+        this.lng = lng;
+        this.zoom = zoom;
+    }
+    get id() {
+        return SetMapCenterCommand.ID;
+    }
+}
+
+class CalculateAreaExecutor extends PostboyExecutor {
+    polygon;
+    static ID = '172ecf46-86b5-4f46-a5f1-96ba2cbb1694';
+    constructor(polygon) {
+        super();
+        this.polygon = polygon;
+    }
+    get id() {
+        return CalculateAreaExecutor.ID;
+    }
+}
+
+class FitToPolygonsCommand extends PostboyGenericMessage {
+    features;
+    zoomAfter;
+    static ID = 'a9e42b23-ffaf-4c46-8370-e0432cd14d60';
+    constructor(features, zoomAfter = 0) {
+        super();
+        this.features = features;
+        this.zoomAfter = zoomAfter;
+    }
+    get id() {
+        return FitToPolygonsCommand.ID;
+    }
+}
+
+class AddLayerCommand extends PostboyGenericMessage {
+    layer;
+    static ID = 'd93e250f-92bc-43ac-9c6a-46c521a1aaa5';
+    constructor(layer) {
+        super();
+        this.layer = layer;
+    }
+    get id() {
+        return AddLayerCommand.ID;
+    }
+}
+
+class PlaceLayerFeaturesCommand extends PostboyGenericMessage {
+    layer;
+    features;
+    static ID = '8caf86bc-869b-426f-b36d-4642f6b8aab0';
+    constructor(layer, features) {
+        super();
+        this.layer = layer;
+        this.features = features;
+    }
+    get id() {
+        return PlaceLayerFeaturesCommand.ID;
+    }
+}
+
+class RemoveLayerCommand extends PostboyGenericMessage {
+    layer;
+    static ID = 'ab484e0e-e185-45cd-8434-12101f3c7eb1';
+    constructor(layer) {
+        super();
+        this.layer = layer;
+    }
+    get id() {
+        return RemoveLayerCommand.ID;
+    }
+}
+
+class AddTileCommand extends PostboyGenericMessage {
+    layer;
+    static ID = '25b7df28-72ce-4453-9fe6-54285a2fdc57';
+    constructor(layer) {
+        super();
+        this.layer = layer;
+    }
+    get id() {
+        return AddTileCommand.ID;
+    }
+}
+
+class RemoveTileCommand extends PostboyGenericMessage {
+    layer;
+    static ID = 'c36ccc0b-5638-4819-b148-2de57a59a5b7';
+    constructor(layer) {
+        super();
+        this.layer = layer;
+    }
+    get id() {
+        return RemoveTileCommand.ID;
+    }
+}
+
+class FitToFeaturesCommand extends PostboyGenericMessage {
+    features;
+    zoomAfter;
+    static ID = '76cdc091-3793-4b6c-82f7-1e0334cf08a8';
+    constructor(features, zoomAfter = 0) {
+        super();
+        this.features = features;
+        this.zoomAfter = zoomAfter;
+    }
+    get id() {
+        return FitToFeaturesCommand.ID;
+    }
+}
+
+class GetLayerQuery extends PostboyCallbackMessage {
+    name;
+    static ID = '5c04c87b-8a93-4c2a-979e-d1e313d860ed';
+    constructor(name) {
+        super();
+        this.name = name;
+    }
+    get id() {
+        return GetLayerQuery.ID;
+    }
+}
+
+class DrawingFinishedEvent extends PostboyGenericMessage {
+    static ID = 'c724b68e-b4eb-4783-90f1-a8e31973fd36';
+    constructor() {
+        super();
+    }
+    get id() {
+        return DrawingFinishedEvent.ID;
+    }
+}
+
+class DrawingGenerationService {
+    static getDraw(ev) {
+        return new Draw({
+            source: ev.layer.getSource(),
+            type: ev.type === DrawingType.Polygon ? 'Polygon' : 'Circle',
+            style: ev.style,
+            geometryFunction: DrawingGenerationService.geometryFunc(ev.type),
+        });
+    }
+    static geometryFunc(type) {
+        switch (type) {
+            case DrawingType.Circle:
+                return createRegularPolygon(32);
+            case DrawingType.Box:
+                return createBox();
+            case DrawingType.Square:
+                return createRegularPolygon(4);
+        }
+        return undefined;
+    }
+}
+
+class FeatureService {
+    constructor() { }
+    static filterFeaturesInArea(query) {
+        return query.features.filter((f) => FeatureService.booleanIntersects(query.area, f.getGeometry()));
+    }
+    static booleanIntersects(g1, g2) {
+        if (g2.getType() === 'Point')
+            return g1.intersectsCoordinate(g2.getCoordinates());
+        if (g2.getType() === 'Circle')
+            return g1.intersectsCoordinate(g2.getCenter());
+        if (g2.getType() === 'Polygon')
+            return g1.intersectsCoordinate(g2.getInteriorPoint().getCoordinates());
+        return false;
+    }
+    static calculateArea(g) {
+        if (!g)
+            return 0;
+        return Sphere.getArea(g, { projection: 'EPSG:4326' });
+    }
+}
+
+class GetFeaturesInAreaQuery extends PostboyCallbackMessage {
+    area;
+    ignore;
+    static ID = 'efcf4271-a07a-40e0-9f02-d4dade40b8ac';
+    constructor(area, ignore = new Set()) {
+        super();
+        this.area = area;
+        this.ignore = ignore;
+    }
+    get id() {
+        return GetFeaturesInAreaQuery.ID;
+    }
+}
+
+class FilterFeaturesInAreaExecutor extends PostboyExecutor {
+    area;
+    features;
+    static ID = '36bb2d94-8028-4512-90dd-2386af3fc67c';
+    constructor(area, features) {
+        super();
+        this.area = area;
+        this.features = features;
+    }
+    get id() {
+        return FilterFeaturesInAreaExecutor.ID;
+    }
+}
+
+class GenerateDrawExecutor extends PostboyExecutor {
+    layer;
+    style;
+    type;
+    static ID = 'f01c99ba-0953-4ab5-82f9-04e6fbb678c1';
+    constructor(layer, style, type) {
+        super();
+        this.layer = layer;
+        this.style = style;
+        this.type = type;
+    }
+    get id() {
+        return GenerateDrawExecutor.ID;
+    }
+}
+
+class GenerateZoomControlExecutor extends PostboyExecutor {
+    settings;
+    static ID = 'ff16a833-c68e-4b1a-bc23-c0d16b002810';
+    constructor(settings) {
+        super();
+        this.settings = settings;
+    }
+    get id() {
+        return GenerateZoomControlExecutor.ID;
+    }
+}
+
+class ZoomControlFactory {
+    static build(settings) {
+        return new Zoom({
+            zoomInTipLabel: settings.zoomInLabel,
+            zoomOutTipLabel: settings.zoomOutLabel,
+            zoomInClassName: settings.zoomInClass,
+            zoomOutClassName: settings.zoomOutClass,
+            className: settings.controlClass,
+        });
+    }
+}
+
+class MapPostboyService extends PostboyService {
+    constructor() {
+        super();
+        this.addLocker({ locker: StartDrawingCommand.ID, unlocker: DrawingFinishedEvent.ID, locking: [MapClickEvent.ID] });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapPostboyService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapPostboyService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapPostboyService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [] });
+
+class MapManagementService {
+    postboy;
+    map;
+    layers = new Dictionary();
+    constructor(postboy) {
+        this.postboy = postboy;
+    }
+    up() {
+        this.observeMapRender();
+        this.observeAddLayer();
+        this.observeRemoveLayer();
+        this.observePlaceFeatures();
+        this.observeAddTile();
+        this.observeRemoveTile();
+        this.observeLayerQuery();
+        this.observeFeaturesInArea();
+    }
+    observeRemoveTile() {
+        this.postboy.subscribe(RemoveTileCommand.ID).subscribe((c) => {
+            if (!this.map)
+                return;
+            this.map.removeLayer(c.layer);
+        });
+    }
+    observeLayerQuery() {
+        this.postboy.subscribe(GetLayerQuery.ID).subscribe((ev) => ev.finish(this.layers.take(ev.name)));
+    }
+    observeAddTile() {
+        this.postboy.subscribe(AddTileCommand.ID).subscribe((c) => {
+            if (!this.map)
+                return;
+            this.map.addLayer(c.layer);
+        });
+    }
+    observeMapRender() {
+        this.postboy.subscribe(MapRenderedEvent.ID).subscribe((m) => {
+            this.map = m.map;
+        });
+    }
+    observeAddLayer() {
+        this.postboy.subscribe(AddLayerCommand.ID).subscribe((c) => {
+            if (!this.map)
+                return;
+            this.layers.put(c.layer.get('name'), c.layer);
+            this.map.addLayer(c.layer);
+        });
+    }
+    observePlaceFeatures() {
+        this.postboy.subscribe(PlaceLayerFeaturesCommand.ID).subscribe((c) => {
+            if (!this.layers.has(c.layer))
+                return;
+            let source = this.layers.take(c.layer).getSource();
+            if (!!source['getSource'])
+                source = source?.getSource();
+            source?.clear();
+            !!c.features?.length && source?.addFeatures(c.features);
+        });
+    }
+    observeRemoveLayer() {
+        this.postboy.subscribe(RemoveLayerCommand.ID).subscribe((c) => {
+            if (!this.map)
+                return;
+            this.layers.rmv(c.layer.get('name'));
+            this.map.removeLayer(c.layer);
+        });
+    }
+    observeFeaturesInArea() {
+        this.postboy.subscribe(GetFeaturesInAreaQuery.ID).subscribe((qr) => {
+            let result = new Dictionary();
+            this.layers.forEach((l) => {
+                let layerName = l.get('name');
+                if (qr.ignore.has(layerName) || layerName === MapConstants.DrawingLayerId)
+                    return;
+                let source = l.getSource();
+                if (!!source['getSource'])
+                    source = source?.getSource();
+                let features = this.postboy.execute(new FilterFeaturesInAreaExecutor(qr.area, source?.getFeatures() ?? []));
+                result.put(layerName, features.map((e) => ({ id: e.getId(), ...e.get(MapConstants.FeatureInfo) })));
+            });
+            qr.finish(result);
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapManagementService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapManagementService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapManagementService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: MapPostboyService }] });
+
+class MapStateService {
+    postboy;
+    map;
+    constructor(postboy) {
+        this.postboy = postboy;
+    }
+    up() {
+        this.observeMapRendering();
+        this.observeCenter();
+    }
+    observeMapRendering() {
+        this.postboy
+            .subscribe(MapRenderedEvent.ID)
+            .pipe(first())
+            .subscribe((ev) => {
+            this.map = ev.map;
+            this.map?.on('moveend', () => {
+                const zoom = Math.floor(this.map?.getView().getZoom() || -1);
+                const extent = this.map?.getView().calculateExtent() || [];
+                this.postboy.fire(new MapMoveEndEvent(zoom, extent));
+            });
+        });
+    }
+    observeCenter() {
+        this.postboy.subscribe(SetMapCenterCommand.ID).subscribe((c) => {
+            this.map?.getView().setCenter([c.lng, c.lat]);
+            if (c.zoom)
+                this.map?.getView().setZoom(c.zoom);
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapStateService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapStateService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapStateService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: MapPostboyService }] });
+
+class MapFeatureService {
+    postboy;
+    map;
+    fitPolygonsWaiting;
+    constructor(postboy) {
+        this.postboy = postboy;
+    }
+    up() {
+        this.observeMapRender();
+        this.observeFitToFeatures();
+        this.observeFitToPolygons();
+    }
+    observeMapRender() {
+        this.postboy.subscribe(MapRenderedEvent.ID).subscribe((m) => {
+            this.map = m.map;
+            if (this.fitPolygonsWaiting)
+                this.postboy.fire(this.fitPolygonsWaiting);
+        });
+    }
+    observeFitToFeatures() {
+        this.postboy.subscribe(FitToFeaturesCommand.ID).subscribe((cmd) => {
+            this.fitToGeometries(cmd.features.map((f) => f.getGeometry()), cmd.zoomAfter);
+        });
+    }
+    observeFitToPolygons() {
+        this.postboy.subscribe(FitToPolygonsCommand.ID).subscribe((cmd) => {
+            if (!this.map) {
+                this.fitPolygonsWaiting = cmd;
+                return;
+            }
+            this.fitPolygonsWaiting = undefined;
+            this.fitToGeometries(cmd.features.map((f) => f.feature.getGeometry()), cmd.zoomAfter);
+        });
+    }
+    fitToGeometries(geometries, zoomAfter) {
+        if (!geometries?.length || !this.map)
+            return;
+        const extent = createEmpty();
+        geometries.forEach((g) => extend(extent, g.getExtent()));
+        this.map.getView().fit(extent);
+        this.map.getView().setZoom(this.map.getView().getZoom() + zoomAfter);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapFeatureService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapFeatureService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapFeatureService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: MapPostboyService }] });
+
+class MapClickService {
+    postboy;
+    map;
+    constructor(postboy) {
+        this.postboy = postboy;
+    }
+    up() {
+        this.observeMapRender();
+    }
+    observeMapRender() {
+        this.postboy.subscribe(MapRenderedEvent.ID).subscribe((m) => {
+            this.map = m.map;
+            this.map?.on('singleclick', (e) => {
+                this.postboy.fire(this.onClick(e));
+            });
+        });
+    }
+    onClick(ev) {
+        const model = new MapClickEvent(ev.coordinate, {}, {});
+        this.map?.forEachFeatureAtPixel(ev.pixel, (f, l) => {
+            this.getFeatureCollectionWithInner([f])
+                .filter((f) => f.getId() != null)
+                .forEach((fs) => {
+                let layerName = l.get('name');
+                if (!model.entities[layerName])
+                    model.entities[layerName] = [];
+                if (!model.features[layerName])
+                    model.features[layerName] = [];
+                model.entities[layerName].push({ id: fs.getId(), ...fs.get(MapConstants.FeatureInfo) });
+                model.features[layerName].push(fs);
+            });
+        });
+        return model;
+    }
+    getFeatureCollectionWithInner(features) {
+        const result = [];
+        features?.forEach((f) => {
+            const innerFeatures = f.get('features');
+            innerFeatures?.length ? result.push(...innerFeatures) : result.push(f);
+        });
+        return result;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapClickService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapClickService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapClickService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: MapPostboyService }] });
+
+class DrawingService {
+    postboy;
+    drawInteraction;
+    map;
+    constructor(postboy) {
+        this.postboy = postboy;
+    }
+    up() {
+        this.observeDrawing();
+        this.observeSelectArea();
+        this.observeMapRender();
+    }
+    observeSelectArea() {
+        this.postboy.subscribe(DrawSelectionAreaCommand.ID).subscribe((ev) => {
+            const drawingCommand = new StartDrawingCommand(ev.type, ev.style);
+            drawingCommand.result.subscribe((r) => {
+                if (!r) {
+                    ev.finish(new Dictionary());
+                    return;
+                }
+                const area = PolygonModel.fromGeoJson(1, r).feature.getGeometry();
+                const getFeaturesCommand = new GetFeaturesInAreaQuery(area, ev.ignore);
+                getFeaturesCommand.result.subscribe((result) => ev.finish(result));
+                this.postboy.fire(getFeaturesCommand);
+            });
+            this.postboy.fire(drawingCommand);
+        });
+    }
+    observeDrawing() {
+        this.postboy.subscribe(StartDrawingCommand.ID).subscribe((ev) => {
+            this.draw((l) => {
+                if (!l || !this.map) {
+                    this.clearInteraction(l);
+                    return;
+                }
+                const cancelSub = this.observeCancelation(ev, l);
+                this.drawInteraction = this.postboy.execute(new GenerateDrawExecutor(l, ev.style, ev.type));
+                this.map?.addInteraction(this.drawInteraction);
+                this.drawInteraction.on('drawend', (evt) => {
+                    cancelSub.unsubscribe();
+                    this.onEnd(evt, ev, l);
+                });
+            });
+        });
+    }
+    onEnd(evt, command, layer) {
+        command.finish(command.format === FeatureOutputFormat.GeoJson
+            ? new GeoJSON().writeFeature(evt.feature)
+            : new WKT().writeFeature(evt.feature));
+        this.clearInteraction(layer);
+    }
+    observeMapRender() {
+        this.postboy.subscribe(MapRenderedEvent.ID).subscribe((m) => {
+            this.map = m.map;
+        });
+    }
+    draw(action) {
+        const query = new GetLayerQuery(MapConstants.DrawingLayerId);
+        query.result.subscribe((l) => action(l));
+        this.postboy.fire(query);
+    }
+    observeCancelation(ev, layer) {
+        return this.postboy
+            .subscribe(CancelDrawingCommand.ID)
+            .pipe(first())
+            .subscribe(() => {
+            ev.finish(null);
+            this.clearInteraction(layer);
+        });
+    }
+    clearInteraction(layer) {
+        if (!!this.drawInteraction) {
+            this.map?.removeInteraction(this.drawInteraction);
+            layer?.setSource(new Vector({}));
+        }
+        setTimeout(() => this.postboy.fire(new DrawingFinishedEvent()), 300);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: DrawingService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: DrawingService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: DrawingService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: MapPostboyService }] });
+
+class FeatureModificationService {
+    postboy;
+    modify;
+    translate;
+    map;
+    constructor(postboy) {
+        this.postboy = postboy;
+    }
+    up() {
+        this.observeModification();
+        this.observeMapRender();
+    }
+    observeModification() {
+        this.postboy.subscribe(ModifyFeatureCommand.ID).subscribe((ev) => {
+            this.defineLayer((l) => {
+                if (!l || !this.map) {
+                    this.clearInteraction(l);
+                    return;
+                }
+                this.observeCancelation(ev, l);
+                this.initFeature(l, ev.model.feature);
+                this.addModify(ev);
+                this.addDragging(ev);
+            });
+        });
+    }
+    initFeature(layer, feature) {
+        layer.getSource()?.clear();
+        layer.getSource()?.addFeature(feature);
+    }
+    addModify(command) {
+        this.modify = new Modify({
+            features: new Collection([command.model.feature]),
+            style: command.style,
+        });
+        this.modify.on('modifyend', () => {
+            this.onModified(command);
+            command.model.feature.changed();
+        });
+        this.map?.addInteraction(this.modify);
+    }
+    addDragging(command) {
+        this.translate = new Translate({
+            features: new Collection([command.model.feature]),
+            condition: (ev) => {
+                const clone = command.model.feature.clone();
+                clone.getGeometry()?.scale(0.999);
+                return clone.getGeometry().intersectsCoordinate(ev.coordinate);
+            },
+        });
+        this.translate.on('translateend', () => this.onModified(command));
+        this.map?.addInteraction(this.translate);
+    }
+    onModified(command) {
+        command.next(command.format === FeatureOutputFormat.GeoJson
+            ? new GeoJSON().writeFeature(command.model.feature)
+            : new WKT().writeFeature(command.model.feature));
+    }
+    observeMapRender() {
+        this.postboy.subscribe(MapRenderedEvent.ID).subscribe((m) => {
+            this.map = m.map;
+        });
+    }
+    defineLayer(action) {
+        const query = new GetLayerQuery(MapConstants.DrawingLayerId);
+        query.result.subscribe((l) => action(l));
+        this.postboy.fire(query);
+    }
+    observeCancelation(ev, layer) {
+        return this.postboy
+            .subscribe(CancelFeatureModificationCommand.ID)
+            .pipe(first())
+            .subscribe(() => {
+            ev.finish(null);
+            this.clearInteraction(layer);
+        });
+    }
+    clearInteraction(layer) {
+        if (this.modify)
+            this.map?.removeInteraction(this.modify);
+        if (this.translate)
+            this.map?.removeInteraction(this.translate);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FeatureModificationService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FeatureModificationService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FeatureModificationService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: MapPostboyService }] });
+
+class ControlsService {
+    postboy;
+    map;
+    constructor(postboy) {
+        this.postboy = postboy;
+    }
+    up() {
+        this.observeMapRender();
+    }
+    observeMapRender() {
+        this.postboy
+            .subscribe(MapRenderedEvent.ID)
+            .pipe(first())
+            .subscribe((m) => {
+            this.map = m.map;
+            this.observeAdding();
+            this.observeRemoving();
+        });
+    }
+    observeAdding() {
+        this.postboy.subscribe(AddControlCommand.ID).subscribe((c) => this.map?.addControl(c.item));
+    }
+    observeRemoving() {
+        this.postboy
+            .subscribe(RemoveControlCommand.ID)
+            .subscribe((c) => this.map?.removeControl(c.item));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: ControlsService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: ControlsService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: ControlsService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: MapPostboyService }] });
+
+class MessageRegistratorService extends PostboyAbstractRegistrator {
+    constructor(service, management, state, mapFeature, interaction, drawing, featureModification, controls) {
+        super(service);
+        this.registerServices([management, state, interaction, mapFeature, drawing, featureModification, controls]);
+    }
+    _up() {
+        this.registerReplay(MapRenderedEvent.ID);
+        this.registerReplay(PlaceLayerFeaturesCommand.ID);
+        this.registerReplay(RemoveControlCommand.ID);
+        this.registerReplay(AddControlCommand.ID);
+        this.registerReplay(SetMapCenterCommand.ID);
+        this.registerSubject(AddLayerCommand.ID);
+        this.registerSubject(RemoveLayerCommand.ID);
+        this.registerSubject(AddTileCommand.ID);
+        this.registerSubject(RemoveTileCommand.ID);
+        this.registerSubject(MapClickEvent.ID);
+        this.registerSubject(CloseTooltipCommand.ID);
+        this.registerSubject(FitToFeaturesCommand.ID);
+        this.registerSubject(FitToPolygonsCommand.ID);
+        this.registerSubject(MapMoveEndEvent.ID);
+        this.registerSubject(CancelDrawingCommand.ID);
+        this.registerSubject(StartDrawingCommand.ID);
+        this.registerSubject(GetLayerQuery.ID);
+        this.registerSubject(DrawingFinishedEvent.ID);
+        this.registerSubject(GetFeaturesInAreaQuery.ID);
+        this.registerSubject(DrawSelectionAreaCommand.ID);
+        this.registerSubject(CancelFeatureModificationCommand.ID);
+        this.registerSubject(ModifyFeatureCommand.ID);
+        this.setExecutors();
+    }
+    setExecutors() {
+        this.registerExecutor(FilterFeaturesInAreaExecutor.ID, (e) => FeatureService.filterFeaturesInArea(e));
+        this.registerExecutor(CalculateAreaExecutor.ID, (e) => FeatureService.calculateArea(e.polygon?.feature?.getGeometry()));
+        this.registerExecutor(GenerateDrawExecutor.ID, (e) => DrawingGenerationService.getDraw(e));
+        this.registerExecutor(GenerateZoomControlExecutor.ID, (e) => ZoomControlFactory.build(e.settings));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MessageRegistratorService, deps: [{ token: MapPostboyService }, { token: MapManagementService }, { token: MapStateService }, { token: MapFeatureService }, { token: MapClickService }, { token: DrawingService }, { token: FeatureModificationService }, { token: ControlsService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MessageRegistratorService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MessageRegistratorService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: MapPostboyService }, { type: MapManagementService }, { type: MapStateService }, { type: MapFeatureService }, { type: MapClickService }, { type: DrawingService }, { type: FeatureModificationService }, { type: ControlsService }] });
+
+class TileLayerSettings {
+    maxZoom = 19;
+    minZoom = 0;
+    opacity = 0.6;
+    url = '';
+    projection = 'EPSG:3857';
+    static copy(model) {
+        const result = new TileLayerSettings();
+        result.maxZoom = model.maxZoom;
+        result.minZoom = model.minZoom;
+        result.projection = model.projection;
+        result.opacity = model.opacity;
+        result.url = model.url;
+        return result;
+    }
+    setUrl(url) {
+        return TileLayerSettings.copy({ ...this, url });
+    }
+    setMaxZoom(maxZoom) {
+        return TileLayerSettings.copy({ ...this, maxZoom });
+    }
+    setMinZoom(minZoom) {
+        return TileLayerSettings.copy({ ...this, minZoom });
+    }
+    setOpacity(opacity) {
+        return TileLayerSettings.copy({ ...this, opacity });
+    }
+    setProjection(projection) {
+        return TileLayerSettings.copy({ ...this, projection });
+    }
+    isSame(model) {
+        if (this.maxZoom !== model.maxZoom)
+            return false;
+        if (this.minZoom !== model.minZoom)
+            return false;
+        if (this.url !== model.url)
+            return false;
+        if (this.projection !== model.projection)
+            return false;
+        if (this.opacity !== model.opacity)
+            return false;
+        return true;
+    }
+}
+
+class TileLayerFactory {
+    build(settings) {
+        const source = new XYZ({
+            tileSize: 256,
+            maxZoom: settings.maxZoom || 14,
+            minZoom: settings.minZoom || 1,
+            projection: get(settings.projection),
+            tileUrlFunction: this.getTileFunc(settings),
+            crossOrigin: 'Anonymous',
+        });
+        return new TileLayer({ source, opacity: settings.opacity });
+    }
+    getTileFunc(settings) {
+        return (tileCoord) => {
+            const zoom = tileCoord[0];
+            const x = tileCoord[1];
+            const y = tileCoord[2];
+            const normalizedCoord = this.getNormalizedCoord({ x: x, y: y }, zoom);
+            const bound = 1 << zoom;
+            return settings.url
+                .replace('{x}', String(normalizedCoord?.x || x))
+                .replace('{z}', String(zoom))
+                .replace('{y}', String(bound - (normalizedCoord?.y || y) - 1));
+        };
+    }
+    getNormalizedCoord(coord, zoom) {
+        const y = coord.y;
+        let x = coord.x;
+        const tileRange = 1 << zoom;
+        if (y < 0 || y >= tileRange)
+            return null;
+        if (x < 0 || x >= tileRange)
+            x = ((x % tileRange) + tileRange) % tileRange;
+        return { x: x, y: y };
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: TileLayerFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: TileLayerFactory, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: TileLayerFactory, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
         }] });
 
-class TileLayerComponent extends DestructibleComponent {
-    postboy;
-    factory;
-    layer;
-    constructor(postboy, factory) {
-        super();
-        this.postboy = postboy;
-        this.factory = factory;
-    }
-    ngOnInit() {
-        this.postboy
-            .subscribe(MapRenderedEvent.ID)
-            .pipe(filter((m) => !!m), first())
-            .subscribe((m) => this.initLayer());
-    }
-    _settings = new TileLayerSettings();
-    set settings(value) {
-        if (!value || this._settings.isSame(value))
-            return;
-        this._settings = value;
-        this.initLayer();
-    }
-    onDestroy = () => this.removeLayer();
-    initLayer() {
-        this.removeLayer();
-        this.layer = this.factory.build(this._settings);
-        this.postboy.fire(new AddTileCommand(this.layer));
-    }
-    removeLayer() {
-        if (this.layer)
-            this.postboy.fire(new RemoveTileCommand(this.layer));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayerComponent, deps: [{ token: MapPostboyService }, { token: TileLayerFactory }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TileLayerComponent, selector: "art-tile-layer", inputs: { settings: "settings" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TileLayerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'art-tile-layer', template: '', changeDetection: ChangeDetectionStrategy.OnPush }]
-        }], ctorParameters: function () { return [{ type: MapPostboyService }, { type: TileLayerFactory }]; }, propDecorators: { settings: [{
-                type: Input
+class TileLayerComponent extends DestructibleComponent {
+    postboy;
+    factory;
+    layer;
+    constructor(postboy, factory) {
+        super();
+        this.postboy = postboy;
+        this.factory = factory;
+    }
+    ngOnInit() {
+        this.postboy
+            .subscribe(MapRenderedEvent.ID)
+            .pipe(filter((m) => !!m), first())
+            .subscribe((m) => this.initLayer());
+    }
+    _settings = new TileLayerSettings();
+    set settings(value) {
+        if (!value || this._settings.isSame(value))
+            return;
+        this._settings = value;
+        this.initLayer();
+    }
+    onDestroy = () => this.removeLayer();
+    initLayer() {
+        this.removeLayer();
+        this.layer = this.factory.build(this._settings);
+        this.postboy.fire(new AddTileCommand(this.layer));
+    }
+    removeLayer() {
+        if (this.layer)
+            this.postboy.fire(new RemoveTileCommand(this.layer));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: TileLayerComponent, deps: [{ token: MapPostboyService }, { token: TileLayerFactory }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: TileLayerComponent, selector: "art-tile-layer", inputs: { settings: "settings" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: TileLayerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'art-tile-layer', template: '', changeDetection: ChangeDetectionStrategy.OnPush }]
+        }], ctorParameters: () => [{ type: MapPostboyService }, { type: TileLayerFactory }], propDecorators: { settings: [{
+                type: Input
             }] } });
 
-class OsmTileLayerComponent extends DestructibleComponent {
-    layer;
-    constructor() {
-        super();
-    }
-    _url = '';
-    set url(value) {
-        if (!value || this._url === value)
-            return;
-        this._url = value;
-        this.initLayer();
-    }
-    _map;
-    set map(value) {
-        if (!value || this._map === value)
-            return;
-        this._map = value;
-        this.initLayer();
-    }
-    ngOnInit() { }
-    ngOnDestroy() {
-        if (this.layer) {
-            this._map?.removeLayer(this.layer);
-        }
-        // @ts-ignore
-        this.layer?.setMap(null);
-    }
-    initLayer() {
-        if (!this._url || !this._map)
-            return;
-        if (this.layer)
-            this._map.removeLayer(this.layer);
-        this.layer = new TileLayer({
-            source: new OSM({
-                url: this._url,
-            }),
-        });
-        this.layer.set('name', 'osm-tile-layer');
-        this._map.addLayer(this.layer);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OsmTileLayerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OsmTileLayerComponent, selector: "art-osm-tile-layer", inputs: { url: "url", map: "map" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OsmTileLayerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'art-osm-tile-layer', template: '', changeDetection: ChangeDetectionStrategy.OnPush }]
-        }], ctorParameters: function () { return []; }, propDecorators: { url: [{
-                type: Input
-            }], map: [{
-                type: Input
+class OsmTileLayerComponent extends DestructibleComponent {
+    layer;
+    constructor() {
+        super();
+    }
+    _url = '';
+    set url(value) {
+        if (!value || this._url === value)
+            return;
+        this._url = value;
+        this.initLayer();
+    }
+    _map;
+    set map(value) {
+        if (!value || this._map === value)
+            return;
+        this._map = value;
+        this.initLayer();
+    }
+    ngOnInit() { }
+    ngOnDestroy() {
+        if (this.layer) {
+            this._map?.removeLayer(this.layer);
+        }
+        // @ts-ignore
+        this.layer?.setMap(null);
+    }
+    initLayer() {
+        if (!this._url || !this._map)
+            return;
+        if (this.layer)
+            this._map.removeLayer(this.layer);
+        this.layer = new TileLayer({
+            source: new OSM({
+                url: this._url,
+            }),
+        });
+        this.layer.set('name', 'osm-tile-layer');
+        this._map.addLayer(this.layer);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: OsmTileLayerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: OsmTileLayerComponent, selector: "art-osm-tile-layer", inputs: { url: "url", map: "map" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: OsmTileLayerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'art-osm-tile-layer', template: '', changeDetection: ChangeDetectionStrategy.OnPush }]
+        }], ctorParameters: () => [], propDecorators: { url: [{
+                type: Input
+            }], map: [{
+                type: Input
             }] } });
 
-/**
- * A layer that is responsible for showing and styling main features on the map, such as markers and polygons
- */
-class FeatureLayerSettings {
-    /**
-     * The identifier of the field, it is autogenerated by default, but can be set manually
-     */
-    name = IdGenerator.get();
-    /**
-     * The priority of showing - layers with higher zIndex cover others in case of collisions
-     */
-    zIndex = 1;
-    /**
-     * The maximum zoom at which the layer is visible. 19 by default
-     */
-    maxZoom = 19;
-    /**
-     * The minimum zoom at which the layer is visible. 0 by default
-     */
-    minZoom = 0;
-    /**
-     * The styling definition of layer's features. The easiest way is to use {@link PolygonStyleHelper},{@link MarkerStyleHelper}
-     */
-    style;
-    /**
-     * Creates a clone of the existing settings
-     * @param model
-     */
-    static copy(model) {
-        const result = new FeatureLayerSettings();
-        result.name = model.name;
-        result.maxZoom = model.maxZoom;
-        result.minZoom = model.minZoom;
-        result.zIndex = model.zIndex;
-        result.style = model.style;
-        return result;
-    }
-    /**
-     Setter for {@link FeatureLayerSettings.zIndex}
-     * @param zIndex
-     */
-    setZIndex(zIndex) {
-        return FeatureLayerSettings.copy({ ...this, zIndex });
-    }
-    /**
-     * Setter for {@link FeatureLayerSettings.name}
-     * @param name
-     */
-    setName(name) {
-        return FeatureLayerSettings.copy({ ...this, name });
-    }
-    /**
-     * Setter for {@link FeatureLayerSettings.maxZoom}
-     * @param maxZoom
-     */
-    setMaxZoom(maxZoom) {
-        return FeatureLayerSettings.copy({ ...this, maxZoom });
-    }
-    /**
-     * Setter for {@link FeatureLayerSettings.minZoom}
-     * @param minZoom
-     */
-    setMinZoom(minZoom) {
-        return FeatureLayerSettings.copy({ ...this, minZoom });
-    }
-    /**
-     * Setter for {@link FeatureLayerSettings.style}
-     * @param style
-     */
-    setStyle(style) {
-        return FeatureLayerSettings.copy({ ...this, style });
-    }
-    /**
-     * Checks if the model has the same content
-     * @param model - the object to compare
-     */
-    isSame(model) {
-        if (this.maxZoom !== model.maxZoom)
-            return false;
-        if (this.minZoom !== model.minZoom)
-            return false;
-        if (this.zIndex !== model.zIndex)
-            return false;
-        if (this.name !== model.name)
-            return false;
-        if (this.style !== model.style)
-            return false;
-        return true;
-    }
-}
-
-class FeatureLayerFactory {
-    build(settings) {
-        const source = new Vector({});
-        const layer = new Vector$1({
-            source: source,
-            maxZoom: settings.maxZoom,
-            minZoom: settings.minZoom,
-            zIndex: settings.zIndex,
-        });
-        if (settings.style)
-            layer.setStyle(settings.style);
-        layer.set('name', settings.name);
-        return layer;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FeatureLayerFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FeatureLayerFactory, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FeatureLayerFactory, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
+/**
+ * A layer that is responsible for showing and styling main features on the map, such as markers and polygons
+ */
+class FeatureLayerSettings {
+    /**
+     * The identifier of the field, it is autogenerated by default, but can be set manually
+     */
+    name = IdGenerator.get();
+    /**
+     * The priority of showing - layers with higher zIndex cover others in case of collisions
+     */
+    zIndex = 1;
+    /**
+     * The maximum zoom at which the layer is visible. 19 by default
+     */
+    maxZoom = 19;
+    /**
+     * The minimum zoom at which the layer is visible. 0 by default
+     */
+    minZoom = 0;
+    /**
+     * The styling definition of layer's features. The easiest way is to use {@link PolygonStyleHelper},{@link MarkerStyleHelper}
+     */
+    style;
+    /**
+     * Creates a clone of the existing settings
+     * @param model
+     */
+    static copy(model) {
+        const result = new FeatureLayerSettings();
+        result.name = model.name;
+        result.maxZoom = model.maxZoom;
+        result.minZoom = model.minZoom;
+        result.zIndex = model.zIndex;
+        result.style = model.style;
+        return result;
+    }
+    /**
+     Setter for {@link FeatureLayerSettings.zIndex}
+     * @param zIndex
+     */
+    setZIndex(zIndex) {
+        return FeatureLayerSettings.copy({ ...this, zIndex });
+    }
+    /**
+     * Setter for {@link FeatureLayerSettings.name}
+     * @param name
+     */
+    setName(name) {
+        return FeatureLayerSettings.copy({ ...this, name });
+    }
+    /**
+     * Setter for {@link FeatureLayerSettings.maxZoom}
+     * @param maxZoom
+     */
+    setMaxZoom(maxZoom) {
+        return FeatureLayerSettings.copy({ ...this, maxZoom });
+    }
+    /**
+     * Setter for {@link FeatureLayerSettings.minZoom}
+     * @param minZoom
+     */
+    setMinZoom(minZoom) {
+        return FeatureLayerSettings.copy({ ...this, minZoom });
+    }
+    /**
+     * Setter for {@link FeatureLayerSettings.style}
+     * @param style
+     */
+    setStyle(style) {
+        return FeatureLayerSettings.copy({ ...this, style });
+    }
+    /**
+     * Checks if the model has the same content
+     * @param model - the object to compare
+     */
+    isSame(model) {
+        if (this.maxZoom !== model.maxZoom)
+            return false;
+        if (this.minZoom !== model.minZoom)
+            return false;
+        if (this.zIndex !== model.zIndex)
+            return false;
+        if (this.name !== model.name)
+            return false;
+        if (this.style !== model.style)
+            return false;
+        return true;
+    }
+}
+
+class FeatureLayerFactory {
+    build(settings) {
+        const source = new Vector({});
+        const layer = new Vector$1({
+            source: source,
+            maxZoom: settings.maxZoom,
+            minZoom: settings.minZoom,
+            zIndex: settings.zIndex,
+        });
+        if (settings.style)
+            layer.setStyle(settings.style);
+        layer.set('name', settings.name);
+        return layer;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FeatureLayerFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FeatureLayerFactory, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FeatureLayerFactory, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
         }] });
 
-class FeatureLayerComponent extends DestructibleComponent {
-    postboy;
-    factory;
-    layer = null;
-    _settings = new FeatureLayerSettings();
-    constructor(postboy, factory) {
-        super();
-        this.postboy = postboy;
-        this.factory = factory;
-    }
-    ngOnInit() {
-        this.postboy
-            .subscribe(MapRenderedEvent.ID)
-            .pipe(filter((m) => !!m), first())
-            .subscribe((m) => this.initLayer());
-    }
-    set settings(value) {
-        if (!value || this._settings.isSame(value))
-            return;
-        this._settings = value;
-        this.initLayer();
-    }
-    onDestroy = () => this.removeLayer();
-    initLayer() {
-        this.removeLayer();
-        this.layer = this.factory.build(this._settings);
-        this.postboy.fire(new AddLayerCommand(this.layer));
-    }
-    removeLayer() {
-        if (this.layer)
-            this.postboy.fire(new RemoveLayerCommand(this.layer));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FeatureLayerComponent, deps: [{ token: MapPostboyService }, { token: FeatureLayerFactory }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FeatureLayerComponent, selector: "art-feature-layer", inputs: { settings: "settings" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FeatureLayerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'art-feature-layer', template: '', changeDetection: ChangeDetectionStrategy.OnPush }]
-        }], ctorParameters: function () { return [{ type: MapPostboyService }, { type: FeatureLayerFactory }]; }, propDecorators: { settings: [{
-                type: Input
+class FeatureLayerComponent extends DestructibleComponent {
+    postboy;
+    factory;
+    layer = null;
+    _settings = new FeatureLayerSettings();
+    constructor(postboy, factory) {
+        super();
+        this.postboy = postboy;
+        this.factory = factory;
+    }
+    ngOnInit() {
+        this.postboy
+            .subscribe(MapRenderedEvent.ID)
+            .pipe(filter((m) => !!m), first())
+            .subscribe((m) => this.initLayer());
+    }
+    set settings(value) {
+        if (!value || this._settings.isSame(value))
+            return;
+        this._settings = value;
+        this.initLayer();
+    }
+    onDestroy = () => this.removeLayer();
+    initLayer() {
+        this.removeLayer();
+        this.layer = this.factory.build(this._settings);
+        this.postboy.fire(new AddLayerCommand(this.layer));
+    }
+    removeLayer() {
+        if (this.layer)
+            this.postboy.fire(new RemoveLayerCommand(this.layer));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FeatureLayerComponent, deps: [{ token: MapPostboyService }, { token: FeatureLayerFactory }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FeatureLayerComponent, selector: "art-feature-layer", inputs: { settings: "settings" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FeatureLayerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'art-feature-layer', template: '', changeDetection: ChangeDetectionStrategy.OnPush }]
+        }], ctorParameters: () => [{ type: MapPostboyService }, { type: FeatureLayerFactory }], propDecorators: { settings: [{
+                type: Input
             }] } });
 
-class ClusterLayerSettings {
-    name = IdGenerator.get();
-    zIndex = 1;
-    maxZoom = 19;
-    minZoom = 0;
-    distance = 20;
-    bbox = false;
-    clusterCancel = 14;
-    style;
-    static copy(model) {
-        const result = new ClusterLayerSettings();
-        result.name = model.name;
-        result.maxZoom = model.maxZoom;
-        result.minZoom = model.minZoom;
-        result.zIndex = model.zIndex;
-        result.bbox = model.bbox;
-        result.clusterCancel = model.clusterCancel;
-        result.distance = model.distance;
-        result.style = model.style;
-        return result;
-    }
-    setZIndex(zIndex) {
-        return ClusterLayerSettings.copy({ ...this, zIndex });
-    }
-    setDistance(distance) {
-        return ClusterLayerSettings.copy({ ...this, distance });
-    }
-    setName(name) {
-        return ClusterLayerSettings.copy({ ...this, name });
-    }
-    setMaxZoom(maxZoom) {
-        return ClusterLayerSettings.copy({ ...this, maxZoom });
-    }
-    setMinZoom(minZoom) {
-        return ClusterLayerSettings.copy({ ...this, minZoom });
-    }
-    setClusterCancel(clusterCancel) {
-        return ClusterLayerSettings.copy({ ...this, clusterCancel });
-    }
-    setBbox(bbox) {
-        return ClusterLayerSettings.copy({ ...this, bbox });
-    }
-    setStyle(style) {
-        return ClusterLayerSettings.copy({ ...this, style });
-    }
-    isSame(model) {
-        if (this.maxZoom !== model.maxZoom)
-            return false;
-        if (this.minZoom !== model.minZoom)
-            return false;
-        if (this.zIndex !== model.zIndex)
-            return false;
-        if (this.name !== model.name)
-            return false;
-        if (this.distance !== model.distance)
-            return false;
-        if (this.clusterCancel !== model.clusterCancel)
-            return false;
-        if (this.bbox !== model.bbox)
-            return false;
-        if (this.style !== model.style)
-            return false;
-        return true;
-    }
-}
-
-class ClusterLayerManager {
-    settings;
-    layer;
-    postboy;
-    constructor(settings, layer, postboy) {
-        this.settings = settings;
-        this.layer = layer;
-        this.postboy = postboy;
-        this.observeClick();
-        this.observeMapMovement();
-    }
-    observeMapMovement() {
-        combineLatest([
-            this.postboy.subscribe(MapMoveEndEvent.ID).pipe(auditTime(250)),
-            this.postboy.subscribe(MapRenderedEvent.ID),
-        ]).subscribe(([movement, renderEvent]) => {
-            this.checkClusterNecessity(renderEvent.map);
-        });
-    }
-    observeClick() {
-        this.postboy.subscribe(MapClickEvent.ID).subscribe((m) => {
-            if ((m.features[this.settings.name]?.length ?? 0) > 1) {
-                this.postboy.fire(new FitToFeaturesCommand(m.features[this.settings.name], -1));
-            }
-        });
-    }
-    checkClusterNecessity(map) {
-        let zoom = map.getView().getZoom() ?? 0;
-        const distance = zoom > this.settings.clusterCancel ? 0 : this.settings.distance;
-        this.layer?.getSource()?.setDistance(distance);
-    }
-}
-
-class ClusterLayerFactory {
-    build(settings, postboy) {
-        const source = new Vector({
-            strategy: settings.bbox ? bbox : undefined,
-        });
-        const cluster = new Cluster({
-            distance: settings.distance,
-            source: source,
-            geometryFunction: (feature) => {
-                const geom = feature.getGeometry();
-                if (geom?.getType() == 'Point') {
-                    return geom;
-                }
-                else if (geom?.getType() == 'Polygon') {
-                    return geom?.getInteriorPoint();
-                }
-                else if (geom?.getType() == 'MultiPolygon') {
-                    return fromExtent(geom.getExtent())?.getInteriorPoint();
-                }
-                return undefined;
-            },
-        });
-        const layer = new Vector$1({
-            source: cluster,
-            maxZoom: settings.maxZoom || undefined,
-            minZoom: settings.minZoom || undefined,
-            zIndex: settings.zIndex || 0,
-        });
-        layer.setStyle(this.styleFunc(settings));
-        layer.set('name', settings.name);
-        return new ClusterLayerManager(settings, layer, postboy);
-    }
-    styleFunc(settings) {
-        return (feature) => {
-            const features = feature.get('features');
-            if (!settings.style)
-                return undefined;
-            return settings.style(features.map((f) => ({ id: f.getId(), ...f.get(MapConstants.FeatureInfo) })));
-        };
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ClusterLayerFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ClusterLayerFactory, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ClusterLayerFactory, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
+class ClusterLayerSettings {
+    name = IdGenerator.get();
+    zIndex = 1;
+    maxZoom = 19;
+    minZoom = 0;
+    distance = 20;
+    bbox = false;
+    clusterCancel = 14;
+    style;
+    static copy(model) {
+        const result = new ClusterLayerSettings();
+        result.name = model.name;
+        result.maxZoom = model.maxZoom;
+        result.minZoom = model.minZoom;
+        result.zIndex = model.zIndex;
+        result.bbox = model.bbox;
+        result.clusterCancel = model.clusterCancel;
+        result.distance = model.distance;
+        result.style = model.style;
+        return result;
+    }
+    setZIndex(zIndex) {
+        return ClusterLayerSettings.copy({ ...this, zIndex });
+    }
+    setDistance(distance) {
+        return ClusterLayerSettings.copy({ ...this, distance });
+    }
+    setName(name) {
+        return ClusterLayerSettings.copy({ ...this, name });
+    }
+    setMaxZoom(maxZoom) {
+        return ClusterLayerSettings.copy({ ...this, maxZoom });
+    }
+    setMinZoom(minZoom) {
+        return ClusterLayerSettings.copy({ ...this, minZoom });
+    }
+    setClusterCancel(clusterCancel) {
+        return ClusterLayerSettings.copy({ ...this, clusterCancel });
+    }
+    setBbox(bbox) {
+        return ClusterLayerSettings.copy({ ...this, bbox });
+    }
+    setStyle(style) {
+        return ClusterLayerSettings.copy({ ...this, style });
+    }
+    isSame(model) {
+        if (this.maxZoom !== model.maxZoom)
+            return false;
+        if (this.minZoom !== model.minZoom)
+            return false;
+        if (this.zIndex !== model.zIndex)
+            return false;
+        if (this.name !== model.name)
+            return false;
+        if (this.distance !== model.distance)
+            return false;
+        if (this.clusterCancel !== model.clusterCancel)
+            return false;
+        if (this.bbox !== model.bbox)
+            return false;
+        if (this.style !== model.style)
+            return false;
+        return true;
+    }
+}
+
+class ClusterLayerManager {
+    settings;
+    layer;
+    postboy;
+    constructor(settings, layer, postboy) {
+        this.settings = settings;
+        this.layer = layer;
+        this.postboy = postboy;
+        this.observeClick();
+        this.observeMapMovement();
+    }
+    observeMapMovement() {
+        combineLatest([
+            this.postboy.subscribe(MapMoveEndEvent.ID).pipe(auditTime(250)),
+            this.postboy.subscribe(MapRenderedEvent.ID),
+        ]).subscribe(([movement, renderEvent]) => {
+            this.checkClusterNecessity(renderEvent.map);
+        });
+    }
+    observeClick() {
+        this.postboy.subscribe(MapClickEvent.ID).subscribe((m) => {
+            if ((m.features[this.settings.name]?.length ?? 0) > 1) {
+                this.postboy.fire(new FitToFeaturesCommand(m.features[this.settings.name], -1));
+            }
+        });
+    }
+    checkClusterNecessity(map) {
+        let zoom = map.getView().getZoom() ?? 0;
+        const distance = zoom > this.settings.clusterCancel ? 0 : this.settings.distance;
+        this.layer?.getSource()?.setDistance(distance);
+    }
+}
+
+class ClusterLayerFactory {
+    build(settings, postboy) {
+        const source = new Vector({
+            strategy: settings.bbox ? bbox : undefined,
+        });
+        const cluster = new Cluster({
+            distance: settings.distance,
+            source: source,
+            geometryFunction: (feature) => {
+                const geom = feature.getGeometry();
+                if (geom?.getType() == 'Point') {
+                    return geom;
+                }
+                else if (geom?.getType() == 'Polygon') {
+                    return geom?.getInteriorPoint();
+                }
+                else if (geom?.getType() == 'MultiPolygon') {
+                    return fromExtent(geom.getExtent())?.getInteriorPoint();
+                }
+                return undefined;
+            },
+        });
+        const layer = new Vector$1({
+            source: cluster,
+            maxZoom: settings.maxZoom || undefined,
+            minZoom: settings.minZoom || undefined,
+            zIndex: settings.zIndex || 0,
+        });
+        layer.setStyle(this.styleFunc(settings));
+        layer.set('name', settings.name);
+        return new ClusterLayerManager(settings, layer, postboy);
+    }
+    styleFunc(settings) {
+        return (feature) => {
+            const features = feature.get('features');
+            if (!settings.style)
+                return undefined;
+            return settings.style(features.map((f) => ({ id: f.getId(), ...f.get(MapConstants.FeatureInfo) })));
+        };
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: ClusterLayerFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: ClusterLayerFactory, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: ClusterLayerFactory, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
         }] });
 
-class ClusterLayerComponent extends DestructibleComponent {
-    postboy;
-    factory;
-    manager = null;
-    _settings = new ClusterLayerSettings();
-    constructor(postboy, factory) {
-        super();
-        this.postboy = postboy;
-        this.factory = factory;
-    }
-    ngOnInit() {
-        this.postboy
-            .subscribe(MapRenderedEvent.ID)
-            .pipe(filter((m) => !!m), first())
-            .subscribe((m) => this.initLayer());
-    }
-    set settings(value) {
-        if (!value || this._settings.isSame(value))
-            return;
-        this._settings = value;
-        this.initLayer();
-    }
-    onDestroy = () => this.removeLayer();
-    initLayer() {
-        this.removeLayer();
-        this.manager = this.factory.build(this._settings, this.postboy);
-        this.postboy.fire(new AddLayerCommand(this.manager.layer));
-    }
-    removeLayer() {
-        if (this.manager?.layer)
-            this.postboy.fire(new RemoveLayerCommand(this.manager.layer));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ClusterLayerComponent, deps: [{ token: MapPostboyService }, { token: ClusterLayerFactory }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ClusterLayerComponent, selector: "art-cluster-layer", inputs: { settings: "settings" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ClusterLayerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'art-cluster-layer', template: '', changeDetection: ChangeDetectionStrategy.OnPush }]
-        }], ctorParameters: function () { return [{ type: MapPostboyService }, { type: ClusterLayerFactory }]; }, propDecorators: { settings: [{
-                type: Input
+class ClusterLayerComponent extends DestructibleComponent {
+    postboy;
+    factory;
+    manager = null;
+    _settings = new ClusterLayerSettings();
+    constructor(postboy, factory) {
+        super();
+        this.postboy = postboy;
+        this.factory = factory;
+    }
+    ngOnInit() {
+        this.postboy
+            .subscribe(MapRenderedEvent.ID)
+            .pipe(filter((m) => !!m), first())
+            .subscribe((m) => this.initLayer());
+    }
+    set settings(value) {
+        if (!value || this._settings.isSame(value))
+            return;
+        this._settings = value;
+        this.initLayer();
+    }
+    onDestroy = () => this.removeLayer();
+    initLayer() {
+        this.removeLayer();
+        this.manager = this.factory.build(this._settings, this.postboy);
+        this.postboy.fire(new AddLayerCommand(this.manager.layer));
+    }
+    removeLayer() {
+        if (this.manager?.layer)
+            this.postboy.fire(new RemoveLayerCommand(this.manager.layer));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: ClusterLayerComponent, deps: [{ token: MapPostboyService }, { token: ClusterLayerFactory }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: ClusterLayerComponent, selector: "art-cluster-layer", inputs: { settings: "settings" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: ClusterLayerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'art-cluster-layer', template: '', changeDetection: ChangeDetectionStrategy.OnPush }]
+        }], ctorParameters: () => [{ type: MapPostboyService }, { type: ClusterLayerFactory }], propDecorators: { settings: [{
+                type: Input
             }] } });
 
-class MapPlateFactory {
-    build(settings) {
-        return new Map({
-            controls: [],
-            view: new View({
-                center: settings?.center || [0, 0],
-                zoom: settings?.zoom || 4,
-                minZoom: settings?.minZoom || 0,
-                maxZoom: settings?.maxZoom || 19,
-            }),
-            layers: [],
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapPlateFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapPlateFactory, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapPlateFactory, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
+class MapPlateFactory {
+    build(settings) {
+        return new Map({
+            controls: [],
+            view: new View({
+                center: settings?.center || [0, 0],
+                zoom: settings?.zoom || 4,
+                minZoom: settings?.minZoom || 0,
+                maxZoom: settings?.maxZoom || 19,
+            }),
+            layers: [],
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapPlateFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapPlateFactory, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapPlateFactory, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
         }] });
 
-class MapPlateComponent extends DestructibleComponent {
-    elementRef;
-    postboy;
-    mapFactory;
-    registrator;
-    detector;
-    map;
-    osmUrl = '';
-    constructor(elementRef, postboy, mapFactory, registrator, detector) {
-        super();
-        this.elementRef = elementRef;
-        this.postboy = postboy;
-        this.mapFactory = mapFactory;
-        this.registrator = registrator;
-        this.detector = detector;
-        registrator.up();
-    }
-    _settings = new MapSettings();
-    drawingLayerSettings = new FeatureLayerSettings().setName(MapConstants.DrawingLayerId);
-    set settings(value) {
-        if (!value || this._settings.isSame(value))
-            return;
-        this._settings = value;
-        this.setOsm();
-    }
-    ngOnInit() {
-        useGeographic();
-        this.map = this.mapFactory.build(this._settings);
-        this.map.setTarget(this.elementRef.nativeElement);
-        this.detector.detectChanges();
-        this.map.once('postrender', () => {
-            this.map.updateSize();
-            this.postboy.fire(new MapRenderedEvent(this.map));
-        });
-        this.setOsm();
-    }
-    setOsm() {
-        if (!this.map)
-            return;
-        this.osmUrl = `https://mt{0-3}.google.com/vt/lyrs=${MapLyrsLabel.get(this._settings.lyrs)}&hl=${this._settings.language}&x={x}&y={y}&z={z}`;
-        this.detector.detectChanges();
-        this.map.updateSize();
-    }
-    onDestroy = () => {
-        this.registrator.down();
-    };
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapPlateComponent, deps: [{ token: i0.ElementRef }, { token: MapPostboyService }, { token: MapPlateFactory }, { token: MessageRegistratorService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: MapPlateComponent, selector: "art-map-plate", inputs: { settings: "settings" }, providers: [
-            MessageRegistratorService,
-            MapStateService,
-            MapManagementService,
-            MapClickService,
-            MapFeatureService,
-            DrawingService,
-            DrawingGenerationService,
-            FeatureService,
-            FeatureModificationService,
-            ControlsService,
-        ], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\r\n<art-osm-tile-layer *ngIf=\"osmUrl && map\" [map]=\"map\" [url]=\"osmUrl\"></art-osm-tile-layer>\r\n<art-feature-layer *ngIf=\"map\" [settings]=\"drawingLayerSettings\"></art-feature-layer>\r\n", styles: ["art-map-plate{position:relative;display:flex;flex-direction:column;height:100%}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: OsmTileLayerComponent, selector: "art-osm-tile-layer", inputs: ["url", "map"] }, { kind: "component", type: FeatureLayerComponent, selector: "art-feature-layer", inputs: ["settings"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapPlateComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'art-map-plate', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
-                        MessageRegistratorService,
-                        MapStateService,
-                        MapManagementService,
-                        MapClickService,
-                        MapFeatureService,
-                        DrawingService,
-                        DrawingGenerationService,
-                        FeatureService,
-                        FeatureModificationService,
-                        ControlsService,
-                    ], template: "<ng-content></ng-content>\r\n<art-osm-tile-layer *ngIf=\"osmUrl && map\" [map]=\"map\" [url]=\"osmUrl\"></art-osm-tile-layer>\r\n<art-feature-layer *ngIf=\"map\" [settings]=\"drawingLayerSettings\"></art-feature-layer>\r\n", styles: ["art-map-plate{position:relative;display:flex;flex-direction:column;height:100%}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: MapPostboyService }, { type: MapPlateFactory }, { type: MessageRegistratorService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { settings: [{
-                type: Input
+class MapPlateComponent extends DestructibleComponent {
+    elementRef;
+    postboy;
+    mapFactory;
+    registrator;
+    detector;
+    map;
+    osmUrl = '';
+    constructor(elementRef, postboy, mapFactory, registrator, detector) {
+        super();
+        this.elementRef = elementRef;
+        this.postboy = postboy;
+        this.mapFactory = mapFactory;
+        this.registrator = registrator;
+        this.detector = detector;
+        registrator.up();
+    }
+    _settings = new MapSettings();
+    drawingLayerSettings = new FeatureLayerSettings().setName(MapConstants.DrawingLayerId);
+    set settings(value) {
+        if (!value || this._settings.isSame(value))
+            return;
+        this._settings = value;
+        this.setOsm();
+    }
+    ngOnInit() {
+        useGeographic();
+        this.map = this.mapFactory.build(this._settings);
+        this.map.setTarget(this.elementRef.nativeElement);
+        this.detector.detectChanges();
+        this.map.once('postrender', () => {
+            this.map.updateSize();
+            this.postboy.fire(new MapRenderedEvent(this.map));
+        });
+        this.setOsm();
+    }
+    setOsm() {
+        if (!this.map)
+            return;
+        this.osmUrl = `https://mt{0-3}.google.com/vt/lyrs=${MapLyrsLabel.get(this._settings.lyrs)}&hl=${this._settings.language}&x={x}&y={y}&z={z}`;
+        this.detector.detectChanges();
+        this.map.updateSize();
+    }
+    onDestroy = () => {
+        this.registrator.down();
+    };
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapPlateComponent, deps: [{ token: i0.ElementRef }, { token: MapPostboyService }, { token: MapPlateFactory }, { token: MessageRegistratorService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: MapPlateComponent, selector: "art-map-plate", inputs: { settings: "settings" }, providers: [
+            MessageRegistratorService,
+            MapStateService,
+            MapManagementService,
+            MapClickService,
+            MapFeatureService,
+            DrawingService,
+            DrawingGenerationService,
+            FeatureService,
+            FeatureModificationService,
+            ControlsService,
+        ], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\r\n<art-osm-tile-layer *ngIf=\"osmUrl && map\" [map]=\"map\" [url]=\"osmUrl\"></art-osm-tile-layer>\r\n<art-feature-layer *ngIf=\"map\" [settings]=\"drawingLayerSettings\"></art-feature-layer>\r\n", styles: ["art-map-plate{position:relative;display:flex;flex-direction:column;height:100%}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: OsmTileLayerComponent, selector: "art-osm-tile-layer", inputs: ["url", "map"] }, { kind: "component", type: FeatureLayerComponent, selector: "art-feature-layer", inputs: ["settings"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapPlateComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'art-map-plate', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        MessageRegistratorService,
+                        MapStateService,
+                        MapManagementService,
+                        MapClickService,
+                        MapFeatureService,
+                        DrawingService,
+                        DrawingGenerationService,
+                        FeatureService,
+                        FeatureModificationService,
+                        ControlsService,
+                    ], template: "<ng-content></ng-content>\r\n<art-osm-tile-layer *ngIf=\"osmUrl && map\" [map]=\"map\" [url]=\"osmUrl\"></art-osm-tile-layer>\r\n<art-feature-layer *ngIf=\"map\" [settings]=\"drawingLayerSettings\"></art-feature-layer>\r\n", styles: ["art-map-plate{position:relative;display:flex;flex-direction:column;height:100%}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: MapPostboyService }, { type: MapPlateFactory }, { type: MessageRegistratorService }, { type: i0.ChangeDetectorRef }], propDecorators: { settings: [{
+                type: Input
             }] } });
 
-class MarkersComponent extends DestructibleComponent {
-    postboy;
-    layerName = '';
-    constructor(postboy) {
-        super();
-        this.postboy = postboy;
-    }
-    _markers = [];
-    set markers(value) {
-        this._markers = value ?? [];
-        this.putMarkers();
-    }
-    ngOnInit() {
-        this.postboy
-            .subscribe(MapRenderedEvent.ID)
-            .pipe(filter((m) => !!m), first())
-            .subscribe(() => this.putMarkers());
-    }
-    putMarkers() {
-        if (!this._markers)
-            return;
-        this.postboy.fire(new PlaceLayerFeaturesCommand(this.layerName, this._markers.map((m) => m.feature)));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MarkersComponent, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: MarkersComponent, selector: "art-markers", inputs: { layerName: "layerName", markers: "markers" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MarkersComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'art-markers', template: '', changeDetection: ChangeDetectionStrategy.OnPush }]
-        }], ctorParameters: function () { return [{ type: MapPostboyService }]; }, propDecorators: { layerName: [{
-                type: Input
-            }], markers: [{
-                type: Input
+class MarkersComponent extends DestructibleComponent {
+    postboy;
+    layerName = '';
+    constructor(postboy) {
+        super();
+        this.postboy = postboy;
+    }
+    _markers = [];
+    set markers(value) {
+        this._markers = value ?? [];
+        this.putMarkers();
+    }
+    ngOnInit() {
+        this.postboy
+            .subscribe(MapRenderedEvent.ID)
+            .pipe(filter((m) => !!m), first())
+            .subscribe(() => this.putMarkers());
+    }
+    putMarkers() {
+        if (!this._markers)
+            return;
+        this.postboy.fire(new PlaceLayerFeaturesCommand(this.layerName, this._markers.map((m) => m.feature)));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MarkersComponent, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: MarkersComponent, selector: "art-markers", inputs: { layerName: "layerName", markers: "markers" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MarkersComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'art-markers', template: '', changeDetection: ChangeDetectionStrategy.OnPush }]
+        }], ctorParameters: () => [{ type: MapPostboyService }], propDecorators: { layerName: [{
+                type: Input
+            }], markers: [{
+                type: Input
             }] } });
 
-class TooltipSettings {
-    id;
-    containerClass = 'custom-tooltip-class';
-    show = (e) => true;
-    constructor(id) {
-        this.id = id ?? IdGenerator.get();
-    }
-    static copy(model) {
-        const result = new TooltipSettings(model.id);
-        result.show = model.show;
-        result.containerClass = model.containerClass;
-        return result;
-    }
-    setShow(show) {
-        return TooltipSettings.copy({ ...this, show });
-    }
-    setClass(containerClass) {
-        return TooltipSettings.copy({ ...this, containerClass });
-    }
-    isSame(model) {
-        if (this.show !== model.show)
-            return false;
-        if (this.containerClass !== model.containerClass)
-            return false;
-        if (this.id !== model.id)
-            return false;
-        return true;
-    }
-}
-
-class TooltipComponent extends DestructibleComponent {
-    postboy;
-    detector;
-    container;
-    _settings = new TooltipSettings();
-    map;
-    overlay;
-    show = false;
-    set settings(value) {
-        if (!value || this._settings.isSame(value))
-            return;
-        this._settings = value;
-        this.detector.detectChanges();
-    }
-    constructor(postboy, detector) {
-        super();
-        this.postboy = postboy;
-        this.detector = detector;
-    }
-    ngOnInit() {
-        this.subs.push(this.observeMapRender());
-        this.subs.push(this.observeMapClick());
-        this.subs.push(this.observeClose());
-    }
-    observeMapClick() {
-        return this.postboy.subscribe(MapClickEvent.ID).subscribe((ev) => {
-            this._settings.show(ev) ? this.addOverlay(ev.coordinates) : this.removeOverlay();
-        });
-    }
-    observeClose() {
-        return this.postboy
-            .subscribe(CloseTooltipCommand.ID)
-            .pipe(filter((ev) => ev.tooltipId === this._settings.id))
-            .subscribe(() => this.removeOverlay());
-    }
-    observeMapRender() {
-        return this.postboy.subscribe(MapRenderedEvent.ID).subscribe((m) => {
-            this.map = m.map;
-        });
-    }
-    removeOverlay = () => {
-        !!this.overlay && this.map?.removeOverlay(this.overlay);
-        this.show = false;
-    };
-    addOverlay(coordinates) {
-        this.removeOverlay();
-        this.overlay = new Overlay(this.options(coordinates));
-        this.map?.addOverlay(this.overlay);
-        this.show = true;
-        this.detector.detectChanges();
-    }
-    options = (coordinates) => {
-        return {
-            element: this.container?.nativeElement,
-            autoPan: false,
-            autoPanAnimation: { duration: 0 },
-            position: coordinates,
-        };
-    };
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TooltipComponent, deps: [{ token: MapPostboyService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TooltipComponent, selector: "art-tooltip", inputs: { settings: "settings" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["tip"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div #tip [class]=\"['tooltip-wrapper', _settings.containerClass]\" [hidden]=\"!show\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [".tooltip-wrapper{position:absolute}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TooltipComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'art-tooltip', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #tip [class]=\"['tooltip-wrapper', _settings.containerClass]\" [hidden]=\"!show\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [".tooltip-wrapper{position:absolute}\n"] }]
-        }], ctorParameters: function () { return [{ type: MapPostboyService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { container: [{
-                type: ViewChild,
-                args: ['tip']
-            }], settings: [{
-                type: Input
+class TooltipSettings {
+    id;
+    containerClass = 'custom-tooltip-class';
+    show = (e) => true;
+    constructor(id) {
+        this.id = id ?? IdGenerator.get();
+    }
+    static copy(model) {
+        const result = new TooltipSettings(model.id);
+        result.show = model.show;
+        result.containerClass = model.containerClass;
+        return result;
+    }
+    setShow(show) {
+        return TooltipSettings.copy({ ...this, show });
+    }
+    setClass(containerClass) {
+        return TooltipSettings.copy({ ...this, containerClass });
+    }
+    isSame(model) {
+        if (this.show !== model.show)
+            return false;
+        if (this.containerClass !== model.containerClass)
+            return false;
+        if (this.id !== model.id)
+            return false;
+        return true;
+    }
+}
+
+class TooltipComponent extends DestructibleComponent {
+    postboy;
+    detector;
+    container;
+    _settings = new TooltipSettings();
+    map;
+    overlay;
+    show = false;
+    set settings(value) {
+        if (!value || this._settings.isSame(value))
+            return;
+        this._settings = value;
+        this.detector.detectChanges();
+    }
+    constructor(postboy, detector) {
+        super();
+        this.postboy = postboy;
+        this.detector = detector;
+    }
+    ngOnInit() {
+        this.subs.push(this.observeMapRender());
+        this.subs.push(this.observeMapClick());
+        this.subs.push(this.observeClose());
+    }
+    observeMapClick() {
+        return this.postboy.subscribe(MapClickEvent.ID).subscribe((ev) => {
+            this._settings.show(ev) ? this.addOverlay(ev.coordinates) : this.removeOverlay();
+        });
+    }
+    observeClose() {
+        return this.postboy
+            .subscribe(CloseTooltipCommand.ID)
+            .pipe(filter((ev) => ev.tooltipId === this._settings.id))
+            .subscribe(() => this.removeOverlay());
+    }
+    observeMapRender() {
+        return this.postboy.subscribe(MapRenderedEvent.ID).subscribe((m) => {
+            this.map = m.map;
+        });
+    }
+    removeOverlay = () => {
+        !!this.overlay && this.map?.removeOverlay(this.overlay);
+        this.show = false;
+    };
+    addOverlay(coordinates) {
+        this.removeOverlay();
+        this.overlay = new Overlay(this.options(coordinates));
+        this.map?.addOverlay(this.overlay);
+        this.show = true;
+        this.detector.detectChanges();
+    }
+    options = (coordinates) => {
+        return {
+            element: this.container?.nativeElement,
+            autoPan: false,
+            autoPanAnimation: { duration: 0 },
+            position: coordinates,
+        };
+    };
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: TooltipComponent, deps: [{ token: MapPostboyService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: TooltipComponent, selector: "art-tooltip", inputs: { settings: "settings" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["tip"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div #tip [class]=\"['tooltip-wrapper', _settings.containerClass]\" [hidden]=\"!show\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [".tooltip-wrapper{position:absolute}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: TooltipComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'art-tooltip', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #tip [class]=\"['tooltip-wrapper', _settings.containerClass]\" [hidden]=\"!show\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [".tooltip-wrapper{position:absolute}\n"] }]
+        }], ctorParameters: () => [{ type: MapPostboyService }, { type: i0.ChangeDetectorRef }], propDecorators: { container: [{
+                type: ViewChild,
+                args: ['tip']
+            }], settings: [{
+                type: Input
             }] } });
 
-class PolygonsComponent extends DestructibleComponent {
-    postboy;
-    layerName = '';
-    constructor(postboy) {
-        super();
-        this.postboy = postboy;
-    }
-    _polygons = [];
-    set polygons(value) {
-        this._polygons = value ?? [];
-        this.putPolygons();
-    }
-    ngOnInit() {
-        this.postboy
-            .subscribe(MapRenderedEvent.ID)
-            .pipe(filter((m) => !!m), first())
-            .subscribe(() => this.putPolygons());
-    }
-    putPolygons() {
-        if (!this._polygons)
-            return;
-        this.postboy.fire(new PlaceLayerFeaturesCommand(this.layerName, this._polygons.map((m) => m.feature)));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PolygonsComponent, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PolygonsComponent, selector: "art-polygons", inputs: { layerName: "layerName", polygons: "polygons" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PolygonsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'art-polygons', template: '', changeDetection: ChangeDetectionStrategy.OnPush }]
-        }], ctorParameters: function () { return [{ type: MapPostboyService }]; }, propDecorators: { layerName: [{
-                type: Input
-            }], polygons: [{
-                type: Input
+class PolygonsComponent extends DestructibleComponent {
+    postboy;
+    layerName = '';
+    constructor(postboy) {
+        super();
+        this.postboy = postboy;
+    }
+    _polygons = [];
+    set polygons(value) {
+        this._polygons = value ?? [];
+        this.putPolygons();
+    }
+    ngOnInit() {
+        this.postboy
+            .subscribe(MapRenderedEvent.ID)
+            .pipe(filter((m) => !!m), first())
+            .subscribe(() => this.putPolygons());
+    }
+    putPolygons() {
+        if (!this._polygons)
+            return;
+        this.postboy.fire(new PlaceLayerFeaturesCommand(this.layerName, this._polygons.map((m) => m.feature)));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: PolygonsComponent, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: PolygonsComponent, selector: "art-polygons", inputs: { layerName: "layerName", polygons: "polygons" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: PolygonsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'art-polygons', template: '', changeDetection: ChangeDetectionStrategy.OnPush }]
+        }], ctorParameters: () => [{ type: MapPostboyService }], propDecorators: { layerName: [{
+                type: Input
+            }], polygons: [{
+                type: Input
             }] } });
 
-class ZoomControlSettings {
-    controlClass = 'ol-zoom';
-    zoomInClass = 'ol-zoom-in';
-    zoomOutClass = 'ol-zoom-out';
-    zoomInLabel = 'Zoom In';
-    zoomOutLabel = 'Zoom Out';
-    static copy(model) {
-        const result = new ZoomControlSettings();
-        result.controlClass = model.controlClass;
-        result.zoomInClass = model.zoomInClass;
-        result.zoomOutClass = model.zoomOutClass;
-        result.zoomInLabel = model.zoomInLabel;
-        result.zoomOutLabel = model.zoomOutLabel;
-        return result;
-    }
-    isSame(model) {
-        if (this.zoomInClass !== model.zoomInClass)
-            return false;
-        if (this.zoomOutClass !== model.zoomOutClass)
-            return false;
-        if (this.zoomInLabel !== model.zoomInLabel)
-            return false;
-        if (this.controlClass !== model.controlClass)
-            return false;
-        if (this.zoomOutLabel !== model.zoomOutLabel)
-            return false;
-        return true;
-    }
-    setZoomInLabel(zoomInLabel) {
-        return ZoomControlSettings.copy({ ...this, zoomInLabel });
-    }
-    setZoomOutClass(zoomOutClass) {
-        return ZoomControlSettings.copy({ ...this, zoomOutClass });
-    }
-    setZoomInClass(zoomInClass) {
-        return ZoomControlSettings.copy({ ...this, zoomInClass });
-    }
-    setZoomOutLabel(zoomOutLabel) {
-        return ZoomControlSettings.copy({ ...this, zoomOutLabel });
-    }
-    setControlClass(controlClass) {
-        return ZoomControlSettings.copy({ ...this, controlClass });
-    }
-}
-
-class MapControlZoomComponent extends DestructibleComponent {
-    postboy;
-    _settings = new ZoomControlSettings();
-    map;
-    control;
-    set settings(value) {
-        if (!value || this._settings.isSame(value))
-            return;
-        this._settings = value;
-        this.setControl();
-    }
-    constructor(postboy) {
-        super();
-        this.postboy = postboy;
-    }
-    ngOnInit() {
-        this.postboy
-            .subscribe(MapRenderedEvent.ID)
-            .pipe(filter((m) => !!m), first())
-            .subscribe((m) => {
-            this.map = m.map;
-            this.setControl();
-        });
-    }
-    setControl() {
-        if (!this.map)
-            return;
-        this.control = this.postboy.execute(new GenerateZoomControlExecutor(this._settings));
-        this.map.addControl(this.control);
-    }
-    onDestroy = () => {
-        this.eliminate();
-    };
-    eliminate = () => !!this.map && !!this.control && this.map.removeControl(this.control);
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapControlZoomComponent, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: MapControlZoomComponent, selector: "art-map-control-zoom", inputs: { settings: "settings" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapControlZoomComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'art-map-control-zoom', template: '', changeDetection: ChangeDetectionStrategy.OnPush }]
-        }], ctorParameters: function () { return [{ type: MapPostboyService }]; }, propDecorators: { settings: [{
-                type: Input
+class ZoomControlSettings {
+    controlClass = 'ol-zoom';
+    zoomInClass = 'ol-zoom-in';
+    zoomOutClass = 'ol-zoom-out';
+    zoomInLabel = 'Zoom In';
+    zoomOutLabel = 'Zoom Out';
+    static copy(model) {
+        const result = new ZoomControlSettings();
+        result.controlClass = model.controlClass;
+        result.zoomInClass = model.zoomInClass;
+        result.zoomOutClass = model.zoomOutClass;
+        result.zoomInLabel = model.zoomInLabel;
+        result.zoomOutLabel = model.zoomOutLabel;
+        return result;
+    }
+    isSame(model) {
+        if (this.zoomInClass !== model.zoomInClass)
+            return false;
+        if (this.zoomOutClass !== model.zoomOutClass)
+            return false;
+        if (this.zoomInLabel !== model.zoomInLabel)
+            return false;
+        if (this.controlClass !== model.controlClass)
+            return false;
+        if (this.zoomOutLabel !== model.zoomOutLabel)
+            return false;
+        return true;
+    }
+    setZoomInLabel(zoomInLabel) {
+        return ZoomControlSettings.copy({ ...this, zoomInLabel });
+    }
+    setZoomOutClass(zoomOutClass) {
+        return ZoomControlSettings.copy({ ...this, zoomOutClass });
+    }
+    setZoomInClass(zoomInClass) {
+        return ZoomControlSettings.copy({ ...this, zoomInClass });
+    }
+    setZoomOutLabel(zoomOutLabel) {
+        return ZoomControlSettings.copy({ ...this, zoomOutLabel });
+    }
+    setControlClass(controlClass) {
+        return ZoomControlSettings.copy({ ...this, controlClass });
+    }
+}
+
+class MapControlZoomComponent extends DestructibleComponent {
+    postboy;
+    _settings = new ZoomControlSettings();
+    map;
+    control;
+    set settings(value) {
+        if (!value || this._settings.isSame(value))
+            return;
+        this._settings = value;
+        this.setControl();
+    }
+    constructor(postboy) {
+        super();
+        this.postboy = postboy;
+    }
+    ngOnInit() {
+        this.postboy
+            .subscribe(MapRenderedEvent.ID)
+            .pipe(filter((m) => !!m), first())
+            .subscribe((m) => {
+            this.map = m.map;
+            this.setControl();
+        });
+    }
+    setControl() {
+        if (!this.map)
+            return;
+        this.control = this.postboy.execute(new GenerateZoomControlExecutor(this._settings));
+        this.map.addControl(this.control);
+    }
+    onDestroy = () => {
+        this.eliminate();
+    };
+    eliminate = () => !!this.map && !!this.control && this.map.removeControl(this.control);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapControlZoomComponent, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: MapControlZoomComponent, selector: "art-map-control-zoom", inputs: { settings: "settings" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapControlZoomComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'art-map-control-zoom', template: '', changeDetection: ChangeDetectionStrategy.OnPush }]
+        }], ctorParameters: () => [{ type: MapPostboyService }], propDecorators: { settings: [{
+                type: Input
             }] } });
 
-class MapModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: MapModule, declarations: [DestructibleComponent,
-            MapPlateComponent,
-            TileLayerComponent,
-            OsmTileLayerComponent,
-            FeatureLayerComponent,
-            MarkersComponent,
-            TooltipComponent,
-            PolygonsComponent,
-            ClusterLayerComponent,
-            MapControlZoomComponent], imports: [CommonModule], exports: [MapPlateComponent,
-            FeatureLayerComponent,
-            MarkersComponent,
-            TileLayerComponent,
-            TooltipComponent,
-            PolygonsComponent,
-            ClusterLayerComponent,
-            MapControlZoomComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapModule, imports: [CommonModule] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [CommonModule],
-                    declarations: [
-                        DestructibleComponent,
-                        MapPlateComponent,
-                        TileLayerComponent,
-                        OsmTileLayerComponent,
-                        FeatureLayerComponent,
-                        MarkersComponent,
-                        TooltipComponent,
-                        PolygonsComponent,
-                        ClusterLayerComponent,
-                        MapControlZoomComponent,
-                    ],
-                    exports: [
-                        MapPlateComponent,
-                        FeatureLayerComponent,
-                        MarkersComponent,
-                        TileLayerComponent,
-                        TooltipComponent,
-                        PolygonsComponent,
-                        ClusterLayerComponent,
-                        MapControlZoomComponent,
-                    ],
-                }]
+class MapModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.7", ngImport: i0, type: MapModule, declarations: [DestructibleComponent,
+            MapPlateComponent,
+            TileLayerComponent,
+            OsmTileLayerComponent,
+            FeatureLayerComponent,
+            MarkersComponent,
+            TooltipComponent,
+            PolygonsComponent,
+            ClusterLayerComponent,
+            MapControlZoomComponent], imports: [CommonModule], exports: [MapPlateComponent,
+            FeatureLayerComponent,
+            MarkersComponent,
+            TileLayerComponent,
+            TooltipComponent,
+            PolygonsComponent,
+            ClusterLayerComponent,
+            MapControlZoomComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapModule, imports: [CommonModule] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: MapModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule],
+                    declarations: [
+                        DestructibleComponent,
+                        MapPlateComponent,
+                        TileLayerComponent,
+                        OsmTileLayerComponent,
+                        FeatureLayerComponent,
+                        MarkersComponent,
+                        TooltipComponent,
+                        PolygonsComponent,
+                        ClusterLayerComponent,
+                        MapControlZoomComponent,
+                    ],
+                    exports: [
+                        MapPlateComponent,
+                        FeatureLayerComponent,
+                        MarkersComponent,
+                        TileLayerComponent,
+                        TooltipComponent,
+                        PolygonsComponent,
+                        ClusterLayerComponent,
+                        MapControlZoomComponent,
+                    ],
+                }]
         }] });
 
-class MarkerStyleHelper {
-    static fromSvg(svg, size = [30, 30], zIndex = 400) {
-        let image = new Image();
-        image.src = 'data:image/svg+xml,' + escape(svg);
-        return new Style({
-            image: new Icon({
-                img: image,
-                imgSize: size,
-            }),
-            zIndex,
-        });
-    }
-    static circle(radius, fill, strokeColor, strokeWidth = 1) {
-        return new Style({
-            image: new Circle({
-                radius,
-                fill: new Fill({ color: fill }),
-                stroke: new Stroke({ color: strokeColor, width: strokeWidth }),
-            }),
-        });
-    }
-    static withText(style, text) {
-        style.setText(text);
-        return style;
-    }
-}
-
-class PolygonStyleHelper {
-    static simple(fill, stroke, strokeWidth = 1) {
-        return new Style({
-            fill: new Fill({
-                color: fill,
-            }),
-            stroke: new Stroke({
-                color: stroke,
-                width: strokeWidth,
-            }),
-        });
-    }
-    static edit(fill, stroke, strokeWidth = 1, pinRadius = 5) {
-        return new Style({
-            image: new Circle({
-                fill: new Fill({
-                    color: stroke,
-                }),
-                radius: pinRadius,
-            }),
-            fill: new Fill({
-                color: fill,
-            }),
-            stroke: new Stroke({
-                color: stroke,
-                width: strokeWidth,
-            }),
-        });
-    }
-}
-
-class TextStyleHelper {
-    static get(text, font, color) {
-        return new Text({
-            text: text,
-            font: font,
-            textAlign: 'center',
-            fill: new Fill({
-                color: color,
-            }),
-        });
-    }
-}
-
-class StringifyFeatureHelper {
-    static polygon(feature, format = FeatureOutputFormat.GeoJson) {
-        return format === FeatureOutputFormat.GeoJson
-            ? new GeoJSON().writeFeature(feature)
-            : new WKT().writeFeature(feature);
-    }
-    static circle(feature, format = FeatureOutputFormat.GeoJson) {
-        // const clone = feature.clone();
-        // clone.setGeometry(fromCircle(feature.getGeometry()! as Circle));
-        const tetemp = feature.getGeometryName();
-        const circle = feature.getGeometry();
-        // const temp = StringifyFeatureHelper.drawCircle(circle.getCenter(), circle.getRadius());
-        const ttt = feature.getGeometry().getExtent();
-        const eastPoint = [ttt[2], (ttt[1] + ttt[3]) / 2];
-        const aaa = [
-            ...transform([ttt[0], ttt[1]], 'EPSG:4326', 'EPSG:3857'),
-            ...transform([ttt[2], ttt[3]], 'EPSG:4326', 'EPSG:3857'),
-        ];
-        const radius = (aaa[2] - aaa[0]) / 2;
-        const radius2 = new LineString([circle.getCenter(), eastPoint]).getLength();
-        const polygonGeom = new Polygon(StringifyFeatureHelper.drawCircle(circle.getCenter(), radius));
-        // var edgeCoordinate = [circle.getCenter()[0] + radius, circle.getCenter()[1]];
-        // var wgs84Sphere = new Sphere(6378137);
-        return StringifyFeatureHelper.polygon(new Feature(polygonGeom), format);
-        //  const rad = circle.getRadius();
-        //  const degrees = 180 / Math.PI; // radians to degrees
-        //  const radians = Math.PI / 180; // degrees to radians
-        //  const rlat = rad * degrees * 1000;
-        //  const rlng = rad * radians;
-        //  return StringifyFeatureHelper.polygon(new Feature<Geometry>(circular(circle.getCenter(),circle.getRadius() * METERS_PER_UNIT)), format);
-    }
-    static drawCircle(point, radius) {
-        const tetetemp = transform(point, 'EPSG:4326', 'EPSG:3857');
-        // const tetetemp = point;
-        const radians = Math.PI / 180; // degrees to radians
-        const degrees = 180 / Math.PI; // radians to degrees
-        const earthsradius = 6378137.0;
-        const rlat = (radius / earthsradius) * degrees;
-        const rlng = rlat / Math.cos(tetetemp[1] * radians);
-        const extp = [];
-        for (let i = 0; i <= 32; i++) {
-            const theta = Math.PI * (i / 16);
-            extp.push([
-                tetetemp[0] + rlng * Math.cos(theta) * METERS_PER_UNIT,
-                tetetemp[1] + rlat * Math.sin(theta) * METERS_PER_UNIT,
-            ]);
-        }
-        return [extp.map((e) => transform(e, 'EPSG:3857', 'EPSG:4326'))];
-    }
-}
-
-/*
- * Public API Surface of maps
+class MarkerStyleHelper {
+    static fromSvg(svg, size = [30, 30], zIndex = 400) {
+        let image = new Image();
+        image.src = 'data:image/svg+xml,' + escape(svg);
+        return new Style({
+            image: new Icon({
+                img: image,
+                imgSize: size,
+            }),
+            zIndex,
+        });
+    }
+    static circle(radius, fill, strokeColor, strokeWidth = 1) {
+        return new Style({
+            image: new Circle({
+                radius,
+                fill: new Fill({ color: fill }),
+                stroke: new Stroke({ color: strokeColor, width: strokeWidth }),
+            }),
+        });
+    }
+    static withText(style, text) {
+        style.setText(text);
+        return style;
+    }
+}
+
+class PolygonStyleHelper {
+    static simple(fill, stroke, strokeWidth = 1) {
+        return new Style({
+            fill: new Fill({
+                color: fill,
+            }),
+            stroke: new Stroke({
+                color: stroke,
+                width: strokeWidth,
+            }),
+        });
+    }
+    static edit(fill, stroke, strokeWidth = 1, pinRadius = 5) {
+        return new Style({
+            image: new Circle({
+                fill: new Fill({
+                    color: stroke,
+                }),
+                radius: pinRadius,
+            }),
+            fill: new Fill({
+                color: fill,
+            }),
+            stroke: new Stroke({
+                color: stroke,
+                width: strokeWidth,
+            }),
+        });
+    }
+}
+
+class TextStyleHelper {
+    static get(text, font, color) {
+        return new Text({
+            text: text,
+            font: font,
+            textAlign: 'center',
+            fill: new Fill({
+                color: color,
+            }),
+        });
+    }
+}
+
+class StringifyFeatureHelper {
+    static polygon(feature, format = FeatureOutputFormat.GeoJson) {
+        return format === FeatureOutputFormat.GeoJson
+            ? new GeoJSON().writeFeature(feature)
+            : new WKT().writeFeature(feature);
+    }
+    static circle(feature, format = FeatureOutputFormat.GeoJson) {
+        // const clone = feature.clone();
+        // clone.setGeometry(fromCircle(feature.getGeometry()! as Circle));
+        const tetemp = feature.getGeometryName();
+        const circle = feature.getGeometry();
+        // const temp = StringifyFeatureHelper.drawCircle(circle.getCenter(), circle.getRadius());
+        const ttt = feature.getGeometry().getExtent();
+        const eastPoint = [ttt[2], (ttt[1] + ttt[3]) / 2];
+        const aaa = [
+            ...transform([ttt[0], ttt[1]], 'EPSG:4326', 'EPSG:3857'),
+            ...transform([ttt[2], ttt[3]], 'EPSG:4326', 'EPSG:3857'),
+        ];
+        const radius = (aaa[2] - aaa[0]) / 2;
+        const radius2 = new LineString([circle.getCenter(), eastPoint]).getLength();
+        const polygonGeom = new Polygon(StringifyFeatureHelper.drawCircle(circle.getCenter(), radius));
+        // var edgeCoordinate = [circle.getCenter()[0] + radius, circle.getCenter()[1]];
+        // var wgs84Sphere = new Sphere(6378137);
+        return StringifyFeatureHelper.polygon(new Feature(polygonGeom), format);
+        //  const rad = circle.getRadius();
+        //  const degrees = 180 / Math.PI; // radians to degrees
+        //  const radians = Math.PI / 180; // degrees to radians
+        //  const rlat = rad * degrees * 1000;
+        //  const rlng = rad * radians;
+        //  return StringifyFeatureHelper.polygon(new Feature<Geometry>(circular(circle.getCenter(),circle.getRadius() * METERS_PER_UNIT)), format);
+    }
+    static drawCircle(point, radius) {
+        const tetetemp = transform(point, 'EPSG:4326', 'EPSG:3857');
+        // const tetetemp = point;
+        const radians = Math.PI / 180; // degrees to radians
+        const degrees = 180 / Math.PI; // radians to degrees
+        const earthsradius = 6378137.0;
+        const rlat = (radius / earthsradius) * degrees;
+        const rlng = rlat / Math.cos(tetetemp[1] * radians);
+        const extp = [];
+        for (let i = 0; i <= 32; i++) {
+            const theta = Math.PI * (i / 16);
+            extp.push([
+                tetetemp[0] + rlng * Math.cos(theta) * METERS_PER_UNIT,
+                tetetemp[1] + rlat * Math.sin(theta) * METERS_PER_UNIT,
+            ]);
+        }
+        return [extp.map((e) => transform(e, 'EPSG:3857', 'EPSG:4326'))];
+    }
+}
+
+/*
+ * Public API Surface of maps
  */
 
-/*
- * Public API Surface of maps-components
+/*
+ * Public API Surface of maps-components
  */
 
-/**
- * Generated bundle index. Do not edit.
+/**
+ * Generated bundle index. Do not edit.
  */
 
 export { AddControlCommand, CalculateAreaExecutor, CancelDrawingCommand, CancelFeatureModificationCommand, CloseTooltipCommand, ClusterLayerComponent, ClusterLayerSettings, DrawSelectionAreaCommand, DrawingType, FeatureLayerComponent, FeatureLayerSettings, FeatureOutputFormat, FitToPolygonsCommand, MapClickEvent, MapControl, MapControlZoomComponent, MapLyrs, MapLyrsLabel, MapModule, MapMoveEndEvent, MapPlateComponent, MapPostboyService, MapRenderedEvent, MapSettings, MarkerModel, MarkerStyleHelper, MarkersComponent, MessageRegistratorService, ModifyFeatureCommand, OsmTileLayerComponent, PolygonModel, PolygonStyleHelper, PolygonsComponent, RemoveControlCommand, SetMapCenterCommand, StartDrawingCommand, StringifyFeatureHelper, TextStyleHelper, TileLayerComponent, TileLayerSettings, TooltipComponent, TooltipSettings, ZoomControlSettings };