@artstesh/maps 1.0.0 → 1.0.3

package/dist/fesm2015/maps-components-src-map.js

@@ -4,14 +4,15 @@ import * as i5 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import { Feature } from 'ol';
 import { Point } from 'ol/geom';
-import { useGeographic } from 'ol/proj';
-import { Subject, ReplaySubject } from 'rxjs';
+import { useGeographic, get } from 'ol/proj';
+import { Subject } from 'rxjs';
+import { PostboyService, PostboyAbstractRegistrator } from '@artstesh/postboy';
 import Map from 'ol/Map';
 import View from 'ol/View';
 import TileLayer from 'ol/layer/Tile';
 import OSM from 'ol/source/OSM';
 import { filter, first } from 'rxjs/operators';
-import { Vector } from 'ol/source';
+import { XYZ, Vector } from 'ol/source';
 import { Vector as Vector$1 } from 'ol/layer';
 import Style from 'ol/style/Style';
 import { Icon, Circle, Fill, Stroke } from 'ol/style';
@@ -122,10 +123,8 @@ class MarkerModel {
     constructor(lat, lng, id, info) {
         this.lat = lat;
         this.lng = lng;
-        this.id = id;
         this.info = info;
-        if (id == null)
-            this.id = IdGenerator.get();
+        this.id = id == null ? IdGenerator.get() : id;
         this._feature = this.getFeature();
     }
     get feature() {
@@ -134,9 +133,8 @@ class MarkerModel {
     getFeature() {
         const feature = new Feature(new Point([this.lng, this.lat]));
         feature.setId(this.id);
-        if (this.info) {
-            Object.keys(this.info).forEach((k) => feature.set(k, this.info[k]));
-        }
+        if (this.info)
+            feature.set('info', this.info);
         return feature;
     }
 }
@@ -166,6 +164,18 @@ class MapRenderedEvent extends GenericMessage {
 }
 MapRenderedEvent.ID = 'b6121807-3b89-4cd3-82cf-089d2cefdc4f';
 
+class MapClickEvent extends GenericMessage {
+    constructor(coordinates, entities) {
+        super();
+        this.coordinates = coordinates;
+        this.entities = entities;
+    }
+    get id() {
+        return MapClickEvent.ID;
+    }
+}
+MapClickEvent.ID = '323df526-8d9c-49c6-83e8-6e9a1e7762f7';
+
 class AddLayerCommand extends GenericMessage {
     constructor(layer) {
         super();
@@ -200,89 +210,72 @@ class RemoveLayerCommand extends GenericMessage {
 }
 RemoveLayerCommand.ID = 'ab484e0e-e185-45cd-8434-12101f3c7eb1';
 
-class ClearLayerCommand extends GenericMessage {
+class AddTileCommand extends GenericMessage {
     constructor(layer) {
         super();
         this.layer = layer;
     }
     get id() {
-        return ClearLayerCommand.ID;
+        return AddTileCommand.ID;
     }
 }
-ClearLayerCommand.ID = 'd02842b7-fa62-458d-b1e4-12dd814610c5';
+AddTileCommand.ID = '25b7df28-72ce-4453-9fe6-54285a2fdc57';
 
-class MapPostboyService {
-    constructor() {
-        this.applications = {};
-    }
-    register(id, sub) {
-        this.applications[id] = sub;
+class RemoveTileCommand extends GenericMessage {
+    constructor(layer) {
+        super();
+        this.layer = layer;
     }
-    subscribe(id) {
-        if (!this.applications[id])
-            throw new Error(`There is no event with id ${id}`);
-        return this.applications[id].asObservable();
+    get id() {
+        return RemoveTileCommand.ID;
     }
-    fire(message) {
-        if (!this.applications[message.id])
-            throw new Error(`There is no event with id ${message.id}`);
-        this.applications[message.id].next(message);
+}
+RemoveTileCommand.ID = 'c36ccc0b-5638-4819-b148-2de57a59a5b7';
+
+class MapPostboyService extends PostboyService {
+    constructor() {
+        super(...arguments);
+        this.observe = (id) => this.subscribe(id);
     }
 }
-MapPostboyService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapPostboyService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+MapPostboyService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapPostboyService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
 MapPostboyService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapPostboyService });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapPostboyService, decorators: [{
             type: Injectable
         }] });
 
-class MessageRegistratorService {
-    constructor(service) {
-        service.register(MapRenderedEvent.ID, new ReplaySubject(1));
-        service.register(AddLayerCommand.ID, new Subject());
-        service.register(PlaceLayerFeaturesCommand.ID, new ReplaySubject(1));
-        service.register(RemoveLayerCommand.ID, new Subject());
-        service.register(ClearLayerCommand.ID, new Subject());
-    }
-}
-MessageRegistratorService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MessageRegistratorService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
-MessageRegistratorService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MessageRegistratorService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MessageRegistratorService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
-
-class MapStateService {
-    constructor(postboy) {
-        this.postboy = postboy;
-        postboy.subscribe(MapRenderedEvent.ID).subscribe((m) => (this.map = m));
-    }
-}
-MapStateService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapStateService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
-MapStateService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapStateService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapStateService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
-
 class MapManagementService {
     constructor(postboy) {
         this.postboy = postboy;
         this.layers = {};
+    }
+    up() {
         this.observeMapRender();
         this.observeAddLayer();
         this.observeRemoveLayer();
         this.observePlaceFeatures();
-        this.observeClearLayer();
+        this.observeAddTile();
+        this.observeRemoveTile();
+    }
+    observeRemoveTile() {
+        this.postboy.subscribe(RemoveTileCommand.ID).subscribe((c) => {
+            if (!this.map)
+                return;
+            this.map.removeLayer(c.layer);
+        });
+    }
+    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;
         });
     }
-    observeClearLayer() {
-        this.postboy.subscribe(ClearLayerCommand.ID).subscribe((c) => {
-            var _a, _b;
-            (_b = (_a = this.layers[c.layer]) === null || _a === void 0 ? void 0 : _a.getSource()) === null || _b === void 0 ? void 0 : _b.clear();
-        });
-    }
     observeAddLayer() {
         this.postboy.subscribe(AddLayerCommand.ID).subscribe((c) => {
             if (!this.map)
@@ -315,14 +308,86 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
             type: Injectable
         }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
 
-class ServiceCollector {
-    constructor(registrator, management, state) { }
+class MapStateService {
+    constructor(postboy) {
+        this.postboy = postboy;
+    }
+    up() {
+        this.postboy.subscribe(MapRenderedEvent.ID).subscribe((m) => (this.map = m));
+    }
 }
-ServiceCollector.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ServiceCollector, deps: [{ token: MessageRegistratorService }, { token: MapManagementService }, { token: MapStateService }], target: i0.ɵɵFactoryTarget.Injectable });
-ServiceCollector.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ServiceCollector });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ServiceCollector, decorators: [{
+MapStateService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapStateService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
+MapStateService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapStateService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapStateService, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: MessageRegistratorService }, { type: MapManagementService }, { type: MapStateService }]; } });
+        }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
+
+class MapClickService {
+    constructor(postboy) {
+        this.postboy = postboy;
+    }
+    up() {
+        this.observeMapRender();
+    }
+    observeMapRender() {
+        this.postboy.subscribe(MapRenderedEvent.ID).subscribe((m) => {
+            var _a;
+            this.map = m.map;
+            (_a = this.map) === null || _a === void 0 ? void 0 : _a.on('singleclick', (e) => {
+                this.postboy.fire(this.onClick(e));
+            });
+        });
+    }
+    onClick(ev) {
+        var _a;
+        const model = new MapClickEvent(ev.coordinate, {});
+        (_a = this.map) === null || _a === void 0 ? void 0 : _a.forEachFeatureAtPixel(ev.pixel, (f, l) => {
+            this.getFeatureCollectionWithInner([f])
+                .filter((f) => !!f.getId())
+                .forEach((fs) => {
+                let layerName = l.get('name');
+                if (!model.entities[layerName])
+                    model.entities[layerName] = [];
+                model.entities[layerName].push(f.getId());
+            });
+        });
+        return model;
+    }
+    getFeatureCollectionWithInner(features) {
+        const result = [];
+        features === null || features === void 0 ? void 0 : features.forEach((f) => {
+            const innerFeatures = f.get('features');
+            (innerFeatures === null || innerFeatures === void 0 ? void 0 : innerFeatures.length) ? result.push(...innerFeatures) : result.push(f);
+        });
+        return result;
+    }
+}
+MapClickService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapClickService, deps: [{ token: MapPostboyService }], target: i0.ɵɵFactoryTarget.Injectable });
+MapClickService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapClickService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapClickService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: MapPostboyService }]; } });
+
+class MessageRegistratorService extends PostboyAbstractRegistrator {
+    constructor(service, management, state, interaction) {
+        super(service);
+        this.registerServices([management, state, interaction]);
+    }
+    _up() {
+        this.registerReplay(MapRenderedEvent.ID);
+        this.registerReplay(PlaceLayerFeaturesCommand.ID);
+        this.registerSubject(AddLayerCommand.ID);
+        this.registerSubject(RemoveLayerCommand.ID);
+        this.registerSubject(AddTileCommand.ID);
+        this.registerSubject(RemoveTileCommand.ID);
+        this.registerSubject(MapClickEvent.ID);
+    }
+}
+MessageRegistratorService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MessageRegistratorService, deps: [{ token: MapPostboyService }, { token: MapManagementService }, { token: MapStateService }, { token: MapClickService }], target: i0.ɵɵFactoryTarget.Injectable });
+MessageRegistratorService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MessageRegistratorService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MessageRegistratorService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: MapPostboyService }, { type: MapManagementService }, { type: MapStateService }, { type: MapClickService }]; } });
 
 class MapPlateFactory {
     build(settings) {
@@ -412,6 +477,7 @@ class MapPlateComponent extends DestructibleComponent {
         this.detector = detector;
         this.osmUrl = '';
         this._settings = new MapSettings();
+        registrator.up();
     }
     set settings(value) {
         if (!value || this._settings.isSame(value))
@@ -438,8 +504,8 @@ class MapPlateComponent extends DestructibleComponent {
         this.map.updateSize();
     }
 }
-MapPlateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapPlateComponent, deps: [{ token: i0.ElementRef }, { token: MapPostboyService }, { token: MapPlateFactory }, { token: ServiceCollector }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-MapPlateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MapPlateComponent, selector: "lib-map-plate", inputs: { settings: "settings" }, providers: [MessageRegistratorService, MapStateService, MapManagementService, ServiceCollector], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n<lib-osm-tile-layer *ngIf=\"osmUrl && map\" [map]=\"map\" [url]=\"osmUrl\"></lib-osm-tile-layer>\n", styles: ["lib-map-plate{position:relative;display:flex;flex-direction:column;height:100%}\n"], components: [{ type: OsmTileLayerComponent, selector: "lib-osm-tile-layer", inputs: ["url", "map"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MapPlateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapPlateComponent, deps: [{ token: i0.ElementRef }, { token: MapPostboyService }, { token: MapPlateFactory }, { token: MessageRegistratorService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+MapPlateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MapPlateComponent, selector: "lib-map-plate", inputs: { settings: "settings" }, providers: [MessageRegistratorService, MapStateService, MapManagementService, MapClickService], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n<lib-osm-tile-layer *ngIf=\"osmUrl && map\" [map]=\"map\" [url]=\"osmUrl\"></lib-osm-tile-layer>\n", styles: ["lib-map-plate{position:relative;display:flex;flex-direction:column;height:100%}\n"], components: [{ type: OsmTileLayerComponent, selector: "lib-osm-tile-layer", inputs: ["url", "map"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapPlateComponent, decorators: [{
             type: Component,
             args: [{
@@ -447,19 +513,136 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                     templateUrl: './map-plate.component.html',
                     styleUrls: ['./map-plate.component.scss'],
                     changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [MessageRegistratorService, MapStateService, MapManagementService, ServiceCollector],
+                    providers: [MessageRegistratorService, MapStateService, MapManagementService, MapClickService],
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: MapPostboyService }, { type: MapPlateFactory }, { type: ServiceCollector }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { settings: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: MapPostboyService }, { type: MapPlateFactory }, { type: MessageRegistratorService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { settings: [{
                 type: Input
             }] } });
 
-class TileLayerComponent extends DestructibleComponent {
+class TileLayerSettings {
     constructor() {
+        this.maxZoom = 19;
+        this.minZoom = 0;
+        this.opacity = 0.6;
+        this.url = '';
+        this.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(Object.assign(Object.assign({}, this), { url }));
+    }
+    setMaxZoom(maxZoom) {
+        return TileLayerSettings.copy(Object.assign(Object.assign({}, this), { maxZoom }));
+    }
+    setMinZoom(minZoom) {
+        return TileLayerSettings.copy(Object.assign(Object.assign({}, this), { minZoom }));
+    }
+    setOpacity(opacity) {
+        return TileLayerSettings.copy(Object.assign(Object.assign({}, this), { opacity }));
+    }
+    setProjection(projection) {
+        return TileLayerSettings.copy(Object.assign(Object.assign({}, 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 === null || normalizedCoord === void 0 ? void 0 : normalizedCoord.x) || x))
+                .replace('{z}', String(zoom))
+                .replace('{y}', String(bound - ((normalizedCoord === null || normalizedCoord === void 0 ? void 0 : 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 };
+    }
+}
+TileLayerFactory.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TileLayerFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+TileLayerFactory.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TileLayerFactory, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TileLayerFactory, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class TileLayerComponent extends DestructibleComponent {
+    constructor(postboy, factory) {
         super();
+        this.postboy = postboy;
+        this.factory = factory;
+        this._settings = new TileLayerSettings();
+        this.onDestroy = () => this.removeLayer();
+    }
+    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();
+    }
+    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));
     }
 }
-TileLayerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TileLayerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TileLayerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TileLayerComponent, selector: "lib-tile-layer", usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+TileLayerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TileLayerComponent, deps: [{ token: MapPostboyService }, { token: TileLayerFactory }], target: i0.ɵɵFactoryTarget.Component });
+TileLayerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TileLayerComponent, selector: "lib-tile-layer", inputs: { settings: "settings" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TileLayerComponent, decorators: [{
             type: Component,
             args: [{
@@ -468,7 +651,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                     styleUrls: [],
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
-        }], ctorParameters: function () { return []; } });
+        }], ctorParameters: function () { return [{ type: MapPostboyService }, { type: TileLayerFactory }]; }, propDecorators: { settings: [{
+                type: Input
+            }] } });
 
 class FeatureLayerSettings {
     constructor() {
@@ -633,7 +818,7 @@ MapModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.
         TileLayerComponent,
         OsmTileLayerComponent,
         FeatureLayerComponent,
-        MarkersComponent], imports: [CommonModule], exports: [MapPlateComponent, FeatureLayerComponent, MarkersComponent] });
+        MarkersComponent], imports: [CommonModule], exports: [MapPlateComponent, FeatureLayerComponent, MarkersComponent, TileLayerComponent] });
 MapModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapModule, imports: [[CommonModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MapModule, decorators: [{
             type: NgModule,
@@ -647,51 +832,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                         FeatureLayerComponent,
                         MarkersComponent,
                     ],
-                    exports: [MapPlateComponent, FeatureLayerComponent, MarkersComponent],
+                    exports: [MapPlateComponent, FeatureLayerComponent, MarkersComponent, TileLayerComponent],
                 }]
         }] });
 
-class TileLayerSettings {
-    constructor() {
-        this.name = 'tiles';
-        this.maxZoom = 19;
-        this.minZoom = 0;
-        this.opacity = 1;
-        this.url = '';
-    }
-    static copy(model) {
-        const result = new TileLayerSettings();
-        result.name = model.name;
-        result.maxZoom = model.maxZoom;
-        result.minZoom = model.minZoom;
-        result.url = model.url;
-        return result;
-    }
-    setUrl(url) {
-        return TileLayerSettings.copy(Object.assign(Object.assign({}, this), { url }));
-    }
-    setName(name) {
-        return TileLayerSettings.copy(Object.assign(Object.assign({}, this), { name }));
-    }
-    setMaxZoom(maxZoom) {
-        return TileLayerSettings.copy(Object.assign(Object.assign({}, this), { maxZoom }));
-    }
-    setMinZoom(minZoom) {
-        return TileLayerSettings.copy(Object.assign(Object.assign({}, this), { minZoom }));
-    }
-    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.name !== model.name)
-            return false;
-        return true;
-    }
-}
-
 class MarkerStyleHelper {
     static fromSvg(svg, size = [30, 30], zIndex = 400) {
         let image = new Image();
@@ -723,5 +867,5 @@ class MarkerStyleHelper {
  * Generated bundle index. Do not edit.
  */
 
-export { CallbackMessage, FeatureLayerComponent, FeatureLayerSettings, GenericMessage, MapLyrs, MapLyrsLabel, MapModule, MapPlateComponent, MapPostboyService, MapRenderedEvent, MapSettings, MarkerModel, MarkerStyleHelper, MarkersComponent, MessageRegistratorService, OsmTileLayerComponent, TileLayerComponent, TileLayerSettings };
+export { CallbackMessage, FeatureLayerComponent, FeatureLayerSettings, GenericMessage, MapClickEvent, MapLyrs, MapLyrsLabel, MapModule, MapPlateComponent, MapPostboyService, MapRenderedEvent, MapSettings, MarkerModel, MarkerStyleHelper, MarkersComponent, MessageRegistratorService, OsmTileLayerComponent, TileLayerComponent, TileLayerSettings };
 //# sourceMappingURL=maps-components-src-map.js.map