geonetwork-ui 2.8.0-dev.749c3ea3b → 2.8.0-dev.82b7031fa

package/fesm2022/geonetwork-ui.mjs

@@ -7,11 +7,11 @@ import { marker } from '@biesbjerg/ngx-translate-extract-marker';
 import { format } from 'date-fns/format';
 import { Namespace, Literal, lit, parse as parse$2, sym, BlankNode, graph } from 'rdflib';
 import * as i0 from '@angular/core';
-import { InjectionToken, Injectable, Optional, Inject, NgModule, SkipSelf, APP_INITIALIZER, makeEnvironmentProviders, Directive, Input, HostListener, EventEmitter, Component, ChangeDetectionStrategy, Output, ViewChild, ViewEncapsulation, HostBinding, TemplateRef, ElementRef, ViewChildren, ContentChild, ContentChildren, Host, ViewContainerRef, inject } from '@angular/core';
+import { InjectionToken, Optional, Inject, Injectable, SkipSelf, NgModule, APP_INITIALIZER, makeEnvironmentProviders, HostListener, Input, Directive, EventEmitter, inject, DestroyRef, Output, ViewChild, ChangeDetectionStrategy, Component, ViewEncapsulation, HostBinding, TemplateRef, ElementRef, ViewChildren, ContentChild, ContentChildren, Host, ViewContainerRef } from '@angular/core';
 import * as i1 from '@angular/common/http';
-import { HttpHeaders, HttpParams, HttpClient, provideHttpClient, withInterceptorsFromDi, HTTP_INTERCEPTORS, HttpEventType } from '@angular/common/http';
+import { HttpHeaders, HttpParams, HttpClient, provideHttpClient, HTTP_INTERCEPTORS, withInterceptorsFromDi, HttpEventType } from '@angular/common/http';
 import * as i1$1 from '@ngx-translate/core';
-import { TranslateCompiler, TranslateLoader, TranslateDefaultParser, TranslateParser, TranslateService, provideTranslateService, TranslateDirective, TranslatePipe, TranslateModule } from '@ngx-translate/core';
+import { TranslateLoader, TranslateCompiler, TranslateDefaultParser, TranslateParser, TranslateService, provideTranslateService, TranslateDirective, TranslatePipe, TranslateModule } from '@ngx-translate/core';
 import { TranslateMessageFormatCompiler } from 'ngx-translate-messageformat-compiler';
 import { TranslateHttpLoader } from '@ngx-translate/http-loader';
 import { map as map$1, shareReplay as shareReplay$1, catchError, tap as tap$1, filter as filter$1, startWith as startWith$1, withLatestFrom, switchMap as switchMap$1, take, mergeMap, delay, distinctUntilChanged, debounceTime, finalize, throttleTime, first as first$1, pairwise as pairwise$1, share, defaultIfEmpty, toArray } from 'rxjs/operators';
@@ -29,32 +29,34 @@ import { LineString, Polygon } from 'ol/geom';
 import * as i1$3 from '@ngrx/store';
 import { createAction, props, createReducer, on, createFeatureSelector, createSelector, select, StoreModule, Store } from '@ngrx/store';
 import { queryDataGouvFr, queryGeonames, queryGeoadmin } from '@geospatial-sdk/geocoding';
-import { FeaturesClickEventType, FeaturesHoverEventType, MapClickEventType, SourceLoadErrorType, computeMapContextDiff, createViewFromLayer } from '@geospatial-sdk/core';
-import { listen, createMapFromContext, applyContextDiffToMap } from '@geospatial-sdk/openlayers';
-import { provideIcons, provideNgIconsConfig, NgIconComponent, NgIcon } from '@ng-icons/core';
-import { matSwipeOutline, matErrorOutlineOutline, matComputerOutline, matLocationSearchingOutline, matCallOutline, matLocationOnOutline, matMailOutline as matMailOutline$1, matInfoOutline, matWarningAmberOutline, matCloseOutline, matSendOutline, matMapOutline, matCloudDownloadOutline, matHomeWorkOutline, matLayersOutline, matAddCircleOutlineOutline, matDeleteOutline, matMoreHorizOutline } from '@ng-icons/material-icons/outline';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { FeaturesClickEventType, FeaturesHoverEventType, MapClickEventType, MapExtentChangeEventType, SourceLoadErrorType, computeMapContextDiff, createViewFromLayer } from '@geospatial-sdk/core';
+import { createMapFromContext, applyContextDiffToMap, listen } from '@geospatial-sdk/openlayers';
+import { NgIconComponent, provideIcons, provideNgIconsConfig, NgIcon } from '@ng-icons/core';
+import { matSwipeOutline, matErrorOutlineOutline, matComputerOutline, matLocationSearchingOutline, matLocationOnOutline, matCallOutline, matMailOutline as matMailOutline$1, matInfoOutline, matCloseOutline, matWarningAmberOutline, matSendOutline, matHomeWorkOutline, matCloudDownloadOutline, matMapOutline, matAddCircleOutlineOutline, matLayersOutline, matDeleteOutline, matMoreHorizOutline } from '@ng-icons/material-icons/outline';
+import { transformExtent } from 'ol/proj';
 import { createLegendFromLayer } from '@geospatial-sdk/legend';
 import { defaults, DragPan, MouseWheelZoom } from 'ol/interaction';
 import { mouseOnly, noModifierKeys, primaryAction, platformModifierKeyOnly } from 'ol/events/condition';
 import { extend } from 'ol/extent';
 import * as TOML from '@ltd/j-toml';
-import { Style, Fill, Stroke, Circle } from 'ol/style';
+import { Style, Stroke, Fill, Circle } from 'ol/style';
 import CircleStyle from 'ol/style/Circle';
 import EmblaCarousel from 'embla-carousel';
-import { iconoirNavArrowRight, iconoirNavArrowLeft, iconoirSearch, iconoirLongArrowDownLeft, iconoirCalendar, iconoirLink, iconoirArrowUp, iconoirCloudUpload, iconoirFramePlusIn, iconoirReduce, iconoirNavArrowDown, iconoirNavArrowUp, iconoirExpand, iconoirSettings, iconoirDownload, iconoirMediaImage, iconoirMediaImageXmark, iconoirBin, iconoirPlus, iconoirAppleWallet, iconoirDatabase, iconoirCode, iconoirAppWindow, iconoirBank, iconoirList, iconoirUser, iconoirLock, iconoirTranslate, iconoirImport, iconoirLightBulbOn, iconoirArrowLeft, iconoirAttachment, iconoirRefresh, iconoirCheckCircle, iconoirCircle, iconoirSystemShut, iconoirBadgeCheck } from '@ng-icons/iconoir';
+import { iconoirNavArrowLeft, iconoirNavArrowRight, iconoirLongArrowDownLeft, iconoirSearch, iconoirCalendar, iconoirArrowUp, iconoirLink, iconoirFramePlusIn, iconoirCloudUpload, iconoirReduce, iconoirNavArrowUp, iconoirNavArrowDown, iconoirExpand, iconoirSettings, iconoirDownload, iconoirPlus, iconoirBin, iconoirMediaImageXmark, iconoirMediaImage, iconoirAppWindow, iconoirCode, iconoirDatabase, iconoirAppleWallet, iconoirBank, iconoirList, iconoirTranslate, iconoirLock, iconoirUser, iconoirArrowLeft, iconoirLightBulbOn, iconoirImport, iconoirAttachment, iconoirRefresh, iconoirCircle, iconoirCheckCircle, iconoirBadgeCheck, iconoirSystemShut } from '@ng-icons/iconoir';
 import { MatButtonModule } from '@angular/material/button';
 import * as i1$8 from '@angular/cdk/overlay';
-import { CdkConnectedOverlay, OverlayModule, CdkOverlayOrigin } from '@angular/cdk/overlay';
+import { OverlayModule, CdkConnectedOverlay, CdkOverlayOrigin } from '@angular/cdk/overlay';
 import * as i2 from '@angular/forms';
 import { UntypedFormControl, ReactiveFormsModule, FormsModule } from '@angular/forms';
 import * as i1$5 from '@angular/material/autocomplete';
-import { MatAutocompleteTrigger, MatAutocomplete, MatAutocompleteModule } from '@angular/material/autocomplete';
+import { MatAutocompleteModule, MatAutocompleteTrigger, MatAutocomplete } from '@angular/material/autocomplete';
 import tippy from 'tippy.js';
 import * as i1$4 from '@angular/material/progress-spinner';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-import { matClose, matContentCopy, matExpandMore, matExpandLess, matSearch, matStar, matStarBorder, matAdd, matRemove, matChevronLeft, matChevronRight, matArrowBackIos, matArrowForwardIos, matFace, matQuestionMark, matMoodBad, matZoomOutMap, matOpenInNew, matMailOutline, matPersonOutline, matCheck, matWarningAmber, matCheckCircleOutline, matWarning, matMoreVert } from '@ng-icons/material-icons/baseline';
+import { matClose, matContentCopy, matExpandLess, matExpandMore, matSearch, matStarBorder, matStar, matRemove, matAdd, matChevronRight, matChevronLeft, matArrowForwardIos, matArrowBackIos, matMoodBad, matQuestionMark, matFace, matZoomOutMap, matOpenInNew, matPersonOutline, matMailOutline, matWarningAmber, matCheck, matCheckCircleOutline, matWarning, matMoreVert } from '@ng-icons/material-icons/baseline';
 import * as i1$6 from '@angular/material/core';
-import { MAT_DATE_LOCALE, MatNativeDateModule } from '@angular/material/core';
+import { MatNativeDateModule, MAT_DATE_LOCALE } from '@angular/material/core';
 import * as i1$7 from '@angular/material/checkbox';
 import { MatCheckboxModule } from '@angular/material/checkbox';
 import * as i2$1 from '@angular/material/tooltip';
@@ -76,9 +78,9 @@ import { valid as valid$1 } from 'geojson-validation';
 import * as basicLightbox from 'basiclightbox';
 import { marked } from 'marked';
 import * as i2$3 from '@angular/cdk/scrolling';
-import { CdkScrollable, ScrollingModule } from '@angular/cdk/scrolling';
+import { ScrollingModule, CdkScrollable } from '@angular/cdk/scrolling';
 import Duration from 'duration-relativetimeformat';
-import { MatMenuTrigger, MatMenuModule } from '@angular/material/menu';
+import { MatMenuModule, MatMenuTrigger } from '@angular/material/menu';
 import { TemplatePortal } from '@angular/cdk/portal';
 import { trigger, transition, animate, keyframes, style } from '@angular/animations';
 import * as Papa from 'papaparse';
@@ -87,11 +89,11 @@ import { parseISO } from 'date-fns/parseISO';
 import { WFS, GeoJSON as GeoJSON$1 } from 'ol/format';
 import { Chart, BarController, BarElement, CategoryScale, LinearScale, LineController, LineElement, PointElement, PieController, ArcElement, ScatterController, Tooltip, Colors, Legend } from 'chart.js';
 import * as i3 from '@angular/material/sort';
-import { MatSort, MatSortModule } from '@angular/material/sort';
+import { MatSortModule, MatSort } from '@angular/material/sort';
 import * as i2$5 from '@angular/material/table';
 import { MatTableModule } from '@angular/material/table';
 import * as i4 from '@angular/material/paginator';
-import { MatPaginatorIntl, MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
+import { MatPaginatorIntl, MatPaginatorModule, MatPaginator } from '@angular/material/paginator';
 import { LetDirective } from '@ngrx/component';
 import axios from 'axios';
 import * as i1$e from '@angular/platform-browser';
@@ -102,7 +104,7 @@ import { MatIconModule } from '@angular/material/icon';
 import * as i3$1 from '@angular/cdk/text-field';
 import { TextFieldModule } from '@angular/cdk/text-field';
 import * as i3$2 from '@ngrx/router-store';
-import { getRouterSelectors, routerReducer, StoreRouterConnectingModule, FullRouterStateSerializer } from '@ngrx/router-store';
+import { getRouterSelectors, StoreRouterConnectingModule, routerReducer, FullRouterStateSerializer } from '@ngrx/router-store';
 import { navigation } from '@ngrx/router-store/data-persistence';
 
 class MetadataMapperContext {
@@ -1078,10 +1080,12 @@ const PossibleResourceTypes = {
     'map-interactive': 'reuse', // new index field since Oct 10, 2024
     'map-static': 'reuse', // new index field
     mapDigital: 'reuse',
+    mapHardcopy: 'reuse',
     series: 'dataset',
     service: 'service',
     staticMap: 'reuse',
 };
+const ReusePresentationForms = ['mapDigital', 'mapHardcopy'];
 const PossibleResourceTypesDefinition = Object.entries(PossibleResourceTypes).reduce((acc, [key, val]) => ((acc[val] ??= []).push(key), acc), {});
 function getResourceType(type) {
     return (PossibleResourceTypes[type] ||
@@ -1104,6 +1108,9 @@ function getReuseType(type) {
         ? possibleReuseTypes[type] || 'other'
         : undefined;
 }
+function getReusePresentationForm(presentationForms) {
+    return presentationForms?.find((presentationForm) => ReusePresentationForms.includes(presentationForm));
+}
 function kindToCodeListValue(record) {
     return record.kind === 'reuse' ? record.reuseType : record.kind;
 }
@@ -19349,6 +19356,7 @@ var de = {
 	"search.filters.producerOrg": "",
 	"search.filters.publicationYear": "Veröffentlichungsjahr",
 	"search.filters.publisherOrg": "",
+	"search.filters.recordKind": "Type",
 	"search.filters.recordKind.all": "Alle",
 	"search.filters.recordKind.dataset": "Datensätze",
 	"search.filters.recordKind.reuse": "Wiederverwendungen",
@@ -19387,6 +19395,7 @@ var de = {
 	"service.metadata.spatialExtent": "",
 	"share.tab.permalink": "Teilen",
 	"share.tab.webComponent": "Integrieren",
+	"stac.filter.enable": "",
 	"stac.filter.reset": "",
 	"stac.results.noResults": "Ihre Suchfilter lieferten keine Ergebnisse",
 	"table.loading.data": "Daten werden geladen...",
@@ -20016,6 +20025,7 @@ var en = {
 	"search.filters.producerOrg": "Producer",
 	"search.filters.publicationYear": "Publication year",
 	"search.filters.publisherOrg": "Publisher",
+	"search.filters.recordKind": "Type",
 	"search.filters.recordKind.all": "All",
 	"search.filters.recordKind.dataset": "Datasets",
 	"search.filters.recordKind.reuse": "Reuses",
@@ -20054,6 +20064,7 @@ var en = {
 	"service.metadata.spatialExtent": "Spatial extent",
 	"share.tab.permalink": "Share",
 	"share.tab.webComponent": "Integrate",
+	"stac.filter.enable": "Enable dynamic filter on spatial extent",
 	"stac.filter.reset": "Reset filters",
 	"stac.results.noResults": "Your search filters did not match any items",
 	"table.loading.data": "Loading data...",
@@ -20683,6 +20694,7 @@ var es = {
 	"search.filters.producerOrg": "",
 	"search.filters.publicationYear": "",
 	"search.filters.publisherOrg": "",
+	"search.filters.recordKind": "Typo",
 	"search.filters.recordKind.all": "Todos",
 	"search.filters.recordKind.dataset": "",
 	"search.filters.recordKind.reuse": "",
@@ -20721,6 +20733,7 @@ var es = {
 	"service.metadata.spatialExtent": "",
 	"share.tab.permalink": "",
 	"share.tab.webComponent": "",
+	"stac.filter.enable": "",
 	"stac.filter.reset": "",
 	"stac.results.noResults": "",
 	"table.loading.data": "",
@@ -21350,6 +21363,7 @@ var fr = {
 	"search.filters.producerOrg": "Producteur",
 	"search.filters.publicationYear": "Année de publication",
 	"search.filters.publisherOrg": "Distributeur",
+	"search.filters.recordKind": "Type",
 	"search.filters.recordKind.all": "Tous",
 	"search.filters.recordKind.dataset": "Jeux de données",
 	"search.filters.recordKind.reuse": "Réutilisations",
@@ -21388,6 +21402,7 @@ var fr = {
 	"service.metadata.spatialExtent": "Etendue spatiale",
 	"share.tab.permalink": "Partager",
 	"share.tab.webComponent": "Intégrer",
+	"stac.filter.enable": "Activer le filtre dynamique sur l’emprise spatiale",
 	"stac.filter.reset": "Réinitialiser les filtres",
 	"stac.results.noResults": "Vos filtres ne permettent pas d’afficher de résultats",
 	"table.loading.data": "Chargement des données...",
@@ -22017,6 +22032,7 @@ var it = {
 	"search.filters.producerOrg": "Produttore",
 	"search.filters.publicationYear": "Anno di pubblicazione",
 	"search.filters.publisherOrg": "Distributore",
+	"search.filters.recordKind": "",
 	"search.filters.recordKind.all": "Tutti",
 	"search.filters.recordKind.dataset": "Dataset",
 	"search.filters.recordKind.reuse": "Riutilizzi",
@@ -22055,6 +22071,7 @@ var it = {
 	"service.metadata.spatialExtent": "Estensione spaziale",
 	"share.tab.permalink": "Condividere",
 	"share.tab.webComponent": "Incorporare",
+	"stac.filter.enable": "",
 	"stac.filter.reset": "",
 	"stac.results.noResults": "",
 	"table.loading.data": "Caricamento dei dati...",
@@ -22684,6 +22701,7 @@ var nl = {
 	"search.filters.producerOrg": "",
 	"search.filters.publicationYear": "",
 	"search.filters.publisherOrg": "",
+	"search.filters.recordKind": "",
 	"search.filters.recordKind.all": "Alles",
 	"search.filters.recordKind.dataset": "",
 	"search.filters.recordKind.reuse": "",
@@ -22722,6 +22740,7 @@ var nl = {
 	"service.metadata.spatialExtent": "",
 	"share.tab.permalink": "",
 	"share.tab.webComponent": "",
+	"stac.filter.enable": "",
 	"stac.filter.reset": "",
 	"stac.results.noResults": "",
 	"table.loading.data": "",
@@ -23351,6 +23370,7 @@ var pt = {
 	"search.filters.producerOrg": "",
 	"search.filters.publicationYear": "",
 	"search.filters.publisherOrg": "",
+	"search.filters.recordKind": "",
 	"search.filters.recordKind.all": "Todos",
 	"search.filters.recordKind.dataset": "",
 	"search.filters.recordKind.reuse": "",
@@ -23389,6 +23409,7 @@ var pt = {
 	"service.metadata.spatialExtent": "",
 	"share.tab.permalink": "",
 	"share.tab.webComponent": "",
+	"stac.filter.enable": "",
 	"stac.filter.reset": "",
 	"stac.results.noResults": "",
 	"table.loading.data": "",
@@ -24018,6 +24039,7 @@ var sk = {
 	"search.filters.producerOrg": "",
 	"search.filters.publicationYear": "Rok zverejnenia",
 	"search.filters.publisherOrg": "",
+	"search.filters.recordKind": "",
 	"search.filters.recordKind.all": "Všetky",
 	"search.filters.recordKind.dataset": "",
 	"search.filters.recordKind.reuse": "",
@@ -24056,6 +24078,7 @@ var sk = {
 	"service.metadata.spatialExtent": "",
 	"share.tab.permalink": "Zdieľať",
 	"share.tab.webComponent": "Integrovať",
+	"stac.filter.enable": "",
 	"stac.filter.reset": "",
 	"stac.results.noResults": "",
 	"table.loading.data": "Načítanie údajov...",
@@ -24313,8 +24336,10 @@ class Gn4FieldMapper {
             }, output),
             resourceType: (output, source) => {
                 const resourceType = getFirstValue(selectField(source, 'resourceType'));
-                const kind = getResourceType(resourceType);
-                const reuseType = getReuseType(resourceType);
+                const presentationForms = getAsArray(selectField(source, 'cl_presentationForm')).map((presentationForm) => presentationForm.key);
+                const type = getReusePresentationForm(presentationForms) || resourceType;
+                const kind = getResourceType(type);
+                const reuseType = getReuseType(type);
                 return {
                     ...output,
                     kind,
@@ -24618,6 +24643,7 @@ const ES_SOURCE_SUMMARY = [
     'userSavedCount',
     'cl_topic',
     'cl_maintenanceAndUpdateFrequency',
+    'cl_presentationForm',
     'MD_LegalConstraints*Object',
     'qualityScore',
     'allKeywords',
@@ -24798,7 +24824,7 @@ const DEFAULT_LANGUAGE = 'en';
 class DateService {
     constructor(translateService) {
         this.translateService = translateService;
-        this.dateLocales = import('./geonetwork-ui-date-locales-MYnkDJ5h.mjs').then((obj) => obj.default);
+        this.dateLocales = import('./geonetwork-ui-date-locales-DhlIiWpT.mjs').then((obj) => obj.default);
     }
     getDateObject(date) {
         if (typeof date === 'string') {
@@ -25627,13 +25653,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             }] } });
 
 var name = "geonetwork-ui";
-var version = "2.8.0-dev.749c3ea3b";
+var version = "2.8.0-dev.82b7031fa";
 var engines = {
 	node: ">=20"
 };
 var main = "./index.ts";
 var type = "module";
-var exports = {
+var exports$1 = {
 	"./tailwind.base.config.js": "./tailwind.base.config.js",
 	"./style.css": "./style.css"
 };
@@ -25668,10 +25694,10 @@ var peerDependencies = {
 var dependencies = {
 	"@biesbjerg/ngx-translate-extract-marker": "~1.0.0",
 	"@camptocamp/ogc-client": "1.3.1-dev.edb3244",
-	"@geospatial-sdk/core": "0.0.5-dev.37",
-	"@geospatial-sdk/geocoding": "0.0.5-dev.37",
-	"@geospatial-sdk/legend": "0.0.5-dev.37",
-	"@geospatial-sdk/openlayers": "0.0.5-dev.37",
+	"@geospatial-sdk/core": "0.0.5-dev.40",
+	"@geospatial-sdk/geocoding": "0.0.5-dev.40",
+	"@geospatial-sdk/legend": "0.0.5-dev.40",
+	"@geospatial-sdk/openlayers": "0.0.5-dev.40",
 	"@ltd/j-toml": "~1.35.2",
 	"@messageformat/core": "^3.0.1",
 	"@ng-icons/core": "29.10.0",
@@ -25716,7 +25742,7 @@ var packageJson = {
 	engines: engines,
 	main: main,
 	type: type,
-	exports: exports,
+	exports: exports$1,
 	repository: repository,
 	peerDependencies: peerDependencies,
 	dependencies: dependencies
@@ -27748,8 +27774,8 @@ const DEFAULT_VIEW = {
 class MapContainerComponent {
     get featuresClick() {
         if (!this._featuresClick) {
-            this.openlayersMap.then((olMap) => {
-                listen(olMap, FeaturesClickEventType, ({ features }) => this._featuresClick.emit(features));
+            this.setupEventListener(FeaturesClickEventType, (event) => {
+                this._featuresClick.emit(event.features);
             });
             this._featuresClick = new EventEmitter();
         }
@@ -27757,8 +27783,8 @@ class MapContainerComponent {
     }
     get featuresHover() {
         if (!this._featuresHover) {
-            this.openlayersMap.then((olMap) => {
-                listen(olMap, FeaturesHoverEventType, ({ features }) => this._featuresHover.emit(features));
+            this.setupEventListener(FeaturesHoverEventType, (event) => {
+                this._featuresHover.emit(event.features);
             });
             this._featuresHover = new EventEmitter();
         }
@@ -27766,22 +27792,37 @@ class MapContainerComponent {
     }
     get mapClick() {
         if (!this._mapClick) {
-            this.openlayersMap.then((olMap) => {
-                listen(olMap, MapClickEventType, ({ coordinate }) => this._mapClick.emit(coordinate));
+            this.setupEventListener(MapClickEventType, (event) => {
+                this._mapClick.emit(event.coordinate);
             });
             this._mapClick = new EventEmitter();
         }
         return this._mapClick;
     }
+    get extentChange() {
+        if (!this._extentChange) {
+            this.setupEventListener(MapExtentChangeEventType, (event) => {
+                this._extentChange.emit(event.extent);
+            });
+            this._extentChange = new EventEmitter();
+        }
+        return this._extentChange;
+    }
     get sourceLoadError() {
         if (!this._sourceLoadError) {
-            this.openlayersMap.then((olMap) => {
-                listen(olMap, SourceLoadErrorType, (error) => this._sourceLoadError.emit(error));
+            this.setupEventListener(SourceLoadErrorType, (event) => {
+                this._sourceLoadError.emit(event);
             });
             this._sourceLoadError = new EventEmitter();
         }
         return this._sourceLoadError;
     }
+    get resolvedExtentChange() {
+        if (!this._resolvedExtentChange) {
+            this._resolvedExtentChange = new EventEmitter();
+        }
+        return this._resolvedExtentChange;
+    }
     constructor(doNotUseDefaultBasemap, basemapLayers, mapViewConstraints) {
         this.doNotUseDefaultBasemap = doNotUseDefaultBasemap;
         this.basemapLayers = basemapLayers;
@@ -27789,31 +27830,59 @@ class MapContainerComponent {
         this.openlayersMap = new Promise((resolve) => {
             this.olMapResolver = resolve;
         });
+        // These events only get registered on the map if they are used
+        this._featuresClick = null;
+        this._featuresHover = null;
+        this._mapClick = null;
+        this._extentChange = null;
+        this._sourceLoadError = null;
+        this._resolvedExtentChange = null;
+        this.destroyRef = inject(DestroyRef);
+    }
+    calculateCurrentMapExtent() {
+        const extent = this.olMap.getView().calculateExtent(this.olMap.getSize());
+        const reprojectedExtent = transformExtent(extent, this.olMap.getView().getProjection(), 'EPSG:4326');
+        return reprojectedExtent;
     }
     async ngAfterViewInit() {
         this.olMap = await createMapFromContext(this.processContext(this.context), this.container.nativeElement);
-        this.displayMessage$ = merge(fromEvent(this.olMap, 'mapmuted').pipe(map$1(() => true)), fromEvent(this.olMap, 'movestart').pipe(map$1(() => false)), fromEvent(this.olMap, 'singleclick').pipe(map$1(() => false))).pipe(switchMap$1((muted) => muted
-            ? timer(2000).pipe(map$1(() => false), startWith$1(true), delay(400))
-            : of(false)));
+        if (this._resolvedExtentChange) {
+            this._resolvedExtentChange.emit(this.calculateCurrentMapExtent());
+        }
+        this.setupDisplayMessageObservable();
         this.olMapResolver(this.olMap);
     }
     async ngOnChanges(changes) {
         if ('context' in changes && !changes['context'].isFirstChange()) {
             const diff = computeMapContextDiff(this.processContext(changes['context'].currentValue), this.processContext(changes['context'].previousValue));
             await applyContextDiffToMap(this.olMap, diff);
+            if (this._resolvedExtentChange && diff.viewChanges) {
+                this._resolvedExtentChange.emit(this.calculateCurrentMapExtent());
+            }
         }
     }
-    // This will apply basemap layers & view constraints
+    setupEventListener(eventType, handler) {
+        this.openlayersMap.then((olMap) => {
+            listen(olMap, eventType, handler);
+        });
+    }
+    setupDisplayMessageObservable() {
+        this.displayMessage$ = merge(fromEvent(this.olMap, 'mapmuted').pipe(map$1(() => true)), fromEvent(this.olMap, 'movestart').pipe(map$1(() => false)), fromEvent(this.olMap, 'singleclick').pipe(map$1(() => false))).pipe(switchMap$1((muted) => muted
+            ? timer(2000).pipe(map$1(() => false), startWith$1(true), delay(400))
+            : of(false)), takeUntilDestroyed(this.destroyRef));
+    }
     processContext(context) {
         const processed = context
             ? { ...context, view: context.view ?? DEFAULT_VIEW }
             : { layers: [], view: DEFAULT_VIEW };
+        // Prepend with default basemap and basemap layers
         if (this.basemapLayers.length) {
             processed.layers = [...this.basemapLayers, ...processed.layers];
         }
         if (!this.doNotUseDefaultBasemap) {
             processed.layers = [DEFAULT_BASEMAP_LAYER, ...processed.layers];
         }
+        // Apply view constraints
         if (this.mapViewConstraints.maxZoom) {
             processed.view = {
                 maxZoom: this.mapViewConstraints.maxZoom,
@@ -27827,27 +27896,32 @@ class MapContainerComponent {
             };
         }
         if (processed.view &&
-            !('zoom' in processed.view) &&
-            !('center' in processed.view)) {
-            if (this.mapViewConstraints.maxExtent) {
-                processed.view = {
-                    extent: this.mapViewConstraints.maxExtent,
-                    ...processed.view,
-                };
-            }
-            else {
-                processed.view = { ...DEFAULT_VIEW, ...processed.view };
-            }
+            'zoom' in processed.view &&
+            'center' in processed.view) {
+            return processed;
+        }
+        if (processed.view && 'extent' in processed.view) {
+            return processed;
+        }
+        // Ensure valid view
+        if (this.mapViewConstraints.maxExtent) {
+            processed.view = {
+                extent: this.mapViewConstraints.maxExtent,
+                ...processed.view,
+            };
+        }
+        else {
+            processed.view = { ...DEFAULT_VIEW, ...processed.view };
         }
         return processed;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MapContainerComponent, deps: [{ token: DO_NOT_USE_DEFAULT_BASEMAP }, { token: BASEMAP_LAYERS }, { token: MAP_VIEW_CONSTRAINTS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MapContainerComponent, isStandalone: true, selector: "gn-ui-map-container", inputs: { context: "context" }, outputs: { featuresClick: "featuresClick", featuresHover: "featuresHover", mapClick: "mapClick", sourceLoadError: "sourceLoadError" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MapContainerComponent, isStandalone: true, selector: "gn-ui-map-container", inputs: { context: "context" }, outputs: { featuresClick: "featuresClick", featuresHover: "featuresHover", mapClick: "mapClick", extentChange: "extentChange", sourceLoadError: "sourceLoadError", resolvedExtentChange: "resolvedExtentChange" }, providers: [
             provideIcons({ matSwipeOutline }),
             provideNgIconsConfig({
                 size: '1.5em',
             }),
-        ], viewQueries: [{ propertyName: "container", first: true, predicate: ["map"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"h-full w-full\" #map></div>\n<div\n  class=\"absolute inset-0 p-2 rounded z-40 transition-all flex flex-col justify-center items-center text-primary font-sans pointer-events-none\"\n  [ngClass]=\"\n    (displayMessage$ | async) ? 'visible opacity-100' : 'invisible opacity-0'\n  \"\n>\n  <div\n    class=\"absolute z-[-1] inset-0 bg-gradient-to-b from-white to-primary-lightest opacity-60\"\n  ></div>\n  <ng-icon\n    class=\"!w-16 !h-16 text-[64px] mb-4\"\n    name=\"matSwipeOutline\"\n  ></ng-icon>\n  <p translate>map.navigation.message</p>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "container", first: true, predicate: ["map"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"relative h-full w-full\" #map>\n  <ng-content></ng-content>\n  <div\n    class=\"absolute inset-0 p-2 rounded z-40 transition-all flex flex-col justify-center items-center text-primary font-sans pointer-events-none\"\n    [ngClass]=\"\n      (displayMessage$ | async) ? 'visible opacity-100' : 'invisible opacity-0'\n    \"\n  >\n    <div\n      class=\"absolute z-[-1] inset-0 bg-gradient-to-b from-white to-primary-lightest opacity-60\"\n    ></div>\n    <ng-icon\n      class=\"!w-16 !h-16 text-[64px] mb-4\"\n      name=\"matSwipeOutline\"\n    ></ng-icon>\n    <p translate>map.navigation.message</p>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MapContainerComponent, decorators: [{
             type: Component,
@@ -27856,7 +27930,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         provideNgIconsConfig({
                             size: '1.5em',
                         }),
-                    ], template: "<div class=\"h-full w-full\" #map></div>\n<div\n  class=\"absolute inset-0 p-2 rounded z-40 transition-all flex flex-col justify-center items-center text-primary font-sans pointer-events-none\"\n  [ngClass]=\"\n    (displayMessage$ | async) ? 'visible opacity-100' : 'invisible opacity-0'\n  \"\n>\n  <div\n    class=\"absolute z-[-1] inset-0 bg-gradient-to-b from-white to-primary-lightest opacity-60\"\n  ></div>\n  <ng-icon\n    class=\"!w-16 !h-16 text-[64px] mb-4\"\n    name=\"matSwipeOutline\"\n  ></ng-icon>\n  <p translate>map.navigation.message</p>\n</div>\n" }]
+                    ], template: "<div class=\"relative h-full w-full\" #map>\n  <ng-content></ng-content>\n  <div\n    class=\"absolute inset-0 p-2 rounded z-40 transition-all flex flex-col justify-center items-center text-primary font-sans pointer-events-none\"\n    [ngClass]=\"\n      (displayMessage$ | async) ? 'visible opacity-100' : 'invisible opacity-0'\n    \"\n  >\n    <div\n      class=\"absolute z-[-1] inset-0 bg-gradient-to-b from-white to-primary-lightest opacity-60\"\n    ></div>\n    <ng-icon\n      class=\"!w-16 !h-16 text-[64px] mb-4\"\n      name=\"matSwipeOutline\"\n    ></ng-icon>\n    <p translate>map.navigation.message</p>\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [DO_NOT_USE_DEFAULT_BASEMAP]
@@ -27868,17 +27942,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                     args: [MAP_VIEW_CONSTRAINTS]
                 }] }], propDecorators: { context: [{
                 type: Input
+            }], container: [{
+                type: ViewChild,
+                args: ['map']
             }], featuresClick: [{
                 type: Output
             }], featuresHover: [{
                 type: Output
             }], mapClick: [{
                 type: Output
+            }], extentChange: [{
+                type: Output
             }], sourceLoadError: [{
                 type: Output
-            }], container: [{
-                type: ViewChild,
-                args: ['map']
+            }], resolvedExtentChange: [{
+                type: Output
             }] } });
 
 const geometryKeys = ['geometry', 'the_geom'];
@@ -28051,7 +28129,7 @@ class SpatialExtentComponent {
         return new GeoJSON().writeGeometryObject(geometry);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpatialExtentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SpatialExtentComponent, isStandalone: true, selector: "gn-ui-spatial-extent", inputs: { spatialExtents: "spatialExtents" }, ngImport: i0, template: "<gn-ui-map-container\n  class=\"h-full w-full\"\n  [context]=\"mapContext$ | async\"\n></gn-ui-map-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "component", type: MapContainerComponent, selector: "gn-ui-map-container", inputs: ["context"], outputs: ["featuresClick", "featuresHover", "mapClick", "sourceLoadError"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SpatialExtentComponent, isStandalone: true, selector: "gn-ui-spatial-extent", inputs: { spatialExtents: "spatialExtents" }, ngImport: i0, template: "<gn-ui-map-container\n  class=\"h-full w-full\"\n  [context]=\"mapContext$ | async\"\n></gn-ui-map-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "component", type: MapContainerComponent, selector: "gn-ui-map-container", inputs: ["context"], outputs: ["featuresClick", "featuresHover", "mapClick", "extentChange", "sourceLoadError", "resolvedExtentChange"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpatialExtentComponent, decorators: [{
             type: Component,
@@ -28073,7 +28151,7 @@ class MapStateContainerComponent {
         this.mapFacade.selectFeatures(features);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MapStateContainerComponent, deps: [{ token: MapFacade }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MapStateContainerComponent, isStandalone: true, selector: "gn-ui-map-state-container", ngImport: i0, template: "<gn-ui-map-container\n  [context]=\"context$ | async\"\n  (featuresClick)=\"handleFeaturesClicked($event)\"\n></gn-ui-map-container>\n", styles: [""], dependencies: [{ kind: "component", type: MapContainerComponent, selector: "gn-ui-map-container", inputs: ["context"], outputs: ["featuresClick", "featuresHover", "mapClick", "sourceLoadError"] }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MapStateContainerComponent, isStandalone: true, selector: "gn-ui-map-state-container", ngImport: i0, template: "<gn-ui-map-container\n  [context]=\"context$ | async\"\n  (featuresClick)=\"handleFeaturesClicked($event)\"\n></gn-ui-map-container>\n", styles: [""], dependencies: [{ kind: "component", type: MapContainerComponent, selector: "gn-ui-map-container", inputs: ["context"], outputs: ["featuresClick", "featuresHover", "mapClick", "extentChange", "sourceLoadError", "resolvedExtentChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MapStateContainerComponent, decorators: [{
             type: Component,
@@ -29063,11 +29141,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 
 class LoadingMaskComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LoadingMaskComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: LoadingMaskComponent, isStandalone: true, selector: "gn-ui-loading-mask", inputs: { message: "message" }, ngImport: i0, template: "<div class=\"h-full flex flex-col justify-center items-center relative backdrop\">\n  <div class=\"absolute background bg-white inset-0\"></div>\n  <mat-spinner [diameter]=\"28\" class=\"relative\"></mat-spinner>\n  <span class=\"text-sm text-gray-700 mt-3 relative\">{{ message }}</span>\n</div>\n", styles: ["::ng-deep .mat-spinner circle{stroke:var(--color-gray-700);opacity:.5}.backdrop{background-color:#fff6}@supports (-webkit-backdrop-filter: blur()) or (backdrop-filter: blur()){.backdrop{background-color:transparent;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}}.background{opacity:.7}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: LoadingMaskComponent, isStandalone: true, selector: "gn-ui-loading-mask", inputs: { message: "message" }, ngImport: i0, template: "<div class=\"h-full flex flex-col justify-center items-center relative backdrop\">\n  <div class=\"absolute background bg-white inset-0\"></div>\n  <mat-spinner [diameter]=\"28\" class=\"relative\"></mat-spinner>\n  <span class=\"text-sm text-gray-700 mt-3 relative\">{{ message }}</span>\n</div>\n", styles: ["::ng-deep .mat-spinner circle{stroke:var(--color-gray-700);opacity:.5}.backdrop{background-color:#fff6}@supports (-webkit-backdrop-filter: blur()) or (backdrop-filter: blur()){.backdrop{background-color:transparent;backdrop-filter:blur(4px)}}.background{opacity:.7}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LoadingMaskComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-loading-mask', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatProgressSpinnerModule], standalone: true, template: "<div class=\"h-full flex flex-col justify-center items-center relative backdrop\">\n  <div class=\"absolute background bg-white inset-0\"></div>\n  <mat-spinner [diameter]=\"28\" class=\"relative\"></mat-spinner>\n  <span class=\"text-sm text-gray-700 mt-3 relative\">{{ message }}</span>\n</div>\n", styles: ["::ng-deep .mat-spinner circle{stroke:var(--color-gray-700);opacity:.5}.backdrop{background-color:#fff6}@supports (-webkit-backdrop-filter: blur()) or (backdrop-filter: blur()){.backdrop{background-color:transparent;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}}.background{opacity:.7}\n"] }]
+            args: [{ selector: 'gn-ui-loading-mask', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatProgressSpinnerModule], standalone: true, template: "<div class=\"h-full flex flex-col justify-center items-center relative backdrop\">\n  <div class=\"absolute background bg-white inset-0\"></div>\n  <mat-spinner [diameter]=\"28\" class=\"relative\"></mat-spinner>\n  <span class=\"text-sm text-gray-700 mt-3 relative\">{{ message }}</span>\n</div>\n", styles: ["::ng-deep .mat-spinner circle{stroke:var(--color-gray-700);opacity:.5}.backdrop{background-color:#fff6}@supports (-webkit-backdrop-filter: blur()) or (backdrop-filter: blur()){.backdrop{background-color:transparent;backdrop-filter:blur(4px)}}.background{opacity:.7}\n"] }]
         }], propDecorators: { message: [{
                 type: Input
             }] } });
@@ -29519,11 +29597,11 @@ class CheckToggleComponent {
         this.toggled.emit(value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CheckToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: CheckToggleComponent, isStandalone: true, selector: "gn-ui-check-toggle", inputs: { title: "title", label: "label", value: "value", color: "color" }, outputs: { toggled: "toggled" }, ngImport: i0, template: "<label\n  class=\"inline-flex relative items-start cursor-pointer\"\n  [title]=\"title || label\"\n>\n  <span class=\"shrink-0\">\n    <input\n      type=\"checkbox\"\n      class=\"sr-only peer\"\n      [ngModel]=\"value\"\n      (ngModelChange)=\"toggle($event)\"\n    />\n    <div\n      class=\"w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-2 rounded-full peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all\"\n      [class]=\"\n        color === 'secondary'\n          ? 'peer-focus:ring-secondary-lighter peer-checked:bg-secondary'\n          : 'peer-focus:ring-primary-lighter peer-checked:bg-primary'\n      \"\n    ></div>\n  </span>\n  <span class=\"ml-3 mt-[2px] text-sm font-medium\">{{ label }}</span>\n</label>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: CheckToggleComponent, isStandalone: true, selector: "gn-ui-check-toggle", inputs: { title: "title", label: "label", value: "value", color: "color" }, outputs: { toggled: "toggled" }, ngImport: i0, template: "<label\n  class=\"flex relative items-center cursor-pointer w-full\"\n  [title]=\"title || label\"\n>\n  <span class=\"shrink-0 relative\">\n    <input\n      type=\"checkbox\"\n      class=\"sr-only peer\"\n      [ngModel]=\"value\"\n      (ngModelChange)=\"toggle($event)\"\n    />\n    <div\n      class=\"w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-2 rounded-full peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all\"\n      [class]=\"\n        color === 'secondary'\n          ? 'peer-focus:ring-secondary-lighter peer-checked:bg-secondary'\n          : 'peer-focus:ring-primary-lighter peer-checked:bg-primary'\n      \"\n    ></div>\n  </span>\n  <span class=\"ml-3 mt-[2px] text-sm font-medium flex-1\">{{ label }}</span>\n</label>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CheckToggleComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-check-toggle', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [FormsModule], template: "<label\n  class=\"inline-flex relative items-start cursor-pointer\"\n  [title]=\"title || label\"\n>\n  <span class=\"shrink-0\">\n    <input\n      type=\"checkbox\"\n      class=\"sr-only peer\"\n      [ngModel]=\"value\"\n      (ngModelChange)=\"toggle($event)\"\n    />\n    <div\n      class=\"w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-2 rounded-full peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all\"\n      [class]=\"\n        color === 'secondary'\n          ? 'peer-focus:ring-secondary-lighter peer-checked:bg-secondary'\n          : 'peer-focus:ring-primary-lighter peer-checked:bg-primary'\n      \"\n    ></div>\n  </span>\n  <span class=\"ml-3 mt-[2px] text-sm font-medium\">{{ label }}</span>\n</label>\n" }]
+            args: [{ selector: 'gn-ui-check-toggle', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [FormsModule], template: "<label\n  class=\"flex relative items-center cursor-pointer w-full\"\n  [title]=\"title || label\"\n>\n  <span class=\"shrink-0 relative\">\n    <input\n      type=\"checkbox\"\n      class=\"sr-only peer\"\n      [ngModel]=\"value\"\n      (ngModelChange)=\"toggle($event)\"\n    />\n    <div\n      class=\"w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-2 rounded-full peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all\"\n      [class]=\"\n        color === 'secondary'\n          ? 'peer-focus:ring-secondary-lighter peer-checked:bg-secondary'\n          : 'peer-focus:ring-primary-lighter peer-checked:bg-primary'\n      \"\n    ></div>\n  </span>\n  <span class=\"ml-3 mt-[2px] text-sm font-medium flex-1\">{{ label }}</span>\n</label>\n" }]
         }], propDecorators: { title: [{
                 type: Input
             }], label: [{
@@ -29657,7 +29735,7 @@ class DateRangeDropdownComponent {
                 matExpandMore,
                 matExpandLess,
             }),
-        ], viewQueries: [{ propertyName: "picker", first: true, predicate: ["picker"], descendants: true }], ngImport: i0, template: "<gn-ui-button\n  type=\"outline\"\n  extraClass=\"bg-background w-full !p-[8px] !pl-[16px]\"\n  (buttonClick)=\"picker.open()\"\n>\n  <div class=\"grow flex items-center mr-2 gap-2 overflow-hidden\">\n    <div class=\"text-left font-medium truncate py-1\">\n      {{ title }}\n    </div>\n  </div>\n  <ng-icon\n    [name]=\"isPickerDisplayed ? 'matExpandLess' : 'matExpandMore'\"\n    class=\"shrink-0 opacity-40\"\n  >\n  </ng-icon>\n</gn-ui-button>\n<!--date range input is just present for output events and hidden from the DOM-->\n<mat-date-range-input [rangePicker]=\"picker\">\n  <input\n    matStartDate\n    [value]=\"startDate\"\n    (dateInput)=\"startDateChange.emit($event.value)\"\n  />\n  <input\n    matEndDate\n    [value]=\"endDate\"\n    (dateInput)=\"endDateChange.emit($event.value)\"\n  />\n</mat-date-range-input>\n<mat-date-range-picker #picker></mat-date-range-picker>\n", styles: [":host .mat-date-range-input-container{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2$2.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i2$2.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i2$2.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i2$2.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }] }); }
+        ], viewQueries: [{ propertyName: "picker", first: true, predicate: ["picker"], descendants: true }], ngImport: i0, template: "<gn-ui-button\n  type=\"outline\"\n  extraClass=\"bg-background w-full !p-[8px] !pl-[16px]\"\n  (buttonClick)=\"picker.open()\"\n>\n  <div class=\"grow flex items-center mr-2 gap-2 overflow-hidden\">\n    <div class=\"text-left font-medium truncate py-1\">\n      {{ title }}\n    </div>\n  </div>\n  <ng-icon\n    [name]=\"isPickerDisplayed ? 'matExpandLess' : 'matExpandMore'\"\n    class=\"shrink-0 opacity-40\"\n  >\n  </ng-icon>\n</gn-ui-button>\n<!--date range input is just present for output events and hidden from the DOM-->\n<mat-date-range-input [rangePicker]=\"picker\">\n  <input\n    matStartDate\n    [value]=\"startDate\"\n    (dateInput)=\"startDateChange.emit($event.value)\"\n  />\n  <input\n    matEndDate\n    [value]=\"endDate\"\n    (dateInput)=\"endDateChange.emit($event.value)\"\n  />\n</mat-date-range-input>\n<mat-date-range-picker #picker></mat-date-range-picker>\n", styles: [":host{.mat-date-range-input-container{display:none}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2$2.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i2$2.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i2$2.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i2$2.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DateRangeDropdownComponent, decorators: [{
             type: Component,
@@ -29672,7 +29750,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                             matExpandMore,
                             matExpandLess,
                         }),
-                    ], template: "<gn-ui-button\n  type=\"outline\"\n  extraClass=\"bg-background w-full !p-[8px] !pl-[16px]\"\n  (buttonClick)=\"picker.open()\"\n>\n  <div class=\"grow flex items-center mr-2 gap-2 overflow-hidden\">\n    <div class=\"text-left font-medium truncate py-1\">\n      {{ title }}\n    </div>\n  </div>\n  <ng-icon\n    [name]=\"isPickerDisplayed ? 'matExpandLess' : 'matExpandMore'\"\n    class=\"shrink-0 opacity-40\"\n  >\n  </ng-icon>\n</gn-ui-button>\n<!--date range input is just present for output events and hidden from the DOM-->\n<mat-date-range-input [rangePicker]=\"picker\">\n  <input\n    matStartDate\n    [value]=\"startDate\"\n    (dateInput)=\"startDateChange.emit($event.value)\"\n  />\n  <input\n    matEndDate\n    [value]=\"endDate\"\n    (dateInput)=\"endDateChange.emit($event.value)\"\n  />\n</mat-date-range-input>\n<mat-date-range-picker #picker></mat-date-range-picker>\n", styles: [":host .mat-date-range-input-container{display:none}\n"] }]
+                    ], template: "<gn-ui-button\n  type=\"outline\"\n  extraClass=\"bg-background w-full !p-[8px] !pl-[16px]\"\n  (buttonClick)=\"picker.open()\"\n>\n  <div class=\"grow flex items-center mr-2 gap-2 overflow-hidden\">\n    <div class=\"text-left font-medium truncate py-1\">\n      {{ title }}\n    </div>\n  </div>\n  <ng-icon\n    [name]=\"isPickerDisplayed ? 'matExpandLess' : 'matExpandMore'\"\n    class=\"shrink-0 opacity-40\"\n  >\n  </ng-icon>\n</gn-ui-button>\n<!--date range input is just present for output events and hidden from the DOM-->\n<mat-date-range-input [rangePicker]=\"picker\">\n  <input\n    matStartDate\n    [value]=\"startDate\"\n    (dateInput)=\"startDateChange.emit($event.value)\"\n  />\n  <input\n    matEndDate\n    [value]=\"endDate\"\n    (dateInput)=\"endDateChange.emit($event.value)\"\n  />\n</mat-date-range-input>\n<mat-date-range-picker #picker></mat-date-range-picker>\n", styles: [":host{.mat-date-range-input-container{display:none}}\n"] }]
         }], ctorParameters: () => [{ type: i1$8.OverlayContainer }, { type: i0.ChangeDetectorRef }], propDecorators: { title: [{
                 type: Input
             }], startDate: [{
@@ -32036,6 +32114,7 @@ const FIELDS_SUMMARY = [
     'userSavedCount',
     'cl_topic',
     'cl_maintenanceAndUpdateFrequency',
+    'cl_presentationForm',
     'MD_LegalConstraints*Object',
     'qualityScore',
     'allKeywords',
@@ -33049,31 +33128,33 @@ class RecordKindField extends SimpleSearchField {
     constructor(injector) {
         super('resourceType', injector, 'asc');
         this.TYPE_MAPPING = {
-            dataset: ['dataset', 'series', 'featureCatalog'],
+            dataset: ['dataset', 'series', 'featureCatalog', 'document'],
             service: ['service'],
-            reuse: Object.entries(PossibleResourceTypes)
-                .filter(([_, v]) => v === 'reuse')
-                .map(([k]) => k), // = ['application', 'map', 'staticMap', 'interactiveMap', ...]
+            reuse: [
+                ...Object.entries(PossibleResourceTypes)
+                    .filter(([_, v]) => v === 'reuse')
+                    .map(([k]) => k), // = ['application', 'map', 'staticMap', 'interactiveMap', ...]
+                'dataset', // allow datasets and documents to be filtered as 'reuse' by cl_presentationForm
+                'document',
+            ],
         };
     }
     getAvailableValues() {
-        return this.repository.aggregate(this.getAggregations()).pipe(map$1((response) => response[this.esFieldName].buckets || []), map$1((buckets) => {
-            const counts = buckets.reduce((acc, { term, count }) => {
-                const value = term.toString();
-                const key = this.TYPE_MAPPING.reuse.includes(value)
-                    ? 'reuse'
-                    : this.TYPE_MAPPING.dataset.includes(value)
-                        ? 'dataset'
-                        : value;
-                acc[key] = (acc[key] || 0) + count;
-                return acc;
-            }, {});
-            return Object.keys(this.TYPE_MAPPING).map((type) => ({
-                label: type,
-                value: type,
-                count: counts[type] ?? 0,
-            }));
-        }));
+        // simplified as available values now depend on 'resourceType' and 'cl_presentationForm' fields
+        return of([
+            {
+                label: 'dataset',
+                value: 'dataset',
+            },
+            {
+                label: 'service',
+                value: 'service',
+            },
+            {
+                label: 'reuse',
+                value: 'reuse',
+            },
+        ]);
     }
     getFiltersForValues(values) {
         const filters = {
@@ -33085,6 +33166,18 @@ class RecordKindField extends SimpleSearchField {
                 return acc;
             }, {}),
         };
+        const presentationFormFilter = {};
+        if (values.includes('reuse') && !values.includes('dataset')) {
+            presentationFormFilter['mapDigital'] = true;
+            presentationFormFilter['mapHardcopy'] = true;
+        }
+        else if (values.includes('dataset') && !values.includes('reuse')) {
+            presentationFormFilter['mapDigital'] = false;
+            presentationFormFilter['mapHardcopy'] = false;
+        }
+        if (Object.keys(presentationFormFilter).length > 0) {
+            filters['cl_presentationForm.key'] = presentationFormFilter;
+        }
         return of(filters);
     }
     getValuesForFilter(filters) {
@@ -33109,6 +33202,7 @@ marker('search.filters.publicationYear');
 marker('search.filters.organization');
 marker('search.filters.representationType');
 marker('search.filters.resourceType');
+marker('search.filters.recordKind');
 marker('search.filters.standard');
 marker('search.filters.topic');
 marker('search.filters.contact');
@@ -39455,7 +39549,7 @@ class GeoTableViewComponent {
         this.subscription.unsubscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GeoTableViewComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: GeoTableViewComponent, isStandalone: true, selector: "gn-ui-geo-table-view", inputs: { dataset: "dataset" }, viewQueries: [{ propertyName: "uiTable", first: true, predicate: ["table"], descendants: true }, { propertyName: "mapContainer", first: true, predicate: ["mapContainer"], descendants: true }], ngImport: i0, template: "<div class=\"flex flex-row h-full overflow-auto\">\n  <gn-ui-data-table\n    #table\n    class=\"w-1/2 overflow-auto\"\n    [dataset]=\"dataset\"\n    [activeId]=\"selectionId\"\n    (selected)=\"onTableSelect($event)\"\n  ></gn-ui-data-table>\n  <gn-ui-map-container\n    #mapContainer\n    class=\"w-1/2 h-full\"\n    [context]=\"mapContext\"\n    (featuresClick)=\"onMapFeatureSelect($event)\"\n  ></gn-ui-map-container>\n  <gn-ui-feature-detail\n    style=\"width: 300px\"\n    class=\"p-3 shrink-0 overflow-auto\"\n    [feature]=\"selection\"\n  ></gn-ui-feature-detail>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: MapContainerComponent, selector: "gn-ui-map-container", inputs: ["context"], outputs: ["featuresClick", "featuresHover", "mapClick", "sourceLoadError"] }, { kind: "component", type: FeatureDetailComponent, selector: "gn-ui-feature-detail", inputs: ["feature", "featureCatalog"] }, { kind: "component", type: DataTableComponent, selector: "gn-ui-data-table", inputs: ["featureAttributes", "dataset", "activeId"], outputs: ["selected"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: GeoTableViewComponent, isStandalone: true, selector: "gn-ui-geo-table-view", inputs: { dataset: "dataset" }, viewQueries: [{ propertyName: "uiTable", first: true, predicate: ["table"], descendants: true }, { propertyName: "mapContainer", first: true, predicate: ["mapContainer"], descendants: true }], ngImport: i0, template: "<div class=\"flex flex-row h-full overflow-auto\">\n  <gn-ui-data-table\n    #table\n    class=\"w-1/2 overflow-auto\"\n    [dataset]=\"dataset\"\n    [activeId]=\"selectionId\"\n    (selected)=\"onTableSelect($event)\"\n  ></gn-ui-data-table>\n  <gn-ui-map-container\n    #mapContainer\n    class=\"w-1/2 h-full\"\n    [context]=\"mapContext\"\n    (featuresClick)=\"onMapFeatureSelect($event)\"\n  ></gn-ui-map-container>\n  <gn-ui-feature-detail\n    style=\"width: 300px\"\n    class=\"p-3 shrink-0 overflow-auto\"\n    [feature]=\"selection\"\n  ></gn-ui-feature-detail>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: MapContainerComponent, selector: "gn-ui-map-container", inputs: ["context"], outputs: ["featuresClick", "featuresHover", "mapClick", "extentChange", "sourceLoadError", "resolvedExtentChange"] }, { kind: "component", type: FeatureDetailComponent, selector: "gn-ui-feature-detail", inputs: ["feature", "featureCatalog"] }, { kind: "component", type: DataTableComponent, selector: "gn-ui-data-table", inputs: ["featureAttributes", "dataset", "activeId"], outputs: ["selected"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GeoTableViewComponent, decorators: [{
             type: Component,
@@ -39703,7 +39797,7 @@ class MdViewEffects {
         */
         this.loadRelatedRecords$ = createEffect(() => this.actions$.pipe(ofType(loadFullMetadataSuccess), switchMap$1(({ full }) => this.recordsRepository.getSimilarRecords(full)), map$1((related) => {
             return setRelated({ related });
-        }), catchError((error) => of(setRelated({ related: null })))));
+        }), catchError(() => of(setRelated({ related: null })))));
         this.loadSources$ = createEffect(() => this.actions$.pipe(ofType(loadFullMetadataSuccess), switchMap$1(({ full }) => this.recordsRepository.getSources(full)), map$1((sources) => {
             return setSources({ sources });
         }), catchError(() => of(setSources({ sources: null })))));
@@ -40283,21 +40377,21 @@ class GpfApiDlComponent {
         this.choices = await this.getCapabilities();
         const tempZone = this.choices.zone.map((bucket) => ({
             value: bucket.term,
-            label: bucket.label,
+            label: String(bucket.label),
         }));
         tempZone.sort((a, b) => (a.label > b.label ? 1 : -1));
         tempZone.unshift({ value: 'null', label: 'ZONE' });
         this.bucketPromisesZone = tempZone;
         const tempFormat = this.choices.format.map((bucket) => ({
             value: bucket.term,
-            label: bucket.label,
+            label: String(bucket.label),
         }));
         tempFormat.sort((a, b) => (a.label > b.label ? 1 : -1));
         tempFormat.unshift({ value: 'null', label: 'FORMAT' });
         this.bucketPromisesFormat = tempFormat;
         const tempCrs = this.choices.category.map((bucket) => ({
             value: bucket.term,
-            label: bucket.label,
+            label: String(bucket.label),
         }));
         tempCrs.sort((a, b) => (a.label > b.label ? 1 : -1));
         tempCrs.unshift({ value: 'null', label: 'CRS' });
@@ -40600,7 +40694,7 @@ class MapViewComponent {
         this.changeRef.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MapViewComponent, deps: [{ token: MdViewFacade }, { token: MapUtilsService }, { token: DataService }, { token: i0.ChangeDetectorRef }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MapViewComponent, isStandalone: true, selector: "gn-ui-map-view", inputs: { exceedsLimit: "exceedsLimit", selectedView: "selectedView", datavizConfig: "datavizConfig", displaySource: "displaySource" }, outputs: { linkSelected: "linkSelected", styleSelected: "styleSelected" }, viewQueries: [{ propertyName: "mapContainer", first: true, predicate: ["mapContainer"], descendants: true }], ngImport: i0, template: "<div class=\"w-full h-full flex flex-col gap-[13px]\">\n  <div\n    class=\"flex flex-col md:flex-row gap-4 py-4 px-5 bg-white border border-color-border rounded-lg mt-6\"\n  >\n    <gn-ui-dropdown-selector\n      *ngIf=\"displaySource\"\n      class=\"w-full md:flex-1 md:min-w-0\"\n      extraBtnClass=\"font-sans font-bold\"\n      [title]=\"'map.select.layer' | translate\"\n      [choices]=\"dropdownChoices$ | async\"\n      [selected]=\"_selectedChoice\"\n      (selectValue)=\"selectLinkToDisplay($event)\"\n    ></gn-ui-dropdown-selector>\n\n    <ng-container *ngIf=\"(styleLinks$ | async)?.length > 0; else styleDisabled\">\n      <gn-ui-dropdown-selector\n        class=\"w-full md:flex-1 md:min-w-0\"\n        extraBtnClass=\"font-sans font-bold\"\n        [title]=\"'map.select.style' | translate\"\n        [choices]=\"styleDropdownChoices$ | async\"\n        [selected]=\"_styleFromConfig\"\n        (selectValue)=\"selectStyleToDisplay($event)\"\n      ></gn-ui-dropdown-selector>\n    </ng-container>\n    <ng-template #styleDisabled>\n      <gn-ui-dropdown-selector\n        class=\"w-full md:flex-1 md:min-w-0 text-gray-400\"\n        extraBtnClass=\"font-sans font-bold text-gray-400\"\n        [title]=\"'map.select.style' | translate\"\n        [choices]=\"styleDropdownChoices$ | async\"\n        [disabled]=\"true\"\n      ></gn-ui-dropdown-selector>\n    </ng-template>\n\n    <div class=\"self-end md:ml-2\">\n      <gn-ui-external-viewer-button\n        extraClass=\"w-[44px] h-[44px]\"\n        [link]=\"selectedLink$ | async\"\n      >\n      </gn-ui-external-viewer-button>\n    </div>\n  </div>\n  <ng-container *ngIf=\"hidePreview; else mapView\">\n    <gn-ui-popup-alert\n      type=\"warning\"\n      icon=\"matErrorOutlineOutline\"\n      class=\"block h-12 p-1\"\n    >\n      <span translate>record.feature.limit</span>\n    </gn-ui-popup-alert>\n  </ng-container>\n  <ng-template #mapView>\n    <div\n      class=\"relative w-full h-full bg-white border border-gray-300 rounded-lg overflow-hidden\"\n    >\n      <gn-ui-map-container\n        #mapContainer\n        [context]=\"mapContext$ | async\"\n        (featuresClick)=\"onMapFeatureSelect($event)\"\n        (sourceLoadError)=\"onSourceLoadError($event)\"\n      ></gn-ui-map-container>\n      <div\n        class=\"top-[1em] right-[1em] p-3 bg-white absolute overflow-y-auto overflow-x-hidden max-h-72 w-56\"\n        [class.hidden]=\"!selection\"\n      >\n        <gn-ui-button\n          type=\"light\"\n          (buttonClick)=\"resetSelection()\"\n          style=\"\n            --gn-ui-button-padding: 0px;\n            --gn-ui-button-width: 24px;\n            --gn-ui-button-height: 24px;\n          \"\n          extraClass=\"absolute right-[0.5em] ml-[8px] mr-[10px]\"\n        >\n          <ng-icon name=\"matClose\" class=\"align-middle text-sm\"></ng-icon>\n        </gn-ui-button>\n        <gn-ui-feature-detail\n          [featureCatalog]=\"mdViewFacade.featureCatalog$ | async\"\n          [feature]=\"selection\"\n        ></gn-ui-feature-detail>\n      </div>\n\n      <div\n        class=\"top-[1em] p-3 bg-white absolute overflow-y-auto overflow-x-hidden max-h-72 w-56\"\n        [ngClass]=\"{ 'right-[1em]': !selection, 'right-[16em]': selection }\"\n        [hidden]=\"!showLegend || !legendExists\"\n      >\n        <div class=\"flex justify-between items-center mb-2\">\n          <div class=\"text-primary font-bold\" translate>map.legend.title</div>\n          <gn-ui-button\n            type=\"light\"\n            (buttonClick)=\"toggleLegend()\"\n            style=\"\n              --gn-ui-button-padding: 0px;\n              --gn-ui-button-width: 24px;\n              --gn-ui-button-height: 24px;\n            \"\n            extraClass=\"ml-[8px] mr-[10px]\"\n          >\n            <ng-icon name=\"matClose\" class=\"align-middle text-sm\"></ng-icon>\n          </gn-ui-button>\n        </div>\n        <gn-ui-map-legend\n          [context]=\"mapContext$ | async\"\n          (legendStatusChange)=\"onLegendStatusChange($event)\"\n        ></gn-ui-map-legend>\n      </div>\n\n      <gn-ui-button\n        *ngIf=\"!showLegend && legendExists && !selection\"\n        type=\"outline\"\n        (buttonClick)=\"toggleLegend()\"\n        extraClass=\"absolute top-[1em] right-[1em] rounded p-1 text-xs bg-white\"\n        translate\n      >\n        map.legend.title\n      </gn-ui-button>\n\n      <gn-ui-loading-mask\n        *ngIf=\"loading\"\n        class=\"absolute inset-0\"\n        [message]=\"'map.loading.data' | translate\"\n      ></gn-ui-loading-mask>\n      <gn-ui-popup-alert\n        *ngIf=\"error\"\n        type=\"warning\"\n        icon=\"matErrorOutlineOutline\"\n        class=\"absolute m-2 inset-0\"\n      >\n        <span translate>{{ error }}</span>\n      </gn-ui-popup-alert>\n    </div>\n  </ng-template>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "component", type: DropdownSelectorComponent, selector: "gn-ui-dropdown-selector", inputs: ["title", "showTitle", "ariaName", "choices", "selected", "maxRows", "extraBtnClass", "minWidth", "disabled"], outputs: ["selectValue"] }, { kind: "component", type: MapContainerComponent, selector: "gn-ui-map-container", inputs: ["context"], outputs: ["featuresClick", "featuresHover", "mapClick", "sourceLoadError"] }, { kind: "component", type: FeatureDetailComponent, selector: "gn-ui-feature-detail", inputs: ["feature", "featureCatalog"] }, { kind: "component", type: PopupAlertComponent, selector: "gn-ui-popup-alert", inputs: ["icon", "type", "position"] }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "component", type: LoadingMaskComponent, selector: "gn-ui-loading-mask", inputs: ["message"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: ExternalViewerButtonComponent, selector: "gn-ui-external-viewer-button", inputs: ["link", "extraClass"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: MapLegendComponent, selector: "gn-ui-map-legend", inputs: ["context"], outputs: ["legendStatusChange"] }], viewProviders: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MapViewComponent, isStandalone: true, selector: "gn-ui-map-view", inputs: { exceedsLimit: "exceedsLimit", selectedView: "selectedView", datavizConfig: "datavizConfig", displaySource: "displaySource" }, outputs: { linkSelected: "linkSelected", styleSelected: "styleSelected" }, viewQueries: [{ propertyName: "mapContainer", first: true, predicate: ["mapContainer"], descendants: true }], ngImport: i0, template: "<div class=\"w-full h-full flex flex-col gap-[13px]\">\n  <div\n    class=\"flex flex-col md:flex-row gap-4 py-4 px-5 bg-white border border-color-border rounded-lg mt-6\"\n  >\n    <gn-ui-dropdown-selector\n      *ngIf=\"displaySource\"\n      class=\"w-full md:flex-1 md:min-w-0\"\n      extraBtnClass=\"font-sans font-bold\"\n      [title]=\"'map.select.layer' | translate\"\n      [choices]=\"dropdownChoices$ | async\"\n      [selected]=\"_selectedChoice\"\n      (selectValue)=\"selectLinkToDisplay($event)\"\n    ></gn-ui-dropdown-selector>\n\n    <ng-container *ngIf=\"(styleLinks$ | async)?.length > 0; else styleDisabled\">\n      <gn-ui-dropdown-selector\n        class=\"w-full md:flex-1 md:min-w-0\"\n        extraBtnClass=\"font-sans font-bold\"\n        [title]=\"'map.select.style' | translate\"\n        [choices]=\"styleDropdownChoices$ | async\"\n        [selected]=\"_styleFromConfig\"\n        (selectValue)=\"selectStyleToDisplay($event)\"\n      ></gn-ui-dropdown-selector>\n    </ng-container>\n    <ng-template #styleDisabled>\n      <gn-ui-dropdown-selector\n        class=\"w-full md:flex-1 md:min-w-0 text-gray-400\"\n        extraBtnClass=\"font-sans font-bold text-gray-400\"\n        [title]=\"'map.select.style' | translate\"\n        [choices]=\"styleDropdownChoices$ | async\"\n        [disabled]=\"true\"\n      ></gn-ui-dropdown-selector>\n    </ng-template>\n\n    <div class=\"self-end md:ml-2\">\n      <gn-ui-external-viewer-button\n        extraClass=\"w-[44px] h-[44px]\"\n        [link]=\"selectedLink$ | async\"\n      >\n      </gn-ui-external-viewer-button>\n    </div>\n  </div>\n  <ng-container *ngIf=\"hidePreview; else mapView\">\n    <gn-ui-popup-alert\n      type=\"warning\"\n      icon=\"matErrorOutlineOutline\"\n      class=\"block h-12 p-1\"\n    >\n      <span translate>record.feature.limit</span>\n    </gn-ui-popup-alert>\n  </ng-container>\n  <ng-template #mapView>\n    <div\n      class=\"relative w-full h-full bg-white border border-gray-300 rounded-lg overflow-hidden\"\n    >\n      <gn-ui-map-container\n        #mapContainer\n        [context]=\"mapContext$ | async\"\n        (featuresClick)=\"onMapFeatureSelect($event)\"\n        (sourceLoadError)=\"onSourceLoadError($event)\"\n      ></gn-ui-map-container>\n      <div\n        class=\"top-[1em] right-[1em] p-3 bg-white absolute overflow-y-auto overflow-x-hidden max-h-72 w-56\"\n        [class.hidden]=\"!selection\"\n      >\n        <gn-ui-button\n          type=\"light\"\n          (buttonClick)=\"resetSelection()\"\n          style=\"\n            --gn-ui-button-padding: 0px;\n            --gn-ui-button-width: 24px;\n            --gn-ui-button-height: 24px;\n          \"\n          extraClass=\"absolute right-[0.5em] ml-[8px] mr-[10px]\"\n        >\n          <ng-icon name=\"matClose\" class=\"align-middle text-sm\"></ng-icon>\n        </gn-ui-button>\n        <gn-ui-feature-detail\n          [featureCatalog]=\"mdViewFacade.featureCatalog$ | async\"\n          [feature]=\"selection\"\n        ></gn-ui-feature-detail>\n      </div>\n\n      <div\n        class=\"top-[1em] p-3 bg-white absolute overflow-y-auto overflow-x-hidden max-h-72 w-56\"\n        [ngClass]=\"{ 'right-[1em]': !selection, 'right-[16em]': selection }\"\n        [hidden]=\"!showLegend || !legendExists\"\n      >\n        <div class=\"flex justify-between items-center mb-2\">\n          <div class=\"text-primary font-bold\" translate>map.legend.title</div>\n          <gn-ui-button\n            type=\"light\"\n            (buttonClick)=\"toggleLegend()\"\n            style=\"\n              --gn-ui-button-padding: 0px;\n              --gn-ui-button-width: 24px;\n              --gn-ui-button-height: 24px;\n            \"\n            extraClass=\"ml-[8px] mr-[10px]\"\n          >\n            <ng-icon name=\"matClose\" class=\"align-middle text-sm\"></ng-icon>\n          </gn-ui-button>\n        </div>\n        <gn-ui-map-legend\n          [context]=\"mapContext$ | async\"\n          (legendStatusChange)=\"onLegendStatusChange($event)\"\n        ></gn-ui-map-legend>\n      </div>\n\n      <gn-ui-button\n        *ngIf=\"!showLegend && legendExists && !selection\"\n        type=\"outline\"\n        (buttonClick)=\"toggleLegend()\"\n        extraClass=\"absolute top-[1em] right-[1em] rounded p-1 text-xs bg-white\"\n      >\n        {{ 'map.legend.title' | translate }}\n      </gn-ui-button>\n\n      <gn-ui-loading-mask\n        *ngIf=\"loading\"\n        class=\"absolute inset-0\"\n        [message]=\"'map.loading.data' | translate\"\n      ></gn-ui-loading-mask>\n      <gn-ui-popup-alert\n        *ngIf=\"error\"\n        type=\"warning\"\n        icon=\"matErrorOutlineOutline\"\n        class=\"absolute m-2 inset-0\"\n      >\n        <span translate>{{ error }}</span>\n      </gn-ui-popup-alert>\n    </div>\n  </ng-template>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "component", type: DropdownSelectorComponent, selector: "gn-ui-dropdown-selector", inputs: ["title", "showTitle", "ariaName", "choices", "selected", "maxRows", "extraBtnClass", "minWidth", "disabled"], outputs: ["selectValue"] }, { kind: "component", type: MapContainerComponent, selector: "gn-ui-map-container", inputs: ["context"], outputs: ["featuresClick", "featuresHover", "mapClick", "extentChange", "sourceLoadError", "resolvedExtentChange"] }, { kind: "component", type: FeatureDetailComponent, selector: "gn-ui-feature-detail", inputs: ["feature", "featureCatalog"] }, { kind: "component", type: PopupAlertComponent, selector: "gn-ui-popup-alert", inputs: ["icon", "type", "position"] }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "component", type: LoadingMaskComponent, selector: "gn-ui-loading-mask", inputs: ["message"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: ExternalViewerButtonComponent, selector: "gn-ui-external-viewer-button", inputs: ["link", "extraClass"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: MapLegendComponent, selector: "gn-ui-map-legend", inputs: ["context"], outputs: ["legendStatusChange"] }], viewProviders: [
             provideIcons({ matClose }),
             provideNgIconsConfig({
                 size: '1.5em',
@@ -40627,7 +40721,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         provideNgIconsConfig({
                             size: '1.5em',
                         }),
-                    ], template: "<div class=\"w-full h-full flex flex-col gap-[13px]\">\n  <div\n    class=\"flex flex-col md:flex-row gap-4 py-4 px-5 bg-white border border-color-border rounded-lg mt-6\"\n  >\n    <gn-ui-dropdown-selector\n      *ngIf=\"displaySource\"\n      class=\"w-full md:flex-1 md:min-w-0\"\n      extraBtnClass=\"font-sans font-bold\"\n      [title]=\"'map.select.layer' | translate\"\n      [choices]=\"dropdownChoices$ | async\"\n      [selected]=\"_selectedChoice\"\n      (selectValue)=\"selectLinkToDisplay($event)\"\n    ></gn-ui-dropdown-selector>\n\n    <ng-container *ngIf=\"(styleLinks$ | async)?.length > 0; else styleDisabled\">\n      <gn-ui-dropdown-selector\n        class=\"w-full md:flex-1 md:min-w-0\"\n        extraBtnClass=\"font-sans font-bold\"\n        [title]=\"'map.select.style' | translate\"\n        [choices]=\"styleDropdownChoices$ | async\"\n        [selected]=\"_styleFromConfig\"\n        (selectValue)=\"selectStyleToDisplay($event)\"\n      ></gn-ui-dropdown-selector>\n    </ng-container>\n    <ng-template #styleDisabled>\n      <gn-ui-dropdown-selector\n        class=\"w-full md:flex-1 md:min-w-0 text-gray-400\"\n        extraBtnClass=\"font-sans font-bold text-gray-400\"\n        [title]=\"'map.select.style' | translate\"\n        [choices]=\"styleDropdownChoices$ | async\"\n        [disabled]=\"true\"\n      ></gn-ui-dropdown-selector>\n    </ng-template>\n\n    <div class=\"self-end md:ml-2\">\n      <gn-ui-external-viewer-button\n        extraClass=\"w-[44px] h-[44px]\"\n        [link]=\"selectedLink$ | async\"\n      >\n      </gn-ui-external-viewer-button>\n    </div>\n  </div>\n  <ng-container *ngIf=\"hidePreview; else mapView\">\n    <gn-ui-popup-alert\n      type=\"warning\"\n      icon=\"matErrorOutlineOutline\"\n      class=\"block h-12 p-1\"\n    >\n      <span translate>record.feature.limit</span>\n    </gn-ui-popup-alert>\n  </ng-container>\n  <ng-template #mapView>\n    <div\n      class=\"relative w-full h-full bg-white border border-gray-300 rounded-lg overflow-hidden\"\n    >\n      <gn-ui-map-container\n        #mapContainer\n        [context]=\"mapContext$ | async\"\n        (featuresClick)=\"onMapFeatureSelect($event)\"\n        (sourceLoadError)=\"onSourceLoadError($event)\"\n      ></gn-ui-map-container>\n      <div\n        class=\"top-[1em] right-[1em] p-3 bg-white absolute overflow-y-auto overflow-x-hidden max-h-72 w-56\"\n        [class.hidden]=\"!selection\"\n      >\n        <gn-ui-button\n          type=\"light\"\n          (buttonClick)=\"resetSelection()\"\n          style=\"\n            --gn-ui-button-padding: 0px;\n            --gn-ui-button-width: 24px;\n            --gn-ui-button-height: 24px;\n          \"\n          extraClass=\"absolute right-[0.5em] ml-[8px] mr-[10px]\"\n        >\n          <ng-icon name=\"matClose\" class=\"align-middle text-sm\"></ng-icon>\n        </gn-ui-button>\n        <gn-ui-feature-detail\n          [featureCatalog]=\"mdViewFacade.featureCatalog$ | async\"\n          [feature]=\"selection\"\n        ></gn-ui-feature-detail>\n      </div>\n\n      <div\n        class=\"top-[1em] p-3 bg-white absolute overflow-y-auto overflow-x-hidden max-h-72 w-56\"\n        [ngClass]=\"{ 'right-[1em]': !selection, 'right-[16em]': selection }\"\n        [hidden]=\"!showLegend || !legendExists\"\n      >\n        <div class=\"flex justify-between items-center mb-2\">\n          <div class=\"text-primary font-bold\" translate>map.legend.title</div>\n          <gn-ui-button\n            type=\"light\"\n            (buttonClick)=\"toggleLegend()\"\n            style=\"\n              --gn-ui-button-padding: 0px;\n              --gn-ui-button-width: 24px;\n              --gn-ui-button-height: 24px;\n            \"\n            extraClass=\"ml-[8px] mr-[10px]\"\n          >\n            <ng-icon name=\"matClose\" class=\"align-middle text-sm\"></ng-icon>\n          </gn-ui-button>\n        </div>\n        <gn-ui-map-legend\n          [context]=\"mapContext$ | async\"\n          (legendStatusChange)=\"onLegendStatusChange($event)\"\n        ></gn-ui-map-legend>\n      </div>\n\n      <gn-ui-button\n        *ngIf=\"!showLegend && legendExists && !selection\"\n        type=\"outline\"\n        (buttonClick)=\"toggleLegend()\"\n        extraClass=\"absolute top-[1em] right-[1em] rounded p-1 text-xs bg-white\"\n        translate\n      >\n        map.legend.title\n      </gn-ui-button>\n\n      <gn-ui-loading-mask\n        *ngIf=\"loading\"\n        class=\"absolute inset-0\"\n        [message]=\"'map.loading.data' | translate\"\n      ></gn-ui-loading-mask>\n      <gn-ui-popup-alert\n        *ngIf=\"error\"\n        type=\"warning\"\n        icon=\"matErrorOutlineOutline\"\n        class=\"absolute m-2 inset-0\"\n      >\n        <span translate>{{ error }}</span>\n      </gn-ui-popup-alert>\n    </div>\n  </ng-template>\n</div>\n" }]
+                    ], template: "<div class=\"w-full h-full flex flex-col gap-[13px]\">\n  <div\n    class=\"flex flex-col md:flex-row gap-4 py-4 px-5 bg-white border border-color-border rounded-lg mt-6\"\n  >\n    <gn-ui-dropdown-selector\n      *ngIf=\"displaySource\"\n      class=\"w-full md:flex-1 md:min-w-0\"\n      extraBtnClass=\"font-sans font-bold\"\n      [title]=\"'map.select.layer' | translate\"\n      [choices]=\"dropdownChoices$ | async\"\n      [selected]=\"_selectedChoice\"\n      (selectValue)=\"selectLinkToDisplay($event)\"\n    ></gn-ui-dropdown-selector>\n\n    <ng-container *ngIf=\"(styleLinks$ | async)?.length > 0; else styleDisabled\">\n      <gn-ui-dropdown-selector\n        class=\"w-full md:flex-1 md:min-w-0\"\n        extraBtnClass=\"font-sans font-bold\"\n        [title]=\"'map.select.style' | translate\"\n        [choices]=\"styleDropdownChoices$ | async\"\n        [selected]=\"_styleFromConfig\"\n        (selectValue)=\"selectStyleToDisplay($event)\"\n      ></gn-ui-dropdown-selector>\n    </ng-container>\n    <ng-template #styleDisabled>\n      <gn-ui-dropdown-selector\n        class=\"w-full md:flex-1 md:min-w-0 text-gray-400\"\n        extraBtnClass=\"font-sans font-bold text-gray-400\"\n        [title]=\"'map.select.style' | translate\"\n        [choices]=\"styleDropdownChoices$ | async\"\n        [disabled]=\"true\"\n      ></gn-ui-dropdown-selector>\n    </ng-template>\n\n    <div class=\"self-end md:ml-2\">\n      <gn-ui-external-viewer-button\n        extraClass=\"w-[44px] h-[44px]\"\n        [link]=\"selectedLink$ | async\"\n      >\n      </gn-ui-external-viewer-button>\n    </div>\n  </div>\n  <ng-container *ngIf=\"hidePreview; else mapView\">\n    <gn-ui-popup-alert\n      type=\"warning\"\n      icon=\"matErrorOutlineOutline\"\n      class=\"block h-12 p-1\"\n    >\n      <span translate>record.feature.limit</span>\n    </gn-ui-popup-alert>\n  </ng-container>\n  <ng-template #mapView>\n    <div\n      class=\"relative w-full h-full bg-white border border-gray-300 rounded-lg overflow-hidden\"\n    >\n      <gn-ui-map-container\n        #mapContainer\n        [context]=\"mapContext$ | async\"\n        (featuresClick)=\"onMapFeatureSelect($event)\"\n        (sourceLoadError)=\"onSourceLoadError($event)\"\n      ></gn-ui-map-container>\n      <div\n        class=\"top-[1em] right-[1em] p-3 bg-white absolute overflow-y-auto overflow-x-hidden max-h-72 w-56\"\n        [class.hidden]=\"!selection\"\n      >\n        <gn-ui-button\n          type=\"light\"\n          (buttonClick)=\"resetSelection()\"\n          style=\"\n            --gn-ui-button-padding: 0px;\n            --gn-ui-button-width: 24px;\n            --gn-ui-button-height: 24px;\n          \"\n          extraClass=\"absolute right-[0.5em] ml-[8px] mr-[10px]\"\n        >\n          <ng-icon name=\"matClose\" class=\"align-middle text-sm\"></ng-icon>\n        </gn-ui-button>\n        <gn-ui-feature-detail\n          [featureCatalog]=\"mdViewFacade.featureCatalog$ | async\"\n          [feature]=\"selection\"\n        ></gn-ui-feature-detail>\n      </div>\n\n      <div\n        class=\"top-[1em] p-3 bg-white absolute overflow-y-auto overflow-x-hidden max-h-72 w-56\"\n        [ngClass]=\"{ 'right-[1em]': !selection, 'right-[16em]': selection }\"\n        [hidden]=\"!showLegend || !legendExists\"\n      >\n        <div class=\"flex justify-between items-center mb-2\">\n          <div class=\"text-primary font-bold\" translate>map.legend.title</div>\n          <gn-ui-button\n            type=\"light\"\n            (buttonClick)=\"toggleLegend()\"\n            style=\"\n              --gn-ui-button-padding: 0px;\n              --gn-ui-button-width: 24px;\n              --gn-ui-button-height: 24px;\n            \"\n            extraClass=\"ml-[8px] mr-[10px]\"\n          >\n            <ng-icon name=\"matClose\" class=\"align-middle text-sm\"></ng-icon>\n          </gn-ui-button>\n        </div>\n        <gn-ui-map-legend\n          [context]=\"mapContext$ | async\"\n          (legendStatusChange)=\"onLegendStatusChange($event)\"\n        ></gn-ui-map-legend>\n      </div>\n\n      <gn-ui-button\n        *ngIf=\"!showLegend && legendExists && !selection\"\n        type=\"outline\"\n        (buttonClick)=\"toggleLegend()\"\n        extraClass=\"absolute top-[1em] right-[1em] rounded p-1 text-xs bg-white\"\n      >\n        {{ 'map.legend.title' | translate }}\n      </gn-ui-button>\n\n      <gn-ui-loading-mask\n        *ngIf=\"loading\"\n        class=\"absolute inset-0\"\n        [message]=\"'map.loading.data' | translate\"\n      ></gn-ui-loading-mask>\n      <gn-ui-popup-alert\n        *ngIf=\"error\"\n        type=\"warning\"\n        icon=\"matErrorOutlineOutline\"\n        class=\"absolute m-2 inset-0\"\n      >\n        <span translate>{{ error }}</span>\n      </gn-ui-popup-alert>\n    </div>\n  </ng-template>\n</div>\n" }]
         }], ctorParameters: () => [{ type: MdViewFacade }, { type: MapUtilsService }, { type: DataService }, { type: i0.ChangeDetectorRef }, { type: i1$1.TranslateService }], propDecorators: { exceedsLimit: [{
                 type: Input
             }], selectedView: [{
@@ -40687,33 +40781,68 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 type: Input
             }] } });
 
+function areTemporalExtentsEqual(previous, current) {
+    const previousStartTime = previous?.start?.getTime() ?? null;
+    const previousEndTime = previous?.end?.getTime() ?? null;
+    const currentStartTime = current?.start?.getTime() ?? null;
+    const currentEndTime = current?.end?.getTime() ?? null;
+    return (previousStartTime === currentStartTime && previousEndTime === currentEndTime);
+}
+function areSpatialExtentsEqual(previous, current) {
+    return (previous?.[0] === current?.[0] &&
+        previous?.[1] === current?.[1] &&
+        previous?.[2] === current?.[2] &&
+        previous?.[3] === current?.[3]);
+}
+function areFilterStatesEqual(previous, current) {
+    const sameTemporalExtents = areTemporalExtentsEqual(previous.temporalExtent, current.temporalExtent);
+    const sameSpatialExtents = !current.isSpatialExtentFilterEnabled ||
+        areSpatialExtentsEqual(previous.spatialExtent, current.spatialExtent);
+    const sameIsSpatialExtentFilterEnabled = previous.isSpatialExtentFilterEnabled ===
+        current.isSpatialExtentFilterEnabled;
+    const samePageUrl = previous.pageUrl === current.pageUrl;
+    return (sameTemporalExtents &&
+        sameSpatialExtents &&
+        sameIsSpatialExtentFilterEnabled &&
+        samePageUrl);
+}
+
 const STAC_ITEMS_PER_PAGE = 12;
 const DEBOUNCE_TIME_MS = 500;
 class StacViewComponent {
-    constructor(dataService, metadataViewFacade, translateService) {
+    constructor(dataService, metadataViewFacade, mapUtils, translateService) {
         this.dataService = dataService;
         this.metadataViewFacade = metadataViewFacade;
+        this.mapUtils = mapUtils;
         this.translateService = translateService;
-        this.isFilterModified = false;
-        this.error = null;
         this.initialTemporalExtent = null;
-        this.currentTemporalExtent$ = new BehaviorSubject(null);
-        this.currentPageUrl$ = new BehaviorSubject(null);
-        this.items$ = combineLatest([
-            this.currentPageUrl$,
-            this.currentTemporalExtent$,
-        ]).pipe(debounceTime$1(DEBOUNCE_TIME_MS), switchMap(([currentPageUrl, temporalExtent]) => {
-            this.error = null;
-            const options = {
-                limit: STAC_ITEMS_PER_PAGE,
-            };
-            if (temporalExtent && (temporalExtent.start || temporalExtent.end)) {
-                options.datetime = {
-                    ...(temporalExtent.start && { start: temporalExtent.start }),
-                    ...(temporalExtent.end && { end: temporalExtent.end }),
-                };
+        this.initialSpatialExtent = null;
+        this.resolvedInitialSpatialExtent = null;
+        this.error$ = new BehaviorSubject(null);
+        this.mapContext$ = new BehaviorSubject({
+            layers: [],
+            view: null,
+        });
+        this.filterState$ = new BehaviorSubject({
+            temporalExtent: null,
+            spatialExtent: null,
+            isSpatialExtentFilterEnabled: true,
+            pageUrl: null,
+        });
+        this.isFilterModified$ = this.filterState$.pipe(map$2((filterState) => {
+            const isTemporalModified = !areTemporalExtentsEqual(filterState.temporalExtent, this.initialTemporalExtent);
+            const isSpatialModified = this.resolvedInitialSpatialExtent &&
+                filterState.spatialExtent !== null &&
+                filterState.isSpatialExtentFilterEnabled &&
+                !areSpatialExtentsEqual(filterState.spatialExtent, this.resolvedInitialSpatialExtent);
+            return isTemporalModified || isSpatialModified;
+        }), shareReplay({ bufferSize: 1, refCount: false }));
+        this.items$ = this.filterState$.pipe(debounceTime$1(DEBOUNCE_TIME_MS), distinctUntilChanged$1((prev, curr) => areFilterStatesEqual(prev, curr)), switchMap((filterState) => {
+            if (filterState.pageUrl === null) {
+                return of([]);
             }
-            return from(this.dataService.getItemsFromStacApi(currentPageUrl, options)).pipe(tap$2((stacDocument) => {
+            this.error$.next(null);
+            return from(this.dataService.getItemsFromStacApi(filterState.pageUrl, this.buildRequestOptions(filterState))).pipe(tap$2((stacDocument) => {
                 this.previousPageUrl =
                     stacDocument.links.find((link) => link.rel === 'previous')?.href ||
                         null;
@@ -40723,7 +40852,7 @@ class StacViewComponent {
                 this.handleError(err);
                 return of([]);
             }));
-        }));
+        }), shareReplay({ bufferSize: 1, refCount: false }));
     }
     ngOnInit() {
         this.metadataViewFacade.metadata$
@@ -40731,49 +40860,116 @@ class StacViewComponent {
             const temporalExtents = metadata?.kind === 'dataset'
                 ? metadata.temporalExtents
                 : [];
-            return temporalExtents.length > 0
+            const temporalExtent = temporalExtents.length > 0
                 ? temporalExtents[0]
                 : {
                     start: null,
                     end: null,
                 };
+            const spatialExtent = this.mapUtils.getRecordExtent(metadata);
+            return { temporalExtent, spatialExtent };
         }))
-            .subscribe((extent) => {
-            this.initialTemporalExtent = extent;
-            this.currentTemporalExtent$.next(extent);
+            .subscribe(({ temporalExtent, spatialExtent }) => {
+            this.initialTemporalExtent = temporalExtent;
+            this.initialSpatialExtent = spatialExtent;
+            this.filterState$.next({
+                ...this.filterState$.value,
+                temporalExtent: this.initialTemporalExtent,
+            });
+            this.mapContext$.next({
+                ...this.mapContext$.value,
+                view: {
+                    extent: spatialExtent,
+                },
+            });
         });
         this.metadataViewFacade.stacLinks$
             .pipe(take$1(1), map$2((links) => (links && links.length > 0 ? links[0] : null)))
             .subscribe((link) => {
             if (link) {
                 this.initialPageUrl = link.url.href;
-                this.currentPageUrl$.next(link.url.href);
+                this.filterState$.next({
+                    ...this.filterState$.value,
+                    pageUrl: link.url.href,
+                });
             }
         });
     }
+    async ngAfterViewInit() {
+        const map = await this.mapContainer.openlayersMap;
+        prioritizePageScroll(map.getInteractions());
+    }
     onTemporalExtentChange(extent) {
-        this.currentTemporalExtent$.next(extent);
-        // make sure to use url without pagination token when temporal filter changes
-        this.currentPageUrl$.next(this.initialPageUrl);
-        this.isFilterModified = true;
+        this.filterState$.next({
+            ...this.filterState$.value,
+            temporalExtent: extent,
+            pageUrl: this.initialPageUrl,
+        });
+    }
+    onSpatialExtentChange(extent) {
+        this.filterState$.next({
+            ...this.filterState$.value,
+            spatialExtent: extent,
+            pageUrl: this.initialPageUrl,
+        });
+    }
+    onResolvedMapExtentChange(extent) {
+        this.resolvedInitialSpatialExtent = extent;
+    }
+    onSpatialFilterToggle(enabled) {
+        this.filterState$.next({
+            ...this.filterState$.value,
+            isSpatialExtentFilterEnabled: enabled,
+            pageUrl: this.initialPageUrl,
+        });
     }
     onResetFilters() {
-        this.currentTemporalExtent$.next(this.initialTemporalExtent);
-        this.isFilterModified = false;
+        this.mapContext$.next({
+            ...this.mapContext$.value,
+            view: {
+                extent: this.initialSpatialExtent,
+            },
+        });
+        this.filterState$.next({
+            temporalExtent: this.initialTemporalExtent,
+            spatialExtent: this.resolvedInitialSpatialExtent,
+            isSpatialExtentFilterEnabled: true,
+            pageUrl: this.initialPageUrl,
+        });
+    }
+    buildRequestOptions(filterState) {
+        const options = {
+            limit: STAC_ITEMS_PER_PAGE,
+        };
+        if (filterState.temporalExtent &&
+            (filterState.temporalExtent.start || filterState.temporalExtent.end)) {
+            options.datetime = {
+                ...(filterState.temporalExtent.start && {
+                    start: filterState.temporalExtent.start,
+                }),
+                ...(filterState.temporalExtent.end && {
+                    end: filterState.temporalExtent.end,
+                }),
+            };
+        }
+        if (filterState.isSpatialExtentFilterEnabled && filterState.spatialExtent) {
+            options.bbox = filterState.spatialExtent;
+        }
+        return options;
     }
     handleError(error) {
         if (error instanceof FetchError) {
-            this.error = this.translateService.instant(`dataset.error.${error.type}`, {
+            this.error$.next(this.translateService.instant(`dataset.error.${error.type}`, {
                 info: error.info,
-            });
+            }));
             console.warn(error.message);
         }
         else if (error instanceof Error) {
-            this.error = this.translateService.instant(error.message);
+            this.error$.next(this.translateService.instant(error.message));
             console.warn(error.stack || error);
         }
         else {
-            this.error = this.translateService.instant(error);
+            this.error$.next(this.translateService.instant(error));
             console.warn(error);
         }
     }
@@ -40785,13 +40981,19 @@ class StacViewComponent {
         return this.nextPageUrl == null;
     }
     goToNextPage() {
-        this.currentPageUrl$.next(this.nextPageUrl);
+        this.filterState$.next({
+            ...this.filterState$.value,
+            pageUrl: this.nextPageUrl,
+        });
     }
     goToPrevPage() {
-        this.currentPageUrl$.next(this.previousPageUrl);
+        this.filterState$.next({
+            ...this.filterState$.value,
+            pageUrl: this.previousPageUrl,
+        });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StacViewComponent, deps: [{ token: DataService }, { token: MdViewFacade }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: StacViewComponent, isStandalone: true, selector: "gn-ui-stac-view", ngImport: i0, template: "<div class=\"mt-6 bg-white border border-gray-300 overflow-hidden rounded-lg\">\n  <div\n    class=\"w-full min-h-[366px] flex md:flex-row flex-col border-b border-gray-300\"\n  >\n    <div class=\"md:w-1/2 w-full flex-1 flex flex-col\">\n      <gn-ui-date-range-inputs\n        [temporalExtent]=\"currentTemporalExtent$ | async\"\n        (temporalExtentChange)=\"onTemporalExtentChange($event)\"\n      ></gn-ui-date-range-inputs>\n\n      <div class=\"mt-auto mb-8 mx-8\" *ngIf=\"isFilterModified\">\n        <gn-ui-button\n          id=\"reset-filters-button\"\n          type=\"light\"\n          (buttonClick)=\"onResetFilters()\"\n        >\n          <span translate>stac.filter.reset</span>\n          <ng-icon name=\"matDeleteOutline\" class=\"ml-2\"></ng-icon>\n        </gn-ui-button>\n      </div>\n    </div>\n\n    <div class=\"md:w-1/2 w-full min-h-[280px] flex items-center justify-center\">\n      <span>Map...</span>\n    </div>\n  </div>\n  <div\n    class=\"relative mx-5 my-[30px] min-h-[274px] flex items-center justify-center flex-col\"\n  >\n    <!-- Keep grid outside ngIf to keep items$ observable alive -->\n    <gn-ui-stac-items-result-grid\n      [items]=\"items$ | async\"\n    ></gn-ui-stac-items-result-grid>\n    <div\n      *ngIf=\"(items$ | async)?.length > 0; else noResultsOrError\"\n      class=\"mt-[20px] mx-auto flex justify-center\"\n    >\n      <gn-ui-previous-next-buttons\n        [listComponent]=\"this\"\n        [displayLabels]=\"true\"\n      ></gn-ui-previous-next-buttons>\n    </div>\n    <ng-template #noResultsOrError>\n      <gn-ui-popup-alert\n        *ngIf=\"error\"\n        type=\"warning\"\n        icon=\"matErrorOutlineOutline\"\n        class=\"absolute left-0 top-0 w-full block\"\n      >\n        <span translate>{{ error }}</span>\n      </gn-ui-popup-alert>\n      <div\n        *ngIf=\"!error\"\n        class=\"flex items-center justify-center flex-col h-full gap-[10px]\"\n      >\n        <h2 class=\"text-center text-xl\" translate>stac.results.noResults</h2>\n        <gn-ui-button\n          id=\"no-results-button\"\n          type=\"secondary\"\n          (buttonClick)=\"onResetFilters()\"\n        >\n          <span translate>stac.filter.reset</span>\n          <ng-icon name=\"matDeleteOutline\" class=\"ml-2\"></ng-icon>\n        </gn-ui-button>\n      </div>\n    </ng-template>\n  </div>\n</div>\n", styles: [":host{--gn-ui-button-padding: 7px 8px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: StacItemsResultGridComponent, selector: "gn-ui-stac-items-result-grid", inputs: ["items"] }, { kind: "component", type: DateRangeInputsComponent, selector: "gn-ui-date-range-inputs", inputs: ["temporalExtent"], outputs: ["temporalExtentChange"] }, { kind: "component", type: PreviousNextButtonsComponent, selector: "gn-ui-previous-next-buttons", inputs: ["listComponent", "displayLabels"] }, { kind: "component", type: PopupAlertComponent, selector: "gn-ui-popup-alert", inputs: ["icon", "type", "position"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }], viewProviders: [provideIcons({ matDeleteOutline })], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StacViewComponent, deps: [{ token: DataService }, { token: MdViewFacade }, { token: MapUtilsService }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: StacViewComponent, isStandalone: true, selector: "gn-ui-stac-view", viewQueries: [{ propertyName: "mapContainer", first: true, predicate: ["mapContainer"], descendants: true }], ngImport: i0, template: "<div class=\"mt-6 bg-white border border-gray-300 overflow-hidden rounded-lg\">\n  <div\n    class=\"w-full h-[700px] md:h-[366px] flex md:flex-row flex-col border-b border-gray-300\"\n  >\n    @let filterState = filterState$ | async;\n\n    <div class=\"w-full md:w-5/12 h-[366px] flex flex-col\">\n      <gn-ui-date-range-inputs\n        [temporalExtent]=\"filterState.temporalExtent\"\n        (temporalExtentChange)=\"onTemporalExtentChange($event)\"\n      ></gn-ui-date-range-inputs>\n\n      <div class=\"mt-auto mb-8 mx-8\" *ngIf=\"isFilterModified$ | async\">\n        <gn-ui-button\n          id=\"reset-filters-button\"\n          type=\"light\"\n          (buttonClick)=\"onResetFilters()\"\n        >\n          <span translate>stac.filter.reset</span>\n          <ng-icon name=\"matDeleteOutline\" class=\"ml-2\"></ng-icon>\n        </gn-ui-button>\n      </div>\n    </div>\n\n    <div class=\"w-full md:w-7/12 h-[334px] md:h-[366px] flex flex-col\">\n      <gn-ui-map-container\n        #mapContainer\n        [context]=\"mapContext$ | async\"\n        (extentChange)=\"onSpatialExtentChange($event)\"\n        (resolvedExtentChange)=\"onResolvedMapExtentChange($event)\"\n        class=\"w-full h-full\"\n      >\n        <div\n          class=\"bg-white rounded-xl shadow-xl absolute left-1/2 transform -translate-x-1/2 bottom-0 mb-2.5 px-4 py-2 z-10 max-w-[90%] w-max\"\n        >\n          <gn-ui-check-toggle\n            [value]=\"filterState.isSpatialExtentFilterEnabled\"\n            (toggled)=\"onSpatialFilterToggle($event)\"\n            [label]=\"'stac.filter.enable' | translate\"\n            [color]=\"'primary'\"\n          ></gn-ui-check-toggle>\n        </div>\n      </gn-ui-map-container>\n    </div>\n  </div>\n  <div\n    class=\"relative mx-5 my-[30px] min-h-[274px] flex items-center justify-center flex-col\"\n  >\n    <!-- Keep grid outside ngIf to keep items$ observable alive -->\n    <gn-ui-stac-items-result-grid\n      [items]=\"items$ | async\"\n    ></gn-ui-stac-items-result-grid>\n    <div\n      *ngIf=\"(items$ | async)?.length > 0; else noResultsOrError\"\n      class=\"mt-[20px] mx-auto flex justify-center\"\n    >\n      <gn-ui-previous-next-buttons\n        [listComponent]=\"this\"\n        [displayLabels]=\"true\"\n      ></gn-ui-previous-next-buttons>\n    </div>\n    <ng-template #noResultsOrError>\n      <gn-ui-popup-alert\n        *ngIf=\"error$ | async as error\"\n        type=\"warning\"\n        icon=\"matErrorOutlineOutline\"\n        class=\"absolute left-0 top-0 w-full block\"\n      >\n        <span translate>{{ error }}</span>\n      </gn-ui-popup-alert>\n      <div\n        *ngIf=\"(error$ | async) === null\"\n        class=\"flex items-center justify-center flex-col h-full gap-[10px]\"\n      >\n        <h2 class=\"text-center text-xl\" translate>stac.results.noResults</h2>\n        <gn-ui-button\n          id=\"no-results-button\"\n          type=\"secondary\"\n          (buttonClick)=\"onResetFilters()\"\n        >\n          <span translate>stac.filter.reset</span>\n          <ng-icon name=\"matDeleteOutline\" class=\"ml-2\"></ng-icon>\n        </gn-ui-button>\n      </div>\n    </ng-template>\n  </div>\n</div>\n", styles: [":host{--gn-ui-button-padding: 7px 8px}::ng-deep .ol-overlaycontainer-stopevent{z-index:11!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "component", type: StacItemsResultGridComponent, selector: "gn-ui-stac-items-result-grid", inputs: ["items"] }, { kind: "component", type: DateRangeInputsComponent, selector: "gn-ui-date-range-inputs", inputs: ["temporalExtent"], outputs: ["temporalExtentChange"] }, { kind: "component", type: MapContainerComponent, selector: "gn-ui-map-container", inputs: ["context"], outputs: ["featuresClick", "featuresHover", "mapClick", "extentChange", "sourceLoadError", "resolvedExtentChange"] }, { kind: "component", type: CheckToggleComponent, selector: "gn-ui-check-toggle", inputs: ["title", "label", "value", "color"], outputs: ["toggled"] }, { kind: "component", type: PreviousNextButtonsComponent, selector: "gn-ui-previous-next-buttons", inputs: ["listComponent", "displayLabels"] }, { kind: "component", type: PopupAlertComponent, selector: "gn-ui-popup-alert", inputs: ["icon", "type", "position"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }], viewProviders: [provideIcons({ matDeleteOutline })], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StacViewComponent, decorators: [{
             type: Component,
@@ -40799,13 +41001,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         CommonModule,
                         NgIconComponent,
                         TranslateDirective,
+                        TranslatePipe,
                         StacItemsResultGridComponent,
                         DateRangeInputsComponent,
+                        MapContainerComponent,
+                        CheckToggleComponent,
                         PreviousNextButtonsComponent,
                         PopupAlertComponent,
                         ButtonComponent,
-                    ], viewProviders: [provideIcons({ matDeleteOutline })], template: "<div class=\"mt-6 bg-white border border-gray-300 overflow-hidden rounded-lg\">\n  <div\n    class=\"w-full min-h-[366px] flex md:flex-row flex-col border-b border-gray-300\"\n  >\n    <div class=\"md:w-1/2 w-full flex-1 flex flex-col\">\n      <gn-ui-date-range-inputs\n        [temporalExtent]=\"currentTemporalExtent$ | async\"\n        (temporalExtentChange)=\"onTemporalExtentChange($event)\"\n      ></gn-ui-date-range-inputs>\n\n      <div class=\"mt-auto mb-8 mx-8\" *ngIf=\"isFilterModified\">\n        <gn-ui-button\n          id=\"reset-filters-button\"\n          type=\"light\"\n          (buttonClick)=\"onResetFilters()\"\n        >\n          <span translate>stac.filter.reset</span>\n          <ng-icon name=\"matDeleteOutline\" class=\"ml-2\"></ng-icon>\n        </gn-ui-button>\n      </div>\n    </div>\n\n    <div class=\"md:w-1/2 w-full min-h-[280px] flex items-center justify-center\">\n      <span>Map...</span>\n    </div>\n  </div>\n  <div\n    class=\"relative mx-5 my-[30px] min-h-[274px] flex items-center justify-center flex-col\"\n  >\n    <!-- Keep grid outside ngIf to keep items$ observable alive -->\n    <gn-ui-stac-items-result-grid\n      [items]=\"items$ | async\"\n    ></gn-ui-stac-items-result-grid>\n    <div\n      *ngIf=\"(items$ | async)?.length > 0; else noResultsOrError\"\n      class=\"mt-[20px] mx-auto flex justify-center\"\n    >\n      <gn-ui-previous-next-buttons\n        [listComponent]=\"this\"\n        [displayLabels]=\"true\"\n      ></gn-ui-previous-next-buttons>\n    </div>\n    <ng-template #noResultsOrError>\n      <gn-ui-popup-alert\n        *ngIf=\"error\"\n        type=\"warning\"\n        icon=\"matErrorOutlineOutline\"\n        class=\"absolute left-0 top-0 w-full block\"\n      >\n        <span translate>{{ error }}</span>\n      </gn-ui-popup-alert>\n      <div\n        *ngIf=\"!error\"\n        class=\"flex items-center justify-center flex-col h-full gap-[10px]\"\n      >\n        <h2 class=\"text-center text-xl\" translate>stac.results.noResults</h2>\n        <gn-ui-button\n          id=\"no-results-button\"\n          type=\"secondary\"\n          (buttonClick)=\"onResetFilters()\"\n        >\n          <span translate>stac.filter.reset</span>\n          <ng-icon name=\"matDeleteOutline\" class=\"ml-2\"></ng-icon>\n        </gn-ui-button>\n      </div>\n    </ng-template>\n  </div>\n</div>\n", styles: [":host{--gn-ui-button-padding: 7px 8px}\n"] }]
-        }], ctorParameters: () => [{ type: DataService }, { type: MdViewFacade }, { type: i1$1.TranslateService }] });
+                    ], viewProviders: [provideIcons({ matDeleteOutline })], template: "<div class=\"mt-6 bg-white border border-gray-300 overflow-hidden rounded-lg\">\n  <div\n    class=\"w-full h-[700px] md:h-[366px] flex md:flex-row flex-col border-b border-gray-300\"\n  >\n    @let filterState = filterState$ | async;\n\n    <div class=\"w-full md:w-5/12 h-[366px] flex flex-col\">\n      <gn-ui-date-range-inputs\n        [temporalExtent]=\"filterState.temporalExtent\"\n        (temporalExtentChange)=\"onTemporalExtentChange($event)\"\n      ></gn-ui-date-range-inputs>\n\n      <div class=\"mt-auto mb-8 mx-8\" *ngIf=\"isFilterModified$ | async\">\n        <gn-ui-button\n          id=\"reset-filters-button\"\n          type=\"light\"\n          (buttonClick)=\"onResetFilters()\"\n        >\n          <span translate>stac.filter.reset</span>\n          <ng-icon name=\"matDeleteOutline\" class=\"ml-2\"></ng-icon>\n        </gn-ui-button>\n      </div>\n    </div>\n\n    <div class=\"w-full md:w-7/12 h-[334px] md:h-[366px] flex flex-col\">\n      <gn-ui-map-container\n        #mapContainer\n        [context]=\"mapContext$ | async\"\n        (extentChange)=\"onSpatialExtentChange($event)\"\n        (resolvedExtentChange)=\"onResolvedMapExtentChange($event)\"\n        class=\"w-full h-full\"\n      >\n        <div\n          class=\"bg-white rounded-xl shadow-xl absolute left-1/2 transform -translate-x-1/2 bottom-0 mb-2.5 px-4 py-2 z-10 max-w-[90%] w-max\"\n        >\n          <gn-ui-check-toggle\n            [value]=\"filterState.isSpatialExtentFilterEnabled\"\n            (toggled)=\"onSpatialFilterToggle($event)\"\n            [label]=\"'stac.filter.enable' | translate\"\n            [color]=\"'primary'\"\n          ></gn-ui-check-toggle>\n        </div>\n      </gn-ui-map-container>\n    </div>\n  </div>\n  <div\n    class=\"relative mx-5 my-[30px] min-h-[274px] flex items-center justify-center flex-col\"\n  >\n    <!-- Keep grid outside ngIf to keep items$ observable alive -->\n    <gn-ui-stac-items-result-grid\n      [items]=\"items$ | async\"\n    ></gn-ui-stac-items-result-grid>\n    <div\n      *ngIf=\"(items$ | async)?.length > 0; else noResultsOrError\"\n      class=\"mt-[20px] mx-auto flex justify-center\"\n    >\n      <gn-ui-previous-next-buttons\n        [listComponent]=\"this\"\n        [displayLabels]=\"true\"\n      ></gn-ui-previous-next-buttons>\n    </div>\n    <ng-template #noResultsOrError>\n      <gn-ui-popup-alert\n        *ngIf=\"error$ | async as error\"\n        type=\"warning\"\n        icon=\"matErrorOutlineOutline\"\n        class=\"absolute left-0 top-0 w-full block\"\n      >\n        <span translate>{{ error }}</span>\n      </gn-ui-popup-alert>\n      <div\n        *ngIf=\"(error$ | async) === null\"\n        class=\"flex items-center justify-center flex-col h-full gap-[10px]\"\n      >\n        <h2 class=\"text-center text-xl\" translate>stac.results.noResults</h2>\n        <gn-ui-button\n          id=\"no-results-button\"\n          type=\"secondary\"\n          (buttonClick)=\"onResetFilters()\"\n        >\n          <span translate>stac.filter.reset</span>\n          <ng-icon name=\"matDeleteOutline\" class=\"ml-2\"></ng-icon>\n        </gn-ui-button>\n      </div>\n    </ng-template>\n  </div>\n</div>\n", styles: [":host{--gn-ui-button-padding: 7px 8px}::ng-deep .ol-overlaycontainer-stopevent{z-index:11!important}\n"] }]
+        }], ctorParameters: () => [{ type: DataService }, { type: MdViewFacade }, { type: MapUtilsService }, { type: i1$1.TranslateService }], propDecorators: { mapContainer: [{
+                type: ViewChild,
+                args: ['mapContainer']
+            }] } });
 
 // expects the replacement key ${name}
 const ORGANIZATION_PAGE_URL_TOKEN = new InjectionToken('organization-page-url-token');
@@ -44078,7 +44286,7 @@ class MultilingualPanelComponent {
             provideNgIconsConfig({
                 size: '1.25em',
             }),
-        ], viewQueries: [{ propertyName: "actionMenuButtons", predicate: ["actionMenuButton"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n  class=\"flex flex-col h-full w-[302px] border-l border-gray-300 py-8 px-3 gap-6 overflow-auto\"\n  style=\"background-color: #fafaf9\"\n>\n  <div class=\"flex flex-row px-2 justify-between\">\n    <span class=\"text-3xl font-title text-black/80\" translate\n      >editor.record.form.multilingual.title</span\n    >\n    <button\n      [title]=\"'editor.record.form.multilingual.open' | translate\"\n      (click)=\"toggleLanguageSelection()\"\n      *ngIf=\"isMultilingual\"\n      data-test=\"activateSelection\"\n    >\n      <ng-icon class=\"mt-1\" name=\"iconoirSettings\"></ng-icon>\n    </button>\n  </div>\n  <div class=\"flex flex-col gap-2\" *ngIf=\"editTranslations || !isMultilingual\">\n    <gn-ui-check-toggle\n      class=\"p-2\"\n      [label]=\"'editor.record.form.multilingual.enable' | translate\"\n      [color]=\"'primary'\"\n      [(value)]=\"isMultilingual\"\n      (toggled)=\"switchMultilingual($event)\"\n    ></gn-ui-check-toggle>\n    <div *ngIf=\"isMultilingual\" class=\"flex flex-col gap-2\">\n      <div class=\"flex flex-row justify-between border-t border-gray-300 p-3\">\n        <span class=\"mt-2 text-sm text-gray-600\" translate\n          >editor.record.form.multilingual.activate</span\n        >\n        <gn-ui-button\n          extraClass=\"w-16 h-8 font-bold\"\n          type=\"gray\"\n          (buttonClick)=\"validateTranslations()\"\n          data-test=\"validateSelection\"\n          >{{ 'editor.record.form.multilingual.validate' | translate }}\n        </gn-ui-button>\n      </div>\n      <ng-container *ngIf=\"supportedLanguages$ | async as languages\">\n        <div\n          class=\"flex flex-col gap-2 w-full px-2\"\n          data-test=\"langAvailable\"\n          *ngFor=\"let lang of languages\"\n        >\n          <gn-ui-button\n            [extraClass]=\"getExtraClass(lang)\"\n            type=\"gray\"\n            (buttonClick)=\"toggleLanguage(lang)\"\n            [disabled]=\"lang === _record.defaultLanguage\"\n            [title]=\"getToggleTitle(lang)\"\n          >\n            <span [class]=\"getIconClass(lang)\"></span>\n            <span class=\"ml-2\">{{ 'language.' + lang | translate }}</span>\n          </gn-ui-button>\n        </div>\n      </ng-container>\n    </div>\n  </div>\n  <div *ngIf=\"!editTranslations && isMultilingual\" class=\"flex flex-col gap-2\">\n    <gn-ui-button\n      *ngFor=\"let recordLang of sortLanguages(recordLanguages); let i = index\"\n      extraClass=\"flex flex-row justify-between bg-white border border-white rounded mb-1 h-[34px] w-full\"\n      [ngClass]=\"{\n        'mt-8': isFirstUnsupported(i),\n        '': true,\n      }\"\n      (buttonClick)=\"switchFormLang(recordLang)\"\n      type=\"outline\"\n      data-test=\"langSwitch\"\n    >\n      <div class=\"flex flex-row gap-2 items-center\">\n        <ng-icon\n          *ngIf=\"recordLang === formLanguage\"\n          class=\"text-primary mt-1\"\n          name=\"iconoirCheckCircle\"\n        ></ng-icon>\n        <ng-icon\n          *ngIf=\"recordLang !== formLanguage\"\n          class=\"text-gray-800 mt-1\"\n          name=\"iconoirCircle\"\n        ></ng-icon>\n        <span\n          *ngIf=\"recordLang.length === 2\"\n          [class]=\"getIconClass(recordLang) + 'mt-1'\"\n        ></span>\n        <span [ngClass]=\"recordLang === formLanguage ? 'text-black' : ''\">{{\n          isLangSupported(recordLang)\n            ? ('language.' + recordLang | translate)\n            : recordLang.toUpperCase()\n        }}</span>\n      </div>\n      <div class=\"flex flex-row gap-2 items-center\">\n        <span\n          *ngIf=\"recordLang === formLanguage\"\n          class=\"text-xs text-base\"\n          translate\n          >editor.record.form.multilingual.default</span\n        >\n        <button\n          (click)=\"\n            openActionMenu(recordLang, template); $event.stopPropagation()\n          \"\n          cdkOverlayOrigin\n          #actionMenuButton\n        >\n          <ng-icon class=\"pb-5\" name=\"matMoreHorizOutline\"></ng-icon>\n        </button>\n        <ng-template #template>\n          <gn-ui-action-menu\n            [canDelete]=\"recordLang !== _record.defaultLanguage\"\n            page=\"record\"\n            (delete)=\"confirmDeleteAction(recordLang)\"\n            (closeActionMenu)=\"closeActionMenu()\"\n            (switch)=\"switchDefaultLang(recordLang)\"\n          >\n          </gn-ui-action-menu>\n        </ng-template>\n      </div>\n    </gn-ui-button>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "component", type: CheckToggleComponent, selector: "gn-ui-check-toggle", inputs: ["title", "label", "value", "color"], outputs: ["toggled"] }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: ActionMenuComponent, selector: "gn-ui-action-menu", inputs: ["canDuplicate", "isDuplicating", "canDelete", "page"], outputs: ["duplicate", "delete", "closeActionMenu", "rollback", "switch"] }] }); }
+        ], viewQueries: [{ propertyName: "actionMenuButtons", predicate: ["actionMenuButton"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n  class=\"flex flex-col h-full w-[302px] border-l border-gray-300 py-8 px-3 gap-6 overflow-auto\"\n  style=\"background-color: #fafaf9\"\n>\n  <div class=\"flex flex-row px-2 justify-between\">\n    <span class=\"text-3xl font-title text-black/80\" translate\n      >editor.record.form.multilingual.title</span\n    >\n    <button\n      [title]=\"'editor.record.form.multilingual.open' | translate\"\n      (click)=\"toggleLanguageSelection()\"\n      *ngIf=\"isMultilingual\"\n      data-test=\"activateSelection\"\n    >\n      <ng-icon class=\"mt-1\" name=\"iconoirSettings\"></ng-icon>\n    </button>\n  </div>\n  <div class=\"flex flex-col gap-2\" *ngIf=\"editTranslations || !isMultilingual\">\n    <gn-ui-check-toggle\n      class=\"p-2\"\n      [label]=\"'editor.record.form.multilingual.enable' | translate\"\n      [color]=\"'primary'\"\n      [(value)]=\"isMultilingual\"\n      (toggled)=\"switchMultilingual($event)\"\n    ></gn-ui-check-toggle>\n    <div *ngIf=\"isMultilingual\" class=\"flex flex-col gap-2\">\n      <div class=\"flex flex-row justify-between border-t border-gray-300 p-3\">\n        <span class=\"mt-2 text-sm text-gray-600\" translate\n          >editor.record.form.multilingual.activate</span\n        >\n        <gn-ui-button\n          extraClass=\"w-16 h-8 font-bold\"\n          type=\"gray\"\n          (buttonClick)=\"validateTranslations()\"\n          data-test=\"validateSelection\"\n          >{{ 'editor.record.form.multilingual.validate' | translate }}\n        </gn-ui-button>\n      </div>\n      <ng-container *ngIf=\"supportedLanguages$ | async as languages\">\n        <div\n          class=\"flex flex-col gap-2 w-full px-2\"\n          data-test=\"langAvailable\"\n          [attr.data-test-lang]=\"lang\"\n          *ngFor=\"let lang of languages\"\n        >\n          <gn-ui-button\n            [extraClass]=\"getExtraClass(lang)\"\n            type=\"gray\"\n            (buttonClick)=\"toggleLanguage(lang)\"\n            [disabled]=\"lang === _record.defaultLanguage\"\n            [title]=\"getToggleTitle(lang)\"\n          >\n            <span [class]=\"getIconClass(lang)\"></span>\n            <span class=\"ml-2\">{{ 'language.' + lang | translate }}</span>\n          </gn-ui-button>\n        </div>\n      </ng-container>\n    </div>\n  </div>\n  <div *ngIf=\"!editTranslations && isMultilingual\" class=\"flex flex-col gap-2\">\n    <gn-ui-button\n      *ngFor=\"let recordLang of sortLanguages(recordLanguages); let i = index\"\n      extraClass=\"flex flex-row justify-between bg-white border border-white rounded mb-1 h-[34px] w-full\"\n      [ngClass]=\"{\n        'mt-8': isFirstUnsupported(i),\n        '': true,\n      }\"\n      (buttonClick)=\"switchFormLang(recordLang)\"\n      type=\"outline\"\n      data-test=\"langSwitch\"\n    >\n      <div class=\"flex flex-row gap-2 items-center\">\n        <ng-icon\n          *ngIf=\"recordLang === formLanguage\"\n          class=\"text-primary mt-1\"\n          name=\"iconoirCheckCircle\"\n        ></ng-icon>\n        <ng-icon\n          *ngIf=\"recordLang !== formLanguage\"\n          class=\"text-gray-800 mt-1\"\n          name=\"iconoirCircle\"\n        ></ng-icon>\n        <span\n          *ngIf=\"recordLang.length === 2\"\n          [class]=\"getIconClass(recordLang) + 'mt-1'\"\n        ></span>\n        <span [ngClass]=\"recordLang === formLanguage ? 'text-black' : ''\">{{\n          isLangSupported(recordLang)\n            ? ('language.' + recordLang | translate)\n            : recordLang.toUpperCase()\n        }}</span>\n      </div>\n      <div class=\"flex flex-row gap-2 items-center\">\n        <span\n          *ngIf=\"recordLang === formLanguage\"\n          class=\"text-xs text-base\"\n          translate\n          >editor.record.form.multilingual.default</span\n        >\n        <button\n          (click)=\"\n            openActionMenu(recordLang, template); $event.stopPropagation()\n          \"\n          cdkOverlayOrigin\n          #actionMenuButton\n        >\n          <ng-icon class=\"pb-5\" name=\"matMoreHorizOutline\"></ng-icon>\n        </button>\n        <ng-template #template>\n          <gn-ui-action-menu\n            [canDelete]=\"recordLang !== _record.defaultLanguage\"\n            page=\"record\"\n            (delete)=\"confirmDeleteAction(recordLang)\"\n            (closeActionMenu)=\"closeActionMenu()\"\n            (switch)=\"switchDefaultLang(recordLang)\"\n          >\n          </gn-ui-action-menu>\n        </ng-template>\n      </div>\n    </gn-ui-button>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "component", type: CheckToggleComponent, selector: "gn-ui-check-toggle", inputs: ["title", "label", "value", "color"], outputs: ["toggled"] }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: ActionMenuComponent, selector: "gn-ui-action-menu", inputs: ["canDuplicate", "isDuplicating", "canDelete", "page"], outputs: ["duplicate", "delete", "closeActionMenu", "rollback", "switch"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MultilingualPanelComponent, decorators: [{
             type: Component,
@@ -44100,7 +44308,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         provideNgIconsConfig({
                             size: '1.25em',
                         }),
-                    ], template: "<div\n  class=\"flex flex-col h-full w-[302px] border-l border-gray-300 py-8 px-3 gap-6 overflow-auto\"\n  style=\"background-color: #fafaf9\"\n>\n  <div class=\"flex flex-row px-2 justify-between\">\n    <span class=\"text-3xl font-title text-black/80\" translate\n      >editor.record.form.multilingual.title</span\n    >\n    <button\n      [title]=\"'editor.record.form.multilingual.open' | translate\"\n      (click)=\"toggleLanguageSelection()\"\n      *ngIf=\"isMultilingual\"\n      data-test=\"activateSelection\"\n    >\n      <ng-icon class=\"mt-1\" name=\"iconoirSettings\"></ng-icon>\n    </button>\n  </div>\n  <div class=\"flex flex-col gap-2\" *ngIf=\"editTranslations || !isMultilingual\">\n    <gn-ui-check-toggle\n      class=\"p-2\"\n      [label]=\"'editor.record.form.multilingual.enable' | translate\"\n      [color]=\"'primary'\"\n      [(value)]=\"isMultilingual\"\n      (toggled)=\"switchMultilingual($event)\"\n    ></gn-ui-check-toggle>\n    <div *ngIf=\"isMultilingual\" class=\"flex flex-col gap-2\">\n      <div class=\"flex flex-row justify-between border-t border-gray-300 p-3\">\n        <span class=\"mt-2 text-sm text-gray-600\" translate\n          >editor.record.form.multilingual.activate</span\n        >\n        <gn-ui-button\n          extraClass=\"w-16 h-8 font-bold\"\n          type=\"gray\"\n          (buttonClick)=\"validateTranslations()\"\n          data-test=\"validateSelection\"\n          >{{ 'editor.record.form.multilingual.validate' | translate }}\n        </gn-ui-button>\n      </div>\n      <ng-container *ngIf=\"supportedLanguages$ | async as languages\">\n        <div\n          class=\"flex flex-col gap-2 w-full px-2\"\n          data-test=\"langAvailable\"\n          *ngFor=\"let lang of languages\"\n        >\n          <gn-ui-button\n            [extraClass]=\"getExtraClass(lang)\"\n            type=\"gray\"\n            (buttonClick)=\"toggleLanguage(lang)\"\n            [disabled]=\"lang === _record.defaultLanguage\"\n            [title]=\"getToggleTitle(lang)\"\n          >\n            <span [class]=\"getIconClass(lang)\"></span>\n            <span class=\"ml-2\">{{ 'language.' + lang | translate }}</span>\n          </gn-ui-button>\n        </div>\n      </ng-container>\n    </div>\n  </div>\n  <div *ngIf=\"!editTranslations && isMultilingual\" class=\"flex flex-col gap-2\">\n    <gn-ui-button\n      *ngFor=\"let recordLang of sortLanguages(recordLanguages); let i = index\"\n      extraClass=\"flex flex-row justify-between bg-white border border-white rounded mb-1 h-[34px] w-full\"\n      [ngClass]=\"{\n        'mt-8': isFirstUnsupported(i),\n        '': true,\n      }\"\n      (buttonClick)=\"switchFormLang(recordLang)\"\n      type=\"outline\"\n      data-test=\"langSwitch\"\n    >\n      <div class=\"flex flex-row gap-2 items-center\">\n        <ng-icon\n          *ngIf=\"recordLang === formLanguage\"\n          class=\"text-primary mt-1\"\n          name=\"iconoirCheckCircle\"\n        ></ng-icon>\n        <ng-icon\n          *ngIf=\"recordLang !== formLanguage\"\n          class=\"text-gray-800 mt-1\"\n          name=\"iconoirCircle\"\n        ></ng-icon>\n        <span\n          *ngIf=\"recordLang.length === 2\"\n          [class]=\"getIconClass(recordLang) + 'mt-1'\"\n        ></span>\n        <span [ngClass]=\"recordLang === formLanguage ? 'text-black' : ''\">{{\n          isLangSupported(recordLang)\n            ? ('language.' + recordLang | translate)\n            : recordLang.toUpperCase()\n        }}</span>\n      </div>\n      <div class=\"flex flex-row gap-2 items-center\">\n        <span\n          *ngIf=\"recordLang === formLanguage\"\n          class=\"text-xs text-base\"\n          translate\n          >editor.record.form.multilingual.default</span\n        >\n        <button\n          (click)=\"\n            openActionMenu(recordLang, template); $event.stopPropagation()\n          \"\n          cdkOverlayOrigin\n          #actionMenuButton\n        >\n          <ng-icon class=\"pb-5\" name=\"matMoreHorizOutline\"></ng-icon>\n        </button>\n        <ng-template #template>\n          <gn-ui-action-menu\n            [canDelete]=\"recordLang !== _record.defaultLanguage\"\n            page=\"record\"\n            (delete)=\"confirmDeleteAction(recordLang)\"\n            (closeActionMenu)=\"closeActionMenu()\"\n            (switch)=\"switchDefaultLang(recordLang)\"\n          >\n          </gn-ui-action-menu>\n        </ng-template>\n      </div>\n    </gn-ui-button>\n  </div>\n</div>\n" }]
+                    ], template: "<div\n  class=\"flex flex-col h-full w-[302px] border-l border-gray-300 py-8 px-3 gap-6 overflow-auto\"\n  style=\"background-color: #fafaf9\"\n>\n  <div class=\"flex flex-row px-2 justify-between\">\n    <span class=\"text-3xl font-title text-black/80\" translate\n      >editor.record.form.multilingual.title</span\n    >\n    <button\n      [title]=\"'editor.record.form.multilingual.open' | translate\"\n      (click)=\"toggleLanguageSelection()\"\n      *ngIf=\"isMultilingual\"\n      data-test=\"activateSelection\"\n    >\n      <ng-icon class=\"mt-1\" name=\"iconoirSettings\"></ng-icon>\n    </button>\n  </div>\n  <div class=\"flex flex-col gap-2\" *ngIf=\"editTranslations || !isMultilingual\">\n    <gn-ui-check-toggle\n      class=\"p-2\"\n      [label]=\"'editor.record.form.multilingual.enable' | translate\"\n      [color]=\"'primary'\"\n      [(value)]=\"isMultilingual\"\n      (toggled)=\"switchMultilingual($event)\"\n    ></gn-ui-check-toggle>\n    <div *ngIf=\"isMultilingual\" class=\"flex flex-col gap-2\">\n      <div class=\"flex flex-row justify-between border-t border-gray-300 p-3\">\n        <span class=\"mt-2 text-sm text-gray-600\" translate\n          >editor.record.form.multilingual.activate</span\n        >\n        <gn-ui-button\n          extraClass=\"w-16 h-8 font-bold\"\n          type=\"gray\"\n          (buttonClick)=\"validateTranslations()\"\n          data-test=\"validateSelection\"\n          >{{ 'editor.record.form.multilingual.validate' | translate }}\n        </gn-ui-button>\n      </div>\n      <ng-container *ngIf=\"supportedLanguages$ | async as languages\">\n        <div\n          class=\"flex flex-col gap-2 w-full px-2\"\n          data-test=\"langAvailable\"\n          [attr.data-test-lang]=\"lang\"\n          *ngFor=\"let lang of languages\"\n        >\n          <gn-ui-button\n            [extraClass]=\"getExtraClass(lang)\"\n            type=\"gray\"\n            (buttonClick)=\"toggleLanguage(lang)\"\n            [disabled]=\"lang === _record.defaultLanguage\"\n            [title]=\"getToggleTitle(lang)\"\n          >\n            <span [class]=\"getIconClass(lang)\"></span>\n            <span class=\"ml-2\">{{ 'language.' + lang | translate }}</span>\n          </gn-ui-button>\n        </div>\n      </ng-container>\n    </div>\n  </div>\n  <div *ngIf=\"!editTranslations && isMultilingual\" class=\"flex flex-col gap-2\">\n    <gn-ui-button\n      *ngFor=\"let recordLang of sortLanguages(recordLanguages); let i = index\"\n      extraClass=\"flex flex-row justify-between bg-white border border-white rounded mb-1 h-[34px] w-full\"\n      [ngClass]=\"{\n        'mt-8': isFirstUnsupported(i),\n        '': true,\n      }\"\n      (buttonClick)=\"switchFormLang(recordLang)\"\n      type=\"outline\"\n      data-test=\"langSwitch\"\n    >\n      <div class=\"flex flex-row gap-2 items-center\">\n        <ng-icon\n          *ngIf=\"recordLang === formLanguage\"\n          class=\"text-primary mt-1\"\n          name=\"iconoirCheckCircle\"\n        ></ng-icon>\n        <ng-icon\n          *ngIf=\"recordLang !== formLanguage\"\n          class=\"text-gray-800 mt-1\"\n          name=\"iconoirCircle\"\n        ></ng-icon>\n        <span\n          *ngIf=\"recordLang.length === 2\"\n          [class]=\"getIconClass(recordLang) + 'mt-1'\"\n        ></span>\n        <span [ngClass]=\"recordLang === formLanguage ? 'text-black' : ''\">{{\n          isLangSupported(recordLang)\n            ? ('language.' + recordLang | translate)\n            : recordLang.toUpperCase()\n        }}</span>\n      </div>\n      <div class=\"flex flex-row gap-2 items-center\">\n        <span\n          *ngIf=\"recordLang === formLanguage\"\n          class=\"text-xs text-base\"\n          translate\n          >editor.record.form.multilingual.default</span\n        >\n        <button\n          (click)=\"\n            openActionMenu(recordLang, template); $event.stopPropagation()\n          \"\n          cdkOverlayOrigin\n          #actionMenuButton\n        >\n          <ng-icon class=\"pb-5\" name=\"matMoreHorizOutline\"></ng-icon>\n        </button>\n        <ng-template #template>\n          <gn-ui-action-menu\n            [canDelete]=\"recordLang !== _record.defaultLanguage\"\n            page=\"record\"\n            (delete)=\"confirmDeleteAction(recordLang)\"\n            (closeActionMenu)=\"closeActionMenu()\"\n            (switch)=\"switchDefaultLang(recordLang)\"\n          >\n          </gn-ui-action-menu>\n        </ng-template>\n      </div>\n    </gn-ui-button>\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: EditorFacade }, { type: i1$b.MatDialog }, { type: i1$1.TranslateService }, { type: RecordsRepositoryInterface }, { type: i1$8.Overlay }, { type: i0.ViewContainerRef }, { type: i0.ChangeDetectorRef }], propDecorators: { record: [{
                 type: Input
             }], actionMenuButtons: [{
@@ -44627,5 +44835,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ADD_RESULTS, ADD_SEARCH, AbstractAction, AbstractSearchField, ActionMenuComponent, AddLayerFromCatalogComponent, AddLayerRecordPreviewComponent, AddResults, AddSearch, AnchorLinkDirective, ApiCardComponent, ApplicationBannerComponent, AuthService, AutocompleteComponent, AvailableServicesField, AvatarComponent, AvatarServiceInterface, BASEMAP_LAYERS, BadgeComponent, BaseConverter, BaseFileReader, BaseReader, BlockListComponent, ButtonComponent, CLEAR_ERROR, CLEAR_RESULTS, CarouselComponent, CatalogTitleComponent, CellPopinComponent, ChartComponent, ChartViewComponent, CheckToggleComponent, CheckboxComponent, ClearError, ClearResults, ColorScaleComponent, ConfirmationDialogComponent, ContentGhostComponent, CopyTextButtonComponent, DEFAULT_GN4_LOGIN_URL, DEFAULT_GN4_LOGOUT_URL, DEFAULT_GN4_SETTINGS_URL, DEFAULT_LANG, DEFAULT_PAGE_SIZE, DEFAULT_RESULTS_LAYOUT_CONFIG, DEFAULT_SEARCH_KEY, DISABLE_AUTH, DO_NOT_USE_DEFAULT_BASEMAP, DataService, DataTableComponent, DataViewComponent, DataViewPermalinkComponent, DataViewShareComponent, DataViewWebComponentComponent, DatePickerComponent, DateRangeDropdownComponent, DateRangeInputsComponent, DateRangePickerComponent, DateRangeSearchField, DateService, DcatApConverter, DefaultRouterModule, DownloadItemComponent, DownloadsListComponent, DragAndDropFileInputComponent, DropdownMultiselectComponent, DropdownSelectorComponent, EDITOR_FEATURE_KEY, ES_QUERY_FIELDS_PRIORITY, ES_RESOURCES_VALUES, ES_SOURCE_SUMMARY, EXTERNAL_VIEWER_OPEN_NEW_TAB, EXTERNAL_VIEWER_URL_TEMPLATE, EditableLabelDirective, EditorFacade, EditorService, ElasticsearchService, EmbeddedTranslateLoader, ErrorComponent, ErrorType, ExpandablePanelButtonComponent, ExpandablePanelComponent, ExternalLinkCardComponent, ExternalViewerButtonComponent, FIELDS_BRIEF, FIELDS_SUMMARY, FILTER_GEOMETRY, FILTER_SUMMARY_IGNORE_LIST, FORMATS, FacetBlockComponent, FacetItemComponent, FacetListComponent, FacetsContainerComponent, FavoriteStarComponent, FavoritesService, FeatureCatalogListComponent, FeatureDetailComponent, FeatureEditorModule, FeatureMapModule, FeatureRecordModule, FeatureSearchModule, FetchError, FieldsService, FigureComponent, FigureContainerComponent, FileInputComponent, FileTranslateLoader, FilesDropDirective, FilterDropdownComponent, FormFieldArrayComponent, FormFieldComponent, FormFieldDateComponent, FormFieldFileComponent, FormFieldKeywordsComponent, FormFieldLicenseComponent, FormFieldObjectComponent, FormFieldRichComponent, FormFieldSimpleComponent, FormFieldSpatialExtentComponent, FormFieldTemporalExtentsComponent, FormFieldTopicsComponent, FormFieldWrapperComponent, FullTextSearchField, FuzzySearchComponent, GEONETWORK_UI_TAG_NAME, GEONETWORK_UI_VERSION, GeoDataBadgeComponent, GeoTableViewComponent, GeocodingComponent, GeojsonReader, Gn4Converter, Gn4PlatformMapper, Gn4PlatformService, Gn4Repository, Gn4SettingsService, GnUiHumanizeDateDirective, GpfApiDlComponent, GravatarService, HttpLoaderFactory, I18nInterceptor, ImageFallbackDirective, ImageInputComponent, ImageOverlayPreviewComponent, ImportRecordComponent, InlineFilterComponent, InteractiveTableColumnComponent, InteractiveTableComponent, InternalLinkCardComponent, IsSpatialSearchField, Iso191153Converter, Iso19139Converter, KindBadgeComponent, LANGUAGES_LIST, LANGUAGE_NAMES, LANGUAGE_STORAGE_KEY, LANG_2_TO_3_MAPPER, LOGIN_URL, LOGOUT_URL, LONLAT_CRS_CODES, LanguageSwitcherComponent, LayersPanelComponent, LicenseSearchField, LinkClassifierService, LinkUsage, LoadingMaskComponent, LogService, MAP_FEATURE_KEY, MAP_VIEW_CONSTRAINTS, METADATA_LANGUAGE, MapContainerComponent, MapFacade, MapLegendComponent, MapStateContainerComponent, MapStyleService, MapUtilsService, MapViewComponent, MarkdownEditorComponent, MarkdownParserComponent, MaxLinesComponent, mdview_actions as MdViewActions, MdViewFacade, MetadataCatalogComponent, MetadataContactComponent, MetadataDoiComponent, MetadataInfoComponent, MetadataLinkType, MetadataMapperContext, MetadataQualityComponent, MetadataQualityItemComponent, MetadataQualityPanelComponent, ModalDialogComponent, MultilingualPanelComponent, MultilingualSearchField, MyOrgService, NAMESPACES, NOT_APPLICABLE_CONSTRAINT, NOT_KNOWN_CONSTRAINT, NotificationComponent, NotificationsContainerComponent, NotificationsService, ORGANIZATIONS_STRATEGY, ORGANIZATION_PAGE_URL_TOKEN, ORGANIZATION_URL_TOKEN, OrganisationPreviewComponent, OrganisationsComponent, OrganisationsFilterComponent, OrganisationsResultComponent, OrganizationSearchField, OrganizationsFromGroupsService, OrganizationsFromMetadataService, OrganizationsServiceInterface, OwnerSearchField, PAGINATE, PARSE_DELIMITER, PATCH_RESULTS_AGGREGATIONS, PROXY_PATH, Paginate, PaginationButtonsComponent, PaginationComponent, PaginationDotsComponent, PatchResultsAggregations, PlatformServiceInterface, PopoverComponent, PopupAlertComponent, PossibleResourceTypes, PossibleResourceTypesDefinition, PreviousNextButtonsComponent, ProgressBarComponent, ProxyService, QUERY_FIELDS, RECORD_DATASET_URL_TOKEN, RECORD_REUSE_URL_TOKEN, RECORD_SERVICE_URL_TOKEN, REQUEST_MORE_ON_AGGREGATION, REQUEST_MORE_RESULTS, REQUEST_NEW_RESULTS, RESULTS_LAYOUT_CONFIG, ROUTER_CONFIG, ROUTER_ROUTE_DATASET, ROUTER_ROUTE_ORGANIZATION, ROUTER_ROUTE_REUSE, ROUTER_ROUTE_SEARCH, ROUTER_ROUTE_SERVICE, ROUTER_STATE_KEY, ROUTE_PARAMS, RecordApiFormComponent, RecordFormComponent, RecordKindField, RecordMetaComponent, RecordMetricComponent, RecordPreviewCardComponent, RecordPreviewComponent, RecordPreviewFeedComponent, RecordPreviewListComponent, RecordPreviewRowComponent, RecordPreviewTextComponent, RecordPreviewTitleComponent, RecordsMetricsComponent, RecordsService, RequestMoreOnAggregation, RequestMoreResults, RequestNewResults, ResourceTypeLegacyField, ResultsHitsContainerComponent, ResultsHitsNumberComponent, ResultsHitsSearchKindComponent, ResultsLayoutComponent, ResultsLayoutConfigItem, ResultsListComponent, ResultsListContainerComponent, ResultsListItemComponent, ResultsTableComponent, ResultsTableContainerComponent, RouterEffects, RouterFacade, RouterService, SEARCH_FEATURE_KEY, SETTINGS_URL, SET_CONFIG_AGGREGATIONS, SET_CONFIG_FILTERS, SET_CONFIG_REQUEST_FIELDS, SET_ERROR, SET_FAVORITES_ONLY, SET_FILTERS, SET_INCLUDE_ON_AGGREGATION, SET_PAGE_SIZE, SET_RESULTS_AGGREGATIONS, SET_RESULTS_HITS, SET_RESULTS_LAYOUT, SET_SEARCH, SET_SORT_BY, SET_SPATIAL_FILTER_ENABLED, SearchEffects, SearchFacade, SearchFeatureCatalogComponent, SearchFiltersSummaryComponent, SearchFiltersSummaryItemComponent, SearchInputComponent, SearchRouterContainerDirective, SearchService, SearchStateContainerDirective, SelectionService, ServiceCapabilitiesComponent, SetConfigAggregations, SetConfigFilters, SetConfigRequestFields, SetError, SetFavoritesOnly, SetFilters, SetIncludeOnAggregation, SetPageSize, SetResultsAggregations, SetResultsHits, SetResultsLayout, SetSearch, SetSortBy, SetSpatialFilterEnabled, SimpleSearchField, SiteTitleComponent, SortByComponent, SortableListComponent, SourceLabelComponent, SourcesService, SpatialExtentComponent, SpinningLoaderComponent, StacItemsResultGridComponent, StacViewComponent, StarToggleComponent, StickyHeaderComponent, SupportedTypes, SwitchToggleComponent, THUMBNAIL_PLACEHOLDER, TRANSLATE_DEBUG_CONFIG, TRANSLATE_DEFAULT_CONFIG, TRANSLATE_WITH_OVERRIDES_CONFIG, TableViewComponent, TextAreaComponent, TextInputComponent, ThemeService, ThumbnailComponent, TranslatedSearchField, TruncatedTextComponent, UPDATE_CONFIG_AGGREGATIONS, UPDATE_FILTERS, UPDATE_REQUEST_AGGREGATION_TERM, UpdateConfigAggregations, UpdateFilters, UrlInputComponent, UserFeedbackItemComponent, UserPreviewComponent, UserSearchField, VECTOR_STYLE_DEFAULT, ViewportIntersectorComponent, WEB_COMPONENT_EMBEDDER_URL, XmlParseError, _reset, allChildrenElement, appConfigWithTranslationFixture, appendChildTree, appendChildren, assertValidXml, blockModelFixture, bytesToMegabytes, canEditRecord, checkFileFormat, clearSelectedFeatures, createChild, createDocument, createElement, createFuzzyFilter, createNestedChild, createNestedElement, currentPage, defaultMapStyleFixture, defaultMapStyleHlFixture, downgradeImage, downsizeImage, draftSaveSuccess, dragPanCondition, dropEmptyTranslations, editorReducer, emptyBlockModelFixture, findChildElement, findChildOrCreate, findChildrenElement, findConverterForDocument, findNestedChildOrCreate, findNestedElement, findNestedElements, findParent, firstChildElement, formatDate, formatUserInfo, getAllKeysValidator, getArrayItem, getAsArray, getAsUrl, getBadgeColor, getCustomTranslations, getError, getFavoritesOnly, getFileFormat, getFileFormatFromServiceOutput, getFirstValue, getFormatPriority, getGeometryBoundingBox, getGeometryFromGeoJSON, getGlobalConfig, getIsMobile, getJsonDataItemsProxy, getLayers, getLinkId, getLinkLabel, getLinkPriority, getMapContext, getMapContextLayerFromConfig, getMapState, getMetadataQualityConfig, getMimeTypeForFormat, getNamespace, getOptionalMapConfig, getOptionalSearchConfig, getPageSize, getQualityValidators, getResourceType, getReuseType, getRootElement, getSearchConfigAggregations, getSearchFilters, getSearchResults, getSearchResultsAggregations, getSearchResultsHits, getSearchResultsLayout, getSearchResultsLoading, getSearchSortBy, getSearchState, getSearchStateSearch, getSelectedFeatures, getSpatialFilterEnabled, getTemporalRangeUnion, getThemeConfig, handleScrollOnNavigation, hasRecordChangedSinceDraft, hasRecordChangedSinceDraftSuccess, initSearch, initialEditorState, initialMapState, initialState, isConfigLoaded, isDateRange, isFormatInQueryParam, isPublished, itemModelFixture, kindToCodeListValue, loadAppConfig, malformedConfigFixture, mapConfigFixture, mapContact, mapKeywords, mapLogo, mapOrganization, mapReducer, markRecordAsChanged, matchesNoApplicableConstraint, matchesNoKnownConstraint, megabytesToBytes, mimeTypeToFormat, minimalAppConfigFixture, missingMandatoryConfigFixture, mouseWheelZoomCondition, noDuplicateFileName, okAppConfigFixture, openDataset, openRecord, organizationsServiceFactory, parse, parseXmlString, placeholder, prioritizePageScroll, propagateToDocumentOnly, provideGn4, provideI18n, provideRepositoryUrl, readAttribute, readDataset, readDatasetHeaders, readText, reducer$2 as reducer, reducerSearch, removeAllChildren, removeChildren, removeChildrenByName, removeSearchParams, removeWhitespace, renameElements, saveRecord, saveRecordFailure, saveRecordSuccess, selectCanEditRecord, selectCurrentPage, selectEditorConfig, selectEditorState, selectFallback, selectFallbackFields, selectField, selectHasRecordChanged, selectIsPublished, selectRecord, selectRecordChangedSinceSave, selectRecordSaveError, selectRecordSaving, selectRecordSections, selectRecordSource, selectTranslatedField, selectTranslatedValue, setContext, setCurrentPage, setFieldVisibility, setSelectedFeatures, setTextContent, someHabTableItemFixture, sortByFromString, sortByToString, sortByToStrings, stripHtml, stripNamespace, tableItemsFixture, toDate, toLang2, toLang3, totalPages, undoRecordDraft, unrecognizedKeysConfigFixture, updateLanguages, updateRecordField, updateRecordLanguages, wmsLayerFlatten, writeAttribute, wrongLanguageCodeConfigFixture, xmlToString };
+export { ADD_RESULTS, ADD_SEARCH, AbstractAction, AbstractSearchField, ActionMenuComponent, AddLayerFromCatalogComponent, AddLayerRecordPreviewComponent, AddResults, AddSearch, AnchorLinkDirective, ApiCardComponent, ApplicationBannerComponent, AuthService, AutocompleteComponent, AvailableServicesField, AvatarComponent, AvatarServiceInterface, BASEMAP_LAYERS, BadgeComponent, BaseConverter, BaseFileReader, BaseReader, BlockListComponent, ButtonComponent, CLEAR_ERROR, CLEAR_RESULTS, CarouselComponent, CatalogTitleComponent, CellPopinComponent, ChartComponent, ChartViewComponent, CheckToggleComponent, CheckboxComponent, ClearError, ClearResults, ColorScaleComponent, ConfirmationDialogComponent, ContentGhostComponent, CopyTextButtonComponent, DEFAULT_GN4_LOGIN_URL, DEFAULT_GN4_LOGOUT_URL, DEFAULT_GN4_SETTINGS_URL, DEFAULT_LANG, DEFAULT_PAGE_SIZE, DEFAULT_RESULTS_LAYOUT_CONFIG, DEFAULT_SEARCH_KEY, DISABLE_AUTH, DO_NOT_USE_DEFAULT_BASEMAP, DataService, DataTableComponent, DataViewComponent, DataViewPermalinkComponent, DataViewShareComponent, DataViewWebComponentComponent, DatePickerComponent, DateRangeDropdownComponent, DateRangeInputsComponent, DateRangePickerComponent, DateRangeSearchField, DateService, DcatApConverter, DefaultRouterModule, DownloadItemComponent, DownloadsListComponent, DragAndDropFileInputComponent, DropdownMultiselectComponent, DropdownSelectorComponent, EDITOR_FEATURE_KEY, ES_QUERY_FIELDS_PRIORITY, ES_RESOURCES_VALUES, ES_SOURCE_SUMMARY, EXTERNAL_VIEWER_OPEN_NEW_TAB, EXTERNAL_VIEWER_URL_TEMPLATE, EditableLabelDirective, EditorFacade, EditorService, ElasticsearchService, EmbeddedTranslateLoader, ErrorComponent, ErrorType, ExpandablePanelButtonComponent, ExpandablePanelComponent, ExternalLinkCardComponent, ExternalViewerButtonComponent, FIELDS_BRIEF, FIELDS_SUMMARY, FILTER_GEOMETRY, FILTER_SUMMARY_IGNORE_LIST, FORMATS, FacetBlockComponent, FacetItemComponent, FacetListComponent, FacetsContainerComponent, FavoriteStarComponent, FavoritesService, FeatureCatalogListComponent, FeatureDetailComponent, FeatureEditorModule, FeatureMapModule, FeatureRecordModule, FeatureSearchModule, FetchError, FieldsService, FigureComponent, FigureContainerComponent, FileInputComponent, FileTranslateLoader, FilesDropDirective, FilterDropdownComponent, FormFieldArrayComponent, FormFieldComponent, FormFieldDateComponent, FormFieldFileComponent, FormFieldKeywordsComponent, FormFieldLicenseComponent, FormFieldObjectComponent, FormFieldRichComponent, FormFieldSimpleComponent, FormFieldSpatialExtentComponent, FormFieldTemporalExtentsComponent, FormFieldTopicsComponent, FormFieldWrapperComponent, FullTextSearchField, FuzzySearchComponent, GEONETWORK_UI_TAG_NAME, GEONETWORK_UI_VERSION, GeoDataBadgeComponent, GeoTableViewComponent, GeocodingComponent, GeojsonReader, Gn4Converter, Gn4PlatformMapper, Gn4PlatformService, Gn4Repository, Gn4SettingsService, GnUiHumanizeDateDirective, GpfApiDlComponent, GravatarService, HttpLoaderFactory, I18nInterceptor, ImageFallbackDirective, ImageInputComponent, ImageOverlayPreviewComponent, ImportRecordComponent, InlineFilterComponent, InteractiveTableColumnComponent, InteractiveTableComponent, InternalLinkCardComponent, IsSpatialSearchField, Iso191153Converter, Iso19139Converter, KindBadgeComponent, LANGUAGES_LIST, LANGUAGE_NAMES, LANGUAGE_STORAGE_KEY, LANG_2_TO_3_MAPPER, LOGIN_URL, LOGOUT_URL, LONLAT_CRS_CODES, LanguageSwitcherComponent, LayersPanelComponent, LicenseSearchField, LinkClassifierService, LinkUsage, LoadingMaskComponent, LogService, MAP_FEATURE_KEY, MAP_VIEW_CONSTRAINTS, METADATA_LANGUAGE, MapContainerComponent, MapFacade, MapLegendComponent, MapStateContainerComponent, MapStyleService, MapUtilsService, MapViewComponent, MarkdownEditorComponent, MarkdownParserComponent, MaxLinesComponent, mdview_actions as MdViewActions, MdViewFacade, MetadataCatalogComponent, MetadataContactComponent, MetadataDoiComponent, MetadataInfoComponent, MetadataLinkType, MetadataMapperContext, MetadataQualityComponent, MetadataQualityItemComponent, MetadataQualityPanelComponent, ModalDialogComponent, MultilingualPanelComponent, MultilingualSearchField, MyOrgService, NAMESPACES, NOT_APPLICABLE_CONSTRAINT, NOT_KNOWN_CONSTRAINT, NotificationComponent, NotificationsContainerComponent, NotificationsService, ORGANIZATIONS_STRATEGY, ORGANIZATION_PAGE_URL_TOKEN, ORGANIZATION_URL_TOKEN, OrganisationPreviewComponent, OrganisationsComponent, OrganisationsFilterComponent, OrganisationsResultComponent, OrganizationSearchField, OrganizationsFromGroupsService, OrganizationsFromMetadataService, OrganizationsServiceInterface, OwnerSearchField, PAGINATE, PARSE_DELIMITER, PATCH_RESULTS_AGGREGATIONS, PROXY_PATH, Paginate, PaginationButtonsComponent, PaginationComponent, PaginationDotsComponent, PatchResultsAggregations, PlatformServiceInterface, PopoverComponent, PopupAlertComponent, PossibleResourceTypes, PossibleResourceTypesDefinition, PreviousNextButtonsComponent, ProgressBarComponent, ProxyService, QUERY_FIELDS, RECORD_DATASET_URL_TOKEN, RECORD_REUSE_URL_TOKEN, RECORD_SERVICE_URL_TOKEN, REQUEST_MORE_ON_AGGREGATION, REQUEST_MORE_RESULTS, REQUEST_NEW_RESULTS, RESULTS_LAYOUT_CONFIG, ROUTER_CONFIG, ROUTER_ROUTE_DATASET, ROUTER_ROUTE_ORGANIZATION, ROUTER_ROUTE_REUSE, ROUTER_ROUTE_SEARCH, ROUTER_ROUTE_SERVICE, ROUTER_STATE_KEY, ROUTE_PARAMS, RecordApiFormComponent, RecordFormComponent, RecordKindField, RecordMetaComponent, RecordMetricComponent, RecordPreviewCardComponent, RecordPreviewComponent, RecordPreviewFeedComponent, RecordPreviewListComponent, RecordPreviewRowComponent, RecordPreviewTextComponent, RecordPreviewTitleComponent, RecordsMetricsComponent, RecordsService, RequestMoreOnAggregation, RequestMoreResults, RequestNewResults, ResourceTypeLegacyField, ResultsHitsContainerComponent, ResultsHitsNumberComponent, ResultsHitsSearchKindComponent, ResultsLayoutComponent, ResultsLayoutConfigItem, ResultsListComponent, ResultsListContainerComponent, ResultsListItemComponent, ResultsTableComponent, ResultsTableContainerComponent, ReusePresentationForms, RouterEffects, RouterFacade, RouterService, SEARCH_FEATURE_KEY, SETTINGS_URL, SET_CONFIG_AGGREGATIONS, SET_CONFIG_FILTERS, SET_CONFIG_REQUEST_FIELDS, SET_ERROR, SET_FAVORITES_ONLY, SET_FILTERS, SET_INCLUDE_ON_AGGREGATION, SET_PAGE_SIZE, SET_RESULTS_AGGREGATIONS, SET_RESULTS_HITS, SET_RESULTS_LAYOUT, SET_SEARCH, SET_SORT_BY, SET_SPATIAL_FILTER_ENABLED, SearchEffects, SearchFacade, SearchFeatureCatalogComponent, SearchFiltersSummaryComponent, SearchFiltersSummaryItemComponent, SearchInputComponent, SearchRouterContainerDirective, SearchService, SearchStateContainerDirective, SelectionService, ServiceCapabilitiesComponent, SetConfigAggregations, SetConfigFilters, SetConfigRequestFields, SetError, SetFavoritesOnly, SetFilters, SetIncludeOnAggregation, SetPageSize, SetResultsAggregations, SetResultsHits, SetResultsLayout, SetSearch, SetSortBy, SetSpatialFilterEnabled, SimpleSearchField, SiteTitleComponent, SortByComponent, SortableListComponent, SourceLabelComponent, SourcesService, SpatialExtentComponent, SpinningLoaderComponent, StacItemsResultGridComponent, StacViewComponent, StarToggleComponent, StickyHeaderComponent, SupportedTypes, SwitchToggleComponent, THUMBNAIL_PLACEHOLDER, TRANSLATE_DEBUG_CONFIG, TRANSLATE_DEFAULT_CONFIG, TRANSLATE_WITH_OVERRIDES_CONFIG, TableViewComponent, TextAreaComponent, TextInputComponent, ThemeService, ThumbnailComponent, TranslatedSearchField, TruncatedTextComponent, UPDATE_CONFIG_AGGREGATIONS, UPDATE_FILTERS, UPDATE_REQUEST_AGGREGATION_TERM, UpdateConfigAggregations, UpdateFilters, UrlInputComponent, UserFeedbackItemComponent, UserPreviewComponent, UserSearchField, VECTOR_STYLE_DEFAULT, ViewportIntersectorComponent, WEB_COMPONENT_EMBEDDER_URL, XmlParseError, _reset, allChildrenElement, appConfigWithTranslationFixture, appendChildTree, appendChildren, assertValidXml, blockModelFixture, bytesToMegabytes, canEditRecord, checkFileFormat, clearSelectedFeatures, createChild, createDocument, createElement, createFuzzyFilter, createNestedChild, createNestedElement, currentPage, defaultMapStyleFixture, defaultMapStyleHlFixture, downgradeImage, downsizeImage, draftSaveSuccess, dragPanCondition, dropEmptyTranslations, editorReducer, emptyBlockModelFixture, findChildElement, findChildOrCreate, findChildrenElement, findConverterForDocument, findNestedChildOrCreate, findNestedElement, findNestedElements, findParent, firstChildElement, formatDate, formatUserInfo, getAllKeysValidator, getArrayItem, getAsArray, getAsUrl, getBadgeColor, getCustomTranslations, getError, getFavoritesOnly, getFileFormat, getFileFormatFromServiceOutput, getFirstValue, getFormatPriority, getGeometryBoundingBox, getGeometryFromGeoJSON, getGlobalConfig, getIsMobile, getJsonDataItemsProxy, getLayers, getLinkId, getLinkLabel, getLinkPriority, getMapContext, getMapContextLayerFromConfig, getMapState, getMetadataQualityConfig, getMimeTypeForFormat, getNamespace, getOptionalMapConfig, getOptionalSearchConfig, getPageSize, getQualityValidators, getResourceType, getReusePresentationForm, getReuseType, getRootElement, getSearchConfigAggregations, getSearchFilters, getSearchResults, getSearchResultsAggregations, getSearchResultsHits, getSearchResultsLayout, getSearchResultsLoading, getSearchSortBy, getSearchState, getSearchStateSearch, getSelectedFeatures, getSpatialFilterEnabled, getTemporalRangeUnion, getThemeConfig, handleScrollOnNavigation, hasRecordChangedSinceDraft, hasRecordChangedSinceDraftSuccess, initSearch, initialEditorState, initialMapState, initialState, isConfigLoaded, isDateRange, isFormatInQueryParam, isPublished, itemModelFixture, kindToCodeListValue, loadAppConfig, malformedConfigFixture, mapConfigFixture, mapContact, mapKeywords, mapLogo, mapOrganization, mapReducer, markRecordAsChanged, matchesNoApplicableConstraint, matchesNoKnownConstraint, megabytesToBytes, mimeTypeToFormat, minimalAppConfigFixture, missingMandatoryConfigFixture, mouseWheelZoomCondition, noDuplicateFileName, okAppConfigFixture, openDataset, openRecord, organizationsServiceFactory, parse, parseXmlString, placeholder, prioritizePageScroll, propagateToDocumentOnly, provideGn4, provideI18n, provideRepositoryUrl, readAttribute, readDataset, readDatasetHeaders, readText, reducer$2 as reducer, reducerSearch, removeAllChildren, removeChildren, removeChildrenByName, removeSearchParams, removeWhitespace, renameElements, saveRecord, saveRecordFailure, saveRecordSuccess, selectCanEditRecord, selectCurrentPage, selectEditorConfig, selectEditorState, selectFallback, selectFallbackFields, selectField, selectHasRecordChanged, selectIsPublished, selectRecord, selectRecordChangedSinceSave, selectRecordSaveError, selectRecordSaving, selectRecordSections, selectRecordSource, selectTranslatedField, selectTranslatedValue, setContext, setCurrentPage, setFieldVisibility, setSelectedFeatures, setTextContent, someHabTableItemFixture, sortByFromString, sortByToString, sortByToStrings, stripHtml, stripNamespace, tableItemsFixture, toDate, toLang2, toLang3, totalPages, undoRecordDraft, unrecognizedKeysConfigFixture, updateLanguages, updateRecordField, updateRecordLanguages, wmsLayerFlatten, writeAttribute, wrongLanguageCodeConfigFixture, xmlToString };
 //# sourceMappingURL=geonetwork-ui.mjs.map