geonetwork-ui 2.10.0-dev.88fb568d7 → 2.10.0-dev.89f0dfe6f

package/fesm2022/geonetwork-ui.mjs

@@ -7,7 +7,7 @@ import { marker } from '@biesbjerg/ngx-translate-extract-marker';
 import { format } from 'date-fns/format';
 import { Namespace, Literal, lit, parse as parse$2, sym, BlankNode, graph } from 'rdflib';
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, Injectable, NgModule, Injector, APP_INITIALIZER, makeEnvironmentProviders, ElementRef, HostListener, Input, Directive, Renderer2, DestroyRef, EventEmitter, Output, ViewChild, ChangeDetectionStrategy, Component, ViewEncapsulation, ChangeDetectorRef, HostBinding, ViewContainerRef, TemplateRef, ViewChildren, ContentChild, ContentChildren, NgZone, ComponentFactoryResolver } from '@angular/core';
+import { InjectionToken, inject, Injectable, NgModule, Injector, APP_INITIALIZER, makeEnvironmentProviders, ElementRef, HostListener, Input, Directive, Renderer2, DestroyRef, EventEmitter, Output, ViewChild, ChangeDetectionStrategy, Component, ViewEncapsulation, ChangeDetectorRef, HostBinding, ViewContainerRef, TemplateRef, ViewChildren, ContentChild, ContentChildren, NgZone, ComponentFactoryResolver, afterNextRender, viewChildren } from '@angular/core';
 import { HttpClient, HttpHeaders, HttpParams, HTTP_INTERCEPTORS, provideHttpClient, withInterceptorsFromDi, HttpEventType } from '@angular/common/http';
 import * as i4 from '@ngx-translate/core';
 import { TranslateLoader, TranslateCompiler, TranslateDefaultParser, TranslateParser, TranslateService, provideTranslateService, TranslateDirective, TranslatePipe, TranslateModule } from '@ngx-translate/core';
@@ -18,7 +18,7 @@ import { of, map as map$2, lastValueFrom, fromEvent, startWith, shareReplay, fil
 import { lt, valid, coerce, satisfies, ltr } from 'semver';
 import chroma from 'chroma-js';
 import * as i1$1 from '@angular/common';
-import { Location, CommonModule, NgClass, NgTemplateOutlet, DatePipe } from '@angular/common';
+import { Location, CommonModule, NgClass, NgTemplateOutlet, DatePipe, AsyncPipe } from '@angular/common';
 import { formatDistance } from 'date-fns/formatDistance';
 import { Scroll, NavigationEnd, Router, RouteReuseStrategy } from '@angular/router';
 import { WmtsEndpoint, WmsEndpoint, WfsEndpoint, OgcApiEndpoint, sharedFetch, useCache, StacEndpoint, TmsEndpoint } from '@camptocamp/ogc-client';
@@ -31,7 +31,7 @@ import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { FeaturesClickEventType, FeaturesHoverEventType, MapClickEventType, MapExtentChangeEventType, SourceLoadErrorType, computeMapContextDiff, createViewFromLayer } from '@geospatial-sdk/core';
 import { createMapFromContext, applyContextDiffToMap, listen } from '@geospatial-sdk/openlayers';
 import { NgIconComponent, provideIcons, provideNgIconsConfig, NgIcon } from '@ng-icons/core';
-import { matSwipeOutline, matErrorOutlineOutline, matComputerOutline, matLocationSearchingOutline, matLocationOnOutline, matCallOutline, matMailOutline as matMailOutline$1, matInfoOutline, matCloseOutline, matWarningAmberOutline, matSendOutline, matHomeWorkOutline, matCloudDownloadOutline, matMapOutline, matAddCircleOutlineOutline, matLayersOutline, matDeleteOutline, matMoreHorizOutline } from '@ng-icons/material-icons/outline';
+import { matSwipeOutline, matErrorOutlineOutline, matComputerOutline, matLocationSearchingOutline, matLocationOnOutline, matCallOutline, matInfoOutline, matMailOutline as matMailOutline$1, matCloseOutline, matWarningAmberOutline, matSendOutline, matHomeWorkOutline, matCloudDownloadOutline, matMapOutline, matAddCircleOutlineOutline, matLayersOutline, matDeleteOutline, matMoreHorizOutline } from '@ng-icons/material-icons/outline';
 import { transformExtent } from 'ol/proj.js';
 import { createLegendFromLayer } from '@geospatial-sdk/legend';
 import { mouseOnly, noModifierKeys, primaryAction, platformModifierKeyOnly } from 'ol/events/condition.js';
@@ -97,7 +97,7 @@ import { tablerFolderOpen } from '@ng-icons/tabler-icons';
 import * as i3$1 from '@angular/material/radio';
 import { MatRadioModule } from '@angular/material/radio';
 import { MatIconModule } from '@angular/material/icon';
-import * as i3$2 from '@angular/cdk/text-field';
+import * as i4$1 from '@angular/cdk/text-field';
 import { TextFieldModule } from '@angular/cdk/text-field';
 import * as i2$5 from '@ngrx/router-store';
 import { getRouterSelectors, routerReducer, StoreRouterConnectingModule, FullRouterStateSerializer } from '@ngrx/router-store';
@@ -1467,6 +1467,25 @@ function readOverviews(rootEl) {
 function readLineage$1(rootEl, translations) {
     return pipe(findNestedElement('gmd:dataQualityInfo', 'gmd:DQ_DataQuality', 'gmd:lineage', 'gmd:LI_Lineage', 'gmd:statement'), extractLocalizedCharacterString('lineage', translations), map(([lineage]) => lineage))(rootEl);
 }
+function extractSourceRecords(liLineageEl) {
+    if (!liLineageEl)
+        return [];
+    return pipe(findChildrenElement('gmd:source', false), mapArray((el) => {
+        const uuid = readAttribute('uuidref')(el);
+        const title = readAttribute('xlink:title')(el);
+        const href = readAttribute('xlink:href')(el);
+        if (!uuid && !title && !href)
+            return null;
+        return {
+            ...(uuid ? { uuid } : {}),
+            ...(title ? { title } : {}),
+            ...(href ? { href } : {}),
+        };
+    }), filterArray((s) => s !== null))(liLineageEl);
+}
+function readSourceRecords$1(rootEl) {
+    return extractSourceRecords(pipe(findNestedElement('gmd:dataQualityInfo', 'gmd:DQ_DataQuality', 'gmd:lineage', 'gmd:LI_Lineage'))(rootEl));
+}
 function readUpdateFrequency(rootEl) {
     return pipe(findIdentification(), findNestedElement('gmd:resourceMaintenance', 'gmd:MD_MaintenanceInformation'), extractUpdateFrequency(), map((updateFrequency) => updateFrequency || 'unknown'))(rootEl);
 }
@@ -1999,6 +2018,14 @@ function writeGraphicOverviews(record, rootEl) {
 function writeLineage$1(record, rootEl) {
     pipe(findNestedChildOrCreate('gmd:dataQualityInfo', 'gmd:DQ_DataQuality', 'gmd:lineage', 'gmd:LI_Lineage', 'gmd:statement'), writeLocalizedCharacterString(record.lineage, record.translations?.lineage, record.defaultLanguage))(rootEl);
 }
+function appendSourceRecords(sources) {
+    return pipe(removeChildrenByName('gmd:source'), appendChildren(...sources
+        .filter((source) => source.uuid || source.title || source.href)
+        .map((source) => pipe(createElement('gmd:source'), source.uuid ? writeAttribute('uuidref', source.uuid) : noop, source.title ? writeAttribute('xlink:title', source.title) : noop, source.href ? writeAttribute('xlink:href', source.href) : noop))));
+}
+function writeSourceRecords$1(record, rootEl) {
+    pipe(findNestedChildOrCreate('gmd:dataQualityInfo', 'gmd:DQ_DataQuality', 'gmd:lineage', 'gmd:LI_Lineage'), appendSourceRecords(record.sourceRecords))(rootEl);
+}
 function getServiceEndpointProtocol(endpoint) {
     switch (endpoint.accessServiceProtocol.toLowerCase()) {
         case 'wfs':
@@ -2125,6 +2152,7 @@ class Iso19139Converter extends BaseConverter {
             spatialRepresentation: readSpatialRepresentation,
             overviews: readOverviews,
             lineage: readLineage$1,
+            sourceRecords: readSourceRecords$1,
             onlineResources: readOnlineResources$2,
             temporalExtents: readTemporalExtents,
             spatialExtents: readSpatialExtents$1,
@@ -2162,6 +2190,7 @@ class Iso19139Converter extends BaseConverter {
             spatialRepresentation: writeSpatialRepresentation$1,
             overviews: writeGraphicOverviews,
             lineage: writeLineage$1,
+            sourceRecords: writeSourceRecords$1,
             onlineResources: writeOnlineResources$1,
             temporalExtents: writeTemporalExtents,
             spatialExtents: writeSpatialExtents,
@@ -2285,12 +2314,14 @@ class Iso19139Converter extends BaseConverter {
             const spatialRepresentation = this.readers['spatialRepresentation'](rootEl, tr);
             const temporalExtents = this.readers['temporalExtents'](rootEl, tr);
             const lineage = this.readers['lineage'](rootEl, tr);
+            const sourceRecords = this.readers['sourceRecords'](rootEl, tr);
             const updateFrequency = this.readers['updateFrequency'](rootEl, tr);
             return this.afterRecordRead({
                 ...this.readBaseRecord(rootEl, tr),
                 kind,
                 status,
                 lineage,
+                ...(sourceRecords && { sourceRecords }),
                 ...(spatialRepresentation && { spatialRepresentation }),
                 temporalExtents,
                 updateFrequency,
@@ -2299,12 +2330,14 @@ class Iso19139Converter extends BaseConverter {
         }
         else if (kind === 'reuse') {
             const lineage = this.readers['lineage'](rootEl, tr);
+            const sourceRecords = this.readers['sourceRecords'](rootEl, tr);
             const temporalExtents = this.readers['temporalExtents'](rootEl, tr);
             const reuseType = this.readers['reuseType'](rootEl, tr);
             return this.afterRecordRead({
                 ...this.readBaseRecord(rootEl, tr),
                 kind,
                 lineage,
+                ...(sourceRecords && { sourceRecords }),
                 temporalExtents,
                 reuseType,
             });
@@ -2390,6 +2423,8 @@ class Iso19139Converter extends BaseConverter {
                 this.writers['spatialExtents'](record, rootEl);
             (fieldChanged('lineage') || fieldChanged('translations')) &&
                 this.writers['lineage'](record, rootEl);
+            fieldChanged('sourceRecords') &&
+                this.writers['sourceRecords'](record, rootEl);
         }
         fieldChanged('otherLanguages') &&
             this.writers['otherLanguages'](record, rootEl);
@@ -2496,6 +2531,9 @@ function readLandingPage$1(rootEl) {
 function readLineage(rootEl, translations) {
     return pipe(findNestedElement('mdb:resourceLineage', 'mrl:LI_Lineage', 'mrl:statement'), extractLocalizedCharacterString('lineage', translations), map(([lineage]) => lineage))(rootEl);
 }
+function readSourceRecords(rootEl) {
+    return extractSourceRecords(pipe(findNestedElement('mdb:resourceLineage', 'mrl:LI_Lineage'))(rootEl));
+}
 function extractDateInfo(type) {
     return pipe(findChildrenElement('mdb:dateInfo', false), filterArray((el) => pipe(findChildElement('cit:CI_DateTypeCode'), readAttribute('codeListValue'))(el) === type), getAtIndex(0), findChildElement('cit:date'), extractDateTime());
 }
@@ -2680,6 +2718,9 @@ function writeOtherLanguages(record, rootEl) {
     }
     appendChildren(...record.otherLanguages.map((lang) => pipe(createElement('mdb:otherLocale'), writeLocaleElement(lang))))(rootEl);
 }
+function writeSourceRecords(record, rootEl) {
+    pipe(findNestedChildOrCreate('mdb:resourceLineage', 'mrl:LI_Lineage'), appendSourceRecords(record.sourceRecords))(rootEl);
+}
 
 class Iso191153Converter extends Iso19139Converter {
     constructor() {
@@ -2694,6 +2735,7 @@ class Iso191153Converter extends Iso19139Converter {
         this.readers['ownerOrganization'] = readOwnerOrganization$1;
         this.readers['landingPage'] = readLandingPage$1;
         this.readers['lineage'] = readLineage;
+        this.readers['sourceRecords'] = readSourceRecords;
         this.readers['onlineResources'] = readOnlineResources$1;
         this.readers['defaultLanguage'] = readDefaultLanguage$1;
         this.readers['otherLanguages'] = readOtherLanguages;
@@ -2712,6 +2754,7 @@ class Iso191153Converter extends Iso19139Converter {
         this.writers['ownerOrganization'] = () => undefined; // fixme: find a way to store this value properly
         this.writers['landingPage'] = writeLandingPage;
         this.writers['lineage'] = writeLineage;
+        this.writers['sourceRecords'] = writeSourceRecords;
         this.writers['onlineResources'] = writeOnlineResources;
         this.writers['status'] = writeStatus;
         this.writers['spatialRepresentation'] = writeSpatialRepresentation;
@@ -2794,6 +2837,8 @@ class Iso191153Converter extends Iso19139Converter {
             'gmd:MD_BrowseGraphic': 'mcc:MD_BrowseGraphic',
             'gmd:fileName': 'mcc:fileName',
             'gmd:fileDescription': 'mcc:fileDescription',
+            // lineage sources
+            'gmd:source': 'mrl:source',
             // no more URL elements
             'gmd:URL': 'gco:CharacterString',
         });
@@ -3344,6 +3389,7 @@ class DcatApConverter extends BaseConverter {
             updateFrequency: () => 'unknown',
             overviews: () => [],
             lineage: () => '',
+            sourceRecords: () => [],
             temporalExtents: () => [],
             spatialRepresentation: () => undefined,
             extras: () => undefined,
@@ -3377,6 +3423,7 @@ class DcatApConverter extends BaseConverter {
             spatialRepresentation: () => undefined,
             overviews: () => undefined,
             lineage: () => undefined,
+            sourceRecords: () => [],
             onlineResources: () => undefined,
             temporalExtents: () => undefined,
             spatialExtents: () => undefined,
@@ -3422,6 +3469,7 @@ class DcatApConverter extends BaseConverter {
             const spatialExtents = this.readers['spatialExtents'](dataStore, catalogRecord, tr, defaultLanguage);
             const temporalExtents = this.readers['temporalExtents'](dataStore, catalogRecord, tr, defaultLanguage);
             const lineage = this.readers['lineage'](dataStore, catalogRecord, tr, defaultLanguage);
+            const sourceRecords = this.readers['sourceRecords'](dataStore, catalogRecord, tr, defaultLanguage);
             const onlineResources = this.readers['onlineResources'](dataStore, catalogRecord, tr, defaultLanguage);
             const updateFrequency = this.readers['updateFrequency'](dataStore, catalogRecord, tr, defaultLanguage);
             return {
@@ -3448,6 +3496,7 @@ class DcatApConverter extends BaseConverter {
                 securityConstraints,
                 otherConstraints,
                 lineage,
+                sourceRecords,
                 ...(spatialRepresentation && { spatialRepresentation }),
                 overviews,
                 spatialExtents,
@@ -18737,6 +18786,14 @@ var de = {
 	"editor.record.form.draft.updateAlert": "Seit der Erstellung dieses Entwurfs wurde dieser Datensatz am { date } von { user } geändert. Durch das Veröffentlichen Ihrer Version können dessen Änderungen gelöscht werden. Um dies zu vermeiden, können Sie Ihre Änderungen rückgängig machen oder Ihre Version in voller Kenntnis der Sachlage veröffentlichen.",
 	"editor.record.form.field.abstract": "Kurzbeschreibung",
 	"editor.record.form.field.constraintsShortcuts": "",
+	"editor.record.form.field.contactDetails.email": "",
+	"editor.record.form.field.contactDetails.email.placeholder": "",
+	"editor.record.form.field.contactDetails.firstName": "",
+	"editor.record.form.field.contactDetails.firstName.placeholder": "",
+	"editor.record.form.field.contactDetails.lastName": "",
+	"editor.record.form.field.contactDetails.lastName.placeholder": "",
+	"editor.record.form.field.contactDetails.organization": "",
+	"editor.record.form.field.contactDetails.organization.placeholder": "",
 	"editor.record.form.field.contacts": "Ansprechpartner - Email",
 	"editor.record.form.field.contacts.noContact": "Bitte geben Sie mindestens einen Ansprechpartner an.",
 	"editor.record.form.field.contacts.placeholder": "Kontakt auswählen",
@@ -18746,6 +18803,7 @@ var de = {
 	"editor.record.form.field.legalConstraints": "Rechtliche Einschränkung",
 	"editor.record.form.field.license": "Lizenz",
 	"editor.record.form.field.onlineLinkResources": "Beigefügte Ressourcen",
+	"editor.record.form.field.onlineLinkageResource.defaultName": "Link",
 	"editor.record.form.field.onlineResource.cancel": "Abbrechen",
 	"editor.record.form.field.onlineResource.confirm": "Bestätigen",
 	"editor.record.form.field.onlineResource.dialogTitle": "Vorschau des Datensatzes bearbeiten",
@@ -19081,7 +19139,6 @@ var de = {
 	"record.metadata.preview.config.idle": "Standardvorschau festlegen",
 	"record.metadata.preview.config.saved": "Gespeichert!",
 	"record.metadata.preview.config.saving": "Speichern...",
-	"record.metadata.producer": "Datenproduzent",
 	"record.metadata.publication": "Veröffentlichungsdatum",
 	"record.metadata.publications": "{count, plural, =0{Veröffentlichungsdatum} one{Veröffentlichungsdatum} other{Veröffentlichungen}}",
 	"record.metadata.quality": "Metadatenqualität",
@@ -19107,6 +19164,7 @@ var de = {
 	"record.metadata.quality.updateFrequency.failed": "Aktualisierungsfrequenz nicht angegeben",
 	"record.metadata.quality.updateFrequency.success": "Aktualisierungsfrequenz angegeben",
 	"record.metadata.related": "Entdecken Sie den Katalog",
+	"record.metadata.resource.contacts": "Kontakte zur Ressource",
 	"record.metadata.resourceCreated": "Erstellt",
 	"record.metadata.resourcePublished": "Veröffentlicht",
 	"record.metadata.resourceUpdated": "Zuletzt aktualisiert",
@@ -19411,6 +19469,14 @@ var en = {
 	"editor.record.form.draft.updateAlert": "Since you created this draft, the dataset has been updated on { date } by { user }. Publishing your draft might erase their edits. To avoid this, you need to either cancel your changes or knowingly publish your own version.",
 	"editor.record.form.field.abstract": "Abstract",
 	"editor.record.form.field.constraintsShortcuts": "",
+	"editor.record.form.field.contactDetails.email": "Contact email",
+	"editor.record.form.field.contactDetails.email.placeholder": "example@domainname.com",
+	"editor.record.form.field.contactDetails.firstName": "Contact first name",
+	"editor.record.form.field.contactDetails.firstName.placeholder": "First name",
+	"editor.record.form.field.contactDetails.lastName": "Contact last name",
+	"editor.record.form.field.contactDetails.lastName.placeholder": "Last name",
+	"editor.record.form.field.contactDetails.organization": "Contact organization",
+	"editor.record.form.field.contactDetails.organization.placeholder": "Company",
 	"editor.record.form.field.contacts": "Point of contact - Email",
 	"editor.record.form.field.contacts.noContact": "Please provide at least one point of contact.",
 	"editor.record.form.field.contacts.placeholder": "Choose a contact",
@@ -19420,6 +19486,7 @@ var en = {
 	"editor.record.form.field.legalConstraints": "Legal constraint",
 	"editor.record.form.field.license": "License",
 	"editor.record.form.field.onlineLinkResources": "Attached resources",
+	"editor.record.form.field.onlineLinkageResource.defaultName": "Link",
 	"editor.record.form.field.onlineResource.cancel": "Cancel",
 	"editor.record.form.field.onlineResource.confirm": "Confirm",
 	"editor.record.form.field.onlineResource.dialogTitle": "Modify the dataset preview",
@@ -19755,7 +19822,6 @@ var en = {
 	"record.metadata.preview.config.idle": "Set as default preview",
 	"record.metadata.preview.config.saved": "Saved !",
 	"record.metadata.preview.config.saving": "Saving...",
-	"record.metadata.producer": "Data producer",
 	"record.metadata.publication": "Date of publication",
 	"record.metadata.publications": "{count, plural, =0{publication} one{publication} other{publications}}",
 	"record.metadata.quality": "Metadata Quality",
@@ -19781,6 +19847,7 @@ var en = {
 	"record.metadata.quality.updateFrequency.failed": "Update frequency is not specified",
 	"record.metadata.quality.updateFrequency.success": "Update frequency is specified",
 	"record.metadata.related": "Explore the catalog",
+	"record.metadata.resource.contacts": "Contacts for the resource",
 	"record.metadata.resourceCreated": "Created",
 	"record.metadata.resourcePublished": "Published",
 	"record.metadata.resourceUpdated": "Last updated",
@@ -20085,6 +20152,14 @@ var es = {
 	"editor.record.form.draft.updateAlert": "",
 	"editor.record.form.field.abstract": "",
 	"editor.record.form.field.constraintsShortcuts": "",
+	"editor.record.form.field.contactDetails.email": "",
+	"editor.record.form.field.contactDetails.email.placeholder": "",
+	"editor.record.form.field.contactDetails.firstName": "",
+	"editor.record.form.field.contactDetails.firstName.placeholder": "",
+	"editor.record.form.field.contactDetails.lastName": "",
+	"editor.record.form.field.contactDetails.lastName.placeholder": "",
+	"editor.record.form.field.contactDetails.organization": "",
+	"editor.record.form.field.contactDetails.organization.placeholder": "",
 	"editor.record.form.field.contacts": "Punto de contacto - Correo ",
 	"editor.record.form.field.contacts.noContact": "",
 	"editor.record.form.field.contacts.placeholder": "",
@@ -20094,6 +20169,7 @@ var es = {
 	"editor.record.form.field.legalConstraints": "",
 	"editor.record.form.field.license": "",
 	"editor.record.form.field.onlineLinkResources": "",
+	"editor.record.form.field.onlineLinkageResource.defaultName": "",
 	"editor.record.form.field.onlineResource.cancel": "",
 	"editor.record.form.field.onlineResource.confirm": "",
 	"editor.record.form.field.onlineResource.dialogTitle": "",
@@ -20429,7 +20505,6 @@ var es = {
 	"record.metadata.preview.config.idle": "",
 	"record.metadata.preview.config.saved": "",
 	"record.metadata.preview.config.saving": "",
-	"record.metadata.producer": "",
 	"record.metadata.publication": "",
 	"record.metadata.publications": "{count, plural, =0{} one{} other{}}",
 	"record.metadata.quality": "",
@@ -20455,6 +20530,7 @@ var es = {
 	"record.metadata.quality.updateFrequency.failed": "",
 	"record.metadata.quality.updateFrequency.success": "",
 	"record.metadata.related": "",
+	"record.metadata.resource.contacts": "",
 	"record.metadata.resourceCreated": "",
 	"record.metadata.resourcePublished": "",
 	"record.metadata.resourceUpdated": "",
@@ -20759,6 +20835,14 @@ var fr = {
 	"editor.record.form.draft.updateAlert": "Depuis la création de ce brouillon, ce jeu de données a été modifié le { date } par { user }. Publier votre version peut supprimer ses modifications. Pour éviter cela, vous pouvez annuler vos changements, ou publier votre version en connaissance de cause.",
 	"editor.record.form.field.abstract": "Description",
 	"editor.record.form.field.constraintsShortcuts": "",
+	"editor.record.form.field.contactDetails.email": "Email du point de contact",
+	"editor.record.form.field.contactDetails.email.placeholder": "exemple@nomdedomaine.com",
+	"editor.record.form.field.contactDetails.firstName": "Prénom du point de contact",
+	"editor.record.form.field.contactDetails.firstName.placeholder": "Prénom",
+	"editor.record.form.field.contactDetails.lastName": "Nom du point de contact",
+	"editor.record.form.field.contactDetails.lastName.placeholder": "Nom",
+	"editor.record.form.field.contactDetails.organization": "Organisation du point de contact",
+	"editor.record.form.field.contactDetails.organization.placeholder": "Company",
 	"editor.record.form.field.contacts": "Point de contact - Email",
 	"editor.record.form.field.contacts.noContact": "Veuillez renseigner au moins un point de contact.",
 	"editor.record.form.field.contacts.placeholder": "Choisissez un contact",
@@ -20768,6 +20852,7 @@ var fr = {
 	"editor.record.form.field.legalConstraints": "Contrainte légale",
 	"editor.record.form.field.license": "Licence",
 	"editor.record.form.field.onlineLinkResources": "Ressources attachées",
+	"editor.record.form.field.onlineLinkageResource.defaultName": "Lien",
 	"editor.record.form.field.onlineResource.cancel": "Annuler",
 	"editor.record.form.field.onlineResource.confirm": "Valider",
 	"editor.record.form.field.onlineResource.dialogTitle": "Modifier l'aperçu du jeu de données",
@@ -21103,7 +21188,6 @@ var fr = {
 	"record.metadata.preview.config.idle": "Définir l'aperçu par défaut",
 	"record.metadata.preview.config.saved": "Sauvegardé !",
 	"record.metadata.preview.config.saving": "Sauvegarde...",
-	"record.metadata.producer": "Producteur de la donnée",
 	"record.metadata.publication": "Date de publication",
 	"record.metadata.publications": "{count, plural, =0{ressource} one{ressource} other{ressources}}",
 	"record.metadata.quality": "Description de la ressource",
@@ -21129,6 +21213,7 @@ var fr = {
 	"record.metadata.quality.updateFrequency.failed": "La fréquence de mise à jour n'est pas renseignée",
 	"record.metadata.quality.updateFrequency.success": "La fréquence de mise à jour est renseignée",
 	"record.metadata.related": "Explorez le catalogue",
+	"record.metadata.resource.contacts": "Contacts liés à la donnée",
 	"record.metadata.resourceCreated": "Créé",
 	"record.metadata.resourcePublished": "Publié",
 	"record.metadata.resourceUpdated": "Mis à jour",
@@ -21433,6 +21518,14 @@ var it = {
 	"editor.record.form.draft.updateAlert": "Da quando è stata creata questa bozza, questo dataset è stato modificato il { date } da { user }. La pubblicazione della sua versione potrebbe rimuovere le loro modifiche. Per evitarlo, puoi annullare le sue modifiche o pubblicare la sua versione consapevolmente.",
 	"editor.record.form.field.abstract": "Riassunto",
 	"editor.record.form.field.constraintsShortcuts": "",
+	"editor.record.form.field.contactDetails.email": "",
+	"editor.record.form.field.contactDetails.email.placeholder": "",
+	"editor.record.form.field.contactDetails.firstName": "",
+	"editor.record.form.field.contactDetails.firstName.placeholder": "",
+	"editor.record.form.field.contactDetails.lastName": "",
+	"editor.record.form.field.contactDetails.lastName.placeholder": "",
+	"editor.record.form.field.contactDetails.organization": "",
+	"editor.record.form.field.contactDetails.organization.placeholder": "",
 	"editor.record.form.field.contacts": "",
 	"editor.record.form.field.contacts.noContact": "Inserisci almeno un punto di contatto.",
 	"editor.record.form.field.contacts.placeholder": "Scegli un contatto",
@@ -21442,6 +21535,7 @@ var it = {
 	"editor.record.form.field.legalConstraints": "Vincolo legale",
 	"editor.record.form.field.license": "Licenza",
 	"editor.record.form.field.onlineLinkResources": "Risorse allegate",
+	"editor.record.form.field.onlineLinkageResource.defaultName": "Link",
 	"editor.record.form.field.onlineResource.cancel": "Annulla",
 	"editor.record.form.field.onlineResource.confirm": "Convalida",
 	"editor.record.form.field.onlineResource.dialogTitle": "Modifica anteprima dataset",
@@ -21777,7 +21871,6 @@ var it = {
 	"record.metadata.preview.config.idle": "",
 	"record.metadata.preview.config.saved": "",
 	"record.metadata.preview.config.saving": "",
-	"record.metadata.producer": "Produttore dei dati",
 	"record.metadata.publication": "Data di pubblicazione",
 	"record.metadata.publications": "{count, plural, =0{pubblicazione} one{pubblicazione} other{pubblicazioni}}",
 	"record.metadata.quality": "Qualità dei metadati",
@@ -21803,6 +21896,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.resource.contacts": "Contatti per la risorsa",
 	"record.metadata.resourceCreated": "Creato",
 	"record.metadata.resourcePublished": "Pubblicato",
 	"record.metadata.resourceUpdated": "Ultimo aggiornamento",
@@ -22107,6 +22201,14 @@ var nl = {
 	"editor.record.form.draft.updateAlert": "",
 	"editor.record.form.field.abstract": "",
 	"editor.record.form.field.constraintsShortcuts": "",
+	"editor.record.form.field.contactDetails.email": "",
+	"editor.record.form.field.contactDetails.email.placeholder": "",
+	"editor.record.form.field.contactDetails.firstName": "",
+	"editor.record.form.field.contactDetails.firstName.placeholder": "",
+	"editor.record.form.field.contactDetails.lastName": "",
+	"editor.record.form.field.contactDetails.lastName.placeholder": "",
+	"editor.record.form.field.contactDetails.organization": "",
+	"editor.record.form.field.contactDetails.organization.placeholder": "",
 	"editor.record.form.field.contacts": "",
 	"editor.record.form.field.contacts.noContact": "",
 	"editor.record.form.field.contacts.placeholder": "",
@@ -22116,6 +22218,7 @@ var nl = {
 	"editor.record.form.field.legalConstraints": "",
 	"editor.record.form.field.license": "",
 	"editor.record.form.field.onlineLinkResources": "",
+	"editor.record.form.field.onlineLinkageResource.defaultName": "",
 	"editor.record.form.field.onlineResource.cancel": "",
 	"editor.record.form.field.onlineResource.confirm": "",
 	"editor.record.form.field.onlineResource.dialogTitle": "",
@@ -22451,7 +22554,6 @@ var nl = {
 	"record.metadata.preview.config.idle": "",
 	"record.metadata.preview.config.saved": "",
 	"record.metadata.preview.config.saving": "",
-	"record.metadata.producer": "",
 	"record.metadata.publication": "",
 	"record.metadata.publications": "{count, plural, =0{} one{} other{}}",
 	"record.metadata.quality": "",
@@ -22477,6 +22579,7 @@ var nl = {
 	"record.metadata.quality.updateFrequency.failed": "",
 	"record.metadata.quality.updateFrequency.success": "",
 	"record.metadata.related": "",
+	"record.metadata.resource.contacts": "",
 	"record.metadata.resourceCreated": "",
 	"record.metadata.resourcePublished": "",
 	"record.metadata.resourceUpdated": "",
@@ -22781,6 +22884,14 @@ var pt = {
 	"editor.record.form.draft.updateAlert": "",
 	"editor.record.form.field.abstract": "",
 	"editor.record.form.field.constraintsShortcuts": "",
+	"editor.record.form.field.contactDetails.email": "",
+	"editor.record.form.field.contactDetails.email.placeholder": "",
+	"editor.record.form.field.contactDetails.firstName": "",
+	"editor.record.form.field.contactDetails.firstName.placeholder": "",
+	"editor.record.form.field.contactDetails.lastName": "",
+	"editor.record.form.field.contactDetails.lastName.placeholder": "",
+	"editor.record.form.field.contactDetails.organization": "",
+	"editor.record.form.field.contactDetails.organization.placeholder": "",
 	"editor.record.form.field.contacts": "",
 	"editor.record.form.field.contacts.noContact": "",
 	"editor.record.form.field.contacts.placeholder": "",
@@ -22790,6 +22901,7 @@ var pt = {
 	"editor.record.form.field.legalConstraints": "",
 	"editor.record.form.field.license": "",
 	"editor.record.form.field.onlineLinkResources": "",
+	"editor.record.form.field.onlineLinkageResource.defaultName": "",
 	"editor.record.form.field.onlineResource.cancel": "",
 	"editor.record.form.field.onlineResource.confirm": "",
 	"editor.record.form.field.onlineResource.dialogTitle": "",
@@ -23125,7 +23237,6 @@ var pt = {
 	"record.metadata.preview.config.idle": "",
 	"record.metadata.preview.config.saved": "",
 	"record.metadata.preview.config.saving": "",
-	"record.metadata.producer": "",
 	"record.metadata.publication": "",
 	"record.metadata.publications": "{count, plural, =0{} one{} other{}}",
 	"record.metadata.quality": "",
@@ -23151,6 +23262,7 @@ var pt = {
 	"record.metadata.quality.updateFrequency.failed": "",
 	"record.metadata.quality.updateFrequency.success": "",
 	"record.metadata.related": "",
+	"record.metadata.resource.contacts": "",
 	"record.metadata.resourceCreated": "",
 	"record.metadata.resourcePublished": "",
 	"record.metadata.resourceUpdated": "",
@@ -23455,6 +23567,14 @@ var sk = {
 	"editor.record.form.draft.updateAlert": "",
 	"editor.record.form.field.abstract": "",
 	"editor.record.form.field.constraintsShortcuts": "",
+	"editor.record.form.field.contactDetails.email": "",
+	"editor.record.form.field.contactDetails.email.placeholder": "",
+	"editor.record.form.field.contactDetails.firstName": "",
+	"editor.record.form.field.contactDetails.firstName.placeholder": "",
+	"editor.record.form.field.contactDetails.lastName": "",
+	"editor.record.form.field.contactDetails.lastName.placeholder": "",
+	"editor.record.form.field.contactDetails.organization": "",
+	"editor.record.form.field.contactDetails.organization.placeholder": "",
 	"editor.record.form.field.contacts": "",
 	"editor.record.form.field.contacts.noContact": "",
 	"editor.record.form.field.contacts.placeholder": "",
@@ -23464,6 +23584,7 @@ var sk = {
 	"editor.record.form.field.legalConstraints": "",
 	"editor.record.form.field.license": "Licencia",
 	"editor.record.form.field.onlineLinkResources": "",
+	"editor.record.form.field.onlineLinkageResource.defaultName": "",
 	"editor.record.form.field.onlineResource.cancel": "",
 	"editor.record.form.field.onlineResource.confirm": "",
 	"editor.record.form.field.onlineResource.dialogTitle": "",
@@ -23799,7 +23920,6 @@ var sk = {
 	"record.metadata.preview.config.idle": "",
 	"record.metadata.preview.config.saved": "",
 	"record.metadata.preview.config.saving": "",
-	"record.metadata.producer": "",
 	"record.metadata.publication": "dátum publikácia",
 	"record.metadata.publications": "{count, plural, =0{publikácia} one{publikácia} other{publikácie}}",
 	"record.metadata.quality": "Kvalita metadát",
@@ -23825,6 +23945,7 @@ var sk = {
 	"record.metadata.quality.updateFrequency.failed": "Frekvencia aktualizácie nie je určená",
 	"record.metadata.quality.updateFrequency.success": "Frekvencia aktualizácie je určená",
 	"record.metadata.related": "Súvisiace záznamy",
+	"record.metadata.resource.contacts": "Kontakty k zdroju",
 	"record.metadata.resourceCreated": "",
 	"record.metadata.resourcePublished": "",
 	"record.metadata.resourceUpdated": "",
@@ -24417,6 +24538,7 @@ class Gn4Converter extends BaseConverter {
             kind: 'dataset',
             status: null,
             lineage: null,
+            sourceRecords: [],
             recordUpdated: null,
             recordPublished: null,
             ownerOrganization: null,
@@ -25100,6 +25222,35 @@ function removeSearchParams(url, searchParams) {
     return urlObj.toString();
 }
 
+function getIndividualDisplayName(individual) {
+    const nameParts = [individual.firstName, individual.lastName]
+        .filter(Boolean)
+        .join(' ');
+    const orgPart = individual.organization?.name
+        ? ` (${individual.organization.name})`
+        : '';
+    if (nameParts)
+        return `${nameParts}${orgPart}`;
+    return individual.organization?.name ?? individual.email ?? '';
+}
+function getAddressLines(address) {
+    return address
+        ? address
+            .split(',')
+            .map((part) => part.trim())
+            .filter(Boolean)
+        : [];
+}
+function toIndividual(user) {
+    return {
+        firstName: user.name,
+        lastName: user.surname,
+        email: user.email,
+        role: 'unspecified',
+        organization: user.organisation ? { name: user.organisation } : undefined,
+    };
+}
+
 marker('downloads.wfs.featuretype.not.found');
 const FORMATS = {
     csv: {
@@ -25526,7 +25677,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
             }] } });
 
 var name = "geonetwork-ui";
-var version = "2.10.0-dev.88fb568d7";
+var version = "2.10.0-dev.89f0dfe6f";
 var engines = {
 	node: ">=20"
 };
@@ -25566,7 +25717,7 @@ var peerDependencies = {
 };
 var dependencies = {
 	"@biesbjerg/ngx-translate-extract-marker": "~1.0.0",
-	"@camptocamp/ogc-client": "1.3.1-dev.12086e8",
+	"@camptocamp/ogc-client": "1.3.1-dev.afd9c26",
 	"@geospatial-sdk/core": "0.0.5-dev.61",
 	"@geospatial-sdk/geocoding": "0.0.5-dev.61",
 	"@geospatial-sdk/legend": "0.0.5-dev.61",
@@ -25626,17 +25777,26 @@ const GEONETWORK_UI_TAG_NAME = GEONETWORK_UI_VERSION.split('-')[1]?.startsWith('
     : `v${packageJson.version}`;
 
 const ValidatorMapper = {
-    title: (record) => !!record?.title,
-    abstract: (record) => !!record?.abstract,
-    keywords: (record) => (record?.keywords?.length ?? 0) > 0,
-    legalConstraints: (record) => !!(record?.legalConstraints?.length &&
-        record.legalConstraints.some((c) => c?.text?.trim().length > 0)),
-    contacts: (record) => !!record?.contacts?.[0]?.email &&
-        record.contacts[0].email !== 'missing@missing.com',
-    updateFrequency: (record) => !!record?.updateFrequency && record.updateFrequency !== 'unknown',
-    topics: (record) => (record?.topics?.length ?? 0) > 0,
-    organisation: (record) => !!record?.contacts?.[0]?.organization?.name,
-    source: (record) => !!record?.extras?.sourcesIdentifiers,
+    title: { validator: (record) => !!record?.title },
+    abstract: { validator: (record) => !!record?.abstract },
+    keywords: { validator: (record) => (record?.keywords?.length ?? 0) > 0 },
+    legalConstraints: {
+        validator: (record) => !!(record?.legalConstraints?.length &&
+            record.legalConstraints.some((c) => c?.text?.trim().length > 0)),
+    },
+    contacts: {
+        validator: (record) => !!record?.contacts?.[0]?.email &&
+            record.contacts[0].email !== 'missing@missing.com',
+    },
+    updateFrequency: {
+        validator: (record) => !!record?.updateFrequency && record.updateFrequency !== 'unknown',
+    },
+    topics: { validator: (record) => (record?.topics?.length ?? 0) > 0 },
+    organisation: {
+        validator: (record) => !!record?.contacts?.[0]?.organization?.name,
+        alias: 'contacts',
+    },
+    source: { validator: (record) => !!record?.extras?.sourcesIdentifiers },
 };
 function getAllKeysValidator() {
     return Object.keys(ValidatorMapper);
@@ -25667,7 +25827,8 @@ function getQualityValidators(record, propsToValidate) {
     const filteredProps = propsToValidate.filter((prop) => getMappersFromKind(record.kind).includes(prop));
     return filteredProps.map((name) => ({
         name,
-        validator: () => ValidatorMapper[name](record),
+        validator: () => ValidatorMapper[name].validator(record),
+        alias: ValidatorMapper[name].alias,
     }));
 }
 
@@ -26329,6 +26490,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
 
 const minPublicationApiVersion = '4.2.5';
 const TEMPORARY_ID_PREFIX = 'TEMP-ID-';
+const DISABLE_DRAFT = new InjectionToken('gnDisableDraft', {
+    factory: () => false,
+});
 class Gn4Repository {
     constructor() {
         this.httpClient = inject(HttpClient);
@@ -26339,6 +26503,7 @@ class Gn4Repository {
         this.platformService = inject(PlatformServiceInterface);
         this.gn4LanguagesApi = inject(LanguagesApiService);
         this.settingsService = inject(Gn4SettingsService);
+        this.disableDraft = inject(DISABLE_DRAFT, { optional: true }) ?? false;
         this._draftsChanged = new Subject();
         this.draftsChanged$ = this._draftsChanged.asObservable();
     }
@@ -26478,7 +26643,9 @@ class Gn4Repository {
         return this.settingsService.allowEditHarvested$.pipe(map$1((allowEditHarvested) => this.canEdit(record, allowEditHarvested)));
     }
     openRecordForEdition(uniqueIdentifier) {
-        const draft$ = of(this.getRecordFromLocalStorage(uniqueIdentifier));
+        const draft$ = this.disableDraft
+            ? of(null)
+            : of(this.getRecordFromLocalStorage(uniqueIdentifier));
         const recordAsXml$ = this.getRecordAsXml(uniqueIdentifier);
         return combineLatest([draft$, recordAsXml$]).pipe(switchMap(([draft, recordAsXml]) => {
             const xml = draft ?? recordAsXml;
@@ -26532,20 +26699,28 @@ class Gn4Repository {
         return `${TEMPORARY_ID_PREFIX}${Date.now()}`;
     }
     saveRecordAsDraft(record, referenceRecordSource) {
+        if (this.disableDraft)
+            return of('');
         return this.serializeRecordToXml(record, referenceRecordSource).pipe(tap$1((recordXml) => {
             this.saveRecordToLocalStorage(recordXml, record.uniqueIdentifier);
             this._draftsChanged.next();
         }));
     }
     clearRecordDraft(uniqueIdentifier) {
+        if (this.disableDraft)
+            return;
         this.removeRecordFromLocalStorage(uniqueIdentifier);
         this._draftsChanged.next();
     }
     recordHasDraft(uniqueIdentifier) {
+        if (this.disableDraft)
+            return false;
         return this.getRecordFromLocalStorage(uniqueIdentifier) !== null;
     }
     // generated by copilot
     getAllDrafts() {
+        if (this.disableDraft)
+            return of([]);
         const items = { ...window.localStorage };
         const drafts = Object.keys(items)
             .filter((key) => key.startsWith('geonetwork-ui-draft-'))
@@ -26556,6 +26731,8 @@ class Gn4Repository {
         })));
     }
     getDraftsCount() {
+        if (this.disableDraft)
+            return of(0);
         const items = { ...window.localStorage };
         const draftCount = Object.keys(items)
             .filter((key) => key.startsWith('geonetwork-ui-draft-'))
@@ -26962,6 +27139,7 @@ class AuthService {
         }
         return baseUrl
             .replace('${current_url}', new URL(this.location.prepareExternalUrl(this.location.path()), window.location.href).toString())
+            .replace('${current_path}', this.location.prepareExternalUrl(this.location.path()))
             .replace('${lang2}', toLang2(this.translateService.currentLang))
             .replace('${lang3}', toLang3(this.translateService.currentLang));
     }
@@ -27477,6 +27655,10 @@ function provideGn4(provideOptions) {
             provide: DISABLE_AUTH,
             useValue: provideOptions?.disableAuth,
         },
+        {
+            provide: DISABLE_DRAFT,
+            useValue: provideOptions?.disableDraft,
+        },
         {
             provide: PlatformServiceInterface,
             useClass: Gn4PlatformService,
@@ -27721,8 +27903,9 @@ class MapContainerComponent {
     }
     async ngOnChanges(changes) {
         if ('context' in changes && !changes['context'].isFirstChange()) {
+            const olMap = await this.openlayersMap;
             const diff = computeMapContextDiff(this.processContext(changes['context'].currentValue), this.processContext(changes['context'].previousValue));
-            await applyContextDiffToMap(this.olMap, diff);
+            await applyContextDiffToMap(olMap, diff);
             if (this._resolvedExtentChange && diff.viewChanges) {
                 this._resolvedExtentChange.emit(this.calculateCurrentMapExtent());
             }
@@ -27928,10 +28111,11 @@ function mouseWheelZoomCondition(event) {
 
 class SpatialExtentComponent {
     constructor() {
+        this._cdr = inject(ChangeDetectorRef);
         this.spatialExtents$ = new BehaviorSubject([]);
-        this.mapContext$ = this.spatialExtents$.pipe(switchMap$1(async (extents) => {
+        this.mapContext$ = this.spatialExtents$.pipe(switchMap$1((extents) => {
             if (extents.length === 0) {
-                return null; // null extent means default view
+                return of(null);
             }
             const featureCollection = {
                 type: 'FeatureCollection',
@@ -27963,11 +28147,7 @@ class SpatialExtentComponent {
                     'fill-color': 'rgba(153, 153, 153, 0.3)',
                 },
             };
-            const view = await createViewFromLayer(layer);
-            return {
-                view,
-                layers: [layer],
-            };
+            return from(createViewFromLayer(layer)).pipe(map$1((view) => ({ view, layers: [layer] })), tap$1(() => this._cdr.markForCheck()));
         }));
         this.error = '';
     }
@@ -28130,6 +28310,20 @@ function checkMetadataLanguage(parsedConfigSection, outWarnings) {
     }
     return parsedConfigSection;
 }
+function checkNewRecordDefaultLanguage(parsedConfigSection, outWarnings) {
+    const lang2 = toLang2(parsedConfigSection.new_record_default_language.toLowerCase());
+    if (!(lang2 in LANG_2_TO_3_MAPPER)) {
+        outWarnings.push(`In the [editing] section: new_record_default_language = "${parsedConfigSection.new_record_default_language}" is not a recognized ISO 639 language code`);
+        return {
+            ...parsedConfigSection,
+            new_record_default_language: undefined,
+        };
+    }
+    return {
+        ...parsedConfigSection,
+        new_record_default_language: lang2,
+    };
+}
 
 /**
  * This loader extends the default one based on JSON files but also loads custom translations
@@ -28170,6 +28364,10 @@ let searchConfig = null;
 function getOptionalSearchConfig() {
     return searchConfig;
 }
+let editorConfig = null;
+function getOptionalEditorConfig() {
+    return editorConfig;
+}
 let metadataQualityConfig = null;
 function getMetadataQualityConfig() {
     return (metadataQualityConfig ||
@@ -28327,6 +28525,17 @@ function loadAppConfig(configUrl = 'assets/configuration/default.toml') {
                     ENABLED: parsedMetadataQualitySection.enabled,
                     SORTABLE: parsedMetadataQualitySection.sortable,
                 };
+        let parsedEditingSection = parseConfigSection(parsed, 'editing', [], ['new_record_default_language'], warnings, errors);
+        if (parsedEditingSection !== null &&
+            parsedEditingSection.new_record_default_language !== undefined) {
+            parsedEditingSection = checkNewRecordDefaultLanguage(parsedEditingSection, warnings);
+        }
+        editorConfig =
+            parsedEditingSection === null
+                ? null
+                : {
+                    NEW_RECORD_DEFAULT_LANGUAGE: parsedEditingSection.new_record_default_language,
+                };
         customTranslations = parseTranslationsConfigSection(parsed, 'translations');
         if (errors.length) {
             throw new Error(`One or more mandatory settings were missing from the configuration file.
@@ -28345,6 +28554,7 @@ function isConfigLoaded() {
 function _reset() {
     globalConfig = null;
     themeConfig = null;
+    editorConfig = null;
     customTranslations = null;
 }
 const TRANSLATE_WITH_OVERRIDES_CONFIG = {
@@ -29116,6 +29326,9 @@ class ButtonComponent {
             case 'black':
                 this.btnClass = 'gn-ui-btn-black';
                 break;
+            case 'primary-light':
+                this.btnClass = 'gn-ui-btn-primary-light';
+                break;
             case 'default':
             default:
                 this.btnClass = 'gn-ui-btn-default';
@@ -30227,7 +30440,8 @@ class UrlInputComponent {
         this.cd.markForCheck();
         this.valueChange.next(value);
     }
-    handleUpload(element) {
+    handleUpload(element, event) {
+        event.stopPropagation();
         const value = element.value;
         if (!value || !this.isValidUrl(value))
             return;
@@ -30248,7 +30462,7 @@ class UrlInputComponent {
             provideNgIconsConfig({
                 size: '1.5em',
             }),
-        ], usesOnChanges: true, ngImport: i0, template: "<span class=\"w-full inline-block relative\">\n  <input\n    #input\n    class=\"gn-ui-text-input gn-ui-url-input px-[var(--text-padding)]\"\n    [ngClass]=\"extraClass\"\n    type=\"url\"\n    [value]=\"inputValue\"\n    (input)=\"handleInput($event)\"\n    (keydown.enter)=\"handleUpload(input)\"\n    [placeholder]=\"placeholder\"\n    [attr.aria-label]=\"placeholder\"\n    [disabled]=\"disabled\"\n  />\n  <div\n    class=\"absolute inset-y-[var(--side-padding)] left-[var(--2x-side-padding)] grid justify-center items-center pointer-events-none\"\n    [ngClass]=\"{\n      'text-primary': !disabled,\n      'text-primary-lightest': disabled,\n    }\"\n  >\n    <ng-icon name=\"iconoirLink\"></ng-icon>\n  </div>\n  @if (showValidateButton) {\n    <gn-ui-button\n      extraClass=\"absolute inset-y-[var(--side-padding)] right-[var(--side-padding)]\"\n      type=\"primary\"\n      [disabled]=\"disabled || input.value === '' || !isValidUrl(input.value)\"\n      (buttonClick)=\"handleUpload(input)\"\n    >\n      <ng-content>\n        <ng-icon name=\"iconoirArrowUp\"></ng-icon>\n      </ng-content>\n    </gn-ui-button>\n  }\n</span>\n", styles: [":host{--gn-ui-button-rounded: 8px;--gn-ui-button-width: 32px;--gn-ui-button-padding: 0;--side-padding: calc(var(--gn-ui-text-input-padding, .6rem) - 6px);--2x-side-padding: calc(var(--side-padding) * 2);--text-padding: calc(var(--side-padding) + 40px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], usesOnChanges: true, ngImport: i0, template: "<span class=\"w-full inline-block relative\">\n  <input\n    #input\n    class=\"gn-ui-text-input gn-ui-url-input px-[var(--text-padding)]\"\n    [ngClass]=\"extraClass\"\n    type=\"url\"\n    [value]=\"inputValue\"\n    (input)=\"handleInput($event)\"\n    (keydown.enter)=\"handleUpload(input, $event)\"\n    [placeholder]=\"placeholder\"\n    [attr.aria-label]=\"placeholder\"\n    [disabled]=\"disabled\"\n  />\n  <div\n    class=\"absolute inset-y-[var(--side-padding)] left-[var(--2x-side-padding)] grid justify-center items-center pointer-events-none\"\n    [ngClass]=\"{\n      'text-primary': !disabled,\n      'text-primary-lightest': disabled,\n    }\"\n  >\n    <ng-icon name=\"iconoirLink\"></ng-icon>\n  </div>\n  @if (showValidateButton) {\n    <gn-ui-button\n      extraClass=\"absolute inset-y-[var(--side-padding)] right-[var(--side-padding)]\"\n      type=\"primary\"\n      [disabled]=\"disabled || input.value === '' || !isValidUrl(input.value)\"\n      (buttonClick)=\"handleUpload(input, $event)\"\n    >\n      <ng-content>\n        <ng-icon name=\"iconoirArrowUp\"></ng-icon>\n      </ng-content>\n    </gn-ui-button>\n  }\n</span>\n", styles: [":host{--gn-ui-button-rounded: 8px;--gn-ui-button-width: 32px;--gn-ui-button-padding: 0;--side-padding: calc(var(--gn-ui-text-input-padding, .6rem) - 6px);--2x-side-padding: calc(var(--side-padding) * 2);--text-padding: calc(var(--side-padding) + 40px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: UrlInputComponent, decorators: [{
             type: Component,
@@ -30257,7 +30471,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                         provideNgIconsConfig({
                             size: '1.5em',
                         }),
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"w-full inline-block relative\">\n  <input\n    #input\n    class=\"gn-ui-text-input gn-ui-url-input px-[var(--text-padding)]\"\n    [ngClass]=\"extraClass\"\n    type=\"url\"\n    [value]=\"inputValue\"\n    (input)=\"handleInput($event)\"\n    (keydown.enter)=\"handleUpload(input)\"\n    [placeholder]=\"placeholder\"\n    [attr.aria-label]=\"placeholder\"\n    [disabled]=\"disabled\"\n  />\n  <div\n    class=\"absolute inset-y-[var(--side-padding)] left-[var(--2x-side-padding)] grid justify-center items-center pointer-events-none\"\n    [ngClass]=\"{\n      'text-primary': !disabled,\n      'text-primary-lightest': disabled,\n    }\"\n  >\n    <ng-icon name=\"iconoirLink\"></ng-icon>\n  </div>\n  @if (showValidateButton) {\n    <gn-ui-button\n      extraClass=\"absolute inset-y-[var(--side-padding)] right-[var(--side-padding)]\"\n      type=\"primary\"\n      [disabled]=\"disabled || input.value === '' || !isValidUrl(input.value)\"\n      (buttonClick)=\"handleUpload(input)\"\n    >\n      <ng-content>\n        <ng-icon name=\"iconoirArrowUp\"></ng-icon>\n      </ng-content>\n    </gn-ui-button>\n  }\n</span>\n", styles: [":host{--gn-ui-button-rounded: 8px;--gn-ui-button-width: 32px;--gn-ui-button-padding: 0;--side-padding: calc(var(--gn-ui-text-input-padding, .6rem) - 6px);--2x-side-padding: calc(var(--side-padding) * 2);--text-padding: calc(var(--side-padding) + 40px)}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"w-full inline-block relative\">\n  <input\n    #input\n    class=\"gn-ui-text-input gn-ui-url-input px-[var(--text-padding)]\"\n    [ngClass]=\"extraClass\"\n    type=\"url\"\n    [value]=\"inputValue\"\n    (input)=\"handleInput($event)\"\n    (keydown.enter)=\"handleUpload(input, $event)\"\n    [placeholder]=\"placeholder\"\n    [attr.aria-label]=\"placeholder\"\n    [disabled]=\"disabled\"\n  />\n  <div\n    class=\"absolute inset-y-[var(--side-padding)] left-[var(--2x-side-padding)] grid justify-center items-center pointer-events-none\"\n    [ngClass]=\"{\n      'text-primary': !disabled,\n      'text-primary-lightest': disabled,\n    }\"\n  >\n    <ng-icon name=\"iconoirLink\"></ng-icon>\n  </div>\n  @if (showValidateButton) {\n    <gn-ui-button\n      extraClass=\"absolute inset-y-[var(--side-padding)] right-[var(--side-padding)]\"\n      type=\"primary\"\n      [disabled]=\"disabled || input.value === '' || !isValidUrl(input.value)\"\n      (buttonClick)=\"handleUpload(input, $event)\"\n    >\n      <ng-content>\n        <ng-icon name=\"iconoirArrowUp\"></ng-icon>\n      </ng-content>\n    </gn-ui-button>\n  }\n</span>\n", styles: [":host{--gn-ui-button-rounded: 8px;--gn-ui-button-width: 32px;--gn-ui-button-padding: 0;--side-padding: calc(var(--gn-ui-text-input-padding, .6rem) - 6px);--2x-side-padding: calc(var(--side-padding) * 2);--text-padding: calc(var(--side-padding) + 40px)}\n"] }]
         }], propDecorators: { value: [{
                 type: Input
             }], extraClass: [{
@@ -34042,10 +34256,7 @@ class MetadataContactComponent {
             : this.metadata.contactsForResource) || []);
     }
     get address() {
-        const addressParts = this.contacts[0].address
-            .split(',')
-            .map((part) => part.trim());
-        return addressParts;
+        return getAddressLines(this.contacts[0]?.address);
     }
     onOrganizationClick() {
         this.organizationClick.emit(this.shownOrganization);
@@ -34177,6 +34388,89 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                 }]
         }] });
 
+class ContactDetailsComponent {
+    get organization() {
+        return this.contact?.organization;
+    }
+    get displayName() {
+        return getIndividualDisplayName(this.contact);
+    }
+    get addressLines() {
+        return getAddressLines(this.contact?.address);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ContactDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: ContactDetailsComponent, isStandalone: true, selector: "gn-ui-contact-details", inputs: { contact: "contact" }, ngImport: i0, template: "<div\n  class=\"bg-gray-50 rounded border border-gray-200 shadow-md p-4 flex flex-col gap-3 w-full\"\n  data-test=\"contact-details\"\n>\n  @if (displayName) {\n    <div class=\"flex items-center gap-3\">\n      @if (organization?.logoUrl?.href) {\n        <div\n          class=\"flex items-center justify-center rounded-md bg-white w-14 h-14 shrink-0 overflow-hidden\"\n        >\n          <gn-ui-thumbnail\n            class=\"relative h-full w-full\"\n            [thumbnailUrl]=\"organization.logoUrl.href\"\n            fit=\"contain\"\n          ></gn-ui-thumbnail>\n        </div>\n      }\n      <span\n        class=\"font-title text-xl leading-tight\"\n        data-test=\"contact-details-name\"\n        >{{ displayName }}</span\n      >\n    </div>\n  }\n\n  <!-- Email + phone: always shown; icon dimmed when field is absent -->\n  <div class=\"grid grid-cols-2 gap-1 rounded-md overflow-hidden\">\n    <div class=\"bg-gray-100 flex items-center gap-2 px-3 py-2\">\n      <ng-icon\n        class=\"!w-5 !h-5 !text-[20px] shrink-0\"\n        [class.opacity-30]=\"!contact.email\"\n        [class.opacity-75]=\"!!contact.email\"\n        name=\"matMailOutline\"\n      ></ng-icon>\n      @if (contact.email) {\n        <a\n          [href]=\"'mailto:' + contact.email\"\n          class=\"text-sm break-all hover:underline\"\n          data-test=\"contact-details-email\"\n          >{{ contact.email }}</a\n        >\n      }\n    </div>\n    <div class=\"bg-gray-100 flex items-center gap-2 px-3 py-2\">\n      <ng-icon\n        class=\"!w-5 !h-5 !text-[20px] shrink-0\"\n        [class.opacity-30]=\"!contact.phone\"\n        [class.opacity-75]=\"!!contact.phone\"\n        name=\"matCallOutline\"\n      ></ng-icon>\n      @if (contact.phone) {\n        <span class=\"text-sm\" data-test=\"contact-details-phone\">{{\n          contact.phone\n        }}</span>\n      }\n    </div>\n  </div>\n\n  <!-- Address: always shown; icon dimmed when absent -->\n  <div class=\"bg-gray-100 rounded-md flex items-start gap-2 px-3 py-2\">\n    <ng-icon\n      class=\"!w-5 !h-5 !text-[20px] shrink-0 mt-0.5\"\n      [class.opacity-30]=\"!addressLines.length\"\n      [class.opacity-75]=\"!!addressLines.length\"\n      name=\"matLocationOnOutline\"\n    ></ng-icon>\n    @if (addressLines.length) {\n      <div class=\"flex flex-col\" data-test=\"contact-details-address\">\n        @for (line of addressLines; track line) {\n          <p class=\"text-sm m-0\">{{ line }}</p>\n        }\n      </div>\n    }\n  </div>\n\n  <!-- Website: only shown when org exists; icon dimmed when absent -->\n  @if (organization) {\n    <div class=\"bg-gray-100 rounded-md flex items-center gap-2 px-3 py-2\">\n      <ng-icon\n        class=\"!w-5 !h-5 !text-[20px] shrink-0\"\n        [class.opacity-30]=\"!organization.website\"\n        [class.opacity-75]=\"!!organization.website\"\n        name=\"matOpenInNew\"\n      ></ng-icon>\n      @if (organization.website) {\n        <a\n          [href]=\"organization.website.href\"\n          target=\"_blank\"\n          class=\"text-sm break-all hover:underline\"\n          data-test=\"contact-details-website\"\n          >{{ organization.website.href }}</a\n        >\n      }\n    </div>\n  }\n</div>\n", dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: ThumbnailComponent, selector: "gn-ui-thumbnail", inputs: ["thumbnailUrl", "fit"], outputs: ["placeholderShown"] }, { kind: "ngmodule", type: TranslateModule }], viewProviders: [
+            provideIcons({
+                matCallOutline,
+                matLocationOnOutline,
+                matMailOutline,
+                matOpenInNew,
+            }),
+        ], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ContactDetailsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'gn-ui-contact-details', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgIcon, ThumbnailComponent, TranslateModule], viewProviders: [
+                        provideIcons({
+                            matCallOutline,
+                            matLocationOnOutline,
+                            matMailOutline,
+                            matOpenInNew,
+                        }),
+                    ], template: "<div\n  class=\"bg-gray-50 rounded border border-gray-200 shadow-md p-4 flex flex-col gap-3 w-full\"\n  data-test=\"contact-details\"\n>\n  @if (displayName) {\n    <div class=\"flex items-center gap-3\">\n      @if (organization?.logoUrl?.href) {\n        <div\n          class=\"flex items-center justify-center rounded-md bg-white w-14 h-14 shrink-0 overflow-hidden\"\n        >\n          <gn-ui-thumbnail\n            class=\"relative h-full w-full\"\n            [thumbnailUrl]=\"organization.logoUrl.href\"\n            fit=\"contain\"\n          ></gn-ui-thumbnail>\n        </div>\n      }\n      <span\n        class=\"font-title text-xl leading-tight\"\n        data-test=\"contact-details-name\"\n        >{{ displayName }}</span\n      >\n    </div>\n  }\n\n  <!-- Email + phone: always shown; icon dimmed when field is absent -->\n  <div class=\"grid grid-cols-2 gap-1 rounded-md overflow-hidden\">\n    <div class=\"bg-gray-100 flex items-center gap-2 px-3 py-2\">\n      <ng-icon\n        class=\"!w-5 !h-5 !text-[20px] shrink-0\"\n        [class.opacity-30]=\"!contact.email\"\n        [class.opacity-75]=\"!!contact.email\"\n        name=\"matMailOutline\"\n      ></ng-icon>\n      @if (contact.email) {\n        <a\n          [href]=\"'mailto:' + contact.email\"\n          class=\"text-sm break-all hover:underline\"\n          data-test=\"contact-details-email\"\n          >{{ contact.email }}</a\n        >\n      }\n    </div>\n    <div class=\"bg-gray-100 flex items-center gap-2 px-3 py-2\">\n      <ng-icon\n        class=\"!w-5 !h-5 !text-[20px] shrink-0\"\n        [class.opacity-30]=\"!contact.phone\"\n        [class.opacity-75]=\"!!contact.phone\"\n        name=\"matCallOutline\"\n      ></ng-icon>\n      @if (contact.phone) {\n        <span class=\"text-sm\" data-test=\"contact-details-phone\">{{\n          contact.phone\n        }}</span>\n      }\n    </div>\n  </div>\n\n  <!-- Address: always shown; icon dimmed when absent -->\n  <div class=\"bg-gray-100 rounded-md flex items-start gap-2 px-3 py-2\">\n    <ng-icon\n      class=\"!w-5 !h-5 !text-[20px] shrink-0 mt-0.5\"\n      [class.opacity-30]=\"!addressLines.length\"\n      [class.opacity-75]=\"!!addressLines.length\"\n      name=\"matLocationOnOutline\"\n    ></ng-icon>\n    @if (addressLines.length) {\n      <div class=\"flex flex-col\" data-test=\"contact-details-address\">\n        @for (line of addressLines; track line) {\n          <p class=\"text-sm m-0\">{{ line }}</p>\n        }\n      </div>\n    }\n  </div>\n\n  <!-- Website: only shown when org exists; icon dimmed when absent -->\n  @if (organization) {\n    <div class=\"bg-gray-100 rounded-md flex items-center gap-2 px-3 py-2\">\n      <ng-icon\n        class=\"!w-5 !h-5 !text-[20px] shrink-0\"\n        [class.opacity-30]=\"!organization.website\"\n        [class.opacity-75]=\"!!organization.website\"\n        name=\"matOpenInNew\"\n      ></ng-icon>\n      @if (organization.website) {\n        <a\n          [href]=\"organization.website.href\"\n          target=\"_blank\"\n          class=\"text-sm break-all hover:underline\"\n          data-test=\"contact-details-website\"\n          >{{ organization.website.href }}</a\n        >\n      }\n    </div>\n  }\n</div>\n" }]
+        }], propDecorators: { contact: [{
+                type: Input
+            }] } });
+
+class ContactPillComponent {
+    constructor() {
+        this.host = inject((ElementRef));
+        this.overlayOpen = false;
+        this.overlayWidth = 0;
+        this.overlayOffsetX = 0;
+        this.overlayPositions = [
+            {
+                originX: 'start',
+                originY: 'bottom',
+                overlayX: 'start',
+                overlayY: 'top',
+                offsetY: 4,
+            },
+            {
+                originX: 'start',
+                originY: 'top',
+                overlayX: 'start',
+                overlayY: 'bottom',
+                offsetY: -4,
+            },
+        ];
+    }
+    get displayName() {
+        return getIndividualDisplayName(this.contact);
+    }
+    toggleOverlay() {
+        if (!this.overlayOpen) {
+            // Calculate the width and horizontal offset of the overlay to align it with the parent element
+            const parent = this.host.nativeElement.parentElement.getBoundingClientRect();
+            const pill = this.host.nativeElement.getBoundingClientRect();
+            this.overlayWidth = parent.width;
+            this.overlayOffsetX = parent.left - pill.left;
+        }
+        this.overlayOpen = !this.overlayOpen;
+    }
+    closeOverlay() {
+        this.overlayOpen = false;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ContactPillComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: ContactPillComponent, isStandalone: true, selector: "gn-ui-contact-pill", inputs: { contact: "contact" }, ngImport: i0, template: "<gn-ui-button\n  [type]=\"overlayOpen ? 'primary' : 'primary-light'\"\n  extraClass=\"group w-full min-h-12 gap-3 justify-between py-2 pl-5 pr-4 rounded\"\n  data-test=\"contact-pill\"\n  (buttonClick)=\"toggleOverlay()\"\n  cdkOverlayOrigin\n  #overlayOrigin=\"cdkOverlayOrigin\"\n>\n  <span\n    class=\"font-title font-medium text-base leading-tight truncate group-hover:text-white\"\n    [title]=\"displayName\"\n    >{{ displayName }}</span\n  >\n  <div\n    class=\"gn-ui-card-icon items-center justify-center w-10 h-8 group-hover:border-white group-hover:text-white\"\n  >\n    @if (overlayOpen) {\n      <ng-icon class=\"!w-6 !h-6 !text-[24px]\" name=\"matClose\"></ng-icon>\n    } @else {\n      <ng-icon class=\"!w-6 !h-6 !text-[24px]\" name=\"matInfoOutline\"></ng-icon>\n    }\n  </div>\n</gn-ui-button>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\n  [cdkConnectedOverlayOpen]=\"overlayOpen\"\n  [cdkConnectedOverlayPositions]=\"overlayPositions\"\n  [cdkConnectedOverlayOffsetX]=\"overlayOffsetX\"\n  (overlayOutsideClick)=\"closeOverlay()\"\n  (detach)=\"closeOverlay()\"\n>\n  <div [style.width.px]=\"overlayWidth\">\n    <gn-ui-contact-details [contact]=\"contact\"></gn-ui-contact-details>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$8.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$8.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: ContactDetailsComponent, selector: "gn-ui-contact-details", inputs: ["contact"] }], viewProviders: [provideIcons({ matClose, matInfoOutline })], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ContactPillComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'gn-ui-contact-pill', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgIcon, ButtonComponent, OverlayModule, ContactDetailsComponent], viewProviders: [provideIcons({ matClose, matInfoOutline })], template: "<gn-ui-button\n  [type]=\"overlayOpen ? 'primary' : 'primary-light'\"\n  extraClass=\"group w-full min-h-12 gap-3 justify-between py-2 pl-5 pr-4 rounded\"\n  data-test=\"contact-pill\"\n  (buttonClick)=\"toggleOverlay()\"\n  cdkOverlayOrigin\n  #overlayOrigin=\"cdkOverlayOrigin\"\n>\n  <span\n    class=\"font-title font-medium text-base leading-tight truncate group-hover:text-white\"\n    [title]=\"displayName\"\n    >{{ displayName }}</span\n  >\n  <div\n    class=\"gn-ui-card-icon items-center justify-center w-10 h-8 group-hover:border-white group-hover:text-white\"\n  >\n    @if (overlayOpen) {\n      <ng-icon class=\"!w-6 !h-6 !text-[24px]\" name=\"matClose\"></ng-icon>\n    } @else {\n      <ng-icon class=\"!w-6 !h-6 !text-[24px]\" name=\"matInfoOutline\"></ng-icon>\n    }\n  </div>\n</gn-ui-button>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\n  [cdkConnectedOverlayOpen]=\"overlayOpen\"\n  [cdkConnectedOverlayPositions]=\"overlayPositions\"\n  [cdkConnectedOverlayOffsetX]=\"overlayOffsetX\"\n  (overlayOutsideClick)=\"closeOverlay()\"\n  (detach)=\"closeOverlay()\"\n>\n  <div [style.width.px]=\"overlayWidth\">\n    <gn-ui-contact-details [contact]=\"contact\"></gn-ui-contact-details>\n  </div>\n</ng-template>\n" }]
+        }], propDecorators: { contact: [{
+                type: Input
+            }] } });
+
 class MetadataInfoComponent {
     constructor() {
         this.dateService = inject(DateService);
@@ -34232,20 +34526,32 @@ class MetadataInfoComponent {
         const temporalExtents = this.metadata.kind === 'dataset' ? this.metadata.temporalExtents : [];
         return getTemporalRangeUnion(temporalExtents, this.dateService);
     }
-    get shownOrganization() {
-        return this.metadata.ownerOrganization;
-    }
-    get resourceContact() {
-        return this.metadata.contactsForResource?.[0];
-    }
     fieldReady(propName) {
         return !this.incomplete || propName in this.metadata;
     }
+    get contactGroups() {
+        const groups = [];
+        const indexByRole = new Map();
+        for (const contact of this.metadata.contactsForResource ?? []) {
+            if (indexByRole.has(contact.role)) {
+                groups[indexByRole.get(contact.role)].contacts.push(contact);
+            }
+            else {
+                indexByRole.set(contact.role, groups.length);
+                groups.push({
+                    role: contact.role,
+                    roleLabel: RoleLabels.get(contact.role),
+                    contacts: [contact],
+                });
+            }
+        }
+        return groups;
+    }
     onKeywordClick(keyword) {
         this.keyword.emit(keyword);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MetadataInfoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", 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    @if (metadata.abstract) {\n      <gn-ui-max-lines [maxLines]=\"6\" data-test=\"metadata-info-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    }\n  </gn-ui-content-ghost>\n\n  @if (!fieldReady('keywords') || metadata.keywords?.length) {\n    <p class=\"mt-6 mb-3 font-medium text-black text-sm\" translate>\n      record.metadata.keywords\n    </p>\n  }\n\n  <gn-ui-content-ghost\n    ghostClass=\"h-[31px] w-3/4\"\n    [showContent]=\"fieldReady('keywords')\"\n  >\n    @if (metadata.keywords?.length) {\n      <gn-ui-max-lines [maxLines]=\"7\">\n        <div class=\"metadata-info-keywords sm:pb-4 flex flex-wrap gap-2\">\n          @for (keyword of metadata.keywords; track keyword) {\n            <gn-ui-badge\n              class=\"inline-block lowercase\"\n              (click)=\"onKeywordClick(keyword)\"\n              [clickable]=\"true\"\n              >{{ keyword.label }}</gn-ui-badge\n            >\n          }\n        </div>\n      </gn-ui-max-lines>\n    }\n  </gn-ui-content-ghost>\n</div>\n\n@if (\n  metadata.licenses ||\n  metadata.legalConstraints ||\n  metadata.securityConstraints ||\n  metadata.otherConstraints\n) {\n  <gn-ui-expandable-panel\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      @for (license of licenses; track license) {\n        @if (license.url) {\n          <div 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        } @else {\n          <div class=\"text-primary\" gnUiLinkify>\n            {{ license.text }}\n          </div>\n        }\n      }\n      @if (legalConstraints.length) {\n        <div class=\"mb-6\">\n          @for (constraint of legalConstraints; track constraint) {\n            <gn-ui-markdown-parser [textContent]=\"constraint\">\n            </gn-ui-markdown-parser>\n          }\n        </div>\n      }\n      @if (otherConstraints.length) {\n        @for (constraint of otherConstraints; track constraint) {\n          <div gnUiLinkify>\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        }\n      }\n      @if (!hasUsage) {\n        <span class=\"noUsage\">\n          {{ 'record.metadata.noUsage' | translate }}\n        </span>\n      }\n    </div>\n  </gn-ui-expandable-panel>\n}\n@if (\n  (metadata.kind === 'dataset' && metadata.lineage) ||\n  resourceContact ||\n  metadata.resourceCreated ||\n  metadata.resourcePublished ||\n  metadata.resourceUpdated ||\n  (metadata.kind === 'dataset' && metadata.updateFrequency) ||\n  metadata.otherLanguages?.length ||\n  (metadata.kind === 'dataset' && temporalExtent)\n) {\n  <gn-ui-expandable-panel\n    [title]=\"'record.metadata.details' | translate\"\n    data-test=\"details-panel\"\n  >\n    @if (metadata.kind === 'dataset' && metadata.lineage) {\n      <div\n        class=\"text-gray-900 flex flex-col mt-4 gap-2\"\n        data-test=\"details-panel-lineage\"\n      >\n        <p class=\"whitespace-pre-line break-words text-gray-900\" gnUiLinkify>\n          {{ metadata.lineage }}\n        </p>\n      </div>\n    }\n    @if (resourceContact) {\n      <div\n        class=\"flex flex-row gap-6 mt-5 mb-8 resource-contact\"\n        data-test=\"details-panel-resource-contact\"\n      >\n        @if (resourceContact.organization?.logoUrl?.href) {\n          <div\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        }\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          @if (resourceContact.organization?.website) {\n            <div>\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          }\n          @if (resourceContact.email) {\n            <div class=\"mt-4\">\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                @if (resourceContact.email) {\n                  <a\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                }\n              </div>\n            </div>\n          }\n        </div>\n      </div>\n    }\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      @if (metadata.resourceCreated) {\n        <div data-test=\"details-panel-resource-created\">\n          <p class=\"text-sm\" translate>record.metadata.creation</p>\n          <p\n            class=\"text-primary font-medium mt-1 resource-created\"\n            [gnUiHumanizeDate]=\"metadata.resourceCreated\"\n          ></p>\n        </div>\n      }\n      @if (metadata.resourcePublished) {\n        <div data-test=\"details-panel-resource-published\">\n          <p class=\"text-sm\" translate>record.metadata.publication</p>\n          <p\n            class=\"text-primary font-medium mt-1 resource-published\"\n            [gnUiHumanizeDate]=\"metadata.resourcePublished\"\n          ></p>\n        </div>\n      }\n      @if (metadata.resourceUpdated) {\n        <div data-test=\"details-panel-resource-updated\">\n          <p class=\"text-sm\" translate>record.metadata.update</p>\n          <p\n            class=\"text-primary font-medium mt-1 resource-updated\"\n            [gnUiHumanizeDate]=\"metadata.resourceUpdated\"\n          ></p>\n        </div>\n      }\n      @if (metadata.kind === 'dataset' && metadata.updateFrequency) {\n        <div data-test=\"details-panel-update-frequency\">\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      }\n      @if (metadata.otherLanguages?.length) {\n        <div data-test=\"details-panel-other-languages\">\n          <p class=\"text-sm mb-1\" translate>record.metadata.languages</p>\n          <div class=\"flex flex-row gap-1 flex-wrap\">\n            @for (language of metadata.otherLanguages; track language) {\n              <p class=\"text-primary font-medium other-languages\" translate>\n                language.{{ language }}\n              </p>\n            }\n          </div>\n        </div>\n      }\n      @if (metadata.kind === 'dataset' && temporalExtent) {\n        <div data-test=\"details-panel-temporal-extent\">\n          <p class=\"text-sm\" translate>record.metadata.temporalExtent</p>\n          <div\n            class=\"flex flex-row gap-1 mb-1 text-primary font-medium temporal-extent\"\n          >\n            @if (temporalExtent.start && temporalExtent.end) {\n              <p\n                translate\n                [translateParams]=\"{\n                  start: temporalExtent.start,\n                  end: temporalExtent.end,\n                }\"\n              >\n                record.metadata.temporalExtent.fromDateToDate\n              </p>\n            }\n            @if (temporalExtent.start && !temporalExtent.end) {\n              <p translate [translateParams]=\"{ start: temporalExtent.start }\">\n                record.metadata.temporalExtent.sinceDate\n              </p>\n            }\n            @if (!temporalExtent.start && temporalExtent.end) {\n              <p translate [translateParams]=\"{ end: temporalExtent.end }\">\n                record.metadata.temporalExtent.untilDate\n              </p>\n            }\n          </div>\n        </div>\n      }\n    </div>\n  </gn-ui-expandable-panel>\n}\n@if (\n  metadata.kind !== 'dataset' &&\n  metadata.spatialExtents &&\n  metadata.spatialExtents.length\n) {\n  <gn-ui-expandable-panel\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}\n@if (metadata.landingPage) {\n  <gn-ui-expandable-panel\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      @if (metadata.recordUpdated) {\n        <div>\n          <p class=\"text-sm\" translate>record.metadata.updatedOn</p>\n          <p\n            class=\"text-primary font-medium\"\n            [gnUiHumanizeDate]=\"metadata.recordUpdated\"\n          ></p>\n        </div>\n      }\n      @if (metadata.landingPage) {\n        <div>\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>{{\n                metadata.landingPage\n              }}</span>\n            </a>\n          </p>\n        </div>\n      }\n      @if (metadata.ownerOrganization) {\n        <div>\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      }\n      @if (metadata.uniqueIdentifier) {\n        <div>\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      }\n      @if (metadata.topics?.length) {\n        <div>\n          <p class=\"text-sm mb-1\" translate>record.metadata.topics</p>\n          <div class=\"sm:pb-4 sm:pr-16\">\n            @for (topic of metadata.topics; track topic) {\n              <gn-ui-badge\n                [clickable]=\"false\"\n                class=\"inline-block mr-2 mb-2 lowercase\"\n                >{{ topic }}</gn-ui-badge\n              >\n            }\n          </div>\n        </div>\n      }\n    </div>\n  </gn-ui-expandable-panel>\n}\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: "directive", type: 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: "directive", type: GnUiHumanizeDateDirective, selector: "[gnUiHumanizeDate]", inputs: ["gnUiHumanizeDate"] }, { kind: "component", type: SpatialExtentComponent, selector: "gn-ui-spatial-extent", inputs: ["spatialExtents"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], viewProviders: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", 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    @if (metadata.abstract) {\n      <gn-ui-max-lines [maxLines]=\"6\" data-test=\"metadata-info-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    }\n  </gn-ui-content-ghost>\n\n  @if (!fieldReady('keywords') || metadata.keywords?.length) {\n    <p class=\"mt-6 mb-3 font-medium text-black text-sm\" translate>\n      record.metadata.keywords\n    </p>\n  }\n\n  <gn-ui-content-ghost\n    ghostClass=\"h-[31px] w-3/4\"\n    [showContent]=\"fieldReady('keywords')\"\n  >\n    @if (metadata.keywords?.length) {\n      <gn-ui-max-lines [maxLines]=\"7\">\n        <div class=\"metadata-info-keywords sm:pb-4 flex flex-wrap gap-2\">\n          @for (keyword of metadata.keywords; track keyword) {\n            <gn-ui-button\n              type=\"primary-light\"\n              class=\"inline-block opacity-70\"\n              extraClass=\"lowercase text-sm py-1 px-2\"\n              (buttonClick)=\"onKeywordClick(keyword)\"\n              >{{ keyword.label }}</gn-ui-button\n            >\n          }\n        </div>\n      </gn-ui-max-lines>\n    }\n  </gn-ui-content-ghost>\n</div>\n\n@if (\n  metadata.licenses ||\n  metadata.legalConstraints ||\n  metadata.securityConstraints ||\n  metadata.otherConstraints\n) {\n  <gn-ui-expandable-panel\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      @for (license of licenses; track $index) {\n        @if (license.url) {\n          <div 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        } @else {\n          <div class=\"text-primary\" gnUiLinkify>\n            {{ license.text }}\n          </div>\n        }\n      }\n      @if (legalConstraints.length) {\n        <div class=\"mb-6\">\n          @for (constraint of legalConstraints; track constraint) {\n            <gn-ui-markdown-parser [textContent]=\"constraint\">\n            </gn-ui-markdown-parser>\n          }\n        </div>\n      }\n      @if (otherConstraints.length) {\n        @for (constraint of otherConstraints; track constraint) {\n          <div gnUiLinkify>\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        }\n      }\n      @if (!hasUsage) {\n        <span class=\"noUsage\">\n          {{ 'record.metadata.noUsage' | translate }}\n        </span>\n      }\n    </div>\n  </gn-ui-expandable-panel>\n}\n@if (metadata.contactsForResource?.length) {\n  <gn-ui-expandable-panel\n    [title]=\"'record.metadata.resource.contacts' | translate\"\n    data-test=\"contacts-panel\"\n  >\n    <div class=\"flex flex-col gap-1 pt-3 pb-4\">\n      @for (group of contactGroups; track group.role) {\n        <div class=\"flex flex-col gap-1 rounded bg-gray-50 py-4 px-2\">\n          <p class=\"text-xs font-normal text-black\">\n            {{ group.roleLabel | translate }}\n          </p>\n          <div class=\"grid gap-1 grid-cols-1 md:grid-cols-2\">\n            @for (contact of group.contacts; track contact.email) {\n              <gn-ui-contact-pill [contact]=\"contact\"></gn-ui-contact-pill>\n            }\n          </div>\n        </div>\n      }\n    </div>\n  </gn-ui-expandable-panel>\n}\n@if (\n  (metadata.kind === 'dataset' && metadata.lineage) ||\n  metadata.resourceCreated ||\n  metadata.resourcePublished ||\n  metadata.resourceUpdated ||\n  (metadata.kind === 'dataset' && metadata.updateFrequency) ||\n  metadata.otherLanguages?.length ||\n  (metadata.kind === 'dataset' && temporalExtent)\n) {\n  <gn-ui-expandable-panel\n    [title]=\"'record.metadata.details' | translate\"\n    data-test=\"details-panel\"\n  >\n    @if (metadata.kind === 'dataset' && metadata.lineage) {\n      <div\n        class=\"text-gray-900 flex flex-col mt-4 gap-2\"\n        data-test=\"details-panel-lineage\"\n      >\n        <p class=\"whitespace-pre-line break-words text-gray-900\" gnUiLinkify>\n          {{ metadata.lineage }}\n        </p>\n      </div>\n    }\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      @if (metadata.resourceCreated) {\n        <div data-test=\"details-panel-resource-created\">\n          <p class=\"text-sm\" translate>record.metadata.creation</p>\n          <p\n            class=\"text-primary font-medium mt-1 resource-created\"\n            [gnUiHumanizeDate]=\"metadata.resourceCreated\"\n          ></p>\n        </div>\n      }\n      @if (metadata.resourcePublished) {\n        <div data-test=\"details-panel-resource-published\">\n          <p class=\"text-sm\" translate>record.metadata.publication</p>\n          <p\n            class=\"text-primary font-medium mt-1 resource-published\"\n            [gnUiHumanizeDate]=\"metadata.resourcePublished\"\n          ></p>\n        </div>\n      }\n      @if (metadata.resourceUpdated) {\n        <div data-test=\"details-panel-resource-updated\">\n          <p class=\"text-sm\" translate>record.metadata.update</p>\n          <p\n            class=\"text-primary font-medium mt-1 resource-updated\"\n            [gnUiHumanizeDate]=\"metadata.resourceUpdated\"\n          ></p>\n        </div>\n      }\n      @if (metadata.kind === 'dataset' && metadata.updateFrequency) {\n        <div data-test=\"details-panel-update-frequency\">\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      }\n      @if (metadata.otherLanguages?.length) {\n        <div data-test=\"details-panel-other-languages\">\n          <p class=\"text-sm mb-1\" translate>record.metadata.languages</p>\n          <div class=\"flex flex-row gap-1 flex-wrap\">\n            @for (language of metadata.otherLanguages; track language) {\n              <p class=\"text-primary font-medium other-languages\" translate>\n                language.{{ language }}\n              </p>\n            }\n          </div>\n        </div>\n      }\n      @if (metadata.kind === 'dataset' && temporalExtent) {\n        <div data-test=\"details-panel-temporal-extent\">\n          <p class=\"text-sm\" translate>record.metadata.temporalExtent</p>\n          <div\n            class=\"flex flex-row gap-1 mb-1 text-primary font-medium temporal-extent\"\n          >\n            @if (temporalExtent.start && temporalExtent.end) {\n              <p\n                translate\n                [translateParams]=\"{\n                  start: temporalExtent.start,\n                  end: temporalExtent.end,\n                }\"\n              >\n                record.metadata.temporalExtent.fromDateToDate\n              </p>\n            }\n            @if (temporalExtent.start && !temporalExtent.end) {\n              <p translate [translateParams]=\"{ start: temporalExtent.start }\">\n                record.metadata.temporalExtent.sinceDate\n              </p>\n            }\n            @if (!temporalExtent.start && temporalExtent.end) {\n              <p translate [translateParams]=\"{ end: temporalExtent.end }\">\n                record.metadata.temporalExtent.untilDate\n              </p>\n            }\n          </div>\n        </div>\n      }\n    </div>\n  </gn-ui-expandable-panel>\n}\n@if (\n  metadata.kind !== 'dataset' &&\n  metadata.spatialExtents &&\n  metadata.spatialExtents.length\n) {\n  <gn-ui-expandable-panel\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}\n@if (metadata.landingPage) {\n  <gn-ui-expandable-panel\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      @if (metadata.recordUpdated) {\n        <div>\n          <p class=\"text-sm\" translate>record.metadata.updatedOn</p>\n          <p\n            class=\"text-primary font-medium\"\n            [gnUiHumanizeDate]=\"metadata.recordUpdated\"\n          ></p>\n        </div>\n      }\n      @if (metadata.landingPage) {\n        <div>\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>{{\n                metadata.landingPage\n              }}</span>\n            </a>\n          </p>\n        </div>\n      }\n      @if (metadata.ownerOrganization) {\n        <div>\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      }\n      @if (metadata.uniqueIdentifier) {\n        <div>\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      }\n      @if (metadata.topics?.length) {\n        <div>\n          <p class=\"text-sm mb-1\" translate>record.metadata.topics</p>\n          <div class=\"sm:pb-4 sm:pr-16\">\n            @for (topic of metadata.topics; track topic) {\n              <gn-ui-badge\n                [clickable]=\"false\"\n                class=\"inline-block mr-2 mb-2 lowercase\"\n                >{{ topic }}</gn-ui-badge\n              >\n            }\n          </div>\n        </div>\n      }\n    </div>\n  </gn-ui-expandable-panel>\n}\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)}\n"], dependencies: [{ kind: "directive", type: 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: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { 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: 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: "directive", type: GnUiHumanizeDateDirective, selector: "[gnUiHumanizeDate]", inputs: ["gnUiHumanizeDate"] }, { kind: "component", type: SpatialExtentComponent, selector: "gn-ui-spatial-extent", inputs: ["spatialExtents"] }, { kind: "component", type: ContactPillComponent, selector: "gn-ui-contact-pill", inputs: ["contact"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], viewProviders: [
             provideIcons({
                 matOpenInNew,
                 matMailOutline: matMailOutline$1,
@@ -34259,21 +34565,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                         TranslatePipe,
                         MarkdownParserComponent,
                         ExpandablePanelComponent,
+                        ButtonComponent,
                         BadgeComponent,
                         ContentGhostComponent,
-                        ThumbnailComponent,
                         MaxLinesComponent,
                         CopyTextButtonComponent,
                         NgIcon,
                         GnUiLinkifyDirective,
                         GnUiHumanizeDateDirective,
                         SpatialExtentComponent,
+                        ContactPillComponent,
                     ], viewProviders: [
                         provideIcons({
                             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    @if (metadata.abstract) {\n      <gn-ui-max-lines [maxLines]=\"6\" data-test=\"metadata-info-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    }\n  </gn-ui-content-ghost>\n\n  @if (!fieldReady('keywords') || metadata.keywords?.length) {\n    <p class=\"mt-6 mb-3 font-medium text-black text-sm\" translate>\n      record.metadata.keywords\n    </p>\n  }\n\n  <gn-ui-content-ghost\n    ghostClass=\"h-[31px] w-3/4\"\n    [showContent]=\"fieldReady('keywords')\"\n  >\n    @if (metadata.keywords?.length) {\n      <gn-ui-max-lines [maxLines]=\"7\">\n        <div class=\"metadata-info-keywords sm:pb-4 flex flex-wrap gap-2\">\n          @for (keyword of metadata.keywords; track keyword) {\n            <gn-ui-badge\n              class=\"inline-block lowercase\"\n              (click)=\"onKeywordClick(keyword)\"\n              [clickable]=\"true\"\n              >{{ keyword.label }}</gn-ui-badge\n            >\n          }\n        </div>\n      </gn-ui-max-lines>\n    }\n  </gn-ui-content-ghost>\n</div>\n\n@if (\n  metadata.licenses ||\n  metadata.legalConstraints ||\n  metadata.securityConstraints ||\n  metadata.otherConstraints\n) {\n  <gn-ui-expandable-panel\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      @for (license of licenses; track license) {\n        @if (license.url) {\n          <div 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        } @else {\n          <div class=\"text-primary\" gnUiLinkify>\n            {{ license.text }}\n          </div>\n        }\n      }\n      @if (legalConstraints.length) {\n        <div class=\"mb-6\">\n          @for (constraint of legalConstraints; track constraint) {\n            <gn-ui-markdown-parser [textContent]=\"constraint\">\n            </gn-ui-markdown-parser>\n          }\n        </div>\n      }\n      @if (otherConstraints.length) {\n        @for (constraint of otherConstraints; track constraint) {\n          <div gnUiLinkify>\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        }\n      }\n      @if (!hasUsage) {\n        <span class=\"noUsage\">\n          {{ 'record.metadata.noUsage' | translate }}\n        </span>\n      }\n    </div>\n  </gn-ui-expandable-panel>\n}\n@if (\n  (metadata.kind === 'dataset' && metadata.lineage) ||\n  resourceContact ||\n  metadata.resourceCreated ||\n  metadata.resourcePublished ||\n  metadata.resourceUpdated ||\n  (metadata.kind === 'dataset' && metadata.updateFrequency) ||\n  metadata.otherLanguages?.length ||\n  (metadata.kind === 'dataset' && temporalExtent)\n) {\n  <gn-ui-expandable-panel\n    [title]=\"'record.metadata.details' | translate\"\n    data-test=\"details-panel\"\n  >\n    @if (metadata.kind === 'dataset' && metadata.lineage) {\n      <div\n        class=\"text-gray-900 flex flex-col mt-4 gap-2\"\n        data-test=\"details-panel-lineage\"\n      >\n        <p class=\"whitespace-pre-line break-words text-gray-900\" gnUiLinkify>\n          {{ metadata.lineage }}\n        </p>\n      </div>\n    }\n    @if (resourceContact) {\n      <div\n        class=\"flex flex-row gap-6 mt-5 mb-8 resource-contact\"\n        data-test=\"details-panel-resource-contact\"\n      >\n        @if (resourceContact.organization?.logoUrl?.href) {\n          <div\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        }\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          @if (resourceContact.organization?.website) {\n            <div>\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          }\n          @if (resourceContact.email) {\n            <div class=\"mt-4\">\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                @if (resourceContact.email) {\n                  <a\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                }\n              </div>\n            </div>\n          }\n        </div>\n      </div>\n    }\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      @if (metadata.resourceCreated) {\n        <div data-test=\"details-panel-resource-created\">\n          <p class=\"text-sm\" translate>record.metadata.creation</p>\n          <p\n            class=\"text-primary font-medium mt-1 resource-created\"\n            [gnUiHumanizeDate]=\"metadata.resourceCreated\"\n          ></p>\n        </div>\n      }\n      @if (metadata.resourcePublished) {\n        <div data-test=\"details-panel-resource-published\">\n          <p class=\"text-sm\" translate>record.metadata.publication</p>\n          <p\n            class=\"text-primary font-medium mt-1 resource-published\"\n            [gnUiHumanizeDate]=\"metadata.resourcePublished\"\n          ></p>\n        </div>\n      }\n      @if (metadata.resourceUpdated) {\n        <div data-test=\"details-panel-resource-updated\">\n          <p class=\"text-sm\" translate>record.metadata.update</p>\n          <p\n            class=\"text-primary font-medium mt-1 resource-updated\"\n            [gnUiHumanizeDate]=\"metadata.resourceUpdated\"\n          ></p>\n        </div>\n      }\n      @if (metadata.kind === 'dataset' && metadata.updateFrequency) {\n        <div data-test=\"details-panel-update-frequency\">\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      }\n      @if (metadata.otherLanguages?.length) {\n        <div data-test=\"details-panel-other-languages\">\n          <p class=\"text-sm mb-1\" translate>record.metadata.languages</p>\n          <div class=\"flex flex-row gap-1 flex-wrap\">\n            @for (language of metadata.otherLanguages; track language) {\n              <p class=\"text-primary font-medium other-languages\" translate>\n                language.{{ language }}\n              </p>\n            }\n          </div>\n        </div>\n      }\n      @if (metadata.kind === 'dataset' && temporalExtent) {\n        <div data-test=\"details-panel-temporal-extent\">\n          <p class=\"text-sm\" translate>record.metadata.temporalExtent</p>\n          <div\n            class=\"flex flex-row gap-1 mb-1 text-primary font-medium temporal-extent\"\n          >\n            @if (temporalExtent.start && temporalExtent.end) {\n              <p\n                translate\n                [translateParams]=\"{\n                  start: temporalExtent.start,\n                  end: temporalExtent.end,\n                }\"\n              >\n                record.metadata.temporalExtent.fromDateToDate\n              </p>\n            }\n            @if (temporalExtent.start && !temporalExtent.end) {\n              <p translate [translateParams]=\"{ start: temporalExtent.start }\">\n                record.metadata.temporalExtent.sinceDate\n              </p>\n            }\n            @if (!temporalExtent.start && temporalExtent.end) {\n              <p translate [translateParams]=\"{ end: temporalExtent.end }\">\n                record.metadata.temporalExtent.untilDate\n              </p>\n            }\n          </div>\n        </div>\n      }\n    </div>\n  </gn-ui-expandable-panel>\n}\n@if (\n  metadata.kind !== 'dataset' &&\n  metadata.spatialExtents &&\n  metadata.spatialExtents.length\n) {\n  <gn-ui-expandable-panel\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}\n@if (metadata.landingPage) {\n  <gn-ui-expandable-panel\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      @if (metadata.recordUpdated) {\n        <div>\n          <p class=\"text-sm\" translate>record.metadata.updatedOn</p>\n          <p\n            class=\"text-primary font-medium\"\n            [gnUiHumanizeDate]=\"metadata.recordUpdated\"\n          ></p>\n        </div>\n      }\n      @if (metadata.landingPage) {\n        <div>\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>{{\n                metadata.landingPage\n              }}</span>\n            </a>\n          </p>\n        </div>\n      }\n      @if (metadata.ownerOrganization) {\n        <div>\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      }\n      @if (metadata.uniqueIdentifier) {\n        <div>\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      }\n      @if (metadata.topics?.length) {\n        <div>\n          <p class=\"text-sm mb-1\" translate>record.metadata.topics</p>\n          <div class=\"sm:pb-4 sm:pr-16\">\n            @for (topic of metadata.topics; track topic) {\n              <gn-ui-badge\n                [clickable]=\"false\"\n                class=\"inline-block mr-2 mb-2 lowercase\"\n                >{{ topic }}</gn-ui-badge\n              >\n            }\n          </div>\n        </div>\n      }\n    </div>\n  </gn-ui-expandable-panel>\n}\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    @if (metadata.abstract) {\n      <gn-ui-max-lines [maxLines]=\"6\" data-test=\"metadata-info-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    }\n  </gn-ui-content-ghost>\n\n  @if (!fieldReady('keywords') || metadata.keywords?.length) {\n    <p class=\"mt-6 mb-3 font-medium text-black text-sm\" translate>\n      record.metadata.keywords\n    </p>\n  }\n\n  <gn-ui-content-ghost\n    ghostClass=\"h-[31px] w-3/4\"\n    [showContent]=\"fieldReady('keywords')\"\n  >\n    @if (metadata.keywords?.length) {\n      <gn-ui-max-lines [maxLines]=\"7\">\n        <div class=\"metadata-info-keywords sm:pb-4 flex flex-wrap gap-2\">\n          @for (keyword of metadata.keywords; track keyword) {\n            <gn-ui-button\n              type=\"primary-light\"\n              class=\"inline-block opacity-70\"\n              extraClass=\"lowercase text-sm py-1 px-2\"\n              (buttonClick)=\"onKeywordClick(keyword)\"\n              >{{ keyword.label }}</gn-ui-button\n            >\n          }\n        </div>\n      </gn-ui-max-lines>\n    }\n  </gn-ui-content-ghost>\n</div>\n\n@if (\n  metadata.licenses ||\n  metadata.legalConstraints ||\n  metadata.securityConstraints ||\n  metadata.otherConstraints\n) {\n  <gn-ui-expandable-panel\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      @for (license of licenses; track $index) {\n        @if (license.url) {\n          <div 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        } @else {\n          <div class=\"text-primary\" gnUiLinkify>\n            {{ license.text }}\n          </div>\n        }\n      }\n      @if (legalConstraints.length) {\n        <div class=\"mb-6\">\n          @for (constraint of legalConstraints; track constraint) {\n            <gn-ui-markdown-parser [textContent]=\"constraint\">\n            </gn-ui-markdown-parser>\n          }\n        </div>\n      }\n      @if (otherConstraints.length) {\n        @for (constraint of otherConstraints; track constraint) {\n          <div gnUiLinkify>\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        }\n      }\n      @if (!hasUsage) {\n        <span class=\"noUsage\">\n          {{ 'record.metadata.noUsage' | translate }}\n        </span>\n      }\n    </div>\n  </gn-ui-expandable-panel>\n}\n@if (metadata.contactsForResource?.length) {\n  <gn-ui-expandable-panel\n    [title]=\"'record.metadata.resource.contacts' | translate\"\n    data-test=\"contacts-panel\"\n  >\n    <div class=\"flex flex-col gap-1 pt-3 pb-4\">\n      @for (group of contactGroups; track group.role) {\n        <div class=\"flex flex-col gap-1 rounded bg-gray-50 py-4 px-2\">\n          <p class=\"text-xs font-normal text-black\">\n            {{ group.roleLabel | translate }}\n          </p>\n          <div class=\"grid gap-1 grid-cols-1 md:grid-cols-2\">\n            @for (contact of group.contacts; track contact.email) {\n              <gn-ui-contact-pill [contact]=\"contact\"></gn-ui-contact-pill>\n            }\n          </div>\n        </div>\n      }\n    </div>\n  </gn-ui-expandable-panel>\n}\n@if (\n  (metadata.kind === 'dataset' && metadata.lineage) ||\n  metadata.resourceCreated ||\n  metadata.resourcePublished ||\n  metadata.resourceUpdated ||\n  (metadata.kind === 'dataset' && metadata.updateFrequency) ||\n  metadata.otherLanguages?.length ||\n  (metadata.kind === 'dataset' && temporalExtent)\n) {\n  <gn-ui-expandable-panel\n    [title]=\"'record.metadata.details' | translate\"\n    data-test=\"details-panel\"\n  >\n    @if (metadata.kind === 'dataset' && metadata.lineage) {\n      <div\n        class=\"text-gray-900 flex flex-col mt-4 gap-2\"\n        data-test=\"details-panel-lineage\"\n      >\n        <p class=\"whitespace-pre-line break-words text-gray-900\" gnUiLinkify>\n          {{ metadata.lineage }}\n        </p>\n      </div>\n    }\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      @if (metadata.resourceCreated) {\n        <div data-test=\"details-panel-resource-created\">\n          <p class=\"text-sm\" translate>record.metadata.creation</p>\n          <p\n            class=\"text-primary font-medium mt-1 resource-created\"\n            [gnUiHumanizeDate]=\"metadata.resourceCreated\"\n          ></p>\n        </div>\n      }\n      @if (metadata.resourcePublished) {\n        <div data-test=\"details-panel-resource-published\">\n          <p class=\"text-sm\" translate>record.metadata.publication</p>\n          <p\n            class=\"text-primary font-medium mt-1 resource-published\"\n            [gnUiHumanizeDate]=\"metadata.resourcePublished\"\n          ></p>\n        </div>\n      }\n      @if (metadata.resourceUpdated) {\n        <div data-test=\"details-panel-resource-updated\">\n          <p class=\"text-sm\" translate>record.metadata.update</p>\n          <p\n            class=\"text-primary font-medium mt-1 resource-updated\"\n            [gnUiHumanizeDate]=\"metadata.resourceUpdated\"\n          ></p>\n        </div>\n      }\n      @if (metadata.kind === 'dataset' && metadata.updateFrequency) {\n        <div data-test=\"details-panel-update-frequency\">\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      }\n      @if (metadata.otherLanguages?.length) {\n        <div data-test=\"details-panel-other-languages\">\n          <p class=\"text-sm mb-1\" translate>record.metadata.languages</p>\n          <div class=\"flex flex-row gap-1 flex-wrap\">\n            @for (language of metadata.otherLanguages; track language) {\n              <p class=\"text-primary font-medium other-languages\" translate>\n                language.{{ language }}\n              </p>\n            }\n          </div>\n        </div>\n      }\n      @if (metadata.kind === 'dataset' && temporalExtent) {\n        <div data-test=\"details-panel-temporal-extent\">\n          <p class=\"text-sm\" translate>record.metadata.temporalExtent</p>\n          <div\n            class=\"flex flex-row gap-1 mb-1 text-primary font-medium temporal-extent\"\n          >\n            @if (temporalExtent.start && temporalExtent.end) {\n              <p\n                translate\n                [translateParams]=\"{\n                  start: temporalExtent.start,\n                  end: temporalExtent.end,\n                }\"\n              >\n                record.metadata.temporalExtent.fromDateToDate\n              </p>\n            }\n            @if (temporalExtent.start && !temporalExtent.end) {\n              <p translate [translateParams]=\"{ start: temporalExtent.start }\">\n                record.metadata.temporalExtent.sinceDate\n              </p>\n            }\n            @if (!temporalExtent.start && temporalExtent.end) {\n              <p translate [translateParams]=\"{ end: temporalExtent.end }\">\n                record.metadata.temporalExtent.untilDate\n              </p>\n            }\n          </div>\n        </div>\n      }\n    </div>\n  </gn-ui-expandable-panel>\n}\n@if (\n  metadata.kind !== 'dataset' &&\n  metadata.spatialExtents &&\n  metadata.spatialExtents.length\n) {\n  <gn-ui-expandable-panel\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}\n@if (metadata.landingPage) {\n  <gn-ui-expandable-panel\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      @if (metadata.recordUpdated) {\n        <div>\n          <p class=\"text-sm\" translate>record.metadata.updatedOn</p>\n          <p\n            class=\"text-primary font-medium\"\n            [gnUiHumanizeDate]=\"metadata.recordUpdated\"\n          ></p>\n        </div>\n      }\n      @if (metadata.landingPage) {\n        <div>\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>{{\n                metadata.landingPage\n              }}</span>\n            </a>\n          </p>\n        </div>\n      }\n      @if (metadata.ownerOrganization) {\n        <div>\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      }\n      @if (metadata.uniqueIdentifier) {\n        <div>\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      }\n      @if (metadata.topics?.length) {\n        <div>\n          <p class=\"text-sm mb-1\" translate>record.metadata.topics</p>\n          <div class=\"sm:pb-4 sm:pr-16\">\n            @for (topic of metadata.topics; track topic) {\n              <gn-ui-badge\n                [clickable]=\"false\"\n                class=\"inline-block mr-2 mb-2 lowercase\"\n                >{{ topic }}</gn-ui-badge\n              >\n            }\n          </div>\n        </div>\n      }\n    </div>\n  </gn-ui-expandable-panel>\n}\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)}\n"] }]
         }], propDecorators: { metadata: [{
                 type: Input
             }], incomplete: [{
@@ -34743,7 +35050,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
 class InternalLinkCardComponent {
     constructor() {
         this.elementRef = inject(ElementRef);
-        this.linkTarget = '_blank';
         this.linkHref = null;
         this.mdSelect = new EventEmitter();
         this.subscription = new Subscription();
@@ -34771,7 +35077,7 @@ class InternalLinkCardComponent {
             cardWidth <= 490);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: InternalLinkCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: InternalLinkCardComponent, isStandalone: true, selector: "gn-ui-internal-link-card", inputs: { record: "record", linkTarget: "linkTarget", linkHref: "linkHref", metadataQualityDisplay: "metadataQualityDisplay", favoriteTemplate: "favoriteTemplate", size: "size" }, outputs: { mdSelect: "mdSelect" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: InternalLinkCardComponent, isStandalone: true, selector: "gn-ui-internal-link-card", inputs: { record: "record", linkHref: "linkHref", metadataQualityDisplay: "metadataQualityDisplay", favoriteTemplate: "favoriteTemplate", size: "size" }, outputs: { mdSelect: "mdSelect" }, providers: [
             provideIcons({
                 iconoirBank,
                 matLocationSearchingOutline,
@@ -34779,7 +35085,7 @@ class InternalLinkCardComponent {
             provideNgIconsConfig({
                 size: '1.2em',
             }),
-        ], ngImport: i0, template: "<a\n  [attr.href]=\"linkHref\"\n  [target]=\"linkTarget\"\n  class=\"record-card\"\n  [ngClass]=\"cardClass\"\n>\n  @if (shouldShowThumbnail) {\n    <div class=\"record-card__thumbnail\">\n      <gn-ui-thumbnail\n        class=\"w-full h-full object-cover\"\n        [thumbnailUrl]=\"record.overviews?.[0]?.url?.toString() || ''\"\n        [fit]=\"'cover'\"\n      ></gn-ui-thumbnail>\n    </div>\n  }\n  <div class=\"grow pt-1\" [ngClass]=\"shouldShowThumbnail ? 'sm:w-0' : ''\">\n    <div class=\"flex flex-col gap-2\" [class.h-full]=\"size !== 'M'\">\n      <h4\n        class=\"record-card__title\"\n        data-cy=\"recordTitle\"\n        [title]=\"record.title\"\n      >\n        {{ record.title }}\n      </h4>\n      <!-- force max width here as long a-href urls within the markdown parser can cause layout issues -->\n      <div class=\"grow max-w-[248px] sm:max-w-full\">\n        <gn-ui-markdown-parser\n          data-cy=\"recordAbstract\"\n          [textContent]=\"abstract\"\n          [whitoutStyles]=\"true\"\n          class=\"record-card__abstract\"\n          [title]=\"abstract\"\n        ></gn-ui-markdown-parser>\n      </div>\n      @if (size !== 'M') {\n        <ng-container [ngTemplateOutlet]=\"footerTpl\"></ng-container>\n      }\n    </div>\n  </div>\n  @if (size === 'M') {\n    <ng-container [ngTemplateOutlet]=\"footerTpl\"></ng-container>\n  }\n</a>\n\n<ng-template #footerTpl>\n  <div class=\"record-card__footer\">\n    @if (record.ownerOrganization?.name) {\n      <div\n        data-cy=\"recordOrg\"\n        class=\"grow flex flex-row gap-1 items-center text-primary-lighter\"\n        [ngClass]=\"displayContactIconOnly ? 'justify-center' : ''\"\n      >\n        <ng-icon\n          name=\"iconoirBank\"\n          class=\"text-primary -translate-y-[0.5px] shrink-0\"\n          [title]=\"record.ownerOrganization.name\"\n        ></ng-icon>\n        @if (!displayContactIconOnly) {\n          <span\n            data-cy=\"recordOrgName\"\n            class=\"line-clamp-1\"\n            [title]=\"record.ownerOrganization.name\"\n            >{{ record.ownerOrganization.name }}</span\n          >\n        }\n      </div>\n    }\n    <div class=\"record-card__footer__other\">\n      <div class=\"xs:border-r last:border-r-0 flex grow gap-4 px-4 last:pr-0\">\n        <gn-ui-kind-badge\n          [extraClass]=\"'text-[1.2em]'\"\n          [styling]=\"'gray'\"\n          [kind]=\"record?.kind\"\n          [contentTemplate]=\"customTemplate\"\n          class=\"pt-1\"\n        >\n          <ng-template #customTemplate></ng-template\n        ></gn-ui-kind-badge>\n        @if (metadataQualityDisplay) {\n          <gn-ui-metadata-quality\n            class=\"flex items-center min-w-[113px]\"\n            [smaller]=\"true\"\n            [metadata]=\"record\"\n            [metadataQualityDisplay]=\"metadataQualityDisplay\"\n            [popoverDisplay]=\"true\"\n          ></gn-ui-metadata-quality>\n        }\n      </div>\n      <div\n        class=\"flex justify-center\"\n        data-cy=\"recordFav\"\n        [ngClass]=\"displayContactIconOnly ? 'px-1' : 'px-4'\"\n      >\n        <ng-container\n          [ngTemplateOutlet]=\"favoriteTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: record }\"\n        ></ng-container>\n      </div>\n    </div>\n  </div>\n</ng-template>\n", styles: [".record-card{@apply rounded-md bg-white hover:cursor-pointer hover:bg-slate-50 overflow-hidden items-stretch flex flex-row md:gap-0 justify-between py-3 pl-3 pr-5;}.record-card.size-L{@apply w-full md:h-[208px] gap-5;}.record-card.size-M{@apply max-w-[940px] gap-4 flex-wrap;}.record-card.size-S{@apply max-w-[572px] md:h-[315px] gap-4;}.record-card.size-XS{@apply max-w-[280px] md:h-[315px] gap-4;}.record-card:hover .record-card__title{@apply text-primary;}.record-card__thumbnail{@apply border rounded-lg overflow-hidden shrink-0;}.size-L .record-card__thumbnail{@apply w-[184px] h-[184px];}.size-M .record-card__thumbnail{@apply w-[138px] h-[138px];}.record-card__title{@apply text-xl font-medium text-title leading-6;}.size-L .record-card__title,.size-M .record-card__title{@apply line-clamp-2;}.size-S .record-card__title,.size-XS .record-card__title{@apply line-clamp-3 ml-2;}.record-card__abstract{@apply text-gray-900 overflow-hidden;}.size-L .record-card__abstract,.size-M .record-card__abstract{@apply line-clamp-3;}.size-S .record-card__abstract,.size-XS .record-card__abstract{@apply line-clamp-4 ml-2;}.record-card__footer{@apply flex sm:flex-row flex-col flex-nowrap gap-3 justify-end items-center w-full border-t pt-1 overflow-hidden;}@media (max-width: 450px){.size-S .record-card__footer{@apply flex-col items-stretch;}}.size-XS .record-card__footer{@apply flex-col items-stretch gap-2;}.record-card__footer__other{@apply flex flex-col xs:flex-row flex-nowrap gap-3 xs:border-l first:border-l-0;}.record-card__footer__other>div{@apply py-1;}@media (max-width: 450px){.size-S .record-card__footer__other,.size-S .record-card__footer__other>div{@apply border-0 px-0 py-0;}}.size-XS .record-card__footer__other,.size-XS .record-card__footer__other>div{@apply border-0;}.size-XS .record-card__footer__other>div{@apply px-0 py-0;}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: MetadataQualityComponent, selector: "gn-ui-metadata-quality", inputs: ["metadata", "smaller", "metadataQualityDisplay", "popoverDisplay", "propsToValidate", "forceComputeScore"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: KindBadgeComponent, selector: "gn-ui-kind-badge", inputs: ["styling", "contentTemplate", "kind", "extraClass"] }, { kind: "component", type: MarkdownParserComponent, selector: "gn-ui-markdown-parser", inputs: ["textContent", "whitoutStyles"] }, { kind: "component", type: ThumbnailComponent, selector: "gn-ui-thumbnail", inputs: ["thumbnailUrl", "fit"], outputs: ["placeholderShown"] }] }); }
+        ], ngImport: i0, template: "<a\n  [attr.href]=\"linkHref\"\n  target=\"_self\"\n  class=\"record-card\"\n  [ngClass]=\"cardClass\"\n>\n  @if (shouldShowThumbnail) {\n    <div class=\"record-card__thumbnail\">\n      <gn-ui-thumbnail\n        class=\"w-full h-full object-cover\"\n        [thumbnailUrl]=\"record.overviews?.[0]?.url?.toString() || ''\"\n        [fit]=\"'cover'\"\n      ></gn-ui-thumbnail>\n    </div>\n  }\n  <div class=\"grow pt-1\" [ngClass]=\"shouldShowThumbnail ? 'sm:w-0' : ''\">\n    <div class=\"flex flex-col gap-2\" [class.h-full]=\"size !== 'M'\">\n      <h4\n        class=\"record-card__title\"\n        data-cy=\"recordTitle\"\n        [title]=\"record.title\"\n      >\n        {{ record.title }}\n      </h4>\n      <!-- force max width here as long a-href urls within the markdown parser can cause layout issues -->\n      <div class=\"grow max-w-[248px] sm:max-w-full\">\n        <gn-ui-markdown-parser\n          data-cy=\"recordAbstract\"\n          [textContent]=\"abstract\"\n          [whitoutStyles]=\"true\"\n          class=\"record-card__abstract\"\n          [title]=\"abstract\"\n        ></gn-ui-markdown-parser>\n      </div>\n      @if (size !== 'M') {\n        <ng-container [ngTemplateOutlet]=\"footerTpl\"></ng-container>\n      }\n    </div>\n  </div>\n  @if (size === 'M') {\n    <ng-container [ngTemplateOutlet]=\"footerTpl\"></ng-container>\n  }\n</a>\n\n<ng-template #footerTpl>\n  <div class=\"record-card__footer\">\n    @if (record.ownerOrganization?.name) {\n      <div\n        data-cy=\"recordOrg\"\n        class=\"grow flex flex-row gap-1 items-center text-primary-lighter\"\n        [ngClass]=\"displayContactIconOnly ? 'justify-center' : ''\"\n      >\n        <ng-icon\n          name=\"iconoirBank\"\n          class=\"text-primary -translate-y-[0.5px] shrink-0\"\n          [title]=\"record.ownerOrganization.name\"\n        ></ng-icon>\n        @if (!displayContactIconOnly) {\n          <span\n            data-cy=\"recordOrgName\"\n            class=\"line-clamp-1\"\n            [title]=\"record.ownerOrganization.name\"\n            >{{ record.ownerOrganization.name }}</span\n          >\n        }\n      </div>\n    }\n    <div class=\"record-card__footer__other\">\n      <div class=\"xs:border-r last:border-r-0 flex grow gap-4 px-4 last:pr-0\">\n        <gn-ui-kind-badge\n          [extraClass]=\"'text-[1.2em]'\"\n          [styling]=\"'gray'\"\n          [kind]=\"record?.kind\"\n          [contentTemplate]=\"customTemplate\"\n          class=\"pt-1\"\n        >\n          <ng-template #customTemplate></ng-template\n        ></gn-ui-kind-badge>\n        @if (metadataQualityDisplay) {\n          <gn-ui-metadata-quality\n            class=\"flex items-center min-w-[113px]\"\n            [smaller]=\"true\"\n            [metadata]=\"record\"\n            [metadataQualityDisplay]=\"metadataQualityDisplay\"\n            [popoverDisplay]=\"true\"\n          ></gn-ui-metadata-quality>\n        }\n      </div>\n      <div\n        class=\"flex justify-center\"\n        data-cy=\"recordFav\"\n        [ngClass]=\"displayContactIconOnly ? 'px-1' : 'px-4'\"\n      >\n        <ng-container\n          [ngTemplateOutlet]=\"favoriteTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: record }\"\n        ></ng-container>\n      </div>\n    </div>\n  </div>\n</ng-template>\n", styles: [".record-card{@apply rounded-md bg-white hover:cursor-pointer hover:bg-slate-50 overflow-hidden items-stretch flex flex-row md:gap-0 justify-between py-3 pl-3 pr-5;}.record-card.size-L{@apply w-full md:h-[208px] gap-5;}.record-card.size-M{@apply max-w-[940px] gap-4 flex-wrap;}.record-card.size-S{@apply max-w-[572px] md:h-[315px] gap-4;}.record-card.size-XS{@apply max-w-[280px] md:h-[315px] gap-4;}.record-card:hover .record-card__title{@apply text-primary;}.record-card__thumbnail{@apply border rounded-lg overflow-hidden shrink-0;}.size-L .record-card__thumbnail{@apply w-[184px] h-[184px];}.size-M .record-card__thumbnail{@apply w-[138px] h-[138px];}.record-card__title{@apply text-xl font-medium text-title leading-6;}.size-L .record-card__title,.size-M .record-card__title{@apply line-clamp-2;}.size-S .record-card__title,.size-XS .record-card__title{@apply line-clamp-3 ml-2;}.record-card__abstract{@apply text-gray-900 overflow-hidden;}.size-L .record-card__abstract,.size-M .record-card__abstract{@apply line-clamp-3;}.size-S .record-card__abstract,.size-XS .record-card__abstract{@apply line-clamp-4 ml-2;}.record-card__footer{@apply flex sm:flex-row flex-col flex-nowrap gap-3 justify-end items-center w-full border-t pt-1 overflow-hidden;}@media (max-width: 450px){.size-S .record-card__footer{@apply flex-col items-stretch;}}.size-XS .record-card__footer{@apply flex-col items-stretch gap-2;}.record-card__footer__other{@apply flex flex-col xs:flex-row flex-nowrap gap-3 xs:border-l first:border-l-0;}.record-card__footer__other>div{@apply py-1;}@media (max-width: 450px){.size-S .record-card__footer__other,.size-S .record-card__footer__other>div{@apply border-0 px-0 py-0;}}.size-XS .record-card__footer__other,.size-XS .record-card__footer__other>div{@apply border-0;}.size-XS .record-card__footer__other>div{@apply px-0 py-0;}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: MetadataQualityComponent, selector: "gn-ui-metadata-quality", inputs: ["metadata", "smaller", "metadataQualityDisplay", "popoverDisplay", "propsToValidate", "forceComputeScore"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: KindBadgeComponent, selector: "gn-ui-kind-badge", inputs: ["styling", "contentTemplate", "kind", "extraClass"] }, { kind: "component", type: MarkdownParserComponent, selector: "gn-ui-markdown-parser", inputs: ["textContent", "whitoutStyles"] }, { kind: "component", type: ThumbnailComponent, selector: "gn-ui-thumbnail", inputs: ["thumbnailUrl", "fit"], outputs: ["placeholderShown"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: InternalLinkCardComponent, decorators: [{
             type: Component,
@@ -34799,11 +35105,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                         provideNgIconsConfig({
                             size: '1.2em',
                         }),
-                    ], template: "<a\n  [attr.href]=\"linkHref\"\n  [target]=\"linkTarget\"\n  class=\"record-card\"\n  [ngClass]=\"cardClass\"\n>\n  @if (shouldShowThumbnail) {\n    <div class=\"record-card__thumbnail\">\n      <gn-ui-thumbnail\n        class=\"w-full h-full object-cover\"\n        [thumbnailUrl]=\"record.overviews?.[0]?.url?.toString() || ''\"\n        [fit]=\"'cover'\"\n      ></gn-ui-thumbnail>\n    </div>\n  }\n  <div class=\"grow pt-1\" [ngClass]=\"shouldShowThumbnail ? 'sm:w-0' : ''\">\n    <div class=\"flex flex-col gap-2\" [class.h-full]=\"size !== 'M'\">\n      <h4\n        class=\"record-card__title\"\n        data-cy=\"recordTitle\"\n        [title]=\"record.title\"\n      >\n        {{ record.title }}\n      </h4>\n      <!-- force max width here as long a-href urls within the markdown parser can cause layout issues -->\n      <div class=\"grow max-w-[248px] sm:max-w-full\">\n        <gn-ui-markdown-parser\n          data-cy=\"recordAbstract\"\n          [textContent]=\"abstract\"\n          [whitoutStyles]=\"true\"\n          class=\"record-card__abstract\"\n          [title]=\"abstract\"\n        ></gn-ui-markdown-parser>\n      </div>\n      @if (size !== 'M') {\n        <ng-container [ngTemplateOutlet]=\"footerTpl\"></ng-container>\n      }\n    </div>\n  </div>\n  @if (size === 'M') {\n    <ng-container [ngTemplateOutlet]=\"footerTpl\"></ng-container>\n  }\n</a>\n\n<ng-template #footerTpl>\n  <div class=\"record-card__footer\">\n    @if (record.ownerOrganization?.name) {\n      <div\n        data-cy=\"recordOrg\"\n        class=\"grow flex flex-row gap-1 items-center text-primary-lighter\"\n        [ngClass]=\"displayContactIconOnly ? 'justify-center' : ''\"\n      >\n        <ng-icon\n          name=\"iconoirBank\"\n          class=\"text-primary -translate-y-[0.5px] shrink-0\"\n          [title]=\"record.ownerOrganization.name\"\n        ></ng-icon>\n        @if (!displayContactIconOnly) {\n          <span\n            data-cy=\"recordOrgName\"\n            class=\"line-clamp-1\"\n            [title]=\"record.ownerOrganization.name\"\n            >{{ record.ownerOrganization.name }}</span\n          >\n        }\n      </div>\n    }\n    <div class=\"record-card__footer__other\">\n      <div class=\"xs:border-r last:border-r-0 flex grow gap-4 px-4 last:pr-0\">\n        <gn-ui-kind-badge\n          [extraClass]=\"'text-[1.2em]'\"\n          [styling]=\"'gray'\"\n          [kind]=\"record?.kind\"\n          [contentTemplate]=\"customTemplate\"\n          class=\"pt-1\"\n        >\n          <ng-template #customTemplate></ng-template\n        ></gn-ui-kind-badge>\n        @if (metadataQualityDisplay) {\n          <gn-ui-metadata-quality\n            class=\"flex items-center min-w-[113px]\"\n            [smaller]=\"true\"\n            [metadata]=\"record\"\n            [metadataQualityDisplay]=\"metadataQualityDisplay\"\n            [popoverDisplay]=\"true\"\n          ></gn-ui-metadata-quality>\n        }\n      </div>\n      <div\n        class=\"flex justify-center\"\n        data-cy=\"recordFav\"\n        [ngClass]=\"displayContactIconOnly ? 'px-1' : 'px-4'\"\n      >\n        <ng-container\n          [ngTemplateOutlet]=\"favoriteTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: record }\"\n        ></ng-container>\n      </div>\n    </div>\n  </div>\n</ng-template>\n", styles: [".record-card{@apply rounded-md bg-white hover:cursor-pointer hover:bg-slate-50 overflow-hidden items-stretch flex flex-row md:gap-0 justify-between py-3 pl-3 pr-5;}.record-card.size-L{@apply w-full md:h-[208px] gap-5;}.record-card.size-M{@apply max-w-[940px] gap-4 flex-wrap;}.record-card.size-S{@apply max-w-[572px] md:h-[315px] gap-4;}.record-card.size-XS{@apply max-w-[280px] md:h-[315px] gap-4;}.record-card:hover .record-card__title{@apply text-primary;}.record-card__thumbnail{@apply border rounded-lg overflow-hidden shrink-0;}.size-L .record-card__thumbnail{@apply w-[184px] h-[184px];}.size-M .record-card__thumbnail{@apply w-[138px] h-[138px];}.record-card__title{@apply text-xl font-medium text-title leading-6;}.size-L .record-card__title,.size-M .record-card__title{@apply line-clamp-2;}.size-S .record-card__title,.size-XS .record-card__title{@apply line-clamp-3 ml-2;}.record-card__abstract{@apply text-gray-900 overflow-hidden;}.size-L .record-card__abstract,.size-M .record-card__abstract{@apply line-clamp-3;}.size-S .record-card__abstract,.size-XS .record-card__abstract{@apply line-clamp-4 ml-2;}.record-card__footer{@apply flex sm:flex-row flex-col flex-nowrap gap-3 justify-end items-center w-full border-t pt-1 overflow-hidden;}@media (max-width: 450px){.size-S .record-card__footer{@apply flex-col items-stretch;}}.size-XS .record-card__footer{@apply flex-col items-stretch gap-2;}.record-card__footer__other{@apply flex flex-col xs:flex-row flex-nowrap gap-3 xs:border-l first:border-l-0;}.record-card__footer__other>div{@apply py-1;}@media (max-width: 450px){.size-S .record-card__footer__other,.size-S .record-card__footer__other>div{@apply border-0 px-0 py-0;}}.size-XS .record-card__footer__other,.size-XS .record-card__footer__other>div{@apply border-0;}.size-XS .record-card__footer__other>div{@apply px-0 py-0;}\n"] }]
+                    ], template: "<a\n  [attr.href]=\"linkHref\"\n  target=\"_self\"\n  class=\"record-card\"\n  [ngClass]=\"cardClass\"\n>\n  @if (shouldShowThumbnail) {\n    <div class=\"record-card__thumbnail\">\n      <gn-ui-thumbnail\n        class=\"w-full h-full object-cover\"\n        [thumbnailUrl]=\"record.overviews?.[0]?.url?.toString() || ''\"\n        [fit]=\"'cover'\"\n      ></gn-ui-thumbnail>\n    </div>\n  }\n  <div class=\"grow pt-1\" [ngClass]=\"shouldShowThumbnail ? 'sm:w-0' : ''\">\n    <div class=\"flex flex-col gap-2\" [class.h-full]=\"size !== 'M'\">\n      <h4\n        class=\"record-card__title\"\n        data-cy=\"recordTitle\"\n        [title]=\"record.title\"\n      >\n        {{ record.title }}\n      </h4>\n      <!-- force max width here as long a-href urls within the markdown parser can cause layout issues -->\n      <div class=\"grow max-w-[248px] sm:max-w-full\">\n        <gn-ui-markdown-parser\n          data-cy=\"recordAbstract\"\n          [textContent]=\"abstract\"\n          [whitoutStyles]=\"true\"\n          class=\"record-card__abstract\"\n          [title]=\"abstract\"\n        ></gn-ui-markdown-parser>\n      </div>\n      @if (size !== 'M') {\n        <ng-container [ngTemplateOutlet]=\"footerTpl\"></ng-container>\n      }\n    </div>\n  </div>\n  @if (size === 'M') {\n    <ng-container [ngTemplateOutlet]=\"footerTpl\"></ng-container>\n  }\n</a>\n\n<ng-template #footerTpl>\n  <div class=\"record-card__footer\">\n    @if (record.ownerOrganization?.name) {\n      <div\n        data-cy=\"recordOrg\"\n        class=\"grow flex flex-row gap-1 items-center text-primary-lighter\"\n        [ngClass]=\"displayContactIconOnly ? 'justify-center' : ''\"\n      >\n        <ng-icon\n          name=\"iconoirBank\"\n          class=\"text-primary -translate-y-[0.5px] shrink-0\"\n          [title]=\"record.ownerOrganization.name\"\n        ></ng-icon>\n        @if (!displayContactIconOnly) {\n          <span\n            data-cy=\"recordOrgName\"\n            class=\"line-clamp-1\"\n            [title]=\"record.ownerOrganization.name\"\n            >{{ record.ownerOrganization.name }}</span\n          >\n        }\n      </div>\n    }\n    <div class=\"record-card__footer__other\">\n      <div class=\"xs:border-r last:border-r-0 flex grow gap-4 px-4 last:pr-0\">\n        <gn-ui-kind-badge\n          [extraClass]=\"'text-[1.2em]'\"\n          [styling]=\"'gray'\"\n          [kind]=\"record?.kind\"\n          [contentTemplate]=\"customTemplate\"\n          class=\"pt-1\"\n        >\n          <ng-template #customTemplate></ng-template\n        ></gn-ui-kind-badge>\n        @if (metadataQualityDisplay) {\n          <gn-ui-metadata-quality\n            class=\"flex items-center min-w-[113px]\"\n            [smaller]=\"true\"\n            [metadata]=\"record\"\n            [metadataQualityDisplay]=\"metadataQualityDisplay\"\n            [popoverDisplay]=\"true\"\n          ></gn-ui-metadata-quality>\n        }\n      </div>\n      <div\n        class=\"flex justify-center\"\n        data-cy=\"recordFav\"\n        [ngClass]=\"displayContactIconOnly ? 'px-1' : 'px-4'\"\n      >\n        <ng-container\n          [ngTemplateOutlet]=\"favoriteTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: record }\"\n        ></ng-container>\n      </div>\n    </div>\n  </div>\n</ng-template>\n", styles: [".record-card{@apply rounded-md bg-white hover:cursor-pointer hover:bg-slate-50 overflow-hidden items-stretch flex flex-row md:gap-0 justify-between py-3 pl-3 pr-5;}.record-card.size-L{@apply w-full md:h-[208px] gap-5;}.record-card.size-M{@apply max-w-[940px] gap-4 flex-wrap;}.record-card.size-S{@apply max-w-[572px] md:h-[315px] gap-4;}.record-card.size-XS{@apply max-w-[280px] md:h-[315px] gap-4;}.record-card:hover .record-card__title{@apply text-primary;}.record-card__thumbnail{@apply border rounded-lg overflow-hidden shrink-0;}.size-L .record-card__thumbnail{@apply w-[184px] h-[184px];}.size-M .record-card__thumbnail{@apply w-[138px] h-[138px];}.record-card__title{@apply text-xl font-medium text-title leading-6;}.size-L .record-card__title,.size-M .record-card__title{@apply line-clamp-2;}.size-S .record-card__title,.size-XS .record-card__title{@apply line-clamp-3 ml-2;}.record-card__abstract{@apply text-gray-900 overflow-hidden;}.size-L .record-card__abstract,.size-M .record-card__abstract{@apply line-clamp-3;}.size-S .record-card__abstract,.size-XS .record-card__abstract{@apply line-clamp-4 ml-2;}.record-card__footer{@apply flex sm:flex-row flex-col flex-nowrap gap-3 justify-end items-center w-full border-t pt-1 overflow-hidden;}@media (max-width: 450px){.size-S .record-card__footer{@apply flex-col items-stretch;}}.size-XS .record-card__footer{@apply flex-col items-stretch gap-2;}.record-card__footer__other{@apply flex flex-col xs:flex-row flex-nowrap gap-3 xs:border-l first:border-l-0;}.record-card__footer__other>div{@apply py-1;}@media (max-width: 450px){.size-S .record-card__footer__other,.size-S .record-card__footer__other>div{@apply border-0 px-0 py-0;}}.size-XS .record-card__footer__other,.size-XS .record-card__footer__other>div{@apply border-0;}.size-XS .record-card__footer__other>div{@apply px-0 py-0;}\n"] }]
         }], propDecorators: { record: [{
                 type: Input
-            }], linkTarget: [{
-                type: Input
             }], linkHref: [{
                 type: Input
             }], metadataQualityDisplay: [{
@@ -35407,11 +35711,11 @@ class RecordPreviewRowComponent extends RecordPreviewComponent {
             this.size = 'L';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: RecordPreviewRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: RecordPreviewRowComponent, isStandalone: true, selector: "gn-ui-record-preview-row", host: { listeners: { "window:resize": "onResize()" } }, usesInheritance: true, ngImport: i0, template: "<gn-ui-internal-link-card\n  [linkHref]=\"linkHref\"\n  [linkTarget]=\"linkTarget\"\n  [record]=\"record\"\n  [favoriteTemplate]=\"favoriteTemplate\"\n  [metadataQualityDisplay]=\"metadataQualityDisplay\"\n  (mdSelect)=\"mdSelect.emit($event)\"\n  [size]=\"size\"\n>\n</gn-ui-internal-link-card>\n", styles: [".limit-organisation-with-quality{max-width:calc(100% - 170px)}\n"], dependencies: [{ kind: "component", type: InternalLinkCardComponent, selector: "gn-ui-internal-link-card", inputs: ["record", "linkTarget", "linkHref", "metadataQualityDisplay", "favoriteTemplate", "size"], outputs: ["mdSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: RecordPreviewRowComponent, isStandalone: true, selector: "gn-ui-record-preview-row", host: { listeners: { "window:resize": "onResize()" } }, usesInheritance: true, ngImport: i0, template: "<gn-ui-internal-link-card\n  [linkHref]=\"linkHref\"\n  [record]=\"record\"\n  [favoriteTemplate]=\"favoriteTemplate\"\n  [metadataQualityDisplay]=\"metadataQualityDisplay\"\n  (mdSelect)=\"mdSelect.emit($event)\"\n  [size]=\"size\"\n>\n</gn-ui-internal-link-card>\n", styles: [".limit-organisation-with-quality{max-width:calc(100% - 170px)}\n"], dependencies: [{ kind: "component", type: InternalLinkCardComponent, selector: "gn-ui-internal-link-card", inputs: ["record", "linkHref", "metadataQualityDisplay", "favoriteTemplate", "size"], outputs: ["mdSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: RecordPreviewRowComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-record-preview-row', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [InternalLinkCardComponent], template: "<gn-ui-internal-link-card\n  [linkHref]=\"linkHref\"\n  [linkTarget]=\"linkTarget\"\n  [record]=\"record\"\n  [favoriteTemplate]=\"favoriteTemplate\"\n  [metadataQualityDisplay]=\"metadataQualityDisplay\"\n  (mdSelect)=\"mdSelect.emit($event)\"\n  [size]=\"size\"\n>\n</gn-ui-internal-link-card>\n", styles: [".limit-organisation-with-quality{max-width:calc(100% - 170px)}\n"] }]
+            args: [{ selector: 'gn-ui-record-preview-row', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [InternalLinkCardComponent], template: "<gn-ui-internal-link-card\n  [linkHref]=\"linkHref\"\n  [record]=\"record\"\n  [favoriteTemplate]=\"favoriteTemplate\"\n  [metadataQualityDisplay]=\"metadataQualityDisplay\"\n  (mdSelect)=\"mdSelect.emit($event)\"\n  [size]=\"size\"\n>\n</gn-ui-internal-link-card>\n", styles: [".limit-organisation-with-quality{max-width:calc(100% - 170px)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { onResize: [{
                 type: HostListener,
                 args: ['window:resize']
@@ -41210,6 +41514,7 @@ const hasRecordChangedSinceDraft = createAction('[Editor] Has Record Changed Sin
 const hasRecordChangedSinceDraftSuccess = createAction('[Editor] Has Record Changed Since Draft Success', props());
 const isPublished = createAction('[Editor] Record Saved But Not Published', props());
 const canEditRecord = createAction('[Editor] User can edit record', props());
+const setFocusedField = createAction('[Editor] Set focused field', props());
 
 /**
  * This file contains the configuration of the fields that will be displayed in the editor.
@@ -41711,6 +42016,7 @@ class EditorFacade {
         this.hasRecordChanged$ = this.store.pipe(select(selectHasRecordChanged));
         this.isPublished$ = this.store.pipe(select(selectIsPublished));
         this.canEditRecord$ = this.store.pipe(select(selectCanEditRecord));
+        this.focusedField$ = this.actions$.pipe(ofType(setFocusedField), map$2(({ model }) => model));
     }
     openRecord(record, recordSource) {
         this.store.dispatch(openRecord({
@@ -41737,6 +42043,9 @@ class EditorFacade {
     setCurrentPage(page) {
         this.store.dispatch(setCurrentPage({ page }));
     }
+    setFocusedField(model) {
+        this.store.dispatch(setFocusedField({ model }));
+    }
     setFieldVisibility(field, visible) {
         this.store.dispatch(setFieldVisibility({ field, visible }));
     }
@@ -41858,37 +42167,34 @@ marker('editor.record.form.field.contacts');
 marker('editor.record.form.field.organisation');
 class MetadataQualityPanelComponent {
     constructor() {
+        this.facade = inject(EditorFacade);
         this.propsToValidate = getAllKeysValidator();
-        this.propertiesByPage = [];
-    }
-    ngOnChanges() {
-        if (this.editorConfig && this.record) {
-            const fieldsByPage = this.editorConfig.pages.map((page) => page.sections.flatMap((section) => section.fields
-                .filter((field) => this.propsToValidate.includes(field.model))
-                .map((field) => field.model)));
-            // FIXME: temporarily add topics and organisation to the first and third page
-            // as long as they are not handled by the editor
-            if (fieldsByPage.length > 0) {
-                fieldsByPage[0].includes('topics') || fieldsByPage[0].push('topics');
-                fieldsByPage[2].includes('organisation') ||
-                    fieldsByPage[2].push('organisation');
-            }
-            this.propertiesByPage = fieldsByPage
-                .map((fields) => getQualityValidators(this.record, fields).map(({ name, validator }) => ({
-                label: `editor.record.form.field.${name}`, // use same translations as in fields.config.ts
+        this.propertiesByPage$ = combineLatest([
+            this.facade.editorConfig$,
+            this.facade.record$,
+        ]).pipe(map$2(([editorConfig, record]) => {
+            if (!editorConfig || !record)
+                return [];
+            const validators = getQualityValidators(record, this.propsToValidate);
+            return editorConfig.pages
+                .map((page) => page.sections
+                .flatMap((section) => section.fields)
+                .flatMap(({ model }) => validators.filter((v) => (v.alias ?? v.name) === model))
+                .map(({ name, validator, alias }) => ({
+                label: `editor.record.form.field.${name}`,
                 value: validator(),
+                model: (alias ?? name),
             })))
                 .filter((arr) => arr.length > 0);
-        }
+        }));
     }
-    getExtraClass(checked) {
-        const baseClasses = 'flex flex-row justify-between rounded mb-1 h-[34px] w-full focus:ring-0 hover:border-none border-none hover:text-black text-black cursor-default';
-        return checked
-            ? `${baseClasses} bg-neutral-100 hover:bg-neutral-100`
-            : `${baseClasses} bg-transparent hover:bg-transparent`;
+    onCriterionClick(property) {
+        if (!property.value) {
+            this.facade.setFocusedField(property.model);
+        }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MetadataQualityPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: MetadataQualityPanelComponent, isStandalone: true, selector: "gn-ui-metadata-quality-panel", inputs: { editorConfig: "editorConfig", record: "record" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: MetadataQualityPanelComponent, isStandalone: true, selector: "gn-ui-metadata-quality-panel", providers: [
             provideIcons({
                 iconoirSystemShut,
                 iconoirBadgeCheck,
@@ -41896,7 +42202,7 @@ class MetadataQualityPanelComponent {
             provideNgIconsConfig({
                 size: '1.25em',
             }),
-        ], usesOnChanges: true, ngImport: i0, template: "<div\n  class=\"flex flex-col h-full w-[302px] border-l border-gray-300 py-8 px-3 gap-3 overflow-auto\"\n  style=\"background-color: #fafaf9\"\n>\n  <div class=\"flex flex-row px-2 justify-between\">\n    <span class=\"text-3xl font-title text-black/80\" translate\n      >editor.record.form.metadataQuality.title</span\n    >\n  </div>\n  @for (properties of propertiesByPage; track properties; let i = $index) {\n    <div class=\"flex flex-col gap-2\">\n      @for (property of properties; track property) {\n        <gn-ui-button\n          [extraClass]=\"getExtraClass(property.value)\"\n          type=\"outline\"\n          attr.data-cy=\"md-quality-btn-{{ property.label }}\"\n        >\n          <span>{{ property.label | translate }}</span>\n          <div class=\"flex flex-row gap-2 items-center\">\n            @if (property.value) {\n              <ng-icon class=\"text-primary\" name=\"iconoirBadgeCheck\"></ng-icon>\n            } @else {\n              <ng-icon\n                class=\"text-neutral-300\"\n                name=\"iconoirSystemShut\"\n              ></ng-icon>\n            }\n          </div>\n        </gn-ui-button>\n      }\n      @if (i !== propertiesByPage.length - 1) {\n        <hr class=\"border-gray-300 w-11/12 mx-auto\" />\n      }\n    </div>\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: 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: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+        ], ngImport: i0, template: "<div\n  class=\"flex flex-col h-full w-[302px] border-l border-gray-300 py-8 px-3 gap-3 overflow-auto\"\n  style=\"background-color: #fafaf9\"\n>\n  <div class=\"flex flex-row px-2 justify-between\">\n    <span class=\"text-3xl font-title text-black/80\" translate\n      >editor.record.form.metadataQuality.title</span\n    >\n  </div>\n  @for (\n    properties of (propertiesByPage$ | async) ?? [];\n    track properties;\n    let isLast = $last\n  ) {\n    <div class=\"flex flex-col gap-2\">\n      @for (property of properties; track property) {\n        <gn-ui-button\n          style=\"\n            --gn-ui-button-justify: space-between;\n            --gn-ui-button-height: 34px;\n            --gn-ui-button-width: 100%;\n            --gn-ui-button-border-width: 0;\n            --gn-ui-button-color: black;\n            --gn-ui-button-background: transparent;\n            --gn-ui-button-bg-hover: #f3f4f6;\n            --gn-ui-button-disabled-opacity: 1;\n          \"\n          [disabled]=\"property.value\"\n          (buttonClick)=\"onCriterionClick(property)\"\n          type=\"outline\"\n          attr.data-cy=\"md-quality-btn-{{ property.label }}\"\n        >\n          <span>{{ property.label | translate }}</span>\n          <div class=\"flex flex-row gap-2 items-center\">\n            @if (property.value) {\n              <ng-icon class=\"text-primary\" name=\"iconoirBadgeCheck\"></ng-icon>\n            } @else {\n              <ng-icon\n                class=\"text-neutral-300\"\n                name=\"iconoirSystemShut\"\n              ></ng-icon>\n            }\n          </div>\n        </gn-ui-button>\n      }\n      @if (!isLast) {\n        <hr class=\"border-gray-300 w-11/12 mx-auto\" />\n      }\n    </div>\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: 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: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MetadataQualityPanelComponent, decorators: [{
             type: Component,
@@ -41905,6 +42211,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                         TranslatePipe,
                         ButtonComponent,
                         NgIconComponent,
+                        AsyncPipe,
                     ], providers: [
                         provideIcons({
                             iconoirSystemShut,
@@ -41913,12 +42220,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                         provideNgIconsConfig({
                             size: '1.25em',
                         }),
-                    ], template: "<div\n  class=\"flex flex-col h-full w-[302px] border-l border-gray-300 py-8 px-3 gap-3 overflow-auto\"\n  style=\"background-color: #fafaf9\"\n>\n  <div class=\"flex flex-row px-2 justify-between\">\n    <span class=\"text-3xl font-title text-black/80\" translate\n      >editor.record.form.metadataQuality.title</span\n    >\n  </div>\n  @for (properties of propertiesByPage; track properties; let i = $index) {\n    <div class=\"flex flex-col gap-2\">\n      @for (property of properties; track property) {\n        <gn-ui-button\n          [extraClass]=\"getExtraClass(property.value)\"\n          type=\"outline\"\n          attr.data-cy=\"md-quality-btn-{{ property.label }}\"\n        >\n          <span>{{ property.label | translate }}</span>\n          <div class=\"flex flex-row gap-2 items-center\">\n            @if (property.value) {\n              <ng-icon class=\"text-primary\" name=\"iconoirBadgeCheck\"></ng-icon>\n            } @else {\n              <ng-icon\n                class=\"text-neutral-300\"\n                name=\"iconoirSystemShut\"\n              ></ng-icon>\n            }\n          </div>\n        </gn-ui-button>\n      }\n      @if (i !== propertiesByPage.length - 1) {\n        <hr class=\"border-gray-300 w-11/12 mx-auto\" />\n      }\n    </div>\n  }\n</div>\n" }]
-        }], propDecorators: { editorConfig: [{
-                type: Input
-            }], record: [{
-                type: Input
-            }] } });
+                    ], template: "<div\n  class=\"flex flex-col h-full w-[302px] border-l border-gray-300 py-8 px-3 gap-3 overflow-auto\"\n  style=\"background-color: #fafaf9\"\n>\n  <div class=\"flex flex-row px-2 justify-between\">\n    <span class=\"text-3xl font-title text-black/80\" translate\n      >editor.record.form.metadataQuality.title</span\n    >\n  </div>\n  @for (\n    properties of (propertiesByPage$ | async) ?? [];\n    track properties;\n    let isLast = $last\n  ) {\n    <div class=\"flex flex-col gap-2\">\n      @for (property of properties; track property) {\n        <gn-ui-button\n          style=\"\n            --gn-ui-button-justify: space-between;\n            --gn-ui-button-height: 34px;\n            --gn-ui-button-width: 100%;\n            --gn-ui-button-border-width: 0;\n            --gn-ui-button-color: black;\n            --gn-ui-button-background: transparent;\n            --gn-ui-button-bg-hover: #f3f4f6;\n            --gn-ui-button-disabled-opacity: 1;\n          \"\n          [disabled]=\"property.value\"\n          (buttonClick)=\"onCriterionClick(property)\"\n          type=\"outline\"\n          attr.data-cy=\"md-quality-btn-{{ property.label }}\"\n        >\n          <span>{{ property.label | translate }}</span>\n          <div class=\"flex flex-row gap-2 items-center\">\n            @if (property.value) {\n              <ng-icon class=\"text-primary\" name=\"iconoirBadgeCheck\"></ng-icon>\n            } @else {\n              <ng-icon\n                class=\"text-neutral-300\"\n                name=\"iconoirSystemShut\"\n              ></ng-icon>\n            }\n          </div>\n        </gn-ui-button>\n      }\n      @if (!isLast) {\n        <hr class=\"border-gray-300 w-11/12 mx-auto\" />\n      }\n    </div>\n  }\n</div>\n" }]
+        }] });
 
 const extraFlagMap = {
     ar: 'arab',
@@ -42173,6 +42476,39 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                 args: ['actionMenuButton', { read: ElementRef }]
             }] } });
 
+class FieldFocusDirective {
+    constructor() {
+        this.gnUiFieldFocusGlowClass = 'gn-ui-field-focus-glow';
+        this.el = inject(ElementRef);
+    }
+    focusField() {
+        setTimeout(() => {
+            const host = this.el.nativeElement;
+            const glowClass = this.gnUiFieldFocusGlowClass;
+            host.classList.remove(glowClass);
+            void host.offsetWidth;
+            host.classList.add(glowClass);
+            host.addEventListener('animationend', () => host.classList.remove(glowClass), { once: true });
+            host.scrollIntoView({ behavior: 'smooth', block: 'start' });
+            const target = host.querySelector('input, textarea, select, [contenteditable="true"]') ??
+                host.querySelector('button:not([disabled]), [tabindex]:not([tabindex="-1"])');
+            target?.focus({ preventScroll: true });
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FieldFocusDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: FieldFocusDirective, isStandalone: true, selector: "[gnUiFieldFocus]", inputs: { gnUiFieldFocusGlowClass: "gnUiFieldFocusGlowClass" }, exportAs: ["fieldFocus"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FieldFocusDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[gnUiFieldFocus]',
+                    standalone: true,
+                    exportAs: 'fieldFocus',
+                }]
+        }], propDecorators: { gnUiFieldFocusGlowClass: [{
+                type: Input
+            }] } });
+
 class GenericKeywordsComponent {
     constructor() {
         this.platformService = inject(PlatformServiceInterface);
@@ -42660,9 +42996,7 @@ class FormFieldContactsForResourceComponent {
         /**
          * gn-ui-autocomplete
          */
-        this.displayWithFn = (user) => user.name
-            ? `${user.name} ${user.surname} ${user.organisation ? `(${user.organisation})` : ''}`
-            : ``;
+        this.displayWithFn = (user) => getIndividualDisplayName(toIndividual(user));
         /**
          * gn-ui-autocomplete
          */
@@ -42754,7 +43088,7 @@ class FormFieldContactsForResourceComponent {
             provideNgIconsConfig({
                 size: '1.5rem',
             }),
-        ], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-col gap-3\">\n  <div class=\"flex flex-row flex-wrap gap-2\" data-test=\"rolesToPick\">\n    @for (role of rolesToPick; track role) {\n      <gn-ui-button type=\"gray\" (buttonClick)=\"addRoleToDisplay(role)\">\n        <ng-icon name=\"iconoirPlus\" class=\"text-primary\"></ng-icon>\n        &nbsp;\n        <span translate>{{ roleToLabel(role) }}</span>\n      </gn-ui-button>\n    }\n  </div>\n  @if (roleSectionsToDisplay && roleSectionsToDisplay.length > 0) {\n    <div class=\"mt-8\" data-test=\"displayedRoles\">\n      @for (\n        role of roleSectionsToDisplay;\n        track role;\n        let index = $index;\n        let isLast = $last\n      ) {\n        <div class=\"flex flex-col gap-4\">\n          <div class=\"flex flex-row justify-between\">\n            <span class=\"font-bold text-base\" translate>{{\n              roleToLabel(role)\n            }}</span>\n          </div>\n          @if (role !== 'unspecified' && role !== 'other') {\n            <gn-ui-autocomplete\n              [placeholder]=\"\n                'editor.record.form.field.contactsForResource.placeholder'\n                  | translate\n              \"\n              [action]=\"autoCompleteAction\"\n              (itemSelected)=\"addContact($event, role)\"\n              [displayWithFn]=\"displayWithFn\"\n              [minCharacterCount]=\"1\"\n              [clearOnSelection]=\"true\"\n              [allowSubmit]=\"false\"\n            >\n            </gn-ui-autocomplete>\n          }\n          @if (contactsForRessourceByRole.get(role); as contacts) {\n            <gn-ui-sortable-list\n              [items]=\"contacts\"\n              (itemsOrderChange)=\"handleContactsChanged($event, role)\"\n              [elementTemplate]=\"contactTemplate\"\n            ></gn-ui-sortable-list>\n            <ng-template #contactTemplate let-contact>\n              <gn-ui-contact-card [contact]=\"contact\"></gn-ui-contact-card>\n            </ng-template>\n          }\n          @if (!isLast) {\n            <hr class=\"border-t-[#D6D3D1] mt-4 mb-6\" />\n          }\n        </div>\n      }\n    </div>\n  } @else {\n    <div\n      class=\"p-4 border border-primary bg-primary-lightest rounded-lg\"\n      translate\n    >\n      editor.record.form.field.contactsForResource.noContact\n    </div>\n  }\n</div>\n", styles: [":host{--gn-ui-button-padding: 8px 8px;--gn-ui-button-rounded: 8px}\n"], dependencies: [{ kind: "component", type: AutocompleteComponent, selector: "gn-ui-autocomplete", inputs: ["placeholder", "enterButton", "action", "value", "clearOnSelection", "preventCompleteOnSelection", "autoFocus", "minCharacterCount", "allowSubmit", "forceTrackPosition", "displayWithFn"], outputs: ["itemSelected", "inputSubmitted", "inputCleared", "isSearchActive"] }, { kind: "component", type: ContactCardComponent, selector: "gn-ui-contact-card", inputs: ["contact"] }, { kind: "component", type: SortableListComponent, selector: "gn-ui-sortable-list", inputs: ["elementTemplate", "items"], outputs: ["itemsOrderChange"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-col gap-3\">\n  <div class=\"flex flex-row flex-wrap gap-2\" data-test=\"rolesToPick\">\n    @for (role of rolesToPick; track role) {\n      <gn-ui-button type=\"gray\" (buttonClick)=\"addRoleToDisplay(role)\">\n        <ng-icon name=\"iconoirPlus\" class=\"text-primary\"></ng-icon>\n        &nbsp;\n        <span translate>{{ roleToLabel(role) }}</span>\n      </gn-ui-button>\n    }\n  </div>\n  @if (value.length === 0) {\n    <div\n      class=\"p-4 border border-primary bg-primary-lightest rounded-lg\"\n      translate\n    >\n      editor.record.form.field.contactsForResource.noContact\n    </div>\n  }\n  @if (roleSectionsToDisplay && roleSectionsToDisplay.length > 0) {\n    <div class=\"mt-8\" data-test=\"displayedRoles\">\n      @for (\n        role of roleSectionsToDisplay;\n        track role;\n        let index = $index;\n        let isLast = $last\n      ) {\n        <div class=\"flex flex-col gap-4\">\n          <div class=\"flex flex-row justify-between\">\n            <span class=\"font-bold text-base\" translate>{{\n              roleToLabel(role)\n            }}</span>\n          </div>\n          @if (role !== 'unspecified' && role !== 'other') {\n            <gn-ui-autocomplete\n              [placeholder]=\"\n                'editor.record.form.field.contactsForResource.placeholder'\n                  | translate\n              \"\n              [action]=\"autoCompleteAction\"\n              (itemSelected)=\"addContact($event, role)\"\n              [displayWithFn]=\"displayWithFn\"\n              [minCharacterCount]=\"1\"\n              [clearOnSelection]=\"true\"\n              [allowSubmit]=\"false\"\n            >\n            </gn-ui-autocomplete>\n          }\n          @if (contactsForRessourceByRole.get(role); as contacts) {\n            <gn-ui-sortable-list\n              [items]=\"contacts\"\n              (itemsOrderChange)=\"handleContactsChanged($event, role)\"\n              [elementTemplate]=\"contactTemplate\"\n            ></gn-ui-sortable-list>\n            <ng-template #contactTemplate let-contact>\n              <gn-ui-contact-card [contact]=\"contact\"></gn-ui-contact-card>\n            </ng-template>\n          }\n          @if (!isLast) {\n            <hr class=\"border-t-[#D6D3D1] mt-4 mb-6\" />\n          }\n        </div>\n      }\n    </div>\n  }\n</div>\n", styles: [":host{--gn-ui-button-padding: 8px 8px;--gn-ui-button-rounded: 8px}\n"], dependencies: [{ kind: "component", type: AutocompleteComponent, selector: "gn-ui-autocomplete", inputs: ["placeholder", "enterButton", "action", "value", "clearOnSelection", "preventCompleteOnSelection", "autoFocus", "minCharacterCount", "allowSubmit", "forceTrackPosition", "displayWithFn"], outputs: ["itemSelected", "inputSubmitted", "inputCleared", "isSearchActive"] }, { kind: "component", type: ContactCardComponent, selector: "gn-ui-contact-card", inputs: ["contact"] }, { kind: "component", type: SortableListComponent, selector: "gn-ui-sortable-list", inputs: ["elementTemplate", "items"], outputs: ["itemsOrderChange"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FormFieldContactsForResourceComponent, decorators: [{
             type: Component,
@@ -42771,13 +43105,39 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                         provideNgIconsConfig({
                             size: '1.5rem',
                         }),
-                    ], template: "<div class=\"flex flex-col gap-3\">\n  <div class=\"flex flex-row flex-wrap gap-2\" data-test=\"rolesToPick\">\n    @for (role of rolesToPick; track role) {\n      <gn-ui-button type=\"gray\" (buttonClick)=\"addRoleToDisplay(role)\">\n        <ng-icon name=\"iconoirPlus\" class=\"text-primary\"></ng-icon>\n        &nbsp;\n        <span translate>{{ roleToLabel(role) }}</span>\n      </gn-ui-button>\n    }\n  </div>\n  @if (roleSectionsToDisplay && roleSectionsToDisplay.length > 0) {\n    <div class=\"mt-8\" data-test=\"displayedRoles\">\n      @for (\n        role of roleSectionsToDisplay;\n        track role;\n        let index = $index;\n        let isLast = $last\n      ) {\n        <div class=\"flex flex-col gap-4\">\n          <div class=\"flex flex-row justify-between\">\n            <span class=\"font-bold text-base\" translate>{{\n              roleToLabel(role)\n            }}</span>\n          </div>\n          @if (role !== 'unspecified' && role !== 'other') {\n            <gn-ui-autocomplete\n              [placeholder]=\"\n                'editor.record.form.field.contactsForResource.placeholder'\n                  | translate\n              \"\n              [action]=\"autoCompleteAction\"\n              (itemSelected)=\"addContact($event, role)\"\n              [displayWithFn]=\"displayWithFn\"\n              [minCharacterCount]=\"1\"\n              [clearOnSelection]=\"true\"\n              [allowSubmit]=\"false\"\n            >\n            </gn-ui-autocomplete>\n          }\n          @if (contactsForRessourceByRole.get(role); as contacts) {\n            <gn-ui-sortable-list\n              [items]=\"contacts\"\n              (itemsOrderChange)=\"handleContactsChanged($event, role)\"\n              [elementTemplate]=\"contactTemplate\"\n            ></gn-ui-sortable-list>\n            <ng-template #contactTemplate let-contact>\n              <gn-ui-contact-card [contact]=\"contact\"></gn-ui-contact-card>\n            </ng-template>\n          }\n          @if (!isLast) {\n            <hr class=\"border-t-[#D6D3D1] mt-4 mb-6\" />\n          }\n        </div>\n      }\n    </div>\n  } @else {\n    <div\n      class=\"p-4 border border-primary bg-primary-lightest rounded-lg\"\n      translate\n    >\n      editor.record.form.field.contactsForResource.noContact\n    </div>\n  }\n</div>\n", styles: [":host{--gn-ui-button-padding: 8px 8px;--gn-ui-button-rounded: 8px}\n"] }]
+                    ], template: "<div class=\"flex flex-col gap-3\">\n  <div class=\"flex flex-row flex-wrap gap-2\" data-test=\"rolesToPick\">\n    @for (role of rolesToPick; track role) {\n      <gn-ui-button type=\"gray\" (buttonClick)=\"addRoleToDisplay(role)\">\n        <ng-icon name=\"iconoirPlus\" class=\"text-primary\"></ng-icon>\n        &nbsp;\n        <span translate>{{ roleToLabel(role) }}</span>\n      </gn-ui-button>\n    }\n  </div>\n  @if (value.length === 0) {\n    <div\n      class=\"p-4 border border-primary bg-primary-lightest rounded-lg\"\n      translate\n    >\n      editor.record.form.field.contactsForResource.noContact\n    </div>\n  }\n  @if (roleSectionsToDisplay && roleSectionsToDisplay.length > 0) {\n    <div class=\"mt-8\" data-test=\"displayedRoles\">\n      @for (\n        role of roleSectionsToDisplay;\n        track role;\n        let index = $index;\n        let isLast = $last\n      ) {\n        <div class=\"flex flex-col gap-4\">\n          <div class=\"flex flex-row justify-between\">\n            <span class=\"font-bold text-base\" translate>{{\n              roleToLabel(role)\n            }}</span>\n          </div>\n          @if (role !== 'unspecified' && role !== 'other') {\n            <gn-ui-autocomplete\n              [placeholder]=\"\n                'editor.record.form.field.contactsForResource.placeholder'\n                  | translate\n              \"\n              [action]=\"autoCompleteAction\"\n              (itemSelected)=\"addContact($event, role)\"\n              [displayWithFn]=\"displayWithFn\"\n              [minCharacterCount]=\"1\"\n              [clearOnSelection]=\"true\"\n              [allowSubmit]=\"false\"\n            >\n            </gn-ui-autocomplete>\n          }\n          @if (contactsForRessourceByRole.get(role); as contacts) {\n            <gn-ui-sortable-list\n              [items]=\"contacts\"\n              (itemsOrderChange)=\"handleContactsChanged($event, role)\"\n              [elementTemplate]=\"contactTemplate\"\n            ></gn-ui-sortable-list>\n            <ng-template #contactTemplate let-contact>\n              <gn-ui-contact-card [contact]=\"contact\"></gn-ui-contact-card>\n            </ng-template>\n          }\n          @if (!isLast) {\n            <hr class=\"border-t-[#D6D3D1] mt-4 mb-6\" />\n          }\n        </div>\n      }\n    </div>\n  }\n</div>\n", styles: [":host{--gn-ui-button-padding: 8px 8px;--gn-ui-button-rounded: 8px}\n"] }]
         }], propDecorators: { value: [{
                 type: Input
             }], valueChange: [{
                 type: Output
             }] } });
 
+class ContactDetailsFormComponent {
+    constructor() {
+        this.contactChange = new EventEmitter();
+    }
+    emitContactChange() {
+        this.contactChange.emit(this.contact);
+    }
+    handleOrganizationChange(change) {
+        this.contact.organization = {
+            ...(this.contact.organization ?? {}),
+            ...change,
+        };
+        this.emitContactChange();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ContactDetailsFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: ContactDetailsFormComponent, isStandalone: true, selector: "gn-ui-contact-details-form", inputs: { contact: "contact" }, outputs: { contactChange: "contactChange" }, ngImport: i0, template: "<div class=\"flex flex-col gap-7\">\n  <div class=\"grid grid-cols-2 gap-4\">\n    <div class=\"min-w-0\">\n      <h3 class=\"text-[16px] font-bold text-main mb-[12px]\" translate>\n        editor.record.form.field.contactDetails.lastName\n      </h3>\n      <gn-ui-text-input\n        class=\"block w-full\"\n        extraClass=\"w-full\"\n        [(value)]=\"contact.lastName\"\n        (valueChange)=\"emitContactChange()\"\n        [placeholder]=\"\n          'editor.record.form.field.contactDetails.lastName.placeholder'\n            | translate\n        \"\n        data-test=\"contactDetailsLastName\"\n      ></gn-ui-text-input>\n    </div>\n    <div class=\"min-w-0\">\n      <h3 class=\"text-[16px] font-bold text-main mb-[12px]\" translate>\n        editor.record.form.field.contactDetails.firstName\n      </h3>\n      <gn-ui-text-input\n        class=\"block w-full\"\n        extraClass=\"w-full\"\n        [(value)]=\"contact.firstName\"\n        (valueChange)=\"emitContactChange()\"\n        [placeholder]=\"\n          'editor.record.form.field.contactDetails.firstName.placeholder'\n            | translate\n        \"\n        data-test=\"contactDetailsFirstName\"\n      ></gn-ui-text-input>\n    </div>\n  </div>\n  <div>\n    <h3 class=\"text-[16px] font-bold text-main mb-[12px]\" translate>\n      editor.record.form.field.contactDetails.email\n    </h3>\n    <gn-ui-text-input\n      class=\"block w-full\"\n      extraClass=\"w-full\"\n      [value]=\"contact.organization?.email ?? ''\"\n      (valueChange)=\"handleOrganizationChange({ email: $event })\"\n      [placeholder]=\"\n        'editor.record.form.field.contactDetails.email.placeholder' | translate\n      \"\n      data-test=\"contactDetailsEmail\"\n    ></gn-ui-text-input>\n  </div>\n  <div>\n    <h3 class=\"text-[16px] font-bold text-main mb-[12px]\" translate>\n      editor.record.form.field.contactDetails.organization\n    </h3>\n    <gn-ui-text-input\n      class=\"block w-full\"\n      extraClass=\"w-full\"\n      [value]=\"contact.organization?.name ?? ''\"\n      (valueChange)=\"handleOrganizationChange({ name: $event })\"\n      [placeholder]=\"\n        'editor.record.form.field.contactDetails.organization.placeholder'\n          | translate\n      \"\n      data-test=\"contactDetailsOrganization\"\n    ></gn-ui-text-input>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: TextInputComponent, selector: "gn-ui-text-input", inputs: ["value", "extraClass", "placeholder", "required", "disabled"], outputs: ["valueChange"] }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ContactDetailsFormComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'gn-ui-contact-details-form', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [TextInputComponent, TranslateDirective, TranslatePipe], template: "<div class=\"flex flex-col gap-7\">\n  <div class=\"grid grid-cols-2 gap-4\">\n    <div class=\"min-w-0\">\n      <h3 class=\"text-[16px] font-bold text-main mb-[12px]\" translate>\n        editor.record.form.field.contactDetails.lastName\n      </h3>\n      <gn-ui-text-input\n        class=\"block w-full\"\n        extraClass=\"w-full\"\n        [(value)]=\"contact.lastName\"\n        (valueChange)=\"emitContactChange()\"\n        [placeholder]=\"\n          'editor.record.form.field.contactDetails.lastName.placeholder'\n            | translate\n        \"\n        data-test=\"contactDetailsLastName\"\n      ></gn-ui-text-input>\n    </div>\n    <div class=\"min-w-0\">\n      <h3 class=\"text-[16px] font-bold text-main mb-[12px]\" translate>\n        editor.record.form.field.contactDetails.firstName\n      </h3>\n      <gn-ui-text-input\n        class=\"block w-full\"\n        extraClass=\"w-full\"\n        [(value)]=\"contact.firstName\"\n        (valueChange)=\"emitContactChange()\"\n        [placeholder]=\"\n          'editor.record.form.field.contactDetails.firstName.placeholder'\n            | translate\n        \"\n        data-test=\"contactDetailsFirstName\"\n      ></gn-ui-text-input>\n    </div>\n  </div>\n  <div>\n    <h3 class=\"text-[16px] font-bold text-main mb-[12px]\" translate>\n      editor.record.form.field.contactDetails.email\n    </h3>\n    <gn-ui-text-input\n      class=\"block w-full\"\n      extraClass=\"w-full\"\n      [value]=\"contact.organization?.email ?? ''\"\n      (valueChange)=\"handleOrganizationChange({ email: $event })\"\n      [placeholder]=\"\n        'editor.record.form.field.contactDetails.email.placeholder' | translate\n      \"\n      data-test=\"contactDetailsEmail\"\n    ></gn-ui-text-input>\n  </div>\n  <div>\n    <h3 class=\"text-[16px] font-bold text-main mb-[12px]\" translate>\n      editor.record.form.field.contactDetails.organization\n    </h3>\n    <gn-ui-text-input\n      class=\"block w-full\"\n      extraClass=\"w-full\"\n      [value]=\"contact.organization?.name ?? ''\"\n      (valueChange)=\"handleOrganizationChange({ name: $event })\"\n      [placeholder]=\"\n        'editor.record.form.field.contactDetails.organization.placeholder'\n          | translate\n      \"\n      data-test=\"contactDetailsOrganization\"\n    ></gn-ui-text-input>\n  </div>\n</div>\n" }]
+        }], propDecorators: { contact: [{
+                type: Input
+            }], contactChange: [{
+                type: Output
+            }] } });
+
 class FormFieldContactsComponent {
     constructor() {
         this.platformServiceInterface = inject(PlatformServiceInterface);
@@ -42790,7 +43150,7 @@ class FormFieldContactsComponent {
         /**
          * gn-ui-autocomplete
          */
-        this.displayWithFn = (user) => `${user.name} ${user.surname} ${user.organisation ? `(${user.organisation})` : ''}`;
+        this.displayWithFn = (user) => getIndividualDisplayName(toIndividual(user));
         /**
          * gn-ui-autocomplete
          */
@@ -42829,6 +43189,10 @@ class FormFieldContactsComponent {
         this.contacts = contacts;
         this.valueChange.emit(contacts);
     }
+    handleContactChanged(updatedContact, index) {
+        const contacts = this.contacts.map((contact, i) => i === index ? updatedContact : contact);
+        this.handleContactsChanged(contacts);
+    }
     /**
      * gn-ui-autocomplete
      */
@@ -42850,7 +43214,7 @@ class FormFieldContactsComponent {
         this.subscription.unsubscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FormFieldContactsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: FormFieldContactsComponent, isStandalone: true, selector: "gn-ui-form-field-contacts", inputs: { value: "value" }, outputs: { valueChange: "valueChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-col gap-3\">\n  <gn-ui-autocomplete\n    [placeholder]=\"'editor.record.form.field.contacts.placeholder' | translate\"\n    [action]=\"autoCompleteAction\"\n    (itemSelected)=\"addContact($event)\"\n    [displayWithFn]=\"displayWithFn\"\n    [minCharacterCount]=\"1\"\n    [clearOnSelection]=\"true\"\n  >\n  </gn-ui-autocomplete>\n\n  @if (contacts.length > 0) {\n    @if (contacts.length === 1) {\n      @for (contact of contacts; track contact; let index = $index) {\n        <gn-ui-contact-card [contact]=\"contact\"></gn-ui-contact-card>\n      }\n    }\n    @if (contacts.length > 1) {\n      <gn-ui-sortable-list\n        [items]=\"contacts\"\n        (itemsOrderChange)=\"handleContactsChanged($event)\"\n        [elementTemplate]=\"contactTemplate\"\n      ></gn-ui-sortable-list>\n      <ng-template #contactTemplate let-contact>\n        <gn-ui-contact-card [contact]=\"contact\"></gn-ui-contact-card>\n      </ng-template>\n    }\n  } @else {\n    <div\n      class=\"p-4 text-sm border border-primary bg-primary-lightest rounded-lg\"\n      translate\n    >\n      editor.record.form.field.contacts.noContact\n    </div>\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: AutocompleteComponent, selector: "gn-ui-autocomplete", inputs: ["placeholder", "enterButton", "action", "value", "clearOnSelection", "preventCompleteOnSelection", "autoFocus", "minCharacterCount", "allowSubmit", "forceTrackPosition", "displayWithFn"], outputs: ["itemSelected", "inputSubmitted", "inputCleared", "isSearchActive"] }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: ContactCardComponent, selector: "gn-ui-contact-card", inputs: ["contact"] }, { kind: "component", type: SortableListComponent, selector: "gn-ui-sortable-list", inputs: ["elementTemplate", "items"], outputs: ["itemsOrderChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: FormFieldContactsComponent, isStandalone: true, selector: "gn-ui-form-field-contacts", inputs: { value: "value", modelSpecifier: "modelSpecifier" }, outputs: { valueChange: "valueChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-col gap-3\">\n  <gn-ui-autocomplete\n    [placeholder]=\"'editor.record.form.field.contacts.placeholder' | translate\"\n    [action]=\"autoCompleteAction\"\n    (itemSelected)=\"addContact($event)\"\n    [displayWithFn]=\"displayWithFn\"\n    [minCharacterCount]=\"1\"\n    [clearOnSelection]=\"true\"\n  >\n  </gn-ui-autocomplete>\n\n  @if (contacts.length > 0) {\n    <gn-ui-sortable-list\n      [items]=\"contacts\"\n      (itemsOrderChange)=\"handleContactsChanged($event)\"\n      [elementTemplate]=\"contactTemplate\"\n    ></gn-ui-sortable-list>\n    <ng-template #contactTemplate let-contact let-index=\"index\">\n      @if (modelSpecifier === 'contact:editableDetails') {\n        <gn-ui-contact-details-form\n          [contact]=\"contact\"\n          (contactChange)=\"handleContactChanged($event, index)\"\n        ></gn-ui-contact-details-form>\n      } @else {\n        <gn-ui-contact-card [contact]=\"contact\"></gn-ui-contact-card>\n      }\n    </ng-template>\n  } @else {\n    <div\n      class=\"p-4 text-sm border border-primary bg-primary-lightest rounded-lg\"\n      translate\n    >\n      editor.record.form.field.contacts.noContact\n    </div>\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: AutocompleteComponent, selector: "gn-ui-autocomplete", inputs: ["placeholder", "enterButton", "action", "value", "clearOnSelection", "preventCompleteOnSelection", "autoFocus", "minCharacterCount", "allowSubmit", "forceTrackPosition", "displayWithFn"], outputs: ["itemSelected", "inputSubmitted", "inputCleared", "isSearchActive"] }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: ContactCardComponent, selector: "gn-ui-contact-card", inputs: ["contact"] }, { kind: "component", type: ContactDetailsFormComponent, selector: "gn-ui-contact-details-form", inputs: ["contact"], outputs: ["contactChange"] }, { kind: "component", type: SortableListComponent, selector: "gn-ui-sortable-list", inputs: ["elementTemplate", "items"], outputs: ["itemsOrderChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FormFieldContactsComponent, decorators: [{
             type: Component,
@@ -42859,10 +43223,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                         TranslateDirective,
                         TranslatePipe,
                         ContactCardComponent,
+                        ContactDetailsFormComponent,
                         SortableListComponent,
-                    ], template: "<div class=\"flex flex-col gap-3\">\n  <gn-ui-autocomplete\n    [placeholder]=\"'editor.record.form.field.contacts.placeholder' | translate\"\n    [action]=\"autoCompleteAction\"\n    (itemSelected)=\"addContact($event)\"\n    [displayWithFn]=\"displayWithFn\"\n    [minCharacterCount]=\"1\"\n    [clearOnSelection]=\"true\"\n  >\n  </gn-ui-autocomplete>\n\n  @if (contacts.length > 0) {\n    @if (contacts.length === 1) {\n      @for (contact of contacts; track contact; let index = $index) {\n        <gn-ui-contact-card [contact]=\"contact\"></gn-ui-contact-card>\n      }\n    }\n    @if (contacts.length > 1) {\n      <gn-ui-sortable-list\n        [items]=\"contacts\"\n        (itemsOrderChange)=\"handleContactsChanged($event)\"\n        [elementTemplate]=\"contactTemplate\"\n      ></gn-ui-sortable-list>\n      <ng-template #contactTemplate let-contact>\n        <gn-ui-contact-card [contact]=\"contact\"></gn-ui-contact-card>\n      </ng-template>\n    }\n  } @else {\n    <div\n      class=\"p-4 text-sm border border-primary bg-primary-lightest rounded-lg\"\n      translate\n    >\n      editor.record.form.field.contacts.noContact\n    </div>\n  }\n</div>\n" }]
+                    ], template: "<div class=\"flex flex-col gap-3\">\n  <gn-ui-autocomplete\n    [placeholder]=\"'editor.record.form.field.contacts.placeholder' | translate\"\n    [action]=\"autoCompleteAction\"\n    (itemSelected)=\"addContact($event)\"\n    [displayWithFn]=\"displayWithFn\"\n    [minCharacterCount]=\"1\"\n    [clearOnSelection]=\"true\"\n  >\n  </gn-ui-autocomplete>\n\n  @if (contacts.length > 0) {\n    <gn-ui-sortable-list\n      [items]=\"contacts\"\n      (itemsOrderChange)=\"handleContactsChanged($event)\"\n      [elementTemplate]=\"contactTemplate\"\n    ></gn-ui-sortable-list>\n    <ng-template #contactTemplate let-contact let-index=\"index\">\n      @if (modelSpecifier === 'contact:editableDetails') {\n        <gn-ui-contact-details-form\n          [contact]=\"contact\"\n          (contactChange)=\"handleContactChanged($event, index)\"\n        ></gn-ui-contact-details-form>\n      } @else {\n        <gn-ui-contact-card [contact]=\"contact\"></gn-ui-contact-card>\n      }\n    </ng-template>\n  } @else {\n    <div\n      class=\"p-4 text-sm border border-primary bg-primary-lightest rounded-lg\"\n      translate\n    >\n      editor.record.form.field.contacts.noContact\n    </div>\n  }\n</div>\n" }]
         }], ctorParameters: () => [], propDecorators: { value: [{
                 type: Input
+            }], modelSpecifier: [{
+                type: Input
             }], valueChange: [{
                 type: Output
             }] } });
@@ -43642,30 +44009,29 @@ class FormFieldConstraintsShortcutsComponent {
             'otherConstraints',
         ];
         this.onDestroy$ = new Subject();
-    }
-    ngOnInit() {
-        // hide all constraints if any toggle is activated
-        this.anyToggleActivated$
-            .pipe(takeUntil(this.onDestroy$), distinctUntilChanged$1())
-            .subscribe((anyToggleActivated) => {
-            if (anyToggleActivated) {
-                this.hideAllConstraintSections();
-            }
-        });
-        // also hide constraints which are empty arrays
-        const hideEmptyConstraints = (constraints$, model) => {
-            const isConstraintNotEmpty$ = constraints$.pipe(takeUntil(this.onDestroy$), map$2((c) => c.length > 0), distinctUntilChanged$1());
-            combineLatest([
-                isConstraintNotEmpty$,
-                this.anyToggleActivated$,
-            ]).subscribe(([isNotEmpty, anyToggleActivated]) => {
-                const visible = isNotEmpty && !anyToggleActivated;
-                this.editorFacade.setFieldVisibility({ model }, visible);
+        // Deferred to afterNextRender to avoid dispatching store actions
+        // synchronously during Angular's change detection cycle (NG0100)
+        afterNextRender(() => {
+            this.anyToggleActivated$
+                .pipe(takeUntil(this.onDestroy$), distinctUntilChanged$1())
+                .subscribe((anyToggleActivated) => {
+                if (anyToggleActivated) {
+                    this.hideAllConstraintSections();
+                }
             });
-        };
-        hideEmptyConstraints(this.legalConstraints$, 'legalConstraints');
-        hideEmptyConstraints(this.securityConstraints$, 'securityConstraints');
-        hideEmptyConstraints(this.otherConstraints$, 'otherConstraints');
+            const hideEmptyConstraints = (constraints$, model) => {
+                const isConstraintNotEmpty$ = constraints$.pipe(takeUntil(this.onDestroy$), map$2((c) => c.length > 0), distinctUntilChanged$1());
+                combineLatest([
+                    isConstraintNotEmpty$,
+                    this.anyToggleActivated$,
+                ]).subscribe(([isNotEmpty, anyToggleActivated]) => {
+                    const visible = isNotEmpty && !anyToggleActivated;
+                    this.editorFacade.setFieldVisibility({ model }, visible);
+                });
+            };
+            hideEmptyConstraints(this.securityConstraints$, 'securityConstraints');
+            hideEmptyConstraints(this.otherConstraints$, 'otherConstraints');
+        });
     }
     ngOnDestroy() {
         this.onDestroy$.next();
@@ -43730,7 +44096,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                             size: '1.5rem',
                         }),
                     ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex flex-col gap-2 mb-2\" data-cy=\"constraints-shortcut-toggles\">\n  <gn-ui-check-toggle\n    [label]=\"'editor.record.form.constraint.not.applicable' | translate\"\n    [value]=\"noApplicableConstraint$ | async\"\n    (toggled)=\"onToggleChange('noApplicableConstraint', $event)\"\n  >\n  </gn-ui-check-toggle>\n  <gn-ui-check-toggle\n    [label]=\"'editor.record.form.constraint.not.known' | translate\"\n    [value]=\"noKnownConstraint$ | async\"\n    (toggled)=\"onToggleChange('noKnownConstraint', $event)\"\n  >\n  </gn-ui-check-toggle>\n</div>\n\n@if ((anyToggleActivated$ | async) === false) {\n  <div\n    class=\"flex flex-row flex-wrap gap-2\"\n    data-cy=\"constraints-shortcut-btns\"\n  >\n    @for (constraint of constraintButtonChoices; track constraint) {\n      <gn-ui-button\n        type=\"gray\"\n        (buttonClick)=\"addConstraintSectionToDisplay(constraint)\"\n        [disabled]=\"isConstraintButtonDisabled$(constraint) | async\"\n      >\n        <ng-icon name=\"iconoirPlus\" class=\"text-primary\"></ng-icon>\n        &nbsp;\n        <span>{{\n          'editor.record.form.constraint.' + constraint | translate\n        }}</span>\n      </gn-ui-button>\n    }\n  </div>\n}\n", styles: [":host{--gn-ui-button-padding: 8px 8px;--gn-ui-button-rounded: 8px}\n"] }]
-        }] });
+        }], ctorParameters: () => [] });
 
 class ConstraintCardComponent {
     constructor() {
@@ -43926,6 +44292,7 @@ class FormFieldComponent {
     constructor() {
         this.valueChange = new EventEmitter();
         this.isOpenData = false;
+        this.fieldFocus = inject(FieldFocusDirective);
     }
     toggleIsOpenData(event) {
         this.isOpenData = event;
@@ -43992,7 +44359,7 @@ class FormFieldComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: FormFieldComponent, isStandalone: true, selector: "gn-ui-form-field", inputs: { uniqueIdentifier: "uniqueIdentifier", model: "model", modelSpecifier: "modelSpecifier", componentName: "componentName", config: "config", value: "value" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "titleInput", first: true, predicate: ["titleInput"], descendants: true }], ngImport: i0, template: "<!-- TEMPORARY - disabling the open data switch -->\n<!-- <ng-container *ngIf=\"model === 'licenses'\">\n  <gn-ui-form-field-open-data\n    [value]=\"valueAsConstraints\"\n    (valueChange)=\"valueChange.emit($event)\"\n    (openDataChange)=\"toggleIsOpenData($event)\"\n  ></gn-ui-form-field-open-data>\n</ng-container> -->\n<div class=\"flex flex-col h-full\">\n  <ng-container *ngIf=\"withoutWrapper; else withGenericWrapper\">\n    <ng-container *ngTemplateOutlet=\"fieldContent\"></ng-container>\n  </ng-container>\n  <ng-template #withGenericWrapper>\n    <gn-ui-form-field-wrapper\n      [label]=\"config.labelKey! | translate\"\n      [hint]=\"config.hintKey! | translate\"\n    >\n      <ng-container *ngTemplateOutlet=\"fieldContent\"></ng-container>\n    </gn-ui-form-field-wrapper>\n  </ng-template>\n</div>\n\n<ng-template #fieldContent>\n  <ng-container [ngSwitch]=\"model\">\n    <ng-container *ngSwitchCase=\"'title'\">\n      <div class=\"flex flex-row flex-start items-center gap-3 mb-[12px]\">\n        <textarea\n          #titleInput\n          cdkTextareaAutosize\n          #autosize=\"cdkTextareaAutosize\"\n          cdkAutosizeMinRows=\"1\"\n          data-test=\"recordTitleInput\"\n          class=\"grow font-title text-3xl font-normal overflow-hidden text-black/80\"\n          [value]=\"valueAsString\"\n          (change)=\"valueChange.emit($event.target.value)\"\n          [placeholder]=\"\n            'editor.record.form.field.title.placeholder' | translate\n          \"\n        ></textarea>\n        <div class=\"flex flex-row justify-between self-start mt-0.5\">\n          <span\n            class=\"material-symbols-outlined gn-ui-icon-small m-2 cursor-pointer\"\n            (click)=\"focusTitleInput()\"\n            >edit</span\n          >\n          <span\n            *ngIf=\"config.hintKey\"\n            class=\"material-symbols-outlined gn-ui-icon-small m-2\"\n            [matTooltip]=\"config.hintKey! | translate\"\n            matTooltipPosition=\"above\"\n          >\n            help\n          </span>\n        </div>\n      </div>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'abstract'\">\n      <gn-ui-form-field-rich\n        [label]=\"config.labelKey! | translate\"\n        [hint]=\"config.hintKey! | translate\"\n        [value]=\"valueAsString\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-rich>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'overviews'\">\n      <gn-ui-form-field-overviews\n        [metadataUuid]=\"uniqueIdentifier\"\n        [value]=\"valueAsOverviews\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-overviews>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'resourceIdentifiers'\">\n      <gn-ui-form-field-simple\n        [type]=\"'text'\"\n        [value]=\"valueAsResourceIdentifierCode\"\n        (valueChange)=\"handleResourceIdentifierChange($event)\"\n      ></gn-ui-form-field-simple>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'resourceCreated'\">\n      <gn-ui-form-field-date\n        [value]=\"valueAsDate\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-date>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'resourceUpdated'\">\n      <gn-ui-form-field-date\n        [value]=\"valueAsDate\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-date>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'updateFrequency'\">\n      <gn-ui-form-field-update-frequency\n        [value]=\"valueAsUpdateFrequency\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-update-frequency>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'temporalExtents'\">\n      <gn-ui-form-field-temporal-extents\n        [value]=\"valueAsTemporalExtents\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-temporal-extents>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'spatialExtents'\">\n      <gn-ui-form-field-spatial-extent></gn-ui-form-field-spatial-extent>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'keywords'\">\n      <gn-ui-form-field-keywords\n        [value]=\"valueAsKeywords\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-keywords>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'topics'\">\n      <gn-ui-form-field-topics\n        [value]=\"valueAsTopics\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-topics>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'licenses'\">\n      <gn-ui-form-field-license\n        [label]=\"config.labelKey! | translate\"\n        [recordLicences]=\"valueAsConstraints\"\n        (recordLicencesChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-license>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"'legalConstraints'\">\n      <ng-container *ngTemplateOutlet=\"formFieldConstraints\"></ng-container>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'securityConstraints'\">\n      <ng-container *ngTemplateOutlet=\"formFieldConstraints\"></ng-container>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'otherConstraints'\">\n      <ng-container *ngTemplateOutlet=\"formFieldConstraints\"></ng-container\n    ></ng-container>\n    <ng-template #formFieldConstraints>\n      <gn-ui-form-field-constraints\n        [label]=\"config.labelKey\"\n        [value]=\"valueAsConstraints\"\n        [constraintType]=\"model\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-constraints\n    ></ng-template>\n\n    <ng-container *ngSwitchCase=\"'contactsForResource'\">\n      <gn-ui-form-field-contacts-for-resource\n        [value]=\"valueAsIndividuals\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-contacts-for-resource>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'contacts'\">\n      <gn-ui-form-field-contacts\n        [value]=\"valueAsIndividuals\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-contacts>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'onlineResources'\">\n      <gn-ui-form-field-online-resources\n        *ngIf=\"modelSpecifier === 'onlineResourceType:!link'\"\n        [metadataUuid]=\"uniqueIdentifier\"\n        [value]=\"valueAsOnlineResources\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-online-resources>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'onlineResources'\">\n      <gn-ui-form-field-online-link-resources\n        *ngIf=\"modelSpecifier === 'onlineResourceType:link'\"\n        [metadataUuid]=\"uniqueIdentifier\"\n        [value]=\"valueAsOnlineResources\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-online-link-resources>\n    </ng-container>\n  </ng-container>\n\n  <ng-container *ngIf=\"!model\">\n    <ng-container [ngSwitch]=\"componentName\">\n      <ng-container *ngSwitchCase=\"'form-field-constraints-shortcuts'\">\n        <gn-ui-form-field-constraints-shortcuts></gn-ui-form-field-constraints-shortcuts>\n      </ng-container>\n      <ng-container *ngSwitchCase=\"'form-field-spatial-toggle'\">\n        <gn-ui-form-field-spatial-toggle></gn-ui-form-field-spatial-toggle>\n      </ng-container>\n    </ng-container>\n  </ng-container>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i1$5.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: FormFieldWrapperComponent, selector: "gn-ui-form-field-wrapper", inputs: ["label", "hint"] }, { kind: "component", type: FormFieldLicenseComponent, selector: "gn-ui-form-field-license", inputs: ["label", "recordLicences"], outputs: ["recordLicencesChange"] }, { kind: "component", type: FormFieldDateComponent, selector: "gn-ui-form-field-date", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldUpdateFrequencyComponent, selector: "gn-ui-form-field-update-frequency", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldTemporalExtentsComponent, selector: "gn-ui-form-field-temporal-extents", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldSimpleComponent, selector: "gn-ui-form-field-simple", inputs: ["type", "readonly", "invalid", "placeholder", "value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldRichComponent, selector: "gn-ui-form-field-rich", inputs: ["label", "hint", "placeholder", "value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldSpatialExtentComponent, selector: "gn-ui-form-field-spatial-extent" }, { kind: "component", type: FormFieldKeywordsComponent, selector: "gn-ui-form-field-keywords", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldOverviewsComponent, selector: "gn-ui-form-field-overviews", inputs: ["metadataUuid", "value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldContactsForResourceComponent, selector: "gn-ui-form-field-contacts-for-resource", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldOnlineResourcesComponent, selector: "gn-ui-form-field-online-resources", inputs: ["metadataUuid", "value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldOnlineLinkResourcesComponent, selector: "gn-ui-form-field-online-link-resources", inputs: ["metadataUuid", "value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldContactsComponent, selector: "gn-ui-form-field-contacts", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldConstraintsComponent, selector: "gn-ui-form-field-constraints", inputs: ["label", "value", "constraintType"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldConstraintsShortcutsComponent, selector: "gn-ui-form-field-constraints-shortcuts" }, { kind: "component", type: FormFieldSpatialToggleComponent, selector: "gn-ui-form-field-spatial-toggle" }, { kind: "component", type: FormFieldTopicsComponent, selector: "gn-ui-form-field-topics", inputs: ["value"], outputs: ["valueChange"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "directive", type: i3$2.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: FormFieldComponent, isStandalone: true, selector: "gn-ui-form-field", inputs: { uniqueIdentifier: "uniqueIdentifier", model: "model", modelSpecifier: "modelSpecifier", componentName: "componentName", config: "config", value: "value" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "titleInput", first: true, predicate: ["titleInput"], descendants: true }], hostDirectives: [{ directive: FieldFocusDirective }], ngImport: i0, template: "<!-- TEMPORARY - disabling the open data switch -->\n<!-- <ng-container *ngIf=\"model === 'licenses'\">\n  <gn-ui-form-field-open-data\n    [value]=\"valueAsConstraints\"\n    (valueChange)=\"valueChange.emit($event)\"\n    (openDataChange)=\"toggleIsOpenData($event)\"\n  ></gn-ui-form-field-open-data>\n</ng-container> -->\n<div class=\"flex flex-col h-full\">\n  <ng-container *ngIf=\"withoutWrapper; else withGenericWrapper\">\n    <ng-container *ngTemplateOutlet=\"fieldContent\"></ng-container>\n  </ng-container>\n  <ng-template #withGenericWrapper>\n    <gn-ui-form-field-wrapper\n      [label]=\"config.labelKey! | translate\"\n      [hint]=\"config.hintKey! | translate\"\n    >\n      <ng-container *ngTemplateOutlet=\"fieldContent\"></ng-container>\n    </gn-ui-form-field-wrapper>\n  </ng-template>\n</div>\n\n<ng-template #fieldContent>\n  <ng-container [ngSwitch]=\"model\">\n    <ng-container *ngSwitchCase=\"'title'\">\n      <div class=\"flex flex-row flex-start items-center gap-3 mb-[12px]\">\n        <textarea\n          #titleInput\n          cdkTextareaAutosize\n          #autosize=\"cdkTextareaAutosize\"\n          cdkAutosizeMinRows=\"1\"\n          data-test=\"recordTitleInput\"\n          class=\"grow font-title text-3xl font-normal overflow-hidden text-black/80\"\n          [value]=\"valueAsString\"\n          (change)=\"valueChange.emit($event.target.value)\"\n          [placeholder]=\"\n            'editor.record.form.field.title.placeholder' | translate\n          \"\n        ></textarea>\n        <div class=\"flex flex-row justify-between self-start mt-0.5\">\n          <span\n            class=\"material-symbols-outlined gn-ui-icon-small m-2 cursor-pointer\"\n            (click)=\"focusTitleInput()\"\n            >edit</span\n          >\n          <span\n            *ngIf=\"config.hintKey\"\n            class=\"material-symbols-outlined gn-ui-icon-small m-2\"\n            [matTooltip]=\"config.hintKey! | translate\"\n            matTooltipPosition=\"above\"\n          >\n            help\n          </span>\n        </div>\n      </div>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'abstract'\">\n      <gn-ui-form-field-rich\n        [label]=\"config.labelKey! | translate\"\n        [hint]=\"config.hintKey! | translate\"\n        [value]=\"valueAsString\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-rich>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'overviews'\">\n      <gn-ui-form-field-overviews\n        [metadataUuid]=\"uniqueIdentifier\"\n        [value]=\"valueAsOverviews\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-overviews>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'resourceIdentifiers'\">\n      <gn-ui-form-field-simple\n        [type]=\"'text'\"\n        [value]=\"valueAsResourceIdentifierCode\"\n        (valueChange)=\"handleResourceIdentifierChange($event)\"\n      ></gn-ui-form-field-simple>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'resourceCreated'\">\n      <gn-ui-form-field-date\n        [value]=\"valueAsDate\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-date>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'resourceUpdated'\">\n      <gn-ui-form-field-date\n        [value]=\"valueAsDate\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-date>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'updateFrequency'\">\n      <gn-ui-form-field-update-frequency\n        [value]=\"valueAsUpdateFrequency\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-update-frequency>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'temporalExtents'\">\n      <gn-ui-form-field-temporal-extents\n        [value]=\"valueAsTemporalExtents\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-temporal-extents>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'spatialExtents'\">\n      <gn-ui-form-field-spatial-extent></gn-ui-form-field-spatial-extent>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'keywords'\">\n      <gn-ui-form-field-keywords\n        [value]=\"valueAsKeywords\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-keywords>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'topics'\">\n      <gn-ui-form-field-topics\n        [value]=\"valueAsTopics\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-topics>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'licenses'\">\n      <gn-ui-form-field-license\n        [label]=\"config.labelKey! | translate\"\n        [recordLicences]=\"valueAsConstraints\"\n        (recordLicencesChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-license>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"'legalConstraints'\">\n      <ng-container *ngTemplateOutlet=\"formFieldConstraints\"></ng-container>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'securityConstraints'\">\n      <ng-container *ngTemplateOutlet=\"formFieldConstraints\"></ng-container>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'otherConstraints'\">\n      <ng-container *ngTemplateOutlet=\"formFieldConstraints\"></ng-container\n    ></ng-container>\n    <ng-template #formFieldConstraints>\n      <gn-ui-form-field-constraints\n        [label]=\"config.labelKey\"\n        [value]=\"valueAsConstraints\"\n        [constraintType]=\"model\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-constraints\n    ></ng-template>\n\n    <ng-container *ngSwitchCase=\"'contactsForResource'\">\n      <gn-ui-form-field-contacts-for-resource\n        [value]=\"valueAsIndividuals\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-contacts-for-resource>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'contacts'\">\n      <gn-ui-form-field-contacts\n        [value]=\"valueAsIndividuals\"\n        [modelSpecifier]=\"modelSpecifier\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-contacts>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'onlineResources'\">\n      <gn-ui-form-field-online-resources\n        *ngIf=\"modelSpecifier === 'onlineResourceType:!link'\"\n        [metadataUuid]=\"uniqueIdentifier\"\n        [value]=\"valueAsOnlineResources\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-online-resources>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'onlineResources'\">\n      <gn-ui-form-field-online-link-resources\n        *ngIf=\"modelSpecifier === 'onlineResourceType:link'\"\n        [metadataUuid]=\"uniqueIdentifier\"\n        [value]=\"valueAsOnlineResources\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-online-link-resources>\n    </ng-container>\n  </ng-container>\n\n  <ng-container *ngIf=\"!model\">\n    <ng-container [ngSwitch]=\"componentName\">\n      <ng-container *ngSwitchCase=\"'form-field-constraints-shortcuts'\">\n        <gn-ui-form-field-constraints-shortcuts></gn-ui-form-field-constraints-shortcuts>\n      </ng-container>\n      <ng-container *ngSwitchCase=\"'form-field-spatial-toggle'\">\n        <gn-ui-form-field-spatial-toggle></gn-ui-form-field-spatial-toggle>\n      </ng-container>\n    </ng-container>\n  </ng-container>\n</ng-template>\n", styles: [":host{scroll-margin-top:90px}:host.gn-ui-field-focus-glow{position:relative}:host.gn-ui-field-focus-glow:after{content:\"\";position:absolute;inset:-8px;border-radius:8px;background-color:color-mix(in srgb,var(--color-primary) 12%,transparent);pointer-events:none;animation:gn-ui-field-focus-glow 3s ease-out forwards}:host.gn-ui-field-focus-glow:before{content:\"\";position:absolute;inset:-16px;border:2px dashed var(--color-primary);border-radius:10px;pointer-events:none;animation:gn-ui-field-focus-glow 3s ease-out forwards}@keyframes gn-ui-field-focus-glow{0%,55%{opacity:1}to{opacity:0}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i1$5.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: FormFieldWrapperComponent, selector: "gn-ui-form-field-wrapper", inputs: ["label", "hint"] }, { kind: "component", type: FormFieldLicenseComponent, selector: "gn-ui-form-field-license", inputs: ["label", "recordLicences"], outputs: ["recordLicencesChange"] }, { kind: "component", type: FormFieldDateComponent, selector: "gn-ui-form-field-date", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldUpdateFrequencyComponent, selector: "gn-ui-form-field-update-frequency", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldTemporalExtentsComponent, selector: "gn-ui-form-field-temporal-extents", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldSimpleComponent, selector: "gn-ui-form-field-simple", inputs: ["type", "readonly", "invalid", "placeholder", "value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldRichComponent, selector: "gn-ui-form-field-rich", inputs: ["label", "hint", "placeholder", "value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldSpatialExtentComponent, selector: "gn-ui-form-field-spatial-extent" }, { kind: "component", type: FormFieldKeywordsComponent, selector: "gn-ui-form-field-keywords", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldOverviewsComponent, selector: "gn-ui-form-field-overviews", inputs: ["metadataUuid", "value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldContactsForResourceComponent, selector: "gn-ui-form-field-contacts-for-resource", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldOnlineResourcesComponent, selector: "gn-ui-form-field-online-resources", inputs: ["metadataUuid", "value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldOnlineLinkResourcesComponent, selector: "gn-ui-form-field-online-link-resources", inputs: ["metadataUuid", "value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldContactsComponent, selector: "gn-ui-form-field-contacts", inputs: ["value", "modelSpecifier"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldConstraintsComponent, selector: "gn-ui-form-field-constraints", inputs: ["label", "value", "constraintType"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldConstraintsShortcutsComponent, selector: "gn-ui-form-field-constraints-shortcuts" }, { kind: "component", type: FormFieldSpatialToggleComponent, selector: "gn-ui-form-field-spatial-toggle" }, { kind: "component", type: FormFieldTopicsComponent, selector: "gn-ui-form-field-topics", inputs: ["value"], outputs: ["valueChange"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FormFieldComponent, decorators: [{
             type: Component,
@@ -44019,7 +44386,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                         FormFieldSpatialToggleComponent,
                         FormFieldTopicsComponent,
                         TextFieldModule,
-                    ], template: "<!-- TEMPORARY - disabling the open data switch -->\n<!-- <ng-container *ngIf=\"model === 'licenses'\">\n  <gn-ui-form-field-open-data\n    [value]=\"valueAsConstraints\"\n    (valueChange)=\"valueChange.emit($event)\"\n    (openDataChange)=\"toggleIsOpenData($event)\"\n  ></gn-ui-form-field-open-data>\n</ng-container> -->\n<div class=\"flex flex-col h-full\">\n  <ng-container *ngIf=\"withoutWrapper; else withGenericWrapper\">\n    <ng-container *ngTemplateOutlet=\"fieldContent\"></ng-container>\n  </ng-container>\n  <ng-template #withGenericWrapper>\n    <gn-ui-form-field-wrapper\n      [label]=\"config.labelKey! | translate\"\n      [hint]=\"config.hintKey! | translate\"\n    >\n      <ng-container *ngTemplateOutlet=\"fieldContent\"></ng-container>\n    </gn-ui-form-field-wrapper>\n  </ng-template>\n</div>\n\n<ng-template #fieldContent>\n  <ng-container [ngSwitch]=\"model\">\n    <ng-container *ngSwitchCase=\"'title'\">\n      <div class=\"flex flex-row flex-start items-center gap-3 mb-[12px]\">\n        <textarea\n          #titleInput\n          cdkTextareaAutosize\n          #autosize=\"cdkTextareaAutosize\"\n          cdkAutosizeMinRows=\"1\"\n          data-test=\"recordTitleInput\"\n          class=\"grow font-title text-3xl font-normal overflow-hidden text-black/80\"\n          [value]=\"valueAsString\"\n          (change)=\"valueChange.emit($event.target.value)\"\n          [placeholder]=\"\n            'editor.record.form.field.title.placeholder' | translate\n          \"\n        ></textarea>\n        <div class=\"flex flex-row justify-between self-start mt-0.5\">\n          <span\n            class=\"material-symbols-outlined gn-ui-icon-small m-2 cursor-pointer\"\n            (click)=\"focusTitleInput()\"\n            >edit</span\n          >\n          <span\n            *ngIf=\"config.hintKey\"\n            class=\"material-symbols-outlined gn-ui-icon-small m-2\"\n            [matTooltip]=\"config.hintKey! | translate\"\n            matTooltipPosition=\"above\"\n          >\n            help\n          </span>\n        </div>\n      </div>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'abstract'\">\n      <gn-ui-form-field-rich\n        [label]=\"config.labelKey! | translate\"\n        [hint]=\"config.hintKey! | translate\"\n        [value]=\"valueAsString\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-rich>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'overviews'\">\n      <gn-ui-form-field-overviews\n        [metadataUuid]=\"uniqueIdentifier\"\n        [value]=\"valueAsOverviews\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-overviews>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'resourceIdentifiers'\">\n      <gn-ui-form-field-simple\n        [type]=\"'text'\"\n        [value]=\"valueAsResourceIdentifierCode\"\n        (valueChange)=\"handleResourceIdentifierChange($event)\"\n      ></gn-ui-form-field-simple>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'resourceCreated'\">\n      <gn-ui-form-field-date\n        [value]=\"valueAsDate\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-date>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'resourceUpdated'\">\n      <gn-ui-form-field-date\n        [value]=\"valueAsDate\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-date>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'updateFrequency'\">\n      <gn-ui-form-field-update-frequency\n        [value]=\"valueAsUpdateFrequency\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-update-frequency>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'temporalExtents'\">\n      <gn-ui-form-field-temporal-extents\n        [value]=\"valueAsTemporalExtents\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-temporal-extents>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'spatialExtents'\">\n      <gn-ui-form-field-spatial-extent></gn-ui-form-field-spatial-extent>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'keywords'\">\n      <gn-ui-form-field-keywords\n        [value]=\"valueAsKeywords\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-keywords>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'topics'\">\n      <gn-ui-form-field-topics\n        [value]=\"valueAsTopics\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-topics>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'licenses'\">\n      <gn-ui-form-field-license\n        [label]=\"config.labelKey! | translate\"\n        [recordLicences]=\"valueAsConstraints\"\n        (recordLicencesChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-license>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"'legalConstraints'\">\n      <ng-container *ngTemplateOutlet=\"formFieldConstraints\"></ng-container>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'securityConstraints'\">\n      <ng-container *ngTemplateOutlet=\"formFieldConstraints\"></ng-container>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'otherConstraints'\">\n      <ng-container *ngTemplateOutlet=\"formFieldConstraints\"></ng-container\n    ></ng-container>\n    <ng-template #formFieldConstraints>\n      <gn-ui-form-field-constraints\n        [label]=\"config.labelKey\"\n        [value]=\"valueAsConstraints\"\n        [constraintType]=\"model\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-constraints\n    ></ng-template>\n\n    <ng-container *ngSwitchCase=\"'contactsForResource'\">\n      <gn-ui-form-field-contacts-for-resource\n        [value]=\"valueAsIndividuals\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-contacts-for-resource>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'contacts'\">\n      <gn-ui-form-field-contacts\n        [value]=\"valueAsIndividuals\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-contacts>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'onlineResources'\">\n      <gn-ui-form-field-online-resources\n        *ngIf=\"modelSpecifier === 'onlineResourceType:!link'\"\n        [metadataUuid]=\"uniqueIdentifier\"\n        [value]=\"valueAsOnlineResources\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-online-resources>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'onlineResources'\">\n      <gn-ui-form-field-online-link-resources\n        *ngIf=\"modelSpecifier === 'onlineResourceType:link'\"\n        [metadataUuid]=\"uniqueIdentifier\"\n        [value]=\"valueAsOnlineResources\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-online-link-resources>\n    </ng-container>\n  </ng-container>\n\n  <ng-container *ngIf=\"!model\">\n    <ng-container [ngSwitch]=\"componentName\">\n      <ng-container *ngSwitchCase=\"'form-field-constraints-shortcuts'\">\n        <gn-ui-form-field-constraints-shortcuts></gn-ui-form-field-constraints-shortcuts>\n      </ng-container>\n      <ng-container *ngSwitchCase=\"'form-field-spatial-toggle'\">\n        <gn-ui-form-field-spatial-toggle></gn-ui-form-field-spatial-toggle>\n      </ng-container>\n    </ng-container>\n  </ng-container>\n</ng-template>\n" }]
+                    ], hostDirectives: [FieldFocusDirective], template: "<!-- TEMPORARY - disabling the open data switch -->\n<!-- <ng-container *ngIf=\"model === 'licenses'\">\n  <gn-ui-form-field-open-data\n    [value]=\"valueAsConstraints\"\n    (valueChange)=\"valueChange.emit($event)\"\n    (openDataChange)=\"toggleIsOpenData($event)\"\n  ></gn-ui-form-field-open-data>\n</ng-container> -->\n<div class=\"flex flex-col h-full\">\n  <ng-container *ngIf=\"withoutWrapper; else withGenericWrapper\">\n    <ng-container *ngTemplateOutlet=\"fieldContent\"></ng-container>\n  </ng-container>\n  <ng-template #withGenericWrapper>\n    <gn-ui-form-field-wrapper\n      [label]=\"config.labelKey! | translate\"\n      [hint]=\"config.hintKey! | translate\"\n    >\n      <ng-container *ngTemplateOutlet=\"fieldContent\"></ng-container>\n    </gn-ui-form-field-wrapper>\n  </ng-template>\n</div>\n\n<ng-template #fieldContent>\n  <ng-container [ngSwitch]=\"model\">\n    <ng-container *ngSwitchCase=\"'title'\">\n      <div class=\"flex flex-row flex-start items-center gap-3 mb-[12px]\">\n        <textarea\n          #titleInput\n          cdkTextareaAutosize\n          #autosize=\"cdkTextareaAutosize\"\n          cdkAutosizeMinRows=\"1\"\n          data-test=\"recordTitleInput\"\n          class=\"grow font-title text-3xl font-normal overflow-hidden text-black/80\"\n          [value]=\"valueAsString\"\n          (change)=\"valueChange.emit($event.target.value)\"\n          [placeholder]=\"\n            'editor.record.form.field.title.placeholder' | translate\n          \"\n        ></textarea>\n        <div class=\"flex flex-row justify-between self-start mt-0.5\">\n          <span\n            class=\"material-symbols-outlined gn-ui-icon-small m-2 cursor-pointer\"\n            (click)=\"focusTitleInput()\"\n            >edit</span\n          >\n          <span\n            *ngIf=\"config.hintKey\"\n            class=\"material-symbols-outlined gn-ui-icon-small m-2\"\n            [matTooltip]=\"config.hintKey! | translate\"\n            matTooltipPosition=\"above\"\n          >\n            help\n          </span>\n        </div>\n      </div>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'abstract'\">\n      <gn-ui-form-field-rich\n        [label]=\"config.labelKey! | translate\"\n        [hint]=\"config.hintKey! | translate\"\n        [value]=\"valueAsString\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-rich>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'overviews'\">\n      <gn-ui-form-field-overviews\n        [metadataUuid]=\"uniqueIdentifier\"\n        [value]=\"valueAsOverviews\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-overviews>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'resourceIdentifiers'\">\n      <gn-ui-form-field-simple\n        [type]=\"'text'\"\n        [value]=\"valueAsResourceIdentifierCode\"\n        (valueChange)=\"handleResourceIdentifierChange($event)\"\n      ></gn-ui-form-field-simple>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'resourceCreated'\">\n      <gn-ui-form-field-date\n        [value]=\"valueAsDate\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-date>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'resourceUpdated'\">\n      <gn-ui-form-field-date\n        [value]=\"valueAsDate\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-date>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'updateFrequency'\">\n      <gn-ui-form-field-update-frequency\n        [value]=\"valueAsUpdateFrequency\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-update-frequency>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'temporalExtents'\">\n      <gn-ui-form-field-temporal-extents\n        [value]=\"valueAsTemporalExtents\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-temporal-extents>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'spatialExtents'\">\n      <gn-ui-form-field-spatial-extent></gn-ui-form-field-spatial-extent>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'keywords'\">\n      <gn-ui-form-field-keywords\n        [value]=\"valueAsKeywords\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-keywords>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'topics'\">\n      <gn-ui-form-field-topics\n        [value]=\"valueAsTopics\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-topics>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'licenses'\">\n      <gn-ui-form-field-license\n        [label]=\"config.labelKey! | translate\"\n        [recordLicences]=\"valueAsConstraints\"\n        (recordLicencesChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-license>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"'legalConstraints'\">\n      <ng-container *ngTemplateOutlet=\"formFieldConstraints\"></ng-container>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'securityConstraints'\">\n      <ng-container *ngTemplateOutlet=\"formFieldConstraints\"></ng-container>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'otherConstraints'\">\n      <ng-container *ngTemplateOutlet=\"formFieldConstraints\"></ng-container\n    ></ng-container>\n    <ng-template #formFieldConstraints>\n      <gn-ui-form-field-constraints\n        [label]=\"config.labelKey\"\n        [value]=\"valueAsConstraints\"\n        [constraintType]=\"model\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-constraints\n    ></ng-template>\n\n    <ng-container *ngSwitchCase=\"'contactsForResource'\">\n      <gn-ui-form-field-contacts-for-resource\n        [value]=\"valueAsIndividuals\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-contacts-for-resource>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'contacts'\">\n      <gn-ui-form-field-contacts\n        [value]=\"valueAsIndividuals\"\n        [modelSpecifier]=\"modelSpecifier\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-contacts>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'onlineResources'\">\n      <gn-ui-form-field-online-resources\n        *ngIf=\"modelSpecifier === 'onlineResourceType:!link'\"\n        [metadataUuid]=\"uniqueIdentifier\"\n        [value]=\"valueAsOnlineResources\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-online-resources>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'onlineResources'\">\n      <gn-ui-form-field-online-link-resources\n        *ngIf=\"modelSpecifier === 'onlineResourceType:link'\"\n        [metadataUuid]=\"uniqueIdentifier\"\n        [value]=\"valueAsOnlineResources\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-online-link-resources>\n    </ng-container>\n  </ng-container>\n\n  <ng-container *ngIf=\"!model\">\n    <ng-container [ngSwitch]=\"componentName\">\n      <ng-container *ngSwitchCase=\"'form-field-constraints-shortcuts'\">\n        <gn-ui-form-field-constraints-shortcuts></gn-ui-form-field-constraints-shortcuts>\n      </ng-container>\n      <ng-container *ngSwitchCase=\"'form-field-spatial-toggle'\">\n        <gn-ui-form-field-spatial-toggle></gn-ui-form-field-spatial-toggle>\n      </ng-container>\n    </ng-container>\n  </ng-container>\n</ng-template>\n", styles: [":host{scroll-margin-top:90px}:host.gn-ui-field-focus-glow{position:relative}:host.gn-ui-field-focus-glow:after{content:\"\";position:absolute;inset:-8px;border-radius:8px;background-color:color-mix(in srgb,var(--color-primary) 12%,transparent);pointer-events:none;animation:gn-ui-field-focus-glow 3s ease-out forwards}:host.gn-ui-field-focus-glow:before{content:\"\";position:absolute;inset:-16px;border:2px dashed var(--color-primary);border-radius:10px;pointer-events:none;animation:gn-ui-field-focus-glow 3s ease-out forwards}@keyframes gn-ui-field-focus-glow{0%,55%{opacity:1}to{opacity:0}}\n"] }]
         }], propDecorators: { uniqueIdentifier: [{
                 type: Input
             }], model: [{
@@ -44042,7 +44409,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
 class RecordFormComponent {
     constructor() {
         this.facade = inject(EditorFacade);
+        this.subscription = new Subscription();
         this.recordUniqueIdentifier$ = this.facade.record$.pipe(map$2((record) => record.uniqueIdentifier));
+        this.focusFieldWithPage$ = this.facade.focusedField$.pipe(switchMap$1(async (field) => [field, await this.getPageIndexForField(field)]));
+        this.formFields = viewChildren(FormFieldComponent, ...(ngDevMode ? [{ debugName: "formFields" }] : []));
+    }
+    focusField(model) {
+        const fields = this.formFields();
+        const field = fields.find((f) => f.model === model);
+        field?.fieldFocus.focusField();
+    }
+    ngOnInit() {
+        this.subscription.add(this.focusFieldWithPage$
+            .pipe(withLatestFrom$1(this.facade.currentPage$, ([field, fieldPage], currentPage) => [field, fieldPage, currentPage]))
+            .subscribe(([field, fieldPage, currentPage]) => {
+            if (fieldPage !== null && fieldPage !== currentPage) {
+                this.facade.setCurrentPage(fieldPage);
+            }
+            setTimeout(() => this.focusField(field));
+        }));
+    }
+    ngOnDestroy() {
+        this.subscription.unsubscribe();
     }
     handleFieldValueChange(model, newValue) {
         if (!model) {
@@ -44056,13 +44444,18 @@ class RecordFormComponent {
     sectionTracker(index, section) {
         return section.labelKey;
     }
+    async getPageIndexForField(model) {
+        const config = await firstValueFrom(this.facade.editorConfig$);
+        const pageIndex = config.pages.findIndex((page) => page.sections.some((section) => section.fields.some((field) => field.model === model)));
+        return pageIndex >= 0 ? pageIndex : null;
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: RecordFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: RecordFormComponent, isStandalone: true, selector: "gn-ui-record-form", ngImport: i0, template: "<div class=\"flex flex-col gap-6\">\n  @for (\n    section of facade.currentSections$ | async;\n    track sectionTracker($index, section)\n  ) {\n    @if (!section.hidden) {\n      <div class=\"flex flex-col gap-6 border p-8 rounded-[8px] shadow\">\n        <div class=\"flex flex-col gap-2\">\n          @if (section.labelKey) {\n            <div class=\"text-2xl font-title text-black\" translate>\n              {{ section.labelKey }}\n            </div>\n          }\n          @if (section.descriptionKey) {\n            <div class=\"text-gray-800 text-sm\" translate>\n              {{ section.descriptionKey }}\n            </div>\n          }\n        </div>\n        <div class=\"grid auto-rows-auto grid-cols-2 gap-[32px]\">\n          @for (\n            field of section.fieldsWithValues;\n            track fieldTracker($index, field)\n          ) {\n            @if (!field.config.hidden) {\n              <gn-ui-form-field\n                [ngClass]=\"\n                  field.config.gridColumnSpan === 1\n                    ? 'col-span-1'\n                    : 'col-span-2'\n                \"\n                [uniqueIdentifier]=\"recordUniqueIdentifier$ | async\"\n                [model]=\"field.config.model!\"\n                [modelSpecifier]=\"field.config.modelSpecifier!\"\n                [config]=\"field.config.formFieldConfig\"\n                [value]=\"field.value\"\n                [componentName]=\"field.config.componentName\"\n                (valueChange)=\"\n                  handleFieldValueChange(field.config.model!, $event)\n                \"\n              ></gn-ui-form-field>\n            }\n          }\n        </div>\n      </div>\n    }\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: FormFieldComponent, selector: "gn-ui-form-field", inputs: ["uniqueIdentifier", "model", "modelSpecifier", "componentName", "config", "value"], outputs: ["valueChange"] }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: RecordFormComponent, isStandalone: true, selector: "gn-ui-record-form", viewQueries: [{ propertyName: "formFields", predicate: FormFieldComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"flex flex-col gap-6\">\n  @for (\n    section of facade.currentSections$ | async;\n    track sectionTracker($index, section)\n  ) {\n    @if (!section.hidden) {\n      <div class=\"flex flex-col gap-6 border p-8 rounded-[8px] shadow\">\n        <div class=\"flex flex-col gap-2\">\n          @if (section.labelKey) {\n            <div class=\"text-2xl font-title text-black\" translate>\n              {{ section.labelKey }}\n            </div>\n          }\n          @if (section.descriptionKey) {\n            <div class=\"text-gray-800 text-sm\" translate>\n              {{ section.descriptionKey }}\n            </div>\n          }\n        </div>\n        <div class=\"grid auto-rows-auto grid-cols-2 gap-[32px]\">\n          @for (\n            field of section.fieldsWithValues;\n            track fieldTracker($index, field)\n          ) {\n            @if (!field.config.hidden) {\n              <gn-ui-form-field\n                [ngClass]=\"\n                  field.config.gridColumnSpan === 1\n                    ? 'col-span-1'\n                    : 'col-span-2'\n                \"\n                [uniqueIdentifier]=\"recordUniqueIdentifier$ | async\"\n                [model]=\"field.config.model!\"\n                [modelSpecifier]=\"field.config.modelSpecifier!\"\n                [config]=\"field.config.formFieldConfig\"\n                [value]=\"field.value\"\n                [componentName]=\"field.config.componentName\"\n                (valueChange)=\"\n                  handleFieldValueChange(field.config.model!, $event)\n                \"\n              ></gn-ui-form-field>\n            }\n          }\n        </div>\n      </div>\n    }\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: FormFieldComponent, selector: "gn-ui-form-field", inputs: ["uniqueIdentifier", "model", "modelSpecifier", "componentName", "config", "value"], outputs: ["valueChange"] }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: RecordFormComponent, decorators: [{
             type: Component,
             args: [{ selector: 'gn-ui-record-form', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, FormFieldComponent, TranslateDirective], template: "<div class=\"flex flex-col gap-6\">\n  @for (\n    section of facade.currentSections$ | async;\n    track sectionTracker($index, section)\n  ) {\n    @if (!section.hidden) {\n      <div class=\"flex flex-col gap-6 border p-8 rounded-[8px] shadow\">\n        <div class=\"flex flex-col gap-2\">\n          @if (section.labelKey) {\n            <div class=\"text-2xl font-title text-black\" translate>\n              {{ section.labelKey }}\n            </div>\n          }\n          @if (section.descriptionKey) {\n            <div class=\"text-gray-800 text-sm\" translate>\n              {{ section.descriptionKey }}\n            </div>\n          }\n        </div>\n        <div class=\"grid auto-rows-auto grid-cols-2 gap-[32px]\">\n          @for (\n            field of section.fieldsWithValues;\n            track fieldTracker($index, field)\n          ) {\n            @if (!field.config.hidden) {\n              <gn-ui-form-field\n                [ngClass]=\"\n                  field.config.gridColumnSpan === 1\n                    ? 'col-span-1'\n                    : 'col-span-2'\n                \"\n                [uniqueIdentifier]=\"recordUniqueIdentifier$ | async\"\n                [model]=\"field.config.model!\"\n                [modelSpecifier]=\"field.config.modelSpecifier!\"\n                [config]=\"field.config.formFieldConfig\"\n                [value]=\"field.value\"\n                [componentName]=\"field.config.componentName\"\n                (valueChange)=\"\n                  handleFieldValueChange(field.config.model!, $event)\n                \"\n              ></gn-ui-form-field>\n            }\n          }\n        </div>\n      </div>\n    }\n  }\n</div>\n" }]
-        }] });
+        }], propDecorators: { formFields: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => FormFieldComponent), { isSignal: true }] }] } });
 
 function evaluate(expression) {
     if (expression.match(/^\${.*}$/)) {
@@ -44682,5 +45075,5 @@ const CHART_TYPE_VALUES = [
  * Generated bundle index. Do not edit.
  */
 
-export { ABOUT_SECTION, ADD_RESULTS, ADD_SEARCH, ANNEXES_SECTION, ASSOCIATED_RESOURCES_SECTION, AVAILABLE_LICENSES, AbstractAction, AbstractSearchField, ActionMenuComponent, AddLayerFromCatalogComponent, AddLayerRecordPreviewComponent, AddResults, AddSearch, AnchorLinkDirective, ApiCardComponent, ApplicationBannerComponent, AuthService, AutocompleteComponent, AvailableServicesField, AvatarComponent, AvatarServiceInterface, BASEMAP_LAYERS, BadgeComponent, BaseConverter, BaseFileReader, BaseReader, BlockListComponent, ButtonComponent, CHART_TYPE_VALUES, CLASSIFICATION_SECTION, CLEAR_ERROR, CLEAR_RESULTS, CONSTRAINTS_SHORTCUTS, CONTACTS, CONTACTS_FOR_RESOURCE_FIELD, CarouselComponent, CatalogTitleComponent, CellPopinComponent, ChartComponent, ChartViewComponent, CheckToggleComponent, CheckboxComponent, ClearError, ClearResults, ColorScaleComponent, ConfirmationDialogComponent, ContentGhostComponent, CopyTextButtonComponent, DATA_MANAGERS_SECTION, DEFAULT_CONFIGURATION, DEFAULT_GN4_LOGIN_URL, DEFAULT_GN4_LOGOUT_URL, DEFAULT_GN4_SETTINGS_URL, DEFAULT_LANG, DEFAULT_PAGE_SIZE, DEFAULT_RESULTS_LAYOUT_CONFIG, DEFAULT_SEARCH_KEY, DISABLE_AUTH, DO_NOT_USE_DEFAULT_BASEMAP, DataService, DataTableComponent, DataViewComponent, DataViewPermalinkComponent, DataViewShareComponent, DataViewWebComponentComponent, DatePickerComponent, DateRangeDropdownComponent, DateRangeInputsComponent, DateRangePickerComponent, DateRangeSearchField, DateService, DcatApConverter, DefaultRouterModule, DownloadItemComponent, DownloadsListComponent, DragAndDropFileInputComponent, DropdownMultiselectComponent, DropdownSelectorComponent, EDITOR_FEATURE_KEY, ES_QUERY_FIELDS_PRIORITY, ES_RESOURCES_VALUES, ES_SOURCE_SUMMARY, EXTERNAL_VIEWER_OPEN_NEW_TAB, EXTERNAL_VIEWER_URL_TEMPLATE, EditableLabelDirective, EditorFacade, EditorService, ElasticsearchService, EmbeddedTranslateLoader, ErrorComponent, ErrorType, ExpandablePanelButtonComponent, ExpandablePanelComponent, ExternalLinkCardComponent, ExternalViewerButtonComponent, FIELDS_BRIEF, FIELDS_SUMMARY, FILTER_GEOMETRY, FILTER_SUMMARY_IGNORE_LIST, FORMATS, FacetBlockComponent, FacetItemComponent, FacetListComponent, FacetsContainerComponent, FavoriteStarComponent, FavoritesService, FeatureCatalogListComponent, FeatureDetailComponent, FeatureEditorModule, FeatureMapModule, FeatureRecordModule, FeatureSearchModule, FetchError, FieldsService, FigureComponent, FigureContainerComponent, FileInputComponent, FileTranslateLoader, FilesDropDirective, FilterDropdownComponent, FormFieldArrayComponent, FormFieldComponent, FormFieldDateComponent, FormFieldFileComponent, FormFieldKeywordsComponent, FormFieldLicenseComponent, FormFieldObjectComponent, FormFieldRichComponent, FormFieldSimpleComponent, FormFieldSpatialExtentComponent, FormFieldTemporalExtentsComponent, FormFieldTopicsComponent, FormFieldWrapperComponent, FullTextSearchField, FuzzySearchComponent, GEOGRAPHICAL_COVERAGE_SECTION, GEONETWORK_UI_TAG_NAME, GEONETWORK_UI_VERSION, GeoDataBadgeComponent, GeoTableViewComponent, GeocodingComponent, GeojsonReader, Gn4Converter, Gn4PlatformMapper, Gn4PlatformService, Gn4Repository, Gn4SettingsService, GnUiHumanizeDateDirective, GpfApiDlComponent, GravatarService, HttpLoaderFactory, I18nInterceptor, INSPIRE_TOPICS, ImageFallbackDirective, ImageInputComponent, ImageOverlayPreviewComponent, ImportRecordComponent, InlineFilterComponent, InteractiveTableColumnComponent, InteractiveTableComponent, InternalLinkCardComponent, IsSpatialSearchField, Iso191153Converter, Iso19139Converter, KindBadgeComponent, LANGUAGES_LIST, LANGUAGE_NAMES, LANGUAGE_STORAGE_KEY, LANG_2_TO_3_MAPPER, LEGAL_CONSTRAINTS_FIELD, LOGIN_URL, LOGOUT_URL, LONLAT_CRS_CODES, LanguageSwitcherComponent, LayersPanelComponent, LicenseSearchField, LinkClassifierService, LinkUsage, LoadingMaskComponent, LogService, MAP_FEATURE_KEY, MAP_VIEW_CONSTRAINTS, MAX_UPLOAD_SIZE_MB, METADATA_LANGUAGE, METADATA_POINT_OF_CONTACT_SECTION, MapContainerComponent, MapFacade, MapLegendComponent, MapStateContainerComponent, MapStyleService, MapUtilsService, MapViewComponent, MarkdownEditorComponent, MarkdownParserComponent, MaxLinesComponent, mdview_actions as MdViewActions, MdViewFacade, MetadataCatalogComponent, MetadataContactComponent, MetadataDoiComponent, MetadataInfoComponent, MetadataLinkType, MetadataMapperContext, MetadataQualityComponent, MetadataQualityItemComponent, MetadataQualityPanelComponent, ModalDialogComponent, MultilingualPanelComponent, MultilingualSearchField, MyOrgService, NAMESPACES, NOT_APPLICABLE_CONSTRAINT, NOT_KNOWN_CONSTRAINT, NotificationComponent, NotificationsContainerComponent, NotificationsService, OPEN_DATA_LICENSE, ORGANIZATIONS_STRATEGY, ORGANIZATION_PAGE_URL_TOKEN, ORGANIZATION_URL_TOKEN, OTHER_CONSTRAINTS_FIELD, OnlineResourceCardComponent, OnlineServiceResourceInputComponent, OrganisationPreviewComponent, OrganisationsComponent, OrganisationsFilterComponent, OrganisationsResultComponent, OrganizationSearchField, OrganizationsFromGroupsService, OrganizationsFromMetadataService, OrganizationsServiceInterface, OwnerSearchField, PAGINATE, PARSE_DELIMITER, PATCH_RESULTS_AGGREGATIONS, PROXY_PATH, Paginate, PaginationButtonsComponent, PaginationComponent, PaginationDotsComponent, PatchResultsAggregations, PlatformServiceInterface, PopoverComponent, PopupAlertComponent, PossibleResourceTypes, PossibleResourceTypesDefinition, PreviousNextButtonsComponent, ProgressBarComponent, ProxyService, QUERY_FIELDS, RECORD_ABSTRACT_FIELD, RECORD_DATASET_URL_TOKEN, RECORD_GRAPHICAL_OVERVIEW_FIELD, RECORD_KEYWORDS_FIELD, RECORD_LICENSE_FIELD, RECORD_ONLINE_LINK_RESOURCES, RECORD_ONLINE_RESOURCES, RECORD_RESOURCE_CREATED_FIELD, RECORD_RESOURCE_UPDATED_FIELD, RECORD_REUSE_URL_TOKEN, RECORD_SERVICE_URL_TOKEN, RECORD_SPATIAL_EXTENTS_FIELD, RECORD_SPATIAL_TOGGLE_FIELD, RECORD_TEMPORAL_EXTENTS_FIELD, RECORD_TITLE_FIELD, RECORD_TOPICS_FIELD, RECORD_UNIQUE_IDENTIFIER_FIELD, RECORD_UPDATED_FIELD, RECORD_UPDATE_FREQUENCY_FIELD, REQUEST_MORE_ON_AGGREGATION, REQUEST_MORE_RESULTS, REQUEST_NEW_RESULTS, RESOURCE_IDENTIFIER_FIELD, 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, RecordStatusValues, RecordsMetricsComponent, RecordsRepositoryInterface, RecordsService, RequestMoreOnAggregation, RequestMoreResults, RequestNewResults, ResourceTypeLegacyField, ResultsHitsContainerComponent, ResultsHitsNumberComponent, ResultsHitsSearchKindComponent, ResultsLayoutComponent, ResultsLayoutConfigItem, ResultsListComponent, ResultsListContainerComponent, ResultsListItemComponent, ResultsTableComponent, ResultsTableContainerComponent, ReusePresentationForms, RoleLabels, RoleValues, RouterEffects, RouterFacade, RouterService, SEARCH_FEATURE_KEY, SECURITY_CONSTRAINTS_FIELD, 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, SPATIAL_SCOPES, 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, SortByEnum, SortableListComponent, SourceLabelComponent, SourcesService, SpatialExtentComponent, SpinningLoaderComponent, StacItemsResultGridComponent, StacViewComponent, StarToggleComponent, StickyHeaderComponent, SupportedTypes, SwitchToggleComponent, THUMBNAIL_PLACEHOLDER, TITLE_SECTION, TOPICS_SECTION, TRANSLATE_DEBUG_CONFIG, TRANSLATE_DEFAULT_CONFIG, TRANSLATE_WITH_OVERRIDES_CONFIG, TableViewComponent, TextAreaComponent, TextInputComponent, ThemeService, ThumbnailComponent, TranslatedSearchField, TruncatedTextComponent, UPDATE_CONFIG_AGGREGATIONS, UPDATE_FILTERS, UPDATE_REQUEST_AGGREGATION_TERM, USE_AND_ACCESS_CONDITIONS_SECTION, UpdateConfigAggregations, UpdateFilters, UrlInputComponent, UserFeedbackItemComponent, UserPreviewComponent, UserSearchField, VECTOR_STYLE_DEFAULT, ViewportIntersectorComponent, WEB_COMPONENT_EMBEDDER_URL, XmlParseError, _reset, allChildrenElement, appConfigWithTranslationFixture, appendChildTree, appendChildren, assertValidXml, blockModelFixture, bytesToMegabytes, canEditRecord, checkFileFormat, clearSelectedFeatures, createChild, createDocument, createElement, createFuzzyFilter, createNestedChild, createNestedElement, currentPage, defaultMapStyleFixture, defaultMapStyleHlFixture, downgradeImage, downsizeImage, draftSaveSuccess, dragPanCondition, dropEmptyTranslations, editorReducer, emptyBlockModelFixture, findChildElement, findChildOrCreate, findChildrenElement, findConverterForDocument, findNestedChildOrCreate, findNestedElement, findNestedElements, findParent, firstChildElement, formatDate, formatUserInfo, getAllKeysValidator, getArrayItem, getAsArray, getAsUrl, getBadgeColor, getCustomTranslations, getError, getFavoritesOnly, getFileFormat, getFileFormatFromServiceOutput, getFirstValue, getFormatPriority, getGeometryBoundingBox, getGeometryFromGeoJSON, getGlobalConfig, getIsMobile, getJsonDataItemsProxy, getLayers, getLinkId, getLinkLabel, getLinkPriority, getMapContext, getMapContextLayerFromConfig, getMapState, getMetadataQualityConfig, getMimeTypeForFormat, getNamespace, getOptionalMapConfig, getOptionalSearchConfig, getPageSize, getQualityValidators, getResourceType, getReusePresentationForm, getReuseType, getRootElement, getSearchConfigAggregations, getSearchFilters, getSearchResults, getSearchResultsAggregations, getSearchResultsHits, getSearchResultsLayout, getSearchResultsLoading, getSearchSortBy, getSearchState, getSearchStateSearch, getSelectedFeatures, getSpatialFilterEnabled, getTemporalRangeUnion, getThemeConfig, handleScrollOnNavigation, hasRecordChangedSinceDraft, hasRecordChangedSinceDraftSuccess, initSearch, initialEditorState, initialMapState, initialState, isConfigLoaded, isDateRange, isFormatInQueryParam, isPublished, itemModelFixture, kindToCodeListValue, loadAppConfig, malformedConfigFixture, mapConfigFixture, mapContact, mapKeywords, mapLogo, mapOrganization, mapReducer, markRecordAsChanged, matchesNoApplicableConstraint, matchesNoKnownConstraint, megabytesToBytes, mimeTypeToFormat, minimalAppConfigFixture, missingMandatoryConfigFixture, mouseWheelZoomCondition, noDuplicateFileName, okAppConfigFixture, openDataset, openRecord, organizationsServiceFactory, parse, parseXmlString, placeholder, prioritizePageScroll, propagateToDocumentOnly, provideGn4, provideI18n, provideRepositoryUrl, readAttribute, readDataset, readDatasetHeaders, readText, reducer$2 as reducer, reducerSearch, removeAllChildren, removeChildren, removeChildrenByName, removeSearchParams, removeWhitespace, renameElements, saveRecord, saveRecordFailure, saveRecordSuccess, selectCanEditRecord, selectCurrentPage, selectEditorConfig, selectEditorState, selectFallback, selectFallbackFields, selectField, selectHasRecordChanged, selectIsPublished, selectRecord, selectRecordChangedSinceSave, selectRecordSaveError, selectRecordSaving, selectRecordSections, selectRecordSource, selectTranslatedField, selectTranslatedValue, setContext, setCurrentPage, setEditorConfiguration, setFieldVisibility, setSelectedFeatures, setTextContent, someHabTableItemFixture, sortByFromString, sortByToString, sortByToStrings, stripHtml, stripNamespace, tableItemsFixture, toDate, toLang2, toLang3, totalPages, undoRecordDraft, unrecognizedKeysConfigFixture, updateFrequencyCodeValues, updateLanguages, updateRecordField, updateRecordLanguages, wmsLayerFlatten, writeAttribute, wrongLanguageCodeConfigFixture, xmlToString };
+export { ABOUT_SECTION, ADD_RESULTS, ADD_SEARCH, ANNEXES_SECTION, ASSOCIATED_RESOURCES_SECTION, AVAILABLE_LICENSES, AbstractAction, AbstractSearchField, ActionMenuComponent, AddLayerFromCatalogComponent, AddLayerRecordPreviewComponent, AddResults, AddSearch, AnchorLinkDirective, ApiCardComponent, ApplicationBannerComponent, AuthService, AutocompleteComponent, AvailableServicesField, AvatarComponent, AvatarServiceInterface, BASEMAP_LAYERS, BadgeComponent, BaseConverter, BaseFileReader, BaseReader, BlockListComponent, ButtonComponent, CHART_TYPE_VALUES, CLASSIFICATION_SECTION, CLEAR_ERROR, CLEAR_RESULTS, CONSTRAINTS_SHORTCUTS, CONTACTS, CONTACTS_FOR_RESOURCE_FIELD, CarouselComponent, CatalogTitleComponent, CellPopinComponent, ChartComponent, ChartViewComponent, CheckToggleComponent, CheckboxComponent, ClearError, ClearResults, ColorScaleComponent, ConfirmationDialogComponent, ContactDetailsComponent, ContactPillComponent, ContentGhostComponent, CopyTextButtonComponent, DATA_MANAGERS_SECTION, DEFAULT_CONFIGURATION, DEFAULT_GN4_LOGIN_URL, DEFAULT_GN4_LOGOUT_URL, DEFAULT_GN4_SETTINGS_URL, DEFAULT_LANG, DEFAULT_PAGE_SIZE, DEFAULT_RESULTS_LAYOUT_CONFIG, DEFAULT_SEARCH_KEY, DISABLE_AUTH, DISABLE_DRAFT, DO_NOT_USE_DEFAULT_BASEMAP, DataService, DataTableComponent, DataViewComponent, DataViewPermalinkComponent, DataViewShareComponent, DataViewWebComponentComponent, DatePickerComponent, DateRangeDropdownComponent, DateRangeInputsComponent, DateRangePickerComponent, DateRangeSearchField, DateService, DcatApConverter, DefaultRouterModule, DownloadItemComponent, DownloadsListComponent, DragAndDropFileInputComponent, DropdownMultiselectComponent, DropdownSelectorComponent, EDITOR_FEATURE_KEY, ES_QUERY_FIELDS_PRIORITY, ES_RESOURCES_VALUES, ES_SOURCE_SUMMARY, EXTERNAL_VIEWER_OPEN_NEW_TAB, EXTERNAL_VIEWER_URL_TEMPLATE, EditableLabelDirective, EditorFacade, EditorService, ElasticsearchService, EmbeddedTranslateLoader, ErrorComponent, ErrorType, ExpandablePanelButtonComponent, ExpandablePanelComponent, ExternalLinkCardComponent, ExternalViewerButtonComponent, FIELDS_BRIEF, FIELDS_SUMMARY, FILTER_GEOMETRY, FILTER_SUMMARY_IGNORE_LIST, FORMATS, FacetBlockComponent, FacetItemComponent, FacetListComponent, FacetsContainerComponent, FavoriteStarComponent, FavoritesService, FeatureCatalogListComponent, FeatureDetailComponent, FeatureEditorModule, FeatureMapModule, FeatureRecordModule, FeatureSearchModule, FetchError, FieldFocusDirective, FieldsService, FigureComponent, FigureContainerComponent, FileInputComponent, FileTranslateLoader, FilesDropDirective, FilterDropdownComponent, FormFieldArrayComponent, FormFieldComponent, FormFieldDateComponent, FormFieldFileComponent, FormFieldKeywordsComponent, FormFieldLicenseComponent, FormFieldObjectComponent, FormFieldRichComponent, FormFieldSimpleComponent, FormFieldSpatialExtentComponent, FormFieldTemporalExtentsComponent, FormFieldTopicsComponent, FormFieldWrapperComponent, FullTextSearchField, FuzzySearchComponent, GEOGRAPHICAL_COVERAGE_SECTION, GEONETWORK_UI_TAG_NAME, GEONETWORK_UI_VERSION, GeoDataBadgeComponent, GeoTableViewComponent, GeocodingComponent, GeojsonReader, Gn4Converter, Gn4PlatformMapper, Gn4PlatformService, Gn4Repository, Gn4SettingsService, GnUiHumanizeDateDirective, GpfApiDlComponent, GravatarService, HttpLoaderFactory, I18nInterceptor, INSPIRE_TOPICS, ImageFallbackDirective, ImageInputComponent, ImageOverlayPreviewComponent, ImportRecordComponent, InlineFilterComponent, InteractiveTableColumnComponent, InteractiveTableComponent, InternalLinkCardComponent, IsSpatialSearchField, Iso191153Converter, Iso19139Converter, KindBadgeComponent, LANGUAGES_LIST, LANGUAGE_NAMES, LANGUAGE_STORAGE_KEY, LANG_2_TO_3_MAPPER, LEGAL_CONSTRAINTS_FIELD, LOGIN_URL, LOGOUT_URL, LONLAT_CRS_CODES, LanguageSwitcherComponent, LayersPanelComponent, LicenseSearchField, LinkClassifierService, LinkUsage, LoadingMaskComponent, LogService, MAP_FEATURE_KEY, MAP_VIEW_CONSTRAINTS, MAX_UPLOAD_SIZE_MB, METADATA_LANGUAGE, METADATA_POINT_OF_CONTACT_SECTION, MapContainerComponent, MapFacade, MapLegendComponent, MapStateContainerComponent, MapStyleService, MapUtilsService, MapViewComponent, MarkdownEditorComponent, MarkdownParserComponent, MaxLinesComponent, mdview_actions as MdViewActions, MdViewFacade, MetadataCatalogComponent, MetadataContactComponent, MetadataDoiComponent, MetadataInfoComponent, MetadataLinkType, MetadataMapperContext, MetadataQualityComponent, MetadataQualityItemComponent, MetadataQualityPanelComponent, ModalDialogComponent, MultilingualPanelComponent, MultilingualSearchField, MyOrgService, NAMESPACES, NOT_APPLICABLE_CONSTRAINT, NOT_KNOWN_CONSTRAINT, NotificationComponent, NotificationsContainerComponent, NotificationsService, OPEN_DATA_LICENSE, ORGANIZATIONS_STRATEGY, ORGANIZATION_PAGE_URL_TOKEN, ORGANIZATION_URL_TOKEN, OTHER_CONSTRAINTS_FIELD, OnlineResourceCardComponent, OnlineServiceResourceInputComponent, OrganisationPreviewComponent, OrganisationsComponent, OrganisationsFilterComponent, OrganisationsResultComponent, OrganizationSearchField, OrganizationsFromGroupsService, OrganizationsFromMetadataService, OrganizationsServiceInterface, OwnerSearchField, PAGINATE, PARSE_DELIMITER, PATCH_RESULTS_AGGREGATIONS, PROXY_PATH, Paginate, PaginationButtonsComponent, PaginationComponent, PaginationDotsComponent, PatchResultsAggregations, PlatformServiceInterface, PopoverComponent, PopupAlertComponent, PossibleResourceTypes, PossibleResourceTypesDefinition, PreviousNextButtonsComponent, ProgressBarComponent, ProxyService, QUERY_FIELDS, RECORD_ABSTRACT_FIELD, RECORD_DATASET_URL_TOKEN, RECORD_GRAPHICAL_OVERVIEW_FIELD, RECORD_KEYWORDS_FIELD, RECORD_LICENSE_FIELD, RECORD_ONLINE_LINK_RESOURCES, RECORD_ONLINE_RESOURCES, RECORD_RESOURCE_CREATED_FIELD, RECORD_RESOURCE_UPDATED_FIELD, RECORD_REUSE_URL_TOKEN, RECORD_SERVICE_URL_TOKEN, RECORD_SPATIAL_EXTENTS_FIELD, RECORD_SPATIAL_TOGGLE_FIELD, RECORD_TEMPORAL_EXTENTS_FIELD, RECORD_TITLE_FIELD, RECORD_TOPICS_FIELD, RECORD_UNIQUE_IDENTIFIER_FIELD, RECORD_UPDATED_FIELD, RECORD_UPDATE_FREQUENCY_FIELD, REQUEST_MORE_ON_AGGREGATION, REQUEST_MORE_RESULTS, REQUEST_NEW_RESULTS, RESOURCE_IDENTIFIER_FIELD, 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, RecordStatusValues, RecordsMetricsComponent, RecordsRepositoryInterface, RecordsService, RequestMoreOnAggregation, RequestMoreResults, RequestNewResults, ResourceTypeLegacyField, ResultsHitsContainerComponent, ResultsHitsNumberComponent, ResultsHitsSearchKindComponent, ResultsLayoutComponent, ResultsLayoutConfigItem, ResultsListComponent, ResultsListContainerComponent, ResultsListItemComponent, ResultsTableComponent, ResultsTableContainerComponent, ReusePresentationForms, RoleLabels, RoleValues, RouterEffects, RouterFacade, RouterService, SEARCH_FEATURE_KEY, SECURITY_CONSTRAINTS_FIELD, 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, SPATIAL_SCOPES, 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, SortByEnum, SortableListComponent, SourceLabelComponent, SourcesService, SpatialExtentComponent, SpinningLoaderComponent, StacItemsResultGridComponent, StacViewComponent, StarToggleComponent, StickyHeaderComponent, SupportedTypes, SwitchToggleComponent, THUMBNAIL_PLACEHOLDER, TITLE_SECTION, TOPICS_SECTION, TRANSLATE_DEBUG_CONFIG, TRANSLATE_DEFAULT_CONFIG, TRANSLATE_WITH_OVERRIDES_CONFIG, TableViewComponent, TextAreaComponent, TextInputComponent, ThemeService, ThumbnailComponent, TranslatedSearchField, TruncatedTextComponent, UPDATE_CONFIG_AGGREGATIONS, UPDATE_FILTERS, UPDATE_REQUEST_AGGREGATION_TERM, USE_AND_ACCESS_CONDITIONS_SECTION, UpdateConfigAggregations, UpdateFilters, UrlInputComponent, UserFeedbackItemComponent, UserPreviewComponent, UserSearchField, VECTOR_STYLE_DEFAULT, ViewportIntersectorComponent, WEB_COMPONENT_EMBEDDER_URL, XmlParseError, _reset, allChildrenElement, appConfigWithTranslationFixture, appendChildTree, appendChildren, assertValidXml, blockModelFixture, bytesToMegabytes, canEditRecord, checkFileFormat, clearSelectedFeatures, createChild, createDocument, createElement, createFuzzyFilter, createNestedChild, createNestedElement, currentPage, defaultMapStyleFixture, defaultMapStyleHlFixture, downgradeImage, downsizeImage, draftSaveSuccess, dragPanCondition, dropEmptyTranslations, editorReducer, emptyBlockModelFixture, findChildElement, findChildOrCreate, findChildrenElement, findConverterForDocument, findNestedChildOrCreate, findNestedElement, findNestedElements, findParent, firstChildElement, formatDate, formatUserInfo, getAddressLines, getAllKeysValidator, getArrayItem, getAsArray, getAsUrl, getBadgeColor, getCustomTranslations, getError, getFavoritesOnly, getFileFormat, getFileFormatFromServiceOutput, getFirstValue, getFormatPriority, getGeometryBoundingBox, getGeometryFromGeoJSON, getGlobalConfig, getIndividualDisplayName, getIsMobile, getJsonDataItemsProxy, getLayers, getLinkId, getLinkLabel, getLinkPriority, getMapContext, getMapContextLayerFromConfig, getMapState, getMetadataQualityConfig, getMimeTypeForFormat, getNamespace, getOptionalEditorConfig, getOptionalMapConfig, getOptionalSearchConfig, getPageSize, getQualityValidators, getResourceType, getReusePresentationForm, getReuseType, getRootElement, getSearchConfigAggregations, getSearchFilters, getSearchResults, getSearchResultsAggregations, getSearchResultsHits, getSearchResultsLayout, getSearchResultsLoading, getSearchSortBy, getSearchState, getSearchStateSearch, getSelectedFeatures, getSpatialFilterEnabled, getTemporalRangeUnion, getThemeConfig, handleScrollOnNavigation, hasRecordChangedSinceDraft, hasRecordChangedSinceDraftSuccess, initSearch, initialEditorState, initialMapState, initialState, isConfigLoaded, isDateRange, isFormatInQueryParam, isPublished, itemModelFixture, kindToCodeListValue, loadAppConfig, malformedConfigFixture, mapConfigFixture, mapContact, mapKeywords, mapLogo, mapOrganization, mapReducer, markRecordAsChanged, matchesNoApplicableConstraint, matchesNoKnownConstraint, megabytesToBytes, mimeTypeToFormat, minimalAppConfigFixture, missingMandatoryConfigFixture, mouseWheelZoomCondition, noDuplicateFileName, okAppConfigFixture, openDataset, openRecord, organizationsServiceFactory, parse, parseXmlString, placeholder, prioritizePageScroll, propagateToDocumentOnly, provideGn4, provideI18n, provideRepositoryUrl, readAttribute, readDataset, readDatasetHeaders, readText, reducer$2 as reducer, reducerSearch, removeAllChildren, removeChildren, removeChildrenByName, removeSearchParams, removeWhitespace, renameElements, saveRecord, saveRecordFailure, saveRecordSuccess, selectCanEditRecord, selectCurrentPage, selectEditorConfig, selectEditorState, selectFallback, selectFallbackFields, selectField, selectHasRecordChanged, selectIsPublished, selectRecord, selectRecordChangedSinceSave, selectRecordSaveError, selectRecordSaving, selectRecordSections, selectRecordSource, selectTranslatedField, selectTranslatedValue, setContext, setCurrentPage, setEditorConfiguration, setFieldVisibility, setFocusedField, setSelectedFeatures, setTextContent, someHabTableItemFixture, sortByFromString, sortByToString, sortByToStrings, stripHtml, stripNamespace, tableItemsFixture, toDate, toIndividual, toLang2, toLang3, totalPages, undoRecordDraft, unrecognizedKeysConfigFixture, updateFrequencyCodeValues, updateLanguages, updateRecordField, updateRecordLanguages, wmsLayerFlatten, writeAttribute, wrongLanguageCodeConfigFixture, xmlToString };
 //# sourceMappingURL=geonetwork-ui.mjs.map