@igo2/geo 21.0.0-next.13 → 21.0.0-next.14

package/fesm2022/igo2-geo.mjs

@@ -107,7 +107,7 @@ import { MatSelectModule, MAT_SELECT_CONFIG, MatSelectChange } from '@angular/ma
 import { MatDividerModule } from '@angular/material/divider';
 import * as i1$2 from '@angular/material/list';
 import { MatListModule } from '@angular/material/list';
-import * as i1$3 from '@angular/material/slide-toggle';
+import * as i2$2 from '@angular/material/slide-toggle';
 import { MatSlideToggleModule } from '@angular/material/slide-toggle';
 import * as olCondition from 'ol/events/condition';
 import { doubleClick } from 'ol/events/condition';
@@ -160,7 +160,7 @@ import { AnalyticsService } from '@igo2/core/analytics';
 import { MatDatepickerModule } from '@angular/material/datepicker';
 import { DatepickerComponent } from '@igo2/common/datepicker';
 import { TimepickerComponent } from '@igo2/common/timepicker';
-import * as i1$4 from '@angular/material/button-toggle';
+import * as i1$3 from '@angular/material/button-toggle';
 import { MatButtonToggleModule, MAT_BUTTON_TOGGLE_DEFAULT_OPTIONS } from '@angular/material/button-toggle';
 import * as i12 from '@angular/material/chips';
 import { MatChipsModule } from '@angular/material/chips';
@@ -171,7 +171,7 @@ import { NestedTreeControl } from '@angular/cdk/tree';
 import * as i6$1 from '@angular/material/table';
 import { MatTableModule } from '@angular/material/table';
 import OlOverlay from 'ol/Overlay';
-import * as i2$3 from '@angular/material/dialog';
+import * as i2$4 from '@angular/material/dialog';
 import { MatDialogRef, MAT_DIALOG_DATA, MatDialogTitle, MatDialogContent, MatDialogActions, MatDialogClose, MatDialog, MatDialogModule } from '@angular/material/dialog';
 import FlexSearch from 'flexsearch';
 import OlDraw from 'ol/interaction/Draw';
@@ -183,9 +183,9 @@ import lineIntersect from '@turf/line-intersect';
 import { ColorPickerFormFieldComponent } from '@igo2/common/color';
 import OlLinearRing from 'ol/geom/LinearRing';
 import OlTranslate from 'ol/interaction/Translate';
-import * as i1$5 from '@angular/material/tabs';
+import * as i1$4 from '@angular/material/tabs';
 import { MatTabsModule } from '@angular/material/tabs';
-import * as i2$2 from '@mat-datetimepicker/core';
+import * as i2$3 from '@mat-datetimepicker/core';
 import { MatDatetimepickerModule, MatNativeDatetimeModule } from '@mat-datetimepicker/core';
 import { ConfirmDialogService } from '@igo2/common/confirm-dialog';
 import { SpinnerComponent } from '@igo2/common/spinner';
@@ -6588,8 +6588,24 @@ class DirectionsSource {
 
 class DirectionsSourceService {
     sources;
+    activeSource;
+    configService = inject(ConfigService);
     constructor(sources) {
         this.sources = sources;
+        const preferredSourceId = this.configService.getConfig('directionsSources.defaultSourceId');
+        this.activeSource = this.computeActiveSource(preferredSourceId);
+    }
+    setActiveSource(id) {
+        this.activeSource = this.computeActiveSource(id);
+    }
+    computeActiveSource(id) {
+        if (!id) {
+            return this.sources[0];
+        }
+        else {
+            return (this.sources.find((source) => source.getSourceId() === id) ??
+                this.sources[0]);
+        }
     }
 }
 function directionsSourceServiceFactory(sources) {
@@ -9168,7 +9184,7 @@ class DirectionsService {
         if (coordinates.length === 0) {
             return;
         }
-        const source = this.directionsSourceService.sources[0];
+        const source = this.directionsSourceService.activeSource;
         const request = source.route(coordinates, directionsOptions);
         return request;
     }
@@ -12718,7 +12734,7 @@ class LayerLegendListComponent {
         this.layers.set(layers ?? []);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: LayerLegendListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: LayerLegendListComponent, isStandalone: true, selector: "igo-layer-legend-list", inputs: { layers: { classPropertyName: "layers", publicName: "layers", isSignal: true, isRequired: false, transformFunction: null }, excludeBaseLayers: { classPropertyName: "excludeBaseLayers", publicName: "excludeBaseLayers", isSignal: true, isRequired: false, transformFunction: null }, updateLegendOnResolutionChange: { classPropertyName: "updateLegendOnResolutionChange", publicName: "updateLegendOnResolutionChange", isSignal: true, isRequired: false, transformFunction: null }, allowShowAllLegends: { classPropertyName: "allowShowAllLegends", publicName: "allowShowAllLegends", isSignal: true, isRequired: false, transformFunction: null }, showAllLegendsValue: { classPropertyName: "showAllLegendsValue", publicName: "showAllLegendsValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { layers: "layersChange", showAllLegendsValue: "showAllLegendsValueChange", allLegendsShown: "allLegendsShown" }, ngImport: i0, template: "<div class=\"layer-legend-list-container\">\n  @if (layersInUi().length && allowShowAllLegends()) {\n    <mat-slide-toggle\n      tooltip-position=\"above\"\n      matTooltipShowDelay=\"500\"\n      [matTooltip]=\"'igo.geo.layer.legend.showAll' | translate\"\n      [checked]=\"showAllLegendsValue()\"\n      [labelPosition]=\"'before'\"\n      (change)=\"toggleShowAllLegends($event.checked)\"\n    >\n      {{ 'igo.geo.layer.legend.showAll' | translate }}\n    </mat-slide-toggle>\n  }\n  @if (layersInUi().length && allowShowAllLegends()) {\n    <mat-divider />\n  }\n  <igo-list [navigation]=\"false\" [selection]=\"false\">\n    @for (layer of layersLegend(); track layer; let i = $index) {\n      @if (!(excludeBaseLayers() && isLayerItem(layer) && layer.baseLayer)) {\n        <igo-layer-legend-item\n          igoListItem\n          [layer]=\"$any(layer)\"\n          [updateLegendOnResolutionChange]=\"updateLegendOnResolutionChange()\"\n        />\n      }\n    }\n  </igo-list>\n  @if (\n    !showAllLegendsValue() &&\n    layersInUi().length &&\n    hasVisibleOrInRangeLayers() === false &&\n    hasVisibleAndNotInRangeLayers() === false &&\n    allowShowAllLegends()\n  ) {\n    <p class=\"layers-empty\">\n      {{ 'igo.geo.layer.legend.noLayersVisibleWithShowAllButton' | translate }}\n    </p>\n  }\n  @if (\n    !showAllLegendsValue() &&\n    layersInUi().length &&\n    hasVisibleOrInRangeLayers() === false &&\n    hasVisibleAndNotInRangeLayers() &&\n    allowShowAllLegends()\n  ) {\n    <p class=\"layers-empty\">\n      {{\n        'igo.geo.layer.legend.noLayersVisibleWithShowAllButtonButZoom'\n          | translate\n      }}\n    </p>\n  }\n  @if (\n    layersInUi().length &&\n    hasVisibleOrInRangeLayers() === false &&\n    hasVisibleAndNotInRangeLayers() === false &&\n    !allowShowAllLegends()\n  ) {\n    <p class=\"layers-empty\">\n      {{ 'igo.geo.layer.legend.noLayersVisible' | translate }}\n    </p>\n  }\n  @if (\n    layersInUi().length &&\n    hasVisibleOrInRangeLayers() === false &&\n    hasVisibleAndNotInRangeLayers() &&\n    !allowShowAllLegends()\n  ) {\n    <p class=\"layers-empty\">\n      {{ 'igo.geo.layer.legend.noLayersVisibleButZoom' | translate }}\n    </p>\n  }\n</div>\n", styles: [":host mat-slide-toggle{width:100%;padding:10px}:host mat-slide-toggle ::ng-deep .mdc-form-field{width:100%}:host mat-slide-toggle ::ng-deep .mdc-label{margin-left:0;width:calc(100% - 60px)}:host igo-list{display:contents}:host .layers-empty{text-align:justify;margin:10px}:host .layer-legend-list-container{max-height:100%;overflow:auto}\n"], dependencies: [{ kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i1$3.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i1$2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: ListComponent, selector: "igo-list", inputs: ["navigation", "selection"] }, { kind: "component", type: LayerLegendItemComponent, selector: "igo-layer-legend-item", inputs: ["layer", "updateLegendOnResolutionChange"] }, { kind: "directive", type: ListItemDirective, selector: "[igoListItem]", inputs: ["color", "focused", "selected", "disabled"], outputs: ["beforeSelect", "beforeFocus", "beforeUnselect", "beforeUnfocus", "beforeDisable", "beforeEnable", "focus", "unfocus", "select", "unselect", "disable", "enable"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: LayerLegendListComponent, isStandalone: true, selector: "igo-layer-legend-list", inputs: { layers: { classPropertyName: "layers", publicName: "layers", isSignal: true, isRequired: false, transformFunction: null }, excludeBaseLayers: { classPropertyName: "excludeBaseLayers", publicName: "excludeBaseLayers", isSignal: true, isRequired: false, transformFunction: null }, updateLegendOnResolutionChange: { classPropertyName: "updateLegendOnResolutionChange", publicName: "updateLegendOnResolutionChange", isSignal: true, isRequired: false, transformFunction: null }, allowShowAllLegends: { classPropertyName: "allowShowAllLegends", publicName: "allowShowAllLegends", isSignal: true, isRequired: false, transformFunction: null }, showAllLegendsValue: { classPropertyName: "showAllLegendsValue", publicName: "showAllLegendsValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { layers: "layersChange", showAllLegendsValue: "showAllLegendsValueChange", allLegendsShown: "allLegendsShown" }, ngImport: i0, template: "<div class=\"layer-legend-list-container\">\n  @if (layersInUi().length && allowShowAllLegends()) {\n    <mat-slide-toggle\n      tooltip-position=\"above\"\n      matTooltipShowDelay=\"500\"\n      [matTooltip]=\"'igo.geo.layer.legend.showAll' | translate\"\n      [checked]=\"showAllLegendsValue()\"\n      [labelPosition]=\"'before'\"\n      (change)=\"toggleShowAllLegends($event.checked)\"\n    >\n      {{ 'igo.geo.layer.legend.showAll' | translate }}\n    </mat-slide-toggle>\n  }\n  @if (layersInUi().length && allowShowAllLegends()) {\n    <mat-divider />\n  }\n  <igo-list [navigation]=\"false\" [selection]=\"false\">\n    @for (layer of layersLegend(); track layer; let i = $index) {\n      @if (!(excludeBaseLayers() && isLayerItem(layer) && layer.baseLayer)) {\n        <igo-layer-legend-item\n          igoListItem\n          [layer]=\"$any(layer)\"\n          [updateLegendOnResolutionChange]=\"updateLegendOnResolutionChange()\"\n        />\n      }\n    }\n  </igo-list>\n  @if (\n    !showAllLegendsValue() &&\n    layersInUi().length &&\n    hasVisibleOrInRangeLayers() === false &&\n    hasVisibleAndNotInRangeLayers() === false &&\n    allowShowAllLegends()\n  ) {\n    <p class=\"layers-empty\">\n      {{ 'igo.geo.layer.legend.noLayersVisibleWithShowAllButton' | translate }}\n    </p>\n  }\n  @if (\n    !showAllLegendsValue() &&\n    layersInUi().length &&\n    hasVisibleOrInRangeLayers() === false &&\n    hasVisibleAndNotInRangeLayers() &&\n    allowShowAllLegends()\n  ) {\n    <p class=\"layers-empty\">\n      {{\n        'igo.geo.layer.legend.noLayersVisibleWithShowAllButtonButZoom'\n          | translate\n      }}\n    </p>\n  }\n  @if (\n    layersInUi().length &&\n    hasVisibleOrInRangeLayers() === false &&\n    hasVisibleAndNotInRangeLayers() === false &&\n    !allowShowAllLegends()\n  ) {\n    <p class=\"layers-empty\">\n      {{ 'igo.geo.layer.legend.noLayersVisible' | translate }}\n    </p>\n  }\n  @if (\n    layersInUi().length &&\n    hasVisibleOrInRangeLayers() === false &&\n    hasVisibleAndNotInRangeLayers() &&\n    !allowShowAllLegends()\n  ) {\n    <p class=\"layers-empty\">\n      {{ 'igo.geo.layer.legend.noLayersVisibleButZoom' | translate }}\n    </p>\n  }\n</div>\n", styles: [":host mat-slide-toggle{width:100%;padding:10px}:host mat-slide-toggle ::ng-deep .mdc-form-field{width:100%}:host mat-slide-toggle ::ng-deep .mdc-label{margin-left:0;width:calc(100% - 60px)}:host igo-list{display:contents}:host .layers-empty{text-align:justify;margin:10px}:host .layer-legend-list-container{max-height:100%;overflow:auto}\n"], dependencies: [{ kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i2$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i1$2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: ListComponent, selector: "igo-list", inputs: ["navigation", "selection"] }, { kind: "component", type: LayerLegendItemComponent, selector: "igo-layer-legend-item", inputs: ["layer", "updateLegendOnResolutionChange"] }, { kind: "directive", type: ListItemDirective, selector: "[igoListItem]", inputs: ["color", "focused", "selected", "disabled"], outputs: ["beforeSelect", "beforeFocus", "beforeUnselect", "beforeUnfocus", "beforeDisable", "beforeEnable", "focus", "unfocus", "select", "unselect", "disable", "enable"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: LayerLegendListComponent, decorators: [{
             type: Component,
@@ -17042,7 +17058,6 @@ class DirectionsComponent {
     searchService = inject(SearchService);
     queryService = inject(QueryService);
     projection = 'EPSG:4326';
-    twoSourcesAvailable = false;
     storeEmpty$$;
     storeChange$$;
     routesQueries$$ = [];
@@ -17077,6 +17092,12 @@ class DirectionsComponent {
         return this.directionsSourceService.sources[0].getEnabledProfile()
             .authorization;
     }
+    get activeSource() {
+        return this.directionsSourceService.activeSource;
+    }
+    get sources() {
+        return this.directionsSourceService.sources;
+    }
     constructor() {
         effect(() => {
             if (this.zoomToActiveRoute()) {
@@ -17085,10 +17106,6 @@ class DirectionsComponent {
         });
     }
     ngOnInit() {
-        this.twoSourcesAvailable =
-            this.directionsSourceService.sources[0].profiles.length === 2
-                ? true
-                : false;
         this.queryService.queryEnabled = false;
         this.initEntityStores();
         setTimeout(() => {
@@ -17365,18 +17382,25 @@ class DirectionsComponent {
             ? ol.addInteraction(interaction)
             : ol.removeInteraction(interaction));
     }
+    onSourceChange(sourceId) {
+        this.directionsSourceService.setActiveSource(sourceId);
+        this.getRoutes(this.isTranslating);
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: DirectionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: DirectionsComponent, isStandalone: true, selector: "igo-directions", inputs: { contextUri: { classPropertyName: "contextUri", publicName: "contextUri", isSignal: true, isRequired: false, transformFunction: null }, stopsStore: { classPropertyName: "stopsStore", publicName: "stopsStore", isSignal: true, isRequired: true, transformFunction: null }, stopsFeatureStore: { classPropertyName: "stopsFeatureStore", publicName: "stopsFeatureStore", isSignal: true, isRequired: true, transformFunction: null }, routesFeatureStore: { classPropertyName: "routesFeatureStore", publicName: "routesFeatureStore", isSignal: true, isRequired: true, transformFunction: null }, stepsFeatureStore: { classPropertyName: "stepsFeatureStore", publicName: "stepsFeatureStore", isSignal: true, isRequired: true, transformFunction: null }, debounce: { classPropertyName: "debounce", publicName: "debounce", isSignal: true, isRequired: false, transformFunction: null }, length: { classPropertyName: "length", publicName: "length", isSignal: true, isRequired: false, transformFunction: null }, coordRoundedDecimals: { classPropertyName: "coordRoundedDecimals", publicName: "coordRoundedDecimals", isSignal: true, isRequired: false, transformFunction: null }, zoomToActiveRoute: { classPropertyName: "zoomToActiveRoute", publicName: "zoomToActiveRoute", isSignal: true, isRequired: true, transformFunction: null }, authenticated$: { classPropertyName: "authenticated$", publicName: "authenticated$", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"directions-options\">\n  <mat-slide-toggle\n    [checked]=\"directionControlIsActive\"\n    [labelPosition]=\"'before'\"\n    (change)=\"onToggleDirectionsControl($event.checked)\"\n  >\n    {{ 'igo.geo.directions.toggle.activateControl' | translate }}\n  </mat-slide-toggle>\n</div>\n\n<igo-directions-inputs\n  (stopInputHasFocus)=\"onStopInputHasFocusChange($event)\"\n  [coordRoundedDecimals]=\"coordRoundedDecimals()\"\n  [projection]=\"projection\"\n  [stopsFeatureStore]=\"stopsFeatureStore()\"\n  [stopsStore]=\"stopsStore()\"\n  [debounce]=\"debounce()\"\n  [length]=\"length()\"\n/>\n\n@if (routesFeatureStore().all().length > 0) {\n  <igo-directions-buttons\n    [stepsFeatureStore]=\"stepsFeatureStore()\"\n    [contextUri]=\"contextUri()\"\n    (zoomOnActiveRoute)=\"zoomOnActiveRoute()\"\n    [routesFeatureStore]=\"routesFeatureStore()\"\n    [stopsStore]=\"stopsStore()\"\n  />\n}\n\n<igo-directions-results\n  [stepsFeatureStore]=\"stepsFeatureStore()\"\n  [routesFeatureStore]=\"routesFeatureStore()\"\n/>\n", styles: [":host{display:block;padding:16px}.directions-options{display:flex;flex-flow:column;align-items:center;row-gap:8px;margin-bottom:16px}.directions-options mat-slide-toggle{width:100%}.directions-options mat-slide-toggle ::ng-deep .mdc-form-field{width:100%}.directions-options mat-slide-toggle ::ng-deep .mdc-label{margin-left:0;margin-right:auto;width:auto;padding-right:0}.directions-options mat-slide-toggle ::ng-deep .mdc-slide-toggle{margin-left:auto;margin-right:0}\n"], dependencies: [{ kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i1$3.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "component", type: DirectionsButtonsComponent, selector: "igo-directions-buttons", inputs: ["contextUri", "stopsStore", "routesFeatureStore", "stepsFeatureStore"], outputs: ["zoomOnActiveRoute"] }, { kind: "component", type: DirectionsInputsComponent, selector: "igo-directions-inputs", inputs: ["stopsStore", "stopsFeatureStore", "projection", "coordRoundedDecimals", "debounce", "length"], outputs: ["stopInputHasFocus"] }, { kind: "component", type: DirectionsResultsComponent, selector: "igo-directions-results", inputs: ["routesFeatureStore", "stepsFeatureStore"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: DirectionsComponent, isStandalone: true, selector: "igo-directions", inputs: { contextUri: { classPropertyName: "contextUri", publicName: "contextUri", isSignal: true, isRequired: false, transformFunction: null }, stopsStore: { classPropertyName: "stopsStore", publicName: "stopsStore", isSignal: true, isRequired: true, transformFunction: null }, stopsFeatureStore: { classPropertyName: "stopsFeatureStore", publicName: "stopsFeatureStore", isSignal: true, isRequired: true, transformFunction: null }, routesFeatureStore: { classPropertyName: "routesFeatureStore", publicName: "routesFeatureStore", isSignal: true, isRequired: true, transformFunction: null }, stepsFeatureStore: { classPropertyName: "stepsFeatureStore", publicName: "stepsFeatureStore", isSignal: true, isRequired: true, transformFunction: null }, debounce: { classPropertyName: "debounce", publicName: "debounce", isSignal: true, isRequired: false, transformFunction: null }, length: { classPropertyName: "length", publicName: "length", isSignal: true, isRequired: false, transformFunction: null }, coordRoundedDecimals: { classPropertyName: "coordRoundedDecimals", publicName: "coordRoundedDecimals", isSignal: true, isRequired: false, transformFunction: null }, zoomToActiveRoute: { classPropertyName: "zoomToActiveRoute", publicName: "zoomToActiveRoute", isSignal: true, isRequired: true, transformFunction: null }, authenticated$: { classPropertyName: "authenticated$", publicName: "authenticated$", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"directions-options\">\n  @if (sources.length > 1) {\n    <mat-form-field subscriptSizing=\"dynamic\">\n      <mat-label>{{\n        'igo.geo.directions.results.routingSource' | translate\n      }}</mat-label>\n      <mat-select\n        [matTooltip]=\"\n          'igo.geo.directions.results.routingSourceTooltip' | translate\n        \"\n        [value]=\"activeSource\"\n        (selectionChange)=\"onSourceChange($event.value)\"\n      >\n        @for (source of sources; track source) {\n          <mat-option [value]=\"source.getSourceId()\">{{\n            source.getSourceName()\n          }}</mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  }\n\n  <mat-slide-toggle\n    [checked]=\"directionControlIsActive\"\n    [labelPosition]=\"'before'\"\n    (change)=\"onToggleDirectionsControl($event.checked)\"\n  >\n    {{ 'igo.geo.directions.toggle.activateControl' | translate }}\n  </mat-slide-toggle>\n</div>\n\n<igo-directions-inputs\n  (stopInputHasFocus)=\"onStopInputHasFocusChange($event)\"\n  [coordRoundedDecimals]=\"coordRoundedDecimals()\"\n  [projection]=\"projection\"\n  [stopsFeatureStore]=\"stopsFeatureStore()\"\n  [stopsStore]=\"stopsStore()\"\n  [debounce]=\"debounce()\"\n  [length]=\"length()\"\n/>\n\n@if (routesFeatureStore().all().length > 0) {\n  <igo-directions-buttons\n    [stepsFeatureStore]=\"stepsFeatureStore()\"\n    [contextUri]=\"contextUri()\"\n    (zoomOnActiveRoute)=\"zoomOnActiveRoute()\"\n    [routesFeatureStore]=\"routesFeatureStore()\"\n    [stopsStore]=\"stopsStore()\"\n  />\n}\n\n<igo-directions-results\n  [stepsFeatureStore]=\"stepsFeatureStore()\"\n  [routesFeatureStore]=\"routesFeatureStore()\"\n/>\n", styles: [":host{display:block;padding:16px}.directions-options{display:flex;flex-flow:column;align-items:center;row-gap:8px;margin-bottom:16px}.directions-options mat-slide-toggle{width:100%}.directions-options mat-slide-toggle ::ng-deep .mdc-form-field{width:100%}.directions-options mat-slide-toggle ::ng-deep .mdc-label{margin-left:0;margin-right:auto;width:auto;padding-right:0}.directions-options mat-slide-toggle ::ng-deep .mdc-slide-toggle{margin-left:auto;margin-right:0}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i2$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: DirectionsButtonsComponent, selector: "igo-directions-buttons", inputs: ["contextUri", "stopsStore", "routesFeatureStore", "stepsFeatureStore"], outputs: ["zoomOnActiveRoute"] }, { kind: "component", type: DirectionsInputsComponent, selector: "igo-directions-inputs", inputs: ["stopsStore", "stopsFeatureStore", "projection", "coordRoundedDecimals", "debounce", "length"], outputs: ["stopInputHasFocus"] }, { kind: "component", type: DirectionsResultsComponent, selector: "igo-directions-results", inputs: ["routesFeatureStore", "stepsFeatureStore"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: DirectionsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igo-directions', imports: [
+                        MatFormFieldModule,
+                        MatSelectModule,
                         MatSlideToggleModule,
+                        MatTooltipModule,
                         DirectionsButtonsComponent,
                         DirectionsInputsComponent,
                         DirectionsResultsComponent,
                         IgoLanguageModule
-                    ], template: "<div class=\"directions-options\">\n  <mat-slide-toggle\n    [checked]=\"directionControlIsActive\"\n    [labelPosition]=\"'before'\"\n    (change)=\"onToggleDirectionsControl($event.checked)\"\n  >\n    {{ 'igo.geo.directions.toggle.activateControl' | translate }}\n  </mat-slide-toggle>\n</div>\n\n<igo-directions-inputs\n  (stopInputHasFocus)=\"onStopInputHasFocusChange($event)\"\n  [coordRoundedDecimals]=\"coordRoundedDecimals()\"\n  [projection]=\"projection\"\n  [stopsFeatureStore]=\"stopsFeatureStore()\"\n  [stopsStore]=\"stopsStore()\"\n  [debounce]=\"debounce()\"\n  [length]=\"length()\"\n/>\n\n@if (routesFeatureStore().all().length > 0) {\n  <igo-directions-buttons\n    [stepsFeatureStore]=\"stepsFeatureStore()\"\n    [contextUri]=\"contextUri()\"\n    (zoomOnActiveRoute)=\"zoomOnActiveRoute()\"\n    [routesFeatureStore]=\"routesFeatureStore()\"\n    [stopsStore]=\"stopsStore()\"\n  />\n}\n\n<igo-directions-results\n  [stepsFeatureStore]=\"stepsFeatureStore()\"\n  [routesFeatureStore]=\"routesFeatureStore()\"\n/>\n", styles: [":host{display:block;padding:16px}.directions-options{display:flex;flex-flow:column;align-items:center;row-gap:8px;margin-bottom:16px}.directions-options mat-slide-toggle{width:100%}.directions-options mat-slide-toggle ::ng-deep .mdc-form-field{width:100%}.directions-options mat-slide-toggle ::ng-deep .mdc-label{margin-left:0;margin-right:auto;width:auto;padding-right:0}.directions-options mat-slide-toggle ::ng-deep .mdc-slide-toggle{margin-left:auto;margin-right:0}\n"] }]
+                    ], template: "<div class=\"directions-options\">\n  @if (sources.length > 1) {\n    <mat-form-field subscriptSizing=\"dynamic\">\n      <mat-label>{{\n        'igo.geo.directions.results.routingSource' | translate\n      }}</mat-label>\n      <mat-select\n        [matTooltip]=\"\n          'igo.geo.directions.results.routingSourceTooltip' | translate\n        \"\n        [value]=\"activeSource\"\n        (selectionChange)=\"onSourceChange($event.value)\"\n      >\n        @for (source of sources; track source) {\n          <mat-option [value]=\"source.getSourceId()\">{{\n            source.getSourceName()\n          }}</mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  }\n\n  <mat-slide-toggle\n    [checked]=\"directionControlIsActive\"\n    [labelPosition]=\"'before'\"\n    (change)=\"onToggleDirectionsControl($event.checked)\"\n  >\n    {{ 'igo.geo.directions.toggle.activateControl' | translate }}\n  </mat-slide-toggle>\n</div>\n\n<igo-directions-inputs\n  (stopInputHasFocus)=\"onStopInputHasFocusChange($event)\"\n  [coordRoundedDecimals]=\"coordRoundedDecimals()\"\n  [projection]=\"projection\"\n  [stopsFeatureStore]=\"stopsFeatureStore()\"\n  [stopsStore]=\"stopsStore()\"\n  [debounce]=\"debounce()\"\n  [length]=\"length()\"\n/>\n\n@if (routesFeatureStore().all().length > 0) {\n  <igo-directions-buttons\n    [stepsFeatureStore]=\"stepsFeatureStore()\"\n    [contextUri]=\"contextUri()\"\n    (zoomOnActiveRoute)=\"zoomOnActiveRoute()\"\n    [routesFeatureStore]=\"routesFeatureStore()\"\n    [stopsStore]=\"stopsStore()\"\n  />\n}\n\n<igo-directions-results\n  [stepsFeatureStore]=\"stepsFeatureStore()\"\n  [routesFeatureStore]=\"routesFeatureStore()\"\n/>\n", styles: [":host{display:block;padding:16px}.directions-options{display:flex;flex-flow:column;align-items:center;row-gap:8px;margin-bottom:16px}.directions-options mat-slide-toggle{width:100%}.directions-options mat-slide-toggle ::ng-deep .mdc-form-field{width:100%}.directions-options mat-slide-toggle ::ng-deep .mdc-label{margin-left:0;margin-right:auto;width:auto;padding-right:0}.directions-options mat-slide-toggle ::ng-deep .mdc-slide-toggle{margin-left:auto;margin-right:0}\n"] }]
         }], ctorParameters: () => [], propDecorators: { contextUri: [{ type: i0.Input, args: [{ isSignal: true, alias: "contextUri", required: false }] }], stopsStore: [{ type: i0.Input, args: [{ isSignal: true, alias: "stopsStore", required: true }] }], stopsFeatureStore: [{ type: i0.Input, args: [{ isSignal: true, alias: "stopsFeatureStore", required: true }] }], routesFeatureStore: [{ type: i0.Input, args: [{ isSignal: true, alias: "routesFeatureStore", required: true }] }], stepsFeatureStore: [{ type: i0.Input, args: [{ isSignal: true, alias: "stepsFeatureStore", required: true }] }], debounce: [{ type: i0.Input, args: [{ isSignal: true, alias: "debounce", required: false }] }], length: [{ type: i0.Input, args: [{ isSignal: true, alias: "length", required: false }] }], coordRoundedDecimals: [{ type: i0.Input, args: [{ isSignal: true, alias: "coordRoundedDecimals", required: false }] }], zoomToActiveRoute: [{ type: i0.Input, args: [{ isSignal: true, alias: "zoomToActiveRoute", required: true }] }], authenticated$: [{ type: i0.Input, args: [{ isSignal: true, alias: "authenticated$", required: true }] }] } });
 
 class IgoDirectionsModule {
@@ -18938,7 +18962,7 @@ class OgcFilterTimeComponent {
         return isTimeFrame(date) ? date : this.parseFilter(date).getTime();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: OgcFilterTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: OgcFilterTimeComponent, isStandalone: true, selector: "igo-ogc-filter-time", inputs: { datasource: { classPropertyName: "datasource", publicName: "datasource", isSignal: true, isRequired: false, transformFunction: null }, currentFilter: { classPropertyName: "currentFilter", publicName: "currentFilter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changeProperty: "changeProperty" }, providers: [OGCFilterTimeService], viewQueries: [{ propertyName: "beginDatepicker", first: true, predicate: ["beginDatepicker"], descendants: true, isSignal: true }, { propertyName: "endDatepicker", first: true, predicate: ["endDatepicker"], descendants: true, isSignal: true }, { propertyName: "beginTime", first: true, predicate: ["beginTimepicker"], descendants: true, isSignal: true }, { propertyName: "endTime", first: true, predicate: ["endTimepicker"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"datetime-container\">\n  @if (this.currentFilter().sliderOptions?.enabled) {\n    <mat-slide-toggle [(ngModel)]=\"sliderMode\" (change)=\"modeChange($event)\">\n      {{ 'igo.geo.filter.sliderModeTitle' | translate }}\n    </mat-slide-toggle>\n  }\n\n  @if (sliderMode()) {\n    <div class=\"slider-container\">\n      <igo-ogc-filter-time-slider\n        [begin]=\"resolveDate(beginValue)\"\n        [max]=\"\n          this.restrictedToStep() ? this.maxDate : resolveDate(this.endValue)\n        \"\n        [currentFilter]=\"currentFilter()\"\n        [datasource]=\"datasource()\"\n        (changeProperty)=\"changePropertyByPass($event)\"\n      />\n    </div>\n  } @else {\n    <div>\n      @if (calendarTypeYear) {\n        <div class=\"datepicker-input-container\">\n          <!-- to emulate a year-picker, 2 input: first input to show user just year and second input hiden and bind\n          with the datepicker  -->\n          <div class=\"datepicker-input\">\n            <igo-datepicker\n              [placeholder]=\"'igo.geo.timeFilter.startYear' | translate\"\n              [todayButtonLabel]=\"'igo.geo.timeFilter.today' | translate\"\n              [clearButtonLabel]=\"'igo.geo.timeFilter.clear' | translate\"\n              [datepickerFilter]=\"filterBeginFunction\"\n              [minDate]=\"handleDate(datasource()?.options?.minDate)\"\n              [maxDate]=\"\n                endValue && !restrictedToStep()\n                  ? endValue\n                  : handleDate(datasource()?.options?.maxDate)\n              \"\n              [disabled]=\"filterStateDisable\"\n              [startView]=\"calendarView()\"\n              [startAt]=\"beginValue\"\n              [value]=\"\n                beginValue\n                  ? beginValue\n                  : handleDate(datasource()?.options?.minDate)\n              \"\n              [calendarType]=\"calendarType()\"\n              (valueChange)=\"yearSelected($event, 'begin')\"\n              #beginDatepicker\n            />\n          </div>\n          <div class=\"datepicker-input\">\n            <igo-datepicker\n              class=\"year-input\"\n              [placeholder]=\"'igo.geo.timeFilter.endYear' | translate\"\n              [todayButtonLabel]=\"'igo.geo.timeFilter.today' | translate\"\n              [clearButtonLabel]=\"'igo.geo.timeFilter.clear' | translate\"\n              [datepickerFilter]=\"filterBeginFunction\"\n              [minDate]=\"\n                beginValue\n                  ? beginValue\n                  : handleDate(datasource()?.options?.minDate)\n              \"\n              [maxDate]=\"handleDate(datasource()?.options?.maxDate)\"\n              [disabled]=\"filterStateDisable\"\n              [startView]=\"calendarView()\"\n              [startAt]=\"endValue\"\n              [value]=\"\n                endValue ? endValue : handleDate(datasource()?.options?.maxDate)\n              \"\n              [calendarType]=\"calendarType()\"\n              (valueChange)=\"yearSelected($event, 'end')\"\n              #endDatepicker\n            />\n          </div>\n          <div class=\"actions-container\">\n            <button\n              class=\"reset-button\"\n              mat-icon-button\n              color=\"primary\"\n              (click)=\"resetFilter()\"\n              [matTooltip]=\"'igo.geo.filter.resetFilters' | translate\"\n              [disabled]=\"filterStateDisable\"\n            >\n              <mat-icon>{{ resetIcon }}</mat-icon>\n            </button>\n            <mat-slide-toggle\n              class=\"toggle-filter-state\"\n              (change)=\"toggleFilterState()\"\n              [matTooltip]=\"'igo.geo.filter.toggleFilterState' | translate\"\n              tooltip-position=\"below\"\n              matTooltipShowDelay=\"500\"\n              [checked]=\"!filterStateDisable\"\n            />\n          </div>\n        </div>\n      }\n      @if (calendarType() !== 'year') {\n        <div class=\"datepicker-input-container\">\n          <div class=\"datepicker-input\">\n            <igo-datepicker\n              [placeholder]=\"'igo.geo.timeFilter.startDate' | translate\"\n              [todayButtonLabel]=\"\n                (calendarType() === 'datetime'\n                  ? 'igo.geo.timeFilter.now'\n                  : 'igo.geo.timeFilter.today'\n                ) | translate\n              \"\n              [clearButtonLabel]=\"'igo.geo.timeFilter.clear' | translate\"\n              [datepickerFilter]=\"filterBeginFunction\"\n              [minDate]=\"handleDate(datasource()?.options?.minDate)\"\n              [maxDate]=\"\n                endValue && !restrictedToStep()\n                  ? endValue\n                  : handleDate(datasource()?.options?.maxDate)\n              \"\n              [disabled]=\"filterStateDisable\"\n              [startAt]=\"beginValue\"\n              [value]=\"\n                beginValue\n                  ? beginValue\n                  : handleDate(datasource()?.options?.minDate)\n              \"\n              [startView]=\"calendarView()\"\n              [calendarType]=\"calendarType()\"\n              (valueChange)=\"\n                calendarType() === 'month'\n                  ? monthSelected($event, 'begin')\n                  : changeTemporalProperty($event, 1)\n              \"\n              #beginDatepicker\n            />\n            @if (\n              calendarType() === 'datetime' &&\n              dateNotTimeFrame(beginValue, datasource()?.options?.minDate)\n            ) {\n              <igo-timepicker\n                [hourInputLabel]=\"'igo.geo.timeFilter.hour' | translate\"\n                [minuteInputLabel]=\"'igo.geo.timeFilter.minute' | translate\"\n                [disabled]=\"filterStateDisable\"\n                [value]=\"\n                  beginValue\n                    ? beginValue\n                    : handleDate(datasource()?.options?.minDate)\n                \"\n                (valueChange)=\"updateTime($event, 1)\"\n                #beginTimepicker\n                [interval]=\"stepMilliseconds / 60000\"\n                [maxHour]=\"\n                  sameDate() ? resolveDate(endValue)?.getHours() : undefined\n                \"\n              />\n            }\n          </div>\n          @if (!restrictedToStep()) {\n            <div class=\"datepicker-input\">\n              <igo-datepicker\n                [placeholder]=\"'igo.geo.timeFilter.endDate' | translate\"\n                [todayButtonLabel]=\"\n                  (calendarType() === 'datetime'\n                    ? 'igo.geo.timeFilter.now'\n                    : 'igo.geo.timeFilter.today'\n                  ) | translate\n                \"\n                [clearButtonLabel]=\"'igo.geo.timeFilter.clear' | translate\"\n                [datepickerFilter]=\"filterEndFunction\"\n                [minDate]=\"\n                  beginValue\n                    ? beginValue\n                    : handleDate(datasource()?.options?.minDate)\n                \"\n                [maxDate]=\"handleDate(datasource()?.options?.maxDate)\"\n                [disabled]=\"filterStateDisable\"\n                [startAt]=\"endValue\"\n                [value]=\"\n                  endValue\n                    ? endValue\n                    : handleDate(datasource()?.options?.maxDate)\n                \"\n                [startView]=\"calendarView()\"\n                [calendarType]=\"calendarType()\"\n                (valueChange)=\"\n                  calendarType() === 'month'\n                    ? monthSelected($event, 'end')\n                    : changeTemporalProperty($event, 2)\n                \"\n                #endDatepicker\n              />\n              @if (\n                calendarType() === 'datetime' &&\n                dateNotTimeFrame(endValue, datasource()?.options?.maxDate)\n              ) {\n                <igo-timepicker\n                  [hourInputLabel]=\"'igo.geo.timeFilter.hour' | translate\"\n                  [minuteInputLabel]=\"'igo.geo.timeFilter.minute' | translate\"\n                  [disabled]=\"filterStateDisable\"\n                  [value]=\"\n                    endValue\n                      ? endValue\n                      : handleDate(datasource()?.options?.maxDate)\n                  \"\n                  (valueChange)=\"updateTime($event, 2)\"\n                  [interval]=\"stepMilliseconds / 60000\"\n                  [minHour]=\"\n                    sameDate() ? resolveDate(beginValue)?.getHours() : undefined\n                  \"\n                  #endTimepicker\n                />\n              }\n            </div>\n          }\n          <div class=\"actions-container\">\n            <button\n              class=\"reset-button\"\n              mat-icon-button\n              color=\"primary\"\n              (click)=\"resetFilter()\"\n              [matTooltip]=\"'igo.geo.filter.resetFilters' | translate\"\n              [disabled]=\"filterStateDisable\"\n            >\n              <mat-icon>{{ resetIcon }}</mat-icon>\n            </button>\n            <mat-slide-toggle\n              class=\"toggle-filter-state\"\n              (change)=\"toggleFilterState()\"\n              tooltip-position=\"below\"\n              matTooltipShowDelay=\"500\"\n              [matTooltip]=\"'igo.geo.filter.toggleFilterState' | translate\"\n              [checked]=\"!filterStateDisable\"\n            />\n          </div>\n        </div>\n      }\n    </div>\n  }\n</div>\n", styles: [":host ::ng-deep input{text-align:center!important;margin:auto 5px!important}:host .slider-container{text-align:center}:host .datepicker-input-container{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px}:host .datepicker-input{display:flex;gap:8px;flex-wrap:wrap}@media only screen and (orientation:portrait)and (max-width:599px),only screen and (orientation:landscape)and (max-width:959px){:host .datepicker-input{flex-direction:column;align-items:stretch}}:host .actions-container{display:flex;align-items:center}:host .year-input-container{display:flex;width:100%}:host .year-input-container mat-form-field:not(:last-child){margin-right:4px}:host .year-input-hide{width:120px;margin-right:25px;display:none}:host .year-input-only-year{width:120px;margin-right:25px;text-align:left!important}:host ::ng-deep .datepicker-year ::ng-deep .mat-calendar-arrow{display:none}:host ::ng-deep .datepicker-year ::ng-deep .mat-calendar-period-button{pointer-events:none}:host ::ng-deep .datepicker-year ::ng-deep .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover{background-color:#0000001f;border-radius:999px}\n"], dependencies: [{ kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i1$3.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: OgcFilterTimeSliderComponent, selector: "igo-ogc-filter-time-slider", inputs: ["currentFilter", "begin", "max", "datasource"], outputs: ["changeProperty"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: DatepickerComponent, selector: "igo-datepicker", inputs: ["disabled", "placeholder", "minDate", "maxDate", "calendarType", "startView", "startAt", "datepickerFilter", "value", "todayButtonLabel", "clearButtonLabel"], outputs: ["startViewChange", "valueChange"] }, { kind: "component", type: TimepickerComponent, selector: "igo-timepicker", inputs: ["value", "hourInputLabel", "minuteInputLabel", "minHour", "maxHour", "disabled", "interval"], outputs: ["valueChange"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: OgcFilterTimeComponent, isStandalone: true, selector: "igo-ogc-filter-time", inputs: { datasource: { classPropertyName: "datasource", publicName: "datasource", isSignal: true, isRequired: false, transformFunction: null }, currentFilter: { classPropertyName: "currentFilter", publicName: "currentFilter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changeProperty: "changeProperty" }, providers: [OGCFilterTimeService], viewQueries: [{ propertyName: "beginDatepicker", first: true, predicate: ["beginDatepicker"], descendants: true, isSignal: true }, { propertyName: "endDatepicker", first: true, predicate: ["endDatepicker"], descendants: true, isSignal: true }, { propertyName: "beginTime", first: true, predicate: ["beginTimepicker"], descendants: true, isSignal: true }, { propertyName: "endTime", first: true, predicate: ["endTimepicker"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"datetime-container\">\n  @if (this.currentFilter().sliderOptions?.enabled) {\n    <mat-slide-toggle [(ngModel)]=\"sliderMode\" (change)=\"modeChange($event)\">\n      {{ 'igo.geo.filter.sliderModeTitle' | translate }}\n    </mat-slide-toggle>\n  }\n\n  @if (sliderMode()) {\n    <div class=\"slider-container\">\n      <igo-ogc-filter-time-slider\n        [begin]=\"resolveDate(beginValue)\"\n        [max]=\"\n          this.restrictedToStep() ? this.maxDate : resolveDate(this.endValue)\n        \"\n        [currentFilter]=\"currentFilter()\"\n        [datasource]=\"datasource()\"\n        (changeProperty)=\"changePropertyByPass($event)\"\n      />\n    </div>\n  } @else {\n    <div>\n      @if (calendarTypeYear) {\n        <div class=\"datepicker-input-container\">\n          <!-- to emulate a year-picker, 2 input: first input to show user just year and second input hiden and bind\n          with the datepicker  -->\n          <div class=\"datepicker-input\">\n            <igo-datepicker\n              [placeholder]=\"'igo.geo.timeFilter.startYear' | translate\"\n              [todayButtonLabel]=\"'igo.geo.timeFilter.today' | translate\"\n              [clearButtonLabel]=\"'igo.geo.timeFilter.clear' | translate\"\n              [datepickerFilter]=\"filterBeginFunction\"\n              [minDate]=\"handleDate(datasource()?.options?.minDate)\"\n              [maxDate]=\"\n                endValue && !restrictedToStep()\n                  ? endValue\n                  : handleDate(datasource()?.options?.maxDate)\n              \"\n              [disabled]=\"filterStateDisable\"\n              [startView]=\"calendarView()\"\n              [startAt]=\"beginValue\"\n              [value]=\"\n                beginValue\n                  ? beginValue\n                  : handleDate(datasource()?.options?.minDate)\n              \"\n              [calendarType]=\"calendarType()\"\n              (valueChange)=\"yearSelected($event, 'begin')\"\n              #beginDatepicker\n            />\n          </div>\n          <div class=\"datepicker-input\">\n            <igo-datepicker\n              class=\"year-input\"\n              [placeholder]=\"'igo.geo.timeFilter.endYear' | translate\"\n              [todayButtonLabel]=\"'igo.geo.timeFilter.today' | translate\"\n              [clearButtonLabel]=\"'igo.geo.timeFilter.clear' | translate\"\n              [datepickerFilter]=\"filterBeginFunction\"\n              [minDate]=\"\n                beginValue\n                  ? beginValue\n                  : handleDate(datasource()?.options?.minDate)\n              \"\n              [maxDate]=\"handleDate(datasource()?.options?.maxDate)\"\n              [disabled]=\"filterStateDisable\"\n              [startView]=\"calendarView()\"\n              [startAt]=\"endValue\"\n              [value]=\"\n                endValue ? endValue : handleDate(datasource()?.options?.maxDate)\n              \"\n              [calendarType]=\"calendarType()\"\n              (valueChange)=\"yearSelected($event, 'end')\"\n              #endDatepicker\n            />\n          </div>\n          <div class=\"actions-container\">\n            <button\n              class=\"reset-button\"\n              mat-icon-button\n              color=\"primary\"\n              (click)=\"resetFilter()\"\n              [matTooltip]=\"'igo.geo.filter.resetFilters' | translate\"\n              [disabled]=\"filterStateDisable\"\n            >\n              <mat-icon>{{ resetIcon }}</mat-icon>\n            </button>\n            <mat-slide-toggle\n              class=\"toggle-filter-state\"\n              (change)=\"toggleFilterState()\"\n              [matTooltip]=\"'igo.geo.filter.toggleFilterState' | translate\"\n              tooltip-position=\"below\"\n              matTooltipShowDelay=\"500\"\n              [checked]=\"!filterStateDisable\"\n            />\n          </div>\n        </div>\n      }\n      @if (calendarType() !== 'year') {\n        <div class=\"datepicker-input-container\">\n          <div class=\"datepicker-input\">\n            <igo-datepicker\n              [placeholder]=\"'igo.geo.timeFilter.startDate' | translate\"\n              [todayButtonLabel]=\"\n                (calendarType() === 'datetime'\n                  ? 'igo.geo.timeFilter.now'\n                  : 'igo.geo.timeFilter.today'\n                ) | translate\n              \"\n              [clearButtonLabel]=\"'igo.geo.timeFilter.clear' | translate\"\n              [datepickerFilter]=\"filterBeginFunction\"\n              [minDate]=\"handleDate(datasource()?.options?.minDate)\"\n              [maxDate]=\"\n                endValue && !restrictedToStep()\n                  ? endValue\n                  : handleDate(datasource()?.options?.maxDate)\n              \"\n              [disabled]=\"filterStateDisable\"\n              [startAt]=\"beginValue\"\n              [value]=\"\n                beginValue\n                  ? beginValue\n                  : handleDate(datasource()?.options?.minDate)\n              \"\n              [startView]=\"calendarView()\"\n              [calendarType]=\"calendarType()\"\n              (valueChange)=\"\n                calendarType() === 'month'\n                  ? monthSelected($event, 'begin')\n                  : changeTemporalProperty($event, 1)\n              \"\n              #beginDatepicker\n            />\n            @if (\n              calendarType() === 'datetime' &&\n              dateNotTimeFrame(beginValue, datasource()?.options?.minDate)\n            ) {\n              <igo-timepicker\n                [hourInputLabel]=\"'igo.geo.timeFilter.hour' | translate\"\n                [minuteInputLabel]=\"'igo.geo.timeFilter.minute' | translate\"\n                [disabled]=\"filterStateDisable\"\n                [value]=\"\n                  beginValue\n                    ? beginValue\n                    : handleDate(datasource()?.options?.minDate)\n                \"\n                (valueChange)=\"updateTime($event, 1)\"\n                #beginTimepicker\n                [interval]=\"stepMilliseconds / 60000\"\n                [maxHour]=\"\n                  sameDate() ? resolveDate(endValue)?.getHours() : undefined\n                \"\n              />\n            }\n          </div>\n          @if (!restrictedToStep()) {\n            <div class=\"datepicker-input\">\n              <igo-datepicker\n                [placeholder]=\"'igo.geo.timeFilter.endDate' | translate\"\n                [todayButtonLabel]=\"\n                  (calendarType() === 'datetime'\n                    ? 'igo.geo.timeFilter.now'\n                    : 'igo.geo.timeFilter.today'\n                  ) | translate\n                \"\n                [clearButtonLabel]=\"'igo.geo.timeFilter.clear' | translate\"\n                [datepickerFilter]=\"filterEndFunction\"\n                [minDate]=\"\n                  beginValue\n                    ? beginValue\n                    : handleDate(datasource()?.options?.minDate)\n                \"\n                [maxDate]=\"handleDate(datasource()?.options?.maxDate)\"\n                [disabled]=\"filterStateDisable\"\n                [startAt]=\"endValue\"\n                [value]=\"\n                  endValue\n                    ? endValue\n                    : handleDate(datasource()?.options?.maxDate)\n                \"\n                [startView]=\"calendarView()\"\n                [calendarType]=\"calendarType()\"\n                (valueChange)=\"\n                  calendarType() === 'month'\n                    ? monthSelected($event, 'end')\n                    : changeTemporalProperty($event, 2)\n                \"\n                #endDatepicker\n              />\n              @if (\n                calendarType() === 'datetime' &&\n                dateNotTimeFrame(endValue, datasource()?.options?.maxDate)\n              ) {\n                <igo-timepicker\n                  [hourInputLabel]=\"'igo.geo.timeFilter.hour' | translate\"\n                  [minuteInputLabel]=\"'igo.geo.timeFilter.minute' | translate\"\n                  [disabled]=\"filterStateDisable\"\n                  [value]=\"\n                    endValue\n                      ? endValue\n                      : handleDate(datasource()?.options?.maxDate)\n                  \"\n                  (valueChange)=\"updateTime($event, 2)\"\n                  [interval]=\"stepMilliseconds / 60000\"\n                  [minHour]=\"\n                    sameDate() ? resolveDate(beginValue)?.getHours() : undefined\n                  \"\n                  #endTimepicker\n                />\n              }\n            </div>\n          }\n          <div class=\"actions-container\">\n            <button\n              class=\"reset-button\"\n              mat-icon-button\n              color=\"primary\"\n              (click)=\"resetFilter()\"\n              [matTooltip]=\"'igo.geo.filter.resetFilters' | translate\"\n              [disabled]=\"filterStateDisable\"\n            >\n              <mat-icon>{{ resetIcon }}</mat-icon>\n            </button>\n            <mat-slide-toggle\n              class=\"toggle-filter-state\"\n              (change)=\"toggleFilterState()\"\n              tooltip-position=\"below\"\n              matTooltipShowDelay=\"500\"\n              [matTooltip]=\"'igo.geo.filter.toggleFilterState' | translate\"\n              [checked]=\"!filterStateDisable\"\n            />\n          </div>\n        </div>\n      }\n    </div>\n  }\n</div>\n", styles: [":host ::ng-deep input{text-align:center!important;margin:auto 5px!important}:host .slider-container{text-align:center}:host .datepicker-input-container{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px}:host .datepicker-input{display:flex;gap:8px;flex-wrap:wrap}@media only screen and (orientation:portrait)and (max-width:599px),only screen and (orientation:landscape)and (max-width:959px){:host .datepicker-input{flex-direction:column;align-items:stretch}}:host .actions-container{display:flex;align-items:center}:host .year-input-container{display:flex;width:100%}:host .year-input-container mat-form-field:not(:last-child){margin-right:4px}:host .year-input-hide{width:120px;margin-right:25px;display:none}:host .year-input-only-year{width:120px;margin-right:25px;text-align:left!important}:host ::ng-deep .datepicker-year ::ng-deep .mat-calendar-arrow{display:none}:host ::ng-deep .datepicker-year ::ng-deep .mat-calendar-period-button{pointer-events:none}:host ::ng-deep .datepicker-year ::ng-deep .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover{background-color:#0000001f;border-radius:999px}\n"], dependencies: [{ kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i2$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: OgcFilterTimeSliderComponent, selector: "igo-ogc-filter-time-slider", inputs: ["currentFilter", "begin", "max", "datasource"], outputs: ["changeProperty"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: DatepickerComponent, selector: "igo-datepicker", inputs: ["disabled", "placeholder", "minDate", "maxDate", "calendarType", "startView", "startAt", "datepickerFilter", "value", "todayButtonLabel", "clearButtonLabel"], outputs: ["startViewChange", "valueChange"] }, { kind: "component", type: TimepickerComponent, selector: "igo-timepicker", inputs: ["value", "hourInputLabel", "minuteInputLabel", "minHour", "maxHour", "disabled", "interval"], outputs: ["valueChange"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: OgcFilterTimeComponent, decorators: [{
             type: Component,
@@ -19998,7 +20022,7 @@ class OgcFilterSelectionComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: OgcFilterSelectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: OgcFilterSelectionComponent, isStandalone: true, selector: "igo-ogc-filter-selection", inputs: { refreshFilters: { classPropertyName: "refreshFilters", publicName: "refreshFilters", isSignal: true, isRequired: false, transformFunction: null }, datasource: { classPropertyName: "datasource", publicName: "datasource", isSignal: true, isRequired: false, transformFunction: null }, map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: false, transformFunction: null }, checkboxesIndex: { classPropertyName: "checkboxesIndex", publicName: "checkboxesIndex", isSignal: true, isRequired: false, transformFunction: null }, radioButtonsIndex: { classPropertyName: "radioButtonsIndex", publicName: "radioButtonsIndex", isSignal: true, isRequired: false, transformFunction: null }, baseIndex: { classPropertyName: "baseIndex", publicName: "baseIndex", isSignal: true, isRequired: false, transformFunction: null }, currentFilter: { classPropertyName: "currentFilter", publicName: "currentFilter", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { checkboxesIndex: "checkboxesIndexChange", radioButtonsIndex: "radioButtonsIndexChange", baseIndex: "baseIndexChange" }, providers: [DOMService], viewQueries: [{ propertyName: "sel", first: true, predicate: ["selection"], descendants: true, isSignal: true }, { propertyName: "matAutocomplete", first: true, predicate: MatAutocompleteTrigger, descendants: true, read: MatAutocompleteTrigger, isSignal: true }], ngImport: i0, template: "<form [formGroup]=\"form\">\n  @for (selector of ogcFiltersSelectors; track selector) {\n    <div>\n      @if (selector.selectorType === 'pushButton') {\n        <div class=\"pushButtonGroups\">\n          <mat-divider />\n          @if (getPushButtonsGroups()!.length > 1) {\n            <div class=\"groupsSelector\">\n              <mat-form-field>\n                <mat-select\n                  formControlName=\"pushButtonsGroup\"\n                  [matTooltip]=\"'igo.geo.layer.legend.selectStyle' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  [(value)]=\"currentPushButtonsGroup\"\n                >\n                  @for (\n                    selectorGroup of getPushButtonsGroups();\n                    track selectorGroup\n                  ) {\n                    <mat-option [value]=\"selectorGroup\"\n                      >{{ selectorGroup.title }}\n                    </mat-option>\n                  }\n                </mat-select>\n              </mat-form-field>\n            </div>\n          }\n          @for (\n            bundle of currentPushButtonsGroup.computedSelectors;\n            track bundle\n          ) {\n            <h4>{{ bundle.title }}</h4>\n            <mat-button-toggle-group\n              formControlName=\"pushButtons\"\n              appearance=\"legacy\"\n              vertical=\"{{ bundleIsVertical(bundle) }}\"\n              multiple=\"true\"\n            >\n              @for (ogcPushButton of bundle.selectors; track ogcPushButton) {\n                <mat-button-toggle\n                  [matTooltip]=\"getToolTip(ogcPushButton)\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  matTooltipClass=\"material-tooltip\"\n                  [style]=\"getButtonColor(ogcPushButton)\"\n                  [checked]=\"ogcPushButton.enabled\"\n                  (change)=\"\n                    onSelectionChange(ogcPushButton, selector.selectorType)\n                  \"\n                  [value]=\"ogcPushButton\"\n                  >{{ ogcPushButton.title }}\n                </mat-button-toggle>\n              }\n            </mat-button-toggle-group>\n          }\n        </div>\n      }\n      @if (selector.selectorType === 'checkbox') {\n        <div class=\"checkboxGroups\">\n          <mat-divider />\n          @if (getCheckboxesGroups()!.length > 1) {\n            <div class=\"groupsSelector\">\n              <mat-form-field>\n                <mat-select\n                  formControlName=\"checkboxesGroup\"\n                  [matTooltip]=\"'igo.geo.layer.legend.selectStyle' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  [(value)]=\"currentCheckboxesGroup\"\n                >\n                  @for (\n                    selectorGroup of getCheckboxesGroups();\n                    track selectorGroup\n                  ) {\n                    <mat-option [value]=\"selectorGroup\"\n                      >{{ selectorGroup.title }}\n                    </mat-option>\n                  }\n                </mat-select>\n              </mat-form-field>\n            </div>\n          }\n          @for (\n            bundle of currentCheckboxesGroup.computedSelectors;\n            track bundle\n          ) {\n            <h4>{{ bundle.title }}</h4>\n            <div class=\"checkboxes\">\n              @for (ogcCheckbox of bundle.selectors; track ogcCheckbox) {\n                <mat-checkbox\n                  [matTooltip]=\"getToolTip(ogcCheckbox)\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  matTooltipClass=\"material-tooltip\"\n                  [checked]=\"ogcCheckbox.enabled\"\n                  (change)=\"\n                    onSelectionChange(ogcCheckbox, selector.selectorType)\n                  \"\n                  [value]=\"$any(ogcCheckbox)\"\n                  >{{ ogcCheckbox.title }}\n                </mat-checkbox>\n              }\n            </div>\n            @if (\n              isLessResults(bundle, 'checkbox') ||\n              isMoreResults(bundle, 'checkbox')\n            ) {\n              <p>\n                @if (isLessResults(bundle, 'checkbox')) {\n                  <u\n                    class=\"lessResults\"\n                    (click)=\"displayLessResults('checkbox')\"\n                    >{{ 'igo.geo.filter.displayLessResults' | translate }}\n                  </u>\n                }\n                @if (isMoreResults(bundle, 'checkbox')) {\n                  <u\n                    class=\"moreResults\"\n                    (click)=\"displayMoreResults('checkbox')\"\n                    >{{ 'igo.geo.filter.displayMoreResults' | translate }}\n                  </u>\n                }\n              </p>\n            }\n          }\n        </div>\n      }\n      @if (selector.selectorType === 'radioButton') {\n        <div class=\"radioButtonGroups\">\n          <mat-divider />\n          @if (getRadioButtonsGroups()!.length > 1) {\n            <div class=\"groupsSelector\">\n              <mat-form-field>\n                <mat-select\n                  formControlName=\"radioButtonsGroup\"\n                  [matTooltip]=\"'igo.geo.layer.legend.selectStyle' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  [(value)]=\"currentRadioButtonsGroup\"\n                >\n                  @for (\n                    selectorGroup of getRadioButtonsGroups();\n                    track selectorGroup\n                  ) {\n                    <mat-option [value]=\"selectorGroup\"\n                      >{{ selectorGroup.title }}\n                    </mat-option>\n                  }\n                </mat-select>\n              </mat-form-field>\n            </div>\n          }\n          @for (\n            bundle of currentRadioButtonsGroup.computedSelectors;\n            track bundle\n          ) {\n            <h4>{{ bundle.title }}</h4>\n            <mat-radio-group formControlName=\"radioButtons\">\n              @if (bundle.unfiltered) {\n                <mat-radio-button\n                  [matTooltip]=\"'igo.geo.filter.resetFilters' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  matTooltipClass=\"material-tooltip\"\n                  (change)=\"emptyRadioButtons()\"\n                  >{{ 'igo.geo.filter.resetFilters' | translate }}\n                </mat-radio-button>\n              }\n              @for (ogcRadioButton of bundle.selectors; track ogcRadioButton) {\n                <mat-radio-button\n                  [matTooltip]=\"getToolTip(ogcRadioButton)\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  matTooltipClass=\"material-tooltip\"\n                  [checked]=\"ogcRadioButton.enabled\"\n                  (change)=\"\n                    onSelectionChange(ogcRadioButton, selector.selectorType)\n                  \"\n                  [value]=\"ogcRadioButton\"\n                  >{{ ogcRadioButton.title }}\n                </mat-radio-button>\n              }\n              @if (\n                isLessResults(bundle, 'radio') || isMoreResults(bundle, 'radio')\n              ) {\n                <p>\n                  @if (isLessResults(bundle, 'radio')) {\n                    <u class=\"lessResults\" (click)=\"displayLessResults('radio')\"\n                      >{{ 'igo.geo.filter.displayLessResults' | translate }}\n                    </u>\n                  }\n                  @if (isMoreResults(bundle, 'radio')) {\n                    <u class=\"moreResults\" (click)=\"displayMoreResults('radio')\"\n                      >{{ 'igo.geo.filter.displayMoreResults' | translate }}\n                    </u>\n                  }\n                </p>\n              }\n            </mat-radio-group>\n          }\n        </div>\n      }\n      @if (selector.selectorType === 'select') {\n        <div class=\"selectGroups\">\n          <mat-divider />\n          @if (getSelectGroups()!.length > 1) {\n            <div class=\"groupsSelector\">\n              <mat-form-field>\n                <mat-select\n                  formControlName=\"selectGroup\"\n                  [matTooltip]=\"'igo.geo.layer.legend.selectStyle' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  [(value)]=\"currentSelectGroup\"\n                >\n                  @for (\n                    selectorGroup of getSelectGroups();\n                    track selectorGroup\n                  ) {\n                    <mat-option [value]=\"selectorGroup\"\n                      >{{ selectorGroup.title }}\n                    </mat-option>\n                  }\n                </mat-select>\n              </mat-form-field>\n            </div>\n          }\n          @for (bundle of currentSelectGroup.computedSelectors; track bundle) {\n            <h4>{{ bundle.title }}</h4>\n            <div class=\"groupsSelector\">\n              @if (bundle.unfiltered && !bundle.multiple) {\n                <mat-button\n                  mat-icon-button\n                  color=\"warn\"\n                  [matTooltip]=\"'igo.geo.filter.resetFilters' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  matTooltipClass=\"material-tooltip\"\n                  (click)=\"emptySelect()\"\n                >\n                  <mat-icon>filter_alt_off</mat-icon>\n                </mat-button>\n              }\n              <mat-form-field\n                [style.width.%]=\"bundle.width ? bundle.width : undefined\"\n              >\n                @if (bundle.multiple) {\n                  <div>\n                    <mat-select\n                      #selection\n                      [multiple]=\"bundle.multiple\"\n                      [placeholder]=\"bundle.title!\"\n                      formControlName=\"selectMulti\"\n                    >\n                      <div class=\"checkboxes\">\n                        @if (bundle.multiple) {\n                          <mat-checkbox\n                            [(ngModel)]=\"selectAllSelected\"\n                            [ngModelOptions]=\"{ standalone: true }\"\n                            (change)=\"toggleAllSelection()\"\n                            >Tous\n                          </mat-checkbox>\n                        }\n                      </div>\n                      @for (ogcSelect of bundle.selectors; track ogcSelect) {\n                        <mat-option\n                          [matTooltip]=\"getToolTip(ogcSelect)\"\n                          tooltip-position=\"below\"\n                          matTooltipDelay=\"500\"\n                          matTooltipClass=\"material-tooltip\"\n                          (onSelectionChange)=\"\n                            selectOptionClick(\n                              $event.source.value,\n                              bundle,\n                              $event\n                            )\n                          \"\n                          [value]=\"ogcSelect\"\n                          >{{ ogcSelect.title }}\n                        </mat-option>\n                      }\n                    </mat-select>\n                  </div>\n                } @else {\n                  <mat-select\n                    [placeholder]=\"bundle.title!\"\n                    formControlName=\"select\"\n                  >\n                    @for (ogcSelect of bundle.selectors; track ogcSelect) {\n                      <mat-option\n                        [matTooltip]=\"getToolTip(ogcSelect)\"\n                        tooltip-position=\"below\"\n                        matTooltipDelay=\"500\"\n                        matTooltipClass=\"material-tooltip\"\n                        [value]=\"ogcSelect\"\n                        (onSelectionChange)=\"\n                          selectOptionClick($event.source.value, bundle)\n                        \"\n                        >{{ ogcSelect.title }}\n                      </mat-option>\n                    }\n                  </mat-select>\n                }\n              </mat-form-field>\n            </div>\n          }\n        </div>\n      }\n      @if (selector.selectorType === 'autocomplete') {\n        <div class=\"autocompleteGroups\">\n          <mat-divider />\n          @if (getAutocompleteGroups()!.length > 1) {\n            <div class=\"groupsSelector\">\n              <mat-form-field>\n                <mat-select\n                  formControlName=\"autocompleteGroup\"\n                  [matTooltip]=\"'igo.geo.layer.legend.selectStyle' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  [(value)]=\"currentAutocompleteGroup\"\n                >\n                  @for (\n                    autocompleteGroup of getAutocompleteGroups();\n                    track autocompleteGroup\n                  ) {\n                    <mat-option [value]=\"autocompleteGroup\"\n                      >{{ autocompleteGroup.title }}\n                    </mat-option>\n                  }\n                </mat-select>\n              </mat-form-field>\n            </div>\n          }\n          @for (\n            bundle of currentAutocompleteGroup.computedSelectors;\n            track bundle\n          ) {\n            <h4>{{ bundle.title }}</h4>\n            <div class=\"groupsSelector\">\n              @if (bundle.unfiltered) {\n                <mat-button\n                  mat-icon-button\n                  color=\"warn\"\n                  [matTooltip]=\"'igo.geo.filter.resetFilters' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  matTooltipClass=\"material-tooltip\"\n                  (click)=\"emptyAutocomplete()\"\n                >\n                  <mat-icon>filter_alt_off</mat-icon>\n                </mat-button>\n              }\n              @if (filteredOgcAutocomplete[bundle.id]) {\n                <mat-form-field\n                  floatLabel=\"always\"\n                  [style.width.%]=\"bundle.width ? bundle.width : undefined\"\n                >\n                  <mat-label>{{ bundle.title }}</mat-label>\n                  @if (\n                    filteredOgcAutocomplete[bundle.id] &&\n                    (bundle.showChips ?? true)\n                  ) {\n                    <mat-chip-set>\n                      @for (\n                        autocompleteEnabled of autocompleteEnableds;\n                        track autocompleteEnabled\n                      ) {\n                        <mat-chip\n                          (removed)=\"toggleSelection(autocompleteEnabled)\"\n                        >\n                          {{ autocompleteEnabled }}\n                          <button\n                            matChipRemove\n                            [matTooltip]=\"\n                              'igo.geo.filter.removeFilter' | translate\n                            \"\n                          >\n                            <mat-icon>cancel</mat-icon>\n                          </button>\n                        </mat-chip>\n                      }\n                    </mat-chip-set>\n                  }\n                  <input\n                    matInput\n                    type=\"text\"\n                    formControlName=\"autocomplete\"\n                    #input\n                    [matAutocomplete]=\"auto\"\n                    (input)=\"onInputChange()\"\n                  />\n                  <mat-autocomplete\n                    #auto=\"matAutocomplete\"\n                    [displayWith]=\"displayFn\"\n                  >\n                    @for (\n                      ogcAutocomplete of filteredOgcAutocomplete[bundle.id]\n                        | async;\n                      track ogcAutocomplete\n                    ) {\n                      <mat-option\n                        id=\"mat-option\"\n                        [matTooltip]=\"getToolTip(ogcAutocomplete)\"\n                      >\n                        <div\n                          (click)=\"\n                            toggleAutocompleteOption(\n                              $event,\n                              ogcAutocomplete.value\n                            )\n                          \"\n                        >\n                          <mat-checkbox\n                            id=\"mat-checkbox\"\n                            color=\"primary\"\n                            [checked]=\"checkedStatus(ogcAutocomplete.value)\"\n                            (click)=\"\n                              toggleAutocompleteOption(\n                                $event,\n                                ogcAutocomplete.value\n                              )\n                            \"\n                          />\n                          {{ ogcAutocomplete.value }}\n                        </div>\n                      </mat-option>\n                    }\n                  </mat-autocomplete>\n                </mat-form-field>\n              }\n            </div>\n          }\n        </div>\n      }\n    </div>\n  }\n</form>\n\n@if (isTemporalOperator()) {\n  <div>\n    <mat-divider />\n    @if (!currentFilter.title) {\n      <h4>\n        {{ 'igo.geo.filter.reportingDate' | translate }}\n      </h4>\n    }\n    @if (currentFilter.title) {\n      <h4>{{ currentFilter.title }}</h4>\n    }\n    <igo-ogc-filter-time\n      [datasource]=\"datasource()\"\n      [currentFilter]=\"currentFilter\"\n      (changeProperty)=\"changeProperty($event.value, $event.pos)\"\n    />\n  </div>\n}\n", styles: [":host ::ng-deep .material-tooltip{white-space:pre-wrap}.mat-button-toggle-group{margin:5px;flex-wrap:wrap;box-shadow:none!important;width:95%}.checkboxes{flex-wrap:wrap;box-shadow:none}.groupsSelector{text-align:center}mat-button-toggle{display:inline-flex;border:1.5px solid black;border-radius:5px;margin:5px;white-space:normal;min-height:40px;height:auto;width:142px}mat-button-toggle ::ng-deep .mat-button-toggle-label-content{line-height:unset;font-size:small;display:block}@media only screen and (orientation:portrait)and (max-width:599px),only screen and (orientation:landscape)and (max-width:959px){mat-button-toggle{width:45%}}mat-checkbox,mat-radio-button{margin:7px;width:95%;display:inline-flex;font-size:larger}mat-checkbox ::ng-deep label,mat-radio-button ::ng-deep label{white-space:normal}mat-checkbox{vertical-align:middle}mat-button{padding-right:10px;cursor:pointer}h3{margin:7px;text-align:left}u{cursor:pointer;color:#00f;margin:5px}p{margin:unset}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i1$2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$4.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$4.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i2$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i8$1.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i8$1.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i4$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: OgcFilterTimeComponent, selector: "igo-ogc-filter-time", inputs: ["datasource", "currentFilter"], outputs: ["changeProperty"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i12.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "directive", type: i12.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i12.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: OgcFilterSelectionComponent, isStandalone: true, selector: "igo-ogc-filter-selection", inputs: { refreshFilters: { classPropertyName: "refreshFilters", publicName: "refreshFilters", isSignal: true, isRequired: false, transformFunction: null }, datasource: { classPropertyName: "datasource", publicName: "datasource", isSignal: true, isRequired: false, transformFunction: null }, map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: false, transformFunction: null }, checkboxesIndex: { classPropertyName: "checkboxesIndex", publicName: "checkboxesIndex", isSignal: true, isRequired: false, transformFunction: null }, radioButtonsIndex: { classPropertyName: "radioButtonsIndex", publicName: "radioButtonsIndex", isSignal: true, isRequired: false, transformFunction: null }, baseIndex: { classPropertyName: "baseIndex", publicName: "baseIndex", isSignal: true, isRequired: false, transformFunction: null }, currentFilter: { classPropertyName: "currentFilter", publicName: "currentFilter", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { checkboxesIndex: "checkboxesIndexChange", radioButtonsIndex: "radioButtonsIndexChange", baseIndex: "baseIndexChange" }, providers: [DOMService], viewQueries: [{ propertyName: "sel", first: true, predicate: ["selection"], descendants: true, isSignal: true }, { propertyName: "matAutocomplete", first: true, predicate: MatAutocompleteTrigger, descendants: true, read: MatAutocompleteTrigger, isSignal: true }], ngImport: i0, template: "<form [formGroup]=\"form\">\n  @for (selector of ogcFiltersSelectors; track selector) {\n    <div>\n      @if (selector.selectorType === 'pushButton') {\n        <div class=\"pushButtonGroups\">\n          <mat-divider />\n          @if (getPushButtonsGroups()!.length > 1) {\n            <div class=\"groupsSelector\">\n              <mat-form-field>\n                <mat-select\n                  formControlName=\"pushButtonsGroup\"\n                  [matTooltip]=\"'igo.geo.layer.legend.selectStyle' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  [(value)]=\"currentPushButtonsGroup\"\n                >\n                  @for (\n                    selectorGroup of getPushButtonsGroups();\n                    track selectorGroup\n                  ) {\n                    <mat-option [value]=\"selectorGroup\"\n                      >{{ selectorGroup.title }}\n                    </mat-option>\n                  }\n                </mat-select>\n              </mat-form-field>\n            </div>\n          }\n          @for (\n            bundle of currentPushButtonsGroup.computedSelectors;\n            track bundle\n          ) {\n            <h4>{{ bundle.title }}</h4>\n            <mat-button-toggle-group\n              formControlName=\"pushButtons\"\n              appearance=\"legacy\"\n              vertical=\"{{ bundleIsVertical(bundle) }}\"\n              multiple=\"true\"\n            >\n              @for (ogcPushButton of bundle.selectors; track ogcPushButton) {\n                <mat-button-toggle\n                  [matTooltip]=\"getToolTip(ogcPushButton)\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  matTooltipClass=\"material-tooltip\"\n                  [style]=\"getButtonColor(ogcPushButton)\"\n                  [checked]=\"ogcPushButton.enabled\"\n                  (change)=\"\n                    onSelectionChange(ogcPushButton, selector.selectorType)\n                  \"\n                  [value]=\"ogcPushButton\"\n                  >{{ ogcPushButton.title }}\n                </mat-button-toggle>\n              }\n            </mat-button-toggle-group>\n          }\n        </div>\n      }\n      @if (selector.selectorType === 'checkbox') {\n        <div class=\"checkboxGroups\">\n          <mat-divider />\n          @if (getCheckboxesGroups()!.length > 1) {\n            <div class=\"groupsSelector\">\n              <mat-form-field>\n                <mat-select\n                  formControlName=\"checkboxesGroup\"\n                  [matTooltip]=\"'igo.geo.layer.legend.selectStyle' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  [(value)]=\"currentCheckboxesGroup\"\n                >\n                  @for (\n                    selectorGroup of getCheckboxesGroups();\n                    track selectorGroup\n                  ) {\n                    <mat-option [value]=\"selectorGroup\"\n                      >{{ selectorGroup.title }}\n                    </mat-option>\n                  }\n                </mat-select>\n              </mat-form-field>\n            </div>\n          }\n          @for (\n            bundle of currentCheckboxesGroup.computedSelectors;\n            track bundle\n          ) {\n            <h4>{{ bundle.title }}</h4>\n            <div class=\"checkboxes\">\n              @for (ogcCheckbox of bundle.selectors; track ogcCheckbox) {\n                <mat-checkbox\n                  [matTooltip]=\"getToolTip(ogcCheckbox)\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  matTooltipClass=\"material-tooltip\"\n                  [checked]=\"ogcCheckbox.enabled\"\n                  (change)=\"\n                    onSelectionChange(ogcCheckbox, selector.selectorType)\n                  \"\n                  [value]=\"$any(ogcCheckbox)\"\n                  >{{ ogcCheckbox.title }}\n                </mat-checkbox>\n              }\n            </div>\n            @if (\n              isLessResults(bundle, 'checkbox') ||\n              isMoreResults(bundle, 'checkbox')\n            ) {\n              <p>\n                @if (isLessResults(bundle, 'checkbox')) {\n                  <u\n                    class=\"lessResults\"\n                    (click)=\"displayLessResults('checkbox')\"\n                    >{{ 'igo.geo.filter.displayLessResults' | translate }}\n                  </u>\n                }\n                @if (isMoreResults(bundle, 'checkbox')) {\n                  <u\n                    class=\"moreResults\"\n                    (click)=\"displayMoreResults('checkbox')\"\n                    >{{ 'igo.geo.filter.displayMoreResults' | translate }}\n                  </u>\n                }\n              </p>\n            }\n          }\n        </div>\n      }\n      @if (selector.selectorType === 'radioButton') {\n        <div class=\"radioButtonGroups\">\n          <mat-divider />\n          @if (getRadioButtonsGroups()!.length > 1) {\n            <div class=\"groupsSelector\">\n              <mat-form-field>\n                <mat-select\n                  formControlName=\"radioButtonsGroup\"\n                  [matTooltip]=\"'igo.geo.layer.legend.selectStyle' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  [(value)]=\"currentRadioButtonsGroup\"\n                >\n                  @for (\n                    selectorGroup of getRadioButtonsGroups();\n                    track selectorGroup\n                  ) {\n                    <mat-option [value]=\"selectorGroup\"\n                      >{{ selectorGroup.title }}\n                    </mat-option>\n                  }\n                </mat-select>\n              </mat-form-field>\n            </div>\n          }\n          @for (\n            bundle of currentRadioButtonsGroup.computedSelectors;\n            track bundle\n          ) {\n            <h4>{{ bundle.title }}</h4>\n            <mat-radio-group formControlName=\"radioButtons\">\n              @if (bundle.unfiltered) {\n                <mat-radio-button\n                  [matTooltip]=\"'igo.geo.filter.resetFilters' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  matTooltipClass=\"material-tooltip\"\n                  (change)=\"emptyRadioButtons()\"\n                  >{{ 'igo.geo.filter.resetFilters' | translate }}\n                </mat-radio-button>\n              }\n              @for (ogcRadioButton of bundle.selectors; track ogcRadioButton) {\n                <mat-radio-button\n                  [matTooltip]=\"getToolTip(ogcRadioButton)\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  matTooltipClass=\"material-tooltip\"\n                  [checked]=\"ogcRadioButton.enabled\"\n                  (change)=\"\n                    onSelectionChange(ogcRadioButton, selector.selectorType)\n                  \"\n                  [value]=\"ogcRadioButton\"\n                  >{{ ogcRadioButton.title }}\n                </mat-radio-button>\n              }\n              @if (\n                isLessResults(bundle, 'radio') || isMoreResults(bundle, 'radio')\n              ) {\n                <p>\n                  @if (isLessResults(bundle, 'radio')) {\n                    <u class=\"lessResults\" (click)=\"displayLessResults('radio')\"\n                      >{{ 'igo.geo.filter.displayLessResults' | translate }}\n                    </u>\n                  }\n                  @if (isMoreResults(bundle, 'radio')) {\n                    <u class=\"moreResults\" (click)=\"displayMoreResults('radio')\"\n                      >{{ 'igo.geo.filter.displayMoreResults' | translate }}\n                    </u>\n                  }\n                </p>\n              }\n            </mat-radio-group>\n          }\n        </div>\n      }\n      @if (selector.selectorType === 'select') {\n        <div class=\"selectGroups\">\n          <mat-divider />\n          @if (getSelectGroups()!.length > 1) {\n            <div class=\"groupsSelector\">\n              <mat-form-field>\n                <mat-select\n                  formControlName=\"selectGroup\"\n                  [matTooltip]=\"'igo.geo.layer.legend.selectStyle' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  [(value)]=\"currentSelectGroup\"\n                >\n                  @for (\n                    selectorGroup of getSelectGroups();\n                    track selectorGroup\n                  ) {\n                    <mat-option [value]=\"selectorGroup\"\n                      >{{ selectorGroup.title }}\n                    </mat-option>\n                  }\n                </mat-select>\n              </mat-form-field>\n            </div>\n          }\n          @for (bundle of currentSelectGroup.computedSelectors; track bundle) {\n            <h4>{{ bundle.title }}</h4>\n            <div class=\"groupsSelector\">\n              @if (bundle.unfiltered && !bundle.multiple) {\n                <mat-button\n                  mat-icon-button\n                  color=\"warn\"\n                  [matTooltip]=\"'igo.geo.filter.resetFilters' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  matTooltipClass=\"material-tooltip\"\n                  (click)=\"emptySelect()\"\n                >\n                  <mat-icon>filter_alt_off</mat-icon>\n                </mat-button>\n              }\n              <mat-form-field\n                [style.width.%]=\"bundle.width ? bundle.width : undefined\"\n              >\n                @if (bundle.multiple) {\n                  <div>\n                    <mat-select\n                      #selection\n                      [multiple]=\"bundle.multiple\"\n                      [placeholder]=\"bundle.title!\"\n                      formControlName=\"selectMulti\"\n                    >\n                      <div class=\"checkboxes\">\n                        @if (bundle.multiple) {\n                          <mat-checkbox\n                            [(ngModel)]=\"selectAllSelected\"\n                            [ngModelOptions]=\"{ standalone: true }\"\n                            (change)=\"toggleAllSelection()\"\n                            >Tous\n                          </mat-checkbox>\n                        }\n                      </div>\n                      @for (ogcSelect of bundle.selectors; track ogcSelect) {\n                        <mat-option\n                          [matTooltip]=\"getToolTip(ogcSelect)\"\n                          tooltip-position=\"below\"\n                          matTooltipDelay=\"500\"\n                          matTooltipClass=\"material-tooltip\"\n                          (onSelectionChange)=\"\n                            selectOptionClick(\n                              $event.source.value,\n                              bundle,\n                              $event\n                            )\n                          \"\n                          [value]=\"ogcSelect\"\n                          >{{ ogcSelect.title }}\n                        </mat-option>\n                      }\n                    </mat-select>\n                  </div>\n                } @else {\n                  <mat-select\n                    [placeholder]=\"bundle.title!\"\n                    formControlName=\"select\"\n                  >\n                    @for (ogcSelect of bundle.selectors; track ogcSelect) {\n                      <mat-option\n                        [matTooltip]=\"getToolTip(ogcSelect)\"\n                        tooltip-position=\"below\"\n                        matTooltipDelay=\"500\"\n                        matTooltipClass=\"material-tooltip\"\n                        [value]=\"ogcSelect\"\n                        (onSelectionChange)=\"\n                          selectOptionClick($event.source.value, bundle)\n                        \"\n                        >{{ ogcSelect.title }}\n                      </mat-option>\n                    }\n                  </mat-select>\n                }\n              </mat-form-field>\n            </div>\n          }\n        </div>\n      }\n      @if (selector.selectorType === 'autocomplete') {\n        <div class=\"autocompleteGroups\">\n          <mat-divider />\n          @if (getAutocompleteGroups()!.length > 1) {\n            <div class=\"groupsSelector\">\n              <mat-form-field>\n                <mat-select\n                  formControlName=\"autocompleteGroup\"\n                  [matTooltip]=\"'igo.geo.layer.legend.selectStyle' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  [(value)]=\"currentAutocompleteGroup\"\n                >\n                  @for (\n                    autocompleteGroup of getAutocompleteGroups();\n                    track autocompleteGroup\n                  ) {\n                    <mat-option [value]=\"autocompleteGroup\"\n                      >{{ autocompleteGroup.title }}\n                    </mat-option>\n                  }\n                </mat-select>\n              </mat-form-field>\n            </div>\n          }\n          @for (\n            bundle of currentAutocompleteGroup.computedSelectors;\n            track bundle\n          ) {\n            <h4>{{ bundle.title }}</h4>\n            <div class=\"groupsSelector\">\n              @if (bundle.unfiltered) {\n                <mat-button\n                  mat-icon-button\n                  color=\"warn\"\n                  [matTooltip]=\"'igo.geo.filter.resetFilters' | translate\"\n                  tooltip-position=\"below\"\n                  matTooltipShowDelay=\"500\"\n                  matTooltipClass=\"material-tooltip\"\n                  (click)=\"emptyAutocomplete()\"\n                >\n                  <mat-icon>filter_alt_off</mat-icon>\n                </mat-button>\n              }\n              @if (filteredOgcAutocomplete[bundle.id]) {\n                <mat-form-field\n                  floatLabel=\"always\"\n                  [style.width.%]=\"bundle.width ? bundle.width : undefined\"\n                >\n                  <mat-label>{{ bundle.title }}</mat-label>\n                  @if (\n                    filteredOgcAutocomplete[bundle.id] &&\n                    (bundle.showChips ?? true)\n                  ) {\n                    <mat-chip-set>\n                      @for (\n                        autocompleteEnabled of autocompleteEnableds;\n                        track autocompleteEnabled\n                      ) {\n                        <mat-chip\n                          (removed)=\"toggleSelection(autocompleteEnabled)\"\n                        >\n                          {{ autocompleteEnabled }}\n                          <button\n                            matChipRemove\n                            [matTooltip]=\"\n                              'igo.geo.filter.removeFilter' | translate\n                            \"\n                          >\n                            <mat-icon>cancel</mat-icon>\n                          </button>\n                        </mat-chip>\n                      }\n                    </mat-chip-set>\n                  }\n                  <input\n                    matInput\n                    type=\"text\"\n                    formControlName=\"autocomplete\"\n                    #input\n                    [matAutocomplete]=\"auto\"\n                    (input)=\"onInputChange()\"\n                  />\n                  <mat-autocomplete\n                    #auto=\"matAutocomplete\"\n                    [displayWith]=\"displayFn\"\n                  >\n                    @for (\n                      ogcAutocomplete of filteredOgcAutocomplete[bundle.id]\n                        | async;\n                      track ogcAutocomplete\n                    ) {\n                      <mat-option\n                        id=\"mat-option\"\n                        [matTooltip]=\"getToolTip(ogcAutocomplete)\"\n                      >\n                        <div\n                          (click)=\"\n                            toggleAutocompleteOption(\n                              $event,\n                              ogcAutocomplete.value\n                            )\n                          \"\n                        >\n                          <mat-checkbox\n                            id=\"mat-checkbox\"\n                            color=\"primary\"\n                            [checked]=\"checkedStatus(ogcAutocomplete.value)\"\n                            (click)=\"\n                              toggleAutocompleteOption(\n                                $event,\n                                ogcAutocomplete.value\n                              )\n                            \"\n                          />\n                          {{ ogcAutocomplete.value }}\n                        </div>\n                      </mat-option>\n                    }\n                  </mat-autocomplete>\n                </mat-form-field>\n              }\n            </div>\n          }\n        </div>\n      }\n    </div>\n  }\n</form>\n\n@if (isTemporalOperator()) {\n  <div>\n    <mat-divider />\n    @if (!currentFilter.title) {\n      <h4>\n        {{ 'igo.geo.filter.reportingDate' | translate }}\n      </h4>\n    }\n    @if (currentFilter.title) {\n      <h4>{{ currentFilter.title }}</h4>\n    }\n    <igo-ogc-filter-time\n      [datasource]=\"datasource()\"\n      [currentFilter]=\"currentFilter\"\n      (changeProperty)=\"changeProperty($event.value, $event.pos)\"\n    />\n  </div>\n}\n", styles: [":host ::ng-deep .material-tooltip{white-space:pre-wrap}.mat-button-toggle-group{margin:5px;flex-wrap:wrap;box-shadow:none!important;width:95%}.checkboxes{flex-wrap:wrap;box-shadow:none}.groupsSelector{text-align:center}mat-button-toggle{display:inline-flex;border:1.5px solid black;border-radius:5px;margin:5px;white-space:normal;min-height:40px;height:auto;width:142px}mat-button-toggle ::ng-deep .mat-button-toggle-label-content{line-height:unset;font-size:small;display:block}@media only screen and (orientation:portrait)and (max-width:599px),only screen and (orientation:landscape)and (max-width:959px){mat-button-toggle{width:45%}}mat-checkbox,mat-radio-button{margin:7px;width:95%;display:inline-flex;font-size:larger}mat-checkbox ::ng-deep label,mat-radio-button ::ng-deep label{white-space:normal}mat-checkbox{vertical-align:middle}mat-button{padding-right:10px;cursor:pointer}h3{margin:7px;text-align:left}u{cursor:pointer;color:#00f;margin:5px}p{margin:unset}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i1$2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$3.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$3.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i2$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i8$1.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i8$1.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i4$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i4$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: OgcFilterTimeComponent, selector: "igo-ogc-filter-time", inputs: ["datasource", "currentFilter"], outputs: ["changeProperty"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i12.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "directive", type: i12.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i12.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: OgcFilterSelectionComponent, decorators: [{
             type: Component,
@@ -23604,7 +23628,7 @@ class DrawPopupComponent {
         return this.languageService.translate.instant('igo.geo.draw.labelType.' + option);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: DrawPopupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: DrawPopupComponent, isStandalone: true, selector: "igo-draw-popup-component", inputs: { confirmFlag: { classPropertyName: "confirmFlag", publicName: "confirmFlag", isSignal: true, isRequired: false, transformFunction: null }, labelFlag: { classPropertyName: "labelFlag", publicName: "labelFlag", isSignal: true, isRequired: false, transformFunction: null }, coordinatesMeasureUnit: { classPropertyName: "coordinatesMeasureUnit", publicName: "coordinatesMeasureUnit", isSignal: true, isRequired: false, transformFunction: null }, lengthMeasureUnit: { classPropertyName: "lengthMeasureUnit", publicName: "lengthMeasureUnit", isSignal: true, isRequired: false, transformFunction: null }, areaMeasureUnit: { classPropertyName: "areaMeasureUnit", publicName: "areaMeasureUnit", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { confirmFlag: "confirmFlagChange", labelFlag: "labelFlagChange", coordinatesMeasureUnit: "coordinatesMeasureUnitChange", lengthMeasureUnit: "lengthMeasureUnitChange", areaMeasureUnit: "areaMeasureUnitChange" }, ngImport: i0, template: "<h2 mat-dialog-title>\n  {{ 'igo.geo.draw.popupTitle' | translate }}\n</h2>\n\n@if (labelFlag() !== labelType.Custom) {\n  <div mat-dialog-content class=\"geometry-type-toggle\">\n    <div class=\"button-toggle-container\">\n      <mat-button-toggle-group\n        (change)=\"onLabelTypeChange($event.value)\"\n        [value]=\"customOrPredefined\"\n      >\n        <mat-button-toggle [value]=\"labelType.Custom\">\n          {{ 'igo.geo.draw.labelType.custom' | translate }}\n        </mat-button-toggle>\n        <mat-button-toggle [value]=\"labelType.Predefined\">\n          {{ 'igo.geo.draw.labelType.predefined' | translate }}\n        </mat-button-toggle>\n      </mat-button-toggle-group>\n    </div>\n    <div>\n      <p>\n        {{ 'igo.geo.draw.builtInInstructions' | translate }}\n      </p>\n      @if (olGeometryType !== 'Polygon') {\n        <mat-radio-group>\n          @for (option of arrayBuiltInType; track option) {\n            <mat-radio-button\n              [value]=\"option.value\"\n              [disabled]=\"optionAvailable(option.value)\"\n              (change)=\"onLabelTypeChange($event.value)\"\n              [checked]=\"option.checked\"\n            >\n              {{ getProperLengthLabel(option.value) }}\n            </mat-radio-button>\n          }\n        </mat-radio-group>\n      }\n      @if (olGeometryType === 'Polygon') {\n        @for (option of arrayBuiltInType; track option) {\n          <mat-checkbox\n            [value]=\"option.value\"\n            [disabled]=\"optionAvailable(option.value)\"\n            (change)=\"\n              onLabelTypeChange($any($event.source.value), $event.checked)\n            \"\n            [checked]=\"option.checked\"\n          >\n            {{ getProperLengthLabel(option.value) }}\n          </mat-checkbox>\n        }\n      }\n      @if (labelFlag() === labelType.Coordinates) {\n        <div class=\"fields-container\">\n          <mat-form-field class=\"readOnly-Input\">\n            <mat-label>(Latitude, Longitude)</mat-label>\n            <input\n              #input\n              matInput\n              placeholder=\"(Latitude, Longitude)\"\n              value=\"{{ currentCoordinates }}\"\n              readonly\n            />\n          </mat-form-field>\n          <mat-form-field class=\"unit-field\">\n            <mat-select\n              [value]=\"coordinatesMeasureUnit()\"\n              (selectionChange)=\"onChangeCoordinateUnit($event.value)\"\n            >\n              @for (unit of allCoordinatesUnits; track unit) {\n                <mat-option [value]=\"unit\">\n                  {{ unit }}\n                </mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n        </div>\n      }\n      @if (labelFlag() === labelType.Length || polygonCheck === 2) {\n        <div class=\"fields-container\">\n          <mat-form-field class=\"readOnly-Input\">\n            <mat-label>{{ lengthLabelT }}</mat-label>\n            <input\n              #input\n              matInput\n              placeholder=\"{{ lengthLabelT }}\"\n              value=\"{{ currentLength }}\"\n              readonly\n            />\n          </mat-form-field>\n          <mat-form-field class=\"unit-field\">\n            <mat-select\n              [value]=\"lengthMeasureUnit()\"\n              (selectionChange)=\"onChangeLengthUnit($event.value)\"\n            >\n              @for (unit of allLengthUnits; track unit) {\n                <mat-option [value]=\"unit\">\n                  {{ getLengthUnitEnum(unit) }}\n                </mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n        </div>\n      }\n      @if (labelFlag() === labelType.Area || polygonCheck === 2) {\n        <div class=\"fields-container\">\n          <mat-form-field class=\"readOnly-Input\">\n            <mat-label>{{\n              'igo.geo.draw.labelType.Area' | translate\n            }}</mat-label>\n            <input\n              #input\n              matInput\n              placeholder=\"{{ 'igo.geo.draw.labelType.Area' | translate }}\"\n              value=\"{{ currentArea }}\"\n              readonly\n            />\n          </mat-form-field>\n          <mat-form-field class=\"unit-field\">\n            <mat-select\n              [value]=\"areaMeasureUnit()\"\n              (selectionChange)=\"onChangeAreaUnit($event.value)\"\n            >\n              @for (unit of allAreaUnits; track unit) {\n                <mat-option [value]=\"unit\">\n                  {{ getAreaUnitEnum(unit) }}\n                </mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n        </div>\n      }\n    </div>\n  </div>\n  <div mat-dialog-actions>\n    <button matButton=\"elevated\" (click)=\"cancelDrawing()\">\n      {{ 'igo.geo.draw.cancel' | translate }}\n    </button>\n    <button matButton=\"elevated\" color=\"primary\" (click)=\"confirm()\">\n      {{ noLabelButton() }}\n    </button>\n  </div>\n}\n\n@if (labelFlag() === labelType.Custom) {\n  <div mat-dialog-content class=\"geometry-type-toggle\">\n    <div class=\"button-toggle-container\">\n      <mat-button-toggle-group\n        (change)=\"onLabelTypeChange($event.value)\"\n        [value]=\"customOrPredefined\"\n      >\n        <mat-button-toggle [value]=\"labelType.Custom\">\n          {{ 'igo.geo.draw.labelType.custom' | translate }}\n        </mat-button-toggle>\n        <mat-button-toggle [value]=\"labelType.Predefined\">\n          {{ 'igo.geo.draw.labelType.predefined' | translate }}\n        </mat-button-toggle>\n      </mat-button-toggle-group>\n    </div>\n    <p>\n      {{ 'igo.geo.draw.dialogInstruction' | translate }}\n    </p>\n    <mat-form-field class=\"input\">\n      <mat-label>{{ 'igo.geo.draw.dialogTitle' | translate }}</mat-label>\n      <input\n        #input\n        matInput\n        (select)=\"(true)\"\n        (input)=\"getLabelLength($any($event.target).value)\"\n        placeholder=\"{{ 'igo.geo.draw.dialogTitle' | translate }}\"\n        value=\"{{ currentLabel }}\"\n        cdkFocusInitial\n      />\n    </mat-form-field>\n  </div>\n  <div mat-dialog-actions>\n    <button matButton=\"elevated\" (click)=\"cancelDrawing()\">\n      {{ 'igo.geo.draw.cancel' | translate }}\n    </button>\n    <button matButton=\"elevated\" color=\"primary\" (click)=\"confirm(input.value)\">\n      {{ noLabelButton() }}\n    </button>\n  </div>\n}\n", styles: [":host .mat-mdc-radio-button~.mat-radio-button{margin-left:12px}:host .readOnly-Input{width:200px!important}:host .button-toggle-container{margin-bottom:12px}:host .unit-field{margin-left:12px}:host .unit-field ::ng-deep .mat-mdc-form-field-infix{width:fit-content}:host .unit-field ::ng-deep .mat-mdc-select-min-line{padding-right:24px}:host .mat-mdc-form-field{position:sticky!important}:host .coordinatesInputView{top:5em!important}:host .mat-mdc-dialog-actions{display:flex!important;justify-content:flex-end}:host .input{width:auto!important}:host .mat-button-toggle-group,:host .mat-button-toggle{width:100%}:host mat-checkbox{margin-right:10px}:host ::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{display:none}\n"], dependencies: [{ kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$4.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$4.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i8$1.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i8$1.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i2$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: DrawPopupComponent, isStandalone: true, selector: "igo-draw-popup-component", inputs: { confirmFlag: { classPropertyName: "confirmFlag", publicName: "confirmFlag", isSignal: true, isRequired: false, transformFunction: null }, labelFlag: { classPropertyName: "labelFlag", publicName: "labelFlag", isSignal: true, isRequired: false, transformFunction: null }, coordinatesMeasureUnit: { classPropertyName: "coordinatesMeasureUnit", publicName: "coordinatesMeasureUnit", isSignal: true, isRequired: false, transformFunction: null }, lengthMeasureUnit: { classPropertyName: "lengthMeasureUnit", publicName: "lengthMeasureUnit", isSignal: true, isRequired: false, transformFunction: null }, areaMeasureUnit: { classPropertyName: "areaMeasureUnit", publicName: "areaMeasureUnit", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { confirmFlag: "confirmFlagChange", labelFlag: "labelFlagChange", coordinatesMeasureUnit: "coordinatesMeasureUnitChange", lengthMeasureUnit: "lengthMeasureUnitChange", areaMeasureUnit: "areaMeasureUnitChange" }, ngImport: i0, template: "<h2 mat-dialog-title>\n  {{ 'igo.geo.draw.popupTitle' | translate }}\n</h2>\n\n@if (labelFlag() !== labelType.Custom) {\n  <div mat-dialog-content class=\"geometry-type-toggle\">\n    <div class=\"button-toggle-container\">\n      <mat-button-toggle-group\n        (change)=\"onLabelTypeChange($event.value)\"\n        [value]=\"customOrPredefined\"\n      >\n        <mat-button-toggle [value]=\"labelType.Custom\">\n          {{ 'igo.geo.draw.labelType.custom' | translate }}\n        </mat-button-toggle>\n        <mat-button-toggle [value]=\"labelType.Predefined\">\n          {{ 'igo.geo.draw.labelType.predefined' | translate }}\n        </mat-button-toggle>\n      </mat-button-toggle-group>\n    </div>\n    <div>\n      <p>\n        {{ 'igo.geo.draw.builtInInstructions' | translate }}\n      </p>\n      @if (olGeometryType !== 'Polygon') {\n        <mat-radio-group>\n          @for (option of arrayBuiltInType; track option) {\n            <mat-radio-button\n              [value]=\"option.value\"\n              [disabled]=\"optionAvailable(option.value)\"\n              (change)=\"onLabelTypeChange($event.value)\"\n              [checked]=\"option.checked\"\n            >\n              {{ getProperLengthLabel(option.value) }}\n            </mat-radio-button>\n          }\n        </mat-radio-group>\n      }\n      @if (olGeometryType === 'Polygon') {\n        @for (option of arrayBuiltInType; track option) {\n          <mat-checkbox\n            [value]=\"option.value\"\n            [disabled]=\"optionAvailable(option.value)\"\n            (change)=\"\n              onLabelTypeChange($any($event.source.value), $event.checked)\n            \"\n            [checked]=\"option.checked\"\n          >\n            {{ getProperLengthLabel(option.value) }}\n          </mat-checkbox>\n        }\n      }\n      @if (labelFlag() === labelType.Coordinates) {\n        <div class=\"fields-container\">\n          <mat-form-field class=\"readOnly-Input\">\n            <mat-label>(Latitude, Longitude)</mat-label>\n            <input\n              #input\n              matInput\n              placeholder=\"(Latitude, Longitude)\"\n              value=\"{{ currentCoordinates }}\"\n              readonly\n            />\n          </mat-form-field>\n          <mat-form-field class=\"unit-field\">\n            <mat-select\n              [value]=\"coordinatesMeasureUnit()\"\n              (selectionChange)=\"onChangeCoordinateUnit($event.value)\"\n            >\n              @for (unit of allCoordinatesUnits; track unit) {\n                <mat-option [value]=\"unit\">\n                  {{ unit }}\n                </mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n        </div>\n      }\n      @if (labelFlag() === labelType.Length || polygonCheck === 2) {\n        <div class=\"fields-container\">\n          <mat-form-field class=\"readOnly-Input\">\n            <mat-label>{{ lengthLabelT }}</mat-label>\n            <input\n              #input\n              matInput\n              placeholder=\"{{ lengthLabelT }}\"\n              value=\"{{ currentLength }}\"\n              readonly\n            />\n          </mat-form-field>\n          <mat-form-field class=\"unit-field\">\n            <mat-select\n              [value]=\"lengthMeasureUnit()\"\n              (selectionChange)=\"onChangeLengthUnit($event.value)\"\n            >\n              @for (unit of allLengthUnits; track unit) {\n                <mat-option [value]=\"unit\">\n                  {{ getLengthUnitEnum(unit) }}\n                </mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n        </div>\n      }\n      @if (labelFlag() === labelType.Area || polygonCheck === 2) {\n        <div class=\"fields-container\">\n          <mat-form-field class=\"readOnly-Input\">\n            <mat-label>{{\n              'igo.geo.draw.labelType.Area' | translate\n            }}</mat-label>\n            <input\n              #input\n              matInput\n              placeholder=\"{{ 'igo.geo.draw.labelType.Area' | translate }}\"\n              value=\"{{ currentArea }}\"\n              readonly\n            />\n          </mat-form-field>\n          <mat-form-field class=\"unit-field\">\n            <mat-select\n              [value]=\"areaMeasureUnit()\"\n              (selectionChange)=\"onChangeAreaUnit($event.value)\"\n            >\n              @for (unit of allAreaUnits; track unit) {\n                <mat-option [value]=\"unit\">\n                  {{ getAreaUnitEnum(unit) }}\n                </mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n        </div>\n      }\n    </div>\n  </div>\n  <div mat-dialog-actions>\n    <button matButton=\"elevated\" (click)=\"cancelDrawing()\">\n      {{ 'igo.geo.draw.cancel' | translate }}\n    </button>\n    <button matButton=\"elevated\" color=\"primary\" (click)=\"confirm()\">\n      {{ noLabelButton() }}\n    </button>\n  </div>\n}\n\n@if (labelFlag() === labelType.Custom) {\n  <div mat-dialog-content class=\"geometry-type-toggle\">\n    <div class=\"button-toggle-container\">\n      <mat-button-toggle-group\n        (change)=\"onLabelTypeChange($event.value)\"\n        [value]=\"customOrPredefined\"\n      >\n        <mat-button-toggle [value]=\"labelType.Custom\">\n          {{ 'igo.geo.draw.labelType.custom' | translate }}\n        </mat-button-toggle>\n        <mat-button-toggle [value]=\"labelType.Predefined\">\n          {{ 'igo.geo.draw.labelType.predefined' | translate }}\n        </mat-button-toggle>\n      </mat-button-toggle-group>\n    </div>\n    <p>\n      {{ 'igo.geo.draw.dialogInstruction' | translate }}\n    </p>\n    <mat-form-field class=\"input\">\n      <mat-label>{{ 'igo.geo.draw.dialogTitle' | translate }}</mat-label>\n      <input\n        #input\n        matInput\n        (select)=\"(true)\"\n        (input)=\"getLabelLength($any($event.target).value)\"\n        placeholder=\"{{ 'igo.geo.draw.dialogTitle' | translate }}\"\n        value=\"{{ currentLabel }}\"\n        cdkFocusInitial\n      />\n    </mat-form-field>\n  </div>\n  <div mat-dialog-actions>\n    <button matButton=\"elevated\" (click)=\"cancelDrawing()\">\n      {{ 'igo.geo.draw.cancel' | translate }}\n    </button>\n    <button matButton=\"elevated\" color=\"primary\" (click)=\"confirm(input.value)\">\n      {{ noLabelButton() }}\n    </button>\n  </div>\n}\n", styles: [":host .mat-mdc-radio-button~.mat-radio-button{margin-left:12px}:host .readOnly-Input{width:200px!important}:host .button-toggle-container{margin-bottom:12px}:host .unit-field{margin-left:12px}:host .unit-field ::ng-deep .mat-mdc-form-field-infix{width:fit-content}:host .unit-field ::ng-deep .mat-mdc-select-min-line{padding-right:24px}:host .mat-mdc-form-field{position:sticky!important}:host .coordinatesInputView{top:5em!important}:host .mat-mdc-dialog-actions{display:flex!important;justify-content:flex-end}:host .input{width:auto!important}:host .mat-button-toggle-group,:host .mat-button-toggle{width:100%}:host mat-checkbox{margin-right:10px}:host ::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{display:none}\n"], dependencies: [{ kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$3.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$3.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i8$1.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i8$1.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i2$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: DrawPopupComponent, decorators: [{
             type: Component,
@@ -24658,7 +24682,7 @@ class DrawComponent {
                     hideSingleSelectionIndicator: true
                 }
             }
-        ], viewQueries: [{ propertyName: "select", first: true, predicate: ["selectedLayer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div>\n  <div class=\"geometry-type-toggle\">\n    <mat-button-toggle-group\n      (change)=\"onGeometryTypeChange($event.value)\"\n      [value]=\"geometryType.Point\"\n    >\n      <mat-button-toggle [value]=\"geometryType.Point\">\n        {{ 'igo.geo.draw.' + geometryType.Point | translate }}\n      </mat-button-toggle>\n\n      <mat-button-toggle [value]=\"geometryType.LineString\">\n        {{ 'igo.geo.draw.' + geometryType.LineString | translate }}\n      </mat-button-toggle>\n\n      <mat-button-toggle [value]=\"geometryType.Polygon\">\n        {{ 'igo.geo.draw.' + geometryType.Polygon | translate }}\n      </mat-button-toggle>\n\n      <mat-button-toggle [value]=\"geometryType.Circle\">\n        {{ 'igo.geo.draw.' + geometryType.Circle | translate }}\n      </mat-button-toggle>\n    </mat-button-toggle-group>\n  </div>\n\n  <div class=\"draw-options\">\n    <mat-slide-toggle\n      [disabled]=\"drawControlIsDisabled\"\n      [checked]=\"drawControlIsActive\"\n      [labelPosition]=\"'before'\"\n      (change)=\"onToggleDrawControl($event.checked)\"\n    >\n      {{ 'igo.geo.draw.drawControl' | translate }}\n    </mat-slide-toggle>\n\n    <mat-slide-toggle\n      [checked]=\"labelsAreShown\"\n      [labelPosition]=\"'before'\"\n      (change)=\"onToggleLabels()\"\n    >\n      {{ 'igo.geo.draw.toggleMapTooltips' | translate }}\n    </mat-slide-toggle>\n\n    @if (!isPoint()) {\n      <mat-slide-toggle\n        [checked]=\"freehandMode\"\n        [labelPosition]=\"'before'\"\n        (change)=\"onToggleFreehandMode($event)\"\n      >\n        {{ 'igo.geo.draw.freehandMode' | translate }}\n      </mat-slide-toggle>\n    }\n\n    @if (isCircle()) {\n      <div class=\"radius-unit\">\n        <mat-form-field class=\"radius\">\n          <input\n            matInput\n            type=\"number\"\n            min=\"0\"\n            placeholder=\"{{ 'igo.geo.spatialFilter.radius' | translate }}\"\n            [formControl]=\"radiusFormControl\"\n            [readonly]=\"this.freehandMode\"\n          />\n        </mat-form-field>\n        <mat-form-field class=\"unit-field\">\n          <mat-select\n            [value]=\"measureUnit\"\n            (selectionChange)=\"onMeasureUnitChange($event.value)\"\n          >\n            @for (measureUnit of measureUnits; track measureUnit) {\n              <mat-option [value]=\"measureUnit\">\n                {{ 'igo.geo.measure.' + measureUnit | translate }}\n              </mat-option>\n            }\n          </mat-select>\n        </mat-form-field>\n      </div>\n    }\n  </div>\n\n  <mat-divider />\n\n  <div class=\"layer-select-container\">\n    <mat-form-field class=\"layer-select\" subscriptSizing=\"dynamic\">\n      <mat-label>{{ 'igo.geo.draw.layer.title' | translate }}</mat-label>\n      <mat-select\n        #selectedLayer\n        (selectionChange)=\"onLayerChange(selectedLayer.value)\"\n        [value]=\"updateActiveLayer()\"\n      >\n        @for (layer of allLayers; track layer) {\n          <mat-option [value]=\"layer\">\n            {{ layer.title }}\n          </mat-option>\n        }\n        <mat-option id=\"createNewLayer\">\n          {{ 'igo.geo.draw.layer.createNewLayer' | translate }}\n        </mat-option>\n      </mat-select>\n    </mat-form-field>\n    @let drawingLayer = activeDrawingLayer();\n    @if (drawingLayer) {\n      <button\n        mat-icon-button\n        [color]=\"drawingLayer.visible ? 'primary' : 'accent'\"\n        collapsibleButton\n        tooltip-position=\"below\"\n        matTooltipShowDelay=\"500\"\n        [matTooltip]=\"\n          drawingLayer.visible\n            ? ('igo.geo.layer.hideLayer' | translate)\n            : ('igo.geo.layer.showLayer' | translate)\n        \"\n        (click)=\"drawingLayer.visible = !drawingLayer.visible\"\n      >\n        <mat-icon>\n          {{ drawingLayer.visible ? 'visibility' : 'visibility_off' }}\n        </mat-icon>\n      </button>\n    }\n  </div>\n  <mat-divider />\n  <div>\n    @if (activeStore.count$.getValue() > 0) {\n      <button\n        class=\"deleteBtn\"\n        mat-icon-button\n        color=\"warn\"\n        tooltip-position=\"below\"\n        matTooltipShowDelay=\"500\"\n        [matTooltip]=\"'igo.geo.draw.delete' | translate\"\n        [disabled]=\"(selectedFeatures$ | async)!.length === 0\"\n        (click)=\"deleteDrawings()\"\n      >\n        <mat-icon>delete</mat-icon>\n      </button>\n    }\n\n    <div>\n      <igo-entity-table\n        #table\n        class=\"table-compact\"\n        [store]=\"$any(activeStore)\"\n        [template]=\"tableTemplate\"\n      />\n    </div>\n  </div>\n\n  <div class=\"icon-options\">\n    @if (icons && icons.length >= 1) {\n      <mat-form-field>\n        <mat-label>{{ 'igo.geo.draw.icon' | translate }}</mat-label>\n        <mat-select>\n          <mat-select-trigger>\n            @if (icon) {\n              <div class=\"box\">\n                <img src=\"{{ icon }}\" />\n              </div>\n            }\n          </mat-select-trigger>\n          <mat-option value=\"\" (click)=\"onIconChange()\">{{\n            'igo.geo.draw.noIcon' | translate\n          }}</mat-option>\n          @for (icon_html of icons; track icon_html) {\n            <mat-option [value]=\"icon_html\" (click)=\"onIconChange(icon_html)\">\n              <div class=\"box\">\n                <img src=\"{{ icon_html }}\" />\n              </div>\n            </mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n    }\n  </div>\n\n  <div class=\"actions-container\">\n    <button\n      mat-icon-button\n      color=\"accent\"\n      disableRipple=\"true\"\n      (click)=\"openShorcutsDialog()\"\n    >\n      <mat-icon\n        class=\"shortcuts-icon\"\n        tooltip-position=\"below\"\n        matTooltipShowDelay=\"500\"\n        [matTooltip]=\"'igo.geo.draw.shortcuts' | translate\"\n        >keyboard\n      </mat-icon>\n    </button>\n\n    @if (selectedFeatures$.value.length) {\n      <button\n        matButton=\"elevated\"\n        color=\"primary\"\n        (click)=\"openStyleModalDialog()\"\n        [matTooltip]=\"'igo.geo.style.styleModalTooltipSelected' | translate\"\n      >\n        {{ 'igo.geo.style.styleModal' | translate }}\n        <mat-icon\n          aria-hidden=\"false\"\n          iconPositionEnd\n          class=\"style-icon\"\n          [matBadge]=\"selectedFeatures$.value.length\"\n          matBadgeColor=\"warn\"\n          matBadgeSize=\"medium\"\n          >palette\n        </mat-icon>\n      </button>\n    }\n  </div>\n</div>\n", styles: [":host ::ng-deep igo-entity-table td:last-child{text-align:right!important}:host ::ng-deep igo-entity-table td:last-child button{margin:0%!important}.geometry-type-toggle{padding:10px;text-align:center}.geometry-type-toggle mat-button-toggle-group{width:100%}.geometry-type-toggle mat-button-toggle-group mat-button-toggle{width:25%}.draw-options mat-slide-toggle{width:100%;padding:10px}.draw-options mat-slide-toggle ::ng-deep .mdc-form-field{width:100%}.draw-options mat-slide-toggle ::ng-deep .mdc-label{margin-left:0;width:calc(100% - 60px)}.icon-options{margin:5px 5px 0}.deleteBtn{margin-left:16px}.edition-drawing{padding:10px 0}img{width:100%;height:100%}.deleteBtn{margin-left:12px}.storeTable{height:auto!important}.layer-select{flex:1;margin-right:8px}.input-button-container{padding:10px}.input-button-container mat-form-field{width:25%}.input-button-container button{left:8px;bottom:10px}.radius{flex:2}.unit-field{flex:1;margin-left:8px}.radius-unit{display:flex;width:100%;padding:4px 8px}.layer-select-container{margin:16px 8px}.actions-container,.layer-select-container{display:flex;align-items:center}::ng-deep igo-draw-popup-component .igo-map-tooltip,::ng-deep igo-draw-shorcuts .igo-map-tooltip,::ng-deep igo-draw .igo-map-tooltip{position:relative;border-radius:4px;padding:4px 8px;white-space:nowrap}::ng-deep igo-draw-popup-component .igo-map-tooltip-draw,::ng-deep igo-draw-shorcuts .igo-map-tooltip-draw,::ng-deep igo-draw .igo-map-tooltip-draw{font:var(--mat-sys-headline-small)}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$4.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$4.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i1$3.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i4$3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i1$2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: EntityTableComponent, selector: "igo-entity-table", inputs: ["store", "paginator", "template", "scrollBehavior", "sortNullsFirst", "withPaginator", "paginatorOptions"], outputs: ["entityClick", "entitySelectChange", "entitySortChange"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i4$4.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }], animations: [
+        ], viewQueries: [{ propertyName: "select", first: true, predicate: ["selectedLayer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div>\n  <div class=\"geometry-type-toggle\">\n    <mat-button-toggle-group\n      (change)=\"onGeometryTypeChange($event.value)\"\n      [value]=\"geometryType.Point\"\n    >\n      <mat-button-toggle [value]=\"geometryType.Point\">\n        {{ 'igo.geo.draw.' + geometryType.Point | translate }}\n      </mat-button-toggle>\n\n      <mat-button-toggle [value]=\"geometryType.LineString\">\n        {{ 'igo.geo.draw.' + geometryType.LineString | translate }}\n      </mat-button-toggle>\n\n      <mat-button-toggle [value]=\"geometryType.Polygon\">\n        {{ 'igo.geo.draw.' + geometryType.Polygon | translate }}\n      </mat-button-toggle>\n\n      <mat-button-toggle [value]=\"geometryType.Circle\">\n        {{ 'igo.geo.draw.' + geometryType.Circle | translate }}\n      </mat-button-toggle>\n    </mat-button-toggle-group>\n  </div>\n\n  <div class=\"draw-options\">\n    <mat-slide-toggle\n      [disabled]=\"drawControlIsDisabled\"\n      [checked]=\"drawControlIsActive\"\n      [labelPosition]=\"'before'\"\n      (change)=\"onToggleDrawControl($event.checked)\"\n    >\n      {{ 'igo.geo.draw.drawControl' | translate }}\n    </mat-slide-toggle>\n\n    <mat-slide-toggle\n      [checked]=\"labelsAreShown\"\n      [labelPosition]=\"'before'\"\n      (change)=\"onToggleLabels()\"\n    >\n      {{ 'igo.geo.draw.toggleMapTooltips' | translate }}\n    </mat-slide-toggle>\n\n    @if (!isPoint()) {\n      <mat-slide-toggle\n        [checked]=\"freehandMode\"\n        [labelPosition]=\"'before'\"\n        (change)=\"onToggleFreehandMode($event)\"\n      >\n        {{ 'igo.geo.draw.freehandMode' | translate }}\n      </mat-slide-toggle>\n    }\n\n    @if (isCircle()) {\n      <div class=\"radius-unit\">\n        <mat-form-field class=\"radius\">\n          <input\n            matInput\n            type=\"number\"\n            min=\"0\"\n            placeholder=\"{{ 'igo.geo.spatialFilter.radius' | translate }}\"\n            [formControl]=\"radiusFormControl\"\n            [readonly]=\"this.freehandMode\"\n          />\n        </mat-form-field>\n        <mat-form-field class=\"unit-field\">\n          <mat-select\n            [value]=\"measureUnit\"\n            (selectionChange)=\"onMeasureUnitChange($event.value)\"\n          >\n            @for (measureUnit of measureUnits; track measureUnit) {\n              <mat-option [value]=\"measureUnit\">\n                {{ 'igo.geo.measure.' + measureUnit | translate }}\n              </mat-option>\n            }\n          </mat-select>\n        </mat-form-field>\n      </div>\n    }\n  </div>\n\n  <mat-divider />\n\n  <div class=\"layer-select-container\">\n    <mat-form-field class=\"layer-select\" subscriptSizing=\"dynamic\">\n      <mat-label>{{ 'igo.geo.draw.layer.title' | translate }}</mat-label>\n      <mat-select\n        #selectedLayer\n        (selectionChange)=\"onLayerChange(selectedLayer.value)\"\n        [value]=\"updateActiveLayer()\"\n      >\n        @for (layer of allLayers; track layer) {\n          <mat-option [value]=\"layer\">\n            {{ layer.title }}\n          </mat-option>\n        }\n        <mat-option id=\"createNewLayer\">\n          {{ 'igo.geo.draw.layer.createNewLayer' | translate }}\n        </mat-option>\n      </mat-select>\n    </mat-form-field>\n    @let drawingLayer = activeDrawingLayer();\n    @if (drawingLayer) {\n      <button\n        mat-icon-button\n        [color]=\"drawingLayer.visible ? 'primary' : 'accent'\"\n        collapsibleButton\n        tooltip-position=\"below\"\n        matTooltipShowDelay=\"500\"\n        [matTooltip]=\"\n          drawingLayer.visible\n            ? ('igo.geo.layer.hideLayer' | translate)\n            : ('igo.geo.layer.showLayer' | translate)\n        \"\n        (click)=\"drawingLayer.visible = !drawingLayer.visible\"\n      >\n        <mat-icon>\n          {{ drawingLayer.visible ? 'visibility' : 'visibility_off' }}\n        </mat-icon>\n      </button>\n    }\n  </div>\n  <mat-divider />\n  <div>\n    @if (activeStore.count$.getValue() > 0) {\n      <button\n        class=\"deleteBtn\"\n        mat-icon-button\n        color=\"warn\"\n        tooltip-position=\"below\"\n        matTooltipShowDelay=\"500\"\n        [matTooltip]=\"'igo.geo.draw.delete' | translate\"\n        [disabled]=\"(selectedFeatures$ | async)!.length === 0\"\n        (click)=\"deleteDrawings()\"\n      >\n        <mat-icon>delete</mat-icon>\n      </button>\n    }\n\n    <div>\n      <igo-entity-table\n        #table\n        class=\"table-compact\"\n        [store]=\"$any(activeStore)\"\n        [template]=\"tableTemplate\"\n      />\n    </div>\n  </div>\n\n  <div class=\"icon-options\">\n    @if (icons && icons.length >= 1) {\n      <mat-form-field>\n        <mat-label>{{ 'igo.geo.draw.icon' | translate }}</mat-label>\n        <mat-select>\n          <mat-select-trigger>\n            @if (icon) {\n              <div class=\"box\">\n                <img src=\"{{ icon }}\" />\n              </div>\n            }\n          </mat-select-trigger>\n          <mat-option value=\"\" (click)=\"onIconChange()\">{{\n            'igo.geo.draw.noIcon' | translate\n          }}</mat-option>\n          @for (icon_html of icons; track icon_html) {\n            <mat-option [value]=\"icon_html\" (click)=\"onIconChange(icon_html)\">\n              <div class=\"box\">\n                <img src=\"{{ icon_html }}\" />\n              </div>\n            </mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n    }\n  </div>\n\n  <div class=\"actions-container\">\n    <button\n      mat-icon-button\n      color=\"accent\"\n      disableRipple=\"true\"\n      (click)=\"openShorcutsDialog()\"\n    >\n      <mat-icon\n        class=\"shortcuts-icon\"\n        tooltip-position=\"below\"\n        matTooltipShowDelay=\"500\"\n        [matTooltip]=\"'igo.geo.draw.shortcuts' | translate\"\n        >keyboard\n      </mat-icon>\n    </button>\n\n    @if (selectedFeatures$.value.length) {\n      <button\n        matButton=\"elevated\"\n        color=\"primary\"\n        (click)=\"openStyleModalDialog()\"\n        [matTooltip]=\"'igo.geo.style.styleModalTooltipSelected' | translate\"\n      >\n        {{ 'igo.geo.style.styleModal' | translate }}\n        <mat-icon\n          aria-hidden=\"false\"\n          iconPositionEnd\n          class=\"style-icon\"\n          [matBadge]=\"selectedFeatures$.value.length\"\n          matBadgeColor=\"warn\"\n          matBadgeSize=\"medium\"\n          >palette\n        </mat-icon>\n      </button>\n    }\n  </div>\n</div>\n", styles: [":host ::ng-deep igo-entity-table td:last-child{text-align:right!important}:host ::ng-deep igo-entity-table td:last-child button{margin:0%!important}.geometry-type-toggle{padding:10px;text-align:center}.geometry-type-toggle mat-button-toggle-group{width:100%}.geometry-type-toggle mat-button-toggle-group mat-button-toggle{width:25%}.draw-options mat-slide-toggle{width:100%;padding:10px}.draw-options mat-slide-toggle ::ng-deep .mdc-form-field{width:100%}.draw-options mat-slide-toggle ::ng-deep .mdc-label{margin-left:0;width:calc(100% - 60px)}.icon-options{margin:5px 5px 0}.deleteBtn{margin-left:16px}.edition-drawing{padding:10px 0}img{width:100%;height:100%}.deleteBtn{margin-left:12px}.storeTable{height:auto!important}.layer-select{flex:1;margin-right:8px}.input-button-container{padding:10px}.input-button-container mat-form-field{width:25%}.input-button-container button{left:8px;bottom:10px}.radius{flex:2}.unit-field{flex:1;margin-left:8px}.radius-unit{display:flex;width:100%;padding:4px 8px}.layer-select-container{margin:16px 8px}.actions-container,.layer-select-container{display:flex;align-items:center}::ng-deep igo-draw-popup-component .igo-map-tooltip,::ng-deep igo-draw-shorcuts .igo-map-tooltip,::ng-deep igo-draw .igo-map-tooltip{position:relative;border-radius:4px;padding:4px 8px;white-space:nowrap}::ng-deep igo-draw-popup-component .igo-map-tooltip-draw,::ng-deep igo-draw-shorcuts .igo-map-tooltip-draw,::ng-deep igo-draw .igo-map-tooltip-draw{font:var(--mat-sys-headline-small)}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$3.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$3.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i2$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i4$3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i1$2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: EntityTableComponent, selector: "igo-entity-table", inputs: ["store", "paginator", "template", "scrollBehavior", "sortNullsFirst", "withPaginator", "paginatorOptions"], outputs: ["entityClick", "entitySelectChange", "entitySortChange"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i4$4.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }], animations: [
             trigger('openClose', [
                 state('open', style({
                     opacity: 1
@@ -26488,7 +26512,7 @@ class MeasurerComponent {
         this.activeAreaUnit = areaUnit ? areaUnit : this.activeAreaUnit;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: MeasurerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: MeasurerComponent, isStandalone: true, selector: "igo-measurer", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: true, transformFunction: null }, store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: true, transformFunction: null }, activeMeasureType: { classPropertyName: "activeMeasureType", publicName: "activeMeasureType", isSignal: false, isRequired: false, transformFunction: null }, minSegmentLength: { classPropertyName: "minSegmentLength", publicName: "minSegmentLength", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true, isSignal: true }], ngImport: i0, template: "<div>\n  <div class=\"measure-type-toggle\">\n    <mat-button-toggle-group\n      [value]=\"activeMeasureType\"\n      (change)=\"onMeasureTypeChange($event.value)\"\n    >\n      <mat-button-toggle [value]=\"measureType.Length\">\n        {{ 'igo.geo.measure.' + measureType.Length | translate }}\n      </mat-button-toggle>\n      <mat-button-toggle [value]=\"measureType.Area\">\n        {{ 'igo.geo.measure.' + measureType.Area | translate }}\n      </mat-button-toggle>\n    </mat-button-toggle-group>\n  </div>\n\n  <div class=\"measure-options\">\n    <mat-slide-toggle\n      [disabled]=\"drawControlIsDisabled\"\n      [checked]=\"drawControlIsActive\"\n      [labelPosition]=\"'before'\"\n      (change)=\"onToggleDrawControl($event.checked)\"\n    >\n      {{ 'igo.geo.measure.toggleActive' | translate }}\n    </mat-slide-toggle>\n\n    @if (hasLine$ | async) {\n      <mat-divider />\n    }\n\n    @if (hasLine$ | async) {\n      <mat-slide-toggle\n        [checked]=\"displayLines\"\n        [labelPosition]=\"'before'\"\n        (change)=\"onToggleDisplayLines($event.checked)\"\n      >\n        {{ 'igo.geo.measure.toggleDisplayLines' | translate }}\n      </mat-slide-toggle>\n    }\n\n    @if ((hasLine$ | async) || (hasArea$ | async)) {\n      <mat-divider />\n    }\n\n    @if (hasArea$ | async) {\n      <mat-slide-toggle\n        [checked]=\"displayDistance\"\n        [labelPosition]=\"'before'\"\n        (change)=\"onToggleDisplayDistance($event.checked)\"\n      >\n        {{ 'igo.geo.measure.toggleDisplayDistance' | translate }}\n      </mat-slide-toggle>\n    }\n\n    @if (hasArea$ | async) {\n      <mat-slide-toggle\n        [checked]=\"displayAreas\"\n        [labelPosition]=\"'before'\"\n        (change)=\"onToggleDisplayAreas($event.checked)\"\n      >\n        {{ 'igo.geo.measure.toggleDisplayAreas' | translate }}\n      </mat-slide-toggle>\n    }\n\n    @if (hasArea$ | async) {\n      <mat-divider />\n    }\n\n    <mat-slide-toggle\n      [checked]=\"measureUnitsAuto\"\n      [labelPosition]=\"'before'\"\n      (change)=\"onToggleMeasureUnitsAuto($event.checked)\"\n    >\n      {{ 'igo.geo.measure.toggleAutoUnits' | translate }}\n    </mat-slide-toggle>\n  </div>\n\n  @if (measure$ | async; as measure) {\n    @if (\n      activeMeasureType === measureType.Length ||\n      activeMeasureType === measureType.Area\n    ) {\n      <igo-measurer-item\n        [measureType]=\"measureType.Length\"\n        [measureUnit]=\"activeLengthUnit\"\n        [measure]=\"measure.length ?? 0\"\n        [auto]=\"measureUnitsAuto\"\n        [placeholder]=\"\n          (activeMeasureType === measureType.Area\n            ? 'igo.geo.measure.perimeter'\n            : 'igo.geo.measure.length'\n          ) | translate\n        \"\n        (measureUnitChange)=\"onLengthUnitChange($any($event))\"\n      />\n    }\n    @if (activeMeasureType === measureType.Area) {\n      <igo-measurer-item\n        [measureType]=\"measureType.Area\"\n        [measureUnit]=\"activeAreaUnit\"\n        [measure]=\"measure.area ?? 0\"\n        [auto]=\"measureUnitsAuto\"\n        [placeholder]=\"'igo.geo.measure.area' | translate\"\n        (measureUnitChange)=\"onAreaUnitChange($any($event))\"\n      />\n    }\n  }\n\n  @if ((hasLine$ | async) || (hasArea$ | async)) {\n    <mat-divider />\n  }\n\n  <div class=\"measure-store-buttons\">\n    @if ((hasLine$ | async) || (hasArea$ | async)) {\n      <button\n        mat-icon-button\n        [matTooltip]=\"'igo.geo.measure.actionbar.calculate.tooltip' | translate\"\n        [disabled]=\"(selectedFeatures$ | async)!.length === 0\"\n        color=\"accent\"\n        (click)=\"onCalculateClick()\"\n      >\n        <mat-icon>calculate</mat-icon>\n      </button>\n    }\n\n    @if ((hasLine$ | async) || (hasArea$ | async)) {\n      <button\n        mat-icon-button\n        [matTooltip]=\"'igo.geo.measure.actionbar.delete.tooltip' | translate\"\n        [disabled]=\"(selectedFeatures$ | async)!.length === 0\"\n        color=\"warn\"\n        (click)=\"onDeleteClick()\"\n      >\n        <mat-icon>delete</mat-icon>\n      </button>\n    }\n  </div>\n\n  <igo-entity-table\n    #table\n    class=\"table-compact\"\n    [store]=\"$any(store())\"\n    [template]=\"tableTemplate\"\n  />\n</div>\n", styles: [":host .measure-type-toggle{padding:10px;text-align:center}:host .measure-type-toggle mat-button-toggle-group{width:100%}:host .measure-type-toggle mat-button-toggle-group mat-button-toggle{width:50%}:host .measure-options mat-slide-toggle{width:100%;padding:10px}:host .measure-options mat-slide-toggle ::ng-deep .mdc-form-field{width:100%}:host .measure-options mat-slide-toggle ::ng-deep .mdc-label{margin-left:0;width:calc(100% - 60px)}:host .measure-store-buttons{margin-left:-2px}:host .measure-store-buttons button:first-of-type{margin-left:14px}:host .table-compact ::ng-deep .mat-mdc-header-cell.mat-column-selectionCheckbox{width:52px}:host .igo-map-tooltip{position:relative;border-radius:4px;padding:4px 8px;white-space:nowrap}::ng-deep .igo-map-tooltip-hidden,::ng-deep .igo-map-tooltip-measure-by-display{display:none}::ng-deep .igo-map-tooltip-measure{background-color:#ffcc33b3;border:1px solid rgb(255,205,51);color:#000;font-weight:700}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$4.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$4.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i1$3.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i1$2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: MeasurerItemComponent, selector: "igo-measurer-item", inputs: ["measureType", "measureUnit", "measure", "auto", "placeholder"], outputs: ["measureUnitChange"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: EntityTableComponent, selector: "igo-entity-table", inputs: ["store", "paginator", "template", "scrollBehavior", "sortNullsFirst", "withPaginator", "paginatorOptions"], outputs: ["entityClick", "entitySelectChange", "entitySortChange"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: MeasurerComponent, isStandalone: true, selector: "igo-measurer", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: true, transformFunction: null }, store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: true, transformFunction: null }, activeMeasureType: { classPropertyName: "activeMeasureType", publicName: "activeMeasureType", isSignal: false, isRequired: false, transformFunction: null }, minSegmentLength: { classPropertyName: "minSegmentLength", publicName: "minSegmentLength", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true, isSignal: true }], ngImport: i0, template: "<div>\n  <div class=\"measure-type-toggle\">\n    <mat-button-toggle-group\n      [value]=\"activeMeasureType\"\n      (change)=\"onMeasureTypeChange($event.value)\"\n    >\n      <mat-button-toggle [value]=\"measureType.Length\">\n        {{ 'igo.geo.measure.' + measureType.Length | translate }}\n      </mat-button-toggle>\n      <mat-button-toggle [value]=\"measureType.Area\">\n        {{ 'igo.geo.measure.' + measureType.Area | translate }}\n      </mat-button-toggle>\n    </mat-button-toggle-group>\n  </div>\n\n  <div class=\"measure-options\">\n    <mat-slide-toggle\n      [disabled]=\"drawControlIsDisabled\"\n      [checked]=\"drawControlIsActive\"\n      [labelPosition]=\"'before'\"\n      (change)=\"onToggleDrawControl($event.checked)\"\n    >\n      {{ 'igo.geo.measure.toggleActive' | translate }}\n    </mat-slide-toggle>\n\n    @if (hasLine$ | async) {\n      <mat-divider />\n    }\n\n    @if (hasLine$ | async) {\n      <mat-slide-toggle\n        [checked]=\"displayLines\"\n        [labelPosition]=\"'before'\"\n        (change)=\"onToggleDisplayLines($event.checked)\"\n      >\n        {{ 'igo.geo.measure.toggleDisplayLines' | translate }}\n      </mat-slide-toggle>\n    }\n\n    @if ((hasLine$ | async) || (hasArea$ | async)) {\n      <mat-divider />\n    }\n\n    @if (hasArea$ | async) {\n      <mat-slide-toggle\n        [checked]=\"displayDistance\"\n        [labelPosition]=\"'before'\"\n        (change)=\"onToggleDisplayDistance($event.checked)\"\n      >\n        {{ 'igo.geo.measure.toggleDisplayDistance' | translate }}\n      </mat-slide-toggle>\n    }\n\n    @if (hasArea$ | async) {\n      <mat-slide-toggle\n        [checked]=\"displayAreas\"\n        [labelPosition]=\"'before'\"\n        (change)=\"onToggleDisplayAreas($event.checked)\"\n      >\n        {{ 'igo.geo.measure.toggleDisplayAreas' | translate }}\n      </mat-slide-toggle>\n    }\n\n    @if (hasArea$ | async) {\n      <mat-divider />\n    }\n\n    <mat-slide-toggle\n      [checked]=\"measureUnitsAuto\"\n      [labelPosition]=\"'before'\"\n      (change)=\"onToggleMeasureUnitsAuto($event.checked)\"\n    >\n      {{ 'igo.geo.measure.toggleAutoUnits' | translate }}\n    </mat-slide-toggle>\n  </div>\n\n  @if (measure$ | async; as measure) {\n    @if (\n      activeMeasureType === measureType.Length ||\n      activeMeasureType === measureType.Area\n    ) {\n      <igo-measurer-item\n        [measureType]=\"measureType.Length\"\n        [measureUnit]=\"activeLengthUnit\"\n        [measure]=\"measure.length ?? 0\"\n        [auto]=\"measureUnitsAuto\"\n        [placeholder]=\"\n          (activeMeasureType === measureType.Area\n            ? 'igo.geo.measure.perimeter'\n            : 'igo.geo.measure.length'\n          ) | translate\n        \"\n        (measureUnitChange)=\"onLengthUnitChange($any($event))\"\n      />\n    }\n    @if (activeMeasureType === measureType.Area) {\n      <igo-measurer-item\n        [measureType]=\"measureType.Area\"\n        [measureUnit]=\"activeAreaUnit\"\n        [measure]=\"measure.area ?? 0\"\n        [auto]=\"measureUnitsAuto\"\n        [placeholder]=\"'igo.geo.measure.area' | translate\"\n        (measureUnitChange)=\"onAreaUnitChange($any($event))\"\n      />\n    }\n  }\n\n  @if ((hasLine$ | async) || (hasArea$ | async)) {\n    <mat-divider />\n  }\n\n  <div class=\"measure-store-buttons\">\n    @if ((hasLine$ | async) || (hasArea$ | async)) {\n      <button\n        mat-icon-button\n        [matTooltip]=\"'igo.geo.measure.actionbar.calculate.tooltip' | translate\"\n        [disabled]=\"(selectedFeatures$ | async)!.length === 0\"\n        color=\"accent\"\n        (click)=\"onCalculateClick()\"\n      >\n        <mat-icon>calculate</mat-icon>\n      </button>\n    }\n\n    @if ((hasLine$ | async) || (hasArea$ | async)) {\n      <button\n        mat-icon-button\n        [matTooltip]=\"'igo.geo.measure.actionbar.delete.tooltip' | translate\"\n        [disabled]=\"(selectedFeatures$ | async)!.length === 0\"\n        color=\"warn\"\n        (click)=\"onDeleteClick()\"\n      >\n        <mat-icon>delete</mat-icon>\n      </button>\n    }\n  </div>\n\n  <igo-entity-table\n    #table\n    class=\"table-compact\"\n    [store]=\"$any(store())\"\n    [template]=\"tableTemplate\"\n  />\n</div>\n", styles: [":host .measure-type-toggle{padding:10px;text-align:center}:host .measure-type-toggle mat-button-toggle-group{width:100%}:host .measure-type-toggle mat-button-toggle-group mat-button-toggle{width:50%}:host .measure-options mat-slide-toggle{width:100%;padding:10px}:host .measure-options mat-slide-toggle ::ng-deep .mdc-form-field{width:100%}:host .measure-options mat-slide-toggle ::ng-deep .mdc-label{margin-left:0;width:calc(100% - 60px)}:host .measure-store-buttons{margin-left:-2px}:host .measure-store-buttons button:first-of-type{margin-left:14px}:host .table-compact ::ng-deep .mat-mdc-header-cell.mat-column-selectionCheckbox{width:52px}:host .igo-map-tooltip{position:relative;border-radius:4px;padding:4px 8px;white-space:nowrap}::ng-deep .igo-map-tooltip-hidden,::ng-deep .igo-map-tooltip-measure-by-display{display:none}::ng-deep .igo-map-tooltip-measure{background-color:#ffcc33b3;border:1px solid rgb(255,205,51);color:#000;font-weight:700}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$3.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$3.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i2$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i1$2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: MeasurerItemComponent, selector: "igo-measurer-item", inputs: ["measureType", "measureUnit", "measure", "auto", "placeholder"], outputs: ["measureUnitChange"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: EntityTableComponent, selector: "igo-entity-table", inputs: ["store", "paginator", "template", "scrollBehavior", "sortNullsFirst", "withPaginator", "paginatorOptions"], outputs: ["entityClick", "entitySelectChange", "entitySortChange"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: MeasurerComponent, decorators: [{
             type: Component,
@@ -27807,7 +27831,7 @@ class SpatialFilterItemComponent {
         };
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SpatialFilterItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SpatialFilterItemComponent, isStandalone: true, selector: "igo-spatial-filter-item", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: true, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, queryType: { classPropertyName: "queryType", publicName: "queryType", isSignal: true, isRequired: false, transformFunction: null }, zones: { classPropertyName: "zones", publicName: "zones", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, store: { classPropertyName: "store", publicName: "store", isSignal: false, isRequired: true, transformFunction: null }, layers: { classPropertyName: "layers", publicName: "layers", isSignal: true, isRequired: false, transformFunction: null }, allLayers: { classPropertyName: "allLayers", publicName: "allLayers", isSignal: true, isRequired: false, transformFunction: null }, thematicLength: { classPropertyName: "thematicLength", publicName: "thematicLength", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { loading: "loadingChange", toggleSearch: "toggleSearch", itemTypeChange: "itemTypeChange", thematicChange: "thematicChange", drawZoneEvent: "drawZoneEvent", bufferEvent: "bufferEvent", zonesWithBufferChange: "zonesWithBufferChange", measureUnitChange: "measureUnitChange", radiusEvent: "radiusEvent", freehandControl: "freehandControl", predefinedRadius: "predefinedRadius", clearButtonEvent: "clearButtonEvent", clearSearchEvent: "clearSearchEvent", export: "export", openWorkspace: "openWorkspace", entityChange: "entityChange" }, ngImport: i0, template: "<igo-geometry-form-field-input\n  [formControl]=\"formControl\"\n  [map]=\"map()\"\n  [geometryType]=\"geometryType\"\n  [drawGuide]=\"drawGuide$ | async\"\n  [measure]=\"measure\"\n  [drawControlIsActive]=\"drawControlIsActive\"\n  [freehandDrawIsActive]=\"freehandDrawIsActive\"\n  [drawStyle]=\"$any(drawStyle$ | async)\"\n  [overlayStyle]=\"$any(overlayStyle$ | async)\"\n  [radius]=\"radius\"\n  [predefinedRadius]=\"$any(predefinedRadius)\"\n/>\n\n<div class=\"header\">\n  @if (!isPredefined()) {\n    <mat-slide-toggle\n      [checked]=\"drawControlIsActive\"\n      [labelPosition]=\"'before'\"\n      (change)=\"onDrawControlChange()\"\n    >\n      {{ 'igo.geo.spatialFilter.drawControl' | translate }}\n    </mat-slide-toggle>\n  }\n  @if (!isPredefined()) {\n    <mat-slide-toggle\n      [checked]=\"freehandDrawIsActive\"\n      [labelPosition]=\"'before'\"\n      (change)=\"onfreehandControlChange()\"\n    >\n      {{ 'igo.geo.spatialFilter.freehandControl' | translate }}\n    </mat-slide-toggle>\n  }\n</div>\n\n@if (isPolygon()) {\n  <div class=\"buffer-unit\">\n    <mat-form-field class=\"buffer\">\n      <input\n        type=\"number\"\n        matInput\n        placeholder=\"{{ 'igo.geo.spatialFilter.buffer' | translate }}\"\n        [formControl]=\"bufferFormControl\"\n        [value]=\"0\"\n        [readonly]=\"this.formControl.value === null\"\n      />\n    </mat-form-field>\n    <mat-form-field class=\"unit-field\">\n      <mat-select\n        [value]=\"measureUnit\"\n        (selectionChange)=\"onMeasureUnitChange($event.value)\"\n      >\n        @for (measureUnit of measureUnits; track measureUnit) {\n          <mat-option [value]=\"measureUnit\">\n            {{ 'igo.geo.measure.' + measureUnit | translate }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n}\n\n@if (isPoint()) {\n  <div class=\"radius-unit\">\n    <mat-form-field class=\"radius\">\n      <input\n        type=\"number\"\n        matInput\n        placeholder=\"{{ 'igo.geo.spatialFilter.radius' | translate }}\"\n        [formControl]=\"radiusFormControl\"\n        [value]=\"1000\"\n        (input)=\"getRadius()\"\n        [readonly]=\"\n          this.freehandDrawIsActive && this.formControl.value === null\n        \"\n      />\n    </mat-form-field>\n    <mat-form-field class=\"unit-field\">\n      <mat-select\n        [value]=\"measureUnit\"\n        (selectionChange)=\"onMeasureUnitChange($event.value)\"\n      >\n        @for (measureUnit of measureUnits; track measureUnit) {\n          <mat-option [value]=\"measureUnit\">\n            {{ 'igo.geo.measure.' + measureUnit | translate }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n}\n\n@if (\n  (selectedItemType === 'Thematics' && !tableTemplate) ||\n  (selectedItemType === 'Thematics' && tableTemplate && !listIsVisible)\n) {\n  <div class=\"thematics\">\n    <mat-table>\n      <!-- Name Column -->\n      <ng-container matColumnDef=\"name\">\n        <mat-header-cell *matHeaderCellDef class=\"thematics-header\">{{\n          'igo.geo.spatialFilter.Thematics' | translate\n        }}</mat-header-cell>\n      </ng-container>\n      <!-- Select Column -->\n      <ng-container matColumnDef=\"select\">\n        <mat-header-cell *matHeaderCellDef class=\"checks-header\">\n          <mat-checkbox\n            (change)=\"$event ? masterToggle() : null\"\n            [checked]=\"isAllSelected()\"\n            [indeterminate]=\"selectedThematics.hasValue() && !isAllSelected()\"\n          />\n        </mat-header-cell>\n      </ng-container>\n      <mat-header-row *matHeaderRowDef=\"displayedColumns\" />\n      <mat-row *matRowDef=\"let row; columns: displayedColumns\" />\n    </mat-table>\n    <mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\">\n      <!-- This is the tree node template for leaf nodes -->\n      <mat-tree-node *matTreeNodeDef=\"let node\" matTreeNodeToggle>\n        <li class=\"mat-tree-node\">\n          <!-- use a disabled button to provide padding for tree leaf -->\n          <!-- eslint-disable-next-line @angular-eslint/template/elements-content -->\n          <button mat-icon-button disabled></button>\n          {{ node.name }}\n          <mat-checkbox\n            class=\"tree-check\"\n            (click)=\"$event.stopPropagation()\"\n            (change)=\"$event ? onToggleChange(node) : null\"\n            [checked]=\"selectedThematics.isSelected(node)\"\n          />\n        </li>\n      </mat-tree-node>\n      <!-- This is the tree node template for expandable nodes -->\n      <mat-nested-tree-node *matTreeNodeDef=\"let node; when: hasChild\">\n        <div class=\"mat-tree-node\">\n          <button mat-icon-button (click)=\"onToggleClick(node)\">\n            <mat-icon>{{\n              treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'\n            }}</mat-icon>\n          </button>\n          {{ node.name }}\n          <mat-checkbox\n            class=\"tree-check-2\"\n            (change)=\"$event ? childrensToggle(node) : null\"\n            [checked]=\"isAllSelected(node)\"\n            [indeterminate]=\"hasChildrenSelected(node) && !isAllSelected(node)\"\n          />\n        </div>\n        <ul\n          class=\"tree-ul\"\n          [class.example-tree-invisible]=\"!treeControl.isExpanded(node)\"\n        >\n          <ng-container matTreeNodeOutlet />\n        </ul>\n      </mat-nested-tree-node>\n    </mat-tree>\n  </div>\n}\n\n<div class=\"buttons\">\n  @if (isPredefined()) {\n    <button\n      matButton=\"elevated\"\n      class=\"clear-search-button\"\n      [disabled]=\"disabledClearSearch()\"\n      (click)=\"clearSearch()\"\n    >\n      {{ 'igo.geo.spatialFilter.clearSearch' | translate }}\n    </button>\n  }\n\n  @if (isPolygon() || isPoint()) {\n    <button\n      matButton=\"elevated\"\n      class=\"clear-form-button\"\n      [disabled]=\"this.formControl.value === null\"\n      (click)=\"clearDrawZone()\"\n    >\n      {{ 'igo.geo.spatialFilter.clearForm' | translate }}\n    </button>\n  }\n\n  <button\n    matButton=\"elevated\"\n    class=\"search-button\"\n    [disabled]=\"disableSearchButton()\"\n    color=\"primary\"\n    (click)=\"toggleSearchButton()\"\n  >\n    {{ 'igo.geo.spatialFilter.goSearch' | translate }}\n  </button>\n\n  <button\n    matButton=\"elevated\"\n    class=\"remove-button\"\n    [disabled]=\"allLayers().length === 0\"\n    (click)=\"clearButton()\"\n  >\n    {{ 'igo.geo.spatialFilter.removeLayer' | translate }}\n  </button>\n\n  <button\n    matButton=\"elevated\"\n    class=\"export-button\"\n    [disabled]=\"!store.entities$.getValue().length\"\n    (click)=\"export.emit()\"\n  >\n    {{ 'igo.geo.spatialFilter.exportLayer' | translate }}\n  </button>\n</div>\n\n@if (store.all().length && tableTemplate && !listIsVisible) {\n  <button\n    class=\"expand-more\"\n    mat-icon-button\n    matTooltipShowDelay=\"500\"\n    [matTooltip]=\"'igo.geo.spatialFilter.showSearchResults' | translate\"\n    (click)=\"toggleVisibleList()\"\n  >\n    <mat-icon>expand_more</mat-icon>\n  </button>\n}\n\n@if (store.all().length && tableTemplate && listIsVisible) {\n  <div class=\"results\">\n    @if (listIsVisible) {\n      <button\n        mat-icon-button\n        matTooltipShowDelay=\"500\"\n        [matTooltip]=\"'igo.geo.spatialFilter.hideSearchResults' | translate\"\n        (click)=\"toggleVisibleList()\"\n      >\n        <mat-icon>expand_less</mat-icon>\n      </button>\n    }\n    <igo-entity-table\n      class=\"results-list\"\n      [template]=\"tableTemplate\"\n      [store]=\"$any(store)\"\n      (entitySelectChange)=\"entityChange.emit($event)\"\n    />\n  </div>\n}\n", styles: [".header{margin-top:5px;width:100%}.mat-mdc-slide-toggle{padding:5px;width:100%}.mat-mdc-slide-toggle ::ng-deep .mdc-form-field{width:100%}.mat-mdc-slide-toggle ::ng-deep .mdc-label{margin-left:0;width:calc(100% - 60px)}.title{margin-left:5px;font-size:initial}.mat-mdc-radio-group{display:flex;flex-direction:column}.mat-mdc-radio-button{display:inline-flex;position:relative;margin-left:12px}.mat-mdc-form-field{margin-top:5px}.mat-column-select{overflow:auto}.buttons{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:16px 0}.results{overflow:auto;max-height:250px}.mat-column-typeResults{max-width:100px;margin-right:5px}.buffer-unit,.radius-unit{display:flex;width:100%;padding:4px;box-sizing:border-box}.radius,.buffer{flex-flow:column nowrap;flex:2}.unit-field{flex:1;margin-left:8px}.example-tree-invisible{display:none}.tree-ul{margin:0;padding:0 0 0 20px;list-style-type:none}.tree-check,.tree-check-2{position:relative;margin-left:auto}.thematics-header{flex:1}.checks-header{flex:0 0 auto;overflow:hidden;padding-right:0}.mat-tree-node{position:relative;min-height:42px}.mat-mdc-header-cell{height:56px}.results{max-height:45%}.results igo-entity-table ::ng-deep div.table-container{overflow:unset}li{margin:0}\n"], dependencies: [{ kind: "component", type: GeometryFormFieldInputComponent, selector: "igo-geometry-form-field-input", inputs: ["map", "geometryType", "drawGuide", "measure", "drawControlIsActive", "freehandDrawIsActive", "predefinedRadius", "controlOptions", "drawStyle", "overlayStyle", "value", "radius"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i1$3.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatRadioModule }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i6$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i6$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i6$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i6$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i6$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i6$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "component", type: i6$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i6$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i2$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatTreeModule }, { kind: "directive", type: i8.MatNestedTreeNode, selector: "mat-nested-tree-node", inputs: ["matNestedTreeNode", "disabled", "tabIndex"], outputs: ["activation", "expandedChange"], exportAs: ["matNestedTreeNode"] }, { kind: "directive", type: i8.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i8.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i8.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i8.MatTreeNode, selector: "mat-tree-node", inputs: ["tabIndex", "disabled"], outputs: ["activation", "expandedChange"], exportAs: ["matTreeNode"] }, { kind: "directive", type: i8.MatTreeNodeOutlet, selector: "[matTreeNodeOutlet]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: EntityTableComponent, selector: "igo-entity-table", inputs: ["store", "paginator", "template", "scrollBehavior", "sortNullsFirst", "withPaginator", "paginatorOptions"], outputs: ["entityClick", "entitySelectChange", "entitySortChange"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SpatialFilterItemComponent, isStandalone: true, selector: "igo-spatial-filter-item", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: true, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, queryType: { classPropertyName: "queryType", publicName: "queryType", isSignal: true, isRequired: false, transformFunction: null }, zones: { classPropertyName: "zones", publicName: "zones", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, store: { classPropertyName: "store", publicName: "store", isSignal: false, isRequired: true, transformFunction: null }, layers: { classPropertyName: "layers", publicName: "layers", isSignal: true, isRequired: false, transformFunction: null }, allLayers: { classPropertyName: "allLayers", publicName: "allLayers", isSignal: true, isRequired: false, transformFunction: null }, thematicLength: { classPropertyName: "thematicLength", publicName: "thematicLength", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { loading: "loadingChange", toggleSearch: "toggleSearch", itemTypeChange: "itemTypeChange", thematicChange: "thematicChange", drawZoneEvent: "drawZoneEvent", bufferEvent: "bufferEvent", zonesWithBufferChange: "zonesWithBufferChange", measureUnitChange: "measureUnitChange", radiusEvent: "radiusEvent", freehandControl: "freehandControl", predefinedRadius: "predefinedRadius", clearButtonEvent: "clearButtonEvent", clearSearchEvent: "clearSearchEvent", export: "export", openWorkspace: "openWorkspace", entityChange: "entityChange" }, ngImport: i0, template: "<igo-geometry-form-field-input\n  [formControl]=\"formControl\"\n  [map]=\"map()\"\n  [geometryType]=\"geometryType\"\n  [drawGuide]=\"drawGuide$ | async\"\n  [measure]=\"measure\"\n  [drawControlIsActive]=\"drawControlIsActive\"\n  [freehandDrawIsActive]=\"freehandDrawIsActive\"\n  [drawStyle]=\"$any(drawStyle$ | async)\"\n  [overlayStyle]=\"$any(overlayStyle$ | async)\"\n  [radius]=\"radius\"\n  [predefinedRadius]=\"$any(predefinedRadius)\"\n/>\n\n<div class=\"header\">\n  @if (!isPredefined()) {\n    <mat-slide-toggle\n      [checked]=\"drawControlIsActive\"\n      [labelPosition]=\"'before'\"\n      (change)=\"onDrawControlChange()\"\n    >\n      {{ 'igo.geo.spatialFilter.drawControl' | translate }}\n    </mat-slide-toggle>\n  }\n  @if (!isPredefined()) {\n    <mat-slide-toggle\n      [checked]=\"freehandDrawIsActive\"\n      [labelPosition]=\"'before'\"\n      (change)=\"onfreehandControlChange()\"\n    >\n      {{ 'igo.geo.spatialFilter.freehandControl' | translate }}\n    </mat-slide-toggle>\n  }\n</div>\n\n@if (isPolygon()) {\n  <div class=\"buffer-unit\">\n    <mat-form-field class=\"buffer\">\n      <input\n        type=\"number\"\n        matInput\n        placeholder=\"{{ 'igo.geo.spatialFilter.buffer' | translate }}\"\n        [formControl]=\"bufferFormControl\"\n        [value]=\"0\"\n        [readonly]=\"this.formControl.value === null\"\n      />\n    </mat-form-field>\n    <mat-form-field class=\"unit-field\">\n      <mat-select\n        [value]=\"measureUnit\"\n        (selectionChange)=\"onMeasureUnitChange($event.value)\"\n      >\n        @for (measureUnit of measureUnits; track measureUnit) {\n          <mat-option [value]=\"measureUnit\">\n            {{ 'igo.geo.measure.' + measureUnit | translate }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n}\n\n@if (isPoint()) {\n  <div class=\"radius-unit\">\n    <mat-form-field class=\"radius\">\n      <input\n        type=\"number\"\n        matInput\n        placeholder=\"{{ 'igo.geo.spatialFilter.radius' | translate }}\"\n        [formControl]=\"radiusFormControl\"\n        [value]=\"1000\"\n        (input)=\"getRadius()\"\n        [readonly]=\"\n          this.freehandDrawIsActive && this.formControl.value === null\n        \"\n      />\n    </mat-form-field>\n    <mat-form-field class=\"unit-field\">\n      <mat-select\n        [value]=\"measureUnit\"\n        (selectionChange)=\"onMeasureUnitChange($event.value)\"\n      >\n        @for (measureUnit of measureUnits; track measureUnit) {\n          <mat-option [value]=\"measureUnit\">\n            {{ 'igo.geo.measure.' + measureUnit | translate }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n}\n\n@if (\n  (selectedItemType === 'Thematics' && !tableTemplate) ||\n  (selectedItemType === 'Thematics' && tableTemplate && !listIsVisible)\n) {\n  <div class=\"thematics\">\n    <mat-table>\n      <!-- Name Column -->\n      <ng-container matColumnDef=\"name\">\n        <mat-header-cell *matHeaderCellDef class=\"thematics-header\">{{\n          'igo.geo.spatialFilter.Thematics' | translate\n        }}</mat-header-cell>\n      </ng-container>\n      <!-- Select Column -->\n      <ng-container matColumnDef=\"select\">\n        <mat-header-cell *matHeaderCellDef class=\"checks-header\">\n          <mat-checkbox\n            (change)=\"$event ? masterToggle() : null\"\n            [checked]=\"isAllSelected()\"\n            [indeterminate]=\"selectedThematics.hasValue() && !isAllSelected()\"\n          />\n        </mat-header-cell>\n      </ng-container>\n      <mat-header-row *matHeaderRowDef=\"displayedColumns\" />\n      <mat-row *matRowDef=\"let row; columns: displayedColumns\" />\n    </mat-table>\n    <mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\">\n      <!-- This is the tree node template for leaf nodes -->\n      <mat-tree-node *matTreeNodeDef=\"let node\" matTreeNodeToggle>\n        <li class=\"mat-tree-node\">\n          <!-- use a disabled button to provide padding for tree leaf -->\n          <!-- eslint-disable-next-line @angular-eslint/template/elements-content -->\n          <button mat-icon-button disabled></button>\n          {{ node.name }}\n          <mat-checkbox\n            class=\"tree-check\"\n            (click)=\"$event.stopPropagation()\"\n            (change)=\"$event ? onToggleChange(node) : null\"\n            [checked]=\"selectedThematics.isSelected(node)\"\n          />\n        </li>\n      </mat-tree-node>\n      <!-- This is the tree node template for expandable nodes -->\n      <mat-nested-tree-node *matTreeNodeDef=\"let node; when: hasChild\">\n        <div class=\"mat-tree-node\">\n          <button mat-icon-button (click)=\"onToggleClick(node)\">\n            <mat-icon>{{\n              treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'\n            }}</mat-icon>\n          </button>\n          {{ node.name }}\n          <mat-checkbox\n            class=\"tree-check-2\"\n            (change)=\"$event ? childrensToggle(node) : null\"\n            [checked]=\"isAllSelected(node)\"\n            [indeterminate]=\"hasChildrenSelected(node) && !isAllSelected(node)\"\n          />\n        </div>\n        <ul\n          class=\"tree-ul\"\n          [class.example-tree-invisible]=\"!treeControl.isExpanded(node)\"\n        >\n          <ng-container matTreeNodeOutlet />\n        </ul>\n      </mat-nested-tree-node>\n    </mat-tree>\n  </div>\n}\n\n<div class=\"buttons\">\n  @if (isPredefined()) {\n    <button\n      matButton=\"elevated\"\n      class=\"clear-search-button\"\n      [disabled]=\"disabledClearSearch()\"\n      (click)=\"clearSearch()\"\n    >\n      {{ 'igo.geo.spatialFilter.clearSearch' | translate }}\n    </button>\n  }\n\n  @if (isPolygon() || isPoint()) {\n    <button\n      matButton=\"elevated\"\n      class=\"clear-form-button\"\n      [disabled]=\"this.formControl.value === null\"\n      (click)=\"clearDrawZone()\"\n    >\n      {{ 'igo.geo.spatialFilter.clearForm' | translate }}\n    </button>\n  }\n\n  <button\n    matButton=\"elevated\"\n    class=\"search-button\"\n    [disabled]=\"disableSearchButton()\"\n    color=\"primary\"\n    (click)=\"toggleSearchButton()\"\n  >\n    {{ 'igo.geo.spatialFilter.goSearch' | translate }}\n  </button>\n\n  <button\n    matButton=\"elevated\"\n    class=\"remove-button\"\n    [disabled]=\"allLayers().length === 0\"\n    (click)=\"clearButton()\"\n  >\n    {{ 'igo.geo.spatialFilter.removeLayer' | translate }}\n  </button>\n\n  <button\n    matButton=\"elevated\"\n    class=\"export-button\"\n    [disabled]=\"!store.entities$.getValue().length\"\n    (click)=\"export.emit()\"\n  >\n    {{ 'igo.geo.spatialFilter.exportLayer' | translate }}\n  </button>\n</div>\n\n@if (store.all().length && tableTemplate && !listIsVisible) {\n  <button\n    class=\"expand-more\"\n    mat-icon-button\n    matTooltipShowDelay=\"500\"\n    [matTooltip]=\"'igo.geo.spatialFilter.showSearchResults' | translate\"\n    (click)=\"toggleVisibleList()\"\n  >\n    <mat-icon>expand_more</mat-icon>\n  </button>\n}\n\n@if (store.all().length && tableTemplate && listIsVisible) {\n  <div class=\"results\">\n    @if (listIsVisible) {\n      <button\n        mat-icon-button\n        matTooltipShowDelay=\"500\"\n        [matTooltip]=\"'igo.geo.spatialFilter.hideSearchResults' | translate\"\n        (click)=\"toggleVisibleList()\"\n      >\n        <mat-icon>expand_less</mat-icon>\n      </button>\n    }\n    <igo-entity-table\n      class=\"results-list\"\n      [template]=\"tableTemplate\"\n      [store]=\"$any(store)\"\n      (entitySelectChange)=\"entityChange.emit($event)\"\n    />\n  </div>\n}\n", styles: [".header{margin-top:5px;width:100%}.mat-mdc-slide-toggle{padding:5px;width:100%}.mat-mdc-slide-toggle ::ng-deep .mdc-form-field{width:100%}.mat-mdc-slide-toggle ::ng-deep .mdc-label{margin-left:0;width:calc(100% - 60px)}.title{margin-left:5px;font-size:initial}.mat-mdc-radio-group{display:flex;flex-direction:column}.mat-mdc-radio-button{display:inline-flex;position:relative;margin-left:12px}.mat-mdc-form-field{margin-top:5px}.mat-column-select{overflow:auto}.buttons{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:16px 0}.results{overflow:auto;max-height:250px}.mat-column-typeResults{max-width:100px;margin-right:5px}.buffer-unit,.radius-unit{display:flex;width:100%;padding:4px;box-sizing:border-box}.radius,.buffer{flex-flow:column nowrap;flex:2}.unit-field{flex:1;margin-left:8px}.example-tree-invisible{display:none}.tree-ul{margin:0;padding:0 0 0 20px;list-style-type:none}.tree-check,.tree-check-2{position:relative;margin-left:auto}.thematics-header{flex:1}.checks-header{flex:0 0 auto;overflow:hidden;padding-right:0}.mat-tree-node{position:relative;min-height:42px}.mat-mdc-header-cell{height:56px}.results{max-height:45%}.results igo-entity-table ::ng-deep div.table-container{overflow:unset}li{margin:0}\n"], dependencies: [{ kind: "component", type: GeometryFormFieldInputComponent, selector: "igo-geometry-form-field-input", inputs: ["map", "geometryType", "drawGuide", "measure", "drawControlIsActive", "freehandDrawIsActive", "predefinedRadius", "controlOptions", "drawStyle", "overlayStyle", "value", "radius"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i2$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatRadioModule }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i6$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i6$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i6$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i6$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i6$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i6$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "component", type: i6$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i6$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i2$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatTreeModule }, { kind: "directive", type: i8.MatNestedTreeNode, selector: "mat-nested-tree-node", inputs: ["matNestedTreeNode", "disabled", "tabIndex"], outputs: ["activation", "expandedChange"], exportAs: ["matNestedTreeNode"] }, { kind: "directive", type: i8.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i8.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i8.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i8.MatTreeNode, selector: "mat-tree-node", inputs: ["tabIndex", "disabled"], outputs: ["activation", "expandedChange"], exportAs: ["matTreeNode"] }, { kind: "directive", type: i8.MatTreeNodeOutlet, selector: "[matTreeNodeOutlet]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: EntityTableComponent, selector: "igo-entity-table", inputs: ["store", "paginator", "template", "scrollBehavior", "sortNullsFirst", "withPaginator", "paginatorOptions"], outputs: ["entityClick", "entitySelectChange", "entitySortChange"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SpatialFilterItemComponent, decorators: [{
             type: Component,
@@ -28147,7 +28171,7 @@ class SpatialFilterTypeComponent {
         this.addZone.emit(undefined);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SpatialFilterTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SpatialFilterTypeComponent, isStandalone: true, selector: "igo-spatial-filter-type", inputs: { store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: false, transformFunction: null }, selectedQueryType: { classPropertyName: "selectedQueryType", publicName: "selectedQueryType", isSignal: true, isRequired: false, transformFunction: null }, zones: { classPropertyName: "zones", publicName: "zones", isSignal: true, isRequired: false, transformFunction: null }, layers: { classPropertyName: "layers", publicName: "layers", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedQueryType: "selectedQueryTypeChange", eventType: "eventType", eventQueryType: "eventQueryType", bufferChange: "bufferChange", measureUnitChange: "measureUnitChange", addZone: "addZone", removeZone: "removeZone", zonesWithBufferChange: "zonesWithBufferChange" }, ngImport: i0, template: "<mat-tab-group\n  [selectedIndex]=\"selectedTypeIndex.value\"\n  (selectedIndexChange)=\"selectedTypeIndex.setValue($event)\"\n  (selectedTabChange)=\"onTypeChange()\"\n>\n  <mat-tab\n    [label]=\"'igo.geo.spatialFilter.predefined' | translate\"\n    id=\"spatial-filter-predefined-tab\"\n  >\n    <mat-form-field id=\"spatial-filter-field-type\">\n      <mat-label>{{\n        'igo.geo.spatialFilter.searchLabel' | translate\n      }}</mat-label>\n      <mat-select\n        (selectionChange)=\"onSelectionChange()\"\n        [(value)]=\"selectedQueryType\"\n      >\n        @for (queryType of queryType; track queryType) {\n          <mat-option [value]=\"queryType\">\n            {{ 'igo.geo.terrapi.' + queryType | translate }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n    <igo-spatial-filter-list\n      [store]=\"store()!\"\n      [queryType]=\"selectedQueryType()!\"\n      (addZone)=\"addZone.emit($event)\"\n      (removeZone)=\"removeZone.emit($event)\"\n      (zonesWithBufferChange)=\"zonesWithBufferChange.emit($event)\"\n      (bufferChange)=\"bufferChange.emit($event)\"\n      (measureUnitChange)=\"measureUnitChange.emit($event)\"\n    />\n  </mat-tab>\n\n  <mat-tab\n    [label]=\"'igo.geo.spatialFilter.draw' | translate\"\n    id=\"spatial-filter-draw-tab\"\n  >\n    <div class=\"spatial-type-toggle\">\n      <mat-button-toggle-group\n        [value]=\"activeDrawType\"\n        (change)=\"onDrawTypeChange($event.value)\"\n      >\n        <mat-button-toggle\n          [value]=\"spatialType.Polygon\"\n          [matTooltip]=\"'igo.geo.spatialFilter.drawPolygon' | translate\"\n        >\n          <mat-icon>pentagon</mat-icon>\n        </mat-button-toggle>\n        <mat-button-toggle\n          [value]=\"spatialType.Point\"\n          [matTooltip]=\"'igo.geo.spatialFilter.drawCircle' | translate\"\n        >\n          <mat-icon>circle</mat-icon>\n        </mat-button-toggle>\n      </mat-button-toggle-group>\n    </div>\n  </mat-tab>\n</mat-tab-group>\n", styles: [":host .mat-mdc-form-field{width:100%}:host .mat-mdc-tab-group ::ng-deep .mat-mdc-tab-body-content{overflow:hidden}:host .mat-mdc-tab-group ::ng-deep .mat-mdc-tab-label{padding:12px}:host .mat-mdc-tab-group ::ng-deep .mat-mdc-tab-body-wrapper{margin-top:4px}:host .spatial-type-toggle{padding:12px;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i1$5.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i1$5.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "component", type: SpatialFilterListComponent, selector: "igo-spatial-filter-list", inputs: ["store", "queryType"], outputs: ["bufferChange", "measureUnitChange", "addZone", "removeZone", "zonesWithBufferChange"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$4.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$4.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SpatialFilterTypeComponent, isStandalone: true, selector: "igo-spatial-filter-type", inputs: { store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: false, transformFunction: null }, selectedQueryType: { classPropertyName: "selectedQueryType", publicName: "selectedQueryType", isSignal: true, isRequired: false, transformFunction: null }, zones: { classPropertyName: "zones", publicName: "zones", isSignal: true, isRequired: false, transformFunction: null }, layers: { classPropertyName: "layers", publicName: "layers", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedQueryType: "selectedQueryTypeChange", eventType: "eventType", eventQueryType: "eventQueryType", bufferChange: "bufferChange", measureUnitChange: "measureUnitChange", addZone: "addZone", removeZone: "removeZone", zonesWithBufferChange: "zonesWithBufferChange" }, ngImport: i0, template: "<mat-tab-group\n  [selectedIndex]=\"selectedTypeIndex.value\"\n  (selectedIndexChange)=\"selectedTypeIndex.setValue($event)\"\n  (selectedTabChange)=\"onTypeChange()\"\n>\n  <mat-tab\n    [label]=\"'igo.geo.spatialFilter.predefined' | translate\"\n    id=\"spatial-filter-predefined-tab\"\n  >\n    <mat-form-field id=\"spatial-filter-field-type\">\n      <mat-label>{{\n        'igo.geo.spatialFilter.searchLabel' | translate\n      }}</mat-label>\n      <mat-select\n        (selectionChange)=\"onSelectionChange()\"\n        [(value)]=\"selectedQueryType\"\n      >\n        @for (queryType of queryType; track queryType) {\n          <mat-option [value]=\"queryType\">\n            {{ 'igo.geo.terrapi.' + queryType | translate }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n    <igo-spatial-filter-list\n      [store]=\"store()!\"\n      [queryType]=\"selectedQueryType()!\"\n      (addZone)=\"addZone.emit($event)\"\n      (removeZone)=\"removeZone.emit($event)\"\n      (zonesWithBufferChange)=\"zonesWithBufferChange.emit($event)\"\n      (bufferChange)=\"bufferChange.emit($event)\"\n      (measureUnitChange)=\"measureUnitChange.emit($event)\"\n    />\n  </mat-tab>\n\n  <mat-tab\n    [label]=\"'igo.geo.spatialFilter.draw' | translate\"\n    id=\"spatial-filter-draw-tab\"\n  >\n    <div class=\"spatial-type-toggle\">\n      <mat-button-toggle-group\n        [value]=\"activeDrawType\"\n        (change)=\"onDrawTypeChange($event.value)\"\n      >\n        <mat-button-toggle\n          [value]=\"spatialType.Polygon\"\n          [matTooltip]=\"'igo.geo.spatialFilter.drawPolygon' | translate\"\n        >\n          <mat-icon>pentagon</mat-icon>\n        </mat-button-toggle>\n        <mat-button-toggle\n          [value]=\"spatialType.Point\"\n          [matTooltip]=\"'igo.geo.spatialFilter.drawCircle' | translate\"\n        >\n          <mat-icon>circle</mat-icon>\n        </mat-button-toggle>\n      </mat-button-toggle-group>\n    </div>\n  </mat-tab>\n</mat-tab-group>\n", styles: [":host .mat-mdc-form-field{width:100%}:host .mat-mdc-tab-group ::ng-deep .mat-mdc-tab-body-content{overflow:hidden}:host .mat-mdc-tab-group ::ng-deep .mat-mdc-tab-label{padding:12px}:host .mat-mdc-tab-group ::ng-deep .mat-mdc-tab-body-wrapper{margin-top:4px}:host .spatial-type-toggle{padding:12px;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i1$4.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i1$4.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "component", type: SpatialFilterListComponent, selector: "igo-spatial-filter-list", inputs: ["store", "queryType"], outputs: ["bufferChange", "measureUnitChange", "addZone", "removeZone", "zonesWithBufferChange"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$3.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$3.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SpatialFilterTypeComponent, decorators: [{
             type: Component,
@@ -28698,7 +28722,7 @@ class TimeFilterFormComponent {
         return moment.duration(step).asMilliseconds();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TimeFilterFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TimeFilterFormComponent, isStandalone: true, selector: "igo-time-filter-form", inputs: { layer: { classPropertyName: "layer", publicName: "layer", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, currentValue: { classPropertyName: "currentValue", publicName: "currentValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dateChange: "dateChange", yearChange: "yearChange" }, viewQueries: [{ propertyName: "mySlider", first: true, predicate: MatSlider, descendants: true, isSignal: true }], ngImport: i0, template: "@if (style === 'calendar' && type !== 'year') {\n  <div>\n    @if (!isRange) {\n      <div class=\"igo-col igo-col-100 igo-col-100-m\">\n        <mat-form-field>\n          <mat-datetimepicker-toggle\n            class=\"time-filter-mat-datetimepicker-toggle\"\n            [for]=\"datetimePicker\"\n            matSuffix\n          />\n          <mat-datetimepicker\n            #datetimePicker\n            [type]=\"type\"\n            [openOnFocus]=\"true\"\n            [timeInterval]=\"5\"\n          />\n          <input\n            matInput\n            autocomplete=\"false\"\n            placeholder=\"{{ 'igo.geo.timeFilter.date' | translate }}\"\n            [matDatetimepicker]=\"datetimePicker\"\n            [(ngModel)]=\"date\"\n            [min]=\"min\"\n            [max]=\"max\"\n            readonly=\"readonly\"\n            (dateChange)=\"handleDateChange()\"\n          />\n        </mat-form-field>\n      </div>\n    }\n    @if (isRange) {\n      <div>\n        <div class=\"igo-col igo-col-100\">\n          <mat-form-field>\n            <mat-datetimepicker-toggle\n              class=\"time-filter-mat-datetimepicker-toggle\"\n              [for]=\"minDatetimePicker\"\n              matSuffix\n            />\n            <mat-datetimepicker\n              #minDatetimePicker\n              [type]=\"type\"\n              [openOnFocus]=\"true\"\n              [timeInterval]=\"5\"\n            />\n            <input\n              matInput\n              autocomplete=\"false\"\n              placeholder=\"{{ 'igo.geo.timeFilter.startDate' | translate }}\"\n              [matDatetimepicker]=\"minDatetimePicker\"\n              [(ngModel)]=\"startDate\"\n              [min]=\"min\"\n              [max]=\"getRangeMaxDate()\"\n              readonly=\"readonly\"\n              (input)=\"(startDate)\"\n              (dateChange)=\"handleDateChange()\"\n            />\n          </mat-form-field>\n        </div>\n        <div class=\"igo-col igo-col-100\">\n          <mat-form-field>\n            <mat-datetimepicker-toggle\n              class=\"time-filter-mat-datetimepicker-toggle\"\n              [for]=\"maxDatetimePicker\"\n              matSuffix\n            />\n            <mat-datetimepicker\n              #maxDatetimePicker\n              [type]=\"type\"\n              [openOnFocus]=\"true\"\n              [timeInterval]=\"5\"\n            />\n            <input\n              matInput\n              autocomplete=\"false\"\n              placeholder=\"{{ 'igo.geo.timeFilter.endDate' | translate }}\"\n              [matDatetimepicker]=\"maxDatetimePicker\"\n              [(ngModel)]=\"endDate\"\n              [min]=\"getRangeMinDate()\"\n              [max]=\"max\"\n              readonly=\"readonly\"\n              (dateChange)=\"handleDateChange()\"\n            />\n          </mat-form-field>\n        </div>\n      </div>\n    }\n  </div>\n}\n\n@if (style === 'calendar' && type === 'year') {\n  <div>\n    @if (!isRange) {\n      <div class=\"igo-col igo-col-100 igo-col-100-m\">\n        <mat-form-field>\n          <mat-select\n            placeholder=\"{{ 'igo.geo.timeFilter.date' | translate }}\"\n            [(ngModel)]=\"year\"\n            (selectionChange)=\"handleYearChange()\"\n          >\n            @for (year of listYears; track year) {\n              <mat-option [value]=\"year\">{{ year }}</mat-option>\n            }\n          </mat-select>\n        </mat-form-field>\n      </div>\n    }\n    @if (isRange) {\n      <div>\n        <div class=\"igo-col igo-col-100\">\n          <mat-form-field>\n            <mat-select\n              placeholder=\"{{ 'igo.geo.timeFilter.startDate' | translate }}\"\n              [(ngModel)]=\"startYear\"\n              (selectionChange)=\"handleYearChange()\"\n            >\n              @for (startYear of startListYears; track startYear) {\n                <mat-option [value]=\"startYear\">{{ startYear }}</mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n        </div>\n        <div class=\"igo-col igo-col-100\">\n          <mat-form-field>\n            <mat-select\n              placeholder=\"{{ 'igo.geo.timeFilter.endDate' | translate }}\"\n              [(ngModel)]=\"endYear\"\n              (selectionChange)=\"handleYearChange()\"\n            >\n              @for (endYear of endListYears; track endYear) {\n                <mat-option [value]=\"endYear\">{{ endYear }}</mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n        </div>\n      </div>\n    }\n  </div>\n}\n\n<br />\n@if (!isRange && style === 'slider' && type === 'year') {\n  <div class=\"igo-col igo-col-100 igo-col-100-m\">\n    <span>{{ startYear }}</span>\n    <!-- TODO: The 'tickInterval' property no longer exists -->\n    <mat-slider\n      id=\"time-slider\"\n      step=\"{{ step }}\"\n      [min]=\"startYear\"\n      [max]=\"endYear\"\n      [color]=\"color\"\n      thumbLabel\n      [disabled]=\"!enabled() || !layer()?.visible\"\n      #ngSlider\n      ><input\n        matSliderThumb\n        [value]=\"handleSliderValue()\"\n        (input)=\"\n          handleSliderYearChange({\n            source: ngSliderThumb,\n            parent: ngSlider,\n            value: ngSliderThumb.value\n          })\n        \"\n        #ngSliderThumb=\"matSliderThumb\"\n        (change)=\"\n          handleSliderYearChange({\n            source: ngSliderThumb,\n            parent: ngSlider,\n            value: ngSliderThumb.value\n          })\n        \"\n      />\n    </mat-slider>\n    <span>{{ endYear }}</span>\n    @if (enabled()) {\n      <p class=\"date-below\">{{ year }}</p>\n    }\n    <ng-container *ngTemplateOutlet=\"layerActions\" />\n  </div>\n}\n\n@if (style === 'slider' && type !== 'year') {\n  <div class=\"igo-col igo-col-100 igo-col-100-m\">\n    <!-- TODO: The 'tickInterval' property no longer exists -->\n    <mat-slider\n      id=\"time-slider\"\n      [step]=\"step\"\n      [min]=\"dateToNumber(min!)\"\n      [max]=\"dateToNumber(max!)\"\n      thumbLabel\n      [disabled]=\"!options()?.enabled || !layer()?.visible\"\n      (selectionChange)=\"handleSliderDateChange($event)\"\n      #ngSlider\n      ><input\n        matSliderThumb\n        [value]=\"handleSliderValue()\"\n        (input)=\"\n          handleSliderDateChange({\n            source: ngSliderThumb,\n            parent: ngSlider,\n            value: ngSliderThumb.value\n          })\n        \"\n        #ngSliderThumb=\"matSliderThumb\"\n      />\n    </mat-slider>\n    <p class=\"date-below\">{{ handleSliderTooltip() }}</p>\n    <ng-container *ngTemplateOutlet=\"layerActions\" />\n  </div>\n}\n\n<!-- Reusable Actions Template -->\n<ng-template #layerActions>\n  <div class=\"igo-layer-actions-container\">\n    <mat-slide-toggle\n      (change)=\"toggleFilterState()\"\n      tooltip-position=\"below\"\n      matTooltipShowDelay=\"500\"\n      [matTooltip]=\"'igo.geo.filter.toggleFilterState' | translate\"\n      [color]=\"color\"\n      [checked]=\"enabled()\"\n      [disabled]=\"!layer()?.visible\"\n    />\n    <button\n      [disabled]=\"!enabled() || !layer()?.visible\"\n      mat-icon-button\n      color=\"primary\"\n      (click)=\"play()\"\n    >\n      <mat-icon>{{ playIcon }}</mat-icon>\n    </button>\n    <button\n      [disabled]=\"!enabled() || !layer()?.visible\"\n      mat-icon-button\n      color=\"primary\"\n      (click)=\"resetFilter()\"\n      matTooltipShowDelay=\"500\"\n      [matTooltip]=\"'igo.geo.filter.resetFilters' | translate\"\n    >\n      <mat-icon>{{ resetIcon }}</mat-icon>\n    </button>\n  </div>\n</ng-template>\n", styles: [":host .igo-layer-filters-container{padding-left:5px}:host #time-slider{width:70%}@media only screen and (orientation:portrait)and (max-width:599px),only screen and (orientation:landscape)and (max-width:959px){:host #time-slider{width:60%}}:host .date-below{margin:0}:host .igo-layer-actions-container{display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatDatetimepickerModule }, { kind: "component", type: i2$2.MatDatetimepickerComponent, selector: "mat-datetimepicker", inputs: ["multiYearSelector", "twelvehour", "startView", "mode", "timeInterval", "ariaNextMonthLabel", "ariaPrevMonthLabel", "ariaNextYearLabel", "ariaPrevYearLabel", "preventSameDateTimeSelection", "panelClass", "startAt", "openOnFocus", "type", "touchUi", "disabled"], outputs: ["selectedChanged", "opened", "closed", "viewChanged"], exportAs: ["matDatetimepicker"] }, { kind: "component", type: i2$2.MatDatetimepickerToggleComponent, selector: "mat-datetimepicker-toggle", inputs: ["for", "disabled"], exportAs: ["matDatetimepickerToggle"] }, { kind: "directive", type: i2$2.MatDatetimepickerInputDirective, selector: "input[matDatetimepicker]", inputs: ["matDatetimepicker", "matDatepickerFilter", "value", "min", "max", "disabled"], outputs: ["dateChange", "dateInput"], exportAs: ["matDatepickerInput"] }, { kind: "ngmodule", type: MatNativeDatetimeModule }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatSliderModule }, { kind: "component", type: i6.MatSlider, selector: "mat-slider", inputs: ["disabled", "discrete", "showTickMarks", "min", "color", "disableRipple", "max", "step", "displayWith"], exportAs: ["matSlider"] }, { kind: "directive", type: i6.MatSliderThumb, selector: "input[matSliderThumb]", inputs: ["value"], outputs: ["valueChange", "dragStart", "dragEnd"], exportAs: ["matSliderThumb"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i1$3.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TimeFilterFormComponent, isStandalone: true, selector: "igo-time-filter-form", inputs: { layer: { classPropertyName: "layer", publicName: "layer", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, currentValue: { classPropertyName: "currentValue", publicName: "currentValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dateChange: "dateChange", yearChange: "yearChange" }, viewQueries: [{ propertyName: "mySlider", first: true, predicate: MatSlider, descendants: true, isSignal: true }], ngImport: i0, template: "@if (style === 'calendar' && type !== 'year') {\n  <div>\n    @if (!isRange) {\n      <div class=\"igo-col igo-col-100 igo-col-100-m\">\n        <mat-form-field>\n          <mat-datetimepicker-toggle\n            class=\"time-filter-mat-datetimepicker-toggle\"\n            [for]=\"datetimePicker\"\n            matSuffix\n          />\n          <mat-datetimepicker\n            #datetimePicker\n            [type]=\"type\"\n            [openOnFocus]=\"true\"\n            [timeInterval]=\"5\"\n          />\n          <input\n            matInput\n            autocomplete=\"false\"\n            placeholder=\"{{ 'igo.geo.timeFilter.date' | translate }}\"\n            [matDatetimepicker]=\"datetimePicker\"\n            [(ngModel)]=\"date\"\n            [min]=\"min\"\n            [max]=\"max\"\n            readonly=\"readonly\"\n            (dateChange)=\"handleDateChange()\"\n          />\n        </mat-form-field>\n      </div>\n    }\n    @if (isRange) {\n      <div>\n        <div class=\"igo-col igo-col-100\">\n          <mat-form-field>\n            <mat-datetimepicker-toggle\n              class=\"time-filter-mat-datetimepicker-toggle\"\n              [for]=\"minDatetimePicker\"\n              matSuffix\n            />\n            <mat-datetimepicker\n              #minDatetimePicker\n              [type]=\"type\"\n              [openOnFocus]=\"true\"\n              [timeInterval]=\"5\"\n            />\n            <input\n              matInput\n              autocomplete=\"false\"\n              placeholder=\"{{ 'igo.geo.timeFilter.startDate' | translate }}\"\n              [matDatetimepicker]=\"minDatetimePicker\"\n              [(ngModel)]=\"startDate\"\n              [min]=\"min\"\n              [max]=\"getRangeMaxDate()\"\n              readonly=\"readonly\"\n              (input)=\"(startDate)\"\n              (dateChange)=\"handleDateChange()\"\n            />\n          </mat-form-field>\n        </div>\n        <div class=\"igo-col igo-col-100\">\n          <mat-form-field>\n            <mat-datetimepicker-toggle\n              class=\"time-filter-mat-datetimepicker-toggle\"\n              [for]=\"maxDatetimePicker\"\n              matSuffix\n            />\n            <mat-datetimepicker\n              #maxDatetimePicker\n              [type]=\"type\"\n              [openOnFocus]=\"true\"\n              [timeInterval]=\"5\"\n            />\n            <input\n              matInput\n              autocomplete=\"false\"\n              placeholder=\"{{ 'igo.geo.timeFilter.endDate' | translate }}\"\n              [matDatetimepicker]=\"maxDatetimePicker\"\n              [(ngModel)]=\"endDate\"\n              [min]=\"getRangeMinDate()\"\n              [max]=\"max\"\n              readonly=\"readonly\"\n              (dateChange)=\"handleDateChange()\"\n            />\n          </mat-form-field>\n        </div>\n      </div>\n    }\n  </div>\n}\n\n@if (style === 'calendar' && type === 'year') {\n  <div>\n    @if (!isRange) {\n      <div class=\"igo-col igo-col-100 igo-col-100-m\">\n        <mat-form-field>\n          <mat-select\n            placeholder=\"{{ 'igo.geo.timeFilter.date' | translate }}\"\n            [(ngModel)]=\"year\"\n            (selectionChange)=\"handleYearChange()\"\n          >\n            @for (year of listYears; track year) {\n              <mat-option [value]=\"year\">{{ year }}</mat-option>\n            }\n          </mat-select>\n        </mat-form-field>\n      </div>\n    }\n    @if (isRange) {\n      <div>\n        <div class=\"igo-col igo-col-100\">\n          <mat-form-field>\n            <mat-select\n              placeholder=\"{{ 'igo.geo.timeFilter.startDate' | translate }}\"\n              [(ngModel)]=\"startYear\"\n              (selectionChange)=\"handleYearChange()\"\n            >\n              @for (startYear of startListYears; track startYear) {\n                <mat-option [value]=\"startYear\">{{ startYear }}</mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n        </div>\n        <div class=\"igo-col igo-col-100\">\n          <mat-form-field>\n            <mat-select\n              placeholder=\"{{ 'igo.geo.timeFilter.endDate' | translate }}\"\n              [(ngModel)]=\"endYear\"\n              (selectionChange)=\"handleYearChange()\"\n            >\n              @for (endYear of endListYears; track endYear) {\n                <mat-option [value]=\"endYear\">{{ endYear }}</mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n        </div>\n      </div>\n    }\n  </div>\n}\n\n<br />\n@if (!isRange && style === 'slider' && type === 'year') {\n  <div class=\"igo-col igo-col-100 igo-col-100-m\">\n    <span>{{ startYear }}</span>\n    <!-- TODO: The 'tickInterval' property no longer exists -->\n    <mat-slider\n      id=\"time-slider\"\n      step=\"{{ step }}\"\n      [min]=\"startYear\"\n      [max]=\"endYear\"\n      [color]=\"color\"\n      thumbLabel\n      [disabled]=\"!enabled() || !layer()?.visible\"\n      #ngSlider\n      ><input\n        matSliderThumb\n        [value]=\"handleSliderValue()\"\n        (input)=\"\n          handleSliderYearChange({\n            source: ngSliderThumb,\n            parent: ngSlider,\n            value: ngSliderThumb.value\n          })\n        \"\n        #ngSliderThumb=\"matSliderThumb\"\n        (change)=\"\n          handleSliderYearChange({\n            source: ngSliderThumb,\n            parent: ngSlider,\n            value: ngSliderThumb.value\n          })\n        \"\n      />\n    </mat-slider>\n    <span>{{ endYear }}</span>\n    @if (enabled()) {\n      <p class=\"date-below\">{{ year }}</p>\n    }\n    <ng-container *ngTemplateOutlet=\"layerActions\" />\n  </div>\n}\n\n@if (style === 'slider' && type !== 'year') {\n  <div class=\"igo-col igo-col-100 igo-col-100-m\">\n    <!-- TODO: The 'tickInterval' property no longer exists -->\n    <mat-slider\n      id=\"time-slider\"\n      [step]=\"step\"\n      [min]=\"dateToNumber(min!)\"\n      [max]=\"dateToNumber(max!)\"\n      thumbLabel\n      [disabled]=\"!options()?.enabled || !layer()?.visible\"\n      (selectionChange)=\"handleSliderDateChange($event)\"\n      #ngSlider\n      ><input\n        matSliderThumb\n        [value]=\"handleSliderValue()\"\n        (input)=\"\n          handleSliderDateChange({\n            source: ngSliderThumb,\n            parent: ngSlider,\n            value: ngSliderThumb.value\n          })\n        \"\n        #ngSliderThumb=\"matSliderThumb\"\n      />\n    </mat-slider>\n    <p class=\"date-below\">{{ handleSliderTooltip() }}</p>\n    <ng-container *ngTemplateOutlet=\"layerActions\" />\n  </div>\n}\n\n<!-- Reusable Actions Template -->\n<ng-template #layerActions>\n  <div class=\"igo-layer-actions-container\">\n    <mat-slide-toggle\n      (change)=\"toggleFilterState()\"\n      tooltip-position=\"below\"\n      matTooltipShowDelay=\"500\"\n      [matTooltip]=\"'igo.geo.filter.toggleFilterState' | translate\"\n      [color]=\"color\"\n      [checked]=\"enabled()\"\n      [disabled]=\"!layer()?.visible\"\n    />\n    <button\n      [disabled]=\"!enabled() || !layer()?.visible\"\n      mat-icon-button\n      color=\"primary\"\n      (click)=\"play()\"\n    >\n      <mat-icon>{{ playIcon }}</mat-icon>\n    </button>\n    <button\n      [disabled]=\"!enabled() || !layer()?.visible\"\n      mat-icon-button\n      color=\"primary\"\n      (click)=\"resetFilter()\"\n      matTooltipShowDelay=\"500\"\n      [matTooltip]=\"'igo.geo.filter.resetFilters' | translate\"\n    >\n      <mat-icon>{{ resetIcon }}</mat-icon>\n    </button>\n  </div>\n</ng-template>\n", styles: [":host .igo-layer-filters-container{padding-left:5px}:host #time-slider{width:70%}@media only screen and (orientation:portrait)and (max-width:599px),only screen and (orientation:landscape)and (max-width:959px){:host #time-slider{width:60%}}:host .date-below{margin:0}:host .igo-layer-actions-container{display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatDatetimepickerModule }, { kind: "component", type: i2$3.MatDatetimepickerComponent, selector: "mat-datetimepicker", inputs: ["multiYearSelector", "twelvehour", "startView", "mode", "timeInterval", "ariaNextMonthLabel", "ariaPrevMonthLabel", "ariaNextYearLabel", "ariaPrevYearLabel", "preventSameDateTimeSelection", "panelClass", "startAt", "openOnFocus", "type", "touchUi", "disabled"], outputs: ["selectedChanged", "opened", "closed", "viewChanged"], exportAs: ["matDatetimepicker"] }, { kind: "component", type: i2$3.MatDatetimepickerToggleComponent, selector: "mat-datetimepicker-toggle", inputs: ["for", "disabled"], exportAs: ["matDatetimepickerToggle"] }, { kind: "directive", type: i2$3.MatDatetimepickerInputDirective, selector: "input[matDatetimepicker]", inputs: ["matDatetimepicker", "matDatepickerFilter", "value", "min", "max", "disabled"], outputs: ["dateChange", "dateInput"], exportAs: ["matDatepickerInput"] }, { kind: "ngmodule", type: MatNativeDatetimeModule }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatSliderModule }, { kind: "component", type: i6.MatSlider, selector: "mat-slider", inputs: ["disabled", "discrete", "showTickMarks", "min", "color", "disableRipple", "max", "step", "displayWith"], exportAs: ["matSlider"] }, { kind: "directive", type: i6.MatSliderThumb, selector: "input[matSliderThumb]", inputs: ["value"], outputs: ["valueChange", "dragStart", "dragEnd"], exportAs: ["matSliderThumb"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i2$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TimeFilterFormComponent, decorators: [{
             type: Component,
@@ -28991,7 +29015,7 @@ class EpsgSelectorModalComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: EpsgSelectorModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: EpsgSelectorModalComponent, isStandalone: true, selector: "igo-epsg-selector-modal", ngImport: i0, template: "<h2 mat-dialog-title class=\"mat-typography\">\n  {{ 'igo.geo.dropGeoFile.epsgUndefined.title' | translate }}\n</h2>\n<div mat-dialog-content class=\"mat-typography\">\n  <p\n    [innerHTML]=\"\n      'igo.geo.dropGeoFile.epsgUndefined.text'\n        | translate: { fileName: data.fileName }\n    \"\n  ></p>\n  <div class=\"igo-input-container\">\n    <mat-form-field appearance=\"fill\" class=\"full-width\">\n      <mat-label>{{\n        'igo.geo.importExportForm.importProjPlaceholder' | translate\n      }}</mat-label>\n      <mat-select [(value)]=\"selectedEpsg\">\n        @for (projection of data.projections; track projection) {\n          <mat-option\n            [value]=\"projection.code\"\n            (click)=\"$event.stopPropagation()\"\n          >\n            @if (projection.translateKey) {\n              <span matListItemTitle>\n                {{\n                  'igo.geo.importExportForm.projections.' +\n                    projection.translateKey | translate: projection\n                }}\n              </span>\n            }\n            @if (!projection.translateKey) {\n              <span matListItemTitle>\n                {{ projection.alias }}\n              </span>\n            }\n          </mat-option>\n        }\n      </mat-select>\n      <mat-hint>\n        {{ 'igo.geo.dropGeoFile.epsgUndefined.note' | translate }}\n      </mat-hint>\n    </mat-form-field>\n  </div>\n</div>\n<div mat-dialog-actions align=\"end\">\n  <button mat-button (click)=\"cancel()\">\n    {{ 'igo.common.confirmDialog.cancelBtn' | translate }}\n  </button>\n  <button\n    mat-flat-button\n    color=\"primary\"\n    (click)=\"confirm()\"\n    [disabled]=\"!selectedEpsg\"\n  >\n    {{ 'igo.common.confirmDialog.confirmBtn' | translate }}\n  </button>\n</div>\n", styles: [".full-width{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: IgoLanguageModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i2$3.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i2$3.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i2$3.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: EpsgSelectorModalComponent, isStandalone: true, selector: "igo-epsg-selector-modal", ngImport: i0, template: "<h2 mat-dialog-title class=\"mat-typography\">\n  {{ 'igo.geo.dropGeoFile.epsgUndefined.title' | translate }}\n</h2>\n<div mat-dialog-content class=\"mat-typography\">\n  <p\n    [innerHTML]=\"\n      'igo.geo.dropGeoFile.epsgUndefined.text'\n        | translate: { fileName: data.fileName }\n    \"\n  ></p>\n  <div class=\"igo-input-container\">\n    <mat-form-field appearance=\"fill\" class=\"full-width\">\n      <mat-label>{{\n        'igo.geo.importExportForm.importProjPlaceholder' | translate\n      }}</mat-label>\n      <mat-select [(value)]=\"selectedEpsg\">\n        @for (projection of data.projections; track projection) {\n          <mat-option\n            [value]=\"projection.code\"\n            (click)=\"$event.stopPropagation()\"\n          >\n            @if (projection.translateKey) {\n              <span matListItemTitle>\n                {{\n                  'igo.geo.importExportForm.projections.' +\n                    projection.translateKey | translate: projection\n                }}\n              </span>\n            }\n            @if (!projection.translateKey) {\n              <span matListItemTitle>\n                {{ projection.alias }}\n              </span>\n            }\n          </mat-option>\n        }\n      </mat-select>\n      <mat-hint>\n        {{ 'igo.geo.dropGeoFile.epsgUndefined.note' | translate }}\n      </mat-hint>\n    </mat-form-field>\n  </div>\n</div>\n<div mat-dialog-actions align=\"end\">\n  <button mat-button (click)=\"cancel()\">\n    {{ 'igo.common.confirmDialog.cancelBtn' | translate }}\n  </button>\n  <button\n    mat-flat-button\n    color=\"primary\"\n    (click)=\"confirm()\"\n    [disabled]=\"!selectedEpsg\"\n  >\n    {{ 'igo.common.confirmDialog.confirmBtn' | translate }}\n  </button>\n</div>\n", styles: [".full-width{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: IgoLanguageModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i2$4.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i2$4.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i2$4.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: EpsgSelectorModalComponent, decorators: [{
             type: Component,
@@ -30745,7 +30769,7 @@ class ImportExportComponent {
         this.selectedMode.set(event.value);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: ImportExportComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: ImportExportComponent, isStandalone: true, selector: "igo-import-export", inputs: { selectFirstProj: { classPropertyName: "selectFirstProj", publicName: "selectFirstProj", isSignal: true, isRequired: false, transformFunction: null }, map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: false, transformFunction: null }, contextUri: { classPropertyName: "contextUri", publicName: "contextUri", isSignal: true, isRequired: false, transformFunction: null }, projectionsLimitations: { classPropertyName: "projectionsLimitations", publicName: "projectionsLimitations", isSignal: true, isRequired: false, transformFunction: null }, store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: false, transformFunction: null }, selectedMode: { classPropertyName: "selectedMode", publicName: "selectedMode", isSignal: true, isRequired: false, transformFunction: null }, exportOptions$: { classPropertyName: "exportOptions$", publicName: "exportOptions$", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedMode: "selectedModeChange", selectMode: "selectMode", exportOptionsChange: "exportOptionsChange" }, providers: [ConfirmDialogService], ngImport: i0, template: "<div class=\"import-export-toggle\">\n  <mat-button-toggle-group\n    [value]=\"selectedMode()\"\n    (change)=\"onImportExportChange($event)\"\n  >\n    <mat-button-toggle [value]=\"'import'\">\n      {{ 'igo.geo.importExportForm.importTabTitle' | translate }}\n    </mat-button-toggle>\n    <mat-button-toggle [value]=\"'export'\">\n      {{ 'igo.geo.importExportForm.exportTabTitle' | translate }}\n    </mat-button-toggle>\n  </mat-button-toggle-group>\n</div>\n\n@if (selectedMode() === 'import') {\n  <form class=\"igo-form\" [formGroup]=\"importForm\">\n    <div class=\"igo-input-container\">\n      <mat-form-field>\n        <mat-label>{{\n          'igo.geo.importExportForm.importProjPlaceholder' | translate\n        }}</mat-label>\n        <mat-select [(value)]=\"inputProj\">\n          @for (projection of projections$ | async; track projection) {\n            <mat-option [value]=\"projection\" (click)=\"$event.stopPropagation()\">\n              @if (projection.translateKey) {\n                <span matListItemTitle>\n                  {{\n                    'igo.geo.importExportForm.projections.' +\n                      projection.translateKey | translate: projection\n                  }}\n                </span>\n              }\n              @if (!projection.translateKey) {\n                <span matListItemTitle>\n                  {{ projection.alias }}\n                </span>\n              }\n            </mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n    </div>\n    <div\n      tooltip-position=\"below\"\n      matTooltipShowDelay=\"500\"\n      [matTooltip]=\"\n        importForm.invalid\n          ? ('igo.geo.importExportForm.projections.choose' | translate)\n          : ('igo.geo.importExportForm.importButton' | translate)\n      \"\n      class=\"igo-form-button-group\"\n    >\n      <button\n        [disabled]=\"importForm.invalid || !!(loading$ | async)\"\n        matButton=\"elevated\"\n        type=\"button\"\n        (click)=\"fileInput.click()\"\n      >\n        {{ 'igo.geo.importExportForm.importButton' | translate }}\n      </button>\n      <igo-spinner [shown]=\"!!(loading$ | async)\" />\n      <input\n        hidden\n        #fileInput\n        type=\"file\"\n        [style.display]=\"'none'\"\n        (click)=\"fileInput.value = ''\"\n        (change)=\"importFiles($any($event.target).files)\"\n      />\n    </div>\n  </form>\n\n  <section>\n    @if (importHtmlClarifications === '') {\n      <div>\n        <h4>\n          {{ 'igo.geo.importExportForm.importClarifications' | translate }}\n        </h4>\n        <ul>\n          <li>\n            {{\n              'igo.geo.importExportForm.importSizeMax'\n                | translate: { size: fileSizeMb }\n            }}\n          </li>\n          <li>\n            {{ 'igo.geo.importExportForm.importFormatAuthorized' | translate }}\n          </li>\n          <li>{{ 'igo.geo.importExportForm.importShpZip' | translate }}</li>\n        </ul>\n      </div>\n    }\n    @if (importHtmlClarifications !== '') {\n      <igo-custom-html [html]=\"importHtmlClarifications\" />\n    }\n  </section>\n} @else if (selectedMode() === 'export') {\n  @let hasExports = (exportableLayers$ | async)?.length;\n  @if (hasExports) {\n    <form class=\"igo-form\" [formGroup]=\"form\">\n      <div class=\"igo-input-container\">\n        <mat-form-field>\n          <mat-label>{{\n            'igo.geo.importExportForm.exportLayerPlaceholder' | translate\n          }}</mat-label>\n          <mat-select [(value)]=\"layers\" multiple>\n            <mat-select-trigger>\n              {{ layers.length ? getLayerTitleById(layers[0]) : '' }}\n              @if (layers.length > 1) {\n                <span class=\"export-select-trigger\">\n                  (+{{ layers.length - 1 }}\n                  {{\n                    (layers?.length === 2\n                      ? 'igo.geo.importExportForm.other'\n                      : 'igo.geo.importExportForm.others'\n                    ) | translate\n                  }})\n                </span>\n              }\n            </mat-select-trigger>\n            @for (layer of exportableLayers$ | async; track layer) {\n              <mat-option\n                [class.igo-export-layer-mat-option]=\"\n                  layerHasSelectedFeatures(layer)\n                \"\n                [value]=\"layer.id\"\n                (click)=\"$event.stopPropagation()\"\n              >\n                <span matListItemTitle>{{ layer.title }}</span>\n                <span matListItemTitle>\n                  @if (layerHasSelectedFeatures(layer)) {\n                    <mat-slide-toggle\n                      (click)=\"onlySelectedClick($event, layer.id!)\"\n                      (checked)=\"inLayersIdToExportSelectionOnly(layer)\"\n                      (change)=\"onlySelected($event, layer.id!)\"\n                    >\n                      <small>{{\n                        'igo.geo.importExportForm.exportSelectedFeature'\n                          | translate\n                      }}</small>\n                    </mat-slide-toggle>\n                  }\n                </span>\n              </mat-option>\n            }\n          </mat-select>\n        </mat-form-field>\n      </div>\n      <div class=\"igo-input-container\">\n        <mat-form-field>\n          <mat-label>{{\n            'igo.geo.importExportForm.exportFormatPlaceholder' | translate\n          }}</mat-label>\n          <mat-select formControlName=\"format\">\n            @if ((formats$ | async)!.length !== 0) {\n              @for (format of formats$ | async; track format) {\n                <mat-option [value]=\"format\">\n                  {{ 'igo.geo.export.format.' + format | translate }}\n                </mat-option>\n              }\n            }\n            @if ((formats$ | async)!.length === 0) {\n              <mat-option disabled=\"true\">\n                {{ 'igo.geo.export.noFormat.title' | translate }}\n              </mat-option>\n            }\n          </mat-select>\n        </mat-form-field>\n      </div>\n      @if (forceNaming && form.value.format !== 'URL') {\n        <div class=\"igo-input-container\">\n          <mat-form-field>\n            <input\n              matInput\n              formControlName=\"name\"\n              placeholder=\"{{\n                'igo.geo.importExportForm.exportFileNamePlaceholder' | translate\n              }}\"\n            />\n          </mat-form-field>\n        </div>\n      }\n      @if (this.isCsvExport(form.value.format)) {\n        <div class=\"igo-input-container\">\n          <mat-form-field>\n            <mat-label>{{ 'igo.geo.export.separator' | translate }}</mat-label>\n            <mat-select formControlName=\"csvSeparator\">\n              @for (separator of csvSeparators; track separator) {\n                <mat-option [value]=\"separator\">\n                  {{ 'igo.geo.export.csv.separator.' + separator | translate }}\n                </mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n        </div>\n        @if (layers.length > 1) {\n          <div class=\"export-combine-layers\">\n            <mat-slide-toggle\n              formControlName=\"combineLayers\"\n              [labelPosition]=\"'before'\"\n            >\n              {{ 'igo.geo.importExportForm.exportCombineResults' | translate }}\n            </mat-slide-toggle>\n          </div>\n        }\n        @if (layers.length > 1 && form.value.combineLayers) {\n          <div class=\"export-separator\">\n            <mat-slide-toggle\n              formControlName=\"separator\"\n              [labelPosition]=\"'before'\"\n            >\n              {{ 'igo.geo.importExportForm.exportSeparator' | translate }}\n            </mat-slide-toggle>\n          </div>\n        }\n      }\n      @if (form.value.format !== 'URL') {\n        <div class=\"export-options\">\n          <mat-slide-toggle\n            formControlName=\"featureInMapExtent\"\n            [labelPosition]=\"'before'\"\n          >\n            {{ 'igo.geo.importExportForm.exportFeatureInExtent' | translate }}\n          </mat-slide-toggle>\n        </div>\n      }\n      <div class=\"igo-form-button-group\">\n        <button\n          matButton=\"elevated\"\n          type=\"button\"\n          [disabled]=\"!form.valid || !!(loading$ | async)\"\n          (click)=\"handleExportFormSubmit(form.value)\"\n        >\n          {{\n            form.value.format !== 'URL'\n              ? ('igo.geo.importExportForm.exportButton' | translate)\n              : form.value.layers.length > 1\n                ? ('igo.geo.importExportForm.exportButtonLinks' | translate)\n                : ('igo.geo.importExportForm.exportButtonLink' | translate)\n          }}\n        </button>\n        <igo-spinner [shown]=\"!!(loading$ | async)\" />\n      </div>\n      @if (exportHtmlClarifications !== '') {\n        <igo-custom-html [html]=\"exportHtmlClarifications\" />\n      }\n    </form>\n  } @else {\n    <section>\n      <h4>\n        {{ 'igo.geo.importExportForm.exportNoLayersExportable' | translate }}\n      </h4>\n    </section>\n  }\n}\n", styles: [":host{padding:16px;display:flex;flex-direction:column;gap:16px}:host mat-option.igo-export-layer-mat-option{height:5em;line-height:1em}:host .import-export-toggle mat-button-toggle-group{width:100%}:host .import-export-toggle mat-button-toggle-group mat-button-toggle{width:50%}:host .igo-input-container mat-form-field{width:100%}:host .igo-form-button-group{text-align:center}:host igo-spinner{position:absolute}:host .export-options mat-slide-toggle,:host .export-combine-layers mat-slide-toggle,:host .export-separator mat-slide-toggle{width:100%;padding:10px}:host .export-options mat-slide-toggle ::ng-deep .mdc-form-field,:host .export-combine-layers mat-slide-toggle ::ng-deep .mdc-form-field,:host .export-separator mat-slide-toggle ::ng-deep .mdc-form-field{width:100%}:host .export-options mat-slide-toggle ::ng-deep .mdc-label,:host .export-combine-layers mat-slide-toggle ::ng-deep .mdc-label,:host .export-separator mat-slide-toggle ::ng-deep .mdc-label{margin-left:0;width:calc(100% - 60px)}:host .export-select-trigger{opacity:.75;font-size:.75em}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$4.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$4.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i4$3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: SpinnerComponent, selector: "igo-spinner", inputs: ["shown"] }, { kind: "component", type: CustomHtmlComponent, selector: "igo-custom-html", inputs: ["html"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i1$3.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: ImportExportComponent, isStandalone: true, selector: "igo-import-export", inputs: { selectFirstProj: { classPropertyName: "selectFirstProj", publicName: "selectFirstProj", isSignal: true, isRequired: false, transformFunction: null }, map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: false, transformFunction: null }, contextUri: { classPropertyName: "contextUri", publicName: "contextUri", isSignal: true, isRequired: false, transformFunction: null }, projectionsLimitations: { classPropertyName: "projectionsLimitations", publicName: "projectionsLimitations", isSignal: true, isRequired: false, transformFunction: null }, store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: false, transformFunction: null }, selectedMode: { classPropertyName: "selectedMode", publicName: "selectedMode", isSignal: true, isRequired: false, transformFunction: null }, exportOptions$: { classPropertyName: "exportOptions$", publicName: "exportOptions$", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedMode: "selectedModeChange", selectMode: "selectMode", exportOptionsChange: "exportOptionsChange" }, providers: [ConfirmDialogService], ngImport: i0, template: "<div class=\"import-export-toggle\">\n  <mat-button-toggle-group\n    [value]=\"selectedMode()\"\n    (change)=\"onImportExportChange($event)\"\n  >\n    <mat-button-toggle [value]=\"'import'\">\n      {{ 'igo.geo.importExportForm.importTabTitle' | translate }}\n    </mat-button-toggle>\n    <mat-button-toggle [value]=\"'export'\">\n      {{ 'igo.geo.importExportForm.exportTabTitle' | translate }}\n    </mat-button-toggle>\n  </mat-button-toggle-group>\n</div>\n\n@if (selectedMode() === 'import') {\n  <form class=\"igo-form\" [formGroup]=\"importForm\">\n    <div class=\"igo-input-container\">\n      <mat-form-field>\n        <mat-label>{{\n          'igo.geo.importExportForm.importProjPlaceholder' | translate\n        }}</mat-label>\n        <mat-select [(value)]=\"inputProj\">\n          @for (projection of projections$ | async; track projection) {\n            <mat-option [value]=\"projection\" (click)=\"$event.stopPropagation()\">\n              @if (projection.translateKey) {\n                <span matListItemTitle>\n                  {{\n                    'igo.geo.importExportForm.projections.' +\n                      projection.translateKey | translate: projection\n                  }}\n                </span>\n              }\n              @if (!projection.translateKey) {\n                <span matListItemTitle>\n                  {{ projection.alias }}\n                </span>\n              }\n            </mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n    </div>\n    <div\n      tooltip-position=\"below\"\n      matTooltipShowDelay=\"500\"\n      [matTooltip]=\"\n        importForm.invalid\n          ? ('igo.geo.importExportForm.projections.choose' | translate)\n          : ('igo.geo.importExportForm.importButton' | translate)\n      \"\n      class=\"igo-form-button-group\"\n    >\n      <button\n        [disabled]=\"importForm.invalid || !!(loading$ | async)\"\n        matButton=\"elevated\"\n        type=\"button\"\n        (click)=\"fileInput.click()\"\n      >\n        {{ 'igo.geo.importExportForm.importButton' | translate }}\n      </button>\n      <igo-spinner [shown]=\"!!(loading$ | async)\" />\n      <input\n        hidden\n        #fileInput\n        type=\"file\"\n        [style.display]=\"'none'\"\n        (click)=\"fileInput.value = ''\"\n        (change)=\"importFiles($any($event.target).files)\"\n      />\n    </div>\n  </form>\n\n  <section>\n    @if (importHtmlClarifications === '') {\n      <div>\n        <h4>\n          {{ 'igo.geo.importExportForm.importClarifications' | translate }}\n        </h4>\n        <ul>\n          <li>\n            {{\n              'igo.geo.importExportForm.importSizeMax'\n                | translate: { size: fileSizeMb }\n            }}\n          </li>\n          <li>\n            {{ 'igo.geo.importExportForm.importFormatAuthorized' | translate }}\n          </li>\n          <li>{{ 'igo.geo.importExportForm.importShpZip' | translate }}</li>\n        </ul>\n      </div>\n    }\n    @if (importHtmlClarifications !== '') {\n      <igo-custom-html [html]=\"importHtmlClarifications\" />\n    }\n  </section>\n} @else if (selectedMode() === 'export') {\n  @let hasExports = (exportableLayers$ | async)?.length;\n  @if (hasExports) {\n    <form class=\"igo-form\" [formGroup]=\"form\">\n      <div class=\"igo-input-container\">\n        <mat-form-field>\n          <mat-label>{{\n            'igo.geo.importExportForm.exportLayerPlaceholder' | translate\n          }}</mat-label>\n          <mat-select [(value)]=\"layers\" multiple>\n            <mat-select-trigger>\n              {{ layers.length ? getLayerTitleById(layers[0]) : '' }}\n              @if (layers.length > 1) {\n                <span class=\"export-select-trigger\">\n                  (+{{ layers.length - 1 }}\n                  {{\n                    (layers?.length === 2\n                      ? 'igo.geo.importExportForm.other'\n                      : 'igo.geo.importExportForm.others'\n                    ) | translate\n                  }})\n                </span>\n              }\n            </mat-select-trigger>\n            @for (layer of exportableLayers$ | async; track layer) {\n              <mat-option\n                [class.igo-export-layer-mat-option]=\"\n                  layerHasSelectedFeatures(layer)\n                \"\n                [value]=\"layer.id\"\n                (click)=\"$event.stopPropagation()\"\n              >\n                <span matListItemTitle>{{ layer.title }}</span>\n                <span matListItemTitle>\n                  @if (layerHasSelectedFeatures(layer)) {\n                    <mat-slide-toggle\n                      (click)=\"onlySelectedClick($event, layer.id!)\"\n                      (checked)=\"inLayersIdToExportSelectionOnly(layer)\"\n                      (change)=\"onlySelected($event, layer.id!)\"\n                    >\n                      <small>{{\n                        'igo.geo.importExportForm.exportSelectedFeature'\n                          | translate\n                      }}</small>\n                    </mat-slide-toggle>\n                  }\n                </span>\n              </mat-option>\n            }\n          </mat-select>\n        </mat-form-field>\n      </div>\n      <div class=\"igo-input-container\">\n        <mat-form-field>\n          <mat-label>{{\n            'igo.geo.importExportForm.exportFormatPlaceholder' | translate\n          }}</mat-label>\n          <mat-select formControlName=\"format\">\n            @if ((formats$ | async)!.length !== 0) {\n              @for (format of formats$ | async; track format) {\n                <mat-option [value]=\"format\">\n                  {{ 'igo.geo.export.format.' + format | translate }}\n                </mat-option>\n              }\n            }\n            @if ((formats$ | async)!.length === 0) {\n              <mat-option disabled=\"true\">\n                {{ 'igo.geo.export.noFormat.title' | translate }}\n              </mat-option>\n            }\n          </mat-select>\n        </mat-form-field>\n      </div>\n      @if (forceNaming && form.value.format !== 'URL') {\n        <div class=\"igo-input-container\">\n          <mat-form-field>\n            <input\n              matInput\n              formControlName=\"name\"\n              placeholder=\"{{\n                'igo.geo.importExportForm.exportFileNamePlaceholder' | translate\n              }}\"\n            />\n          </mat-form-field>\n        </div>\n      }\n      @if (this.isCsvExport(form.value.format)) {\n        <div class=\"igo-input-container\">\n          <mat-form-field>\n            <mat-label>{{ 'igo.geo.export.separator' | translate }}</mat-label>\n            <mat-select formControlName=\"csvSeparator\">\n              @for (separator of csvSeparators; track separator) {\n                <mat-option [value]=\"separator\">\n                  {{ 'igo.geo.export.csv.separator.' + separator | translate }}\n                </mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n        </div>\n        @if (layers.length > 1) {\n          <div class=\"export-combine-layers\">\n            <mat-slide-toggle\n              formControlName=\"combineLayers\"\n              [labelPosition]=\"'before'\"\n            >\n              {{ 'igo.geo.importExportForm.exportCombineResults' | translate }}\n            </mat-slide-toggle>\n          </div>\n        }\n        @if (layers.length > 1 && form.value.combineLayers) {\n          <div class=\"export-separator\">\n            <mat-slide-toggle\n              formControlName=\"separator\"\n              [labelPosition]=\"'before'\"\n            >\n              {{ 'igo.geo.importExportForm.exportSeparator' | translate }}\n            </mat-slide-toggle>\n          </div>\n        }\n      }\n      @if (form.value.format !== 'URL') {\n        <div class=\"export-options\">\n          <mat-slide-toggle\n            formControlName=\"featureInMapExtent\"\n            [labelPosition]=\"'before'\"\n          >\n            {{ 'igo.geo.importExportForm.exportFeatureInExtent' | translate }}\n          </mat-slide-toggle>\n        </div>\n      }\n      <div class=\"igo-form-button-group\">\n        <button\n          matButton=\"elevated\"\n          type=\"button\"\n          [disabled]=\"!form.valid || !!(loading$ | async)\"\n          (click)=\"handleExportFormSubmit(form.value)\"\n        >\n          {{\n            form.value.format !== 'URL'\n              ? ('igo.geo.importExportForm.exportButton' | translate)\n              : form.value.layers.length > 1\n                ? ('igo.geo.importExportForm.exportButtonLinks' | translate)\n                : ('igo.geo.importExportForm.exportButtonLink' | translate)\n          }}\n        </button>\n        <igo-spinner [shown]=\"!!(loading$ | async)\" />\n      </div>\n      @if (exportHtmlClarifications !== '') {\n        <igo-custom-html [html]=\"exportHtmlClarifications\" />\n      }\n    </form>\n  } @else {\n    <section>\n      <h4>\n        {{ 'igo.geo.importExportForm.exportNoLayersExportable' | translate }}\n      </h4>\n    </section>\n  }\n}\n", styles: [":host{padding:16px;display:flex;flex-direction:column;gap:16px}:host mat-option.igo-export-layer-mat-option{height:5em;line-height:1em}:host .import-export-toggle mat-button-toggle-group{width:100%}:host .import-export-toggle mat-button-toggle-group mat-button-toggle{width:50%}:host .igo-input-container mat-form-field{width:100%}:host .igo-form-button-group{text-align:center}:host igo-spinner{position:absolute}:host .export-options mat-slide-toggle,:host .export-combine-layers mat-slide-toggle,:host .export-separator mat-slide-toggle{width:100%;padding:10px}:host .export-options mat-slide-toggle ::ng-deep .mdc-form-field,:host .export-combine-layers mat-slide-toggle ::ng-deep .mdc-form-field,:host .export-separator mat-slide-toggle ::ng-deep .mdc-form-field{width:100%}:host .export-options mat-slide-toggle ::ng-deep .mdc-label,:host .export-combine-layers mat-slide-toggle ::ng-deep .mdc-label,:host .export-separator mat-slide-toggle ::ng-deep .mdc-label{margin-left:0;width:calc(100% - 60px)}:host .export-select-trigger{opacity:.75;font-size:.75em}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$3.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$3.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i4$3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: SpinnerComponent, selector: "igo-spinner", inputs: ["shown"] }, { kind: "component", type: CustomHtmlComponent, selector: "igo-custom-html", inputs: ["html"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i2$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: ImportExportComponent, decorators: [{
             type: Component,
@@ -31948,7 +31972,7 @@ class SearchSettingsComponent {
         this.reverseSearchCoordsFormatStatus.emit(this.reverseSearchCoordsFormatEnabled());
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SearchSettingsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SearchSettingsComponent, isStandalone: true, selector: "igo-search-settings", inputs: { pointerSummaryEnabled: { classPropertyName: "pointerSummaryEnabled", publicName: "pointerSummaryEnabled", isSignal: true, isRequired: false, transformFunction: null }, searchResultsGeometryEnabled: { classPropertyName: "searchResultsGeometryEnabled", publicName: "searchResultsGeometryEnabled", isSignal: true, isRequired: false, transformFunction: null }, reverseSearchCoordsFormatEnabled: { classPropertyName: "reverseSearchCoordsFormatEnabled", publicName: "reverseSearchCoordsFormatEnabled", isSignal: true, isRequired: false, transformFunction: null }, allowResetSearchSourcesOptions: { classPropertyName: "allowResetSearchSourcesOptions", publicName: "allowResetSearchSourcesOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pointerSummaryEnabled: "pointerSummaryEnabledChange", searchResultsGeometryEnabled: "searchResultsGeometryEnabledChange", reverseSearchCoordsFormatEnabled: "reverseSearchCoordsFormatEnabledChange", searchSourceChange: "searchSourceChange", pointerSummaryStatus: "pointerSummaryStatus", searchResultsGeometryStatus: "searchResultsGeometryStatus", reverseSearchCoordsFormatStatus: "reverseSearchCoordsFormatStatus" }, host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" } }, ngImport: i0, template: "<div class=\"igo-search-settings\">\n  <button\n    mat-icon-button\n    class=\"igo-search-settings-button\"\n    color=\"primary\"\n    tooltip-position=\"below\"\n    matTooltipShowDelay=\"500\"\n    [matTooltip]=\"'igo.geo.search.menu.tooltip' | translate\"\n    [matMenuTriggerFor]=\"searchSettingsMenu\"\n  >\n    <mat-icon>expand_more</mat-icon>\n  </button>\n  <mat-menu #searchSettingsMenu=\"matMenu\" class=\"no-border-radius\">\n    @if (getSearchSources().length > 4) {\n      <div class=\"checkAllButton\">\n        <button matButton=\"elevated\" (click)=\"checkUncheckAllSources($event)\">\n          {{\n            !searchSourcesAllEnabled\n              ? ('igo.geo.search.searchSources.unselectAll' | translate)\n              : ('igo.geo.search.searchSources.selectAll' | translate)\n          }}\n        </button>\n      </div>\n    }\n    @for (source of getSearchSources(); track source) {\n      <span class=\"igo-search-settings-search-source\">\n        <mat-checkbox\n          class=\"igo-search-settings-checkbox\"\n          [checked]=\"source.enabled\"\n          [value]=\"$any(source)\"\n          (click)=\"$event.stopPropagation()\"\n          (change)=\"onCheckSearchSource($event, source)\"\n        />\n        @if (source.settings.length > 0) {\n          <button [matMenuTriggerFor]=\"sub_menu\" mat-menu-item>\n            {{ source.title }}\n          </button>\n        }\n        @if (source.settings.length === 0) {\n          <button mat-menu-item>\n            {{ source.title }}\n          </button>\n        }\n      </span>\n      <mat-menu #sub_menu=\"matMenu\">\n        @for (setting of source.settings; track setting) {\n          <button mat-menu-item [matMenuTriggerFor]=\"test_sub_menu\">\n            {{\n              'igo.geo.search.searchSources.settings.' + setting.title\n                | translate\n            }}\n          </button>\n          <mat-menu #test_sub_menu=\"matMenu\" yPosition=\"above\">\n            @switch (setting.type) {\n              @case ('radiobutton') {\n                <span>\n                  <mat-radio-group\n                    class=\"igo-search-settings-radio-group\"\n                    [value]=\"setting\"\n                  >\n                    @for (settingValue of setting.values; track settingValue) {\n                      <mat-radio-button\n                        [value]=\"settingValue\"\n                        [matTooltip]=\"getAvailableHashtagsValues(settingValue)\"\n                        [checked]=\"settingValue.enabled\"\n                        (click)=\"$event.stopPropagation()\"\n                        (change)=\"\n                          settingsValueCheckedRadioButton(\n                            $event,\n                            source,\n                            setting,\n                            settingValue\n                          )\n                        \"\n                      >\n                        {{ settingValue.title | translate }}\n                      </mat-radio-button>\n                    }\n                  </mat-radio-group>\n                </span>\n              }\n              @case ('checkbox') {\n                <span>\n                  @if (setting.values.length > 3) {\n                    <div class=\"checkAllButton\">\n                      <button\n                        matButton=\"elevated\"\n                        (click)=\"checkUncheckAll($event, source, setting)\"\n                      >\n                        {{\n                          setting.allEnabled || setting.allEnabled === undefined\n                            ? ('igo.geo.search.searchSources.settings.unselectAll'\n                              | translate)\n                            : ('igo.geo.search.searchSources.settings.selectAll'\n                              | translate)\n                        }}\n                      </button>\n                    </div>\n                  }\n                  @for (\n                    settingValue of getAvailableValues(setting);\n                    track settingValue\n                  ) {\n                    <div class=\"igo-search-settings-sub-menu\" mat-menu-item>\n                      <mat-checkbox\n                        [style.display]=\"displayBlock\"\n                        [checked]=\"settingValue.enabled\"\n                        [value]=\"$any(setting)\"\n                        [matTooltip]=\"getAvailableHashtagsValues(settingValue)\"\n                        (click)=\"$event.stopPropagation()\"\n                        (change)=\"\n                          settingsValueCheckedCheckbox(\n                            $event,\n                            source,\n                            setting,\n                            settingValue\n                          )\n                        \"\n                      >\n                        {{ settingValue.title | translate }}\n                      </mat-checkbox>\n                    </div>\n                  }\n                </span>\n              }\n            }\n          </mat-menu>\n        }\n      </mat-menu>\n    }\n    <mat-divider />\n    <span class=\"pointer-summary-slide-toggle-container\">\n      @if (hasPointerReverseSearchSource && !isTouchScreen) {\n        <div mat-menu-item>\n          <mat-slide-toggle\n            class=\"search-option\"\n            (change)=\"changePointerReverseSearch($event)\"\n            tooltip-position=\"below\"\n            matTooltipShowDelay=\"500\"\n            [matTooltip]=\"\n              'igo.geo.search.pointerSearchSummary.tooltip' | translate\n            \"\n            (click)=\"$event.stopPropagation()\"\n            [checked]=\"pointerSummaryEnabled()\"\n          >\n            {{ 'igo.geo.search.pointerSearchSummary.title' | translate }}\n          </mat-slide-toggle>\n        </div>\n      }\n      <div mat-menu-item>\n        <mat-slide-toggle\n          class=\"search-option\"\n          (change)=\"changeSearchResultsGeometry($event)\"\n          tooltip-position=\"below\"\n          matTooltipShowDelay=\"500\"\n          [matTooltip]=\"\n            'igo.geo.search.searchResultsGeometry.tooltip' | translate\n          \"\n          (click)=\"$event.stopPropagation()\"\n          [checked]=\"searchResultsGeometryEnabled()\"\n        >\n          {{ 'igo.geo.search.searchResultsGeometry.title' | translate }}\n        </mat-slide-toggle>\n      </div>\n      <div mat-menu-item>\n        <mat-slide-toggle\n          class=\"search-option\"\n          (change)=\"reverseSearchCoordsFormat($event)\"\n          tooltip-position=\"below\"\n          matTooltipShowDelay=\"500\"\n          [matTooltip]=\"\n            reverseSearchCoordsFormatEnabled()\n              ? ('igo.geo.search.reverseCoordFormat.tooltipLatLon' | translate)\n              : ('igo.geo.search.reverseCoordFormat.tooltipLonLat' | translate)\n          \"\n          (click)=\"$event.stopPropagation()\"\n          [checked]=\"reverseSearchCoordsFormatEnabled()\"\n        >\n          {{ 'igo.geo.search.reverseCoordFormat.title' | translate }}\n        </mat-slide-toggle>\n      </div>\n      @if (allowResetSearchSourcesOptions()) {\n        <div mat-menu-item>\n          <button\n            matButton=\"elevated\"\n            class=\"check-default-button\"\n            (click)=\"resetSourceOptions($event)\"\n          >\n            {{\n              'igo.geo.search.searchSources.settings.reset.button' | translate\n            }}\n          </button>\n        </div>\n      }\n    </span>\n  </mat-menu>\n</div>\n", styles: [":host{display:flex;align-items:center}.checkAllButton{text-align:center;padding:0 5px}.igo-search-settings-radio-group{display:flex;flex-direction:column;padding-right:16px}.igo-search-settings-checkbox mat-radio-button{display:flex}.igo-search-settings-search-source{display:flex;width:100%}.igo-search-settings-search-source mat-checkbox{display:flex;margin-left:5px;margin-right:5px}.search-option{display:block;margin-right:10px;margin-bottom:15px}.pointer-summary-slide-toggle-container{overflow-x:hidden}.pointer-summary-slide-toggle-container mat-slide-toggle{margin:10px 0}.igo-search-settings-button button{border-radius:0!important;background-color:var(--mat-sys-surface-bright)}.igo-search-settings-button button .mat-ripple,.igo-search-settings-button button .mdc-icon-button__ripple{border-radius:0!important}.igo-search-settings-sub-menu{min-height:34px}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i3$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i3$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i2$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i8$1.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i8$1.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i1$2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i1$3.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: IgoFormDialogModule }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SearchSettingsComponent, isStandalone: true, selector: "igo-search-settings", inputs: { pointerSummaryEnabled: { classPropertyName: "pointerSummaryEnabled", publicName: "pointerSummaryEnabled", isSignal: true, isRequired: false, transformFunction: null }, searchResultsGeometryEnabled: { classPropertyName: "searchResultsGeometryEnabled", publicName: "searchResultsGeometryEnabled", isSignal: true, isRequired: false, transformFunction: null }, reverseSearchCoordsFormatEnabled: { classPropertyName: "reverseSearchCoordsFormatEnabled", publicName: "reverseSearchCoordsFormatEnabled", isSignal: true, isRequired: false, transformFunction: null }, allowResetSearchSourcesOptions: { classPropertyName: "allowResetSearchSourcesOptions", publicName: "allowResetSearchSourcesOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pointerSummaryEnabled: "pointerSummaryEnabledChange", searchResultsGeometryEnabled: "searchResultsGeometryEnabledChange", reverseSearchCoordsFormatEnabled: "reverseSearchCoordsFormatEnabledChange", searchSourceChange: "searchSourceChange", pointerSummaryStatus: "pointerSummaryStatus", searchResultsGeometryStatus: "searchResultsGeometryStatus", reverseSearchCoordsFormatStatus: "reverseSearchCoordsFormatStatus" }, host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" } }, ngImport: i0, template: "<div class=\"igo-search-settings\">\n  <button\n    mat-icon-button\n    class=\"igo-search-settings-button\"\n    color=\"primary\"\n    tooltip-position=\"below\"\n    matTooltipShowDelay=\"500\"\n    [matTooltip]=\"'igo.geo.search.menu.tooltip' | translate\"\n    [matMenuTriggerFor]=\"searchSettingsMenu\"\n  >\n    <mat-icon>expand_more</mat-icon>\n  </button>\n  <mat-menu #searchSettingsMenu=\"matMenu\" class=\"no-border-radius\">\n    @if (getSearchSources().length > 4) {\n      <div class=\"checkAllButton\">\n        <button matButton=\"elevated\" (click)=\"checkUncheckAllSources($event)\">\n          {{\n            !searchSourcesAllEnabled\n              ? ('igo.geo.search.searchSources.unselectAll' | translate)\n              : ('igo.geo.search.searchSources.selectAll' | translate)\n          }}\n        </button>\n      </div>\n    }\n    @for (source of getSearchSources(); track source) {\n      <span class=\"igo-search-settings-search-source\">\n        <mat-checkbox\n          class=\"igo-search-settings-checkbox\"\n          [checked]=\"source.enabled\"\n          [value]=\"$any(source)\"\n          (click)=\"$event.stopPropagation()\"\n          (change)=\"onCheckSearchSource($event, source)\"\n        />\n        @if (source.settings.length > 0) {\n          <button [matMenuTriggerFor]=\"sub_menu\" mat-menu-item>\n            {{ source.title }}\n          </button>\n        }\n        @if (source.settings.length === 0) {\n          <button mat-menu-item>\n            {{ source.title }}\n          </button>\n        }\n      </span>\n      <mat-menu #sub_menu=\"matMenu\">\n        @for (setting of source.settings; track setting) {\n          <button mat-menu-item [matMenuTriggerFor]=\"test_sub_menu\">\n            {{\n              'igo.geo.search.searchSources.settings.' + setting.title\n                | translate\n            }}\n          </button>\n          <mat-menu #test_sub_menu=\"matMenu\" yPosition=\"above\">\n            @switch (setting.type) {\n              @case ('radiobutton') {\n                <span>\n                  <mat-radio-group\n                    class=\"igo-search-settings-radio-group\"\n                    [value]=\"setting\"\n                  >\n                    @for (settingValue of setting.values; track settingValue) {\n                      <mat-radio-button\n                        [value]=\"settingValue\"\n                        [matTooltip]=\"getAvailableHashtagsValues(settingValue)\"\n                        [checked]=\"settingValue.enabled\"\n                        (click)=\"$event.stopPropagation()\"\n                        (change)=\"\n                          settingsValueCheckedRadioButton(\n                            $event,\n                            source,\n                            setting,\n                            settingValue\n                          )\n                        \"\n                      >\n                        {{ settingValue.title | translate }}\n                      </mat-radio-button>\n                    }\n                  </mat-radio-group>\n                </span>\n              }\n              @case ('checkbox') {\n                <span>\n                  @if (setting.values.length > 3) {\n                    <div class=\"checkAllButton\">\n                      <button\n                        matButton=\"elevated\"\n                        (click)=\"checkUncheckAll($event, source, setting)\"\n                      >\n                        {{\n                          setting.allEnabled || setting.allEnabled === undefined\n                            ? ('igo.geo.search.searchSources.settings.unselectAll'\n                              | translate)\n                            : ('igo.geo.search.searchSources.settings.selectAll'\n                              | translate)\n                        }}\n                      </button>\n                    </div>\n                  }\n                  @for (\n                    settingValue of getAvailableValues(setting);\n                    track settingValue\n                  ) {\n                    <div class=\"igo-search-settings-sub-menu\" mat-menu-item>\n                      <mat-checkbox\n                        [style.display]=\"displayBlock\"\n                        [checked]=\"settingValue.enabled\"\n                        [value]=\"$any(setting)\"\n                        [matTooltip]=\"getAvailableHashtagsValues(settingValue)\"\n                        (click)=\"$event.stopPropagation()\"\n                        (change)=\"\n                          settingsValueCheckedCheckbox(\n                            $event,\n                            source,\n                            setting,\n                            settingValue\n                          )\n                        \"\n                      >\n                        {{ settingValue.title | translate }}\n                      </mat-checkbox>\n                    </div>\n                  }\n                </span>\n              }\n            }\n          </mat-menu>\n        }\n      </mat-menu>\n    }\n    <mat-divider />\n    <span class=\"pointer-summary-slide-toggle-container\">\n      @if (hasPointerReverseSearchSource && !isTouchScreen) {\n        <div mat-menu-item>\n          <mat-slide-toggle\n            class=\"search-option\"\n            (change)=\"changePointerReverseSearch($event)\"\n            tooltip-position=\"below\"\n            matTooltipShowDelay=\"500\"\n            [matTooltip]=\"\n              'igo.geo.search.pointerSearchSummary.tooltip' | translate\n            \"\n            (click)=\"$event.stopPropagation()\"\n            [checked]=\"pointerSummaryEnabled()\"\n          >\n            {{ 'igo.geo.search.pointerSearchSummary.title' | translate }}\n          </mat-slide-toggle>\n        </div>\n      }\n      <div mat-menu-item>\n        <mat-slide-toggle\n          class=\"search-option\"\n          (change)=\"changeSearchResultsGeometry($event)\"\n          tooltip-position=\"below\"\n          matTooltipShowDelay=\"500\"\n          [matTooltip]=\"\n            'igo.geo.search.searchResultsGeometry.tooltip' | translate\n          \"\n          (click)=\"$event.stopPropagation()\"\n          [checked]=\"searchResultsGeometryEnabled()\"\n        >\n          {{ 'igo.geo.search.searchResultsGeometry.title' | translate }}\n        </mat-slide-toggle>\n      </div>\n      <div mat-menu-item>\n        <mat-slide-toggle\n          class=\"search-option\"\n          (change)=\"reverseSearchCoordsFormat($event)\"\n          tooltip-position=\"below\"\n          matTooltipShowDelay=\"500\"\n          [matTooltip]=\"\n            reverseSearchCoordsFormatEnabled()\n              ? ('igo.geo.search.reverseCoordFormat.tooltipLatLon' | translate)\n              : ('igo.geo.search.reverseCoordFormat.tooltipLonLat' | translate)\n          \"\n          (click)=\"$event.stopPropagation()\"\n          [checked]=\"reverseSearchCoordsFormatEnabled()\"\n        >\n          {{ 'igo.geo.search.reverseCoordFormat.title' | translate }}\n        </mat-slide-toggle>\n      </div>\n      @if (allowResetSearchSourcesOptions()) {\n        <div mat-menu-item>\n          <button\n            matButton=\"elevated\"\n            class=\"check-default-button\"\n            (click)=\"resetSourceOptions($event)\"\n          >\n            {{\n              'igo.geo.search.searchSources.settings.reset.button' | translate\n            }}\n          </button>\n        </div>\n      }\n    </span>\n  </mat-menu>\n</div>\n", styles: [":host{display:flex;align-items:center}.checkAllButton{text-align:center;padding:0 5px}.igo-search-settings-radio-group{display:flex;flex-direction:column;padding-right:16px}.igo-search-settings-checkbox mat-radio-button{display:flex}.igo-search-settings-search-source{display:flex;width:100%}.igo-search-settings-search-source mat-checkbox{display:flex;margin-left:5px;margin-right:5px}.search-option{display:block;margin-right:10px;margin-bottom:15px}.pointer-summary-slide-toggle-container{overflow-x:hidden}.pointer-summary-slide-toggle-container mat-slide-toggle{margin:10px 0}.igo-search-settings-button button{border-radius:0!important;background-color:var(--mat-sys-surface-bright)}.igo-search-settings-button button .mat-ripple,.igo-search-settings-button button .mdc-icon-button__ripple{border-radius:0!important}.igo-search-settings-sub-menu{min-height:34px}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i3$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i3$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i2$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i8$1.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i8$1.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i1$2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i2$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: IgoFormDialogModule }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SearchSettingsComponent, decorators: [{
             type: Component,
@@ -33141,7 +33165,7 @@ class SearchResultsComponent {
         return;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SearchResultsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SearchResultsComponent, isStandalone: true, selector: "igo-search-results", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: false, transformFunction: null }, store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: true, transformFunction: null }, showIcons: { classPropertyName: "showIcons", publicName: "showIcons", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, withZoomButton: { classPropertyName: "withZoomButton", publicName: "withZoomButton", isSignal: true, isRequired: false, transformFunction: null }, tabsMode: { classPropertyName: "tabsMode", publicName: "tabsMode", isSignal: true, isRequired: false, transformFunction: null }, term: { classPropertyName: "term", publicName: "term", isSignal: false, isRequired: false, transformFunction: null }, termSplitter: { classPropertyName: "termSplitter", publicName: "termSplitter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { resultFocus: "resultFocus", resultUnfocus: "resultUnfocus", resultSelect: "resultSelect", moreResults: "moreResults", resultMouseenter: "resultMouseenter", resultMouseleave: "resultMouseleave" }, queries: [{ propertyName: "templateSearchToolbar", first: true, predicate: ["igoSearchItemToolbar"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (tabsMode() === false) {\n  <igo-list [navigation]=\"true\">\n    @for (group of results$ | async; track group) {\n      @if (mode() === searchResultMode.Grouped) {\n        <igo-collapsible\n          [class]=\"group.source.getId()\"\n          [title]=\"computeGroupTitle(group)\"\n          [collapsed]=\"collapsed[group.source.title]\"\n          (toggle)=\"collapsed[group.source.title] = $event\"\n        >\n          <ng-container\n            *ngTemplateOutlet=\"\n              storeItemTemplate;\n              context: { results: group.results }\n            \"\n          />\n        </igo-collapsible>\n      } @else {\n        <ng-container\n          *ngTemplateOutlet=\"\n            storeItemTemplate;\n            context: { results: group.results }\n          \"\n        />\n      }\n\n      <ng-template #storeItemTemplate let-results=\"results\">\n        @for (result of results; track result) {\n          <igo-search-results-item\n            igoListItem\n            color=\"accent\"\n            [map]=\"map()\"\n            [result]=\"result\"\n            [showIcons]=\"showIcons()\"\n            [withZoomButton]=\"withZoomButton()\"\n            [focused]=\"store().state.get(result).focused\"\n            [selected]=\"store().state.get(result).selected\"\n            (focus)=\"resultFocus.emit(result)\"\n            (unfocus)=\"resultUnfocus.emit(result)\"\n            (select)=\"onResultSelect(result)\"\n            (mouseenter)=\"resultFocus.emit(result)\"\n            (mouseleave)=\"resultUnfocus.emit(result)\"\n          >\n            <ng-container\n              igoSearchItemToolbar\n              [ngTemplateOutlet]=\"templateSearchToolbar()\"\n              [ngTemplateOutletContext]=\"{ result: result }\"\n            />\n          </igo-search-results-item>\n        }\n        @if (isMoreResults(group)) {\n          <span class=\"moreResults\" (click)=\"displayMoreResults(group)\">\n            <u>{{ 'igo.geo.search.displayMoreResults' | translate }}</u>\n          </span>\n        }\n      </ng-template>\n    }\n  </igo-list>\n}\n\n@if (tabsMode()) {\n  <igo-list [navigation]=\"true\">\n    @if (mode() === searchResultMode.Grouped) {\n      <mat-tab-group class=\"custom-tabs-view\" dynamicHeight>\n        @for (group of results$ | async; track group) {\n          <mat-tab [label]=\"computeGroupTitle(group)\">\n            <ng-container\n              *ngTemplateOutlet=\"\n                storeItemTemplateGroup;\n                context: { group: group }\n              \"\n            />\n          </mat-tab>\n        }\n      </mat-tab-group>\n    } @else {\n      @for (group of results$ | async; track group) {\n        <ng-container\n          *ngTemplateOutlet=\"storeItemTemplateGroup; context: { group: group }\"\n        />\n      }\n    }\n\n    <ng-template #storeItemTemplateGroup let-group=\"group\">\n      @for (result of group.results; track result) {\n        <igo-search-results-item\n          igoListItem\n          color=\"accent\"\n          [map]=\"map()\"\n          [result]=\"result\"\n          [showIcons]=\"showIcons()\"\n          [withZoomButton]=\"withZoomButton()\"\n          [focused]=\"store().state.get(result).focused\"\n          [selected]=\"store().state.get(result).selected\"\n          (focus)=\"resultFocus.emit(result)\"\n          (unfocus)=\"resultUnfocus.emit(result)\"\n          (select)=\"onResultSelect(result)\"\n          (mouseenter)=\"resultFocus.emit(result)\"\n          (mouseleave)=\"resultUnfocus.emit(result)\"\n        >\n          <ng-container\n            igoSearchItemToolbar\n            [ngTemplateOutlet]=\"templateSearchToolbar()\"\n            [ngTemplateOutletContext]=\"{ result: result }\"\n          />\n        </igo-search-results-item>\n      }\n\n      @if (isMoreResults(group)) {\n        <span class=\"moreResults\" (click)=\"displayMoreResults(group)\">\n          <u>{{ 'igo.geo.search.displayMoreResults' | translate }}</u>\n        </span>\n      }\n    </ng-template>\n  </igo-list>\n}\n", styles: [":host .moreResults{cursor:pointer;color:#00f;float:right;margin-right:10px;margin-top:5px}:host igo-list ::ng-deep mat-list{height:100%}:host igo-list ::ng-deep mat-list .custom-tabs-view .mat-mdc-tab-header-pagination{min-width:20px}\n"], dependencies: [{ kind: "component", type: ListComponent, selector: "igo-list", inputs: ["navigation", "selection"] }, { kind: "component", type: CollapsibleComponent, selector: "igo-collapsible", inputs: ["title", "collapsed"], outputs: ["collapsedChange", "toggle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SearchResultsItemComponent, selector: "igo-search-results-item", inputs: ["result", "map", "showIcons", "withZoomButton"], outputs: ["zoomEvent"] }, { kind: "directive", type: ListItemDirective, selector: "[igoListItem]", inputs: ["color", "focused", "selected", "disabled"], outputs: ["beforeSelect", "beforeFocus", "beforeUnselect", "beforeUnfocus", "beforeDisable", "beforeEnable", "focus", "unfocus", "select", "unselect", "disable", "enable"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i1$5.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i1$5.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SearchResultsComponent, isStandalone: true, selector: "igo-search-results", inputs: { map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: false, transformFunction: null }, store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: true, transformFunction: null }, showIcons: { classPropertyName: "showIcons", publicName: "showIcons", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, withZoomButton: { classPropertyName: "withZoomButton", publicName: "withZoomButton", isSignal: true, isRequired: false, transformFunction: null }, tabsMode: { classPropertyName: "tabsMode", publicName: "tabsMode", isSignal: true, isRequired: false, transformFunction: null }, term: { classPropertyName: "term", publicName: "term", isSignal: false, isRequired: false, transformFunction: null }, termSplitter: { classPropertyName: "termSplitter", publicName: "termSplitter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { resultFocus: "resultFocus", resultUnfocus: "resultUnfocus", resultSelect: "resultSelect", moreResults: "moreResults", resultMouseenter: "resultMouseenter", resultMouseleave: "resultMouseleave" }, queries: [{ propertyName: "templateSearchToolbar", first: true, predicate: ["igoSearchItemToolbar"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (tabsMode() === false) {\n  <igo-list [navigation]=\"true\">\n    @for (group of results$ | async; track group) {\n      @if (mode() === searchResultMode.Grouped) {\n        <igo-collapsible\n          [class]=\"group.source.getId()\"\n          [title]=\"computeGroupTitle(group)\"\n          [collapsed]=\"collapsed[group.source.title]\"\n          (toggle)=\"collapsed[group.source.title] = $event\"\n        >\n          <ng-container\n            *ngTemplateOutlet=\"\n              storeItemTemplate;\n              context: { results: group.results }\n            \"\n          />\n        </igo-collapsible>\n      } @else {\n        <ng-container\n          *ngTemplateOutlet=\"\n            storeItemTemplate;\n            context: { results: group.results }\n          \"\n        />\n      }\n\n      <ng-template #storeItemTemplate let-results=\"results\">\n        @for (result of results; track result) {\n          <igo-search-results-item\n            igoListItem\n            color=\"accent\"\n            [map]=\"map()\"\n            [result]=\"result\"\n            [showIcons]=\"showIcons()\"\n            [withZoomButton]=\"withZoomButton()\"\n            [focused]=\"store().state.get(result).focused\"\n            [selected]=\"store().state.get(result).selected\"\n            (focus)=\"resultFocus.emit(result)\"\n            (unfocus)=\"resultUnfocus.emit(result)\"\n            (select)=\"onResultSelect(result)\"\n            (mouseenter)=\"resultFocus.emit(result)\"\n            (mouseleave)=\"resultUnfocus.emit(result)\"\n          >\n            <ng-container\n              igoSearchItemToolbar\n              [ngTemplateOutlet]=\"templateSearchToolbar()\"\n              [ngTemplateOutletContext]=\"{ result: result }\"\n            />\n          </igo-search-results-item>\n        }\n        @if (isMoreResults(group)) {\n          <span class=\"moreResults\" (click)=\"displayMoreResults(group)\">\n            <u>{{ 'igo.geo.search.displayMoreResults' | translate }}</u>\n          </span>\n        }\n      </ng-template>\n    }\n  </igo-list>\n}\n\n@if (tabsMode()) {\n  <igo-list [navigation]=\"true\">\n    @if (mode() === searchResultMode.Grouped) {\n      <mat-tab-group class=\"custom-tabs-view\" dynamicHeight>\n        @for (group of results$ | async; track group) {\n          <mat-tab [label]=\"computeGroupTitle(group)\">\n            <ng-container\n              *ngTemplateOutlet=\"\n                storeItemTemplateGroup;\n                context: { group: group }\n              \"\n            />\n          </mat-tab>\n        }\n      </mat-tab-group>\n    } @else {\n      @for (group of results$ | async; track group) {\n        <ng-container\n          *ngTemplateOutlet=\"storeItemTemplateGroup; context: { group: group }\"\n        />\n      }\n    }\n\n    <ng-template #storeItemTemplateGroup let-group=\"group\">\n      @for (result of group.results; track result) {\n        <igo-search-results-item\n          igoListItem\n          color=\"accent\"\n          [map]=\"map()\"\n          [result]=\"result\"\n          [showIcons]=\"showIcons()\"\n          [withZoomButton]=\"withZoomButton()\"\n          [focused]=\"store().state.get(result).focused\"\n          [selected]=\"store().state.get(result).selected\"\n          (focus)=\"resultFocus.emit(result)\"\n          (unfocus)=\"resultUnfocus.emit(result)\"\n          (select)=\"onResultSelect(result)\"\n          (mouseenter)=\"resultFocus.emit(result)\"\n          (mouseleave)=\"resultUnfocus.emit(result)\"\n        >\n          <ng-container\n            igoSearchItemToolbar\n            [ngTemplateOutlet]=\"templateSearchToolbar()\"\n            [ngTemplateOutletContext]=\"{ result: result }\"\n          />\n        </igo-search-results-item>\n      }\n\n      @if (isMoreResults(group)) {\n        <span class=\"moreResults\" (click)=\"displayMoreResults(group)\">\n          <u>{{ 'igo.geo.search.displayMoreResults' | translate }}</u>\n        </span>\n      }\n    </ng-template>\n  </igo-list>\n}\n", styles: [":host .moreResults{cursor:pointer;color:#00f;float:right;margin-right:10px;margin-top:5px}:host igo-list ::ng-deep mat-list{height:100%}:host igo-list ::ng-deep mat-list .custom-tabs-view .mat-mdc-tab-header-pagination{min-width:20px}\n"], dependencies: [{ kind: "component", type: ListComponent, selector: "igo-list", inputs: ["navigation", "selection"] }, { kind: "component", type: CollapsibleComponent, selector: "igo-collapsible", inputs: ["title", "collapsed"], outputs: ["collapsedChange", "toggle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SearchResultsItemComponent, selector: "igo-search-results-item", inputs: ["result", "map", "showIcons", "withZoomButton"], outputs: ["zoomEvent"] }, { kind: "directive", type: ListItemDirective, selector: "[igoListItem]", inputs: ["color", "focused", "selected", "disabled"], outputs: ["beforeSelect", "beforeFocus", "beforeUnselect", "beforeUnfocus", "beforeDisable", "beforeEnable", "focus", "unfocus", "select", "unselect", "disable", "enable"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i1$4.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i1$4.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SearchResultsComponent, decorators: [{
             type: Component,
@@ -39479,7 +39503,7 @@ class AddCatalogDialogComponent {
             .every((e) => e);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: AddCatalogDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: AddCatalogDialogComponent, isStandalone: true, selector: "igo-add-catalog-dialog", ngImport: i0, template: "<h4>{{ 'igo.geo.catalog.library.addBtn' | translate }}</h4>\n\n<ng-template #customTab>\n  @let form = customForm$ | async;\n\n  @if (form) {\n    <igo-form\n      [form]=\"form\"\n      [formData]=\"$any(customData$ | async)\"\n      (submitForm)=\"onCustomSubmit($any($event))\"\n    >\n      @if (form.fields.length) {\n        <div class=\"form-container\">\n          @for (field of form.fields; track field) {\n            <igo-form-field [field]=\"field\" />\n          }\n        </div>\n      }\n      <div formButtons class=\"actions-container\">\n        <button\n          matButton=\"outlined\"\n          type=\"button\"\n          color=\"primary\"\n          (click)=\"dialogRef.close()\"\n        >\n          {{ 'igo.geo.catalog.library.cancel' | translate }}\n        </button>\n        <button matButton=\"filled\" type=\"submit\" color=\"primary\">\n          {{ 'igo.geo.catalog.library.add' | translate }}\n        </button>\n      </div>\n    </igo-form>\n  }\n</ng-template>\n\n@if (data.predefinedCatalogs.length) {\n  <mat-tab-group\n    [selectedIndex]=\"\n      !data.addedCatalog ||\n      (data.error && data.isPredefinedCatalog && data.predefinedCatalogs.length)\n        ? 0\n        : 1\n    \"\n  >\n    <mat-tab [label]=\"'igo.geo.catalog.library.predefined' | translate\">\n      @let form = predefinedForm$ | async;\n\n      @if (form) {\n        <igo-form\n          [form]=\"form\"\n          [formData]=\"$any(data$ | async)\"\n          (submitForm)=\"onPredefinedSubmit($any($event))\"\n        >\n          @if (form.fields.length) {\n            <div class=\"form-container\">\n              @for (field of form.fields; track field) {\n                <igo-form-field [field]=\"field\" />\n              }\n            </div>\n          }\n          <div formButtons class=\"actions-container\">\n            <button\n              matButton=\"outlined\"\n              type=\"button\"\n              color=\"primary\"\n              (click)=\"dialogRef.close()\"\n            >\n              {{ 'igo.geo.catalog.library.cancel' | translate }}\n            </button>\n            <button matButton=\"filled\" type=\"submit\" color=\"primary\">\n              {{ 'igo.geo.catalog.library.add' | translate }}\n            </button>\n          </div>\n        </igo-form>\n      }\n    </mat-tab>\n\n    <mat-tab [label]=\"'igo.geo.catalog.library.custom' | translate\">\n      <ng-container *ngTemplateOutlet=\"customTab\" />\n    </mat-tab>\n  </mat-tab-group>\n} @else {\n  <ng-container *ngTemplateOutlet=\"customTab\" />\n}\n\n@if (data.error && data.addedCatalog) {\n  <p class=\"error\">\n    {{\n      emailAddress\n        ? languageService.translate.instant(\n            'igo.geo.catalog.externalProvider.unavailableWithEmail',\n            { value: data.addedCatalog.url, email: emailAddress }\n          )\n        : languageService.translate.instant('igo.geo.catalog.unavailable', {\n            value: data.addedCatalog.url\n          })\n    }}\n  </p>\n}\n", styles: ["h4{padding:0 12px}mat-tab-group{padding:12px}igo-form{overflow:hidden;padding:0 12px 12px}.actions-container{display:flex;justify-content:flex-end;column-gap:8px}.form-container{width:100%;height:auto;padding-top:12px}.form-container igo-form-field{display:block;height:auto}.error{overflow-wrap:break-word;padding:0 20px;color:red}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i1$5.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i1$5.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "component", type: FormComponent, selector: "igo-form", inputs: ["form", "formData", "autocomplete"], outputs: ["submitForm"] }, { kind: "component", type: FormFieldComponent, selector: "igo-form-field", inputs: ["field"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: AddCatalogDialogComponent, isStandalone: true, selector: "igo-add-catalog-dialog", ngImport: i0, template: "<h4>{{ 'igo.geo.catalog.library.addBtn' | translate }}</h4>\n\n<ng-template #customTab>\n  @let form = customForm$ | async;\n\n  @if (form) {\n    <igo-form\n      [form]=\"form\"\n      [formData]=\"$any(customData$ | async)\"\n      (submitForm)=\"onCustomSubmit($any($event))\"\n    >\n      @if (form.fields.length) {\n        <div class=\"form-container\">\n          @for (field of form.fields; track field) {\n            <igo-form-field [field]=\"field\" />\n          }\n        </div>\n      }\n      <div formButtons class=\"actions-container\">\n        <button\n          matButton=\"outlined\"\n          type=\"button\"\n          color=\"primary\"\n          (click)=\"dialogRef.close()\"\n        >\n          {{ 'igo.geo.catalog.library.cancel' | translate }}\n        </button>\n        <button matButton=\"filled\" type=\"submit\" color=\"primary\">\n          {{ 'igo.geo.catalog.library.add' | translate }}\n        </button>\n      </div>\n    </igo-form>\n  }\n</ng-template>\n\n@if (data.predefinedCatalogs.length) {\n  <mat-tab-group\n    [selectedIndex]=\"\n      !data.addedCatalog ||\n      (data.error && data.isPredefinedCatalog && data.predefinedCatalogs.length)\n        ? 0\n        : 1\n    \"\n  >\n    <mat-tab [label]=\"'igo.geo.catalog.library.predefined' | translate\">\n      @let form = predefinedForm$ | async;\n\n      @if (form) {\n        <igo-form\n          [form]=\"form\"\n          [formData]=\"$any(data$ | async)\"\n          (submitForm)=\"onPredefinedSubmit($any($event))\"\n        >\n          @if (form.fields.length) {\n            <div class=\"form-container\">\n              @for (field of form.fields; track field) {\n                <igo-form-field [field]=\"field\" />\n              }\n            </div>\n          }\n          <div formButtons class=\"actions-container\">\n            <button\n              matButton=\"outlined\"\n              type=\"button\"\n              color=\"primary\"\n              (click)=\"dialogRef.close()\"\n            >\n              {{ 'igo.geo.catalog.library.cancel' | translate }}\n            </button>\n            <button matButton=\"filled\" type=\"submit\" color=\"primary\">\n              {{ 'igo.geo.catalog.library.add' | translate }}\n            </button>\n          </div>\n        </igo-form>\n      }\n    </mat-tab>\n\n    <mat-tab [label]=\"'igo.geo.catalog.library.custom' | translate\">\n      <ng-container *ngTemplateOutlet=\"customTab\" />\n    </mat-tab>\n  </mat-tab-group>\n} @else {\n  <ng-container *ngTemplateOutlet=\"customTab\" />\n}\n\n@if (data.error && data.addedCatalog) {\n  <p class=\"error\">\n    {{\n      emailAddress\n        ? languageService.translate.instant(\n            'igo.geo.catalog.externalProvider.unavailableWithEmail',\n            { value: data.addedCatalog.url, email: emailAddress }\n          )\n        : languageService.translate.instant('igo.geo.catalog.unavailable', {\n            value: data.addedCatalog.url\n          })\n    }}\n  </p>\n}\n", styles: ["h4{padding:0 12px}mat-tab-group{padding:12px}igo-form{overflow:hidden;padding:0 12px 12px}.actions-container{display:flex;justify-content:flex-end;column-gap:8px}.form-container{width:100%;height:auto;padding-top:12px}.form-container igo-form-field{display:block;height:auto}.error{overflow-wrap:break-word;padding:0 20px;color:red}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i1$4.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i1$4.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "component", type: FormComponent, selector: "igo-form", inputs: ["form", "formData", "autocomplete"], outputs: ["submitForm"] }, { kind: "component", type: FormFieldComponent, selector: "igo-form-field", inputs: ["field"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: AddCatalogDialogComponent, decorators: [{
             type: Component,
@@ -39883,7 +39907,7 @@ let GeometryFormFieldComponent = class GeometryFormFieldComponent {
         this.value$$.unsubscribe();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: GeometryFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: GeometryFormFieldComponent, isStandalone: true, selector: "igo-geometry-form-field", inputs: { formControl: { classPropertyName: "formControl", publicName: "formControl", isSignal: true, isRequired: false, transformFunction: null }, map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: true, transformFunction: null }, geometryType: { classPropertyName: "geometryType", publicName: "geometryType", isSignal: false, isRequired: false, transformFunction: null }, geometryTypeField: { classPropertyName: "geometryTypeField", publicName: "geometryTypeField", isSignal: true, isRequired: false, transformFunction: null }, geometryTypes: { classPropertyName: "geometryTypes", publicName: "geometryTypes", isSignal: true, isRequired: false, transformFunction: null }, drawGuideField: { classPropertyName: "drawGuideField", publicName: "drawGuideField", isSignal: true, isRequired: false, transformFunction: null }, drawGuide: { classPropertyName: "drawGuide", publicName: "drawGuide", isSignal: false, isRequired: false, transformFunction: null }, drawGuidePlaceholder: { classPropertyName: "drawGuidePlaceholder", publicName: "drawGuidePlaceholder", isSignal: true, isRequired: false, transformFunction: null }, measure: { classPropertyName: "measure", publicName: "measure", isSignal: true, isRequired: false, transformFunction: null }, controlOptions: { classPropertyName: "controlOptions", publicName: "controlOptions", isSignal: true, isRequired: false, transformFunction: null }, drawStyle: { classPropertyName: "drawStyle", publicName: "drawStyle", isSignal: true, isRequired: false, transformFunction: null }, overlayStyle: { classPropertyName: "overlayStyle", publicName: "overlayStyle", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<igo-geometry-form-field-input\n  [formControl]=\"formControl()!\"\n  [map]=\"map()!\"\n  [geometryType]=\"(geometryType$ | async)!\"\n  [drawGuide]=\"(drawGuide$ | async)!\"\n  [measure]=\"measure()\"\n  [drawControlIsActive]=\"drawControlIsActive\"\n  [freehandDrawIsActive]=\"freehandDrawIsActive\"\n  [controlOptions]=\"controlOptions()\"\n  [drawStyle]=\"drawStyle()!\"\n  [overlayStyle]=\"overlayStyle()!\"\n/>\n\n@if (geometryTypeField()) {\n  <div class=\"geometry-type-toggle\">\n    <mat-button-toggle-group\n      [disabled]=\"(value$ | async) !== undefined\"\n      [(ngModel)]=\"geometryType\"\n    >\n      <mat-button-toggle\n        value=\"Point\"\n        [disabled]=\"geometryTypes().indexOf('Point') < 0\"\n      >\n        {{ 'igo.geo.geometry.point' | translate }}\n      </mat-button-toggle>\n      <mat-button-toggle\n        value=\"LineString\"\n        [disabled]=\"geometryTypes().indexOf('LineString') < 0\"\n      >\n        {{ 'igo.geo.geometry.line' | translate }}\n      </mat-button-toggle>\n      <mat-button-toggle\n        value=\"Polygon\"\n        [disabled]=\"geometryTypes().indexOf('Polygon') < 0\"\n      >\n        {{ 'igo.geo.geometry.polygon' | translate }}\n      </mat-button-toggle>\n    </mat-button-toggle-group>\n  </div>\n}\n\n@if (drawGuideField()) {\n  <mat-form-field class=\"draw-guide-field\">\n    <input\n      matInput\n      type=\"number\"\n      [placeholder]=\"drawGuidePlaceholder()\"\n      [(ngModel)]=\"drawGuide\"\n    />\n    <mat-icon matPrefix [color]=\"'primary'\">adjust</mat-icon>\n    <span matSuffix class=\"draw-guide-units\">{{\n      'igo.geo.measure.meters' | translate\n    }}</span>\n  </mat-form-field>\n}\n", styles: [":host{display:block;width:100%}.geometry-type-toggle,.draw-guide-field{width:100%}.geometry-type-toggle{padding:10px;text-align:center}.draw-guide-field mat-icon{margin:0 10px}.draw-guide-units{padding:10px}\n"], dependencies: [{ kind: "component", type: GeometryFormFieldInputComponent, selector: "igo-geometry-form-field-input", inputs: ["map", "geometryType", "drawGuide", "measure", "drawControlIsActive", "freehandDrawIsActive", "predefinedRadius", "controlOptions", "drawStyle", "overlayStyle", "value", "radius"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$4.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$4.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i3$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: GeometryFormFieldComponent, isStandalone: true, selector: "igo-geometry-form-field", inputs: { formControl: { classPropertyName: "formControl", publicName: "formControl", isSignal: true, isRequired: false, transformFunction: null }, map: { classPropertyName: "map", publicName: "map", isSignal: true, isRequired: true, transformFunction: null }, geometryType: { classPropertyName: "geometryType", publicName: "geometryType", isSignal: false, isRequired: false, transformFunction: null }, geometryTypeField: { classPropertyName: "geometryTypeField", publicName: "geometryTypeField", isSignal: true, isRequired: false, transformFunction: null }, geometryTypes: { classPropertyName: "geometryTypes", publicName: "geometryTypes", isSignal: true, isRequired: false, transformFunction: null }, drawGuideField: { classPropertyName: "drawGuideField", publicName: "drawGuideField", isSignal: true, isRequired: false, transformFunction: null }, drawGuide: { classPropertyName: "drawGuide", publicName: "drawGuide", isSignal: false, isRequired: false, transformFunction: null }, drawGuidePlaceholder: { classPropertyName: "drawGuidePlaceholder", publicName: "drawGuidePlaceholder", isSignal: true, isRequired: false, transformFunction: null }, measure: { classPropertyName: "measure", publicName: "measure", isSignal: true, isRequired: false, transformFunction: null }, controlOptions: { classPropertyName: "controlOptions", publicName: "controlOptions", isSignal: true, isRequired: false, transformFunction: null }, drawStyle: { classPropertyName: "drawStyle", publicName: "drawStyle", isSignal: true, isRequired: false, transformFunction: null }, overlayStyle: { classPropertyName: "overlayStyle", publicName: "overlayStyle", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<igo-geometry-form-field-input\n  [formControl]=\"formControl()!\"\n  [map]=\"map()!\"\n  [geometryType]=\"(geometryType$ | async)!\"\n  [drawGuide]=\"(drawGuide$ | async)!\"\n  [measure]=\"measure()\"\n  [drawControlIsActive]=\"drawControlIsActive\"\n  [freehandDrawIsActive]=\"freehandDrawIsActive\"\n  [controlOptions]=\"controlOptions()\"\n  [drawStyle]=\"drawStyle()!\"\n  [overlayStyle]=\"overlayStyle()!\"\n/>\n\n@if (geometryTypeField()) {\n  <div class=\"geometry-type-toggle\">\n    <mat-button-toggle-group\n      [disabled]=\"(value$ | async) !== undefined\"\n      [(ngModel)]=\"geometryType\"\n    >\n      <mat-button-toggle\n        value=\"Point\"\n        [disabled]=\"geometryTypes().indexOf('Point') < 0\"\n      >\n        {{ 'igo.geo.geometry.point' | translate }}\n      </mat-button-toggle>\n      <mat-button-toggle\n        value=\"LineString\"\n        [disabled]=\"geometryTypes().indexOf('LineString') < 0\"\n      >\n        {{ 'igo.geo.geometry.line' | translate }}\n      </mat-button-toggle>\n      <mat-button-toggle\n        value=\"Polygon\"\n        [disabled]=\"geometryTypes().indexOf('Polygon') < 0\"\n      >\n        {{ 'igo.geo.geometry.polygon' | translate }}\n      </mat-button-toggle>\n    </mat-button-toggle-group>\n  </div>\n}\n\n@if (drawGuideField()) {\n  <mat-form-field class=\"draw-guide-field\">\n    <input\n      matInput\n      type=\"number\"\n      [placeholder]=\"drawGuidePlaceholder()\"\n      [(ngModel)]=\"drawGuide\"\n    />\n    <mat-icon matPrefix [color]=\"'primary'\">adjust</mat-icon>\n    <span matSuffix class=\"draw-guide-units\">{{\n      'igo.geo.measure.meters' | translate\n    }}</span>\n  </mat-form-field>\n}\n", styles: [":host{display:block;width:100%}.geometry-type-toggle,.draw-guide-field{width:100%}.geometry-type-toggle{padding:10px;text-align:center}.draw-guide-field mat-icon{margin:0 10px}.draw-guide-units{padding:10px}\n"], dependencies: [{ kind: "component", type: GeometryFormFieldInputComponent, selector: "igo-geometry-form-field-input", inputs: ["map", "geometryType", "drawGuide", "measure", "drawControlIsActive", "freehandDrawIsActive", "predefinedRadius", "controlOptions", "drawStyle", "overlayStyle", "value", "radius"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$3.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$3.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i3$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 GeometryFormFieldComponent = __decorate([
     IgoFormFieldComponent('geometry')
@@ -40288,7 +40312,7 @@ class PrintFormComponent {
         this.commentField.updateValueAndValidity();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: PrintFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: PrintFormComponent, isStandalone: true, selector: "igo-print-form", inputs: { disabled$: { classPropertyName: "disabled$", publicName: "disabled$", isSignal: true, isRequired: false, transformFunction: null }, imageFormat: { classPropertyName: "imageFormat", publicName: "imageFormat", isSignal: false, isRequired: false, transformFunction: null }, outputFormat: { classPropertyName: "outputFormat", publicName: "outputFormat", isSignal: false, isRequired: false, transformFunction: null }, paperFormat: { classPropertyName: "paperFormat", publicName: "paperFormat", isSignal: false, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: false, isRequired: false, transformFunction: null }, resolution: { classPropertyName: "resolution", publicName: "resolution", isSignal: false, isRequired: false, transformFunction: null }, legendPosition: { classPropertyName: "legendPosition", publicName: "legendPosition", isSignal: false, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: false, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: false, isRequired: false, transformFunction: null }, comment: { classPropertyName: "comment", publicName: "comment", isSignal: false, isRequired: false, transformFunction: null }, showProjection: { classPropertyName: "showProjection", publicName: "showProjection", isSignal: false, isRequired: false, transformFunction: null }, showScale: { classPropertyName: "showScale", publicName: "showScale", isSignal: false, isRequired: false, transformFunction: null }, showLegend: { classPropertyName: "showLegend", publicName: "showLegend", isSignal: false, isRequired: false, transformFunction: null }, doZipFile: { classPropertyName: "doZipFile", publicName: "doZipFile", isSignal: false, isRequired: false, transformFunction: null }, showNorth: { classPropertyName: "showNorth", publicName: "showNorth", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { submit: "submit" }, providers: [SecureImagePipe], ngImport: i0, template: "<form class=\"igo-form\" [formGroup]=\"form\">\n  <div class=\"igo-input-container\">\n    <mat-form-field>\n      <mat-label>{{ 'igo.geo.printForm.title' | translate }}</mat-label>\n      <input\n        matInput\n        formControlName=\"title\"\n        placeholder=\"{{ 'igo.geo.printForm.title' | translate }}\"\n      />\n      @if (titleField.errors?.maxlength) {\n        <mat-error>{{\n          'igo.geo.formValidation.maxLength'\n            | translate\n              : {\n                  column: 'igo.geo.printForm.title' | translate,\n                  value: 130\n                }\n        }}</mat-error>\n      }\n    </mat-form-field>\n  </div>\n  <div class=\"igo-input-container\">\n    <mat-form-field>\n      <mat-label>{{ 'igo.geo.printForm.subtitle' | translate }}</mat-label>\n      <input\n        matInput\n        formControlName=\"subtitle\"\n        placeholder=\"{{ 'igo.geo.printForm.subtitle' | translate }}\"\n      />\n      @if (subtitleField.errors?.maxlength) {\n        <mat-error>{{\n          'igo.geo.formValidation.maxLength'\n            | translate\n              : {\n                  column: 'igo.geo.printForm.subtitle' | translate,\n                  value: 120\n                }\n        }}</mat-error>\n      }\n    </mat-form-field>\n  </div>\n  <div class=\"igo-input-container\">\n    <mat-form-field>\n      <mat-label>{{ 'igo.geo.printForm.comment' | translate }}</mat-label>\n      <input\n        matInput\n        formControlName=\"comment\"\n        placeholder=\"{{ 'igo.geo.printForm.comment' | translate }}\"\n      />\n      @if (commentField.errors?.maxlength) {\n        <mat-error>{{\n          'igo.geo.formValidation.maxLength'\n            | translate\n              : {\n                  column: 'igo.geo.printForm.comment' | translate,\n                  value: maxLength\n                }\n        }}</mat-error>\n      }\n    </mat-form-field>\n  </div>\n\n  <div class=\"igo-input-container slide-toggle-container\">\n    <div class=\"print-slide-toggle-container\">\n      <mat-slide-toggle\n        class=\"print-option\"\n        formControlName=\"showProjection\"\n        [labelPosition]=\"'before'\"\n      >\n        {{ 'igo.geo.printForm.showProjection' | translate }}\n      </mat-slide-toggle>\n      <mat-slide-toggle\n        class=\"print-option\"\n        formControlName=\"showScale\"\n        [labelPosition]=\"'before'\"\n      >\n        {{ 'igo.geo.printForm.showScale' | translate }}\n      </mat-slide-toggle>\n      <mat-slide-toggle\n        class=\"print-option\"\n        formControlName=\"doZipFile\"\n        [labelPosition]=\"'before'\"\n        [style.display]=\"isPrintService ? 'none' : ''\"\n      >\n        {{ 'igo.geo.printForm.doZipFile' | translate }}\n      </mat-slide-toggle>\n      <mat-slide-toggle\n        class=\"print-option\"\n        formControlName=\"showNorthArrow\"\n        [labelPosition]=\"'before'\"\n      >\n        {{ 'igo.geo.printForm.showNorthArrow' | translate }}\n      </mat-slide-toggle>\n    </div>\n  </div>\n\n  <div class=\"igo-input-container\">\n    <mat-form-field>\n      <mat-label>{{\n        'igo.geo.printForm.legendPosition' | translate\n      }}</mat-label>\n      <mat-select\n        formControlName=\"legendPosition\"\n        placeholder=\"{{ 'igo.geo.printForm.legendPosition' | translate }}\"\n      >\n        @for (\n          legendPosition of legendPositions | keyvalue;\n          track legendPosition\n        ) {\n          <mat-option [value]=\"legendPosition.key\">\n            @if (!['newpage', 'newimage'].includes(legendPosition.value)) {\n              {{\n                'igo.geo.printForm.legendPositions.' + legendPosition.value\n                  | translate\n              }}\n            }\n            @if (['newpage', 'newimage'].includes(legendPosition.value)) {\n              {{\n                (outputFormat === 'Pdf'\n                  ? 'igo.geo.printForm.legendPositions.newpage'\n                  : 'igo.geo.printForm.legendPositions.newimage'\n                ) | translate\n              }}\n            }\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n\n  <div class=\"igo-input-container\">\n    <mat-form-field>\n      <mat-label>{{ 'igo.geo.printForm.outputFormat' | translate }}</mat-label>\n      <mat-select\n        (selectionChange)=\"toggleImageSaveProp()\"\n        formControlName=\"outputFormat\"\n        placeholder=\"{{ 'igo.geo.printForm.outputFormat' | translate }}\"\n      >\n        @for (outputFormat of outputFormats | keyvalue; track outputFormat) {\n          <mat-option [value]=\"outputFormat.key\">\n            {{ outputFormat.value }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n\n  <div\n    class=\"igo-input-container\"\n    [style.display]=\"isPrintService ? 'block' : 'none'\"\n  >\n    <mat-form-field>\n      <mat-label>{{ 'igo.geo.printForm.paperFormat' | translate }}</mat-label>\n      <mat-select\n        (selectionChange)=\"changeCommentLength()\"\n        formControlName=\"paperFormat\"\n        placeholder=\"{{ 'igo.geo.printForm.paperFormat' | translate }}\"\n      >\n        @for (paperFormat of paperFormats | keyvalue; track paperFormat) {\n          <mat-option [value]=\"paperFormat.key\">\n            {{\n              'igo.geo.printForm.paperFormats.' + paperFormat.value | translate\n            }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n\n  <div\n    class=\"igo-input-container\"\n    [style.display]=\"isPrintService ? 'none' : 'block'\"\n  >\n    <mat-form-field>\n      <mat-label>{{ 'igo.geo.printForm.imageFormat' | translate }}</mat-label>\n      <mat-select\n        formControlName=\"imageFormat\"\n        placeholder=\"{{ 'igo.geo.printForm.imageFormat' | translate }}\"\n      >\n        @for (imageFormat of imageFormats | keyvalue; track imageFormat) {\n          <mat-option [value]=\"imageFormat.key\">\n            {{ imageFormat.value }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n\n  <div class=\"igo-input-container\">\n    <mat-form-field>\n      <mat-label\n        >{{ 'igo.geo.printForm.resolution' | translate }} ({{\n          'igo.geo.printForm.resolutionUnit' | translate\n        }})</mat-label\n      >\n      <mat-select\n        formControlName=\"resolution\"\n        placeholder=\"{{ 'igo.geo.printForm.resolution' | translate }}\"\n      >\n        @for (resolution of resolutions; track resolution) {\n          <mat-option [value]=\"resolution\">\n            {{ resolution }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n\n  <div\n    class=\"igo-input-container\"\n    [style.display]=\"isPrintService ? 'block' : 'none'\"\n  >\n    <mat-form-field>\n      <mat-label>{{ 'igo.geo.printForm.orientation' | translate }}</mat-label>\n      <mat-select\n        (selectionChange)=\"changeCommentLength()\"\n        formControlName=\"orientation\"\n        placeholder=\"{{ 'igo.geo.printForm.orientation' | translate }}\"\n      >\n        @for (orientation of orientations | keyvalue; track orientation) {\n          <mat-option [value]=\"orientation.key\">\n            {{ 'igo.geo.printForm.' + orientation.value | translate }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n\n  <div class=\"igo-form-button-group print-button-top-padding\">\n    <button\n      matButton=\"elevated\"\n      type=\"button\"\n      [disabled]=\"!form.valid || (disabled$() | async)\"\n      (click)=\"handleFormSubmit(form.value, form.valid)\"\n    >\n      {{ 'igo.geo.printForm.saveBtn' | translate }}\n    </button>\n  </div>\n</form>\n", styles: [":host mat-form-field{width:100%}:host .slide-toggle-container{margin-bottom:16px}:host .print-slide-toggle-container mat-slide-toggle{width:100%;padding:0 8px}:host .print-slide-toggle-container mat-slide-toggle ::ng-deep .mdc-form-field{width:100%}:host .print-slide-toggle-container mat-slide-toggle ::ng-deep .mdc-label{margin-left:0;width:calc(100% - 60px)}:host .print-option{display:block;margin-bottom:12px}:host .igo-form{padding:16px}:host .igo-form-button-group{text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i1$3.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: PrintFormComponent, isStandalone: true, selector: "igo-print-form", inputs: { disabled$: { classPropertyName: "disabled$", publicName: "disabled$", isSignal: true, isRequired: false, transformFunction: null }, imageFormat: { classPropertyName: "imageFormat", publicName: "imageFormat", isSignal: false, isRequired: false, transformFunction: null }, outputFormat: { classPropertyName: "outputFormat", publicName: "outputFormat", isSignal: false, isRequired: false, transformFunction: null }, paperFormat: { classPropertyName: "paperFormat", publicName: "paperFormat", isSignal: false, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: false, isRequired: false, transformFunction: null }, resolution: { classPropertyName: "resolution", publicName: "resolution", isSignal: false, isRequired: false, transformFunction: null }, legendPosition: { classPropertyName: "legendPosition", publicName: "legendPosition", isSignal: false, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: false, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: false, isRequired: false, transformFunction: null }, comment: { classPropertyName: "comment", publicName: "comment", isSignal: false, isRequired: false, transformFunction: null }, showProjection: { classPropertyName: "showProjection", publicName: "showProjection", isSignal: false, isRequired: false, transformFunction: null }, showScale: { classPropertyName: "showScale", publicName: "showScale", isSignal: false, isRequired: false, transformFunction: null }, showLegend: { classPropertyName: "showLegend", publicName: "showLegend", isSignal: false, isRequired: false, transformFunction: null }, doZipFile: { classPropertyName: "doZipFile", publicName: "doZipFile", isSignal: false, isRequired: false, transformFunction: null }, showNorth: { classPropertyName: "showNorth", publicName: "showNorth", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { submit: "submit" }, providers: [SecureImagePipe], ngImport: i0, template: "<form class=\"igo-form\" [formGroup]=\"form\">\n  <div class=\"igo-input-container\">\n    <mat-form-field>\n      <mat-label>{{ 'igo.geo.printForm.title' | translate }}</mat-label>\n      <input\n        matInput\n        formControlName=\"title\"\n        placeholder=\"{{ 'igo.geo.printForm.title' | translate }}\"\n      />\n      @if (titleField.errors?.maxlength) {\n        <mat-error>{{\n          'igo.geo.formValidation.maxLength'\n            | translate\n              : {\n                  column: 'igo.geo.printForm.title' | translate,\n                  value: 130\n                }\n        }}</mat-error>\n      }\n    </mat-form-field>\n  </div>\n  <div class=\"igo-input-container\">\n    <mat-form-field>\n      <mat-label>{{ 'igo.geo.printForm.subtitle' | translate }}</mat-label>\n      <input\n        matInput\n        formControlName=\"subtitle\"\n        placeholder=\"{{ 'igo.geo.printForm.subtitle' | translate }}\"\n      />\n      @if (subtitleField.errors?.maxlength) {\n        <mat-error>{{\n          'igo.geo.formValidation.maxLength'\n            | translate\n              : {\n                  column: 'igo.geo.printForm.subtitle' | translate,\n                  value: 120\n                }\n        }}</mat-error>\n      }\n    </mat-form-field>\n  </div>\n  <div class=\"igo-input-container\">\n    <mat-form-field>\n      <mat-label>{{ 'igo.geo.printForm.comment' | translate }}</mat-label>\n      <input\n        matInput\n        formControlName=\"comment\"\n        placeholder=\"{{ 'igo.geo.printForm.comment' | translate }}\"\n      />\n      @if (commentField.errors?.maxlength) {\n        <mat-error>{{\n          'igo.geo.formValidation.maxLength'\n            | translate\n              : {\n                  column: 'igo.geo.printForm.comment' | translate,\n                  value: maxLength\n                }\n        }}</mat-error>\n      }\n    </mat-form-field>\n  </div>\n\n  <div class=\"igo-input-container slide-toggle-container\">\n    <div class=\"print-slide-toggle-container\">\n      <mat-slide-toggle\n        class=\"print-option\"\n        formControlName=\"showProjection\"\n        [labelPosition]=\"'before'\"\n      >\n        {{ 'igo.geo.printForm.showProjection' | translate }}\n      </mat-slide-toggle>\n      <mat-slide-toggle\n        class=\"print-option\"\n        formControlName=\"showScale\"\n        [labelPosition]=\"'before'\"\n      >\n        {{ 'igo.geo.printForm.showScale' | translate }}\n      </mat-slide-toggle>\n      <mat-slide-toggle\n        class=\"print-option\"\n        formControlName=\"doZipFile\"\n        [labelPosition]=\"'before'\"\n        [style.display]=\"isPrintService ? 'none' : ''\"\n      >\n        {{ 'igo.geo.printForm.doZipFile' | translate }}\n      </mat-slide-toggle>\n      <mat-slide-toggle\n        class=\"print-option\"\n        formControlName=\"showNorthArrow\"\n        [labelPosition]=\"'before'\"\n      >\n        {{ 'igo.geo.printForm.showNorthArrow' | translate }}\n      </mat-slide-toggle>\n    </div>\n  </div>\n\n  <div class=\"igo-input-container\">\n    <mat-form-field>\n      <mat-label>{{\n        'igo.geo.printForm.legendPosition' | translate\n      }}</mat-label>\n      <mat-select\n        formControlName=\"legendPosition\"\n        placeholder=\"{{ 'igo.geo.printForm.legendPosition' | translate }}\"\n      >\n        @for (\n          legendPosition of legendPositions | keyvalue;\n          track legendPosition\n        ) {\n          <mat-option [value]=\"legendPosition.key\">\n            @if (!['newpage', 'newimage'].includes(legendPosition.value)) {\n              {{\n                'igo.geo.printForm.legendPositions.' + legendPosition.value\n                  | translate\n              }}\n            }\n            @if (['newpage', 'newimage'].includes(legendPosition.value)) {\n              {{\n                (outputFormat === 'Pdf'\n                  ? 'igo.geo.printForm.legendPositions.newpage'\n                  : 'igo.geo.printForm.legendPositions.newimage'\n                ) | translate\n              }}\n            }\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n\n  <div class=\"igo-input-container\">\n    <mat-form-field>\n      <mat-label>{{ 'igo.geo.printForm.outputFormat' | translate }}</mat-label>\n      <mat-select\n        (selectionChange)=\"toggleImageSaveProp()\"\n        formControlName=\"outputFormat\"\n        placeholder=\"{{ 'igo.geo.printForm.outputFormat' | translate }}\"\n      >\n        @for (outputFormat of outputFormats | keyvalue; track outputFormat) {\n          <mat-option [value]=\"outputFormat.key\">\n            {{ outputFormat.value }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n\n  <div\n    class=\"igo-input-container\"\n    [style.display]=\"isPrintService ? 'block' : 'none'\"\n  >\n    <mat-form-field>\n      <mat-label>{{ 'igo.geo.printForm.paperFormat' | translate }}</mat-label>\n      <mat-select\n        (selectionChange)=\"changeCommentLength()\"\n        formControlName=\"paperFormat\"\n        placeholder=\"{{ 'igo.geo.printForm.paperFormat' | translate }}\"\n      >\n        @for (paperFormat of paperFormats | keyvalue; track paperFormat) {\n          <mat-option [value]=\"paperFormat.key\">\n            {{\n              'igo.geo.printForm.paperFormats.' + paperFormat.value | translate\n            }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n\n  <div\n    class=\"igo-input-container\"\n    [style.display]=\"isPrintService ? 'none' : 'block'\"\n  >\n    <mat-form-field>\n      <mat-label>{{ 'igo.geo.printForm.imageFormat' | translate }}</mat-label>\n      <mat-select\n        formControlName=\"imageFormat\"\n        placeholder=\"{{ 'igo.geo.printForm.imageFormat' | translate }}\"\n      >\n        @for (imageFormat of imageFormats | keyvalue; track imageFormat) {\n          <mat-option [value]=\"imageFormat.key\">\n            {{ imageFormat.value }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n\n  <div class=\"igo-input-container\">\n    <mat-form-field>\n      <mat-label\n        >{{ 'igo.geo.printForm.resolution' | translate }} ({{\n          'igo.geo.printForm.resolutionUnit' | translate\n        }})</mat-label\n      >\n      <mat-select\n        formControlName=\"resolution\"\n        placeholder=\"{{ 'igo.geo.printForm.resolution' | translate }}\"\n      >\n        @for (resolution of resolutions; track resolution) {\n          <mat-option [value]=\"resolution\">\n            {{ resolution }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n\n  <div\n    class=\"igo-input-container\"\n    [style.display]=\"isPrintService ? 'block' : 'none'\"\n  >\n    <mat-form-field>\n      <mat-label>{{ 'igo.geo.printForm.orientation' | translate }}</mat-label>\n      <mat-select\n        (selectionChange)=\"changeCommentLength()\"\n        formControlName=\"orientation\"\n        placeholder=\"{{ 'igo.geo.printForm.orientation' | translate }}\"\n      >\n        @for (orientation of orientations | keyvalue; track orientation) {\n          <mat-option [value]=\"orientation.key\">\n            {{ 'igo.geo.printForm.' + orientation.value | translate }}\n          </mat-option>\n        }\n      </mat-select>\n    </mat-form-field>\n  </div>\n\n  <div class=\"igo-form-button-group print-button-top-padding\">\n    <button\n      matButton=\"elevated\"\n      type=\"button\"\n      [disabled]=\"!form.valid || (disabled$() | async)\"\n      (click)=\"handleFormSubmit(form.value, form.valid)\"\n    >\n      {{ 'igo.geo.printForm.saveBtn' | translate }}\n    </button>\n  </div>\n</form>\n", styles: [":host mat-form-field{width:100%}:host .slide-toggle-container{margin-bottom:16px}:host .print-slide-toggle-container mat-slide-toggle{width:100%;padding:0 8px}:host .print-slide-toggle-container mat-slide-toggle ::ng-deep .mdc-form-field{width:100%}:host .print-slide-toggle-container mat-slide-toggle ::ng-deep .mdc-label{margin-left:0;width:calc(100% - 60px)}:host .print-option{display:block;margin-bottom:12px}:host .igo-form{padding:16px}:host .igo-form-button-group{text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i2$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: PrintFormComponent, decorators: [{
             type: Component,
@@ -40408,6 +40432,9 @@ function provideDirection(...sources) {
         },
         provideDirectionsSourceService()
     ];
+    if (sources?.length === 0) {
+        throw new Error('You must at least provide 1 direction source. Ex: provideDirection(withOsrmSource())');
+    }
     for (const source of sources) {
         providers.push(...source.providers);
     }
@@ -40434,6 +40461,12 @@ class OsrmDirectionsSource extends DirectionsSource {
     set sourceName(value) {
         this._options.name = value;
     }
+    get sourceId() {
+        return this._options.id;
+    }
+    set sourceId(value) {
+        this._options.id = value;
+    }
     get baseUrl() {
         return this._options.baseUrl;
     }
@@ -40456,6 +40489,9 @@ class OsrmDirectionsSource extends DirectionsSource {
         if (!this.baseUrl) {
             this.baseUrl = '/apis/itineraire/route/v1/';
         }
+        if (!this.sourceId) {
+            this.sourceId = 'osrmQc';
+        }
         if (!this.sourceName) {
             this.sourceName = 'OSRM Québec';
         }
@@ -40472,8 +40508,11 @@ class OsrmDirectionsSource extends DirectionsSource {
             }
         }
     }
+    getSourceId() {
+        return this.sourceId;
+    }
     getSourceName() {
-        return this.sourceName;
+        return this.sourceName ?? this.sourceId;
     }
     getEnabledProfile() {
         return this.profiles.find((profile) => profile.enabled);