geonetwork-ui 2.6.0-dev.c4b99cdef → 2.6.0-dev.d8333ac5d

package/fesm2022/geonetwork-ui.mjs

@@ -20,7 +20,7 @@ import { CommonModule, NgSwitch, NgSwitchCase, NgSwitchDefault, NgIf, NgClass, N
 import { of, map as map$2, lastValueFrom, Subject, switchMap, combineLatest, from, exhaustMap, throwError, forkJoin, takeLast, firstValueFrom, merge, BehaviorSubject, fromEvent, animationFrameScheduler, ReplaySubject, Subscription, first, distinctUntilChanged as distinctUntilChanged$1, timer, filter as filter$1, tap as tap$2, Observable, buffer, debounceTime as debounceTime$1, combineLatestWith, startWith as startWith$1, catchError as catchError$1, takeUntil, EMPTY, mergeMap as mergeMap$1, withLatestFrom as withLatestFrom$1, shareReplay as shareReplay$1, pairwise as pairwise$1 } from 'rxjs';
 import { lt, valid, coerce, satisfies, ltr } from 'semver';
 import chroma from 'chroma-js';
-import { WmtsEndpoint, WmsEndpoint, WfsEndpoint, OgcApiEndpoint, sharedFetch, useCache } from '@camptocamp/ogc-client';
+import { WmtsEndpoint, WmsEndpoint, WfsEndpoint, OgcApiEndpoint, sharedFetch, useCache, TmsEndpoint } from '@camptocamp/ogc-client';
 import * as i1$3 from '@ngrx/store';
 import { createAction, props, createReducer, on, createFeatureSelector, createSelector, select, StoreModule, Store } from '@ngrx/store';
 import EmblaCarousel from 'embla-carousel';
@@ -642,6 +642,8 @@ function matchProtocol(protocol) {
         return 'wfs';
     if (/wmts/i.test(protocol))
         return 'wmts';
+    if (/tms/i.test(protocol))
+        return 'tms';
     if (/wps/i.test(protocol))
         return 'wps';
     if (/ogc\W*api\W*features/i.test(protocol))
@@ -18965,6 +18967,8 @@ var de = {
 	"record.action.view": "Anzeigen",
 	"record.card.metadata.contact": "",
 	"record.externalViewer.open": "In externem Kartenviewer öffnen",
+	"record.feature.catalog.number.total.attribute": "",
+	"record.feature.catalog.number.total.object": "",
 	"record.feature.limit": "Die Vorschau wurde aufgrund zu vieler Elemente deaktiviert",
 	"record.kind.data": "",
 	"record.kind.dataset": "",
@@ -19009,6 +19013,7 @@ var de = {
 	"record.metadata.creation": "Erstellungsdatum",
 	"record.metadata.details": "Über die Daten",
 	"record.metadata.download": "Downloads",
+	"record.metadata.feature.catalog": "",
 	"record.metadata.formats": "Formate",
 	"record.metadata.keywords": "Stichworte",
 	"record.metadata.languages": "Sprachen",
@@ -19092,6 +19097,7 @@ var de = {
 	"search.error.recordNotFound": "Der Datensatz mit der Kennung \"{ id }\" konnte nicht gefunden werden.",
 	"search.field.any.placeholder": "Suche im katalog ...",
 	"search.field.sortBy": "Sortieren nach:",
+	"search.filter.into.feature.catalog": "",
 	"search.filters.availableServices.download": "",
 	"search.filters.availableServices.view": "",
 	"search.filters.changeDate": "Letzte Aktualisierung",
@@ -19155,6 +19161,7 @@ var de = {
 	"service.metadata.other": "",
 	"service.metadata.question": "",
 	"service.metadata.search": "",
+	"service.metadata.search.clear": "",
 	"service.metadata.spatialExtent": "",
 	"share.tab.permalink": "Teilen",
 	"share.tab.webComponent": "Integrieren",
@@ -19548,6 +19555,8 @@ var en = {
 	"record.action.view": "View",
 	"record.card.metadata.contact": "Metadata Contact",
 	"record.externalViewer.open": "Open in the external map viewer",
+	"record.feature.catalog.number.total.attribute": "Total amount of objects",
+	"record.feature.catalog.number.total.object": "Total amount of attributes",
 	"record.feature.limit": "Preview disabled due to too many elements",
 	"record.kind.data": "Data",
 	"record.kind.dataset": "Dataset",
@@ -19592,6 +19601,7 @@ var en = {
 	"record.metadata.creation": "Date of creation",
 	"record.metadata.details": "About the data",
 	"record.metadata.download": "Downloads",
+	"record.metadata.feature.catalog": "Feature catalog",
 	"record.metadata.formats": "Formats",
 	"record.metadata.keywords": "Keywords",
 	"record.metadata.languages": "Languages",
@@ -19675,6 +19685,7 @@ var en = {
 	"search.error.recordNotFound": "The dataset with identifier \"{ id }\" could not be found.",
 	"search.field.any.placeholder": "Search in the catalog ...",
 	"search.field.sortBy": "Sort by:",
+	"search.filter.into.feature.catalog": "Search a term",
 	"search.filters.availableServices.download": "",
 	"search.filters.availableServices.view": "",
 	"search.filters.changeDate": "Updated",
@@ -19738,6 +19749,7 @@ var en = {
 	"service.metadata.other": "Other information",
 	"service.metadata.question": "Ask a question",
 	"service.metadata.search": "Search through the layer list",
+	"service.metadata.search.clear": "Clear the layer search",
 	"service.metadata.spatialExtent": "Spatial extent",
 	"share.tab.permalink": "Share",
 	"share.tab.webComponent": "Integrate",
@@ -19756,8 +19768,6 @@ var en = {
 	"tooltip.url.open": "Open URL",
 	"ui.readLess": "Read less",
 	"ui.readMore": "Read more",
-	"ui.hideFullText": "Hide complete text",
-	"ui.showAllText": "Show all text",
 	"wfs.feature.limit": "Too many features to display the WFS layer!",
 	"wfs.featuretype.notfound": "No matching feature type was found in the service",
 	"wfs.geojsongml.notsupported": "This service does not support the GeoJSON or GML format",
@@ -20133,6 +20143,8 @@ var es = {
 	"record.action.view": "",
 	"record.card.metadata.contact": "",
 	"record.externalViewer.open": "",
+	"record.feature.catalog.number.total.attribute": "",
+	"record.feature.catalog.number.total.object": "",
 	"record.feature.limit": "",
 	"record.kind.data": "",
 	"record.kind.dataset": "",
@@ -20177,6 +20189,7 @@ var es = {
 	"record.metadata.creation": "",
 	"record.metadata.details": "",
 	"record.metadata.download": "",
+	"record.metadata.feature.catalog": "",
 	"record.metadata.formats": "",
 	"record.metadata.keywords": "",
 	"record.metadata.languages": "",
@@ -20260,6 +20273,7 @@ var es = {
 	"search.error.recordNotFound": "",
 	"search.field.any.placeholder": "",
 	"search.field.sortBy": "",
+	"search.filter.into.feature.catalog": "",
 	"search.filters.availableServices.download": "",
 	"search.filters.availableServices.view": "",
 	"search.filters.changeDate": "Última actualización",
@@ -20323,6 +20337,7 @@ var es = {
 	"service.metadata.other": "",
 	"service.metadata.question": "",
 	"service.metadata.search": "",
+	"service.metadata.search.clear": "",
 	"service.metadata.spatialExtent": "",
 	"share.tab.permalink": "",
 	"share.tab.webComponent": "",
@@ -20716,6 +20731,8 @@ var fr = {
 	"record.action.view": "Voir",
 	"record.card.metadata.contact": "Contact de la métadonnée ",
 	"record.externalViewer.open": "Ouvrir dans le visualiseur externe",
+	"record.feature.catalog.number.total.attribute": "Nombre total d'attributs",
+	"record.feature.catalog.number.total.object": "Nombre total d'objets",
 	"record.feature.limit": "L’aperçu a été désactivé en raison d’un trop grand nombre d'éléments",
 	"record.kind.data": "Donnée",
 	"record.kind.dataset": "Donnée",
@@ -20760,6 +20777,7 @@ var fr = {
 	"record.metadata.creation": "Date de création",
 	"record.metadata.details": "À propos de la donnée",
 	"record.metadata.download": "Téléchargements",
+	"record.metadata.feature.catalog": "Catalogue d'attributs",
 	"record.metadata.formats": "Formats",
 	"record.metadata.keywords": "Mots-clés",
 	"record.metadata.languages": "Langues",
@@ -20843,6 +20861,7 @@ var fr = {
 	"search.error.recordNotFound": "Cette donnée n'a pu être trouvée.",
 	"search.field.any.placeholder": "Rechercher dans le catalogue...",
 	"search.field.sortBy": "Trier par :",
+	"search.filter.into.feature.catalog": "Rechercher un terme",
 	"search.filters.availableServices.download": "",
 	"search.filters.availableServices.view": "",
 	"search.filters.changeDate": "Mise à jour",
@@ -20906,6 +20925,7 @@ var fr = {
 	"service.metadata.other": "Autres informations",
 	"service.metadata.question": "Poser une question",
 	"service.metadata.search": "Rechercher dans la liste des couches",
+	"service.metadata.search.clear": "Effacer la recherche des couches",
 	"service.metadata.spatialExtent": "Etendue spatiale",
 	"share.tab.permalink": "Partager",
 	"share.tab.webComponent": "Intégrer",
@@ -20924,8 +20944,6 @@ var fr = {
 	"tooltip.url.open": "Ouvrir l'URL",
 	"ui.readLess": "Réduire",
 	"ui.readMore": "Lire la suite",
-	"ui.hideFullText": "Masquer le texte complet",
-	"ui.showAllText": "Tout afficher",
 	"wfs.feature.limit": "Trop d'objets pour afficher la couche WFS !",
 	"wfs.featuretype.notfound": "La classe d'objets n'a pas été trouvée dans le service",
 	"wfs.geojsongml.notsupported": "Le service ne supporte pas le format GeoJSON ou GML",
@@ -21012,7 +21030,7 @@ var it = {
 	"dataset.error.http": "Il caricamento dei dati non è riuscito a causa di un errore HTTP: \"{info}\"",
 	"dataset.error.network": "Il caricamento dei dati non è riuscito a causa di un errore di rete o di limitazioni CORS: \"{info}\"",
 	"dataset.error.parse": "I dati sono stati caricati ma la decodifica non è riuscita: \"{info}\"",
-	"dataset.error.restrictedAccess": "",
+	"dataset.error.restrictedAccess": "L'accesso a questa risorsa è limitato",
 	"dataset.error.unknown": "Impossibile visualizzare i dati: \"{info}\"",
 	"dataset.error.unsupportedType": "Il seguente tipo di contenuto non è supportato: \"{info}\"",
 	"domain.contact.role.author": "Autore",
@@ -21144,9 +21162,9 @@ var it = {
 	"editor.record.form.license.odc-by": "Open Data Commons ODC-By",
 	"editor.record.form.license.pddl": "Open Data Commons PDDL",
 	"editor.record.form.license.unknown": "Sconosciuto o assente",
-	"editor.record.form.multilingual.enable": "",
-	"editor.record.form.multilingual.open": "",
-	"editor.record.form.multilingual.title": "",
+	"editor.record.form.multilingual.enable": "Aprire il pannello multilingue",
+	"editor.record.form.multilingual.open": "Modalità multilingue",
+	"editor.record.form.multilingual.title": "Traduzioni",
 	"editor.record.form.page.accessAndContact": "Informazioni per l'uso",
 	"editor.record.form.page.description": "Descrizione del dataset",
 	"editor.record.form.page.resources": "Risorse",
@@ -21176,7 +21194,7 @@ var it = {
 	"editor.record.loadError.body": "Impossibile caricare il dataset:",
 	"editor.record.loadError.closeMessage": "Capito",
 	"editor.record.loadError.title": "Errore durante il caricamento",
-	"editor.record.lock.format": "",
+	"editor.record.lock.format": "I record con il formato 'servizio' o 'riutilizzo' non sono modificabili",
 	"editor.record.lock.reason": "Non è un editore di uno dei gruppi autorizzati",
 	"editor.record.onlineResource.protocol.other": "Altro",
 	"editor.record.onlineResourceError.body": "Ha successo un'errore durante l'aggiunta della risorsa:",
@@ -21275,7 +21293,7 @@ var it = {
 	"map.wms.urlInput.hint": "Inserisci URL del servizio WMS",
 	"multiselect.filter.placeholder": "Cerca",
 	"nav.back": "Indietro",
-	"navbar.mobile.menuTitle": "",
+	"navbar.mobile.menuTitle": "Accesso rapido",
 	next: next$2,
 	"ogc.unreachable.unknown": "Il servizio non è accessibile",
 	"organisation.filter.placeholder": "Filtra i risultati",
@@ -21299,13 +21317,15 @@ var it = {
 	"record.action.duplicating": "Duplicazione",
 	"record.action.rollback": "Annulla",
 	"record.action.view": "Visualizza",
-	"record.card.metadata.contact": "",
+	"record.card.metadata.contact": "Contatto del metadata",
 	"record.externalViewer.open": "Aprire nel visualizzatore esterno",
+	"record.feature.catalog.number.total.attribute": "Quantità totale di oggetti",
+	"record.feature.catalog.number.total.object": "Quantità totale di attributi",
 	"record.feature.limit": "La visualizzazione è stata disabilitata a causa di troppi elementi ",
-	"record.kind.data": "",
-	"record.kind.dataset": "",
-	"record.kind.reuse": "",
-	"record.kind.service": "",
+	"record.kind.data": "Data",
+	"record.kind.dataset": "Dataset",
+	"record.kind.reuse": "Riutilizzato",
+	"record.kind.service": "Servizio",
 	"record.metadata.about": "Descrizione",
 	"record.metadata.api": "API",
 	"record.metadata.api.form.closeButton": "Chiude",
@@ -21339,12 +21359,13 @@ var it = {
 	"record.metadata.api.form.zoneTitle": "Zona",
 	"record.metadata.api.form.zoneTooltip": "Menu a discesa per selezionare una zona geografica",
 	"record.metadata.api.gpfdl": "Scarica",
-	"record.metadata.capabilities": "",
+	"record.metadata.capabilities": "Capacità del servizio",
 	"record.metadata.catalog": "Catalogo",
 	"record.metadata.contact": "Contatto",
 	"record.metadata.creation": "Data di creazione",
 	"record.metadata.details": "A proposito del dati",
 	"record.metadata.download": "Download",
+	"record.metadata.feature.catalog": "Catalogo dei oggetti",
 	"record.metadata.formats": "Formati",
 	"record.metadata.keywords": "Parole chiave",
 	"record.metadata.languages": "Lingue",
@@ -21376,7 +21397,7 @@ var it = {
 	"record.metadata.quality.updateFrequency.failed": "La frequenza di aggiornamento non è specificata",
 	"record.metadata.quality.updateFrequency.success": "La frequenza di aggiornamento è specificata",
 	"record.metadata.related": "Vedi anche",
-	"record.metadata.related.contents": "",
+	"record.metadata.related.contents": "Contenuti correlati",
 	"record.metadata.ressources.and.links": "Risorse e collegamenti",
 	"record.metadata.sheet": "Origine del metadata",
 	"record.metadata.status": "Stato",
@@ -21418,7 +21439,7 @@ var it = {
 	"results.sortBy.popularity": "Popolarità",
 	"results.sortBy.qualityScore": "Indicatore di qualità",
 	"results.sortBy.relevancy": "Rilevanza",
-	"reuse.metadata.access": "",
+	"reuse.metadata.access": "Accedere al riutilizzo",
 	"search.autocomplete.error": "Impossibile recuperare le suggerimenti",
 	"search.error.couldNotReachApi": "Problema di connessione all'API",
 	"search.error.organizationHasNoDataset": "Questa organizzazione non ha ancora dati.",
@@ -21428,6 +21449,7 @@ var it = {
 	"search.error.recordNotFound": "Impossibile trovare questi dati.",
 	"search.field.any.placeholder": "Cerca del catalogo...",
 	"search.field.sortBy": "Ordina per:",
+	"search.filter.into.feature.catalog": "Cerca una parola",
 	"search.filters.availableServices.download": "",
 	"search.filters.availableServices.view": "",
 	"search.filters.changeDate": "Aggiornato",
@@ -21473,25 +21495,26 @@ var it = {
 	"search.filters.useSpatialFilterHelp": "Se attivata, le schede relative all'area di interesse del catalogo saranno mostrate per prime; le schede al di fuori di questa area non appariranno nei risultati.",
 	"search.filters.user": "Editore",
 	"service.metadata.capabilities": "Informazioni tecniche",
-	"service.metadata.capabilities.abstract": "",
-	"service.metadata.capabilities.attribution": "",
-	"service.metadata.capabilities.availableCrs": "",
-	"service.metadata.capabilities.defaultCrs": "",
-	"service.metadata.capabilities.geometryName": "",
-	"service.metadata.capabilities.geometryType": "",
-	"service.metadata.capabilities.keywords": "",
-	"service.metadata.capabilities.name": "",
-	"service.metadata.capabilities.objectCount": "",
-	"service.metadata.capabilities.otherCrs": "",
-	"service.metadata.capabilities.outputFormats": "",
-	"service.metadata.capabilities.resourceLinks": "",
-	"service.metadata.capabilities.title": "",
-	"service.metadata.filter": "",
-	"service.metadata.filter.noLayers": "",
-	"service.metadata.other": "",
-	"service.metadata.question": "",
-	"service.metadata.search": "",
-	"service.metadata.spatialExtent": "",
+	"service.metadata.capabilities.abstract": "Riassunto",
+	"service.metadata.capabilities.attribution": "Attribuzione",
+	"service.metadata.capabilities.availableCrs": "CRS disponibile",
+	"service.metadata.capabilities.defaultCrs": "CRS predefinito",
+	"service.metadata.capabilities.geometryName": "Nome della geometria",
+	"service.metadata.capabilities.geometryType": "Tipo della geometria",
+	"service.metadata.capabilities.keywords": "Parole chiave",
+	"service.metadata.capabilities.name": "Nome",
+	"service.metadata.capabilities.objectCount": "Oggetti conto",
+	"service.metadata.capabilities.otherCrs": "Altri CRS",
+	"service.metadata.capabilities.outputFormats": "Formato di output",
+	"service.metadata.capabilities.resourceLinks": "Risorsa links",
+	"service.metadata.capabilities.title": "Titolo",
+	"service.metadata.filter": "I layers verranno filtrati per titolo e riassunto",
+	"service.metadata.filter.noLayers": "Nessun layer abbina la ricerca",
+	"service.metadata.other": "Altri informazioni",
+	"service.metadata.question": "Fare una domanda",
+	"service.metadata.search": "Cerca nella lista del layers",
+	"service.metadata.search.clear": "Cancella la ricerca del layers",
+	"service.metadata.spatialExtent": "Estensione spaziale",
 	"share.tab.permalink": "Condividere",
 	"share.tab.webComponent": "Incorporare",
 	"table.loading.data": "Caricamento dei dati...",
@@ -21884,6 +21907,8 @@ var nl = {
 	"record.action.view": "",
 	"record.card.metadata.contact": "",
 	"record.externalViewer.open": "",
+	"record.feature.catalog.number.total.attribute": "",
+	"record.feature.catalog.number.total.object": "",
 	"record.feature.limit": "",
 	"record.kind.data": "",
 	"record.kind.dataset": "",
@@ -21928,6 +21953,7 @@ var nl = {
 	"record.metadata.creation": "",
 	"record.metadata.details": "",
 	"record.metadata.download": "",
+	"record.metadata.feature.catalog": "",
 	"record.metadata.formats": "",
 	"record.metadata.keywords": "",
 	"record.metadata.languages": "",
@@ -22011,6 +22037,7 @@ var nl = {
 	"search.error.recordNotFound": "",
 	"search.field.any.placeholder": "",
 	"search.field.sortBy": "",
+	"search.filter.into.feature.catalog": "",
 	"search.filters.availableServices.download": "",
 	"search.filters.availableServices.view": "",
 	"search.filters.changeDate": "",
@@ -22074,6 +22101,7 @@ var nl = {
 	"service.metadata.other": "",
 	"service.metadata.question": "",
 	"service.metadata.search": "",
+	"service.metadata.search.clear": "",
 	"service.metadata.spatialExtent": "",
 	"share.tab.permalink": "",
 	"share.tab.webComponent": "",
@@ -22467,6 +22495,8 @@ var pt = {
 	"record.action.view": "",
 	"record.card.metadata.contact": "",
 	"record.externalViewer.open": "",
+	"record.feature.catalog.number.total.attribute": "",
+	"record.feature.catalog.number.total.object": "",
 	"record.feature.limit": "",
 	"record.kind.data": "",
 	"record.kind.dataset": "",
@@ -22511,6 +22541,7 @@ var pt = {
 	"record.metadata.creation": "",
 	"record.metadata.details": "",
 	"record.metadata.download": "",
+	"record.metadata.feature.catalog": "",
 	"record.metadata.formats": "",
 	"record.metadata.keywords": "",
 	"record.metadata.languages": "",
@@ -22594,6 +22625,7 @@ var pt = {
 	"search.error.recordNotFound": "",
 	"search.field.any.placeholder": "",
 	"search.field.sortBy": "",
+	"search.filter.into.feature.catalog": "",
 	"search.filters.availableServices.download": "",
 	"search.filters.availableServices.view": "",
 	"search.filters.changeDate": "",
@@ -22657,6 +22689,7 @@ var pt = {
 	"service.metadata.other": "",
 	"service.metadata.question": "",
 	"service.metadata.search": "",
+	"service.metadata.search.clear": "",
 	"service.metadata.spatialExtent": "",
 	"share.tab.permalink": "",
 	"share.tab.webComponent": "",
@@ -23027,6 +23060,7 @@ class Gn4FieldMapper {
             /^OGC:WMS/.test(protocol) ||
             /^OGC:WFS/.test(protocol) ||
             /^OGC:WMTS/.test(protocol) ||
+            /TMS/i.test(protocol) ||
             /ogc\W*api\W*features/i.test(protocol) ||
             (/^WWW:DOWNLOAD-/.test(protocol) && /data.geopf.fr/.test(url)) // TO DO : change with the good protocol when decided
         ) {
@@ -23726,7 +23760,9 @@ class Gn4Repository {
                 attributes: Array.isArray(featureType.attributeTable)
                     ? featureType.attributeTable.map((attr) => ({
                         name: attr.name,
+                        code: attr.code,
                         title: attr.definition,
+                        type: attr.type,
                     }))
                     : [],
             })),
@@ -23735,7 +23771,8 @@ class Gn4Repository {
     getFeatureCatalog(record, visited = new Set() // prevent looping
     ) {
         if (record.extras?.['featureTypes'] &&
-            Array.isArray(record.extras['featureTypes'])) {
+            Array.isArray(record.extras['featureTypes']) &&
+            record.extras['featureTypes'].length > 0) {
             return of(this.mapEmbeddedFeatureCatalog(record.extras['featureTypes']));
         }
         const featureCatalogIdentifier = record.extras['featureCatalogIdentifier'];
@@ -25230,6 +25267,9 @@ function getLinkLabel(link) {
                     case 'wmts':
                         format = 'WMTS';
                         break;
+                    case 'tms':
+                        format = 'TMS';
+                        break;
                     case 'esriRest':
                         format = 'REST';
                         break;
@@ -25309,7 +25349,10 @@ class LinkClassifierService {
                         return [LinkUsage.API, LinkUsage.DOWNLOAD, LinkUsage.GEODATA];
                     case 'wms':
                     case 'wmts':
+                    case 'tms':
                         return [LinkUsage.API, LinkUsage.MAP_API];
+                    case 'maplibre-style':
+                        return [LinkUsage.GEODATA];
                     case 'ogcFeatures':
                         return [LinkUsage.API, LinkUsage.DOWNLOAD, LinkUsage.GEODATA];
                     case 'GPFDL':
@@ -25351,7 +25394,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
         }] });
 
 var name = "geonetwork-ui";
-var version = "2.6.0-dev.c4b99cdef";
+var version = "2.6.0-dev.d8333ac5d";
 var engines = {
 	node: ">=20"
 };
@@ -25404,7 +25447,7 @@ var dependencies = {
 	"@nx/angular": "20.2.2",
 	"@rgrove/parse-xml": "4.2.0",
 	alasql: "4.6.0",
-	axios: "1.7.9",
+	axios: "1.8.2",
 	basiclightbox: "^5.0.4",
 	"chart.js": "4.4.7",
 	"chroma-js": "3.1.2",
@@ -25948,30 +25991,51 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             }] } });
 
 class ExpandablePanelComponent {
-    constructor() {
-        this.collapsed = true;
-        this.maxHeight = this.setMaxHeight();
+    constructor(changeDetector) {
+        this.changeDetector = changeDetector;
+        this.iconColor = '';
+        this._collapsed = true;
+    }
+    ngAfterViewInit() {
+        if (this.contentDiv) {
+            this.contentObserver = new ResizeObserver(() => {
+                this.changeDetector.detectChanges();
+            });
+            this.contentObserver.observe(this.contentDiv.nativeElement);
+        }
+    }
+    set collapsed(value) {
+        this._collapsed = value;
+    }
+    get collapsed() {
+        return this._collapsed;
     }
     toggle() {
         this.collapsed = !this.collapsed;
-        this.maxHeight = this.setMaxHeight();
     }
-    setMaxHeight() {
-        return `${this.collapsed ? '0' : this.contentDiv.nativeElement.scrollHeight}px`;
+    ngOnDestroy() {
+        if (this.contentObserver) {
+            this.contentObserver.disconnect();
+        }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ExpandablePanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ExpandablePanelComponent, isStandalone: true, selector: "gn-ui-expandable-panel", inputs: { title: "title", collapsed: "collapsed" }, viewQueries: [{ propertyName: "contentDiv", first: true, predicate: ["contentDiv"], descendants: true }], ngImport: i0, template: "<div\n  class=\"group flex align-middle title border-b border-gray-100 cursor-pointer pt-2.5\"\n  (click)=\"toggle()\"\n>\n  <div class=\"grow font-medium text-black text-sm\">\n    {{ title }}\n  </div>\n  <div\n    class=\"w-8 opacity-25 text-primary group-hover:opacity-100 transition-opacity\"\n  >\n    <ng-icon name=\"matAdd\" *ngIf=\"collapsed\"></ng-icon>\n    <ng-icon name=\"matRemove\" *ngIf=\"!collapsed\"></ng-icon>\n  </div>\n</div>\n<div\n  class=\"content overflow-hidden transition-[max-height] duration-300\"\n  [ngClass]=\"collapsed ? 'ease-out' : 'ease-in'\"\n  [style.maxHeight]=\"maxHeight\"\n  #contentDiv\n>\n  <ng-content></ng-content>\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: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }], viewProviders: [provideIcons({ matAdd, matRemove })], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ExpandablePanelComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ExpandablePanelComponent, isStandalone: true, selector: "gn-ui-expandable-panel", inputs: { title: "title", iconColor: "iconColor", collapsed: "collapsed" }, queries: [{ propertyName: "titleTemplate", first: true, predicate: ["titleTemplate"], descendants: true }], viewQueries: [{ propertyName: "contentDiv", first: true, predicate: ["contentDiv"], descendants: true }], ngImport: i0, template: "<div\n  class=\"group flex items-center justify-between title border-b border-gray-100 cursor-pointer\"\n  (click)=\"toggle()\"\n  data-cy=\"expandable-panel-header\"\n>\n  <div class=\"grow py-2.5\">\n    <ng-container *ngIf=\"titleTemplate; else simpleTitle\">\n      <div data-cy=\"expandable-panel-custom-title\">\n        <ng-container *ngTemplateOutlet=\"titleTemplate\"></ng-container>\n      </div>\n    </ng-container>\n    <ng-template #simpleTitle>\n      <div\n        class=\"font-medium text-black text-sm\"\n        data-cy=\"expandable-panel-title\"\n      >\n        {{ title }}\n      </div>\n    </ng-template>\n  </div>\n  <div\n    class=\"w-8 opacity-25 text-primary group-hover:opacity-100 transition-opacity flex items-center shrink-0\"\n  >\n    <ng-icon\n      [name]=\"collapsed ? 'matAdd' : 'matRemove'\"\n      [style.color]=\"iconColor\"\n    ></ng-icon>\n  </div>\n</div>\n<div\n  class=\"content overflow-hidden transition-all duration-300\"\n  [ngClass]=\"collapsed ? 'ease-out' : 'ease-in'\"\n  #contentDiv\n  *ngIf=\"!collapsed\"\n  data-cy=\"expandable-panel-content\"\n>\n  <ng-content></ng-content>\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: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }], viewProviders: [provideIcons({ matAdd, matRemove })], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ExpandablePanelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-expandable-panel', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, NgIcon], viewProviders: [provideIcons({ matAdd, matRemove })], template: "<div\n  class=\"group flex align-middle title border-b border-gray-100 cursor-pointer pt-2.5\"\n  (click)=\"toggle()\"\n>\n  <div class=\"grow font-medium text-black text-sm\">\n    {{ title }}\n  </div>\n  <div\n    class=\"w-8 opacity-25 text-primary group-hover:opacity-100 transition-opacity\"\n  >\n    <ng-icon name=\"matAdd\" *ngIf=\"collapsed\"></ng-icon>\n    <ng-icon name=\"matRemove\" *ngIf=\"!collapsed\"></ng-icon>\n  </div>\n</div>\n<div\n  class=\"content overflow-hidden transition-[max-height] duration-300\"\n  [ngClass]=\"collapsed ? 'ease-out' : 'ease-in'\"\n  [style.maxHeight]=\"maxHeight\"\n  #contentDiv\n>\n  <ng-content></ng-content>\n</div>\n" }]
-        }], propDecorators: { title: [{
+            args: [{ selector: 'gn-ui-expandable-panel', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, NgIcon], viewProviders: [provideIcons({ matAdd, matRemove })], template: "<div\n  class=\"group flex items-center justify-between title border-b border-gray-100 cursor-pointer\"\n  (click)=\"toggle()\"\n  data-cy=\"expandable-panel-header\"\n>\n  <div class=\"grow py-2.5\">\n    <ng-container *ngIf=\"titleTemplate; else simpleTitle\">\n      <div data-cy=\"expandable-panel-custom-title\">\n        <ng-container *ngTemplateOutlet=\"titleTemplate\"></ng-container>\n      </div>\n    </ng-container>\n    <ng-template #simpleTitle>\n      <div\n        class=\"font-medium text-black text-sm\"\n        data-cy=\"expandable-panel-title\"\n      >\n        {{ title }}\n      </div>\n    </ng-template>\n  </div>\n  <div\n    class=\"w-8 opacity-25 text-primary group-hover:opacity-100 transition-opacity flex items-center shrink-0\"\n  >\n    <ng-icon\n      [name]=\"collapsed ? 'matAdd' : 'matRemove'\"\n      [style.color]=\"iconColor\"\n    ></ng-icon>\n  </div>\n</div>\n<div\n  class=\"content overflow-hidden transition-all duration-300\"\n  [ngClass]=\"collapsed ? 'ease-out' : 'ease-in'\"\n  #contentDiv\n  *ngIf=\"!collapsed\"\n  data-cy=\"expandable-panel-content\"\n>\n  <ng-content></ng-content>\n</div>\n" }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { title: [{
                 type: Input
-            }], collapsed: [{
+            }], iconColor: [{
                 type: Input
+            }], titleTemplate: [{
+                type: ContentChild,
+                args: ['titleTemplate']
             }], contentDiv: [{
                 type: ViewChild,
                 args: ['contentDiv']
+            }], collapsed: [{
+                type: Input
             }] } });
 
 class FormFieldWrapperComponent {
@@ -28200,6 +28264,61 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 }]
         }] });
 
+class SearchFeatureCatalogComponent {
+    constructor() {
+        this.filteredFeatureCatalogChange = new EventEmitter();
+        this.filterAction = (searchTerm) => {
+            of(searchTerm)
+                .pipe(debounceTime(300), distinctUntilChanged(), tap$1(() => {
+                const filtered = (this.featureCatalog?.featureTypes || []).filter((featureType) => {
+                    const fuzzyFilter = createFuzzyFilter(searchTerm);
+                    return (fuzzyFilter(featureType.name) ||
+                        (featureType.definition && fuzzyFilter(featureType.definition)));
+                });
+                this.filteredFeatureCatalog = {
+                    ...this.featureCatalog,
+                    featureTypes: filtered,
+                };
+                this.filteredFeatureCatalogChange.emit(this.filteredFeatureCatalog);
+            }))
+                .subscribe();
+        };
+    }
+    set featureCatalog(value) {
+        this._featureCatalog = value;
+        this.filteredFeatureCatalog = value;
+    }
+    get featureCatalog() {
+        return this._featureCatalog;
+    }
+    get totalObjects() {
+        return this.filteredFeatureCatalog?.featureTypes?.length || 0;
+    }
+    get totalAttributes() {
+        return (this.filteredFeatureCatalog?.featureTypes?.reduce((total, featureType) => total + (featureType.attributes?.length || 0), 0) || 0);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SearchFeatureCatalogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SearchFeatureCatalogComponent, isStandalone: true, selector: "gn-ui-search-feature-catalog", inputs: { featureCatalog: "featureCatalog" }, outputs: { filteredFeatureCatalogChange: "filteredFeatureCatalogChange" }, ngImport: i0, template: "<div\n  class=\"flex items-center justify-between p-3 mt-8 bg-white rounded-lg border-b solid border-gray-300\"\n>\n  <div\n    class=\"relative shrink-0\"\n    *ngIf=\"featureCatalog?.featureTypes?.length > 1\"\n  >\n    <input\n      type=\"text\"\n      [placeholder]=\"'search.filter.into.feature.catalog' | translate\"\n      class=\"w-[220px] h-8 pl-3 pr-10 py-2 border rounded-md\"\n      [(ngModel)]=\"searchTerm\"\n      (ngModelChange)=\"filterAction(searchTerm)\"\n    />\n    <ng-icon\n      class=\"absolute right-2.5 top-1 w-6 h-6 text-black\"\n      name=\"iconoirSearch\"\n    ></ng-icon>\n  </div>\n  <div class=\"text-sm px-1 ml-auto hidden sm:inline\">\n    <ng-container *ngIf=\"featureCatalog?.featureTypes?.length > 1\">\n      <span\n        class=\"text-sm font-medium text-gray-900\"\n        data-cy=\"total-objects-label\"\n        translate\n        >record.feature.catalog.number.total.object</span\n      ><span\n        class=\"text-sm font-bold px-1 text-gray-900\"\n        data-cy=\"total-objects\"\n        >{{ totalObjects }}</span\n      >\n      <span class=\"px-1.5\">|</span>\n    </ng-container>\n    <span\n      class=\"text-sm font-medium px-1 text-gray-900\"\n      data-cy=\"total-attributes-label\"\n      translate\n      >record.feature.catalog.number.total.attribute</span\n    ><span class=\"text-sm font-bold text-gray-900\" data-cy=\"total-attributes\">{{\n      totalAttributes\n    }}</span>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], viewProviders: [
+            provideIcons({ iconoirSearch }),
+            provideNgIconsConfig({
+                size: '1.5rem',
+            }),
+        ] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SearchFeatureCatalogComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'gn-ui-search-feature-catalog', standalone: true, imports: [CommonModule, NgIcon, TranslateModule, FormsModule], viewProviders: [
+                        provideIcons({ iconoirSearch }),
+                        provideNgIconsConfig({
+                            size: '1.5rem',
+                        }),
+                    ], template: "<div\n  class=\"flex items-center justify-between p-3 mt-8 bg-white rounded-lg border-b solid border-gray-300\"\n>\n  <div\n    class=\"relative shrink-0\"\n    *ngIf=\"featureCatalog?.featureTypes?.length > 1\"\n  >\n    <input\n      type=\"text\"\n      [placeholder]=\"'search.filter.into.feature.catalog' | translate\"\n      class=\"w-[220px] h-8 pl-3 pr-10 py-2 border rounded-md\"\n      [(ngModel)]=\"searchTerm\"\n      (ngModelChange)=\"filterAction(searchTerm)\"\n    />\n    <ng-icon\n      class=\"absolute right-2.5 top-1 w-6 h-6 text-black\"\n      name=\"iconoirSearch\"\n    ></ng-icon>\n  </div>\n  <div class=\"text-sm px-1 ml-auto hidden sm:inline\">\n    <ng-container *ngIf=\"featureCatalog?.featureTypes?.length > 1\">\n      <span\n        class=\"text-sm font-medium text-gray-900\"\n        data-cy=\"total-objects-label\"\n        translate\n        >record.feature.catalog.number.total.object</span\n      ><span\n        class=\"text-sm font-bold px-1 text-gray-900\"\n        data-cy=\"total-objects\"\n        >{{ totalObjects }}</span\n      >\n      <span class=\"px-1.5\">|</span>\n    </ng-container>\n    <span\n      class=\"text-sm font-medium px-1 text-gray-900\"\n      data-cy=\"total-attributes-label\"\n      translate\n      >record.feature.catalog.number.total.attribute</span\n    ><span class=\"text-sm font-bold text-gray-900\" data-cy=\"total-attributes\">{{\n      totalAttributes\n    }}</span>\n  </div>\n</div>\n" }]
+        }], propDecorators: { featureCatalog: [{
+                type: Input
+            }], filteredFeatureCatalogChange: [{
+                type: Output
+            }] } });
+
 class SortableListComponent {
     constructor() {
         this.itemsOrderChange = new EventEmitter();
@@ -28374,20 +28493,70 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
         }] });
 
 class TruncatedTextComponent {
-    constructor(cd) {
+    constructor(cd, ngZone, viewportRuler) {
         this.cd = cd;
+        this.ngZone = ngZone;
+        this.viewportRuler = viewportRuler;
         this.text = '';
+        this.extraClass = '';
         this.isTextTruncated = false;
         this.isOpen = false;
+        this.overlayPosition = {
+            originX: 'end',
+            originY: 'top',
+            overlayX: 'end',
+            overlayY: 'top',
+        };
+        this.resizeObserver = new ResizeObserver(() => {
+            this.ngZone.run(() => this.checkTextTruncation());
+        });
+        this.mutationObserver = new MutationObserver(() => {
+            this.ngZone.run(() => {
+                this.checkTextTruncation();
+                this.close();
+            });
+        });
+        this.viewportSubscription = this.viewportRuler.change().subscribe(() => {
+            if (this.isOpen) {
+                this.updateOverlayPosition();
+            }
+        });
     }
     ngAfterViewInit() {
+        const element = this.textElement.nativeElement;
+        this.resizeObserver?.observe(element);
+        this.mutationObserver?.observe(element.parentElement, {
+            attributes: true,
+            childList: true,
+            subtree: true,
+        });
         this.checkTextTruncation();
     }
-    ngOnChange() {
-        this.checkTextTruncation();
+    ngOnDestroy() {
+        this.resizeObserver?.disconnect();
+        this.mutationObserver?.disconnect();
+        this.viewportSubscription?.unsubscribe();
+        this.close();
     }
     toggleOverlay() {
         this.isOpen = !this.isOpen;
+        if (this.isOpen) {
+            this.updateOverlayPosition();
+        }
+    }
+    updateOverlayPosition() {
+        const element = this.textElement.nativeElement;
+        const rect = element.getBoundingClientRect();
+        const viewportWidth = this.viewportRuler.getViewportSize().width;
+        const isMobile = viewportWidth < 640;
+        const overlayWidth = isMobile ? 190 : 320;
+        const isNearLeftEdge = rect.left < overlayWidth;
+        this.overlayPosition = {
+            originX: isNearLeftEdge ? 'start' : 'end',
+            originY: 'top',
+            overlayX: isNearLeftEdge ? 'start' : 'end',
+            overlayY: 'top',
+        };
     }
     close() {
         this.isOpen = false;
@@ -28397,8 +28566,8 @@ class TruncatedTextComponent {
         this.isTextTruncated = element.scrollWidth > element.clientWidth;
         this.cd.detectChanges();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TruncatedTextComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TruncatedTextComponent, isStandalone: true, selector: "gn-ui-truncated-text", inputs: { text: "text" }, providers: [provideIcons({ iconoirExpand, iconoirReduce })], viewQueries: [{ propertyName: "textElement", first: true, predicate: ["textElement"], descendants: true }], ngImport: i0, template: "<div\n  class=\"flex items-center justify-between w-full gap-2\"\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n>\n  <span #textElement class=\"truncate\">\n    {{ text }}\n  </span>\n  <gn-ui-button\n    *ngIf=\"isTextTruncated\"\n    type=\"outline\"\n    extraClass=\"w-10 h-8 border rounded-lg\"\n    (buttonClick)=\"toggleOverlay()\"\n  >\n    <ng-icon name=\"iconoirExpand\" size=\"24\"> </ng-icon>\n  </gn-ui-button>\n\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"trigger\"\n    [cdkConnectedOverlayOpen]=\"isOpen\"\n    [cdkConnectedOverlayPositions]=\"[\n      {\n        originX: 'end',\n        originY: 'top',\n        overlayX: 'end',\n        overlayY: 'top',\n      },\n    ]\"\n    (detach)=\"isOpen = false\"\n  >\n    <div class=\"bg-white shadow-lg border border-gray-300 flex\">\n      <div class=\"w-64\">\n        <p class=\"m-2\">{{ text }}</p>\n      </div>\n      <gn-ui-button\n        class=\"m-2 flex-shrink-0\"\n        type=\"light\"\n        (buttonClick)=\"close()\"\n        extraClass=\"w-10 h-8 px-1 bg-white\"\n      >\n        <ng-icon name=\"iconoirReduce\" size=\"24\"> </ng-icon>\n      </gn-ui-button>\n    </div>\n  </ng-template>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$9.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$9.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { 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"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TruncatedTextComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i1$9.ViewportRuler }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TruncatedTextComponent, isStandalone: true, selector: "gn-ui-truncated-text", inputs: { text: "text", extraClass: "extraClass" }, providers: [provideIcons({ iconoirExpand, iconoirReduce })], viewQueries: [{ propertyName: "textElement", first: true, predicate: ["textElement"], descendants: true }], ngImport: i0, template: "<div\n  class=\"flex items-center justify-between w-full gap-2\"\n  cdkOverlayOrigin\n  [class]=\"extraClass\"\n  #trigger=\"cdkOverlayOrigin\"\n>\n  <span #textElement class=\"truncate\">\n    {{ text }}\n  </span>\n  <gn-ui-button\n    *ngIf=\"isTextTruncated\"\n    type=\"outline\"\n    extraClass=\"w-10 h-8 border rounded-lg\"\n    (buttonClick)=\"toggleOverlay()\"\n  >\n    <ng-icon name=\"iconoirExpand\" size=\"24\"> </ng-icon>\n  </gn-ui-button>\n\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"trigger\"\n    [cdkConnectedOverlayOpen]=\"isOpen\"\n    [cdkConnectedOverlayPositions]=\"[overlayPosition]\"\n    cdkConnectedOverlayPush\n    [cdkConnectedOverlayWidth]=\"'auto'\"\n    [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n    [cdkConnectedOverlayGrowAfterOpen]=\"true\"\n    (detach)=\"close()\"\n  >\n    <div class=\"bg-white shadow-lg border border-gray-300 flex\">\n      <div class=\"sm:w-64 xs:w-32\">\n        <p class=\"m-2\">{{ text }}</p>\n      </div>\n      <gn-ui-button\n        class=\"m-2 flex-shrink-0\"\n        type=\"light\"\n        (buttonClick)=\"close()\"\n        extraClass=\"w-10 h-8 px-1 bg-white\"\n      >\n        <ng-icon name=\"iconoirReduce\" size=\"24\"> </ng-icon>\n      </gn-ui-button>\n    </div>\n  </ng-template>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$9.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$9.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { 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"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TruncatedTextComponent, decorators: [{
             type: Component,
@@ -28409,8 +28578,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         OverlayModule,
                         ButtonComponent,
                         NgIconComponent,
-                    ], providers: [provideIcons({ iconoirExpand, iconoirReduce })], template: "<div\n  class=\"flex items-center justify-between w-full gap-2\"\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n>\n  <span #textElement class=\"truncate\">\n    {{ text }}\n  </span>\n  <gn-ui-button\n    *ngIf=\"isTextTruncated\"\n    type=\"outline\"\n    extraClass=\"w-10 h-8 border rounded-lg\"\n    (buttonClick)=\"toggleOverlay()\"\n  >\n    <ng-icon name=\"iconoirExpand\" size=\"24\"> </ng-icon>\n  </gn-ui-button>\n\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"trigger\"\n    [cdkConnectedOverlayOpen]=\"isOpen\"\n    [cdkConnectedOverlayPositions]=\"[\n      {\n        originX: 'end',\n        originY: 'top',\n        overlayX: 'end',\n        overlayY: 'top',\n      },\n    ]\"\n    (detach)=\"isOpen = false\"\n  >\n    <div class=\"bg-white shadow-lg border border-gray-300 flex\">\n      <div class=\"w-64\">\n        <p class=\"m-2\">{{ text }}</p>\n      </div>\n      <gn-ui-button\n        class=\"m-2 flex-shrink-0\"\n        type=\"light\"\n        (buttonClick)=\"close()\"\n        extraClass=\"w-10 h-8 px-1 bg-white\"\n      >\n        <ng-icon name=\"iconoirReduce\" size=\"24\"> </ng-icon>\n      </gn-ui-button>\n    </div>\n  </ng-template>\n</div>\n" }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { text: [{
+                    ], providers: [provideIcons({ iconoirExpand, iconoirReduce })], template: "<div\n  class=\"flex items-center justify-between w-full gap-2\"\n  cdkOverlayOrigin\n  [class]=\"extraClass\"\n  #trigger=\"cdkOverlayOrigin\"\n>\n  <span #textElement class=\"truncate\">\n    {{ text }}\n  </span>\n  <gn-ui-button\n    *ngIf=\"isTextTruncated\"\n    type=\"outline\"\n    extraClass=\"w-10 h-8 border rounded-lg\"\n    (buttonClick)=\"toggleOverlay()\"\n  >\n    <ng-icon name=\"iconoirExpand\" size=\"24\"> </ng-icon>\n  </gn-ui-button>\n\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"trigger\"\n    [cdkConnectedOverlayOpen]=\"isOpen\"\n    [cdkConnectedOverlayPositions]=\"[overlayPosition]\"\n    cdkConnectedOverlayPush\n    [cdkConnectedOverlayWidth]=\"'auto'\"\n    [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n    [cdkConnectedOverlayGrowAfterOpen]=\"true\"\n    (detach)=\"close()\"\n  >\n    <div class=\"bg-white shadow-lg border border-gray-300 flex\">\n      <div class=\"sm:w-64 xs:w-32\">\n        <p class=\"m-2\">{{ text }}</p>\n      </div>\n      <gn-ui-button\n        class=\"m-2 flex-shrink-0\"\n        type=\"light\"\n        (buttonClick)=\"close()\"\n        extraClass=\"w-10 h-8 px-1 bg-white\"\n      >\n        <ng-icon name=\"iconoirReduce\" size=\"24\"> </ng-icon>\n      </gn-ui-button>\n    </div>\n  </ng-template>\n</div>\n" }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i1$9.ViewportRuler }], propDecorators: { text: [{
+                type: Input
+            }], extraClass: [{
                 type: Input
             }], textElement: [{
                 type: ViewChild,
@@ -29246,11 +29417,11 @@ class ResultsListComponent {
         this.mdSelect = new EventEmitter();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ResultsListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ResultsListComponent, selector: "gn-ui-results-list", inputs: { records: "records", layoutConfig: "layoutConfig", favoriteTemplate: "favoriteTemplate", recordUrlGetter: "recordUrlGetter", metadataQualityDisplay: "metadataQualityDisplay" }, outputs: { mdSelect: "mdSelect" }, ngImport: i0, template: "<ng-container>\n  <div [ngClass]=\"layoutConfig.containerClass\">\n    <div\n      [ngClass]=\"layoutConfig.itemClass\"\n      [style]=\"layoutConfig.itemStyle\"\n      *ngFor=\"let record of records\"\n    >\n      <gn-ui-results-list-item\n        [record]=\"record\"\n        [layoutConfig]=\"layoutConfig\"\n        [metadataQualityDisplay]=\"metadataQualityDisplay\"\n        (mdSelect)=\"mdSelect.emit($event)\"\n        [favoriteTemplate]=\"favoriteTemplate\"\n        [linkHref]=\"recordUrlGetter(record)\"\n      ></gn-ui-results-list-item>\n    </div>\n  </div>\n</ng-container>\n\n<!--\n<ng-template #block>\n  <div class=\"grid md:grid-cols-2 lg:grid-cols-4 gap-4 p-4\">\n    <gn-ui-record-preview-card\n      *ngFor=\"let record of records\"\n      [record]=\"record\"\n      (mdSelect)=\"mdSelect.emit($event)\"\n      linkTarget=\"_blank\"\n      style=\"height: 24em\"\n    ></gn-ui-record-preview-card>\n  </div>\n</ng-template>\n-->\n", styles: [""], dependencies: [{ 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: "component", type: ResultsListItemComponent, selector: "gn-ui-results-list-item", inputs: ["layoutConfig", "record", "favoriteTemplate", "metadataQualityDisplay", "linkHref"], outputs: ["mdSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ResultsListComponent, selector: "gn-ui-results-list", inputs: { records: "records", layoutConfig: "layoutConfig", favoriteTemplate: "favoriteTemplate", recordUrlGetter: "recordUrlGetter", metadataQualityDisplay: "metadataQualityDisplay" }, outputs: { mdSelect: "mdSelect" }, ngImport: i0, template: "<ng-container>\n  <div [ngClass]=\"layoutConfig.containerClass\">\n    <div\n      [ngClass]=\"layoutConfig.itemClass\"\n      [style]=\"layoutConfig.itemStyle\"\n      *ngFor=\"let record of records\"\n    >\n      <gn-ui-results-list-item\n        [record]=\"record\"\n        [layoutConfig]=\"layoutConfig\"\n        [metadataQualityDisplay]=\"metadataQualityDisplay\"\n        (mdSelect)=\"mdSelect.emit($event)\"\n        [favoriteTemplate]=\"favoriteTemplate\"\n        [linkHref]=\"recordUrlGetter(record)\"\n        [attr.data-cy]=\"record.uniqueIdentifier\"\n      ></gn-ui-results-list-item>\n    </div>\n  </div>\n</ng-container>\n\n<!--\n<ng-template #block>\n  <div class=\"grid md:grid-cols-2 lg:grid-cols-4 gap-4 p-4\">\n    <gn-ui-record-preview-card\n      *ngFor=\"let record of records\"\n      [record]=\"record\"\n      (mdSelect)=\"mdSelect.emit($event)\"\n      linkTarget=\"_blank\"\n      style=\"height: 24em\"\n    ></gn-ui-record-preview-card>\n  </div>\n</ng-template>\n-->\n", styles: [""], dependencies: [{ 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: "component", type: ResultsListItemComponent, selector: "gn-ui-results-list-item", inputs: ["layoutConfig", "record", "favoriteTemplate", "metadataQualityDisplay", "linkHref"], outputs: ["mdSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ResultsListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-results-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container>\n  <div [ngClass]=\"layoutConfig.containerClass\">\n    <div\n      [ngClass]=\"layoutConfig.itemClass\"\n      [style]=\"layoutConfig.itemStyle\"\n      *ngFor=\"let record of records\"\n    >\n      <gn-ui-results-list-item\n        [record]=\"record\"\n        [layoutConfig]=\"layoutConfig\"\n        [metadataQualityDisplay]=\"metadataQualityDisplay\"\n        (mdSelect)=\"mdSelect.emit($event)\"\n        [favoriteTemplate]=\"favoriteTemplate\"\n        [linkHref]=\"recordUrlGetter(record)\"\n      ></gn-ui-results-list-item>\n    </div>\n  </div>\n</ng-container>\n\n<!--\n<ng-template #block>\n  <div class=\"grid md:grid-cols-2 lg:grid-cols-4 gap-4 p-4\">\n    <gn-ui-record-preview-card\n      *ngFor=\"let record of records\"\n      [record]=\"record\"\n      (mdSelect)=\"mdSelect.emit($event)\"\n      linkTarget=\"_blank\"\n      style=\"height: 24em\"\n    ></gn-ui-record-preview-card>\n  </div>\n</ng-template>\n-->\n" }]
+            args: [{ selector: 'gn-ui-results-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container>\n  <div [ngClass]=\"layoutConfig.containerClass\">\n    <div\n      [ngClass]=\"layoutConfig.itemClass\"\n      [style]=\"layoutConfig.itemStyle\"\n      *ngFor=\"let record of records\"\n    >\n      <gn-ui-results-list-item\n        [record]=\"record\"\n        [layoutConfig]=\"layoutConfig\"\n        [metadataQualityDisplay]=\"metadataQualityDisplay\"\n        (mdSelect)=\"mdSelect.emit($event)\"\n        [favoriteTemplate]=\"favoriteTemplate\"\n        [linkHref]=\"recordUrlGetter(record)\"\n        [attr.data-cy]=\"record.uniqueIdentifier\"\n      ></gn-ui-results-list-item>\n    </div>\n  </div>\n</ng-container>\n\n<!--\n<ng-template #block>\n  <div class=\"grid md:grid-cols-2 lg:grid-cols-4 gap-4 p-4\">\n    <gn-ui-record-preview-card\n      *ngFor=\"let record of records\"\n      [record]=\"record\"\n      (mdSelect)=\"mdSelect.emit($event)\"\n      linkTarget=\"_blank\"\n      style=\"height: 24em\"\n    ></gn-ui-record-preview-card>\n  </div>\n</ng-template>\n-->\n" }]
         }], propDecorators: { records: [{
                 type: Input
             }], layoutConfig: [{
@@ -29946,7 +30117,7 @@ class MetadataContactComponent {
         this.organizationClick.emit(this.shownOrganization);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MetadataContactComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MetadataContactComponent, isStandalone: true, selector: "gn-ui-metadata-contact", inputs: { metadata: "metadata" }, outputs: { organizationClick: "organizationClick", contactClick: "contactClick" }, ngImport: i0, template: "<div class=\"py-5 px-5 rounded-lg bg-gray-100 text-black\">\n  <div class=\"grid grid-cols-1 gap-3 overflow-hidden\">\n    <div>\n      <p class=\"text-base font-medium\" translate>record.metadata.contact</p>\n    </div>\n    <div\n      *ngIf=\"shownOrganization?.logoUrl?.href\"\n      class=\"flex items-center justify-center border-solid border border-gray-300 rounded-md bg-white h-32 overflow-hidden\"\n    >\n      <gn-ui-thumbnail\n        class=\"relative h-full w-full\"\n        [thumbnailUrl]=\"shownOrganization.logoUrl.href\"\n        fit=\"contain\"\n      ></gn-ui-thumbnail>\n    </div>\n    <div class=\"grid grid-cols-1 gap-1\">\n      <div class=\"flex\">\n        <div\n          class=\"font-title text-21 mr-2 cursor-pointer hover:underline\"\n          (click)=\"onOrganizationClick()\"\n          data-cy=\"organization-name\"\n        >\n          {{ shownOrganization?.name }}\n        </div>\n      </div>\n      <div *ngIf=\"shownOrganization?.website\">\n        <a\n          [href]=\"shownOrganization.website\"\n          target=\"_blank\"\n          class=\"contact-website text-sm cursor-pointer hover:underline transition-all\"\n          >{{ shownOrganization.website }}\n          <ng-icon\n            class=\"!w-[12px] !h-[12px] opacity-75 shrink-0\"\n            name=\"matOpenInNew\"\n          ></ng-icon>\n        </a>\n      </div>\n    </div>\n    <div class=\"grid grid-cols-1 gap-5 py-3 overflow-hidden\">\n      <div *ngIf=\"contacts[0]?.phone\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matCallOutline\"\n          ></ng-icon>\n          <div class=\"flex flex-col ml-2\">\n            <p class=\"text-sm\">{{ contacts[0].phone }}</p>\n          </div>\n        </div>\n      </div>\n      <div *ngIf=\"contacts[0]?.email\">\n        <div class=\"flex gap-2\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matMailOutline\"\n          ></ng-icon>\n          <a\n            *ngIf=\"contacts.length\"\n            [href]=\"'mailto:' + contacts[0].email\"\n            class=\"break-all text-sm hover:underline\"\n            target=\"_blank\"\n            data-cy=\"contact-email\"\n            >{{ contacts[0].email }}</a\n          >\n        </div>\n      </div>\n      <div *ngIf=\"contacts[0]?.firstName || contacts[0]?.lastName\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matPersonOutline\"\n          ></ng-icon>\n          <div class=\"flex flex-col ml-2\">\n            <p class=\"text-sm\">\n              {{ contacts[0]?.firstName || '' }}\n              {{ contacts[0]?.lastName || '' }}\n            </p>\n          </div>\n        </div>\n      </div>\n      <div *ngIf=\"contacts[0]?.address\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matLocationOnOutline\"\n          ></ng-icon>\n          <div class=\"flex flex-col ml-2\">\n            <p *ngFor=\"let addressPart of address\" class=\"text-sm\">\n              {{ addressPart }}\n            </p>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: "component", type: ThumbnailComponent, selector: "gn-ui-thumbnail", inputs: ["thumbnailUrl", "fit"], outputs: ["placeholderShown"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }], viewProviders: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MetadataContactComponent, isStandalone: true, selector: "gn-ui-metadata-contact", inputs: { metadata: "metadata" }, outputs: { organizationClick: "organizationClick", contactClick: "contactClick" }, ngImport: i0, template: "<div\n  class=\"py-5 px-5 rounded bg-gray-100 text-black\"\n  data-cy=\"metadata-organization\"\n>\n  <div class=\"grid gap-3 overflow-hidden\">\n    <div>\n      <p class=\"text-base font-medium\" translate>record.metadata.contact</p>\n    </div>\n    <div\n      *ngIf=\"shownOrganization?.logoUrl?.href\"\n      class=\"flex items-center justify-center border-solid border border-gray-300 rounded-md bg-white h-32 overflow-hidden\"\n    >\n      <gn-ui-thumbnail\n        class=\"relative h-full w-full\"\n        [thumbnailUrl]=\"shownOrganization.logoUrl.href\"\n        fit=\"contain\"\n      ></gn-ui-thumbnail>\n    </div>\n    <div class=\"grid grid-cols-1 gap-1\">\n      <div class=\"flex\">\n        <div\n          class=\"font-title text-21 mr-2 cursor-pointer hover:underline\"\n          (click)=\"onOrganizationClick()\"\n          data-cy=\"organization-name-link\"\n        >\n          {{ shownOrganization?.name }}\n        </div>\n      </div>\n      <div *ngIf=\"shownOrganization?.website\">\n        <a\n          [href]=\"shownOrganization.website\"\n          target=\"_blank\"\n          class=\"contact-website text-sm cursor-pointer hover:underline transition-all\"\n          >{{ shownOrganization.website }}\n          <ng-icon\n            class=\"!w-[12px] !h-[12px] opacity-75 shrink-0\"\n            name=\"matOpenInNew\"\n          ></ng-icon>\n        </a>\n      </div>\n    </div>\n    <div class=\"grid grid-cols-1 gap-5 py-3 overflow-hidden\">\n      <div *ngIf=\"contacts[0]?.phone\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matCallOutline\"\n          ></ng-icon>\n          <div class=\"flex flex-col ml-2\">\n            <p class=\"text-sm\">{{ contacts[0].phone }}</p>\n          </div>\n        </div>\n      </div>\n      <div *ngIf=\"contacts[0]?.email\">\n        <div class=\"flex gap-2\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matMailOutline\"\n          ></ng-icon>\n          <a\n            *ngIf=\"contacts.length\"\n            [href]=\"'mailto:' + contacts[0].email\"\n            class=\"break-all text-sm hover:underline\"\n            target=\"_blank\"\n            data-cy=\"contact-email\"\n            >{{ contacts[0].email }}</a\n          >\n        </div>\n      </div>\n      <div *ngIf=\"contacts[0]?.firstName || contacts[0]?.lastName\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matPersonOutline\"\n          ></ng-icon>\n          <div class=\"flex flex-col ml-2\">\n            <p class=\"text-sm\">\n              {{ contacts[0]?.firstName || '' }}\n              {{ contacts[0]?.lastName || '' }}\n            </p>\n          </div>\n        </div>\n      </div>\n      <div *ngIf=\"contacts[0]?.address\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matLocationOnOutline\"\n          ></ng-icon>\n          <div class=\"flex flex-col ml-2\">\n            <p *ngFor=\"let addressPart of address\" class=\"text-sm\">\n              {{ addressPart }}\n            </p>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: "component", type: ThumbnailComponent, selector: "gn-ui-thumbnail", inputs: ["thumbnailUrl", "fit"], outputs: ["placeholderShown"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }], viewProviders: [
             provideIcons({
                 matOpenInNew,
                 matCallOutline,
@@ -29966,7 +30137,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                             matPersonOutline,
                             matLocationOnOutline,
                         }),
-                    ], template: "<div class=\"py-5 px-5 rounded-lg bg-gray-100 text-black\">\n  <div class=\"grid grid-cols-1 gap-3 overflow-hidden\">\n    <div>\n      <p class=\"text-base font-medium\" translate>record.metadata.contact</p>\n    </div>\n    <div\n      *ngIf=\"shownOrganization?.logoUrl?.href\"\n      class=\"flex items-center justify-center border-solid border border-gray-300 rounded-md bg-white h-32 overflow-hidden\"\n    >\n      <gn-ui-thumbnail\n        class=\"relative h-full w-full\"\n        [thumbnailUrl]=\"shownOrganization.logoUrl.href\"\n        fit=\"contain\"\n      ></gn-ui-thumbnail>\n    </div>\n    <div class=\"grid grid-cols-1 gap-1\">\n      <div class=\"flex\">\n        <div\n          class=\"font-title text-21 mr-2 cursor-pointer hover:underline\"\n          (click)=\"onOrganizationClick()\"\n          data-cy=\"organization-name\"\n        >\n          {{ shownOrganization?.name }}\n        </div>\n      </div>\n      <div *ngIf=\"shownOrganization?.website\">\n        <a\n          [href]=\"shownOrganization.website\"\n          target=\"_blank\"\n          class=\"contact-website text-sm cursor-pointer hover:underline transition-all\"\n          >{{ shownOrganization.website }}\n          <ng-icon\n            class=\"!w-[12px] !h-[12px] opacity-75 shrink-0\"\n            name=\"matOpenInNew\"\n          ></ng-icon>\n        </a>\n      </div>\n    </div>\n    <div class=\"grid grid-cols-1 gap-5 py-3 overflow-hidden\">\n      <div *ngIf=\"contacts[0]?.phone\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matCallOutline\"\n          ></ng-icon>\n          <div class=\"flex flex-col ml-2\">\n            <p class=\"text-sm\">{{ contacts[0].phone }}</p>\n          </div>\n        </div>\n      </div>\n      <div *ngIf=\"contacts[0]?.email\">\n        <div class=\"flex gap-2\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matMailOutline\"\n          ></ng-icon>\n          <a\n            *ngIf=\"contacts.length\"\n            [href]=\"'mailto:' + contacts[0].email\"\n            class=\"break-all text-sm hover:underline\"\n            target=\"_blank\"\n            data-cy=\"contact-email\"\n            >{{ contacts[0].email }}</a\n          >\n        </div>\n      </div>\n      <div *ngIf=\"contacts[0]?.firstName || contacts[0]?.lastName\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matPersonOutline\"\n          ></ng-icon>\n          <div class=\"flex flex-col ml-2\">\n            <p class=\"text-sm\">\n              {{ contacts[0]?.firstName || '' }}\n              {{ contacts[0]?.lastName || '' }}\n            </p>\n          </div>\n        </div>\n      </div>\n      <div *ngIf=\"contacts[0]?.address\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matLocationOnOutline\"\n          ></ng-icon>\n          <div class=\"flex flex-col ml-2\">\n            <p *ngFor=\"let addressPart of address\" class=\"text-sm\">\n              {{ addressPart }}\n            </p>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
+                    ], template: "<div\n  class=\"py-5 px-5 rounded bg-gray-100 text-black\"\n  data-cy=\"metadata-organization\"\n>\n  <div class=\"grid gap-3 overflow-hidden\">\n    <div>\n      <p class=\"text-base font-medium\" translate>record.metadata.contact</p>\n    </div>\n    <div\n      *ngIf=\"shownOrganization?.logoUrl?.href\"\n      class=\"flex items-center justify-center border-solid border border-gray-300 rounded-md bg-white h-32 overflow-hidden\"\n    >\n      <gn-ui-thumbnail\n        class=\"relative h-full w-full\"\n        [thumbnailUrl]=\"shownOrganization.logoUrl.href\"\n        fit=\"contain\"\n      ></gn-ui-thumbnail>\n    </div>\n    <div class=\"grid grid-cols-1 gap-1\">\n      <div class=\"flex\">\n        <div\n          class=\"font-title text-21 mr-2 cursor-pointer hover:underline\"\n          (click)=\"onOrganizationClick()\"\n          data-cy=\"organization-name-link\"\n        >\n          {{ shownOrganization?.name }}\n        </div>\n      </div>\n      <div *ngIf=\"shownOrganization?.website\">\n        <a\n          [href]=\"shownOrganization.website\"\n          target=\"_blank\"\n          class=\"contact-website text-sm cursor-pointer hover:underline transition-all\"\n          >{{ shownOrganization.website }}\n          <ng-icon\n            class=\"!w-[12px] !h-[12px] opacity-75 shrink-0\"\n            name=\"matOpenInNew\"\n          ></ng-icon>\n        </a>\n      </div>\n    </div>\n    <div class=\"grid grid-cols-1 gap-5 py-3 overflow-hidden\">\n      <div *ngIf=\"contacts[0]?.phone\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matCallOutline\"\n          ></ng-icon>\n          <div class=\"flex flex-col ml-2\">\n            <p class=\"text-sm\">{{ contacts[0].phone }}</p>\n          </div>\n        </div>\n      </div>\n      <div *ngIf=\"contacts[0]?.email\">\n        <div class=\"flex gap-2\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matMailOutline\"\n          ></ng-icon>\n          <a\n            *ngIf=\"contacts.length\"\n            [href]=\"'mailto:' + contacts[0].email\"\n            class=\"break-all text-sm hover:underline\"\n            target=\"_blank\"\n            data-cy=\"contact-email\"\n            >{{ contacts[0].email }}</a\n          >\n        </div>\n      </div>\n      <div *ngIf=\"contacts[0]?.firstName || contacts[0]?.lastName\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matPersonOutline\"\n          ></ng-icon>\n          <div class=\"flex flex-col ml-2\">\n            <p class=\"text-sm\">\n              {{ contacts[0]?.firstName || '' }}\n              {{ contacts[0]?.lastName || '' }}\n            </p>\n          </div>\n        </div>\n      </div>\n      <div *ngIf=\"contacts[0]?.address\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matLocationOnOutline\"\n          ></ng-icon>\n          <div class=\"flex flex-col ml-2\">\n            <p *ngFor=\"let addressPart of address\" class=\"text-sm\">\n              {{ addressPart }}\n            </p>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
         }], propDecorators: { metadata: [{
                 type: Input
             }], organizationClick: [{
@@ -30210,19 +30381,44 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 
 const geometryKeys = ['geometry', 'the_geom'];
 class FeatureDetailComponent {
+    constructor() {
+        this._featureAttributes = [];
+    }
+    set featureCatalog(value) {
+        if (value)
+            this._featureAttributes = value.featureTypes[0].attributes;
+    }
     get properties() {
         if (!this.feature)
             return [];
-        return Object.keys(this.feature.properties).filter((prop) => !geometryKeys.includes(prop));
+        return this.setProperties();
+    }
+    setProperties() {
+        const properties = Object.keys(this.feature.properties)
+            .filter((p) => !geometryKeys.includes(p))
+            .reduce((acc, p) => {
+            let key = p;
+            if (this._featureAttributes.length) {
+                const matchingAttribute = this._featureAttributes.find((attr) => attr.name === p);
+                if (matchingAttribute && matchingAttribute.code) {
+                    key = matchingAttribute.code;
+                }
+            }
+            acc[key] = this.feature.properties[p];
+            return acc;
+        }, {});
+        return properties;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FeatureDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FeatureDetailComponent, isStandalone: true, selector: "gn-ui-feature-detail", inputs: { feature: "feature" }, ngImport: i0, template: "<div *ngIf=\"feature\" class=\"root\">\n  <div class=\"property\" *ngFor=\"let propName of properties\">\n    <div>{{ propName }}</div>\n    <div class=\"font-bold\">{{ feature.properties[propName] }}</div>\n  </div>\n</div>\n", styles: [".property{border-bottom:1px solid #f2f2f2;padding-bottom:.625rem;margin-bottom:.625rem;font-size:.75rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FeatureDetailComponent, isStandalone: true, selector: "gn-ui-feature-detail", inputs: { feature: "feature", featureCatalog: "featureCatalog" }, ngImport: i0, template: "<div *ngIf=\"feature\" class=\"root\">\n  <div class=\"property\" *ngFor=\"let prop of properties | keyvalue\">\n    <div>{{ prop.key }}</div>\n    <div class=\"font-bold\">{{ prop.value }}</div>\n  </div>\n</div>\n", styles: [".property{border-bottom:1px solid #f2f2f2;padding-bottom:.625rem;margin-bottom:.625rem;font-size:.75rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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.KeyValuePipe, name: "keyvalue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FeatureDetailComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-feature-detail', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule], template: "<div *ngIf=\"feature\" class=\"root\">\n  <div class=\"property\" *ngFor=\"let propName of properties\">\n    <div>{{ propName }}</div>\n    <div class=\"font-bold\">{{ feature.properties[propName] }}</div>\n  </div>\n</div>\n", styles: [".property{border-bottom:1px solid #f2f2f2;padding-bottom:.625rem;margin-bottom:.625rem;font-size:.75rem}\n"] }]
+            args: [{ selector: 'gn-ui-feature-detail', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule], template: "<div *ngIf=\"feature\" class=\"root\">\n  <div class=\"property\" *ngFor=\"let prop of properties | keyvalue\">\n    <div>{{ prop.key }}</div>\n    <div class=\"font-bold\">{{ prop.value }}</div>\n  </div>\n</div>\n", styles: [".property{border-bottom:1px solid #f2f2f2;padding-bottom:.625rem;margin-bottom:.625rem;font-size:.75rem}\n"] }]
         }], propDecorators: { feature: [{
                 type: Input
+            }], featureCatalog: [{
+                type: Input
             }] } });
 
 class MapLegendComponent {
@@ -30436,7 +30632,7 @@ class MetadataInfoComponent {
         return this.dateService.formatDateTime(date);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MetadataInfoComponent, deps: [{ token: DateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MetadataInfoComponent, isStandalone: true, selector: "gn-ui-metadata-info", inputs: { metadata: "metadata", incomplete: "incomplete" }, outputs: { keyword: "keyword" }, ngImport: i0, template: "<div class=\"mb-6 md-description sm:mb-4 sm:pr-16\">\n  <gn-ui-content-ghost\n    ghostClass=\"h-[178px]\"\n    [showContent]=\"fieldReady('abstract')\"\n  >\n    <gn-ui-max-lines [maxLines]=\"6\" *ngIf=\"metadata.abstract\">\n      <div class=\"mb-6\">\n        <gn-ui-markdown-parser\n          [textContent]=\"metadata.abstract\"\n        ></gn-ui-markdown-parser>\n      </div>\n    </gn-ui-max-lines>\n  </gn-ui-content-ghost>\n\n  <p\n    class=\"mt-6 mb-3 font-medium text-black text-sm\"\n    translate\n    *ngIf=\"!fieldReady('keywords') || metadata.keywords?.length\"\n  >\n    record.metadata.keywords\n  </p>\n\n  <gn-ui-content-ghost\n    ghostClass=\"h-[31px] w-3/4\"\n    [showContent]=\"fieldReady('keywords')\"\n  >\n    <div *ngIf=\"metadata.keywords?.length\">\n      <div class=\"metadata-info-keywords sm:pb-4 flex flex-wrap gap-2\">\n        <gn-ui-badge\n          class=\"inline-block lowercase\"\n          (click)=\"onKeywordClick(keyword)\"\n          [clickable]=\"true\"\n          *ngFor=\"let keyword of metadata.keywords\"\n          >{{ keyword.label }}</gn-ui-badge\n        >\n      </div>\n    </div>\n  </gn-ui-content-ghost>\n</div>\n\n<gn-ui-expandable-panel\n  *ngIf=\"\n    metadata.licenses ||\n    metadata.legalConstraints ||\n    metadata.securityConstraints ||\n    metadata.otherConstraints\n  \"\n  [title]=\"'record.metadata.usage' | translate\"\n>\n  <div class=\"flex flex-col gap-[10px] mr-4 py-[12px] rounded text-gray-900\">\n    <ng-container *ngFor=\"let license of licenses\">\n      <div *ngIf=\"license.url; else noUrl\" class=\"text-primary\">\n        <a\n          [href]=\"license.url\"\n          target=\"_blank\"\n          class=\"cursor-pointer hover:underline transition-all\"\n        >\n          {{ license.text }}\n          <ng-icon\n            class=\"!w-[12px] !h-[12px] !text-[12px] opacity-75 shrink-0\"\n            name=\"matOpenInNew\"\n          ></ng-icon>\n        </a>\n      </div>\n      <ng-template #noUrl>\n        <div class=\"text-primary\" gnUiLinkify>\n          {{ license.text }}\n        </div>\n      </ng-template>\n    </ng-container>\n    <ng-container *ngIf=\"legalConstraints.length\">\n      <div class=\"mb-6\">\n        <gn-ui-markdown-parser\n          *ngFor=\"let constraint of legalConstraints\"\n          [textContent]=\"constraint\"\n        >\n        </gn-ui-markdown-parser>\n      </div>\n    </ng-container>\n    <ng-container *ngIf=\"otherConstraints.length\">\n      <div gnUiLinkify *ngFor=\"let constraint of otherConstraints\">\n        <span\n          translate\n          class=\"font-medium text-black text-sm mb-[2px] mt-[16px]\"\n        >\n          record.metadata.otherConstraints\n        </span>\n        <div class=\"mb-6\">\n          <gn-ui-markdown-parser [textContent]=\"constraint\">\n          </gn-ui-markdown-parser>\n        </div>\n      </div>\n    </ng-container>\n\n    <span class=\"noUsage\" *ngIf=\"!hasUsage\">\n      {{ 'record.metadata.noUsage' | translate }}\n    </span>\n  </div>\n</gn-ui-expandable-panel>\n<gn-ui-expandable-panel\n  *ngIf=\"\n    (metadata.kind === 'dataset' && metadata.lineage) ||\n    metadata.resourceUpdated ||\n    metadata.updateFrequency ||\n    (metadata.kind === 'dataset' && metadata.status)\n  \"\n  [title]=\"'record.metadata.details' | translate\"\n>\n  <div *ngIf=\"metadata.lineage\" class=\"text-gray-900 flex flex-col mt-4 gap-2\">\n    <p class=\"whitespace-pre-line break-words text-gray-900\" gnUiLinkify>\n      {{ metadata.lineage }}\n    </p>\n  </div>\n  <div class=\"flex flex-row gap-6 mt-5 mb-8\" *ngIf=\"resourceContact\">\n    <div\n      *ngIf=\"resourceContact.organization?.logoUrl?.href\"\n      class=\"flex items-center justify-center border-solid border border-gray-300 rounded-md bg-white h-32 overflow-hidden\"\n    >\n      <gn-ui-thumbnail\n        class=\"relative h-full w-full\"\n        [thumbnailUrl]=\"resourceContact.organization.logoUrl.href\"\n        fit=\"contain\"\n      ></gn-ui-thumbnail>\n    </div>\n    <div class=\"flex flex-col gap-1\">\n      <p class=\"text-sm font-medium\" translate>record.metadata.producer</p>\n      <div\n        class=\"text-primary font-title text-21 mr-2 cursor-pointer hover:underline\"\n        data-cy=\"organization-name\"\n      >\n        {{ resourceContact.organization?.name }}\n      </div>\n      <div *ngIf=\"resourceContact.organization?.website\">\n        <a\n          [href]=\"resourceContact.organization.website\"\n          target=\"_blank\"\n          class=\"contact-website text-primary text-sm cursor-pointer hover:underline transition-all\"\n          >{{ resourceContact.organization.website }}\n          <ng-icon\n            class=\"!w-[12px] !h-[12px] !text-[12px] opacity-75 shrink-0\"\n            name=\"matOpenInNew\"\n          ></ng-icon>\n        </a>\n      </div>\n      <div class=\"mt-4\" *ngIf=\"resourceContact.email\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matMailOutline\"\n          ></ng-icon>\n          <a\n            *ngIf=\"resourceContact.email\"\n            [href]=\"'mailto:' + resourceContact.email\"\n            class=\"text-sm hover:underline ml-2\"\n            target=\"_blank\"\n            data-cy=\"contact-email\"\n            >{{ resourceContact?.email }}</a\n          >\n        </div>\n      </div>\n    </div>\n  </div>\n  <div\n    class=\"py-6 px-6 rounded bg-gray-100 grid grid-cols-2 gap-y-6 gap-x-[20px] text-gray-700\"\n  >\n    <div *ngIf=\"metadata.resourceCreated\">\n      <p class=\"text-sm\" translate>record.metadata.creation</p>\n      <p class=\"text-primary font-medium mt-1\">\n        {{ formatDate(metadata.resourceCreated) }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.resourcePublished\">\n      <p class=\"text-sm\" translate>record.metadata.publication</p>\n      <p class=\"text-primary font-medium mt-1\">\n        {{ formatDate(metadata.resourcePublished) }}\n      </p>\n    </div>\n    <div *ngIf=\"updateFrequency\">\n      <p class=\"text-sm\" translate>record.metadata.updateFrequency</p>\n      <p\n        class=\"text-primary font-medium mt-1 updateFrequency\"\n        translate\n        [translateParams]=\"{ count: updatedTimes }\"\n      >\n        {{ updateFrequency }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.otherLanguages?.length\">\n      <p class=\"text-sm mb-1\" translate>record.metadata.languages</p>\n      <div class=\"flex flex-row gap-1 flex-wrap\">\n        <p\n          class=\"text-primary font-medium\"\n          translate\n          *ngFor=\"let language of metadata.otherLanguages\"\n        >\n          language.{{ language }}\n        </p>\n      </div>\n    </div>\n    <div *ngIf=\"temporalExtent\">\n      <p class=\"text-sm\" translate>record.metadata.temporalExtent</p>\n      <div class=\"flex flex-row gap-1 mb-1 text-primary font-medium\">\n        <p\n          *ngIf=\"temporalExtent.start && temporalExtent.end\"\n          translate\n          [translateParams]=\"{\n            start: temporalExtent.start,\n            end: temporalExtent.end,\n          }\"\n        >\n          record.metadata.temporalExtent.fromDateToDate\n        </p>\n        <p\n          *ngIf=\"temporalExtent.start && !temporalExtent.end\"\n          translate\n          [translateParams]=\"{ start: temporalExtent.start }\"\n        >\n          record.metadata.temporalExtent.sinceDate\n        </p>\n        <p\n          *ngIf=\"!temporalExtent.start && temporalExtent.end\"\n          translate\n          [translateParams]=\"{ end: temporalExtent.end }\"\n        >\n          record.metadata.temporalExtent.untilDate\n        </p>\n      </div>\n    </div>\n  </div>\n</gn-ui-expandable-panel>\n<gn-ui-expandable-panel\n  *ngIf=\"metadata.kind !== 'dataset' && metadata.spatialExtents\"\n  [title]=\"'service.metadata.spatialExtent' | translate\"\n>\n  <gn-ui-spatial-extent\n    class=\"flex h-[271px] w-full rounded-lg border border-gray-100 mt-3 mb-6\"\n    [spatialExtents]=\"metadata.spatialExtents\"\n  ></gn-ui-spatial-extent>\n</gn-ui-expandable-panel>\n<gn-ui-expandable-panel\n  *ngIf=\"metadata.landingPage\"\n  [title]=\"'service.metadata.other' | translate\"\n>\n  <div class=\"flex flex-col gap-4 mr-4 py-5 rounded text-gray-700\">\n    <div *ngIf=\"metadata.recordUpdated\">\n      <p class=\"text-sm\" translate>record.metadata.updatedOn</p>\n      <p class=\"text-primary font-medium\">\n        {{ metadata.recordUpdated && formatDateTime(metadata.recordUpdated) }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.landingPage\">\n      <p class=\"text-sm\" translate>record.metadata.sheet</p>\n      <p class=\"text-primary font-medium\" translate>\n        <a [href]=\"metadata.landingPage\" target=\"_blank\">\n          <span class=\"break-all\" gnUiLinkify>{{ metadata.landingPage }}</span>\n        </a>\n      </p>\n    </div>\n    <div *ngIf=\"metadata.ownerOrganization\">\n      <p class=\"text-sm\" translate>record.metadata.owner</p>\n      <p class=\"text-primary font-medium\">\n        {{ metadata.ownerOrganization.name }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.uniqueIdentifier\">\n      <p class=\"text-sm\" translate>record.metadata.uniqueId</p>\n      <div class=\"flex flex-row content-align items-end gap-1\">\n        <gn-ui-copy-text-button\n          [text]=\"metadata.uniqueIdentifier\"\n          [tooltipText]=\"'tooltip.id.copy' | translate\"\n          [displayText]=\"false\"\n        ></gn-ui-copy-text-button>\n        <p class=\"text-primary font-medium\">\n          {{ metadata.uniqueIdentifier }}\n        </p>\n      </div>\n    </div>\n    <div *ngIf=\"metadata.topics?.length\">\n      <p class=\"text-sm mb-1\" translate>record.metadata.topics</p>\n      <div class=\"sm:pb-4 sm:pr-16\">\n        <gn-ui-badge\n          [clickable]=\"false\"\n          class=\"inline-block mr-2 mb-2 lowercase\"\n          *ngFor=\"let topic of metadata.topics\"\n          >{{ topic }}</gn-ui-badge\n        >\n      </div>\n    </div>\n  </div>\n</gn-ui-expandable-panel>\n", styles: [".md-description ::ng-deep a{@apply underline text-blue-600 hover:text-blue-800;}.info-grid>:nth-last-child(n+3){padding-bottom:10px;@apply border-b border-gray-300;}:host ::ng-deep gn-ui-copy-text-button button ng-icon{transform:scale(.8)}:host{--gn-ui-badge-background-color: var(--color-primary-white);--gn-ui-badge-text-color: var(--color-primary-darkest)}:host .metadata-info-keywords ::ng-deep gn-ui-badge:hover{--gn-ui-badge-text-color: white}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: MarkdownParserComponent, selector: "gn-ui-markdown-parser", inputs: ["textContent", "whitoutStyles"] }, { kind: "component", type: ExpandablePanelComponent, selector: "gn-ui-expandable-panel", inputs: ["title", "collapsed"] }, { kind: "component", type: BadgeComponent, selector: "gn-ui-badge", inputs: ["clickable", "removable"], outputs: ["badgeRemoveClicked"] }, { kind: "component", type: ContentGhostComponent, selector: "gn-ui-content-ghost", inputs: ["showContent", "ghostClass"] }, { kind: "component", type: ThumbnailComponent, selector: "gn-ui-thumbnail", inputs: ["thumbnailUrl", "fit"], outputs: ["placeholderShown"] }, { kind: "component", type: MaxLinesComponent, selector: "gn-ui-max-lines", inputs: ["maxLines"] }, { kind: "component", type: CopyTextButtonComponent, selector: "gn-ui-copy-text-button", inputs: ["text", "tooltipText", "displayText", "rows"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "directive", type: GnUiLinkifyDirective, selector: "[gnUiLinkify]" }, { kind: "component", type: SpatialExtentComponent, selector: "gn-ui-spatial-extent", inputs: ["spatialExtents"] }], viewProviders: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MetadataInfoComponent, isStandalone: true, selector: "gn-ui-metadata-info", inputs: { metadata: "metadata", incomplete: "incomplete" }, outputs: { keyword: "keyword" }, ngImport: i0, template: "<div class=\"mb-6 md-description sm:mb-4 sm:pr-16\">\n  <gn-ui-content-ghost\n    ghostClass=\"h-[178px]\"\n    [showContent]=\"fieldReady('abstract')\"\n  >\n    <gn-ui-max-lines [maxLines]=\"6\" *ngIf=\"metadata.abstract\">\n      <div class=\"mb-6\">\n        <gn-ui-markdown-parser\n          [textContent]=\"metadata.abstract\"\n        ></gn-ui-markdown-parser>\n      </div>\n    </gn-ui-max-lines>\n  </gn-ui-content-ghost>\n\n  <p\n    class=\"mt-6 mb-3 font-medium text-black text-sm\"\n    translate\n    *ngIf=\"!fieldReady('keywords') || metadata.keywords?.length\"\n  >\n    record.metadata.keywords\n  </p>\n\n  <gn-ui-content-ghost\n    ghostClass=\"h-[31px] w-3/4\"\n    [showContent]=\"fieldReady('keywords')\"\n  >\n    <div *ngIf=\"metadata.keywords?.length\">\n      <div class=\"metadata-info-keywords sm:pb-4 flex flex-wrap gap-2\">\n        <gn-ui-badge\n          class=\"inline-block lowercase\"\n          (click)=\"onKeywordClick(keyword)\"\n          [clickable]=\"true\"\n          *ngFor=\"let keyword of metadata.keywords\"\n          >{{ keyword.label }}</gn-ui-badge\n        >\n      </div>\n    </div>\n  </gn-ui-content-ghost>\n</div>\n\n<gn-ui-expandable-panel\n  *ngIf=\"\n    metadata.licenses ||\n    metadata.legalConstraints ||\n    metadata.securityConstraints ||\n    metadata.otherConstraints\n  \"\n  [title]=\"'record.metadata.usage' | translate\"\n  data-test=\"usage-panel\"\n>\n  <div class=\"flex flex-col gap-[10px] mr-4 py-[12px] rounded text-gray-900\">\n    <ng-container *ngFor=\"let license of licenses\">\n      <div *ngIf=\"license.url; else noUrl\" class=\"text-primary\">\n        <a\n          [href]=\"license.url\"\n          target=\"_blank\"\n          class=\"cursor-pointer hover:underline transition-all\"\n        >\n          {{ license.text }}\n          <ng-icon\n            class=\"!w-[12px] !h-[12px] !text-[12px] opacity-75 shrink-0\"\n            name=\"matOpenInNew\"\n          ></ng-icon>\n        </a>\n      </div>\n      <ng-template #noUrl>\n        <div class=\"text-primary\" gnUiLinkify>\n          {{ license.text }}\n        </div>\n      </ng-template>\n    </ng-container>\n    <ng-container *ngIf=\"legalConstraints.length\">\n      <div class=\"mb-6\">\n        <gn-ui-markdown-parser\n          *ngFor=\"let constraint of legalConstraints\"\n          [textContent]=\"constraint\"\n        >\n        </gn-ui-markdown-parser>\n      </div>\n    </ng-container>\n    <ng-container *ngIf=\"otherConstraints.length\">\n      <div gnUiLinkify *ngFor=\"let constraint of otherConstraints\">\n        <span\n          translate\n          class=\"font-medium text-black text-sm mb-[2px] mt-[16px]\"\n        >\n          record.metadata.otherConstraints\n        </span>\n        <div class=\"mb-6\">\n          <gn-ui-markdown-parser [textContent]=\"constraint\">\n          </gn-ui-markdown-parser>\n        </div>\n      </div>\n    </ng-container>\n\n    <span class=\"noUsage\" *ngIf=\"!hasUsage\">\n      {{ 'record.metadata.noUsage' | translate }}\n    </span>\n  </div>\n</gn-ui-expandable-panel>\n<gn-ui-expandable-panel\n  *ngIf=\"\n    (metadata.kind === 'dataset' && metadata.lineage) ||\n    metadata.resourceUpdated ||\n    metadata.updateFrequency ||\n    (metadata.kind === 'dataset' && metadata.status)\n  \"\n  [title]=\"'record.metadata.details' | translate\"\n  data-test=\"details-panel\"\n>\n  <div *ngIf=\"metadata.lineage\" class=\"text-gray-900 flex flex-col mt-4 gap-2\">\n    <p class=\"whitespace-pre-line break-words text-gray-900\" gnUiLinkify>\n      {{ metadata.lineage }}\n    </p>\n  </div>\n  <div class=\"flex flex-row gap-6 mt-5 mb-8\" *ngIf=\"resourceContact\">\n    <div\n      *ngIf=\"resourceContact.organization?.logoUrl?.href\"\n      class=\"flex items-center justify-center border-solid border border-gray-300 rounded-md bg-white h-32 overflow-hidden\"\n    >\n      <gn-ui-thumbnail\n        class=\"relative h-full w-full\"\n        [thumbnailUrl]=\"resourceContact.organization.logoUrl.href\"\n        fit=\"contain\"\n      ></gn-ui-thumbnail>\n    </div>\n    <div class=\"flex flex-col gap-1\">\n      <p class=\"text-sm font-medium\" translate>record.metadata.producer</p>\n      <div\n        class=\"text-primary font-title text-21 mr-2 cursor-pointer hover:underline\"\n        data-cy=\"organization-name\"\n      >\n        {{ resourceContact.organization?.name }}\n      </div>\n      <div *ngIf=\"resourceContact.organization?.website\">\n        <a\n          [href]=\"resourceContact.organization.website\"\n          target=\"_blank\"\n          class=\"contact-website text-primary text-sm cursor-pointer hover:underline transition-all\"\n          >{{ resourceContact.organization.website }}\n          <ng-icon\n            class=\"!w-[12px] !h-[12px] !text-[12px] opacity-75 shrink-0\"\n            name=\"matOpenInNew\"\n          ></ng-icon>\n        </a>\n      </div>\n      <div class=\"mt-4\" *ngIf=\"resourceContact.email\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matMailOutline\"\n          ></ng-icon>\n          <a\n            *ngIf=\"resourceContact.email\"\n            [href]=\"'mailto:' + resourceContact.email\"\n            class=\"text-sm hover:underline ml-2\"\n            target=\"_blank\"\n            data-cy=\"contact-email\"\n            >{{ resourceContact?.email }}</a\n          >\n        </div>\n      </div>\n    </div>\n  </div>\n  <div\n    class=\"py-6 px-6 rounded bg-gray-100 grid grid-cols-2 gap-y-6 gap-x-[20px] text-gray-700\"\n  >\n    <div *ngIf=\"metadata.resourceCreated\">\n      <p class=\"text-sm\" translate>record.metadata.creation</p>\n      <p class=\"text-primary font-medium mt-1\">\n        {{ formatDate(metadata.resourceCreated) }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.resourcePublished\">\n      <p class=\"text-sm\" translate>record.metadata.publication</p>\n      <p class=\"text-primary font-medium mt-1\">\n        {{ formatDate(metadata.resourcePublished) }}\n      </p>\n    </div>\n    <div *ngIf=\"updateFrequency\">\n      <p class=\"text-sm\" translate>record.metadata.updateFrequency</p>\n      <p\n        class=\"text-primary font-medium mt-1 updateFrequency\"\n        translate\n        [translateParams]=\"{ count: updatedTimes }\"\n      >\n        {{ updateFrequency }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.otherLanguages?.length\">\n      <p class=\"text-sm mb-1\" translate>record.metadata.languages</p>\n      <div class=\"flex flex-row gap-1 flex-wrap\">\n        <p\n          class=\"text-primary font-medium\"\n          translate\n          *ngFor=\"let language of metadata.otherLanguages\"\n        >\n          language.{{ language }}\n        </p>\n      </div>\n    </div>\n    <div *ngIf=\"temporalExtent\">\n      <p class=\"text-sm\" translate>record.metadata.temporalExtent</p>\n      <div class=\"flex flex-row gap-1 mb-1 text-primary font-medium\">\n        <p\n          *ngIf=\"temporalExtent.start && temporalExtent.end\"\n          translate\n          [translateParams]=\"{\n            start: temporalExtent.start,\n            end: temporalExtent.end,\n          }\"\n        >\n          record.metadata.temporalExtent.fromDateToDate\n        </p>\n        <p\n          *ngIf=\"temporalExtent.start && !temporalExtent.end\"\n          translate\n          [translateParams]=\"{ start: temporalExtent.start }\"\n        >\n          record.metadata.temporalExtent.sinceDate\n        </p>\n        <p\n          *ngIf=\"!temporalExtent.start && temporalExtent.end\"\n          translate\n          [translateParams]=\"{ end: temporalExtent.end }\"\n        >\n          record.metadata.temporalExtent.untilDate\n        </p>\n      </div>\n    </div>\n  </div>\n</gn-ui-expandable-panel>\n<gn-ui-expandable-panel\n  *ngIf=\"metadata.kind !== 'dataset' && metadata.spatialExtents\"\n  [title]=\"'service.metadata.spatialExtent' | translate\"\n  data-test=\"spatial-extent-panel\"\n>\n  <gn-ui-spatial-extent\n    class=\"flex h-[271px] w-full rounded-lg border border-gray-100 mt-3 mb-6\"\n    [spatialExtents]=\"metadata.spatialExtents\"\n  ></gn-ui-spatial-extent>\n</gn-ui-expandable-panel>\n<gn-ui-expandable-panel\n  *ngIf=\"metadata.landingPage\"\n  [title]=\"'service.metadata.other' | translate\"\n  data-test=\"other-panel\"\n>\n  <div class=\"flex flex-col gap-4 mr-4 py-5 rounded text-gray-700\">\n    <div *ngIf=\"metadata.recordUpdated\">\n      <p class=\"text-sm\" translate>record.metadata.updatedOn</p>\n      <p class=\"text-primary font-medium\">\n        {{ metadata.recordUpdated && formatDateTime(metadata.recordUpdated) }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.landingPage\">\n      <p class=\"text-sm\" translate>record.metadata.sheet</p>\n      <p class=\"text-primary font-medium\" translate>\n        <a [href]=\"metadata.landingPage\" target=\"_blank\">\n          <span class=\"break-all\" gnUiLinkify>{{ metadata.landingPage }}</span>\n        </a>\n      </p>\n    </div>\n    <div *ngIf=\"metadata.ownerOrganization\">\n      <p class=\"text-sm\" translate>record.metadata.owner</p>\n      <p class=\"text-primary font-medium\">\n        {{ metadata.ownerOrganization.name }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.uniqueIdentifier\">\n      <p class=\"text-sm\" translate>record.metadata.uniqueId</p>\n      <div class=\"flex flex-row content-align items-end gap-1\">\n        <gn-ui-copy-text-button\n          [text]=\"metadata.uniqueIdentifier\"\n          [tooltipText]=\"'tooltip.id.copy' | translate\"\n          [displayText]=\"false\"\n        ></gn-ui-copy-text-button>\n        <p class=\"text-primary font-medium\">\n          {{ metadata.uniqueIdentifier }}\n        </p>\n      </div>\n    </div>\n    <div *ngIf=\"metadata.topics?.length\">\n      <p class=\"text-sm mb-1\" translate>record.metadata.topics</p>\n      <div class=\"sm:pb-4 sm:pr-16\">\n        <gn-ui-badge\n          [clickable]=\"false\"\n          class=\"inline-block mr-2 mb-2 lowercase\"\n          *ngFor=\"let topic of metadata.topics\"\n          >{{ topic }}</gn-ui-badge\n        >\n      </div>\n    </div>\n  </div>\n</gn-ui-expandable-panel>\n", styles: [".md-description ::ng-deep a{@apply underline text-blue-600 hover:text-blue-800;}.info-grid>:nth-last-child(n+3){padding-bottom:10px;@apply border-b border-gray-300;}:host ::ng-deep gn-ui-copy-text-button button ng-icon{transform:scale(.8)}:host{--gn-ui-badge-background-color: var(--color-primary-white);--gn-ui-badge-text-color: var(--color-primary-darkest)}:host .metadata-info-keywords ::ng-deep gn-ui-badge:hover{--gn-ui-badge-text-color: white}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: MarkdownParserComponent, selector: "gn-ui-markdown-parser", inputs: ["textContent", "whitoutStyles"] }, { kind: "component", type: ExpandablePanelComponent, selector: "gn-ui-expandable-panel", inputs: ["title", "iconColor", "collapsed"] }, { kind: "component", type: BadgeComponent, selector: "gn-ui-badge", inputs: ["clickable", "removable"], outputs: ["badgeRemoveClicked"] }, { kind: "component", type: ContentGhostComponent, selector: "gn-ui-content-ghost", inputs: ["showContent", "ghostClass"] }, { kind: "component", type: ThumbnailComponent, selector: "gn-ui-thumbnail", inputs: ["thumbnailUrl", "fit"], outputs: ["placeholderShown"] }, { kind: "component", type: MaxLinesComponent, selector: "gn-ui-max-lines", inputs: ["maxLines"] }, { kind: "component", type: CopyTextButtonComponent, selector: "gn-ui-copy-text-button", inputs: ["text", "tooltipText", "displayText", "rows"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "directive", type: GnUiLinkifyDirective, selector: "[gnUiLinkify]" }, { kind: "component", type: SpatialExtentComponent, selector: "gn-ui-spatial-extent", inputs: ["spatialExtents"] }], viewProviders: [
             provideIcons({
                 matOpenInNew,
                 matMailOutline: matMailOutline$1,
@@ -30464,7 +30660,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                             matOpenInNew,
                             matMailOutline: matMailOutline$1,
                         }),
-                    ], template: "<div class=\"mb-6 md-description sm:mb-4 sm:pr-16\">\n  <gn-ui-content-ghost\n    ghostClass=\"h-[178px]\"\n    [showContent]=\"fieldReady('abstract')\"\n  >\n    <gn-ui-max-lines [maxLines]=\"6\" *ngIf=\"metadata.abstract\">\n      <div class=\"mb-6\">\n        <gn-ui-markdown-parser\n          [textContent]=\"metadata.abstract\"\n        ></gn-ui-markdown-parser>\n      </div>\n    </gn-ui-max-lines>\n  </gn-ui-content-ghost>\n\n  <p\n    class=\"mt-6 mb-3 font-medium text-black text-sm\"\n    translate\n    *ngIf=\"!fieldReady('keywords') || metadata.keywords?.length\"\n  >\n    record.metadata.keywords\n  </p>\n\n  <gn-ui-content-ghost\n    ghostClass=\"h-[31px] w-3/4\"\n    [showContent]=\"fieldReady('keywords')\"\n  >\n    <div *ngIf=\"metadata.keywords?.length\">\n      <div class=\"metadata-info-keywords sm:pb-4 flex flex-wrap gap-2\">\n        <gn-ui-badge\n          class=\"inline-block lowercase\"\n          (click)=\"onKeywordClick(keyword)\"\n          [clickable]=\"true\"\n          *ngFor=\"let keyword of metadata.keywords\"\n          >{{ keyword.label }}</gn-ui-badge\n        >\n      </div>\n    </div>\n  </gn-ui-content-ghost>\n</div>\n\n<gn-ui-expandable-panel\n  *ngIf=\"\n    metadata.licenses ||\n    metadata.legalConstraints ||\n    metadata.securityConstraints ||\n    metadata.otherConstraints\n  \"\n  [title]=\"'record.metadata.usage' | translate\"\n>\n  <div class=\"flex flex-col gap-[10px] mr-4 py-[12px] rounded text-gray-900\">\n    <ng-container *ngFor=\"let license of licenses\">\n      <div *ngIf=\"license.url; else noUrl\" class=\"text-primary\">\n        <a\n          [href]=\"license.url\"\n          target=\"_blank\"\n          class=\"cursor-pointer hover:underline transition-all\"\n        >\n          {{ license.text }}\n          <ng-icon\n            class=\"!w-[12px] !h-[12px] !text-[12px] opacity-75 shrink-0\"\n            name=\"matOpenInNew\"\n          ></ng-icon>\n        </a>\n      </div>\n      <ng-template #noUrl>\n        <div class=\"text-primary\" gnUiLinkify>\n          {{ license.text }}\n        </div>\n      </ng-template>\n    </ng-container>\n    <ng-container *ngIf=\"legalConstraints.length\">\n      <div class=\"mb-6\">\n        <gn-ui-markdown-parser\n          *ngFor=\"let constraint of legalConstraints\"\n          [textContent]=\"constraint\"\n        >\n        </gn-ui-markdown-parser>\n      </div>\n    </ng-container>\n    <ng-container *ngIf=\"otherConstraints.length\">\n      <div gnUiLinkify *ngFor=\"let constraint of otherConstraints\">\n        <span\n          translate\n          class=\"font-medium text-black text-sm mb-[2px] mt-[16px]\"\n        >\n          record.metadata.otherConstraints\n        </span>\n        <div class=\"mb-6\">\n          <gn-ui-markdown-parser [textContent]=\"constraint\">\n          </gn-ui-markdown-parser>\n        </div>\n      </div>\n    </ng-container>\n\n    <span class=\"noUsage\" *ngIf=\"!hasUsage\">\n      {{ 'record.metadata.noUsage' | translate }}\n    </span>\n  </div>\n</gn-ui-expandable-panel>\n<gn-ui-expandable-panel\n  *ngIf=\"\n    (metadata.kind === 'dataset' && metadata.lineage) ||\n    metadata.resourceUpdated ||\n    metadata.updateFrequency ||\n    (metadata.kind === 'dataset' && metadata.status)\n  \"\n  [title]=\"'record.metadata.details' | translate\"\n>\n  <div *ngIf=\"metadata.lineage\" class=\"text-gray-900 flex flex-col mt-4 gap-2\">\n    <p class=\"whitespace-pre-line break-words text-gray-900\" gnUiLinkify>\n      {{ metadata.lineage }}\n    </p>\n  </div>\n  <div class=\"flex flex-row gap-6 mt-5 mb-8\" *ngIf=\"resourceContact\">\n    <div\n      *ngIf=\"resourceContact.organization?.logoUrl?.href\"\n      class=\"flex items-center justify-center border-solid border border-gray-300 rounded-md bg-white h-32 overflow-hidden\"\n    >\n      <gn-ui-thumbnail\n        class=\"relative h-full w-full\"\n        [thumbnailUrl]=\"resourceContact.organization.logoUrl.href\"\n        fit=\"contain\"\n      ></gn-ui-thumbnail>\n    </div>\n    <div class=\"flex flex-col gap-1\">\n      <p class=\"text-sm font-medium\" translate>record.metadata.producer</p>\n      <div\n        class=\"text-primary font-title text-21 mr-2 cursor-pointer hover:underline\"\n        data-cy=\"organization-name\"\n      >\n        {{ resourceContact.organization?.name }}\n      </div>\n      <div *ngIf=\"resourceContact.organization?.website\">\n        <a\n          [href]=\"resourceContact.organization.website\"\n          target=\"_blank\"\n          class=\"contact-website text-primary text-sm cursor-pointer hover:underline transition-all\"\n          >{{ resourceContact.organization.website }}\n          <ng-icon\n            class=\"!w-[12px] !h-[12px] !text-[12px] opacity-75 shrink-0\"\n            name=\"matOpenInNew\"\n          ></ng-icon>\n        </a>\n      </div>\n      <div class=\"mt-4\" *ngIf=\"resourceContact.email\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matMailOutline\"\n          ></ng-icon>\n          <a\n            *ngIf=\"resourceContact.email\"\n            [href]=\"'mailto:' + resourceContact.email\"\n            class=\"text-sm hover:underline ml-2\"\n            target=\"_blank\"\n            data-cy=\"contact-email\"\n            >{{ resourceContact?.email }}</a\n          >\n        </div>\n      </div>\n    </div>\n  </div>\n  <div\n    class=\"py-6 px-6 rounded bg-gray-100 grid grid-cols-2 gap-y-6 gap-x-[20px] text-gray-700\"\n  >\n    <div *ngIf=\"metadata.resourceCreated\">\n      <p class=\"text-sm\" translate>record.metadata.creation</p>\n      <p class=\"text-primary font-medium mt-1\">\n        {{ formatDate(metadata.resourceCreated) }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.resourcePublished\">\n      <p class=\"text-sm\" translate>record.metadata.publication</p>\n      <p class=\"text-primary font-medium mt-1\">\n        {{ formatDate(metadata.resourcePublished) }}\n      </p>\n    </div>\n    <div *ngIf=\"updateFrequency\">\n      <p class=\"text-sm\" translate>record.metadata.updateFrequency</p>\n      <p\n        class=\"text-primary font-medium mt-1 updateFrequency\"\n        translate\n        [translateParams]=\"{ count: updatedTimes }\"\n      >\n        {{ updateFrequency }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.otherLanguages?.length\">\n      <p class=\"text-sm mb-1\" translate>record.metadata.languages</p>\n      <div class=\"flex flex-row gap-1 flex-wrap\">\n        <p\n          class=\"text-primary font-medium\"\n          translate\n          *ngFor=\"let language of metadata.otherLanguages\"\n        >\n          language.{{ language }}\n        </p>\n      </div>\n    </div>\n    <div *ngIf=\"temporalExtent\">\n      <p class=\"text-sm\" translate>record.metadata.temporalExtent</p>\n      <div class=\"flex flex-row gap-1 mb-1 text-primary font-medium\">\n        <p\n          *ngIf=\"temporalExtent.start && temporalExtent.end\"\n          translate\n          [translateParams]=\"{\n            start: temporalExtent.start,\n            end: temporalExtent.end,\n          }\"\n        >\n          record.metadata.temporalExtent.fromDateToDate\n        </p>\n        <p\n          *ngIf=\"temporalExtent.start && !temporalExtent.end\"\n          translate\n          [translateParams]=\"{ start: temporalExtent.start }\"\n        >\n          record.metadata.temporalExtent.sinceDate\n        </p>\n        <p\n          *ngIf=\"!temporalExtent.start && temporalExtent.end\"\n          translate\n          [translateParams]=\"{ end: temporalExtent.end }\"\n        >\n          record.metadata.temporalExtent.untilDate\n        </p>\n      </div>\n    </div>\n  </div>\n</gn-ui-expandable-panel>\n<gn-ui-expandable-panel\n  *ngIf=\"metadata.kind !== 'dataset' && metadata.spatialExtents\"\n  [title]=\"'service.metadata.spatialExtent' | translate\"\n>\n  <gn-ui-spatial-extent\n    class=\"flex h-[271px] w-full rounded-lg border border-gray-100 mt-3 mb-6\"\n    [spatialExtents]=\"metadata.spatialExtents\"\n  ></gn-ui-spatial-extent>\n</gn-ui-expandable-panel>\n<gn-ui-expandable-panel\n  *ngIf=\"metadata.landingPage\"\n  [title]=\"'service.metadata.other' | translate\"\n>\n  <div class=\"flex flex-col gap-4 mr-4 py-5 rounded text-gray-700\">\n    <div *ngIf=\"metadata.recordUpdated\">\n      <p class=\"text-sm\" translate>record.metadata.updatedOn</p>\n      <p class=\"text-primary font-medium\">\n        {{ metadata.recordUpdated && formatDateTime(metadata.recordUpdated) }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.landingPage\">\n      <p class=\"text-sm\" translate>record.metadata.sheet</p>\n      <p class=\"text-primary font-medium\" translate>\n        <a [href]=\"metadata.landingPage\" target=\"_blank\">\n          <span class=\"break-all\" gnUiLinkify>{{ metadata.landingPage }}</span>\n        </a>\n      </p>\n    </div>\n    <div *ngIf=\"metadata.ownerOrganization\">\n      <p class=\"text-sm\" translate>record.metadata.owner</p>\n      <p class=\"text-primary font-medium\">\n        {{ metadata.ownerOrganization.name }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.uniqueIdentifier\">\n      <p class=\"text-sm\" translate>record.metadata.uniqueId</p>\n      <div class=\"flex flex-row content-align items-end gap-1\">\n        <gn-ui-copy-text-button\n          [text]=\"metadata.uniqueIdentifier\"\n          [tooltipText]=\"'tooltip.id.copy' | translate\"\n          [displayText]=\"false\"\n        ></gn-ui-copy-text-button>\n        <p class=\"text-primary font-medium\">\n          {{ metadata.uniqueIdentifier }}\n        </p>\n      </div>\n    </div>\n    <div *ngIf=\"metadata.topics?.length\">\n      <p class=\"text-sm mb-1\" translate>record.metadata.topics</p>\n      <div class=\"sm:pb-4 sm:pr-16\">\n        <gn-ui-badge\n          [clickable]=\"false\"\n          class=\"inline-block mr-2 mb-2 lowercase\"\n          *ngFor=\"let topic of metadata.topics\"\n          >{{ topic }}</gn-ui-badge\n        >\n      </div>\n    </div>\n  </div>\n</gn-ui-expandable-panel>\n", styles: [".md-description ::ng-deep a{@apply underline text-blue-600 hover:text-blue-800;}.info-grid>:nth-last-child(n+3){padding-bottom:10px;@apply border-b border-gray-300;}:host ::ng-deep gn-ui-copy-text-button button ng-icon{transform:scale(.8)}:host{--gn-ui-badge-background-color: var(--color-primary-white);--gn-ui-badge-text-color: var(--color-primary-darkest)}:host .metadata-info-keywords ::ng-deep gn-ui-badge:hover{--gn-ui-badge-text-color: white}\n"] }]
+                    ], template: "<div class=\"mb-6 md-description sm:mb-4 sm:pr-16\">\n  <gn-ui-content-ghost\n    ghostClass=\"h-[178px]\"\n    [showContent]=\"fieldReady('abstract')\"\n  >\n    <gn-ui-max-lines [maxLines]=\"6\" *ngIf=\"metadata.abstract\">\n      <div class=\"mb-6\">\n        <gn-ui-markdown-parser\n          [textContent]=\"metadata.abstract\"\n        ></gn-ui-markdown-parser>\n      </div>\n    </gn-ui-max-lines>\n  </gn-ui-content-ghost>\n\n  <p\n    class=\"mt-6 mb-3 font-medium text-black text-sm\"\n    translate\n    *ngIf=\"!fieldReady('keywords') || metadata.keywords?.length\"\n  >\n    record.metadata.keywords\n  </p>\n\n  <gn-ui-content-ghost\n    ghostClass=\"h-[31px] w-3/4\"\n    [showContent]=\"fieldReady('keywords')\"\n  >\n    <div *ngIf=\"metadata.keywords?.length\">\n      <div class=\"metadata-info-keywords sm:pb-4 flex flex-wrap gap-2\">\n        <gn-ui-badge\n          class=\"inline-block lowercase\"\n          (click)=\"onKeywordClick(keyword)\"\n          [clickable]=\"true\"\n          *ngFor=\"let keyword of metadata.keywords\"\n          >{{ keyword.label }}</gn-ui-badge\n        >\n      </div>\n    </div>\n  </gn-ui-content-ghost>\n</div>\n\n<gn-ui-expandable-panel\n  *ngIf=\"\n    metadata.licenses ||\n    metadata.legalConstraints ||\n    metadata.securityConstraints ||\n    metadata.otherConstraints\n  \"\n  [title]=\"'record.metadata.usage' | translate\"\n  data-test=\"usage-panel\"\n>\n  <div class=\"flex flex-col gap-[10px] mr-4 py-[12px] rounded text-gray-900\">\n    <ng-container *ngFor=\"let license of licenses\">\n      <div *ngIf=\"license.url; else noUrl\" class=\"text-primary\">\n        <a\n          [href]=\"license.url\"\n          target=\"_blank\"\n          class=\"cursor-pointer hover:underline transition-all\"\n        >\n          {{ license.text }}\n          <ng-icon\n            class=\"!w-[12px] !h-[12px] !text-[12px] opacity-75 shrink-0\"\n            name=\"matOpenInNew\"\n          ></ng-icon>\n        </a>\n      </div>\n      <ng-template #noUrl>\n        <div class=\"text-primary\" gnUiLinkify>\n          {{ license.text }}\n        </div>\n      </ng-template>\n    </ng-container>\n    <ng-container *ngIf=\"legalConstraints.length\">\n      <div class=\"mb-6\">\n        <gn-ui-markdown-parser\n          *ngFor=\"let constraint of legalConstraints\"\n          [textContent]=\"constraint\"\n        >\n        </gn-ui-markdown-parser>\n      </div>\n    </ng-container>\n    <ng-container *ngIf=\"otherConstraints.length\">\n      <div gnUiLinkify *ngFor=\"let constraint of otherConstraints\">\n        <span\n          translate\n          class=\"font-medium text-black text-sm mb-[2px] mt-[16px]\"\n        >\n          record.metadata.otherConstraints\n        </span>\n        <div class=\"mb-6\">\n          <gn-ui-markdown-parser [textContent]=\"constraint\">\n          </gn-ui-markdown-parser>\n        </div>\n      </div>\n    </ng-container>\n\n    <span class=\"noUsage\" *ngIf=\"!hasUsage\">\n      {{ 'record.metadata.noUsage' | translate }}\n    </span>\n  </div>\n</gn-ui-expandable-panel>\n<gn-ui-expandable-panel\n  *ngIf=\"\n    (metadata.kind === 'dataset' && metadata.lineage) ||\n    metadata.resourceUpdated ||\n    metadata.updateFrequency ||\n    (metadata.kind === 'dataset' && metadata.status)\n  \"\n  [title]=\"'record.metadata.details' | translate\"\n  data-test=\"details-panel\"\n>\n  <div *ngIf=\"metadata.lineage\" class=\"text-gray-900 flex flex-col mt-4 gap-2\">\n    <p class=\"whitespace-pre-line break-words text-gray-900\" gnUiLinkify>\n      {{ metadata.lineage }}\n    </p>\n  </div>\n  <div class=\"flex flex-row gap-6 mt-5 mb-8\" *ngIf=\"resourceContact\">\n    <div\n      *ngIf=\"resourceContact.organization?.logoUrl?.href\"\n      class=\"flex items-center justify-center border-solid border border-gray-300 rounded-md bg-white h-32 overflow-hidden\"\n    >\n      <gn-ui-thumbnail\n        class=\"relative h-full w-full\"\n        [thumbnailUrl]=\"resourceContact.organization.logoUrl.href\"\n        fit=\"contain\"\n      ></gn-ui-thumbnail>\n    </div>\n    <div class=\"flex flex-col gap-1\">\n      <p class=\"text-sm font-medium\" translate>record.metadata.producer</p>\n      <div\n        class=\"text-primary font-title text-21 mr-2 cursor-pointer hover:underline\"\n        data-cy=\"organization-name\"\n      >\n        {{ resourceContact.organization?.name }}\n      </div>\n      <div *ngIf=\"resourceContact.organization?.website\">\n        <a\n          [href]=\"resourceContact.organization.website\"\n          target=\"_blank\"\n          class=\"contact-website text-primary text-sm cursor-pointer hover:underline transition-all\"\n          >{{ resourceContact.organization.website }}\n          <ng-icon\n            class=\"!w-[12px] !h-[12px] !text-[12px] opacity-75 shrink-0\"\n            name=\"matOpenInNew\"\n          ></ng-icon>\n        </a>\n      </div>\n      <div class=\"mt-4\" *ngIf=\"resourceContact.email\">\n        <div class=\"flex\">\n          <ng-icon\n            class=\"!w-5 !h-5 !text-[20px] opacity-75 shrink-0\"\n            name=\"matMailOutline\"\n          ></ng-icon>\n          <a\n            *ngIf=\"resourceContact.email\"\n            [href]=\"'mailto:' + resourceContact.email\"\n            class=\"text-sm hover:underline ml-2\"\n            target=\"_blank\"\n            data-cy=\"contact-email\"\n            >{{ resourceContact?.email }}</a\n          >\n        </div>\n      </div>\n    </div>\n  </div>\n  <div\n    class=\"py-6 px-6 rounded bg-gray-100 grid grid-cols-2 gap-y-6 gap-x-[20px] text-gray-700\"\n  >\n    <div *ngIf=\"metadata.resourceCreated\">\n      <p class=\"text-sm\" translate>record.metadata.creation</p>\n      <p class=\"text-primary font-medium mt-1\">\n        {{ formatDate(metadata.resourceCreated) }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.resourcePublished\">\n      <p class=\"text-sm\" translate>record.metadata.publication</p>\n      <p class=\"text-primary font-medium mt-1\">\n        {{ formatDate(metadata.resourcePublished) }}\n      </p>\n    </div>\n    <div *ngIf=\"updateFrequency\">\n      <p class=\"text-sm\" translate>record.metadata.updateFrequency</p>\n      <p\n        class=\"text-primary font-medium mt-1 updateFrequency\"\n        translate\n        [translateParams]=\"{ count: updatedTimes }\"\n      >\n        {{ updateFrequency }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.otherLanguages?.length\">\n      <p class=\"text-sm mb-1\" translate>record.metadata.languages</p>\n      <div class=\"flex flex-row gap-1 flex-wrap\">\n        <p\n          class=\"text-primary font-medium\"\n          translate\n          *ngFor=\"let language of metadata.otherLanguages\"\n        >\n          language.{{ language }}\n        </p>\n      </div>\n    </div>\n    <div *ngIf=\"temporalExtent\">\n      <p class=\"text-sm\" translate>record.metadata.temporalExtent</p>\n      <div class=\"flex flex-row gap-1 mb-1 text-primary font-medium\">\n        <p\n          *ngIf=\"temporalExtent.start && temporalExtent.end\"\n          translate\n          [translateParams]=\"{\n            start: temporalExtent.start,\n            end: temporalExtent.end,\n          }\"\n        >\n          record.metadata.temporalExtent.fromDateToDate\n        </p>\n        <p\n          *ngIf=\"temporalExtent.start && !temporalExtent.end\"\n          translate\n          [translateParams]=\"{ start: temporalExtent.start }\"\n        >\n          record.metadata.temporalExtent.sinceDate\n        </p>\n        <p\n          *ngIf=\"!temporalExtent.start && temporalExtent.end\"\n          translate\n          [translateParams]=\"{ end: temporalExtent.end }\"\n        >\n          record.metadata.temporalExtent.untilDate\n        </p>\n      </div>\n    </div>\n  </div>\n</gn-ui-expandable-panel>\n<gn-ui-expandable-panel\n  *ngIf=\"metadata.kind !== 'dataset' && metadata.spatialExtents\"\n  [title]=\"'service.metadata.spatialExtent' | translate\"\n  data-test=\"spatial-extent-panel\"\n>\n  <gn-ui-spatial-extent\n    class=\"flex h-[271px] w-full rounded-lg border border-gray-100 mt-3 mb-6\"\n    [spatialExtents]=\"metadata.spatialExtents\"\n  ></gn-ui-spatial-extent>\n</gn-ui-expandable-panel>\n<gn-ui-expandable-panel\n  *ngIf=\"metadata.landingPage\"\n  [title]=\"'service.metadata.other' | translate\"\n  data-test=\"other-panel\"\n>\n  <div class=\"flex flex-col gap-4 mr-4 py-5 rounded text-gray-700\">\n    <div *ngIf=\"metadata.recordUpdated\">\n      <p class=\"text-sm\" translate>record.metadata.updatedOn</p>\n      <p class=\"text-primary font-medium\">\n        {{ metadata.recordUpdated && formatDateTime(metadata.recordUpdated) }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.landingPage\">\n      <p class=\"text-sm\" translate>record.metadata.sheet</p>\n      <p class=\"text-primary font-medium\" translate>\n        <a [href]=\"metadata.landingPage\" target=\"_blank\">\n          <span class=\"break-all\" gnUiLinkify>{{ metadata.landingPage }}</span>\n        </a>\n      </p>\n    </div>\n    <div *ngIf=\"metadata.ownerOrganization\">\n      <p class=\"text-sm\" translate>record.metadata.owner</p>\n      <p class=\"text-primary font-medium\">\n        {{ metadata.ownerOrganization.name }}\n      </p>\n    </div>\n    <div *ngIf=\"metadata.uniqueIdentifier\">\n      <p class=\"text-sm\" translate>record.metadata.uniqueId</p>\n      <div class=\"flex flex-row content-align items-end gap-1\">\n        <gn-ui-copy-text-button\n          [text]=\"metadata.uniqueIdentifier\"\n          [tooltipText]=\"'tooltip.id.copy' | translate\"\n          [displayText]=\"false\"\n        ></gn-ui-copy-text-button>\n        <p class=\"text-primary font-medium\">\n          {{ metadata.uniqueIdentifier }}\n        </p>\n      </div>\n    </div>\n    <div *ngIf=\"metadata.topics?.length\">\n      <p class=\"text-sm mb-1\" translate>record.metadata.topics</p>\n      <div class=\"sm:pb-4 sm:pr-16\">\n        <gn-ui-badge\n          [clickable]=\"false\"\n          class=\"inline-block mr-2 mb-2 lowercase\"\n          *ngFor=\"let topic of metadata.topics\"\n          >{{ topic }}</gn-ui-badge\n        >\n      </div>\n    </div>\n  </div>\n</gn-ui-expandable-panel>\n", styles: [".md-description ::ng-deep a{@apply underline text-blue-600 hover:text-blue-800;}.info-grid>:nth-last-child(n+3){padding-bottom:10px;@apply border-b border-gray-300;}:host ::ng-deep gn-ui-copy-text-button button ng-icon{transform:scale(.8)}:host{--gn-ui-badge-background-color: var(--color-primary-white);--gn-ui-badge-text-color: var(--color-primary-darkest)}:host .metadata-info-keywords ::ng-deep gn-ui-badge:hover{--gn-ui-badge-text-color: white}\n"] }]
         }], ctorParameters: () => [{ type: DateService }], propDecorators: { metadata: [{
                 type: Input
             }], incomplete: [{
@@ -31042,6 +31238,11 @@ class ServiceCapabilitiesComponent {
             this.searchLayers();
         }
     }
+    clearSearch() {
+        this.searchActive = false;
+        this.searchQuery = '';
+        this.filteredLayers = this.availableLayers;
+    }
     async loadLayers() {
         if (this.apiLinks.length > 0 &&
             this.apiLinks[0].accessServiceProtocol !== 'ogcFeatures') {
@@ -31100,15 +31301,16 @@ class ServiceCapabilitiesComponent {
         }
     }
     getExtraClass(layerItem) {
-        return layerItem.title === this.selectedLayer?.title
+        return layerItem === this.selectedLayer
             ? `h-8 rounded-lg bg-primary-darker text-white hover:text-primary-darker hover:bg-white`
             : `h-8 rounded-lg`;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ServiceCapabilitiesComponent, deps: [{ 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: ServiceCapabilitiesComponent, isStandalone: true, selector: "gn-ui-service-capabilities", inputs: { apiLinks: "apiLinks" }, ngImport: i0, template: "<div style=\"height: 652px\" id=\"preview\" *ngIf=\"apiLinks.length > 0\">\n  <div class=\"bg-primary-opacity-10 overflow-visible\" style=\"height: 420px\">\n    <div class=\"container-lg px-4 lg:mx-auto\">\n      <div>\n        <div class=\"gn-ui-section-title mb-6\" translate>\n          service.metadata.capabilities\n        </div>\n        <div\n          *ngIf=\"loading\"\n          class=\"flex justify-center w-full h-[200px] items-center\"\n        >\n          <gn-ui-spinning-loader></gn-ui-spinning-loader>\n        </div>\n        <div *ngIf=\"!loading\">\n          <div class=\"flex flex-row gap-5\">\n            <div class=\"h-14 md:w-2/5 w-full mb-4 flex flex-row relative\">\n              <gn-ui-text-input\n                class=\"w-full\"\n                [extraClass]=\"getExtraInputClass()\"\n                [placeholder]=\"'service.metadata.search' | translate\"\n                (input)=\"onSearchChange($event)\"\n                (keydown.enter)=\"onSearchEnter($event)\"\n              >\n              </gn-ui-text-input>\n              <div class=\"border-l absolute border-gray-200 right-0 h-14 w-14\">\n                <gn-ui-button\n                  #inputBtn\n                  type=\"outline\"\n                  extraClass=\"h-12 w-12 border-0 absolute right-1 top-1\"\n                  (buttonClick)=\"searchLayers()\"\n                >\n                  <ng-icon name=\"iconoirSearch\"></ng-icon>\n                </gn-ui-button>\n              </div>\n            </div>\n            <gn-ui-popover\n              [content]=\"popoverItems\"\n              theme=\"light\"\n              class=\"w-14 h-14 border border-gray-300 rounded-lg flex justify-center items-center\"\n            >\n              <ng-icon name=\"matInfoOutline\" class=\"w-6 h-6 pt-0.5\"></ng-icon>\n            </gn-ui-popover>\n          </div>\n          <div\n            style=\"height: 500px\"\n            class=\"bg-white shadow-xl rounded p-0 flex md:flex-row flex-col\"\n          >\n            <div\n              class=\"flex flex-col gap-2 bg-gray-100 md:w-1/2 md:h-full w-full h-1/2 rounded-l overflow-y-auto py-5 pr-1 pl-3\"\n              data-test=\"layer-list\"\n            >\n              <gn-ui-button\n                *ngFor=\"let layerItem of filteredLayers\"\n                type=\"outline\"\n                [extraClass]=\"getExtraClass(layerItem)\"\n                (buttonClick)=\"selectLayer(layerItem)\"\n              >\n                {{ layerItem.title || layerItem.name }}\n              </gn-ui-button>\n              <span *ngIf=\"filteredLayers.length === 0\" class=\"text-gray-800\">\n                {{ 'service.metadata.filter.noLayers' | translate }}\n              </span>\n            </div>\n            <div\n              data-test=\"layer-information\"\n              class=\"flex flex-col gap-4 md:h-full md:w-1/2 w-full h-1/2 py-5 px-10 overflow-y-auto\"\n            >\n              <div\n                *ngFor=\"let item of layerInformation\"\n                class=\"flex flex-row gap-4 border-b border-gray-200\"\n              >\n                <span class=\"font-semibold w-24\">{{ item.displayName }}</span>\n                <div *ngIf=\"isList(item.value)\">\n                  <div\n                    *ngFor=\"let subItem of item.value\"\n                    class=\"flex flex-row break-words max-w-72\"\n                  >\n                    {{ subItem }}\n                  </div>\n                </div>\n                <div class=\"break-words max-w-72\" *ngIf=\"!isList(item.value)\">\n                  {{ item.value }}\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n<ng-template #popoverItems>\n  <div class=\"p-2 py-4\">\n    <div translate>service.metadata.filter</div>\n  </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: TextInputComponent, selector: "gn-ui-text-input", inputs: ["value", "extraClass", "placeholder", "required", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: PopoverComponent, selector: "gn-ui-popover", inputs: ["content", "theme"] }, { kind: "component", type: SpinningLoaderComponent, selector: "gn-ui-spinning-loader" }], viewProviders: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ServiceCapabilitiesComponent, isStandalone: true, selector: "gn-ui-service-capabilities", inputs: { apiLinks: "apiLinks" }, ngImport: i0, template: "<div style=\"height: 652px\" id=\"preview\" *ngIf=\"apiLinks.length > 0\">\n  <div class=\"bg-primary-opacity-10 overflow-visible\" style=\"height: 420px\">\n    <div class=\"container-lg px-4 lg:mx-auto\">\n      <div>\n        <div class=\"gn-ui-section-title mb-6\" translate>\n          service.metadata.capabilities\n        </div>\n        <div\n          *ngIf=\"loading\"\n          class=\"flex justify-center w-full h-[200px] items-center\"\n        >\n          <gn-ui-spinning-loader></gn-ui-spinning-loader>\n        </div>\n        <div *ngIf=\"!loading\">\n          <div class=\"flex flex-row gap-5\">\n            <div class=\"h-14 md:w-2/5 w-full mb-4 flex flex-row relative\">\n              <gn-ui-text-input\n                class=\"w-full\"\n                [(value)]=\"searchQuery\"\n                [extraClass]=\"getExtraInputClass()\"\n                [placeholder]=\"'service.metadata.search' | translate\"\n                (input)=\"onSearchChange($event)\"\n                (keydown.enter)=\"onSearchEnter($event)\"\n              >\n              </gn-ui-text-input>\n              <div\n                class=\"absolute right-14 h-14 w-14 flex items-center justify-center\"\n              >\n                <button\n                  #inputBtn\n                  *ngIf=\"searchQuery\"\n                  [aria-label]=\"'service.metadata.search.clear' | translate\"\n                  (click)=\"clearSearch()\"\n                  class=\"h-12 w-12 border-0 flex items-center justify-center\"\n                >\n                  <ng-icon name=\"matClose\"></ng-icon>\n                </button>\n              </div>\n              <div class=\"border-l absolute border-gray-200 right-0 h-14 w-14\">\n                <gn-ui-button\n                  #inputBtn\n                  type=\"outline\"\n                  extraClass=\"h-12 w-12 border-0 absolute right-1 top-1 bg-white\"\n                  (buttonClick)=\"searchLayers()\"\n                >\n                  <ng-icon name=\"iconoirSearch\"></ng-icon>\n                </gn-ui-button>\n              </div>\n            </div>\n            <gn-ui-popover\n              [content]=\"popoverItems\"\n              theme=\"light\"\n              class=\"w-14 h-14 border border-gray-300 rounded-lg flex justify-center items-center\"\n            >\n              <ng-icon name=\"matInfoOutline\" class=\"w-6 h-6 pt-0.5\"></ng-icon>\n            </gn-ui-popover>\n          </div>\n          <div\n            style=\"height: 500px\"\n            class=\"bg-white shadow-xl rounded p-0 flex md:flex-row flex-col\"\n          >\n            <div\n              class=\"flex flex-col gap-2 bg-gray-100 md:w-1/2 md:h-full w-full h-1/2 rounded-l overflow-y-auto py-5 pr-1 pl-3\"\n              data-test=\"layer-list\"\n            >\n              <gn-ui-button\n                *ngFor=\"let layerItem of filteredLayers\"\n                type=\"outline\"\n                [extraClass]=\"getExtraClass(layerItem)\"\n                (buttonClick)=\"selectLayer(layerItem)\"\n              >\n                {{ layerItem.title || layerItem.name }}\n              </gn-ui-button>\n              <span *ngIf=\"filteredLayers.length === 0\" class=\"text-gray-800\">\n                {{ 'service.metadata.filter.noLayers' | translate }}\n              </span>\n            </div>\n            <div\n              data-test=\"layer-information\"\n              class=\"flex flex-col gap-4 md:h-full md:w-1/2 w-full h-1/2 py-5 px-10 overflow-y-auto\"\n            >\n              <div\n                *ngFor=\"let item of layerInformation\"\n                class=\"flex flex-row gap-4 border-b border-gray-200\"\n              >\n                <span class=\"font-semibold w-24\">{{ item.displayName }}</span>\n                <div *ngIf=\"isList(item.value)\">\n                  <div\n                    *ngFor=\"let subItem of item.value\"\n                    class=\"flex flex-row break-words max-w-72\"\n                  >\n                    {{ subItem }}\n                  </div>\n                </div>\n                <div class=\"break-words max-w-72\" *ngIf=\"!isList(item.value)\">\n                  {{ item.value }}\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n<ng-template #popoverItems>\n  <div class=\"p-2 py-4\">\n    <div translate>service.metadata.filter</div>\n  </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: TextInputComponent, selector: "gn-ui-text-input", inputs: ["value", "extraClass", "placeholder", "required", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: PopoverComponent, selector: "gn-ui-popover", inputs: ["content", "theme"] }, { kind: "component", type: SpinningLoaderComponent, selector: "gn-ui-spinning-loader" }], viewProviders: [
             provideIcons({
                 iconoirSearch,
                 matInfoOutline,
+                matClose,
             }),
         ] }); }
 }
@@ -31126,8 +31328,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         provideIcons({
                             iconoirSearch,
                             matInfoOutline,
+                            matClose,
                         }),
-                    ], template: "<div style=\"height: 652px\" id=\"preview\" *ngIf=\"apiLinks.length > 0\">\n  <div class=\"bg-primary-opacity-10 overflow-visible\" style=\"height: 420px\">\n    <div class=\"container-lg px-4 lg:mx-auto\">\n      <div>\n        <div class=\"gn-ui-section-title mb-6\" translate>\n          service.metadata.capabilities\n        </div>\n        <div\n          *ngIf=\"loading\"\n          class=\"flex justify-center w-full h-[200px] items-center\"\n        >\n          <gn-ui-spinning-loader></gn-ui-spinning-loader>\n        </div>\n        <div *ngIf=\"!loading\">\n          <div class=\"flex flex-row gap-5\">\n            <div class=\"h-14 md:w-2/5 w-full mb-4 flex flex-row relative\">\n              <gn-ui-text-input\n                class=\"w-full\"\n                [extraClass]=\"getExtraInputClass()\"\n                [placeholder]=\"'service.metadata.search' | translate\"\n                (input)=\"onSearchChange($event)\"\n                (keydown.enter)=\"onSearchEnter($event)\"\n              >\n              </gn-ui-text-input>\n              <div class=\"border-l absolute border-gray-200 right-0 h-14 w-14\">\n                <gn-ui-button\n                  #inputBtn\n                  type=\"outline\"\n                  extraClass=\"h-12 w-12 border-0 absolute right-1 top-1\"\n                  (buttonClick)=\"searchLayers()\"\n                >\n                  <ng-icon name=\"iconoirSearch\"></ng-icon>\n                </gn-ui-button>\n              </div>\n            </div>\n            <gn-ui-popover\n              [content]=\"popoverItems\"\n              theme=\"light\"\n              class=\"w-14 h-14 border border-gray-300 rounded-lg flex justify-center items-center\"\n            >\n              <ng-icon name=\"matInfoOutline\" class=\"w-6 h-6 pt-0.5\"></ng-icon>\n            </gn-ui-popover>\n          </div>\n          <div\n            style=\"height: 500px\"\n            class=\"bg-white shadow-xl rounded p-0 flex md:flex-row flex-col\"\n          >\n            <div\n              class=\"flex flex-col gap-2 bg-gray-100 md:w-1/2 md:h-full w-full h-1/2 rounded-l overflow-y-auto py-5 pr-1 pl-3\"\n              data-test=\"layer-list\"\n            >\n              <gn-ui-button\n                *ngFor=\"let layerItem of filteredLayers\"\n                type=\"outline\"\n                [extraClass]=\"getExtraClass(layerItem)\"\n                (buttonClick)=\"selectLayer(layerItem)\"\n              >\n                {{ layerItem.title || layerItem.name }}\n              </gn-ui-button>\n              <span *ngIf=\"filteredLayers.length === 0\" class=\"text-gray-800\">\n                {{ 'service.metadata.filter.noLayers' | translate }}\n              </span>\n            </div>\n            <div\n              data-test=\"layer-information\"\n              class=\"flex flex-col gap-4 md:h-full md:w-1/2 w-full h-1/2 py-5 px-10 overflow-y-auto\"\n            >\n              <div\n                *ngFor=\"let item of layerInformation\"\n                class=\"flex flex-row gap-4 border-b border-gray-200\"\n              >\n                <span class=\"font-semibold w-24\">{{ item.displayName }}</span>\n                <div *ngIf=\"isList(item.value)\">\n                  <div\n                    *ngFor=\"let subItem of item.value\"\n                    class=\"flex flex-row break-words max-w-72\"\n                  >\n                    {{ subItem }}\n                  </div>\n                </div>\n                <div class=\"break-words max-w-72\" *ngIf=\"!isList(item.value)\">\n                  {{ item.value }}\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n<ng-template #popoverItems>\n  <div class=\"p-2 py-4\">\n    <div translate>service.metadata.filter</div>\n  </div>\n</ng-template>\n" }]
+                    ], template: "<div style=\"height: 652px\" id=\"preview\" *ngIf=\"apiLinks.length > 0\">\n  <div class=\"bg-primary-opacity-10 overflow-visible\" style=\"height: 420px\">\n    <div class=\"container-lg px-4 lg:mx-auto\">\n      <div>\n        <div class=\"gn-ui-section-title mb-6\" translate>\n          service.metadata.capabilities\n        </div>\n        <div\n          *ngIf=\"loading\"\n          class=\"flex justify-center w-full h-[200px] items-center\"\n        >\n          <gn-ui-spinning-loader></gn-ui-spinning-loader>\n        </div>\n        <div *ngIf=\"!loading\">\n          <div class=\"flex flex-row gap-5\">\n            <div class=\"h-14 md:w-2/5 w-full mb-4 flex flex-row relative\">\n              <gn-ui-text-input\n                class=\"w-full\"\n                [(value)]=\"searchQuery\"\n                [extraClass]=\"getExtraInputClass()\"\n                [placeholder]=\"'service.metadata.search' | translate\"\n                (input)=\"onSearchChange($event)\"\n                (keydown.enter)=\"onSearchEnter($event)\"\n              >\n              </gn-ui-text-input>\n              <div\n                class=\"absolute right-14 h-14 w-14 flex items-center justify-center\"\n              >\n                <button\n                  #inputBtn\n                  *ngIf=\"searchQuery\"\n                  [aria-label]=\"'service.metadata.search.clear' | translate\"\n                  (click)=\"clearSearch()\"\n                  class=\"h-12 w-12 border-0 flex items-center justify-center\"\n                >\n                  <ng-icon name=\"matClose\"></ng-icon>\n                </button>\n              </div>\n              <div class=\"border-l absolute border-gray-200 right-0 h-14 w-14\">\n                <gn-ui-button\n                  #inputBtn\n                  type=\"outline\"\n                  extraClass=\"h-12 w-12 border-0 absolute right-1 top-1 bg-white\"\n                  (buttonClick)=\"searchLayers()\"\n                >\n                  <ng-icon name=\"iconoirSearch\"></ng-icon>\n                </gn-ui-button>\n              </div>\n            </div>\n            <gn-ui-popover\n              [content]=\"popoverItems\"\n              theme=\"light\"\n              class=\"w-14 h-14 border border-gray-300 rounded-lg flex justify-center items-center\"\n            >\n              <ng-icon name=\"matInfoOutline\" class=\"w-6 h-6 pt-0.5\"></ng-icon>\n            </gn-ui-popover>\n          </div>\n          <div\n            style=\"height: 500px\"\n            class=\"bg-white shadow-xl rounded p-0 flex md:flex-row flex-col\"\n          >\n            <div\n              class=\"flex flex-col gap-2 bg-gray-100 md:w-1/2 md:h-full w-full h-1/2 rounded-l overflow-y-auto py-5 pr-1 pl-3\"\n              data-test=\"layer-list\"\n            >\n              <gn-ui-button\n                *ngFor=\"let layerItem of filteredLayers\"\n                type=\"outline\"\n                [extraClass]=\"getExtraClass(layerItem)\"\n                (buttonClick)=\"selectLayer(layerItem)\"\n              >\n                {{ layerItem.title || layerItem.name }}\n              </gn-ui-button>\n              <span *ngIf=\"filteredLayers.length === 0\" class=\"text-gray-800\">\n                {{ 'service.metadata.filter.noLayers' | translate }}\n              </span>\n            </div>\n            <div\n              data-test=\"layer-information\"\n              class=\"flex flex-col gap-4 md:h-full md:w-1/2 w-full h-1/2 py-5 px-10 overflow-y-auto\"\n            >\n              <div\n                *ngFor=\"let item of layerInformation\"\n                class=\"flex flex-row gap-4 border-b border-gray-200\"\n              >\n                <span class=\"font-semibold w-24\">{{ item.displayName }}</span>\n                <div *ngIf=\"isList(item.value)\">\n                  <div\n                    *ngFor=\"let subItem of item.value\"\n                    class=\"flex flex-row break-words max-w-72\"\n                  >\n                    {{ subItem }}\n                  </div>\n                </div>\n                <div class=\"break-words max-w-72\" *ngIf=\"!isList(item.value)\">\n                  {{ item.value }}\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n<ng-template #popoverItems>\n  <div class=\"p-2 py-4\">\n    <div translate>service.metadata.filter</div>\n  </div>\n</ng-template>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.TranslateService }], propDecorators: { apiLinks: [{
                 type: Input
             }] } });
@@ -31300,6 +31503,50 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 type: Output
             }] } });
 
+class FeatureCatalogListComponent {
+    constructor() {
+        this.columns = [
+            {
+                key: 'type',
+                label: 'feature.catalog.attribute.type',
+                width: '19%',
+            },
+            {
+                key: 'name',
+                label: 'feature.catalog.attribute.name',
+                width: '32%',
+            },
+            {
+                key: 'code',
+                label: 'feature.catalog.attribute.code',
+                width: '24%',
+            },
+            {
+                key: 'title',
+                label: 'feature.catalog.attribute.description',
+                width: '25%',
+            },
+        ];
+        this.gridTemplateColumns = '';
+    }
+    ngOnInit() {
+        this.gridTemplateColumns = this.columns.map((col) => col.width).join(' ');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FeatureCatalogListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FeatureCatalogListComponent, isStandalone: true, selector: "gn-ui-feature-catalog-list", inputs: { filteredFeatureCatalog: "filteredFeatureCatalog" }, ngImport: i0, template: "<div class=\"flex flex-col gap-2 py-5 px-5 h-[562px] overflow-y-auto\">\n  <div\n    *ngFor=\"let featureType of filteredFeatureCatalog?.featureTypes\"\n    class=\"rounded shadow bg-white\"\n  >\n    <gn-ui-expandable-panel\n      [collapsed]=\"filteredFeatureCatalog?.featureTypes?.length !== 1\"\n      iconColor=\"black\"\n    >\n      <ng-template #titleTemplate>\n        <div class=\"px-2\">\n          <div class=\"text-lg font-bold\">{{ featureType.name }}</div>\n          <div class=\"text-sm\" *ngIf=\"featureType.definition\">\n            {{ featureType.definition }}\n          </div>\n        </div>\n      </ng-template>\n      <div\n        class=\"grid gap-0\"\n        [style.grid-template-columns]=\"gridTemplateColumns\"\n        data-cy=\"feature-type-content\"\n      >\n        <div\n          class=\"py-1 px-2 text-sm font-bold text-left border-t\"\n          [class.border-l]=\"i > 0\"\n          [class.border-gray-300]=\"i > 0\"\n          *ngFor=\"let col of columns; let i = index\"\n          data-test=\"column-label\"\n        >\n          {{ col.label | translate }}\n        </div>\n        <ng-container *ngFor=\"let row of featureType.attributes\">\n          <div\n            class=\"bg-white text-sm font-normal text-left border-t\"\n            [class.border-l]=\"i > 0\"\n            [class.border-gray-300]=\"i > 0\"\n            *ngFor=\"let col of columns; let i = index\"\n          >\n            <gn-ui-truncated-text\n              extraClass=\"py-3 px-2\"\n              [text]=\"row[col.key]\"\n            ></gn-ui-truncated-text>\n          </div>\n        </ng-container>\n      </div>\n    </gn-ui-expandable-panel>\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "component", type: ExpandablePanelComponent, selector: "gn-ui-expandable-panel", inputs: ["title", "iconColor", "collapsed"] }, { kind: "component", type: TruncatedTextComponent, selector: "gn-ui-truncated-text", inputs: ["text", "extraClass"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FeatureCatalogListComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'gn-ui-feature-catalog-list', standalone: true, imports: [
+                        CommonModule,
+                        TranslateModule,
+                        ExpandablePanelComponent,
+                        TruncatedTextComponent,
+                    ], template: "<div class=\"flex flex-col gap-2 py-5 px-5 h-[562px] overflow-y-auto\">\n  <div\n    *ngFor=\"let featureType of filteredFeatureCatalog?.featureTypes\"\n    class=\"rounded shadow bg-white\"\n  >\n    <gn-ui-expandable-panel\n      [collapsed]=\"filteredFeatureCatalog?.featureTypes?.length !== 1\"\n      iconColor=\"black\"\n    >\n      <ng-template #titleTemplate>\n        <div class=\"px-2\">\n          <div class=\"text-lg font-bold\">{{ featureType.name }}</div>\n          <div class=\"text-sm\" *ngIf=\"featureType.definition\">\n            {{ featureType.definition }}\n          </div>\n        </div>\n      </ng-template>\n      <div\n        class=\"grid gap-0\"\n        [style.grid-template-columns]=\"gridTemplateColumns\"\n        data-cy=\"feature-type-content\"\n      >\n        <div\n          class=\"py-1 px-2 text-sm font-bold text-left border-t\"\n          [class.border-l]=\"i > 0\"\n          [class.border-gray-300]=\"i > 0\"\n          *ngFor=\"let col of columns; let i = index\"\n          data-test=\"column-label\"\n        >\n          {{ col.label | translate }}\n        </div>\n        <ng-container *ngFor=\"let row of featureType.attributes\">\n          <div\n            class=\"bg-white text-sm font-normal text-left border-t\"\n            [class.border-l]=\"i > 0\"\n            [class.border-gray-300]=\"i > 0\"\n            *ngFor=\"let col of columns; let i = index\"\n          >\n            <gn-ui-truncated-text\n              extraClass=\"py-3 px-2\"\n              [text]=\"row[col.key]\"\n            ></gn-ui-truncated-text>\n          </div>\n        </ng-container>\n      </div>\n    </gn-ui-expandable-panel>\n  </div>\n</div>\n" }]
+        }], propDecorators: { filteredFeatureCatalog: [{
+                type: Input
+            }] } });
+
 class UiSearchModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UiSearchModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: UiSearchModule, declarations: [RecordPreviewComponent,
@@ -37046,6 +37293,36 @@ class DataService {
             throw new Error(`ogc.unreachable.unknown`);
         });
     }
+    async getGeodataLinksFromTms(tmsLink, keepOriginalLink = false) {
+        const endpoint = new TmsEndpoint(tmsLink.url.toString());
+        const tileMaps = await endpoint.allTileMaps;
+        if (!tileMaps?.length)
+            return null;
+        // TODO: at some point use the identifierInService field if more that one layers in the TMS service
+        const tileMapInfo = await endpoint.getTileMapInfo(tileMaps[0].href);
+        // case 1: no styles; return a plain TMS link
+        if (!tileMapInfo?.metadata?.length)
+            return [tmsLink];
+        // case 2: styles present; return each as a separate link
+        const styleLinks = tileMapInfo.metadata
+            .filter((meta) => meta.href)
+            .map((meta) => {
+            const fileName = meta.href.split('/').pop() || '';
+            const linkName = tmsLink.description || ('name' in tmsLink ? tmsLink.name : '');
+            const styleName = fileName.split('.')[0];
+            const name = `${linkName} - ${styleName}`;
+            return {
+                type: 'service',
+                url: new URL(meta.href),
+                name,
+                accessServiceProtocol: 'maplibre-style',
+            };
+        });
+        if (keepOriginalLink) {
+            styleLinks.unshift(tmsLink);
+        }
+        return styleLinks;
+    }
     getDownloadLinksFromEsriRest(esriRestLink) {
         return ['json', 'geojson'].map((format) => ({
             ...esriRestLink,
@@ -37200,7 +37477,7 @@ class ChartComponent {
             labels: this.getDataProxy(this.labelProperty),
             datasets: [
                 {
-                    label: this.valueProperty,
+                    label: this.prettyLabel,
                     data,
                 },
             ],
@@ -37310,7 +37587,7 @@ class ChartComponent {
         this.chart = this.createChart();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ChartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ChartComponent, isStandalone: true, selector: "gn-ui-chart", inputs: { data: "data", labelProperty: "labelProperty", valueProperty: "valueProperty", secondaryValueProperty: "secondaryValueProperty", type: "type" }, viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["chartCanvas"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"h-full flex justify-center items-center p-1\">\n  <canvas #chartCanvas></canvas>\n</div>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ChartComponent, isStandalone: true, selector: "gn-ui-chart", inputs: { data: "data", labelProperty: "labelProperty", prettyLabel: "prettyLabel", valueProperty: "valueProperty", secondaryValueProperty: "secondaryValueProperty", type: "type" }, viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["chartCanvas"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"h-full flex justify-center items-center p-1\">\n  <canvas #chartCanvas></canvas>\n</div>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ChartComponent, decorators: [{
             type: Component,
@@ -37319,6 +37596,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 type: Input
             }], labelProperty: [{
                 type: Input
+            }], prettyLabel: [{
+                type: Input
             }], valueProperty: [{
                 type: Input
             }], secondaryValueProperty: [{
@@ -37399,17 +37678,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 
 const rowIdPrefix = 'table-item-';
 class DataTableComponent {
+    set featureAttributes(value) {
+        this._featureAttributes = value;
+        this.properties$.next(value.map((attr) => attr.value));
+    }
     set dataset(value) {
-        this.properties$.next(null);
         this.dataset_ = value;
         this.dataset_.load();
-        this.dataset_.properties.then((properties) => this.properties$.next(properties.map((p) => p.name)));
         this.dataset_.info.then((info) => (this.count = info.itemsCount));
     }
     constructor(eltRef, cdr, translateService) {
         this.eltRef = eltRef;
         this.cdr = cdr;
         this.translateService = translateService;
+        this._featureAttributes = [];
         this.selected = new EventEmitter();
         this.properties$ = new BehaviorSubject(null);
         this.loading$ = new BehaviorSubject(false);
@@ -37482,7 +37764,7 @@ class DataTableComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DataTableComponent, deps: [{ token: i0.ElementRef }, { 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: DataTableComponent, isStandalone: true, selector: "gn-ui-data-table", inputs: { dataset: "dataset", activeId: "activeId" }, outputs: { selected: "selected" }, providers: [{ provide: MatPaginatorIntl, useClass: CustomMatPaginatorIntl }], viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-col border border-gray-300 rounded-lg bg-white h-full\">\n  <div class=\"flex-1 overflow-y-hidden overflow-x-auto rounded-lg relative\">\n    <table\n      mat-table\n      [dataSource]=\"dataSource\"\n      matSort\n      (matSortChange)=\"setSort($event)\"\n      [matSortDisableClear]=\"true\"\n      *ngrxLet=\"properties$ as properties\"\n    >\n      <ng-container *ngFor=\"let prop of properties\" [matColumnDef]=\"prop\">\n        <th\n          mat-header-cell\n          *matHeaderCellDef\n          mat-sort-header\n          class=\"text-sm text-black bg-white\"\n        >\n          {{ prop }}\n        </th>\n        <td\n          mat-cell\n          *matCellDef=\"let element\"\n          class=\"whitespace-nowrap pr-1 truncate\"\n        >\n          {{ element[prop] }}\n        </td>\n      </ng-container>\n\n      <tr mat-header-row *matHeaderRowDef=\"properties; sticky: true\"></tr>\n      <tr\n        [id]=\"getRowEltId(row.id)\"\n        mat-row\n        *matRowDef=\"let row; columns: properties\"\n        (click)=\"selected.emit(row)\"\n        [class.active]=\"\n          activeId !== undefined && activeId !== null && row.id === activeId\n        \"\n      ></tr>\n    </table>\n    <gn-ui-loading-mask\n      *ngIf=\"loading$ | async\"\n      class=\"sticky inset-0\"\n      [message]=\"'table.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 z-[100]\"\n    >\n      <span translate>{{ error }}</span>\n    </gn-ui-popup-alert>\n  </div>\n  <div class=\"flex justify-between items-center overflow-hidden\">\n    <div class=\"text-gray-900 px-4 py-2 text-sm\">\n      <span class=\"count font-extrabold text-primary\">{{ count }}</span\n      >&nbsp;<span translate>table.object.count</span>.\n    </div>\n\n    <mat-paginator\n      class=\"my-[-16px]\"\n      (page)=\"setPagination()\"\n      [length]=\"count\"\n      [pageSize]=\"10\"\n      [showFirstLastButtons]=\"true\"\n      [hidePageSize]=\"true\"\n    ></mat-paginator>\n  </div>\n</div>\n", styles: ["table{width:100%;background:#fff}th.mat-mdc-header-cell,td.mat-mdc-cell,td.mat-mdc-footer-cell{padding-right:20px}tr.mat-mdc-row,tr.mat-mdc-footer-row{height:36px}tr:hover{background:#f5f5f5}tr.mat-mdc-header-row{height:48px}[mat-header-cell]{color:#0000008a;font-size:12px;font-weight:500}tr{cursor:pointer}.active .mat-mdc-cell{color:var(--color-primary)}.mat-mdc-paginator{background:none}\n"], dependencies: [{ kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i2$4.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i2$4.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i2$4.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i2$4.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i2$4.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i2$4.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i2$4.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i2$4.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i2$4.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i2$4.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i3$1.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i3$1.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i4.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "ngmodule", type: CommonModule }, { 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: LoadingMaskComponent, selector: "gn-ui-loading-mask", inputs: ["message"] }, { kind: "component", type: PopupAlertComponent, selector: "gn-ui-popup-alert", inputs: ["icon", "type", "position"] }, { kind: "directive", type: LetDirective, selector: "[ngrxLet]", inputs: ["ngrxLet", "ngrxLetSuspenseTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: DataTableComponent, isStandalone: true, selector: "gn-ui-data-table", inputs: { featureAttributes: "featureAttributes", dataset: "dataset", activeId: "activeId" }, outputs: { selected: "selected" }, providers: [{ provide: MatPaginatorIntl, useClass: CustomMatPaginatorIntl }], viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-col border border-gray-300 rounded-lg bg-white h-full\">\n  <div class=\"flex-1 overflow-y-hidden overflow-x-auto rounded-lg relative\">\n    <table\n      mat-table\n      [dataSource]=\"dataSource\"\n      matSort\n      (matSortChange)=\"setSort($event)\"\n      [matSortDisableClear]=\"true\"\n      *ngrxLet=\"properties$ as properties\"\n    >\n      <ng-container\n        *ngFor=\"let attr of _featureAttributes\"\n        [matColumnDef]=\"attr.value\"\n      >\n        <th\n          mat-header-cell\n          *matHeaderCellDef\n          mat-sort-header\n          class=\"text-sm text-black bg-white\"\n        >\n          {{ attr.label }}\n        </th>\n        <td\n          mat-cell\n          *matCellDef=\"let element\"\n          class=\"whitespace-nowrap pr-1 truncate\"\n        >\n          {{ element[attr.value] }}\n        </td>\n      </ng-container>\n\n      <tr mat-header-row *matHeaderRowDef=\"properties; sticky: true\"></tr>\n      <tr\n        [id]=\"getRowEltId(row.id)\"\n        mat-row\n        *matRowDef=\"let row; columns: properties\"\n        (click)=\"selected.emit(row)\"\n        [class.active]=\"\n          activeId !== undefined && activeId !== null && row.id === activeId\n        \"\n      ></tr>\n    </table>\n    <gn-ui-loading-mask\n      *ngIf=\"loading$ | async\"\n      class=\"sticky inset-0\"\n      [message]=\"'table.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 z-[100]\"\n    >\n      <span translate>{{ error }}</span>\n    </gn-ui-popup-alert>\n  </div>\n  <div class=\"flex justify-between items-center overflow-hidden\">\n    <div class=\"text-gray-900 px-4 py-2 text-sm\">\n      <span class=\"count font-extrabold text-primary\">{{ count }}</span\n      >&nbsp;<span translate>table.object.count</span>.\n    </div>\n\n    <mat-paginator\n      class=\"my-[-16px]\"\n      (page)=\"setPagination()\"\n      [length]=\"count\"\n      [pageSize]=\"10\"\n      [showFirstLastButtons]=\"true\"\n      [hidePageSize]=\"true\"\n    ></mat-paginator>\n  </div>\n</div>\n", styles: ["table{width:100%;background:#fff}th.mat-mdc-header-cell,td.mat-mdc-cell,td.mat-mdc-footer-cell{padding-right:20px}tr.mat-mdc-row,tr.mat-mdc-footer-row{height:36px}tr:hover{background:#f5f5f5}tr.mat-mdc-header-row{height:48px}[mat-header-cell]{color:#0000008a;font-size:12px;font-weight:500}tr{cursor:pointer}.active .mat-mdc-cell{color:var(--color-primary)}.mat-mdc-paginator{background:none}\n"], dependencies: [{ kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i2$4.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i2$4.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i2$4.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i2$4.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i2$4.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i2$4.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i2$4.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i2$4.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i2$4.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i2$4.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i3$1.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i3$1.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i4.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "ngmodule", type: CommonModule }, { 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: LoadingMaskComponent, selector: "gn-ui-loading-mask", inputs: ["message"] }, { kind: "component", type: PopupAlertComponent, selector: "gn-ui-popup-alert", inputs: ["icon", "type", "position"] }, { kind: "directive", type: LetDirective, selector: "[ngrxLet]", inputs: ["ngrxLet", "ngrxLetSuspenseTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DataTableComponent, decorators: [{
             type: Component,
@@ -37496,8 +37778,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         LoadingMaskComponent,
                         PopupAlertComponent,
                         LetDirective,
-                    ], providers: [{ provide: MatPaginatorIntl, useClass: CustomMatPaginatorIntl }], selector: 'gn-ui-data-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex flex-col border border-gray-300 rounded-lg bg-white h-full\">\n  <div class=\"flex-1 overflow-y-hidden overflow-x-auto rounded-lg relative\">\n    <table\n      mat-table\n      [dataSource]=\"dataSource\"\n      matSort\n      (matSortChange)=\"setSort($event)\"\n      [matSortDisableClear]=\"true\"\n      *ngrxLet=\"properties$ as properties\"\n    >\n      <ng-container *ngFor=\"let prop of properties\" [matColumnDef]=\"prop\">\n        <th\n          mat-header-cell\n          *matHeaderCellDef\n          mat-sort-header\n          class=\"text-sm text-black bg-white\"\n        >\n          {{ prop }}\n        </th>\n        <td\n          mat-cell\n          *matCellDef=\"let element\"\n          class=\"whitespace-nowrap pr-1 truncate\"\n        >\n          {{ element[prop] }}\n        </td>\n      </ng-container>\n\n      <tr mat-header-row *matHeaderRowDef=\"properties; sticky: true\"></tr>\n      <tr\n        [id]=\"getRowEltId(row.id)\"\n        mat-row\n        *matRowDef=\"let row; columns: properties\"\n        (click)=\"selected.emit(row)\"\n        [class.active]=\"\n          activeId !== undefined && activeId !== null && row.id === activeId\n        \"\n      ></tr>\n    </table>\n    <gn-ui-loading-mask\n      *ngIf=\"loading$ | async\"\n      class=\"sticky inset-0\"\n      [message]=\"'table.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 z-[100]\"\n    >\n      <span translate>{{ error }}</span>\n    </gn-ui-popup-alert>\n  </div>\n  <div class=\"flex justify-between items-center overflow-hidden\">\n    <div class=\"text-gray-900 px-4 py-2 text-sm\">\n      <span class=\"count font-extrabold text-primary\">{{ count }}</span\n      >&nbsp;<span translate>table.object.count</span>.\n    </div>\n\n    <mat-paginator\n      class=\"my-[-16px]\"\n      (page)=\"setPagination()\"\n      [length]=\"count\"\n      [pageSize]=\"10\"\n      [showFirstLastButtons]=\"true\"\n      [hidePageSize]=\"true\"\n    ></mat-paginator>\n  </div>\n</div>\n", styles: ["table{width:100%;background:#fff}th.mat-mdc-header-cell,td.mat-mdc-cell,td.mat-mdc-footer-cell{padding-right:20px}tr.mat-mdc-row,tr.mat-mdc-footer-row{height:36px}tr:hover{background:#f5f5f5}tr.mat-mdc-header-row{height:48px}[mat-header-cell]{color:#0000008a;font-size:12px;font-weight:500}tr{cursor:pointer}.active .mat-mdc-cell{color:var(--color-primary)}.mat-mdc-paginator{background:none}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$1.TranslateService }], propDecorators: { dataset: [{
+                    ], providers: [{ provide: MatPaginatorIntl, useClass: CustomMatPaginatorIntl }], selector: 'gn-ui-data-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex flex-col border border-gray-300 rounded-lg bg-white h-full\">\n  <div class=\"flex-1 overflow-y-hidden overflow-x-auto rounded-lg relative\">\n    <table\n      mat-table\n      [dataSource]=\"dataSource\"\n      matSort\n      (matSortChange)=\"setSort($event)\"\n      [matSortDisableClear]=\"true\"\n      *ngrxLet=\"properties$ as properties\"\n    >\n      <ng-container\n        *ngFor=\"let attr of _featureAttributes\"\n        [matColumnDef]=\"attr.value\"\n      >\n        <th\n          mat-header-cell\n          *matHeaderCellDef\n          mat-sort-header\n          class=\"text-sm text-black bg-white\"\n        >\n          {{ attr.label }}\n        </th>\n        <td\n          mat-cell\n          *matCellDef=\"let element\"\n          class=\"whitespace-nowrap pr-1 truncate\"\n        >\n          {{ element[attr.value] }}\n        </td>\n      </ng-container>\n\n      <tr mat-header-row *matHeaderRowDef=\"properties; sticky: true\"></tr>\n      <tr\n        [id]=\"getRowEltId(row.id)\"\n        mat-row\n        *matRowDef=\"let row; columns: properties\"\n        (click)=\"selected.emit(row)\"\n        [class.active]=\"\n          activeId !== undefined && activeId !== null && row.id === activeId\n        \"\n      ></tr>\n    </table>\n    <gn-ui-loading-mask\n      *ngIf=\"loading$ | async\"\n      class=\"sticky inset-0\"\n      [message]=\"'table.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 z-[100]\"\n    >\n      <span translate>{{ error }}</span>\n    </gn-ui-popup-alert>\n  </div>\n  <div class=\"flex justify-between items-center overflow-hidden\">\n    <div class=\"text-gray-900 px-4 py-2 text-sm\">\n      <span class=\"count font-extrabold text-primary\">{{ count }}</span\n      >&nbsp;<span translate>table.object.count</span>.\n    </div>\n\n    <mat-paginator\n      class=\"my-[-16px]\"\n      (page)=\"setPagination()\"\n      [length]=\"count\"\n      [pageSize]=\"10\"\n      [showFirstLastButtons]=\"true\"\n      [hidePageSize]=\"true\"\n    ></mat-paginator>\n  </div>\n</div>\n", styles: ["table{width:100%;background:#fff}th.mat-mdc-header-cell,td.mat-mdc-cell,td.mat-mdc-footer-cell{padding-right:20px}tr.mat-mdc-row,tr.mat-mdc-footer-row{height:36px}tr:hover{background:#f5f5f5}tr.mat-mdc-header-row{height:48px}[mat-header-cell]{color:#0000008a;font-size:12px;font-weight:500}tr{cursor:pointer}.active .mat-mdc-cell{color:var(--color-primary)}.mat-mdc-paginator{background:none}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$1.TranslateService }], propDecorators: { featureAttributes: [{
+                type: Input
+            }], dataset: [{
                 type: Input
             }], activeId: [{
                 type: Input
@@ -37604,8 +37888,14 @@ marker('chart.aggregation.min');
 marker('chart.aggregation.average');
 marker('chart.aggregation.count');
 class ChartViewComponent {
+    set featureCatalog(value) {
+        this.featureCatalog$.next(value);
+    }
     set link(value) {
         this.currentLink$.next(value);
+        if (value) {
+            this.aggregation$.next('sum');
+        }
     }
     set aggregation(value) {
         this.aggregation$.next(value);
@@ -37648,6 +37938,7 @@ class ChartViewComponent {
         this.dataService = dataService;
         this.changeDetector = changeDetector;
         this.translateService = translateService;
+        this.featureCatalog$ = new BehaviorSubject(null);
         this.cacheActive = true;
         this.currentLink$ = new BehaviorSubject(null);
         this.aggregation$ = new BehaviorSubject('sum');
@@ -37687,10 +37978,7 @@ class ChartViewComponent {
                 return EMPTY;
             }));
         }), shareReplay(1));
-        this.properties$ = this.dataset$.pipe(switchMap$1((dataset) => dataset.properties.catch((error) => {
-            this.handleError(error);
-            return [];
-        })), shareReplay(1));
+        this.properties$ = combineLatest([this.dataset$, this.featureCatalog$]).pipe(switchMap$1(([dataset, catalog]) => this.setProperties(dataset, catalog)), shareReplay(1));
         this.yChoices$ = this.properties$.pipe(map$1((properties) => properties
             .filter((prop) => prop.type === 'number' || prop.type === 'date')
             .map((prop) => ({ value: prop.name, label: prop.label || prop.name }))), tap$1((choices) => {
@@ -37717,7 +38005,7 @@ class ChartViewComponent {
             this.xProperty$.pipe(filter((value) => value !== undefined)),
             this.yProperty$.pipe(filter((value) => value !== undefined)),
             this.aggregation$,
-        ]).pipe(switchMap$1(([dataset, xProp, yProp, aggregation]) => {
+        ]).pipe(filter(([_, x, y]) => !!x || !!y), switchMap$1(([dataset, xProp, yProp, aggregation]) => {
             const fieldAgg = aggregation === 'count' ? ['count'] : [aggregation, yProp];
             return dataset
                 .groupBy(['distinct', xProp])
@@ -37731,6 +38019,36 @@ class ChartViewComponent {
                 this.loading = false;
             });
         }), map$1(getJsonDataItemsProxy), startWith([]), shareReplay(1));
+        this.prettyLabel$ = combineLatest([
+            this.aggregation$,
+            this.properties$,
+            this.yProperty$,
+        ]).pipe(map$1(([aggregation, properties, yProperty]) => {
+            if (aggregation === 'count')
+                return 'count()';
+            const prop = properties.find((p) => p.name === yProperty);
+            return prop ? `${aggregation}(${prop.label})` : '';
+        }));
+    }
+    setProperties(dataset, catalog) {
+        return dataset.properties
+            .then((properties) => {
+            return properties.map((p) => {
+                if (catalog) {
+                    const featureAttributes = catalog?.featureTypes[0]?.attributes ?? [];
+                    const matchingAttribute = featureAttributes.find((attr) => attr.name === p.label);
+                    if (matchingAttribute?.code) {
+                        return { ...p, label: matchingAttribute.code };
+                    }
+                    return p;
+                }
+                return p;
+            });
+        })
+            .catch((error) => {
+            this.handleError(error);
+            return [];
+        });
     }
     handleError(error) {
         if (error instanceof FetchError) {
@@ -37751,7 +38069,7 @@ class ChartViewComponent {
         this.changeDetector.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ChartViewComponent, deps: [{ 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: ChartViewComponent, isStandalone: true, selector: "gn-ui-chart-view", inputs: { cacheActive: "cacheActive", link: "link", aggregation: "aggregation", xProperty: "xProperty", yProperty: "yProperty", chartType: "chartType" }, outputs: { chartConfig$: "chartConfig$" }, ngImport: i0, template: "<div class=\"w-full h-full flex flex-col\">\n  <div\n    class=\"flex flex-col space-y-2 sm:flex-row sm:space-y-0 sm:space-x-2 justify-between text-[13px]\"\n  >\n    <gn-ui-dropdown-selector\n      class=\"basis-1/4\"\n      [choices]=\"typeChoices\"\n      [extraBtnClass]=\"'secondary min-w-full'\"\n      (selectValue)=\"chartType$.next($event)\"\n      [selected]=\"chartType$.value\"\n      [title]=\"'chart.dropdown.type' | translate\"\n    ></gn-ui-dropdown-selector>\n    <gn-ui-dropdown-selector\n      class=\"basis-1/4\"\n      [choices]=\"xChoices$ | async\"\n      [extraBtnClass]=\"'secondary min-w-full'\"\n      (selectValue)=\"xProperty$.next($event)\"\n      [selected]=\"xProperty$.value\"\n      [title]=\"'chart.dropdown.xProperty' | translate\"\n    ></gn-ui-dropdown-selector>\n    <gn-ui-dropdown-selector\n      class=\"basis-1/4\"\n      *ngIf=\"!isCountAggregation\"\n      [choices]=\"yChoices$ | async\"\n      (selectValue)=\"yProperty$.next($event)\"\n      [selected]=\"yProperty$.value\"\n      [title]=\"'chart.dropdown.yProperty' | translate\"\n      class=\"select-y-prop\"\n    ></gn-ui-dropdown-selector>\n    <gn-ui-dropdown-selector\n      class=\"basis-1/4\"\n      [choices]=\"aggregationChoices\"\n      class=\"aggregation-choices\"\n      (selectValue)=\"aggregation$.next($event)\"\n      [selected]=\"aggregation$.value\"\n      [title]=\"'chart.dropdown.aggregation' | translate\"\n    ></gn-ui-dropdown-selector>\n  </div>\n  <div\n    class=\"relative h-full mt-2 bg-white border border-gray-300 rounded-lg overflow-hidden\"\n  >\n    <gn-ui-chart\n      *ngIf=\"!error\"\n      [data]=\"chartData$ | async\"\n      [type]=\"chartType$.value\"\n      [labelProperty]=\"labelProperty\"\n      [valueProperty]=\"valueProperty\"\n    ></gn-ui-chart>\n    <gn-ui-loading-mask\n      *ngIf=\"loading\"\n      class=\"absolute inset-0\"\n      [message]=\"'chart.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>{{ error }}</span>\n    </gn-ui-popup-alert>\n  </div>\n</div>\n", styles: [""], 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: DropdownSelectorComponent, selector: "gn-ui-dropdown-selector", inputs: ["title", "showTitle", "ariaName", "choices", "selected", "maxRows", "extraBtnClass", "minWidth", "disabled"], outputs: ["selectValue"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "component", type: ChartComponent, selector: "gn-ui-chart", inputs: ["data", "labelProperty", "valueProperty", "secondaryValueProperty", "type"] }, { kind: "component", type: LoadingMaskComponent, selector: "gn-ui-loading-mask", inputs: ["message"] }, { kind: "component", type: PopupAlertComponent, selector: "gn-ui-popup-alert", inputs: ["icon", "type", "position"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ChartViewComponent, isStandalone: true, selector: "gn-ui-chart-view", inputs: { featureCatalog: "featureCatalog", cacheActive: "cacheActive", link: "link", aggregation: "aggregation", xProperty: "xProperty", yProperty: "yProperty", chartType: "chartType" }, outputs: { chartConfig$: "chartConfig$" }, ngImport: i0, template: "<div class=\"w-full h-full flex flex-col\">\n  <div\n    class=\"flex flex-col space-y-2 sm:flex-row sm:space-y-0 sm:space-x-2 justify-between text-[13px]\"\n  >\n    <gn-ui-dropdown-selector\n      class=\"basis-1/4\"\n      [choices]=\"typeChoices\"\n      [extraBtnClass]=\"'secondary min-w-full'\"\n      (selectValue)=\"chartType$.next($event)\"\n      [selected]=\"chartType$.value\"\n      [title]=\"'chart.dropdown.type' | translate\"\n    ></gn-ui-dropdown-selector>\n    <gn-ui-dropdown-selector\n      class=\"basis-1/4\"\n      [choices]=\"xChoices$ | async\"\n      [extraBtnClass]=\"'secondary min-w-full'\"\n      (selectValue)=\"xProperty$.next($event)\"\n      [selected]=\"xProperty$.value\"\n      [title]=\"'chart.dropdown.xProperty' | translate\"\n    ></gn-ui-dropdown-selector>\n    <ng-container *ngIf=\"yChoices$ | async as yChoices\">\n      <gn-ui-dropdown-selector\n        class=\"basis-1/4\"\n        *ngIf=\"!isCountAggregation\"\n        [choices]=\"yChoices\"\n        (selectValue)=\"yProperty$.next($event)\"\n        [selected]=\"yProperty$.value\"\n        [title]=\"'chart.dropdown.yProperty' | translate\"\n        class=\"select-y-prop\"\n      ></gn-ui-dropdown-selector>\n    </ng-container>\n    <gn-ui-dropdown-selector\n      class=\"basis-1/4\"\n      [choices]=\"aggregationChoices\"\n      class=\"aggregation-choices\"\n      (selectValue)=\"aggregation$.next($event)\"\n      [selected]=\"aggregation$.value\"\n      [title]=\"'chart.dropdown.aggregation' | translate\"\n    ></gn-ui-dropdown-selector>\n  </div>\n  <div\n    class=\"relative h-full mt-2 bg-white border border-gray-300 rounded-lg overflow-hidden\"\n  >\n    <gn-ui-chart\n      *ngIf=\"!error\"\n      [data]=\"chartData$ | async\"\n      [type]=\"chartType$.value\"\n      [prettyLabel]=\"prettyLabel$ | async\"\n      [labelProperty]=\"labelProperty\"\n      [valueProperty]=\"valueProperty\"\n    ></gn-ui-chart>\n    <gn-ui-loading-mask\n      *ngIf=\"loading\"\n      class=\"absolute inset-0\"\n      [message]=\"'chart.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>{{ error }}</span>\n    </gn-ui-popup-alert>\n  </div>\n</div>\n", styles: [""], 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: DropdownSelectorComponent, selector: "gn-ui-dropdown-selector", inputs: ["title", "showTitle", "ariaName", "choices", "selected", "maxRows", "extraBtnClass", "minWidth", "disabled"], outputs: ["selectValue"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "component", type: ChartComponent, selector: "gn-ui-chart", inputs: ["data", "labelProperty", "prettyLabel", "valueProperty", "secondaryValueProperty", "type"] }, { kind: "component", type: LoadingMaskComponent, selector: "gn-ui-loading-mask", inputs: ["message"] }, { kind: "component", type: PopupAlertComponent, selector: "gn-ui-popup-alert", inputs: ["icon", "type", "position"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ChartViewComponent, decorators: [{
             type: Component,
@@ -37762,8 +38080,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         ChartComponent,
                         LoadingMaskComponent,
                         PopupAlertComponent,
-                    ], standalone: true, template: "<div class=\"w-full h-full flex flex-col\">\n  <div\n    class=\"flex flex-col space-y-2 sm:flex-row sm:space-y-0 sm:space-x-2 justify-between text-[13px]\"\n  >\n    <gn-ui-dropdown-selector\n      class=\"basis-1/4\"\n      [choices]=\"typeChoices\"\n      [extraBtnClass]=\"'secondary min-w-full'\"\n      (selectValue)=\"chartType$.next($event)\"\n      [selected]=\"chartType$.value\"\n      [title]=\"'chart.dropdown.type' | translate\"\n    ></gn-ui-dropdown-selector>\n    <gn-ui-dropdown-selector\n      class=\"basis-1/4\"\n      [choices]=\"xChoices$ | async\"\n      [extraBtnClass]=\"'secondary min-w-full'\"\n      (selectValue)=\"xProperty$.next($event)\"\n      [selected]=\"xProperty$.value\"\n      [title]=\"'chart.dropdown.xProperty' | translate\"\n    ></gn-ui-dropdown-selector>\n    <gn-ui-dropdown-selector\n      class=\"basis-1/4\"\n      *ngIf=\"!isCountAggregation\"\n      [choices]=\"yChoices$ | async\"\n      (selectValue)=\"yProperty$.next($event)\"\n      [selected]=\"yProperty$.value\"\n      [title]=\"'chart.dropdown.yProperty' | translate\"\n      class=\"select-y-prop\"\n    ></gn-ui-dropdown-selector>\n    <gn-ui-dropdown-selector\n      class=\"basis-1/4\"\n      [choices]=\"aggregationChoices\"\n      class=\"aggregation-choices\"\n      (selectValue)=\"aggregation$.next($event)\"\n      [selected]=\"aggregation$.value\"\n      [title]=\"'chart.dropdown.aggregation' | translate\"\n    ></gn-ui-dropdown-selector>\n  </div>\n  <div\n    class=\"relative h-full mt-2 bg-white border border-gray-300 rounded-lg overflow-hidden\"\n  >\n    <gn-ui-chart\n      *ngIf=\"!error\"\n      [data]=\"chartData$ | async\"\n      [type]=\"chartType$.value\"\n      [labelProperty]=\"labelProperty\"\n      [valueProperty]=\"valueProperty\"\n    ></gn-ui-chart>\n    <gn-ui-loading-mask\n      *ngIf=\"loading\"\n      class=\"absolute inset-0\"\n      [message]=\"'chart.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>{{ error }}</span>\n    </gn-ui-popup-alert>\n  </div>\n</div>\n" }]
-        }], ctorParameters: () => [{ type: DataService }, { type: i0.ChangeDetectorRef }, { type: i1$1.TranslateService }], propDecorators: { cacheActive: [{
+                    ], standalone: true, template: "<div class=\"w-full h-full flex flex-col\">\n  <div\n    class=\"flex flex-col space-y-2 sm:flex-row sm:space-y-0 sm:space-x-2 justify-between text-[13px]\"\n  >\n    <gn-ui-dropdown-selector\n      class=\"basis-1/4\"\n      [choices]=\"typeChoices\"\n      [extraBtnClass]=\"'secondary min-w-full'\"\n      (selectValue)=\"chartType$.next($event)\"\n      [selected]=\"chartType$.value\"\n      [title]=\"'chart.dropdown.type' | translate\"\n    ></gn-ui-dropdown-selector>\n    <gn-ui-dropdown-selector\n      class=\"basis-1/4\"\n      [choices]=\"xChoices$ | async\"\n      [extraBtnClass]=\"'secondary min-w-full'\"\n      (selectValue)=\"xProperty$.next($event)\"\n      [selected]=\"xProperty$.value\"\n      [title]=\"'chart.dropdown.xProperty' | translate\"\n    ></gn-ui-dropdown-selector>\n    <ng-container *ngIf=\"yChoices$ | async as yChoices\">\n      <gn-ui-dropdown-selector\n        class=\"basis-1/4\"\n        *ngIf=\"!isCountAggregation\"\n        [choices]=\"yChoices\"\n        (selectValue)=\"yProperty$.next($event)\"\n        [selected]=\"yProperty$.value\"\n        [title]=\"'chart.dropdown.yProperty' | translate\"\n        class=\"select-y-prop\"\n      ></gn-ui-dropdown-selector>\n    </ng-container>\n    <gn-ui-dropdown-selector\n      class=\"basis-1/4\"\n      [choices]=\"aggregationChoices\"\n      class=\"aggregation-choices\"\n      (selectValue)=\"aggregation$.next($event)\"\n      [selected]=\"aggregation$.value\"\n      [title]=\"'chart.dropdown.aggregation' | translate\"\n    ></gn-ui-dropdown-selector>\n  </div>\n  <div\n    class=\"relative h-full mt-2 bg-white border border-gray-300 rounded-lg overflow-hidden\"\n  >\n    <gn-ui-chart\n      *ngIf=\"!error\"\n      [data]=\"chartData$ | async\"\n      [type]=\"chartType$.value\"\n      [prettyLabel]=\"prettyLabel$ | async\"\n      [labelProperty]=\"labelProperty\"\n      [valueProperty]=\"valueProperty\"\n    ></gn-ui-chart>\n    <gn-ui-loading-mask\n      *ngIf=\"loading\"\n      class=\"absolute inset-0\"\n      [message]=\"'chart.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>{{ error }}</span>\n    </gn-ui-popup-alert>\n  </div>\n</div>\n" }]
+        }], ctorParameters: () => [{ type: DataService }, { type: i0.ChangeDetectorRef }, { type: i1$1.TranslateService }], propDecorators: { featureCatalog: [{
+                type: Input
+            }], cacheActive: [{
                 type: Input
             }], link: [{
                 type: Input
@@ -37916,7 +38236,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"] }, { kind: "component", type: DataTableComponent, selector: "gn-ui-data-table", inputs: ["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", "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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GeoTableViewComponent, decorators: [{
             type: Component,
@@ -37938,6 +38258,7 @@ class TableViewComponent {
     constructor(dataService, translateService) {
         this.dataService = dataService;
         this.translateService = translateService;
+        this.featureAttributes = [];
         this.cacheActive = true;
         this.currentLink$ = new BehaviorSubject(null);
         this.loading = false;
@@ -37951,7 +38272,7 @@ class TableViewComponent {
                 return of([]);
             }
             this.loading = true;
-            return this.getDatasetReader(link).pipe(catchError((error) => {
+            return this.getDatasetReader(link).pipe(tap$1((dataset) => this.setProperties(dataset)), catchError((error) => {
                 this.handleError(error);
                 return of(undefined);
             }), finalize(() => {
@@ -37982,8 +38303,24 @@ class TableViewComponent {
         }
         this.loading = false;
     }
+    setProperties(dataset) {
+        dataset.properties.then((properties) => {
+            const updatedProperties = properties.map((p) => {
+                let label = p.name;
+                if (this.featureCatalog) {
+                    const attributes = this.featureCatalog.featureTypes[0].attributes;
+                    const matchingAttribute = attributes.find((attr) => attr.name === p.name);
+                    if (matchingAttribute && matchingAttribute.code) {
+                        label = matchingAttribute.code;
+                    }
+                }
+                return { value: p.name, label };
+            });
+            this.featureAttributes = updatedProperties;
+        });
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableViewComponent, deps: [{ token: DataService }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TableViewComponent, isStandalone: true, selector: "gn-ui-table-view", inputs: { cacheActive: "cacheActive", link: "link" }, ngImport: i0, template: "<div class=\"w-full h-full flex flex-col\">\n  <div class=\"relative h-full\">\n    <gn-ui-data-table\n      *ngIf=\"tableData$ | async as dataset\"\n      class=\"overflow-auto grow\"\n      [dataset]=\"dataset\"\n      (selected)=\"onTableSelect($event)\"\n    ></gn-ui-data-table>\n    <gn-ui-loading-mask\n      *ngIf=\"loading\"\n      class=\"absolute inset-0\"\n      [message]=\"'table.loading.data' | translate\"\n    ></gn-ui-loading-mask>\n    <ng-content *ngIf=\"error\">\n      <div class=\"border border-gray-300 rounded-lg bg-white h-full\"></div>\n      <gn-ui-popup-alert\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    </ng-content>\n  </div>\n</div>\n", styles: [""], 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: DataTableComponent, selector: "gn-ui-data-table", inputs: ["dataset", "activeId"], outputs: ["selected"] }, { kind: "component", type: LoadingMaskComponent, selector: "gn-ui-loading-mask", inputs: ["message"] }, { kind: "component", type: PopupAlertComponent, selector: "gn-ui-popup-alert", inputs: ["icon", "type", "position"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TableViewComponent, isStandalone: true, selector: "gn-ui-table-view", inputs: { featureCatalog: "featureCatalog", cacheActive: "cacheActive", link: "link" }, ngImport: i0, template: "<div class=\"w-full h-full flex flex-col\">\n  <div class=\"relative h-full\">\n    <gn-ui-data-table\n      *ngIf=\"tableData$ | async as dataset\"\n      class=\"overflow-auto grow\"\n      [dataset]=\"dataset\"\n      [featureAttributes]=\"featureAttributes\"\n      (selected)=\"onTableSelect($event)\"\n    ></gn-ui-data-table>\n    <gn-ui-loading-mask\n      *ngIf=\"loading\"\n      class=\"absolute inset-0\"\n      [message]=\"'table.loading.data' | translate\"\n    ></gn-ui-loading-mask>\n    <ng-content *ngIf=\"error\">\n      <div class=\"border border-gray-300 rounded-lg bg-white h-full\"></div>\n      <gn-ui-popup-alert\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    </ng-content>\n  </div>\n</div>\n", styles: [""], 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: DataTableComponent, selector: "gn-ui-data-table", inputs: ["featureAttributes", "dataset", "activeId"], outputs: ["selected"] }, { kind: "component", type: LoadingMaskComponent, selector: "gn-ui-loading-mask", inputs: ["message"] }, { kind: "component", type: PopupAlertComponent, selector: "gn-ui-popup-alert", inputs: ["icon", "type", "position"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableViewComponent, decorators: [{
             type: Component,
@@ -37993,8 +38330,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         LoadingMaskComponent,
                         PopupAlertComponent,
                         TranslateModule,
-                    ], standalone: true, template: "<div class=\"w-full h-full flex flex-col\">\n  <div class=\"relative h-full\">\n    <gn-ui-data-table\n      *ngIf=\"tableData$ | async as dataset\"\n      class=\"overflow-auto grow\"\n      [dataset]=\"dataset\"\n      (selected)=\"onTableSelect($event)\"\n    ></gn-ui-data-table>\n    <gn-ui-loading-mask\n      *ngIf=\"loading\"\n      class=\"absolute inset-0\"\n      [message]=\"'table.loading.data' | translate\"\n    ></gn-ui-loading-mask>\n    <ng-content *ngIf=\"error\">\n      <div class=\"border border-gray-300 rounded-lg bg-white h-full\"></div>\n      <gn-ui-popup-alert\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    </ng-content>\n  </div>\n</div>\n" }]
-        }], ctorParameters: () => [{ type: DataService }, { type: i1$1.TranslateService }], propDecorators: { cacheActive: [{
+                    ], standalone: true, template: "<div class=\"w-full h-full flex flex-col\">\n  <div class=\"relative h-full\">\n    <gn-ui-data-table\n      *ngIf=\"tableData$ | async as dataset\"\n      class=\"overflow-auto grow\"\n      [dataset]=\"dataset\"\n      [featureAttributes]=\"featureAttributes\"\n      (selected)=\"onTableSelect($event)\"\n    ></gn-ui-data-table>\n    <gn-ui-loading-mask\n      *ngIf=\"loading\"\n      class=\"absolute inset-0\"\n      [message]=\"'table.loading.data' | translate\"\n    ></gn-ui-loading-mask>\n    <ng-content *ngIf=\"error\">\n      <div class=\"border border-gray-300 rounded-lg bg-white h-full\"></div>\n      <gn-ui-popup-alert\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    </ng-content>\n  </div>\n</div>\n" }]
+        }], ctorParameters: () => [{ type: DataService }, { type: i1$1.TranslateService }], propDecorators: { featureCatalog: [{
+                type: Input
+            }], cacheActive: [{
                 type: Input
             }], link: [{
                 type: Input
@@ -38027,17 +38366,9 @@ class MdViewFacade {
         this.error$ = this.store.pipe(select(getMetadataError));
         this.related$ = this.store.pipe(select(getRelated));
         this.chartConfig$ = this.store.pipe(select(getChartConfig));
-        this.allLinks$ = this.metadata$.pipe(map$1((record) => ('onlineResources' in record ? record.onlineResources : [])));
-        this.apiLinks$ = this.allLinks$.pipe(map$1((links) => links
-            .filter((link) => this.linkClassifier.hasUsage(link, LinkUsage.API))
-            // Put links to IGN Géoplateforme first
-            .sort((dd1, dd2) => {
-            return dd2
-                .accessServiceProtocol === 'GPFDL'
-                ? 1
-                : undefined; // do not change the sorting otherwise
-        })));
-        this.mapApiLinks$ = this.allLinks$.pipe(map$1((links) => links.filter((link) => this.linkClassifier.hasUsage(link, LinkUsage.MAP_API))));
+        this.allLinks$ = this.metadata$.pipe(map$1((record) => 'onlineResources' in record ? record.onlineResources : []), shareReplay(1));
+        this.apiLinks$ = this.allLinks$.pipe(map$1((links) => links.filter((link) => this.linkClassifier.hasUsage(link, LinkUsage.API))), shareReplay(1));
+        this.mapApiLinks$ = this.allLinks$.pipe(map$1((links) => links.filter((link) => this.linkClassifier.hasUsage(link, LinkUsage.MAP_API))), shareReplay(1));
         this.downloadLinks$ = this.allLinks$.pipe(map$1((links) => links.filter((link) => this.linkClassifier.hasUsage(link, LinkUsage.DOWNLOAD))));
         this.dataLinks$ = this.allLinks$.pipe(map$1((links) => links.filter((link) => this.linkClassifier.hasUsage(link, LinkUsage.DATA))));
         this.geoDataLinks$ = this.allLinks$.pipe(map$1((links) => links.filter((link) => this.linkClassifier.hasUsage(link, LinkUsage.GEODATA))));
@@ -38096,6 +38427,12 @@ class MdViewFacade {
     loadUserFeedbacks(datasetUuid) {
         this.store.dispatch(loadUserFeedbacks({ datasetUuid }));
     }
+    /**
+     * loadFeatureCatalog
+     */
+    loadFeatureCatalog(metadata) {
+        this.store.dispatch(loadFeatureCatalog({ metadata }));
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MdViewFacade, deps: [{ token: i1$3.Store }, { token: LinkClassifierService }, { token: AvatarServiceInterface }, { token: DataService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MdViewFacade }); }
 }
@@ -38749,7 +39086,7 @@ class DataViewComponent {
             .subscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DataViewComponent, deps: [{ token: MdViewFacade }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: DataViewComponent, isStandalone: true, selector: "gn-ui-data-view", inputs: { mode: "mode", displaySource: "displaySource", exceedsLimit: "exceedsLimit" }, outputs: { chartConfig$: "chartConfig$" }, ngImport: i0, template: "<div class=\"w-full h-full flex flex-col gap-[13px]\">\n  <div\n    class=\"w-full py-4 px-5 bg-white border border-color-border rounded-lg mt-6\"\n  >\n    <gn-ui-dropdown-selector\n      *ngIf=\"dropdownChoices$ | async as choices\"\n      [ngClass]=\"{ hidden: !displaySource }\"\n      [title]=\"'table.select.data' | translate\"\n      class=\"h-[44px] w-full\"\n      extraBtnClass=\"font-sans font-bold\"\n      [choices]=\"choices\"\n      (selectValue)=\"selectLink($event)\"\n    ></gn-ui-dropdown-selector>\n  </div>\n  <ng-container *ngIf=\"hidePreview; else dataView\">\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 #dataView>\n    <div class=\"relative h-[460px]\">\n      <gn-ui-table-view\n        *ngIf=\"mode === 'table'\"\n        [cacheActive]=\"cacheActive$ | async\"\n        [link]=\"selectedLink$ | async\"\n      ></gn-ui-table-view>\n      <gn-ui-chart-view\n        *ngIf=\"mode === 'chart'\"\n        (chartConfig$)=\"setChartConfig($event)\"\n        [cacheActive]=\"cacheActive$ | async\"\n        [link]=\"selectedLink$ | async\"\n      ></gn-ui-chart-view>\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: TableViewComponent, selector: "gn-ui-table-view", inputs: ["cacheActive", "link"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: ChartViewComponent, selector: "gn-ui-chart-view", inputs: ["cacheActive", "link", "aggregation", "xProperty", "yProperty", "chartType"], outputs: ["chartConfig$"] }, { kind: "component", type: PopupAlertComponent, selector: "gn-ui-popup-alert", inputs: ["icon", "type", "position"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: DataViewComponent, isStandalone: true, selector: "gn-ui-data-view", inputs: { mode: "mode", displaySource: "displaySource", exceedsLimit: "exceedsLimit" }, outputs: { chartConfig$: "chartConfig$" }, ngImport: i0, template: "<div class=\"w-full h-full flex flex-col gap-[13px]\">\n  <div\n    class=\"w-full py-4 px-5 bg-white border border-color-border rounded-lg mt-6\"\n  >\n    <gn-ui-dropdown-selector\n      *ngIf=\"dropdownChoices$ | async as choices\"\n      [ngClass]=\"{ hidden: !displaySource }\"\n      [title]=\"'table.select.data' | translate\"\n      class=\"h-[44px] w-full\"\n      extraBtnClass=\"font-sans font-bold\"\n      [choices]=\"choices\"\n      (selectValue)=\"selectLink($event)\"\n    ></gn-ui-dropdown-selector>\n  </div>\n  <ng-container *ngIf=\"hidePreview; else dataView\">\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 #dataView>\n    <div class=\"relative h-[460px]\">\n      <gn-ui-table-view\n        *ngIf=\"mode === 'table'\"\n        [cacheActive]=\"cacheActive$ | async\"\n        [link]=\"selectedLink$ | async\"\n        [featureCatalog]=\"mdViewFacade.featureCatalog$ | async\"\n      ></gn-ui-table-view>\n      <gn-ui-chart-view\n        *ngIf=\"mode === 'chart'\"\n        (chartConfig$)=\"setChartConfig($event)\"\n        [cacheActive]=\"cacheActive$ | async\"\n        [link]=\"selectedLink$ | async\"\n        [featureCatalog]=\"mdViewFacade.featureCatalog$ | async\"\n      ></gn-ui-chart-view>\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: TableViewComponent, selector: "gn-ui-table-view", inputs: ["featureCatalog", "cacheActive", "link"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: ChartViewComponent, selector: "gn-ui-chart-view", inputs: ["featureCatalog", "cacheActive", "link", "aggregation", "xProperty", "yProperty", "chartType"], outputs: ["chartConfig$"] }, { kind: "component", type: PopupAlertComponent, selector: "gn-ui-popup-alert", inputs: ["icon", "type", "position"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DataViewComponent, decorators: [{
             type: Component,
@@ -38760,7 +39097,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         TranslateModule,
                         ChartViewComponent,
                         PopupAlertComponent,
-                    ], template: "<div class=\"w-full h-full flex flex-col gap-[13px]\">\n  <div\n    class=\"w-full py-4 px-5 bg-white border border-color-border rounded-lg mt-6\"\n  >\n    <gn-ui-dropdown-selector\n      *ngIf=\"dropdownChoices$ | async as choices\"\n      [ngClass]=\"{ hidden: !displaySource }\"\n      [title]=\"'table.select.data' | translate\"\n      class=\"h-[44px] w-full\"\n      extraBtnClass=\"font-sans font-bold\"\n      [choices]=\"choices\"\n      (selectValue)=\"selectLink($event)\"\n    ></gn-ui-dropdown-selector>\n  </div>\n  <ng-container *ngIf=\"hidePreview; else dataView\">\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 #dataView>\n    <div class=\"relative h-[460px]\">\n      <gn-ui-table-view\n        *ngIf=\"mode === 'table'\"\n        [cacheActive]=\"cacheActive$ | async\"\n        [link]=\"selectedLink$ | async\"\n      ></gn-ui-table-view>\n      <gn-ui-chart-view\n        *ngIf=\"mode === 'chart'\"\n        (chartConfig$)=\"setChartConfig($event)\"\n        [cacheActive]=\"cacheActive$ | async\"\n        [link]=\"selectedLink$ | async\"\n      ></gn-ui-chart-view>\n    </div>\n  </ng-template>\n</div>\n" }]
+                    ], template: "<div class=\"w-full h-full flex flex-col gap-[13px]\">\n  <div\n    class=\"w-full py-4 px-5 bg-white border border-color-border rounded-lg mt-6\"\n  >\n    <gn-ui-dropdown-selector\n      *ngIf=\"dropdownChoices$ | async as choices\"\n      [ngClass]=\"{ hidden: !displaySource }\"\n      [title]=\"'table.select.data' | translate\"\n      class=\"h-[44px] w-full\"\n      extraBtnClass=\"font-sans font-bold\"\n      [choices]=\"choices\"\n      (selectValue)=\"selectLink($event)\"\n    ></gn-ui-dropdown-selector>\n  </div>\n  <ng-container *ngIf=\"hidePreview; else dataView\">\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 #dataView>\n    <div class=\"relative h-[460px]\">\n      <gn-ui-table-view\n        *ngIf=\"mode === 'table'\"\n        [cacheActive]=\"cacheActive$ | async\"\n        [link]=\"selectedLink$ | async\"\n        [featureCatalog]=\"mdViewFacade.featureCatalog$ | async\"\n      ></gn-ui-table-view>\n      <gn-ui-chart-view\n        *ngIf=\"mode === 'chart'\"\n        (chartConfig$)=\"setChartConfig($event)\"\n        [cacheActive]=\"cacheActive$ | async\"\n        [link]=\"selectedLink$ | async\"\n        [featureCatalog]=\"mdViewFacade.featureCatalog$ | async\"\n      ></gn-ui-chart-view>\n    </div>\n  </ng-template>\n</div>\n" }]
         }], ctorParameters: () => [{ type: MdViewFacade }], propDecorators: { mode: [{
                 type: Input
             }], displaySource: [{
@@ -38961,9 +39298,17 @@ class MapViewComponent {
         this.compatibleMapLinks$ = combineLatest([
             this.mdViewFacade.mapApiLinks$,
             this.mdViewFacade.geoDataLinksWithGeometry$,
-        ]).pipe(map$1(([mapApiLinks, geoDataLinksWithGeometry]) => {
-            return [...mapApiLinks, ...geoDataLinksWithGeometry];
-        }));
+        ]).pipe(switchMap$1(async ([mapApiLinks, geoDataLinksWithGeometry]) => {
+            // looking for TMS links to process
+            let processedMapApiLinks = await Promise.all(mapApiLinks.map((link) => {
+                if (link.type === 'service' && link.accessServiceProtocol === 'tms') {
+                    return this.dataService.getGeodataLinksFromTms(link);
+                }
+                return link;
+            }));
+            processedMapApiLinks = processedMapApiLinks.flat();
+            return [...processedMapApiLinks, ...geoDataLinksWithGeometry];
+        }), shareReplay(1));
         this.dropdownChoices$ = this.compatibleMapLinks$.pipe(map$1((links) => links.length
             ? links.map((link, index) => ({
                 label: getLinkLabel(link),
@@ -39055,6 +39400,24 @@ class MapViewComponent {
                 name: link.name,
             });
         }
+        else if (link.type === 'service' &&
+            link.accessServiceProtocol === 'tms') {
+            // FIXME: here we're assuming that the TMS serves vector tiles only; should be checked with ogc-client first
+            return of({
+                url: link.url.toString().replace(/\/?$/, '/{z}/{x}/{y}.pbf'),
+                type: 'xyz',
+                tileFormat: 'application/vnd.mapbox-vector-tile',
+                name: link.name,
+            });
+        }
+        else if (link.type === 'service' &&
+            link.accessServiceProtocol === 'maplibre-style') {
+            return of({
+                type: 'maplibre-style',
+                name: link.name,
+                styleUrl: link.url.toString(),
+            });
+        }
         else if (link.type === 'service' &&
             link.accessServiceProtocol === 'wmts') {
             return of({
@@ -39098,7 +39461,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", displaySource: "displaySource" }, 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 py-4 px-5 bg-white border border-color-border rounded-lg mt-6\"\n  >\n    <div class=\"grow min-w-0\">\n      <gn-ui-dropdown-selector\n        [ngClass]=\"{ hidden: !displaySource }\"\n        class=\"w-full\"\n        extraBtnClass=\"font-sans font-bold\"\n        [title]=\"'map.select.layer' | translate\"\n        [choices]=\"dropdownChoices$ | async\"\n        (selectValue)=\"selectLinkToDisplay($event)\"\n      ></gn-ui-dropdown-selector>\n    </div>\n    <div class=\"self-end\">\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 [feature]=\"selection\"></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\">Legend</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        Legend\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"] }, { kind: "component", type: PopupAlertComponent, selector: "gn-ui-popup-alert", inputs: ["icon", "type", "position"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { 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 })], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    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", displaySource: "displaySource" }, 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 py-4 px-5 bg-white border border-color-border rounded-lg mt-6\"\n  >\n    <div class=\"grow min-w-0\">\n      <gn-ui-dropdown-selector\n        [ngClass]=\"{ hidden: !displaySource }\"\n        class=\"w-full\"\n        extraBtnClass=\"font-sans font-bold\"\n        [title]=\"'map.select.layer' | translate\"\n        [choices]=\"dropdownChoices$ | async\"\n        (selectValue)=\"selectLinkToDisplay($event)\"\n      ></gn-ui-dropdown-selector>\n    </div>\n    <div class=\"self-end\">\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\">Legend</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        Legend\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: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { 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 })], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MapViewComponent, decorators: [{
             type: Component,
@@ -39114,7 +39477,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         ExternalViewerButtonComponent,
                         ButtonComponent,
                         MapLegendComponent,
-                    ], viewProviders: [provideIcons({ matClose })], template: "<div class=\"w-full h-full flex flex-col gap-[13px]\">\n  <div\n    class=\"flex py-4 px-5 bg-white border border-color-border rounded-lg mt-6\"\n  >\n    <div class=\"grow min-w-0\">\n      <gn-ui-dropdown-selector\n        [ngClass]=\"{ hidden: !displaySource }\"\n        class=\"w-full\"\n        extraBtnClass=\"font-sans font-bold\"\n        [title]=\"'map.select.layer' | translate\"\n        [choices]=\"dropdownChoices$ | async\"\n        (selectValue)=\"selectLinkToDisplay($event)\"\n      ></gn-ui-dropdown-selector>\n    </div>\n    <div class=\"self-end\">\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 [feature]=\"selection\"></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\">Legend</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        Legend\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" }]
+                    ], viewProviders: [provideIcons({ matClose })], template: "<div class=\"w-full h-full flex flex-col gap-[13px]\">\n  <div\n    class=\"flex py-4 px-5 bg-white border border-color-border rounded-lg mt-6\"\n  >\n    <div class=\"grow min-w-0\">\n      <gn-ui-dropdown-selector\n        [ngClass]=\"{ hidden: !displaySource }\"\n        class=\"w-full\"\n        extraBtnClass=\"font-sans font-bold\"\n        [title]=\"'map.select.layer' | translate\"\n        [choices]=\"dropdownChoices$ | async\"\n        (selectValue)=\"selectLinkToDisplay($event)\"\n      ></gn-ui-dropdown-selector>\n    </div>\n    <div class=\"self-end\">\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\">Legend</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        Legend\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
             }], displaySource: [{
@@ -42769,5 +43132,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, 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, 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, DO_NOT_USE_DEFAULT_BASEMAP, DataService, DataTableComponent, DataViewComponent, DataViewPermalinkComponent, DataViewShareComponent, DataViewWebComponentComponent, DatePickerComponent, DateRangeDropdownComponent, 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, ExternalViewerButtonComponent, FIELDS_BRIEF, FIELDS_SUMMARY, FILTER_GEOMETRY, FILTER_SUMMARY_IGNORE_LIST, FORMATS, FacetBlockComponent, FacetBlockStubComponent, FacetItemComponent, FacetItemStubComponent, FacetListComponent, FacetsContainerComponent, FacetsModule, FavoriteStarComponent, FavoritesService, FeatureAuthModule, FeatureCatalogModule, FeatureDetailComponent, FeatureEditorModule, FeatureMapModule, FeatureNotificationsModule, FeatureRecordModule, FeatureSearchModule, FetchError, FieldsService, FigureComponent, FigureContainerComponent, FileInputComponent, FileTranslateLoader, FilesDropDirective, FilterDropdownComponent, FormFieldArrayComponent, FormFieldComponent, FormFieldDateComponent, FormFieldFileComponent, FormFieldKeywordsComponent, FormFieldLicenseComponent, FormFieldObjectComponent, FormFieldRichComponent, FormFieldSimpleComponent, FormFieldSpatialExtentComponent, FormFieldTemporalExtentsComponent, FormFieldWrapperComponent, FullTextSearchField, FuzzySearchComponent, GEONETWORK_UI_TAG_NAME, GEONETWORK_UI_VERSION, GeoTableViewComponent, GeocodingComponent, GeojsonReader, Gn4Converter, Gn4PlatformMapper, Gn4PlatformService, Gn4Repository, Gn4SettingsService, 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, LANG_3_TO_2_MAPPER, LOGIN_URL, LOGOUT_URL, LONLAT_CRS_CODES, LangService, LanguageSwitcherComponent, LayersPanelComponent, LicenseSearchField, LinkCardComponent, LinkClassifierService, LinkUsage, LoadingMaskComponent, LogService, MAP_FEATURE_KEY, MAP_VIEW_CONSTRAINTS, METADATA_LANGUAGE, MY_FORMATS, MapContainerComponent, MapFacade, MapLegendComponent, MapStateContainerComponent, MapStyleService, MapUtilsService, MapViewComponent, MarkdownEditorComponent, MarkdownParserComponent, MaxLinesComponent, mdview_actions as MdViewActions, MdViewFacade, MetadataCatalogComponent, MetadataContactComponent, MetadataInfoComponent, MetadataLinkType, MetadataMapperContext, MetadataQualityComponent, MetadataQualityItemComponent, 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, OwnerSearchField, PAGINATE, PARSE_DELIMITER, PATCH_RESULTS_AGGREGATIONS, PROXY_PATH, Paginate, PaginationButtonsComponent, PaginationComponent, PaginationDotsComponent, PatchResultsAggregations, 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, RelatedRecordCardComponent, 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, 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, StarToggleComponent, StickyHeaderComponent, SupportedTypes, SwitchToggleComponent, THUMBNAIL_PLACEHOLDER, TRANSLATE_DEFAULT_CONFIG, TRANSLATE_WITH_OVERRIDES_CONFIG, TableViewComponent, TextAreaComponent, TextInputComponent, ThemeService, ThumbnailComponent, TranslatedSearchField, TruncatedTextComponent, UPDATE_CONFIG_AGGREGATIONS, UPDATE_FILTERS, UPDATE_REQUEST_AGGREGATION_TERM, UiDatavizModule, UiElementsModule, FacetsModule$1 as UiFacetsModule, UiInputsModule, UiLayoutModule, UiSearchModule, UiWidgetsModule, UpdateConfigAggregations, UpdateFilters, UrlInputComponent, UserFeedbackItemComponent, UserPreviewComponent, UserSearchField, UtilI18nModule, UtilSharedModule, VECTOR_STYLE_DEFAULT, ViewportIntersectorComponent, WEB_COMPONENT_EMBEDDER_URL, WizardComponent, WizardFieldComponent, WizardFieldType, WizardService, WizardSummarizeComponent, 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, getArrayItem, getAsArray, getAsUrl, getBadgeColor, getCustomTranslations, getError, getFavoritesOnly, getFileFormat, getFileFormatFromServiceOutput, getFirstValue, getFormatPriority, getGeometryFromGeoJSON, getGlobalConfig, getJsonDataItemsProxy, getLangFromBrowser, getLayers, getLinkLabel, getLinkPriority, getMapContext, getMapContextLayerFromConfig, getMapState, getMetadataQualityConfig, getMimeTypeForFormat, getNamespace, getOptionalMapConfig, getOptionalSearchConfig, getPageSize, getResourceType, getReuseType, getRootElement, getSearchConfigAggregations, getSearchFilters, getSearchResults, getSearchResultsAggregations, getSearchResultsHits, getSearchResultsLayout, getSearchResultsLoading, getSearchSortBy, getSearchState, getSearchStateSearch, getSelectedFeatures, getSpatialFilterEnabled, getTemporalRangeUnion, getThemeConfig, 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, parse, parseXmlString, placeholder, prioritizePageScroll, propagateToDocumentOnly, provideGn4, 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, totalPages, undoRecordDraft, unrecognizedKeysConfigFixture, updateRecordField, wmsLayerFlatten, writeAttribute, wrongLanguageCodeConfigFixture, xmlToString };
+export { ADD_RESULTS, ADD_SEARCH, AbstractAction, AbstractSearchField, 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, 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, DO_NOT_USE_DEFAULT_BASEMAP, DataService, DataTableComponent, DataViewComponent, DataViewPermalinkComponent, DataViewShareComponent, DataViewWebComponentComponent, DatePickerComponent, DateRangeDropdownComponent, 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, ExternalViewerButtonComponent, FIELDS_BRIEF, FIELDS_SUMMARY, FILTER_GEOMETRY, FILTER_SUMMARY_IGNORE_LIST, FORMATS, FacetBlockComponent, FacetBlockStubComponent, FacetItemComponent, FacetItemStubComponent, FacetListComponent, FacetsContainerComponent, FacetsModule, FavoriteStarComponent, FavoritesService, FeatureAuthModule, FeatureCatalogListComponent, FeatureCatalogModule, FeatureDetailComponent, FeatureEditorModule, FeatureMapModule, FeatureNotificationsModule, FeatureRecordModule, FeatureSearchModule, FetchError, FieldsService, FigureComponent, FigureContainerComponent, FileInputComponent, FileTranslateLoader, FilesDropDirective, FilterDropdownComponent, FormFieldArrayComponent, FormFieldComponent, FormFieldDateComponent, FormFieldFileComponent, FormFieldKeywordsComponent, FormFieldLicenseComponent, FormFieldObjectComponent, FormFieldRichComponent, FormFieldSimpleComponent, FormFieldSpatialExtentComponent, FormFieldTemporalExtentsComponent, FormFieldWrapperComponent, FullTextSearchField, FuzzySearchComponent, GEONETWORK_UI_TAG_NAME, GEONETWORK_UI_VERSION, GeoTableViewComponent, GeocodingComponent, GeojsonReader, Gn4Converter, Gn4PlatformMapper, Gn4PlatformService, Gn4Repository, Gn4SettingsService, 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, LANG_3_TO_2_MAPPER, LOGIN_URL, LOGOUT_URL, LONLAT_CRS_CODES, LangService, LanguageSwitcherComponent, LayersPanelComponent, LicenseSearchField, LinkCardComponent, LinkClassifierService, LinkUsage, LoadingMaskComponent, LogService, MAP_FEATURE_KEY, MAP_VIEW_CONSTRAINTS, METADATA_LANGUAGE, MY_FORMATS, MapContainerComponent, MapFacade, MapLegendComponent, MapStateContainerComponent, MapStyleService, MapUtilsService, MapViewComponent, MarkdownEditorComponent, MarkdownParserComponent, MaxLinesComponent, mdview_actions as MdViewActions, MdViewFacade, MetadataCatalogComponent, MetadataContactComponent, MetadataInfoComponent, MetadataLinkType, MetadataMapperContext, MetadataQualityComponent, MetadataQualityItemComponent, 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, OwnerSearchField, PAGINATE, PARSE_DELIMITER, PATCH_RESULTS_AGGREGATIONS, PROXY_PATH, Paginate, PaginationButtonsComponent, PaginationComponent, PaginationDotsComponent, PatchResultsAggregations, 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, RelatedRecordCardComponent, 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, StarToggleComponent, StickyHeaderComponent, SupportedTypes, SwitchToggleComponent, THUMBNAIL_PLACEHOLDER, TRANSLATE_DEFAULT_CONFIG, TRANSLATE_WITH_OVERRIDES_CONFIG, TableViewComponent, TextAreaComponent, TextInputComponent, ThemeService, ThumbnailComponent, TranslatedSearchField, TruncatedTextComponent, UPDATE_CONFIG_AGGREGATIONS, UPDATE_FILTERS, UPDATE_REQUEST_AGGREGATION_TERM, UiDatavizModule, UiElementsModule, FacetsModule$1 as UiFacetsModule, UiInputsModule, UiLayoutModule, UiSearchModule, UiWidgetsModule, UpdateConfigAggregations, UpdateFilters, UrlInputComponent, UserFeedbackItemComponent, UserPreviewComponent, UserSearchField, UtilI18nModule, UtilSharedModule, VECTOR_STYLE_DEFAULT, ViewportIntersectorComponent, WEB_COMPONENT_EMBEDDER_URL, WizardComponent, WizardFieldComponent, WizardFieldType, WizardService, WizardSummarizeComponent, 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, getArrayItem, getAsArray, getAsUrl, getBadgeColor, getCustomTranslations, getError, getFavoritesOnly, getFileFormat, getFileFormatFromServiceOutput, getFirstValue, getFormatPriority, getGeometryFromGeoJSON, getGlobalConfig, getJsonDataItemsProxy, getLangFromBrowser, getLayers, getLinkLabel, getLinkPriority, getMapContext, getMapContextLayerFromConfig, getMapState, getMetadataQualityConfig, getMimeTypeForFormat, getNamespace, getOptionalMapConfig, getOptionalSearchConfig, getPageSize, getResourceType, getReuseType, getRootElement, getSearchConfigAggregations, getSearchFilters, getSearchResults, getSearchResultsAggregations, getSearchResultsHits, getSearchResultsLayout, getSearchResultsLoading, getSearchSortBy, getSearchState, getSearchStateSearch, getSelectedFeatures, getSpatialFilterEnabled, getTemporalRangeUnion, getThemeConfig, 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, parse, parseXmlString, placeholder, prioritizePageScroll, propagateToDocumentOnly, provideGn4, 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, totalPages, undoRecordDraft, unrecognizedKeysConfigFixture, updateRecordField, wmsLayerFlatten, writeAttribute, wrongLanguageCodeConfigFixture, xmlToString };
 //# sourceMappingURL=geonetwork-ui.mjs.map