@theseam/ui-common 0.4.1 → 0.4.3

package/fesm2020/theseam-ui-common-google-maps.mjs

@@ -43,6 +43,18 @@ function isFeatureSelected(feature) {
 function setFeatureSelected(feature, isSelected) {
     feature.setProperty(AppFeaturePropertyName.IsSelected, isSelected);
 }
+const EXTERNAL_FEATURE_DEFINED_STYLE_OPTIONS_PROPERTY_NAME = 'styleOptions';
+const EXTERNAL_FEATURE_DEFINED_STYLE_OPTIONS_HOVERED_PROPERTY_NAME = 'styleOptionsHovered';
+const EXTERNAL_FEATURE_DEFINED_STYLE_OPTIONS_SELECTED_PROPERTY_NAME = 'styleOptionsSelected';
+function getStyleOptionsDefinedByFeature(feature) {
+    return feature.getProperty(EXTERNAL_FEATURE_DEFINED_STYLE_OPTIONS_PROPERTY_NAME) || undefined;
+}
+function getHoveredStyleOptionsDefinedByFeature(feature) {
+    return feature.getProperty(EXTERNAL_FEATURE_DEFINED_STYLE_OPTIONS_HOVERED_PROPERTY_NAME) || undefined;
+}
+function getSelectedStyleOptionsDefinedByFeature(feature) {
+    return feature.getProperty(EXTERNAL_FEATURE_DEFINED_STYLE_OPTIONS_SELECTED_PROPERTY_NAME) || undefined;
+}
 // TODO: Check performance of cloning a google.maps.Data instance, so the
 // properties can be removed with the google maps api, instead of on the
 // resulting json.
@@ -389,25 +401,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
             type: Injectable
         }], ctorParameters: function () { return []; } });
 
-const DEFAULT_POLYGON_OPTIONS = {
-    clickable: true,
-    draggable: true,
-    editable: true,
-    // fillColor: 'rgba(60,150,60,1)',
-    // strokeColor: 'rgba(155,255,0,1)'
-};
-const DEFAULT_DRAWING_MANAGER_OPTIONS = () => ({
-    drawingControl: true,
+const DEFAULT_POLYGON_OPTIONS = (editingEnabled) => ({
+    clickable: editingEnabled,
+    draggable: editingEnabled,
+    editable: editingEnabled,
+});
+const DEFAULT_DRAWING_MANAGER_OPTIONS = (editingEnabled) => ({
+    drawingControl: editingEnabled,
     drawingControlOptions: {
         drawingModes: [
             google.maps.drawing.OverlayType.POLYGON,
         ],
     },
-    polygonOptions: DEFAULT_POLYGON_OPTIONS,
+    polygonOptions: DEFAULT_POLYGON_OPTIONS(editingEnabled),
     drawingMode: null,
 });
-const FEATURE_STYLE_OPTIONS_DEFAULT = {
+const FEATURE_STYLE_OPTIONS_DEFAULT = (editingEnabled) => ({
     clickable: true,
+    // clickable: editingEnabled,
     visible: true,
     // zIndex?: number;
     // cursor?: string;
@@ -418,17 +429,34 @@ const FEATURE_STYLE_OPTIONS_DEFAULT = {
     strokeColor: 'blue',
     strokeOpacity: 1,
     strokeWeight: 2,
-};
-const FEATURE_STYLE_OPTIONS_SELECTED = {
-    ...FEATURE_STYLE_OPTIONS_DEFAULT,
-    draggable: true,
-    editable: true,
+});
+const FEATURE_STYLE_OPTIONS_SELECTED = (editingEnabled) => ({
+    ...FEATURE_STYLE_OPTIONS_DEFAULT(editingEnabled),
+    draggable: editingEnabled,
+    editable: editingEnabled,
     fillColor: 'green',
     fillOpacity: 0.7,
     strokeColor: 'limegreen',
     strokeOpacity: 1,
     strokeWeight: 2,
-};
+});
+const FEATURE_STYLE_OVERRIDE_OPTIONS_HOVERED = (editingEnabled) => ({
+    strokeColor: 'black',
+    strokeOpacity: 1,
+    strokeWeight: 4,
+});
+const SUPPORTED_PROPERTY_STYLE_OPTIONS = [
+    'fillColor',
+    'fillOpacity',
+    'strokeColor',
+    'strokeOpacity',
+    'strokeWeight',
+    'label',
+    'opacity',
+    'icon',
+    'clickable',
+    'visible',
+];
 class GoogleMapsService {
     get mapReady() { return this._mapReadySubject.value; }
     constructor(_mapValueManager, _ngZone, _vcr) {
@@ -437,9 +465,11 @@ class GoogleMapsService {
         this._vcr = _vcr;
         this._ngUnsubscribe = new Subject();
         this._mapReadySubject = new BehaviorSubject(false);
+        this._editingEnabledSubject = new BehaviorSubject(true);
         this._featureContextMenu = null;
         this._activeContextMenu = null;
         this._allowDrawingHoleInPolygon = false;
+        this.editingEnabled$ = this._editingEnabledSubject.asObservable();
         this.mapReady$ = this._mapReadySubject.asObservable();
     }
     ngOnDestroy() {
@@ -458,8 +488,35 @@ class GoogleMapsService {
     }
     // TODO: Refactor out of the service meant to just wrap the google maps api.
     setFeatureContextMenu(menu) {
+        this.closeContextMenu();
         this._featureContextMenu = menu;
     }
+    setEditingEnabled(enabled) {
+        this._editingEnabledSubject.next(enabled);
+        if (this.mapReady) {
+            this._assertInitialized();
+            this.googleMap.data.revertStyle();
+            if (!enabled) {
+                this.stopDrawing();
+                const options = DEFAULT_DRAWING_MANAGER_OPTIONS(this.isEditingEnabled());
+                this._drawingManager?.setOptions(options);
+                this._drawingManager?.setMap(null);
+                this.googleMap.data.forEach(f => {
+                    if (isFeatureSelected(f)) {
+                        setFeatureSelected(f, false);
+                    }
+                });
+            }
+            else {
+                const options = DEFAULT_DRAWING_MANAGER_OPTIONS(this.isEditingEnabled());
+                this._drawingManager?.setOptions(options);
+                this._drawingManager?.setMap(this.googleMap);
+            }
+        }
+    }
+    isEditingEnabled() {
+        return this._editingEnabledSubject.value;
+    }
     getDiv() {
         this._assertInitialized();
         return this.googleMap.getDiv();
@@ -497,7 +554,7 @@ class GoogleMapsService {
                 listener.remove();
             });
             // To fake canceling the current drawing, without disabling the drawing
-            // mode, the drawin mode is being unset then immediately set back. When
+            // mode, the drawing mode is being unset then immediately set back. When
             // the mode is unset the 'overlaycomplete' event will fire, which will
             // give a reference to the current overlay to remove, then it is set back
             // to the mode the user was using. To the user is should just seem like
@@ -517,7 +574,7 @@ class GoogleMapsService {
             throw Error(`DrawingManager is already initialized.`);
         }
         this._assertInitialized();
-        const options = DEFAULT_DRAWING_MANAGER_OPTIONS();
+        const options = DEFAULT_DRAWING_MANAGER_OPTIONS(this.isEditingEnabled());
         const drawingManager = new google.maps.drawing.DrawingManager(options);
         drawingManager.setMap(this.googleMap);
         this._drawingManager = drawingManager;
@@ -579,10 +636,15 @@ class GoogleMapsService {
         });
         // Determine what the style of the features are.
         this.googleMap.data.setStyle(feature => {
+            let opts = FEATURE_STYLE_OPTIONS_DEFAULT(this.isEditingEnabled());
+            const options = getStyleOptionsDefinedByFeature(feature);
+            this._mergeStyleOptions(opts, options ?? {});
             if (isFeatureSelected(feature)) {
-                return FEATURE_STYLE_OPTIONS_SELECTED;
+                const hoverOptions = getHoveredStyleOptionsDefinedByFeature(feature);
+                opts = FEATURE_STYLE_OPTIONS_SELECTED(this.isEditingEnabled());
+                this._mergeStyleOptions(opts, hoverOptions ?? {});
             }
-            return FEATURE_STYLE_OPTIONS_DEFAULT;
+            return opts;
         });
         // Select a feature when clicked.
         this.googleMap.data.addListener('click', (event) => {
@@ -599,7 +661,7 @@ class GoogleMapsService {
             this._assertInitialized();
             this.googleMap.data.revertStyle();
             if (!this.isDrawing() && !isFeatureSelected(event.feature)) {
-                this.googleMap.data.overrideStyle(event.feature, { strokeWeight: 4 });
+                this.setFeatureHoveredStyleOverride(event.feature);
             }
         });
         // Remove any hover styles when mouse moves away.
@@ -608,6 +670,23 @@ class GoogleMapsService {
             this.googleMap.data.revertStyle();
         });
     }
+    setFeatureHoveredStyleOverride(feature) {
+        this._assertInitialized();
+        const overrideOpts = FEATURE_STYLE_OVERRIDE_OPTIONS_HOVERED(this.isEditingEnabled());
+        const hoverOptions = getHoveredStyleOptionsDefinedByFeature(feature);
+        this._mergeStyleOptions(overrideOpts, hoverOptions ?? {});
+        this.googleMap.data.overrideStyle(feature, overrideOpts);
+    }
+    _mergeStyleOptions(options, propertiesStyleOptions) {
+        if (Object.keys(propertiesStyleOptions).length === 0) {
+            return;
+        }
+        for (const opt of SUPPORTED_PROPERTY_STYLE_OPTIONS) {
+            if (Object.prototype.hasOwnProperty.call(propertiesStyleOptions, opt)) {
+                options[opt] = propertiesStyleOptions[opt];
+            }
+        }
+    }
     _initFeatureChangeListeners() {
         this._assertInitialized();
         createFeatureChangeObservable(this.googleMap.data, this._ngZone).pipe(switchMap(() => from(this.getGeoJson()).pipe(tap(geoJson => this._mapValueManager.setValue(geoJson, MapValueSource.FeatureChange)))), takeUntil(this._ngUnsubscribe)).subscribe();
@@ -696,11 +775,15 @@ class GoogleMapsService {
         }
     }
     // TODO: Refactor out of the service meant to just wrap the google maps api.
-    _openContextMenuForFeature(feature, position) {
+    closeContextMenu() {
         if (this._activeContextMenu) {
             this._activeContextMenu.close();
             this._activeContextMenu = null;
         }
+    }
+    // TODO: Refactor out of the service meant to just wrap the google maps api.
+    _openContextMenuForFeature(feature, position) {
+        this.closeContextMenu();
         this._assertInitialized();
         let _position = position;
         if (!_position) {
@@ -1192,6 +1275,7 @@ class TheSeamGoogleMapsComponent extends _TheSeamGoogleMapsMixinBase {
         this.mapTypeControlEnabled = true;
         this.streetViewControlEnabled = false;
         this.allowDrawingHoleInPolygon = false;
+        this.editingEnabled = true;
         this.zoom = 14;
         this.longitude = -98.570209;
         this.latitude = 37.633814;
@@ -1215,17 +1299,32 @@ class TheSeamGoogleMapsComponent extends _TheSeamGoogleMapsMixinBase {
                 this._googleMaps.setData(changed.value);
             }
         }), takeUntil(this._ngUnsubscribe)).subscribe();
+        this._contextMenuItems$ = this._googleMaps.editingEnabled$.pipe(map(enabled => {
+            const items = [];
+            if (enabled) {
+                items.push({ label: 'Delete', action: () => this._onClickDeleteFeature() });
+            }
+            return items;
+        }), tap(items => {
+            if (items.length === 0) {
+                this._googleMaps.setFeatureContextMenu(null);
+            }
+            else {
+                this._googleMaps.setFeatureContextMenu(this.featureContextMenu);
+            }
+        }));
         this._googleMaps.setBaseLatLng(this.latitude, this.longitude);
         this._gmApiLoaded = this._googleMapsApiLoader.load().pipe(map(() => true), catchError(() => of(false)));
     }
     ngOnInit() {
-        this._googleMaps.setFeatureContextMenu(this.featureContextMenu);
         fromEvent(window, 'keydown').pipe(tap((event) => {
             switch (event.code) {
                 case 'Delete':
-                    this._googleMaps.deleteSelection();
-                    event.preventDefault();
-                    event.stopPropagation();
+                    if (this._googleMaps.isEditingEnabled()) {
+                        this._googleMaps.deleteSelection();
+                        event.preventDefault();
+                        event.stopPropagation();
+                    }
                     break;
                 case 'Escape':
                     this._googleMaps.stopDrawing();
@@ -1270,6 +1369,9 @@ class TheSeamGoogleMapsComponent extends _TheSeamGoogleMapsMixinBase {
                 };
             }
         }
+        if (Object.prototype.hasOwnProperty.call(changes, 'editingEnabled')) {
+            this._googleMaps.setEditingEnabled(this.editingEnabled);
+        }
     }
     writeValue(value) {
         this.value = value;
@@ -1315,7 +1417,7 @@ class TheSeamGoogleMapsComponent extends _TheSeamGoogleMapsMixinBase {
     }
 }
 TheSeamGoogleMapsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TheSeamGoogleMapsComponent, deps: [{ token: i0.ElementRef }, { token: i1.FocusMonitor }, { token: GoogleMapsService }, { token: MapValueManagerService }, { token: TheSeamGoogleMapsApiLoader }], target: i0.ɵɵFactoryTarget.Component });
-TheSeamGoogleMapsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TheSeamGoogleMapsComponent, selector: "seam-google-maps", inputs: { disabled: "disabled", value: "value", tabIndex: "tabIndex", fileDropEnabled: "fileDropEnabled", fileUploadControlEnabled: "fileUploadControlEnabled", fullscreenControlEnabled: "fullscreenControlEnabled", reCenterControlEnabled: "reCenterControlEnabled", mapTypeControlEnabled: "mapTypeControlEnabled", streetViewControlEnabled: "streetViewControlEnabled", allowDrawingHoleInPolygon: "allowDrawingHoleInPolygon", fileImportHandler: "fileImportHandler", zoom: "zoom", longitude: "longitude", latitude: "latitude" }, outputs: { mapReady: "mapReady" }, host: { properties: { "attr.disabled": "this._attrDisabled", "attr.tabindex": "this._attrTabIndex" } }, providers: [
+TheSeamGoogleMapsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TheSeamGoogleMapsComponent, selector: "seam-google-maps", inputs: { disabled: "disabled", value: "value", tabIndex: "tabIndex", fileDropEnabled: "fileDropEnabled", fileUploadControlEnabled: "fileUploadControlEnabled", fullscreenControlEnabled: "fullscreenControlEnabled", reCenterControlEnabled: "reCenterControlEnabled", mapTypeControlEnabled: "mapTypeControlEnabled", streetViewControlEnabled: "streetViewControlEnabled", allowDrawingHoleInPolygon: "allowDrawingHoleInPolygon", editingEnabled: "editingEnabled", fileImportHandler: "fileImportHandler", zoom: "zoom", longitude: "longitude", latitude: "latitude" }, outputs: { mapReady: "mapReady" }, host: { properties: { "attr.disabled": "this._attrDisabled", "attr.tabindex": "this._attrTabIndex" } }, providers: [
         MapValueManagerService,
         GoogleMapsService,
         { provide: MAP_CONTROLS_SERVICE, useClass: GoogleMapsControlsService },
@@ -1325,7 +1427,7 @@ TheSeamGoogleMapsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0
             useExisting: forwardRef(() => TheSeamGoogleMapsComponent),
             multi: true,
         },
-    ], viewQueries: [{ propertyName: "featureContextMenu", first: true, predicate: ["featureContextMenu"], descendants: true, read: MenuComponent, static: true }], exportAs: ["seamGoogleMaps"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"_gmApiLoaded | async\">\n  <google-map\n    height=\"100%\"\n    width=\"100%\"\n    [center]=\"{ lat: latitude, lng: longitude }\"\n    [zoom]=\"zoom\"\n    [options]=\"_options\"\n    (mapInitialized)=\"_onMapReady($any($event))\"\n    >\n  </google-map>\n</ng-container>\n<seam-menu #featureContextMenu>\n  <button seamMenuItem (click)=\"_onClickDeleteFeature()\">Delete</button>\n</seam-menu>\n<seam-map-file-drop *ngIf=\"fileDropEnabled\"></seam-map-file-drop>\n\n<seam-map-control *ngIf=\"fileUploadControlEnabled\" [def]=\"_fileUploadControlDef\"></seam-map-control>\n<seam-map-control *ngIf=\"reCenterControlEnabled\" [def]=\"_reCenterControlDef\"></seam-map-control>\n", styles: [":host{display:block;position:relative;height:400px;width:100%}:host.show-focus-border.cdk-focused{outline:0;box-shadow:0 0 0 .2rem #357ebd40}:host.show-focus-border[disabled]{opacity:.65}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.MenuComponent, selector: "seam-menu", inputs: ["menuClass", "baseWidth", "animationType"], outputs: ["closed"], exportAs: ["seamMenu"] }, { kind: "component", type: i6.MenuItemComponent, selector: "[seamMenuItem]", inputs: ["disabled", "role", "icon", "iconClass", "badgeText", "badgeTheme"], exportAs: ["seamMenuItem"] }, { kind: "component", type: i7.GoogleMap, selector: "google-map", inputs: ["height", "width", "mapTypeId", "center", "zoom", "options"], outputs: ["mapInitialized", "authFailure", "boundsChanged", "centerChanged", "mapClick", "mapDblclick", "mapDrag", "mapDragend", "mapDragstart", "headingChanged", "idle", "maptypeidChanged", "mapMousemove", "mapMouseout", "mapMouseover", "projectionChanged", "mapRightclick", "tilesloaded", "tiltChanged", "zoomChanged"], exportAs: ["googleMap"] }, { kind: "component", type: TheSeamMapFileDropComponent, selector: "seam-map-file-drop" }, { kind: "component", type: TheSeamMapsControlComponent, selector: "seam-map-control", inputs: ["def"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    ], viewQueries: [{ propertyName: "featureContextMenu", first: true, predicate: ["featureContextMenu"], descendants: true, read: MenuComponent, static: true }], exportAs: ["seamGoogleMaps"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"_gmApiLoaded | async\">\n  <google-map\n    height=\"100%\"\n    width=\"100%\"\n    [center]=\"{ lat: latitude, lng: longitude }\"\n    [zoom]=\"zoom\"\n    [options]=\"_options\"\n    (mapInitialized)=\"_onMapReady($any($event))\"\n    >\n  </google-map>\n</ng-container>\n<seam-menu #featureContextMenu>\n  <button seamMenuItem *ngFor=\"let item of _contextMenuItems$ | async\" (click)=\"item.action(item)\">{{ item.label }}</button>\n</seam-menu>\n<seam-map-file-drop *ngIf=\"fileDropEnabled\"></seam-map-file-drop>\n\n<seam-map-control *ngIf=\"fileUploadControlEnabled\" [def]=\"_fileUploadControlDef\"></seam-map-control>\n<seam-map-control *ngIf=\"reCenterControlEnabled\" [def]=\"_reCenterControlDef\"></seam-map-control>\n", styles: [":host{display:block;position:relative;height:400px;width:100%}:host.show-focus-border.cdk-focused{outline:0;box-shadow:0 0 0 .2rem #357ebd40}:host.show-focus-border[disabled]{opacity:.65}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.MenuComponent, selector: "seam-menu", inputs: ["menuClass", "baseWidth", "animationType"], outputs: ["closed"], exportAs: ["seamMenu"] }, { kind: "component", type: i6.MenuItemComponent, selector: "[seamMenuItem]", inputs: ["disabled", "role", "icon", "iconClass", "sublevelIcon", "subLevelIconClass", "badgeText", "badgeTheme"], exportAs: ["seamMenuItem"] }, { kind: "component", type: i7.GoogleMap, selector: "google-map", inputs: ["height", "width", "mapTypeId", "center", "zoom", "options"], outputs: ["mapInitialized", "authFailure", "boundsChanged", "centerChanged", "mapClick", "mapDblclick", "mapDrag", "mapDragend", "mapDragstart", "headingChanged", "idle", "maptypeidChanged", "mapMousemove", "mapMouseout", "mapMouseover", "projectionChanged", "mapRightclick", "tilesloaded", "tiltChanged", "zoomChanged"], exportAs: ["googleMap"] }, { kind: "component", type: TheSeamMapFileDropComponent, selector: "seam-map-file-drop" }, { kind: "component", type: TheSeamMapsControlComponent, selector: "seam-map-control", inputs: ["def"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 __decorate([
     InputBoolean()
 ], TheSeamGoogleMapsComponent.prototype, "fileDropEnabled", void 0);
@@ -1347,6 +1449,9 @@ __decorate([
 __decorate([
     InputBoolean()
 ], TheSeamGoogleMapsComponent.prototype, "allowDrawingHoleInPolygon", void 0);
+__decorate([
+    InputBoolean()
+], TheSeamGoogleMapsComponent.prototype, "editingEnabled", void 0);
 __decorate([
     InputNumber()
 ], TheSeamGoogleMapsComponent.prototype, "zoom", void 0);
@@ -1370,7 +1475,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                             useExisting: forwardRef(() => TheSeamGoogleMapsComponent),
                             multi: true,
                         },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'seamGoogleMaps', template: "<ng-container *ngIf=\"_gmApiLoaded | async\">\n  <google-map\n    height=\"100%\"\n    width=\"100%\"\n    [center]=\"{ lat: latitude, lng: longitude }\"\n    [zoom]=\"zoom\"\n    [options]=\"_options\"\n    (mapInitialized)=\"_onMapReady($any($event))\"\n    >\n  </google-map>\n</ng-container>\n<seam-menu #featureContextMenu>\n  <button seamMenuItem (click)=\"_onClickDeleteFeature()\">Delete</button>\n</seam-menu>\n<seam-map-file-drop *ngIf=\"fileDropEnabled\"></seam-map-file-drop>\n\n<seam-map-control *ngIf=\"fileUploadControlEnabled\" [def]=\"_fileUploadControlDef\"></seam-map-control>\n<seam-map-control *ngIf=\"reCenterControlEnabled\" [def]=\"_reCenterControlDef\"></seam-map-control>\n", styles: [":host{display:block;position:relative;height:400px;width:100%}:host.show-focus-border.cdk-focused{outline:0;box-shadow:0 0 0 .2rem #357ebd40}:host.show-focus-border[disabled]{opacity:.65}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'seamGoogleMaps', template: "<ng-container *ngIf=\"_gmApiLoaded | async\">\n  <google-map\n    height=\"100%\"\n    width=\"100%\"\n    [center]=\"{ lat: latitude, lng: longitude }\"\n    [zoom]=\"zoom\"\n    [options]=\"_options\"\n    (mapInitialized)=\"_onMapReady($any($event))\"\n    >\n  </google-map>\n</ng-container>\n<seam-menu #featureContextMenu>\n  <button seamMenuItem *ngFor=\"let item of _contextMenuItems$ | async\" (click)=\"item.action(item)\">{{ item.label }}</button>\n</seam-menu>\n<seam-map-file-drop *ngIf=\"fileDropEnabled\"></seam-map-file-drop>\n\n<seam-map-control *ngIf=\"fileUploadControlEnabled\" [def]=\"_fileUploadControlDef\"></seam-map-control>\n<seam-map-control *ngIf=\"reCenterControlEnabled\" [def]=\"_reCenterControlDef\"></seam-map-control>\n", styles: [":host{display:block;position:relative;height:400px;width:100%}:host.show-focus-border.cdk-focused{outline:0;box-shadow:0 0 0 .2rem #357ebd40}:host.show-focus-border[disabled]{opacity:.65}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.FocusMonitor }, { type: GoogleMapsService }, { type: MapValueManagerService }, { type: TheSeamGoogleMapsApiLoader }]; }, propDecorators: { value: [{
                 type: Input
             }], tabIndex: [{
@@ -1389,6 +1494,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                 type: Input
             }], allowDrawingHoleInPolygon: [{
                 type: Input
+            }], editingEnabled: [{
+                type: Input
             }], fileImportHandler: [{
                 type: Input
             }], _attrDisabled: [{
@@ -1783,7 +1890,8 @@ TheSeamGoogleMapsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0",
         TheSeamFormFieldModule,
         GoogleMapsModule], exports: [TheSeamGoogleMapsComponent,
         TheSeamGoogleMapsPlacesAutocompleteDirective,
-        TheSeamGoogleMapsPlacesAutoCompleteComponent] });
+        TheSeamGoogleMapsPlacesAutoCompleteComponent,
+        TheSeamMapsControlComponent] });
 TheSeamGoogleMapsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TheSeamGoogleMapsModule, imports: [CommonModule,
         ObserversModule,
         TheSeamSharedModule,
@@ -1816,6 +1924,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                         TheSeamGoogleMapsComponent,
                         TheSeamGoogleMapsPlacesAutocompleteDirective,
                         TheSeamGoogleMapsPlacesAutoCompleteComponent,
+                        TheSeamMapsControlComponent,
                     ]
                 }]
         }] });
@@ -1944,5 +2053,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AppFeaturePropertyName, GoogleMapsContextMenu, GoogleMapsControlsService, GoogleMapsService, MapControlRef, MapValueManagerService, MapValueSource, SEAM_GOOGLE_PLACES_AUTOCOMPLETE_DEFAULT_OPTIONS, THESEAM_LAZY_MAPS_API_CONFIG, TheSeamGoogleMapsApiLoader, TheSeamGoogleMapsComponent, TheSeamGoogleMapsModule, TheSeamGoogleMapsPlacesAutoCompleteComponent, TheSeamGoogleMapsPlacesAutocompleteDirective, TheSeamGoogleMapsRecenterButtonControlComponent, TheSeamGoogleMapsUploadButtonControlComponent, TheSeamLazyMapsApiLoader, TheSeamMapFileDropComponent, TheSeamMapsControlComponent, TheSeamNoopGoogleMapsAPILoader, addInnerFeatureCutoutToExteriorFeature, createDataFeatureFromPolygon, createFeatureChangeObservable, featureContains, fixPathDifferentStartingAndEndingPoint, getBoundsWithAllFeatures, getFeatureBounds, getFeatureCenter, getFeaturesCount, getPossibleExteriorFeature, isAppFeatureProperty, isFeatureSelected, multiPolygonCoordinates, polygonCoordinates, polygonHasValidPathsLengths, removeAllFeatures, setFeatureSelected, stripAppFeaturePropertiesFromJson, toTurfJsFeature, toTurfJsMultiPolygon, toTurfJsPolygon };
+export { AppFeaturePropertyName, GoogleMapsContextMenu, GoogleMapsControlsService, GoogleMapsService, MAP_CONTROLS_SERVICE, MAP_CONTROL_DATA, MapControlRef, MapValueManagerService, MapValueSource, SEAM_GOOGLE_PLACES_AUTOCOMPLETE_DEFAULT_OPTIONS, THESEAM_LAZY_MAPS_API_CONFIG, TheSeamGoogleMapsApiLoader, TheSeamGoogleMapsComponent, TheSeamGoogleMapsModule, TheSeamGoogleMapsPlacesAutoCompleteComponent, TheSeamGoogleMapsPlacesAutocompleteDirective, TheSeamGoogleMapsRecenterButtonControlComponent, TheSeamGoogleMapsUploadButtonControlComponent, TheSeamLazyMapsApiLoader, TheSeamMapFileDropComponent, TheSeamMapsControlComponent, TheSeamNoopGoogleMapsAPILoader, addInnerFeatureCutoutToExteriorFeature, createDataFeatureFromPolygon, createFeatureChangeObservable, featureContains, fixPathDifferentStartingAndEndingPoint, getBoundsWithAllFeatures, getFeatureBounds, getFeatureCenter, getFeaturesCount, getHoveredStyleOptionsDefinedByFeature, getPossibleExteriorFeature, getSelectedStyleOptionsDefinedByFeature, getStyleOptionsDefinedByFeature, isAppFeatureProperty, isFeatureSelected, multiPolygonCoordinates, polygonCoordinates, polygonHasValidPathsLengths, removeAllFeatures, setFeatureSelected, stripAppFeaturePropertiesFromJson, toTurfJsFeature, toTurfJsMultiPolygon, toTurfJsPolygon };
 //# sourceMappingURL=theseam-ui-common-google-maps.mjs.map