geonetwork-ui 2.4.0-dev.e7ff1d25 → 2.4.0-dev.e97caaf2

package/fesm2022/geonetwork-ui.mjs

@@ -15,7 +15,7 @@ import { map as map$1, catchError, tap as tap$1, shareReplay, filter, startWith,
 import { marker } from '@biesbjerg/ngx-translate-extract-marker';
 import * as i1$3 from '@angular/common';
 import { CommonModule, NgFor, NgComponentOutlet, NgOptimizedImage, NgForOf } from '@angular/common';
-import { of, map as map$2, lastValueFrom, Subject, switchMap, throwError, combineLatest, from, takeLast, forkJoin, firstValueFrom, merge, BehaviorSubject, fromEvent, timer, animationFrameScheduler, Subscription, ReplaySubject, first, distinctUntilChanged as distinctUntilChanged$1, filter as filter$1, tap as tap$2, Observable, buffer, debounceTime as debounceTime$1, combineLatestWith, catchError as catchError$1, takeUntil, EMPTY, exhaustMap, mergeMap as mergeMap$1, withLatestFrom as withLatestFrom$1, startWith as startWith$1, pairwise as pairwise$1 } from 'rxjs';
+import { of, map as map$2, lastValueFrom, Subject, switchMap, throwError, combineLatest, from, takeLast, forkJoin, firstValueFrom, merge, BehaviorSubject, fromEvent, timer, animationFrameScheduler, Subscription, ReplaySubject, first, distinctUntilChanged as distinctUntilChanged$1, filter as filter$1, tap as tap$2, Observable, buffer, debounceTime as debounceTime$1, combineLatestWith, catchError as catchError$1, takeUntil, EMPTY, exhaustMap, mergeMap as mergeMap$1, withLatestFrom as withLatestFrom$1, shareReplay as shareReplay$1, startWith as startWith$1, pairwise as pairwise$1 } from 'rxjs';
 import { valid, coerce, satisfies, ltr } from 'semver';
 import * as i1$2 from '@ngrx/store';
 import { createAction, props, createReducer, on, createFeatureSelector, createSelector, select, StoreModule, Store } from '@ngrx/store';
@@ -53,34 +53,36 @@ import ImageLayer from 'ol/layer/Image';
 import EmblaCarousel from 'embla-carousel';
 import * as i3 from '@angular/material/tooltip';
 import { MatTooltipModule } from '@angular/material/tooltip';
-import * as i2$4 from '@angular/material/tabs';
+import * as i2$3 from '@angular/material/tabs';
 import { MatTabsModule } from '@angular/material/tabs';
-import * as i2$1 from '@angular/forms';
+import * as i5 from '@angular/forms';
 import { FormsModule, ReactiveFormsModule, UntypedFormControl, FormArray, FormControl } from '@angular/forms';
-import * as i1$8 from '@angular/router';
+import * as i1$9 from '@angular/router';
 import { RouterModule, RouterLink, RouteReuseStrategy } from '@angular/router';
 import * as i3$2 from 'ngx-dropzone';
 import { NgxDropzoneModule } from 'ngx-dropzone';
 import tippy from 'tippy.js';
 import Duration from 'duration-relativetimeformat';
-import * as i5 from 'ngx-chips';
+import * as i5$1 from 'ngx-chips';
 import { TagInputModule } from 'ngx-chips';
 import * as i1$4 from '@angular/material/progress-spinner';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-import * as i1$7 from '@angular/material/dialog';
+import * as i1$8 from '@angular/material/dialog';
 import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
-import * as i2$2 from '@angular/material/autocomplete';
+import * as i2$1 from '@angular/material/autocomplete';
 import { MatAutocompleteTrigger, MatAutocomplete, MatAutocompleteModule } from '@angular/material/autocomplete';
 import * as i3$1 from '@angular/material/core';
 import { MatNativeDateModule, MAT_DATE_LOCALE, DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core';
 import * as i1$5 from '@angular/material/checkbox';
 import { MatCheckboxModule } from '@angular/material/checkbox';
-import * as i2$3 from '@angular/material/datepicker';
+import * as i2$2 from '@angular/material/datepicker';
 import { MatDatepickerModule } from '@angular/material/datepicker';
 import * as i1$6 from '@angular/cdk/overlay';
 import { CdkConnectedOverlay, OverlayModule } from '@angular/cdk/overlay';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';
+import * as i1$7 from '@angular/material/button-toggle';
+import { MatButtonToggleModule } from '@angular/material/button-toggle';
 import * as basicLightbox from 'basiclightbox';
 import { marked } from 'marked';
 import { moveItemInArray, CdkDropList, CdkDrag, CdkDragHandle } from '@angular/cdk/drag-drop';
@@ -88,7 +90,7 @@ import { formatDistance } from 'date-fns';
 import { enUS, sk, pt as pt$1, nl as nl$1, it as it$1, es as es$1, de as de$1, fr as fr$1 } from 'date-fns/locale';
 import * as i4 from '@angular/material/menu';
 import { MatMenuTrigger, MatMenuModule } from '@angular/material/menu';
-import * as i1$9 from '@ngrx/effects';
+import * as i1$a from '@ngrx/effects';
 import { createEffect, ofType, EffectsModule, Actions } from '@ngrx/effects';
 import { valid as valid$1 } from 'geojson-validation';
 import { trigger, transition, animate, keyframes, style } from '@angular/animations';
@@ -97,9 +99,9 @@ import { queryDataGouvFr, queryGeonames, queryGeoadmin } from '@geospatial-sdk/g
 import { Chart, BarController, BarElement, CategoryScale, LinearScale, LineController, LineElement, PointElement, PieController, ArcElement, ScatterController, Tooltip, Colors, Legend } from 'chart.js';
 import * as i4$1 from '@angular/cdk/scrolling';
 import { ScrollingModule } from '@angular/cdk/scrolling';
-import * as i2$5 from '@angular/material/sort';
+import * as i2$4 from '@angular/material/sort';
 import { MatSort, MatSortModule } from '@angular/material/sort';
-import * as i1$a from '@angular/material/table';
+import * as i1$b from '@angular/material/table';
 import { MatTableModule } from '@angular/material/table';
 import * as i3$3 from 'ng-table-virtual-scroll';
 import { TableVirtualScrollDataSource, TableVirtualScrollModule } from 'ng-table-virtual-scroll';
@@ -1647,7 +1649,7 @@ class Iso19139Converter extends BaseConverter {
             distributions: writeDistributions$1,
             onlineResources: writeOnlineResources,
             temporalExtents: writeTemporalExtents,
-            spatialExtents: () => writeSpatialExtents,
+            spatialExtents: writeSpatialExtents,
             // TODO
             extras: () => undefined,
             landingPage: () => undefined,
@@ -1807,6 +1809,8 @@ class Iso19139Converter extends BaseConverter {
             fieldChanged('overviews') && this.writers['overviews'](record, rootEl);
             fieldChanged('temporalExtents') &&
                 this.writers['temporalExtents'](record, rootEl);
+            fieldChanged('spatialExtents') &&
+                this.writers['spatialExtents'](record, rootEl);
             fieldChanged('distributions') &&
                 this.writers['distributions'](record, rootEl);
             fieldChanged('lineage') && this.writers['lineage'](record, rootEl);
@@ -17578,6 +17582,7 @@ var de = {
 	"downloads.format.unknown": "unbekannt",
 	"downloads.wfs.featuretype.not.found": "Der Layer wurde nicht gefunden",
 	dropFile: dropFile$6,
+	"editor.form.placeKeywordWithoutExtent": "",
 	"editor.record.delete.confirmation.cancelText": "Stornieren",
 	"editor.record.delete.confirmation.confirmText": "Löschen",
 	"editor.record.delete.confirmation.message": "Sind Sie sicher, dass Sie diesen Datensatz löschen möchten?",
@@ -17598,6 +17603,7 @@ var de = {
 	"editor.record.form.field.overviews": "",
 	"editor.record.form.field.recordUpdated": "Datensatz zuletzt aktualisiert",
 	"editor.record.form.field.resourceUpdated": "Letztes Aktualisierungsdatum",
+	"editor.record.form.field.spatialExtents": "",
 	"editor.record.form.field.temporalExtents": "Zeitlicher Umfang",
 	"editor.record.form.field.title": "Metadaten-Titel",
 	"editor.record.form.field.uniqueIdentifier": "Eindeutige Kennung (ID)",
@@ -17635,15 +17641,25 @@ var de = {
 	"editor.record.loadError.body": "Der Datensatz konnte nicht geladen werden:",
 	"editor.record.loadError.closeMessage": "Verstanden",
 	"editor.record.loadError.title": "Fehler beim Laden des Datensatzes",
+	"editor.record.placeKeywordWithoutLabel": "",
 	"editor.record.publish": "Diesen Datensatz veröffentlichen",
 	"editor.record.publishError.body": "Der Datensatz konnte nicht veröffentlicht werden:",
 	"editor.record.publishError.closeMessage": "Verstanden",
 	"editor.record.publishError.title": "Fehler beim Veröffentlichen des Datensatzes",
 	"editor.record.publishSuccess.body": "Der Datensatz wurde erfolgreich veröffentlicht!",
 	"editor.record.publishSuccess.title": "Veröffentlichung erfolgreich",
+	"editor.record.resourceError.body": "",
+	"editor.record.resourceError.closeMessage": "",
+	"editor.record.resourceError.title": "",
 	"editor.record.saveStatus.asDraftOnly": "Nur als Entwurf gespeichert - noch nicht veröffentlicht",
 	"editor.record.saveStatus.draftWithChangesPending": "Als Entwurf gespeichert - Änderungen stehen aus",
 	"editor.record.saveStatus.recordUpToDate": "Datensatz ist auf dem neuesten Stand",
+	"editor.record.undo.confirmation.cancelText": "",
+	"editor.record.undo.confirmation.confirmText": "",
+	"editor.record.undo.confirmation.message": "",
+	"editor.record.undo.confirmation.title": "",
+	"editor.record.undo.tooltip.disabled": "",
+	"editor.record.undo.tooltip.enabled": "",
 	"editor.record.upToDate": "Dieser Datensatz ist auf dem neuesten Stand",
 	"editor.sidebar.menu.editor": "",
 	"externalviewer.dataset.unnamed": "Datensatz aus dem Datahub",
@@ -18073,6 +18089,7 @@ var en = {
 	"downloads.format.unknown": "unknown",
 	"downloads.wfs.featuretype.not.found": "The layer was not found",
 	dropFile: dropFile$5,
+	"editor.form.placeKeywordWithoutExtent": "This keyword is not associated with a geographical extent",
 	"editor.record.delete.confirmation.cancelText": "Cancel",
 	"editor.record.delete.confirmation.confirmText": "Delete",
 	"editor.record.delete.confirmation.message": "Are you sure you want to delete this record?",
@@ -18093,6 +18110,7 @@ var en = {
 	"editor.record.form.field.overviews": "Overviews",
 	"editor.record.form.field.recordUpdated": "Record Updated",
 	"editor.record.form.field.resourceUpdated": "Resource Updated",
+	"editor.record.form.field.spatialExtents": "Spatial extents",
 	"editor.record.form.field.temporalExtents": "Temporal extents",
 	"editor.record.form.field.title": "Metadata title",
 	"editor.record.form.field.uniqueIdentifier": "Unique identifier",
@@ -18130,15 +18148,25 @@ var en = {
 	"editor.record.loadError.body": "The record could not be loaded:",
 	"editor.record.loadError.closeMessage": "Understood",
 	"editor.record.loadError.title": "Error loading record",
+	"editor.record.placeKeywordWithoutLabel": "Unnamed location",
 	"editor.record.publish": "Publish this record",
 	"editor.record.publishError.body": "The record could not be published:",
 	"editor.record.publishError.closeMessage": "Understood",
 	"editor.record.publishError.title": "Error publishing record",
 	"editor.record.publishSuccess.body": "The record was successfully published!",
 	"editor.record.publishSuccess.title": "Publish success",
+	"editor.record.resourceError.body": "There was an issue with the record attachments:",
+	"editor.record.resourceError.closeMessage": "Understood",
+	"editor.record.resourceError.title": "Error with the record attachments",
 	"editor.record.saveStatus.asDraftOnly": "Saved as draft only - not published yet",
 	"editor.record.saveStatus.draftWithChangesPending": "Saved as draft - changes are pending",
 	"editor.record.saveStatus.recordUpToDate": "Record is up to date",
+	"editor.record.undo.confirmation.cancelText": "Keep the changes",
+	"editor.record.undo.confirmation.confirmText": "Discard the changes",
+	"editor.record.undo.confirmation.message": "Are you sure you want to cancel the pending changes on this record?",
+	"editor.record.undo.confirmation.title": "Cancel changes?",
+	"editor.record.undo.tooltip.disabled": "There is no pending changes on this record",
+	"editor.record.undo.tooltip.enabled": "Clicking this button will cancel the pending changes on this record.",
 	"editor.record.upToDate": "This record is up to date",
 	"editor.sidebar.menu.editor": "Editor",
 	"externalviewer.dataset.unnamed": "Datahub layer",
@@ -18568,6 +18596,7 @@ var es = {
 	"downloads.format.unknown": "",
 	"downloads.wfs.featuretype.not.found": "",
 	dropFile: dropFile$4,
+	"editor.form.placeKeywordWithoutExtent": "",
 	"editor.record.delete.confirmation.cancelText": "",
 	"editor.record.delete.confirmation.confirmText": "",
 	"editor.record.delete.confirmation.message": "",
@@ -18588,6 +18617,7 @@ var es = {
 	"editor.record.form.field.overviews": "",
 	"editor.record.form.field.recordUpdated": "",
 	"editor.record.form.field.resourceUpdated": "",
+	"editor.record.form.field.spatialExtents": "",
 	"editor.record.form.field.temporalExtents": "",
 	"editor.record.form.field.title": "",
 	"editor.record.form.field.uniqueIdentifier": "",
@@ -18625,15 +18655,25 @@ var es = {
 	"editor.record.loadError.body": "",
 	"editor.record.loadError.closeMessage": "",
 	"editor.record.loadError.title": "",
+	"editor.record.placeKeywordWithoutLabel": "",
 	"editor.record.publish": "",
 	"editor.record.publishError.body": "",
 	"editor.record.publishError.closeMessage": "",
 	"editor.record.publishError.title": "",
 	"editor.record.publishSuccess.body": "",
 	"editor.record.publishSuccess.title": "",
+	"editor.record.resourceError.body": "",
+	"editor.record.resourceError.closeMessage": "",
+	"editor.record.resourceError.title": "",
 	"editor.record.saveStatus.asDraftOnly": "",
 	"editor.record.saveStatus.draftWithChangesPending": "",
 	"editor.record.saveStatus.recordUpToDate": "",
+	"editor.record.undo.confirmation.cancelText": "",
+	"editor.record.undo.confirmation.confirmText": "",
+	"editor.record.undo.confirmation.message": "",
+	"editor.record.undo.confirmation.title": "",
+	"editor.record.undo.tooltip.disabled": "",
+	"editor.record.undo.tooltip.enabled": "",
 	"editor.record.upToDate": "",
 	"editor.sidebar.menu.editor": "",
 	"externalviewer.dataset.unnamed": "",
@@ -19063,10 +19103,11 @@ var fr = {
 	"downloads.format.unknown": "inconnu",
 	"downloads.wfs.featuretype.not.found": "La couche n'a pas été retrouvée",
 	dropFile: dropFile$3,
+	"editor.form.placeKeywordWithoutExtent": "Ce mot-clé n'a pas de localisation géographique associée",
 	"editor.record.delete.confirmation.cancelText": "Annuler",
 	"editor.record.delete.confirmation.confirmText": "Supprimer",
 	"editor.record.delete.confirmation.message": "Etes-vous sûr de vouloir supprimer cette fiche ?",
-	"editor.record.delete.confirmation.title": "Supprimer la fiche",
+	"editor.record.delete.confirmation.title": "Supprimer la fiche ?",
 	"editor.record.deleteError.body": "La fiche n'a pas pu être supprimée :",
 	"editor.record.deleteError.closeMessage": "Compris",
 	"editor.record.deleteError.title": "Erreur lors de la suppression",
@@ -19083,8 +19124,9 @@ var fr = {
 	"editor.record.form.field.overviews": "Aperçus",
 	"editor.record.form.field.recordUpdated": "Date de dernière révision",
 	"editor.record.form.field.resourceUpdated": "Date de dernière révision",
+	"editor.record.form.field.spatialExtents": "Étendue spatiale",
 	"editor.record.form.field.temporalExtents": "Étendue temporelle",
-	"editor.record.form.field.title": "",
+	"editor.record.form.field.title": "Titre",
 	"editor.record.form.field.uniqueIdentifier": "Identifiant unique",
 	"editor.record.form.field.updateFrequency": "Fréquence de mise à jour",
 	"editor.record.form.license.cc-by": "",
@@ -19120,15 +19162,25 @@ var fr = {
 	"editor.record.loadError.body": "La fiche n'a pas pu être chargée :",
 	"editor.record.loadError.closeMessage": "Compris",
 	"editor.record.loadError.title": "Erreur lors du chargement",
+	"editor.record.placeKeywordWithoutLabel": "Localisation sans nom",
 	"editor.record.publish": "Publier cette fiche",
 	"editor.record.publishError.body": "La fiche n'a pas pu être publiée :",
 	"editor.record.publishError.closeMessage": "Compris",
 	"editor.record.publishError.title": "Erreur lors de la publication",
 	"editor.record.publishSuccess.body": "La fiche a bien été publiée !",
 	"editor.record.publishSuccess.title": "Publication réussie",
+	"editor.record.resourceError.body": "Une erreur est survenue lors de la gestion des pièces jointes :",
+	"editor.record.resourceError.closeMessage": "Compris",
+	"editor.record.resourceError.title": "Erreur avec les pièces jointes",
 	"editor.record.saveStatus.asDraftOnly": "Brouillon enregistré - fiche non publiée",
 	"editor.record.saveStatus.draftWithChangesPending": "Brouillon enregistré - modifications en cours",
 	"editor.record.saveStatus.recordUpToDate": "La fiche publiée est à jour",
+	"editor.record.undo.confirmation.cancelText": "Garder les modifications",
+	"editor.record.undo.confirmation.confirmText": "Retirer les modifications",
+	"editor.record.undo.confirmation.message": "Etes-vous sûr de vouloir annuler les modifications apportées à cette fiche ?",
+	"editor.record.undo.confirmation.title": "Annuler les modifications ?",
+	"editor.record.undo.tooltip.disabled": "Il n'y a pas de modifications en cours sur cette fiche",
+	"editor.record.undo.tooltip.enabled": "Cliquer sur ce bouton pour annuler les modifications apportées à cette fiche",
 	"editor.record.upToDate": "",
 	"editor.sidebar.menu.editor": "",
 	"externalviewer.dataset.unnamed": "Couche du datahub",
@@ -19558,6 +19610,7 @@ var it = {
 	"downloads.format.unknown": "sconosciuto",
 	"downloads.wfs.featuretype.not.found": "Il layer non è stato trovato",
 	dropFile: dropFile$2,
+	"editor.form.placeKeywordWithoutExtent": "",
 	"editor.record.delete.confirmation.cancelText": "",
 	"editor.record.delete.confirmation.confirmText": "",
 	"editor.record.delete.confirmation.message": "",
@@ -19578,6 +19631,7 @@ var it = {
 	"editor.record.form.field.overviews": "",
 	"editor.record.form.field.recordUpdated": "",
 	"editor.record.form.field.resourceUpdated": "",
+	"editor.record.form.field.spatialExtents": "",
 	"editor.record.form.field.temporalExtents": "",
 	"editor.record.form.field.title": "",
 	"editor.record.form.field.uniqueIdentifier": "",
@@ -19615,15 +19669,25 @@ var it = {
 	"editor.record.loadError.body": "",
 	"editor.record.loadError.closeMessage": "",
 	"editor.record.loadError.title": "",
+	"editor.record.placeKeywordWithoutLabel": "",
 	"editor.record.publish": "",
 	"editor.record.publishError.body": "",
 	"editor.record.publishError.closeMessage": "",
 	"editor.record.publishError.title": "",
 	"editor.record.publishSuccess.body": "",
 	"editor.record.publishSuccess.title": "",
+	"editor.record.resourceError.body": "",
+	"editor.record.resourceError.closeMessage": "",
+	"editor.record.resourceError.title": "",
 	"editor.record.saveStatus.asDraftOnly": "",
 	"editor.record.saveStatus.draftWithChangesPending": "",
 	"editor.record.saveStatus.recordUpToDate": "",
+	"editor.record.undo.confirmation.cancelText": "",
+	"editor.record.undo.confirmation.confirmText": "",
+	"editor.record.undo.confirmation.message": "",
+	"editor.record.undo.confirmation.title": "",
+	"editor.record.undo.tooltip.disabled": "",
+	"editor.record.undo.tooltip.enabled": "",
 	"editor.record.upToDate": "",
 	"editor.sidebar.menu.editor": "",
 	"externalviewer.dataset.unnamed": "Layer del datahub",
@@ -20053,6 +20117,7 @@ var nl = {
 	"downloads.format.unknown": "",
 	"downloads.wfs.featuretype.not.found": "",
 	dropFile: dropFile$1,
+	"editor.form.placeKeywordWithoutExtent": "",
 	"editor.record.delete.confirmation.cancelText": "",
 	"editor.record.delete.confirmation.confirmText": "",
 	"editor.record.delete.confirmation.message": "",
@@ -20073,6 +20138,7 @@ var nl = {
 	"editor.record.form.field.overviews": "",
 	"editor.record.form.field.recordUpdated": "",
 	"editor.record.form.field.resourceUpdated": "",
+	"editor.record.form.field.spatialExtents": "",
 	"editor.record.form.field.temporalExtents": "",
 	"editor.record.form.field.title": "",
 	"editor.record.form.field.uniqueIdentifier": "",
@@ -20110,15 +20176,25 @@ var nl = {
 	"editor.record.loadError.body": "",
 	"editor.record.loadError.closeMessage": "",
 	"editor.record.loadError.title": "",
+	"editor.record.placeKeywordWithoutLabel": "",
 	"editor.record.publish": "",
 	"editor.record.publishError.body": "",
 	"editor.record.publishError.closeMessage": "",
 	"editor.record.publishError.title": "",
 	"editor.record.publishSuccess.body": "",
 	"editor.record.publishSuccess.title": "",
+	"editor.record.resourceError.body": "",
+	"editor.record.resourceError.closeMessage": "",
+	"editor.record.resourceError.title": "",
 	"editor.record.saveStatus.asDraftOnly": "",
 	"editor.record.saveStatus.draftWithChangesPending": "",
 	"editor.record.saveStatus.recordUpToDate": "",
+	"editor.record.undo.confirmation.cancelText": "",
+	"editor.record.undo.confirmation.confirmText": "",
+	"editor.record.undo.confirmation.message": "",
+	"editor.record.undo.confirmation.title": "",
+	"editor.record.undo.tooltip.disabled": "",
+	"editor.record.undo.tooltip.enabled": "",
 	"editor.record.upToDate": "",
 	"editor.sidebar.menu.editor": "",
 	"externalviewer.dataset.unnamed": "",
@@ -20548,6 +20624,7 @@ var pt = {
 	"downloads.format.unknown": "",
 	"downloads.wfs.featuretype.not.found": "",
 	dropFile: dropFile,
+	"editor.form.placeKeywordWithoutExtent": "",
 	"editor.record.delete.confirmation.cancelText": "",
 	"editor.record.delete.confirmation.confirmText": "",
 	"editor.record.delete.confirmation.message": "",
@@ -20568,6 +20645,7 @@ var pt = {
 	"editor.record.form.field.overviews": "",
 	"editor.record.form.field.recordUpdated": "",
 	"editor.record.form.field.resourceUpdated": "",
+	"editor.record.form.field.spatialExtents": "",
 	"editor.record.form.field.temporalExtents": "",
 	"editor.record.form.field.title": "",
 	"editor.record.form.field.uniqueIdentifier": "",
@@ -20605,15 +20683,25 @@ var pt = {
 	"editor.record.loadError.body": "",
 	"editor.record.loadError.closeMessage": "",
 	"editor.record.loadError.title": "",
+	"editor.record.placeKeywordWithoutLabel": "",
 	"editor.record.publish": "",
 	"editor.record.publishError.body": "",
 	"editor.record.publishError.closeMessage": "",
 	"editor.record.publishError.title": "",
 	"editor.record.publishSuccess.body": "",
 	"editor.record.publishSuccess.title": "",
+	"editor.record.resourceError.body": "",
+	"editor.record.resourceError.closeMessage": "",
+	"editor.record.resourceError.title": "",
 	"editor.record.saveStatus.asDraftOnly": "",
 	"editor.record.saveStatus.draftWithChangesPending": "",
 	"editor.record.saveStatus.recordUpToDate": "",
+	"editor.record.undo.confirmation.cancelText": "",
+	"editor.record.undo.confirmation.confirmText": "",
+	"editor.record.undo.confirmation.message": "",
+	"editor.record.undo.confirmation.title": "",
+	"editor.record.undo.tooltip.disabled": "",
+	"editor.record.undo.tooltip.enabled": "",
 	"editor.record.upToDate": "",
 	"editor.sidebar.menu.editor": "",
 	"externalviewer.dataset.unnamed": "",
@@ -22404,6 +22492,15 @@ class Gn4PlatformMapper {
                 ? keyword.definitions[lang3]
                 : keyword.definition;
             const matchedThesaurus = thesaurus.find((thes) => keyword.thesaurusKey === thes.key);
+            let bbox;
+            if (keyword.coordWest) {
+                bbox = [
+                    parseFloat(keyword.coordWest),
+                    parseFloat(keyword.coordSouth),
+                    parseFloat(keyword.coordEast),
+                    parseFloat(keyword.coordNorth),
+                ];
+            }
             return {
                 key,
                 label,
@@ -22415,6 +22512,7 @@ class Gn4PlatformMapper {
                     url: new URL(matchedThesaurus?.url),
                     type: matchedThesaurus?.dname,
                 },
+                ...(bbox && { bbox }),
             };
         });
     }
@@ -22559,6 +22657,16 @@ class Gn4PlatformService {
         }), shareReplay(1));
         return this.keywordsByThesauri[uri];
     }
+    searchKeywordsInThesaurus(query, thesaurusId) {
+        return this.allThesaurus$.pipe(switchMap((thesauri) => {
+            const strippedThesaurusId = thesaurusId.replace('geonetwork.thesaurus.', '');
+            if (!thesauri.find((thes) => thes.key === strippedThesaurusId))
+                return of([]);
+            return this.registriesApiService
+                .searchKeywords(query, this.langService.iso3, 100, 0, null, [strippedThesaurusId], null)
+                .pipe(map$1((keywords) => this.mapper.keywordsFromApi(keywords, thesauri, this.langService.iso3)));
+        }));
+    }
     getUserFeedbacks(uuid) {
         return this.userfeedbackApiService.getUserComments(uuid).pipe(map$1((userFeedbacks) => userFeedbacks.map(this.mapper.userFeedbacksFromApi)), catchError((error) => {
             console.error('Error fetching user feedbacks:', error);
@@ -22752,7 +22860,7 @@ class UiMapModule {
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UiMapModule, imports: [CommonModule,
             HttpClientModule,
             MatIconModule,
-            TranslateModule.forRoot()] }); }
+            TranslateModule.forChild()] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UiMapModule, decorators: [{
             type: NgModule,
@@ -22762,7 +22870,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         CommonModule,
                         HttpClientModule,
                         MatIconModule,
-                        TranslateModule.forRoot(),
+                        TranslateModule.forChild(),
                     ],
                     exports: [MapComponent, FeatureDetailComponent],
                 }]
@@ -25534,7 +25642,7 @@ class FacetItemComponent {
         this.onInvertedChange(this.inverted);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FacetItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FacetItemComponent, selector: "gn-ui-facet-item", inputs: { label: "label", count: "count", selected: "selected", inverted: "inverted" }, outputs: { selectedChange: "selectedChange", invertedChange: "invertedChange" }, ngImport: i0, template: "<div\n  class=\"flex flex-row items-center group px-1 my-1 hover:bg-gray-100 rounded-sm\"\n>\n  <label class=\"grow shrink truncate cursor-pointer group-hover:text-black\">\n    <input\n      type=\"checkbox\"\n      class=\"cursor-pointer\"\n      [ngModel]=\"selected\"\n      (ngModelChange)=\"onSelectedChange($event)\"\n    />\n    {{ label | translate }}\n    <span class=\"group-hover:text-black\">({{ count }})</span>\n  </label>\n  <div\n    *ngIf=\"!inverted\"\n    class=\"shrink-0 cursor-pointer invisible group-hover:visible icon-exclude\"\n    style=\"min-width: 20px\"\n    (click)=\"toggleInverted()\"\n  >\n    <!-- minus svg -->\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 20 20\"\n      fill=\"currentColor\"\n    >\n      <path\n        fill-rule=\"evenodd\"\n        d=\"M3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z\"\n        clip-rule=\"evenodd\"\n      />\n    </svg>\n  </div>\n  <div\n    *ngIf=\"inverted\"\n    class=\"shrink-0 cursor-pointer invisible group-hover:visible icon-include\"\n    style=\"min-width: 20px\"\n    (click)=\"toggleInverted()\"\n  >\n    <!-- check svg -->\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 20 20\"\n      fill=\"currentColor\"\n    >\n      <path\n        fill-rule=\"evenodd\"\n        d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\"\n        clip-rule=\"evenodd\"\n      />\n    </svg>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FacetItemComponent, selector: "gn-ui-facet-item", inputs: { label: "label", count: "count", selected: "selected", inverted: "inverted" }, outputs: { selectedChange: "selectedChange", invertedChange: "invertedChange" }, ngImport: i0, template: "<div\n  class=\"flex flex-row items-center group px-1 my-1 hover:bg-gray-100 rounded-sm\"\n>\n  <label class=\"grow shrink truncate cursor-pointer group-hover:text-black\">\n    <input\n      type=\"checkbox\"\n      class=\"cursor-pointer\"\n      [ngModel]=\"selected\"\n      (ngModelChange)=\"onSelectedChange($event)\"\n    />\n    {{ label | translate }}\n    <span class=\"group-hover:text-black\">({{ count }})</span>\n  </label>\n  <div\n    *ngIf=\"!inverted\"\n    class=\"shrink-0 cursor-pointer invisible group-hover:visible icon-exclude\"\n    style=\"min-width: 20px\"\n    (click)=\"toggleInverted()\"\n  >\n    <!-- minus svg -->\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 20 20\"\n      fill=\"currentColor\"\n    >\n      <path\n        fill-rule=\"evenodd\"\n        d=\"M3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z\"\n        clip-rule=\"evenodd\"\n      />\n    </svg>\n  </div>\n  <div\n    *ngIf=\"inverted\"\n    class=\"shrink-0 cursor-pointer invisible group-hover:visible icon-include\"\n    style=\"min-width: 20px\"\n    (click)=\"toggleInverted()\"\n  >\n    <!-- check svg -->\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 20 20\"\n      fill=\"currentColor\"\n    >\n      <path\n        fill-rule=\"evenodd\"\n        d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\"\n        clip-rule=\"evenodd\"\n      />\n    </svg>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FacetItemComponent, decorators: [{
             type: Component,
@@ -26721,7 +26829,7 @@ class AutocompleteComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AutocompleteComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AutocompleteComponent, isStandalone: true, selector: "gn-ui-autocomplete", inputs: { placeholder: "placeholder", action: "action", value: "value", clearOnSelection: "clearOnSelection", preventCompleteOnSelection: "preventCompleteOnSelection", autoFocus: "autoFocus", minCharacterCount: "minCharacterCount", allowSubmit: "allowSubmit", displayWithFn: "displayWithFn" }, outputs: { itemSelected: "itemSelected", inputSubmitted: "inputSubmitted", inputCleared: "inputCleared" }, viewQueries: [{ propertyName: "triggerRef", first: true, predicate: MatAutocompleteTrigger, descendants: true }, { propertyName: "autocomplete", first: true, predicate: MatAutocomplete, descendants: true }, { propertyName: "inputRef", first: true, predicate: ["searchInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"relative\">\n  <input\n    #searchInput\n    type=\"text\"\n    class=\"appearance-none focus:outline-white focus:outline-2 focus:outline-dotted focus:outline-offset-2 leading-tight rounded w-full text-black shadow-xl focus:shadow-[0_0_24px_0_rgba(21,40,184,0.09)]\"\n    [placeholder]=\"placeholder\"\n    [formControl]=\"control\"\n    [matAutocomplete]=\"auto\"\n    (keyup.enter)=\"handleEnter(searchInput.value)\"\n  />\n  <div class=\"flex flex-row absolute inset-y-0 right-0\">\n    <button\n      type=\"button\"\n      class=\"text-primary-lightest hover:text-primary hover:bg-gray-50 transition-all duration-100 clear-btn\"\n      *ngIf=\"searchInput.value\"\n      aria-label=\"Clear\"\n      (click)=\"clear()\"\n    >\n      <mat-icon class=\"material-symbols-outlined\">close</mat-icon>\n    </button>\n    <button\n      type=\"button\"\n      class=\"text-primary bg-white hover:text-primary-darkest hover:bg-gray-100 border-gray-300 hover:border-gray-500 transition-all duration-100 search-btn rounded-r\"\n      aria-label=\"Trigger search\"\n      *ngIf=\"allowSubmit\"\n      data-test=\"autocomplete-submit-btn\"\n      (click)=\"handleClickSearch()\"\n    >\n      <mat-icon class=\"material-symbols-outlined\">search</mat-icon>\n    </button>\n  </div>\n  <gn-ui-popup-alert\n    *ngIf=\"error\"\n    class=\"absolute mt-2 w-full top-[100%] left-0\"\n    icon=\"error_outline\"\n    position=\"top\"\n    type=\"warning\"\n  >\n    <span translate>search.autocomplete.error</span>\n    {{ error }}\n  </gn-ui-popup-alert>\n</div>\n<mat-autocomplete\n  #auto=\"matAutocomplete\"\n  (optionSelected)=\"handleSelection($event)\"\n  [displayWith]=\"displayWithFnInternal\"\n>\n  <mat-option\n    *ngFor=\"let suggestion of suggestions$ | async\"\n    [value]=\"suggestion\"\n    class=\"p-2 suggestion\"\n  >\n    {{ displayWithFnInternal(suggestion) }}\n  </mat-option>\n</mat-autocomplete>\n", styles: [":host{--input-height: 3.5em}.clear-btn{width:var(--input-height);height:100%}.search-btn{width:var(--input-height);height:100%;border-left-width:.1em}mat-icon{width:100%;height:100%;padding:.65em;font-size:1.5em}input{height:var(--input-height);padding:1.05em;padding-right:calc(2 * var(--input-height))}input:placeholder-shown{text-overflow:ellipsis}.mat-mdc-option.suggestion.mat-mdc-option-active{background-color:var(--color-primary-lightest)}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: PopupAlertComponent, selector: "gn-ui-popup-alert", inputs: ["icon", "type", "position"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i2$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple", "hideSingleSelectionIndicator"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i3$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i2$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AutocompleteComponent, isStandalone: true, selector: "gn-ui-autocomplete", inputs: { placeholder: "placeholder", action: "action", value: "value", clearOnSelection: "clearOnSelection", preventCompleteOnSelection: "preventCompleteOnSelection", autoFocus: "autoFocus", minCharacterCount: "minCharacterCount", allowSubmit: "allowSubmit", displayWithFn: "displayWithFn" }, outputs: { itemSelected: "itemSelected", inputSubmitted: "inputSubmitted", inputCleared: "inputCleared" }, viewQueries: [{ propertyName: "triggerRef", first: true, predicate: MatAutocompleteTrigger, descendants: true }, { propertyName: "autocomplete", first: true, predicate: MatAutocomplete, descendants: true }, { propertyName: "inputRef", first: true, predicate: ["searchInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"relative\">\n  <input\n    #searchInput\n    type=\"text\"\n    class=\"appearance-none focus:outline-white focus:outline-2 focus:outline-dotted focus:outline-offset-2 leading-tight rounded w-full text-black shadow-xl focus:shadow-[0_0_24px_0_rgba(21,40,184,0.09)]\"\n    [placeholder]=\"placeholder\"\n    [formControl]=\"control\"\n    [matAutocomplete]=\"auto\"\n    (keyup.enter)=\"handleEnter(searchInput.value)\"\n  />\n  <div class=\"flex flex-row absolute inset-y-0 right-0\">\n    <button\n      type=\"button\"\n      class=\"text-primary-lightest hover:text-primary hover:bg-gray-50 transition-all duration-100 clear-btn\"\n      *ngIf=\"searchInput.value\"\n      aria-label=\"Clear\"\n      (click)=\"clear()\"\n    >\n      <mat-icon class=\"material-symbols-outlined\">close</mat-icon>\n    </button>\n    <button\n      type=\"button\"\n      class=\"text-primary bg-white hover:text-primary-darkest hover:bg-gray-100 border-gray-300 hover:border-gray-500 transition-all duration-100 search-btn rounded-r\"\n      aria-label=\"Trigger search\"\n      *ngIf=\"allowSubmit\"\n      data-test=\"autocomplete-submit-btn\"\n      (click)=\"handleClickSearch()\"\n    >\n      <mat-icon class=\"material-symbols-outlined\">search</mat-icon>\n    </button>\n  </div>\n  <gn-ui-popup-alert\n    *ngIf=\"error\"\n    class=\"absolute mt-2 w-full top-[100%] left-0\"\n    icon=\"error_outline\"\n    position=\"top\"\n    type=\"warning\"\n  >\n    <span translate>search.autocomplete.error</span>\n    {{ error }}\n  </gn-ui-popup-alert>\n</div>\n<mat-autocomplete\n  #auto=\"matAutocomplete\"\n  (optionSelected)=\"handleSelection($event)\"\n  [displayWith]=\"displayWithFnInternal\"\n>\n  <mat-option\n    *ngFor=\"let suggestion of suggestions$ | async\"\n    [value]=\"suggestion\"\n    class=\"p-2 suggestion\"\n  >\n    {{ displayWithFnInternal(suggestion) }}\n  </mat-option>\n</mat-autocomplete>\n", styles: [":host{--input-height: 3.5em}.clear-btn{width:var(--input-height);height:100%}.search-btn{width:var(--input-height);height:100%;border-left-width:.1em}mat-icon{width:100%;height:100%;padding:.65em;font-size:1.5em}input{height:var(--input-height);padding:1.05em;padding-right:calc(2 * var(--input-height))}input:placeholder-shown{text-overflow:ellipsis}.mat-mdc-option.suggestion.mat-mdc-option-active{background-color:var(--color-primary-lightest)}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: PopupAlertComponent, selector: "gn-ui-popup-alert", inputs: ["icon", "type", "position"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i2$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple", "hideSingleSelectionIndicator"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i3$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i2$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AutocompleteComponent, decorators: [{
             type: Component,
@@ -26851,7 +26959,7 @@ class CheckToggleComponent {
         this.toggled.emit(event);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CheckToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CheckToggleComponent, isStandalone: true, selector: "gn-ui-check-toggle", inputs: { title: "title", label: "label", value: "value", color: "color" }, outputs: { toggled: "toggled" }, ngImport: i0, template: "<label class=\"inline-flex relative items-start cursor-pointer\" [title]=\"title\">\n  <span class=\"shrink-0\">\n    <input\n      type=\"checkbox\"\n      class=\"sr-only peer\"\n      [ngModel]=\"value\"\n      (ngModelChange)=\"toggle($event)\"\n    />\n    <div\n      class=\"w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-2 rounded-full peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all\"\n      [class]=\"\n        color === 'secondary'\n          ? 'peer-focus:ring-secondary-lighter peer-checked:bg-secondary'\n          : 'peer-focus:ring-primary-lighter peer-checked:bg-primary'\n      \"\n    ></div>\n  </span>\n  <span class=\"ml-3 mt-[2px] text-sm font-medium\">{{ label }}</span>\n</label>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CheckToggleComponent, isStandalone: true, selector: "gn-ui-check-toggle", inputs: { title: "title", label: "label", value: "value", color: "color" }, outputs: { toggled: "toggled" }, ngImport: i0, template: "<label class=\"inline-flex relative items-start cursor-pointer\" [title]=\"title\">\n  <span class=\"shrink-0\">\n    <input\n      type=\"checkbox\"\n      class=\"sr-only peer\"\n      [ngModel]=\"value\"\n      (ngModelChange)=\"toggle($event)\"\n    />\n    <div\n      class=\"w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-2 rounded-full peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all\"\n      [class]=\"\n        color === 'secondary'\n          ? 'peer-focus:ring-secondary-lighter peer-checked:bg-secondary'\n          : 'peer-focus:ring-primary-lighter peer-checked:bg-primary'\n      \"\n    ></div>\n  </span>\n  <span class=\"ml-3 mt-[2px] text-sm font-medium\">{{ label }}</span>\n</label>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CheckToggleComponent, decorators: [{
             type: Component,
@@ -26944,7 +27052,7 @@ class ChipsInputComponent {
         this.subscription.unsubscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ChipsInputComponent, deps: [{ token: i1.HttpClient }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ChipsInputComponent, selector: "gn-ui-chips-input", inputs: { url: "url", placeholder: "placeholder", selectedItems: "selectedItems", required: "required", loadOnce: "loadOnce", autocompleteItems: "autocompleteItems" }, outputs: { itemsChange: "itemsChange" }, ngImport: i0, template: "<tag-input\n  [ngModel]=\"items\"\n  (ngModelChange)=\"onChange($event)\"\n  onlyFromAutocomplete=\"true\"\n  [placeholder]=\"placeholder\"\n  [secondaryPlaceholder]=\"placeholder\"\n  [ripple]=\"false\"\n  [animationDuration]=\"{ enter: '0ms', leave: '0ms' }\"\n  [onTextChangeDebounce]=\"100\"\n  class=\"border-2 border-primary h-full rounded-lg p-2 bg-white text-sm focus:border-primary\"\n  [ngClass]=\"{ invalid: invalid }\"\n>\n  <tag-input-dropdown\n    [autocompleteObservable]=\"requestAutocompleteItems\"\n    [minimumTextLength]=\"0\"\n    [keepOpen]=\"false\"\n    [showDropdownIfEmpty]=\"true\"\n  >\n    <ng-template let-item=\"item\" let-index=\"index\">\n      {{ item.display }}\n    </ng-template>\n  </tag-input-dropdown>\n</tag-input>\n", styles: ["tag-input::ng-deep .ng2-tag-input{border-bottom:none}tag-input::ng-deep .ng2-tag-input.ng2-tag-input--focused{border-bottom:none}tag-input::ng-deep tag{border-radius:5px;background:var(--color-primary-lightest);font-family:inherit;align-content:center;font-style:italic}tag-input::ng-deep tag::ng-deep:not(:focus):not(.tag--editing):not(:active):not(.readonly):hover,tag-input::ng-deep tag:not(:focus):not(.tag--editing):not(:active):not(.readonly):hover{background:var(--color-primary)!important}tag-input::ng-deep .tag__text{padding-right:7px}tag-input::ng-deep div,tag-input::ng-deep form{height:100%}tag-input.invalid{border-color:var(--color-secondary)}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.TagInputComponent, selector: "tag-input", inputs: ["separatorKeys", "separatorKeyCodes", "placeholder", "secondaryPlaceholder", "maxItems", "validators", "asyncValidators", "onlyFromAutocomplete", "errorMessages", "theme", "onTextChangeDebounce", "inputId", "inputClass", "clearOnBlur", "hideForm", "addOnBlur", "addOnPaste", "pasteSplitPattern", "blinkIfDupe", "removable", "editable", "allowDupes", "modelAsStrings", "trimTags", "inputText", "ripple", "tabindex", "disable", "dragZone", "onRemoving", "onAdding", "animationDuration"], outputs: ["onAdd", "onRemove", "onSelect", "onFocus", "onBlur", "onTextChange", "onPaste", "onValidationError", "onTagEdited", "inputTextChange"] }, { kind: "component", type: i5.TagInputDropdown, selector: "tag-input-dropdown", inputs: ["offset", "focusFirstElement", "showDropdownIfEmpty", "autocompleteObservable", "minimumTextLength", "limitItemsTo", "displayBy", "identifyBy", "matchingFn", "appendToBody", "keepOpen", "dynamicUpdate", "zIndex", "autocompleteItems"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ChipsInputComponent, selector: "gn-ui-chips-input", inputs: { url: "url", placeholder: "placeholder", selectedItems: "selectedItems", required: "required", loadOnce: "loadOnce", autocompleteItems: "autocompleteItems" }, outputs: { itemsChange: "itemsChange" }, ngImport: i0, template: "<tag-input\n  [ngModel]=\"items\"\n  (ngModelChange)=\"onChange($event)\"\n  onlyFromAutocomplete=\"true\"\n  [placeholder]=\"placeholder\"\n  [secondaryPlaceholder]=\"placeholder\"\n  [ripple]=\"false\"\n  [animationDuration]=\"{ enter: '0ms', leave: '0ms' }\"\n  [onTextChangeDebounce]=\"100\"\n  class=\"border-2 border-primary h-full rounded-lg p-2 bg-white text-sm focus:border-primary\"\n  [ngClass]=\"{ invalid: invalid }\"\n>\n  <tag-input-dropdown\n    [autocompleteObservable]=\"requestAutocompleteItems\"\n    [minimumTextLength]=\"0\"\n    [keepOpen]=\"false\"\n    [showDropdownIfEmpty]=\"true\"\n  >\n    <ng-template let-item=\"item\" let-index=\"index\">\n      {{ item.display }}\n    </ng-template>\n  </tag-input-dropdown>\n</tag-input>\n", styles: ["tag-input::ng-deep .ng2-tag-input{border-bottom:none}tag-input::ng-deep .ng2-tag-input.ng2-tag-input--focused{border-bottom:none}tag-input::ng-deep tag{border-radius:5px;background:var(--color-primary-lightest);font-family:inherit;align-content:center;font-style:italic}tag-input::ng-deep tag::ng-deep:not(:focus):not(.tag--editing):not(:active):not(.readonly):hover,tag-input::ng-deep tag:not(:focus):not(.tag--editing):not(:active):not(.readonly):hover{background:var(--color-primary)!important}tag-input::ng-deep .tag__text{padding-right:7px}tag-input::ng-deep div,tag-input::ng-deep form{height:100%}tag-input.invalid{border-color:var(--color-secondary)}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5$1.TagInputComponent, selector: "tag-input", inputs: ["separatorKeys", "separatorKeyCodes", "placeholder", "secondaryPlaceholder", "maxItems", "validators", "asyncValidators", "onlyFromAutocomplete", "errorMessages", "theme", "onTextChangeDebounce", "inputId", "inputClass", "clearOnBlur", "hideForm", "addOnBlur", "addOnPaste", "pasteSplitPattern", "blinkIfDupe", "removable", "editable", "allowDupes", "modelAsStrings", "trimTags", "inputText", "ripple", "tabindex", "disable", "dragZone", "onRemoving", "onAdding", "animationDuration"], outputs: ["onAdd", "onRemove", "onSelect", "onFocus", "onBlur", "onTextChange", "onPaste", "onValidationError", "onTagEdited", "inputTextChange"] }, { kind: "component", type: i5$1.TagInputDropdown, selector: "tag-input-dropdown", inputs: ["offset", "focusFirstElement", "showDropdownIfEmpty", "autocompleteObservable", "minimumTextLength", "limitItemsTo", "displayBy", "identifyBy", "matchingFn", "appendToBody", "keepOpen", "dynamicUpdate", "zIndex", "autocompleteItems"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ChipsInputComponent, decorators: [{
             type: Component,
@@ -26970,7 +27078,7 @@ class DatePickerComponent {
         this.dateChange = new EventEmitter();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DatePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DatePickerComponent, isStandalone: true, selector: "gn-ui-date-picker", inputs: { date: "date" }, outputs: { dateChange: "dateChange" }, ngImport: i0, template: "<div\n  class=\"flex items-center justify-between rounded-lg border border-gray-300 bg-white\"\n>\n  <input\n    class=\"pl-3\"\n    [matDatepicker]=\"picker\"\n    [value]=\"date\"\n    (dateChange)=\"dateChange.emit($event.value)\"\n  />\n  <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\n</div>\n<mat-datepicker #picker></mat-datepicker>\n", styles: ["mat-datepicker-toggle{@apply text-primary;}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2$3.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i2$3.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i2$3.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DatePickerComponent, isStandalone: true, selector: "gn-ui-date-picker", inputs: { date: "date" }, outputs: { dateChange: "dateChange" }, ngImport: i0, template: "<div\n  class=\"flex items-center justify-between rounded-lg border border-gray-300 bg-white\"\n>\n  <input\n    class=\"pl-3\"\n    [matDatepicker]=\"picker\"\n    [value]=\"date\"\n    (dateChange)=\"dateChange.emit($event.value)\"\n  />\n  <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\n</div>\n<mat-datepicker #picker></mat-datepicker>\n", styles: ["mat-datepicker-toggle{@apply text-primary;}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2$2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i2$2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i2$2.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DatePickerComponent, decorators: [{
             type: Component,
@@ -26987,7 +27095,7 @@ class DateRangePickerComponent {
         this.endDateChange = new EventEmitter();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DateRangePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DateRangePickerComponent, isStandalone: true, selector: "gn-ui-date-range-picker", inputs: { startDate: "startDate", endDate: "endDate" }, outputs: { startDateChange: "startDateChange", endDateChange: "endDateChange" }, ngImport: i0, template: "<div\n  class=\"flex items-center justify-between rounded-lg border border-gray-300 bg-white\"\n>\n  <div class=\"pl-3 flex justify-center\">\n    <mat-date-range-input [rangePicker]=\"picker\" class=\"w-full\">\n      <input\n        matStartDate\n        placeholder=\"Start date\"\n        [value]=\"startDate\"\n        (dateInput)=\"startDateChange.emit($event.value)\"\n      />\n      <input\n        matEndDate\n        placeholder=\"End date\"\n        [value]=\"endDate\"\n        (dateInput)=\"endDateChange.emit($event.value)\"\n      />\n    </mat-date-range-input>\n  </div>\n  <mat-datepicker-toggle matSuffix [for]=\"picker\">\n    <mat-icon>calendar_today</mat-icon>\n  </mat-datepicker-toggle>\n</div>\n<mat-date-range-picker #picker></mat-date-range-picker>\n", styles: ["mat-datepicker-toggle{@apply text-primary;}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2$3.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i2$3.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i2$3.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i2$3.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i2$3.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DateRangePickerComponent, isStandalone: true, selector: "gn-ui-date-range-picker", inputs: { startDate: "startDate", endDate: "endDate" }, outputs: { startDateChange: "startDateChange", endDateChange: "endDateChange" }, ngImport: i0, template: "<div\n  class=\"flex items-center justify-between rounded-lg border border-gray-300 bg-white\"\n>\n  <div class=\"pl-3 flex justify-center\">\n    <mat-date-range-input [rangePicker]=\"picker\" class=\"w-full\">\n      <input\n        matStartDate\n        placeholder=\"Start date\"\n        [value]=\"startDate\"\n        (dateInput)=\"startDateChange.emit($event.value)\"\n      />\n      <input\n        matEndDate\n        placeholder=\"End date\"\n        [value]=\"endDate\"\n        (dateInput)=\"endDateChange.emit($event.value)\"\n      />\n    </mat-date-range-input>\n  </div>\n  <mat-datepicker-toggle matSuffix [for]=\"picker\">\n    <mat-icon>calendar_today</mat-icon>\n  </mat-datepicker-toggle>\n</div>\n<mat-date-range-picker #picker></mat-date-range-picker>\n", styles: ["mat-datepicker-toggle{@apply text-primary;}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2$2.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i2$2.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i2$2.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i2$2.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i2$2.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DateRangePickerComponent, decorators: [{
             type: Component,
@@ -27178,7 +27286,7 @@ class DropdownMultiselectComponent {
         this.setFocus();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DropdownMultiselectComponent, deps: [{ token: i1$6.ScrollStrategyOptions }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DropdownMultiselectComponent, selector: "gn-ui-dropdown-multiselect", inputs: { title: "title", choices: "choices", selected: "selected", allowSearch: "allowSearch", maxRows: "maxRows", searchInputValue: "searchInputValue" }, outputs: { selectValues: "selectValues" }, viewQueries: [{ propertyName: "overlayOrigin", first: true, predicate: ["overlayOrigin"], descendants: true }, { propertyName: "overlay", first: true, predicate: CdkConnectedOverlay, descendants: true }, { propertyName: "overlayContainer", first: true, predicate: ["overlayContainer"], descendants: true, read: ElementRef }, { propertyName: "searchFieldInput", first: true, predicate: ["searchFieldInput"], descendants: true }, { propertyName: "checkboxes", predicate: ["checkBox"], descendants: true, read: ElementRef }], ngImport: i0, template: "<gn-ui-button\n  type=\"outline\"\n  extraClass=\"bg-background w-full !p-[8px] !pl-[16px]\"\n  [title]=\"title\"\n  [attr.aria-owns]=\"id\"\n  (buttonClick)=\"openOverlay()\"\n  (keydown)=\"handleTriggerKeydown($event)\"\n  cdkOverlayOrigin\n  #overlayOrigin=\"cdkOverlayOrigin\"\n>\n  <div class=\"grow flex items-center mr-2 gap-2 overflow-hidden\">\n    <div class=\"text-left font-medium truncate py-1\">\n      {{ title }}\n    </div>\n    <div\n      *ngIf=\"hasSelectedChoices\"\n      class=\"shrink-0 rounded-full text-primary bg-primary-opacity-25 text-white font-bold text-[12px] w-5 h-5 flex items-center justify-center mr-1 selected-count\"\n    >\n      {{ selected.length }}\n    </div>\n  </div>\n  <button class=\"h-6 w-6\" data-cy=\"clearSelection\">\n    <mat-icon\n      class=\"material-symbols-outlined shrink-0 opacity-40 mr-1.5 hover:opacity-80 transition-colors clear-btn\"\n      *ngIf=\"hasSelectedChoices && !overlayOpen\"\n      (click)=\"clearSelection($event)\"\n    >\n      close\n    </mat-icon>\n  </button>\n  <mat-icon class=\"material-symbols-outlined shrink-0 opacity-40\">\n    <ng-container *ngIf=\"overlayOpen\">expand_less</ng-container>\n    <ng-container *ngIf=\"!overlayOpen\">expand_more</ng-container>\n  </mat-icon>\n</gn-ui-button>\n\n<ng-template\n  cdkConnectedOverlay\n  cdkConnectedOverlayHasBackdrop\n  cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n  [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\n  [cdkConnectedOverlayOpen]=\"overlayOpen\"\n  [cdkConnectedOverlayPositions]=\"overlayPositions\"\n  [cdkConnectedOverlayScrollStrategy]=\"scrollStrategy\"\n  [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n  (overlayOutsideClick)=\"closeOverlay()\"\n  (detach)=\"closeOverlay()\"\n>\n  <div\n    class=\"bg-white border border-gray-300 rounded shadow-lg py-2 w-full overflow-x-hidden overflow-y-auto overlay-container\"\n    [style.max-height]=\"overlayMaxHeight\"\n    [style.width]=\"overlayWidth\"\n    role=\"listbox\"\n    tabindex=\"-1\"\n    [attr.id]=\"id\"\n    [attr.aria-multiselectable]=\"true\"\n    [attr.aria-label]=\"title\"\n    (keydown)=\"handleOverlayKeydown($event)\"\n    #overlayContainer\n  >\n    <div\n      class=\"border border-gray-300 rounded mb-2 mx-2 min-h-[44px] flex flex-row flex-wrap p-2 focus-within:rounded focus-within:border-2 focus-within:border-primary\"\n    >\n      <button\n        type=\"button\"\n        *ngFor=\"let selected of selectedChoices\"\n        [title]=\"selected.label\"\n        class=\"max-w-full bg-main text-white rounded pr-[7px] flex gap-1 items-center opacity-70 hover:opacity-100 focus:opacity-100 transition-opacity mb-1\"\n        (click)=\"select(selected, false)\"\n      >\n        <div class=\"text-sm truncate leading-[26px] px-2\">\n          {{ selected.label }}\n        </div>\n        <div\n          class=\"flex items-center justify-center rounded-full bg-white text-main h-[13px] w-[13px] pt-px -mt-px shrink-0\"\n        >\n          <mat-icon\n            class=\"material-symbols-outlined !h-[12px] !w-[12px] text-[12px]\"\n          >\n            close</mat-icon\n          >\n        </div>\n      </button>\n\n      <div *ngIf=\"allowSearch\" class=\"w-[50%] relative grow shrink\">\n        <input\n          #searchFieldInput\n          class=\"w-full px-2 truncate text-[14px] h-full overlaySearchInput focus:outline-none\"\n          [(ngModel)]=\"searchInputValue\"\n          [placeholder]=\"'multiselect.filter.placeholder' | translate\"\n        />\n        <button\n          *ngIf=\"!!searchInputValue\"\n          class=\"absolute top-1/2 -translate-y-1/2 right-0 px-[7px] leading-tight clear-search-input mr-2\"\n          (click)=\"clearSearchInputValue($event)\"\n        >\n          <mat-icon\n            class=\"material-symbols-outlined !h-[10px] !w-[12px] text-[12px]\"\n          >\n            close\n          </mat-icon>\n        </button>\n      </div>\n    </div>\n\n    <label\n      *ngFor=\"let choice of filteredChoicesByText\"\n      [title]=\"choice.label\"\n      class=\"flex px-5 py-1 w-full text-gray-900 cursor-pointer hover:text-primary-darkest hover:bg-gray-50 focus-within:text-primary-darkest focus-within:bg-gray-50 transition-colors\"\n    >\n      <input\n        class=\"w-[18px] h-[18px] align-text-top shrink-0\"\n        type=\"checkbox\"\n        #checkBox\n        [checked]=\"isSelected(choice)\"\n        (change)=\"select(choice, checkBox.checked)\"\n      />\n      <span class=\"ml-[8px] text-[14px] truncate\">\n        {{ choice.label }}\n      </span>\n    </label>\n  </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1$6.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"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$6.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DropdownMultiselectComponent, selector: "gn-ui-dropdown-multiselect", inputs: { title: "title", choices: "choices", selected: "selected", allowSearch: "allowSearch", maxRows: "maxRows", searchInputValue: "searchInputValue" }, outputs: { selectValues: "selectValues" }, viewQueries: [{ propertyName: "overlayOrigin", first: true, predicate: ["overlayOrigin"], descendants: true }, { propertyName: "overlay", first: true, predicate: CdkConnectedOverlay, descendants: true }, { propertyName: "overlayContainer", first: true, predicate: ["overlayContainer"], descendants: true, read: ElementRef }, { propertyName: "searchFieldInput", first: true, predicate: ["searchFieldInput"], descendants: true }, { propertyName: "checkboxes", predicate: ["checkBox"], descendants: true, read: ElementRef }], ngImport: i0, template: "<gn-ui-button\n  type=\"outline\"\n  extraClass=\"bg-background w-full !p-[8px] !pl-[16px]\"\n  [title]=\"title\"\n  [attr.aria-owns]=\"id\"\n  (buttonClick)=\"openOverlay()\"\n  (keydown)=\"handleTriggerKeydown($event)\"\n  cdkOverlayOrigin\n  #overlayOrigin=\"cdkOverlayOrigin\"\n>\n  <div class=\"grow flex items-center mr-2 gap-2 overflow-hidden\">\n    <div class=\"text-left font-medium truncate py-1\">\n      {{ title }}\n    </div>\n    <div\n      *ngIf=\"hasSelectedChoices\"\n      class=\"shrink-0 rounded-full text-primary bg-primary-opacity-25 text-white font-bold text-[12px] w-5 h-5 flex items-center justify-center mr-1 selected-count\"\n    >\n      {{ selected.length }}\n    </div>\n  </div>\n  <button class=\"h-6 w-6\" data-cy=\"clearSelection\">\n    <mat-icon\n      class=\"material-symbols-outlined shrink-0 opacity-40 mr-1.5 hover:opacity-80 transition-colors clear-btn\"\n      *ngIf=\"hasSelectedChoices && !overlayOpen\"\n      (click)=\"clearSelection($event)\"\n    >\n      close\n    </mat-icon>\n  </button>\n  <mat-icon class=\"material-symbols-outlined shrink-0 opacity-40\">\n    <ng-container *ngIf=\"overlayOpen\">expand_less</ng-container>\n    <ng-container *ngIf=\"!overlayOpen\">expand_more</ng-container>\n  </mat-icon>\n</gn-ui-button>\n\n<ng-template\n  cdkConnectedOverlay\n  cdkConnectedOverlayHasBackdrop\n  cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n  [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\n  [cdkConnectedOverlayOpen]=\"overlayOpen\"\n  [cdkConnectedOverlayPositions]=\"overlayPositions\"\n  [cdkConnectedOverlayScrollStrategy]=\"scrollStrategy\"\n  [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n  (overlayOutsideClick)=\"closeOverlay()\"\n  (detach)=\"closeOverlay()\"\n>\n  <div\n    class=\"bg-white border border-gray-300 rounded shadow-lg py-2 w-full overflow-x-hidden overflow-y-auto overlay-container\"\n    [style.max-height]=\"overlayMaxHeight\"\n    [style.width]=\"overlayWidth\"\n    role=\"listbox\"\n    tabindex=\"-1\"\n    [attr.id]=\"id\"\n    [attr.aria-multiselectable]=\"true\"\n    [attr.aria-label]=\"title\"\n    (keydown)=\"handleOverlayKeydown($event)\"\n    #overlayContainer\n  >\n    <div\n      class=\"border border-gray-300 rounded mb-2 mx-2 min-h-[44px] flex flex-row flex-wrap p-2 focus-within:rounded focus-within:border-2 focus-within:border-primary\"\n    >\n      <button\n        type=\"button\"\n        *ngFor=\"let selected of selectedChoices\"\n        [title]=\"selected.label\"\n        class=\"max-w-full bg-main text-white rounded pr-[7px] flex gap-1 items-center opacity-70 hover:opacity-100 focus:opacity-100 transition-opacity mb-1\"\n        (click)=\"select(selected, false)\"\n      >\n        <div class=\"text-sm truncate leading-[26px] px-2\">\n          {{ selected.label }}\n        </div>\n        <div\n          class=\"flex items-center justify-center rounded-full bg-white text-main h-[13px] w-[13px] pt-px -mt-px shrink-0\"\n        >\n          <mat-icon\n            class=\"material-symbols-outlined !h-[12px] !w-[12px] text-[12px]\"\n          >\n            close</mat-icon\n          >\n        </div>\n      </button>\n\n      <div *ngIf=\"allowSearch\" class=\"w-[50%] relative grow shrink\">\n        <input\n          #searchFieldInput\n          class=\"w-full px-2 truncate text-[14px] h-full overlaySearchInput focus:outline-none\"\n          [(ngModel)]=\"searchInputValue\"\n          [placeholder]=\"'multiselect.filter.placeholder' | translate\"\n        />\n        <button\n          *ngIf=\"!!searchInputValue\"\n          class=\"absolute top-1/2 -translate-y-1/2 right-0 px-[7px] leading-tight clear-search-input mr-2\"\n          (click)=\"clearSearchInputValue($event)\"\n        >\n          <mat-icon\n            class=\"material-symbols-outlined !h-[10px] !w-[12px] text-[12px]\"\n          >\n            close\n          </mat-icon>\n        </button>\n      </div>\n    </div>\n\n    <label\n      *ngFor=\"let choice of filteredChoicesByText\"\n      [title]=\"choice.label\"\n      class=\"flex px-5 py-1 w-full text-gray-900 cursor-pointer hover:text-primary-darkest hover:bg-gray-50 focus-within:text-primary-darkest focus-within:bg-gray-50 transition-colors\"\n    >\n      <input\n        class=\"w-[18px] h-[18px] align-text-top shrink-0\"\n        type=\"checkbox\"\n        #checkBox\n        [checked]=\"isSelected(choice)\"\n        (change)=\"select(choice, checkBox.checked)\"\n      />\n      <span class=\"ml-[8px] text-[14px] truncate\">\n        {{ choice.label }}\n      </span>\n    </label>\n  </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1$6.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"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$6.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DropdownMultiselectComponent, decorators: [{
             type: Component,
@@ -27395,31 +27503,33 @@ class EditableLabelDirective {
         this.renderer = renderer;
         this.editableLabelChanged = new EventEmitter();
     }
+    ngOnChanges() {
+        if (this.appendedInput) {
+            this.renderer.setProperty(this.appendedInput, 'value', this.gnUiEditableLabel);
+        }
+    }
     ngAfterViewInit() {
-        if (this.gnUiEditableLabel !== false) {
-            const appendedInput = this.renderer.createElement('input');
-            this.renderer.setStyle(appendedInput, 'background', 'inherit');
-            this.renderer.setStyle(appendedInput, 'color', 'inherit');
-            this.renderer.setStyle(appendedInput, 'font', 'inherit');
-            this.renderer.setStyle(appendedInput, 'border', 'inherit');
-            this.renderer.setStyle(appendedInput, 'width', '100%');
-            this.renderer.setStyle(appendedInput, 'padding', 'inherit');
-            this.renderer.setStyle(appendedInput, 'margin', '0');
-            this.renderer.setStyle(appendedInput, 'height', 'inherit');
-            this.renderer.setStyle(appendedInput, 'line-height', 'inherit');
-            this.renderer.setStyle(appendedInput, 'text-decoration', 'inherit');
-            const hostContent = this.el.nativeElement.textContent || '';
-            const formattedContent = hostContent.replace(/\s+/g, ' ').trim();
-            this.renderer.setProperty(appendedInput, 'value', formattedContent);
-            this.renderer.setProperty(this.el.nativeElement, 'innerHTML', '');
-            this.renderer.listen(appendedInput, 'input', (event) => {
+        if (this.gnUiEditableLabel !== undefined) {
+            this.appendedInput = this.renderer.createElement('input');
+            this.renderer.setStyle(this.appendedInput, 'background', 'inherit');
+            this.renderer.setStyle(this.appendedInput, 'color', 'inherit');
+            this.renderer.setStyle(this.appendedInput, 'font', 'inherit');
+            this.renderer.setStyle(this.appendedInput, 'border', 'inherit');
+            this.renderer.setStyle(this.appendedInput, 'width', '100%');
+            this.renderer.setStyle(this.appendedInput, 'padding', 'inherit');
+            this.renderer.setStyle(this.appendedInput, 'margin', '0');
+            this.renderer.setStyle(this.appendedInput, 'height', 'inherit');
+            this.renderer.setStyle(this.appendedInput, 'line-height', 'inherit');
+            this.renderer.setStyle(this.appendedInput, 'text-decoration', 'inherit');
+            this.renderer.setProperty(this.appendedInput, 'value', this.gnUiEditableLabel);
+            this.renderer.listen(this.appendedInput, 'input', (event) => {
                 this.editableLabelChanged.emit(event.target.value);
             });
-            this.renderer.appendChild(this.el.nativeElement, appendedInput);
+            this.renderer.appendChild(this.el.nativeElement, this.appendedInput);
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EditableLabelDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: EditableLabelDirective, isStandalone: true, selector: "[gnUiEditableLabel]", inputs: { gnUiEditableLabel: "gnUiEditableLabel" }, outputs: { editableLabelChanged: "editableLabelChanged" }, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: EditableLabelDirective, isStandalone: true, selector: "[gnUiEditableLabel]", inputs: { gnUiEditableLabel: "gnUiEditableLabel" }, outputs: { editableLabelChanged: "editableLabelChanged" }, usesOnChanges: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EditableLabelDirective, decorators: [{
             type: Directive,
@@ -27427,10 +27537,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     selector: '[gnUiEditableLabel]',
                     standalone: true,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { editableLabelChanged: [{
-                type: Output
-            }], gnUiEditableLabel: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { gnUiEditableLabel: [{
                 type: Input
+            }], editableLabelChanged: [{
+                type: Output
             }] } });
 
 class NavigationButtonComponent {
@@ -28055,6 +28165,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Output
             }] } });
 
+class SwitchToggleComponent {
+    constructor() {
+        this.ariaLabel = '';
+        this.extraClasses = '';
+        this.selectedValue = new EventEmitter();
+    }
+    onChange(selectedOption) {
+        this.options.find((option) => option.value === selectedOption.value).checked = true;
+        this.selectedValue.emit(selectedOption);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SwitchToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SwitchToggleComponent, isStandalone: true, selector: "gn-ui-switch-toggle", inputs: { options: "options", ariaLabel: "ariaLabel", extraClasses: "extraClasses" }, outputs: { selectedValue: "selectedValue" }, ngImport: i0, template: "<mat-button-toggle-group\n  #group=\"matButtonToggleGroup\"\n  multiple=\"false\"\n  class=\"flex w-full\"\n>\n  <mat-button-toggle\n    *ngFor=\"let option of options\"\n    [aria-label]=\"option.label\"\n    [value]=\"option.value\"\n    [checked]=\"option.checked\"\n    (change)=\"onChange(option)\"\n    [class]=\"extraClasses\"\n    >{{ option.label }}</mat-button-toggle\n  >\n</mat-button-toggle-group>\n", styles: [":host{--mat-standard-button-toggle-height: 32px}.mat-button-toggle-group-appearance-standard{background-color:var(--color-gray-200);padding:4px;display:flex;gap:4px;border-radius:8px}.mat-button-toggle-appearance-standard{color:var(--color-main);background-color:var(--color-gray-200);border-radius:4px;border-left:none}.mat-button-toggle-appearance-standard.mat-button-toggle-checked{background-color:var(--color-main);color:var(--color-primary-white)}button.mat-button-toggle-button.mat-focus-indicator.mat-button-toggle-label-content,.mat-button-toggle-label-content{line-height:32px}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$7.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$7.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "appearance", "checked", "disabled"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SwitchToggleComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'gn-ui-switch-toggle', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [MatButtonToggleModule, CommonModule], template: "<mat-button-toggle-group\n  #group=\"matButtonToggleGroup\"\n  multiple=\"false\"\n  class=\"flex w-full\"\n>\n  <mat-button-toggle\n    *ngFor=\"let option of options\"\n    [aria-label]=\"option.label\"\n    [value]=\"option.value\"\n    [checked]=\"option.checked\"\n    (change)=\"onChange(option)\"\n    [class]=\"extraClasses\"\n    >{{ option.label }}</mat-button-toggle\n  >\n</mat-button-toggle-group>\n", styles: [":host{--mat-standard-button-toggle-height: 32px}.mat-button-toggle-group-appearance-standard{background-color:var(--color-gray-200);padding:4px;display:flex;gap:4px;border-radius:8px}.mat-button-toggle-appearance-standard{color:var(--color-main);background-color:var(--color-gray-200);border-radius:4px;border-left:none}.mat-button-toggle-appearance-standard.mat-button-toggle-checked{background-color:var(--color-main);color:var(--color-primary-white)}button.mat-button-toggle-button.mat-focus-indicator.mat-button-toggle-label-content,.mat-button-toggle-label-content{line-height:32px}\n"] }]
+        }], propDecorators: { options: [{
+                type: Input
+            }], ariaLabel: [{
+                type: Input
+            }], extraClasses: [{
+                type: Input
+            }], selectedValue: [{
+                type: Output
+            }] } });
+
 class ConfirmationDialogComponent {
     constructor(dialogRef, data) {
         this.dialogRef = dialogRef;
@@ -28066,13 +28202,13 @@ class ConfirmationDialogComponent {
     onCancel() {
         this.dialogRef.close(false);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConfirmationDialogComponent, deps: [{ token: i1$7.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ConfirmationDialogComponent, isStandalone: true, selector: "gn-ui-confirmation-dialog", ngImport: i0, template: "<h1 mat-dialog-title>{{ data.title }}</h1>\n<div mat-dialog-content>{{ data.message }}</div>\n<div mat-dialog-actions>\n  <gn-ui-button (buttonClick)=\"onCancel()\">{{ data.cancelText }}</gn-ui-button>\n  <gn-ui-button\n    (buttonClick)=\"onConfirm()\"\n    cdkFocusInitial\n    class=\"ml-2\"\n    data-cy=\"confirm-button\"\n    >{{ data.confirmText }}</gn-ui-button\n  >\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1$7.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$7.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$7.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConfirmationDialogComponent, deps: [{ token: i1$8.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ConfirmationDialogComponent, isStandalone: true, selector: "gn-ui-confirmation-dialog", ngImport: i0, template: "<h1 mat-dialog-title>{{ data.title }}</h1>\n<div mat-dialog-content>{{ data.message }}</div>\n<div mat-dialog-actions>\n  <gn-ui-button (buttonClick)=\"onCancel()\">{{ data.cancelText }}</gn-ui-button>\n  <gn-ui-button\n    (buttonClick)=\"onConfirm()\"\n    cdkFocusInitial\n    class=\"ml-2\"\n    data-cy=\"confirm-button\"\n    >{{ data.confirmText }}</gn-ui-button\n  >\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1$8.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$8.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$8.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConfirmationDialogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'gn-ui-confirmation-dialog', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [MatDialogModule, ButtonComponent], template: "<h1 mat-dialog-title>{{ data.title }}</h1>\n<div mat-dialog-content>{{ data.message }}</div>\n<div mat-dialog-actions>\n  <gn-ui-button (buttonClick)=\"onCancel()\">{{ data.cancelText }}</gn-ui-button>\n  <gn-ui-button\n    (buttonClick)=\"onConfirm()\"\n    cdkFocusInitial\n    class=\"ml-2\"\n    data-cy=\"confirm-button\"\n    >{{ data.confirmText }}</gn-ui-button\n  >\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: i1$7.MatDialogRef }, { type: undefined, decorators: [{
+        }], ctorParameters: function () { return [{ type: i1$8.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
                 }] }]; } });
@@ -28628,7 +28764,7 @@ class PaginationComponent {
         this.setPage(this.currentPage - 1);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PaginationComponent, selector: "gn-ui-pagination", inputs: { currentPage: "currentPage", nPages: "nPages", hideButton: "hideButton" }, outputs: { newCurrentPageEvent: "newCurrentPageEvent" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"relative\">\n  <div class=\"sm:absolute sm:inset-0\" *ngIf=\"!hideButton\">\n    <gn-ui-button\n      (buttonClick)=\"nextPage()\"\n      type=\"secondary\"\n      [disabled]=\"currentPage === nPages\"\n      extraClass=\"lg:m-auto !p-[22px]\"\n    >\n      <span class=\"uppercase font-medium tracking-widest\" translate\n        >pagination.nextPage</span\n      >\n    </gn-ui-button>\n  </div>\n  <div\n    class=\"relative pointer-events-none flex flex-row justify-start sm:justify-end\"\n  >\n    <div class=\"pointer-events-auto flex flex-row items-center py-[13px]\">\n      <span class=\"mr-3 capitalize text-sm text-gray-900\" translate\n        >pagination.page</span\n      >\n      <input\n        type=\"number\"\n        [ngModel]=\"currentPage\"\n        [min]=\"1\"\n        [max]=\"nPages\"\n        (ngModelChange)=\"setPage($event)\"\n        class=\"border border-gray-300 rounded w-[54px] h-[34px] pl-[12px] mr-3 text-center\"\n      />\n      <span class=\"mr-3 text-sm text-gray-900\"\n        ><span translate>pagination.pageOf</span> {{ nPages }}</span\n      >\n      <gn-ui-button\n        (buttonClick)=\"previousPage()\"\n        id=\"navigate_previous\"\n        class=\"mr-2\"\n        [disabled]=\"currentPage === 1\"\n        [type]=\"'light'\"\n        extraClass=\"!px-[3px]\"\n        data-cy=\"prev-page\"\n      >\n        <mat-icon class=\"material-symbols-outlined\">navigate_before</mat-icon>\n      </gn-ui-button>\n      <gn-ui-button\n        (buttonClick)=\"nextPage()\"\n        id=\"navigate_next\"\n        [disabled]=\"currentPage === nPages\"\n        [type]=\"'light'\"\n        extraClass=\"!px-[3px]\"\n        data-cy=\"next-page\"\n      >\n        <mat-icon class=\"material-symbols-outlined\">navigate_next</mat-icon>\n      </gn-ui-button>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i2$1.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PaginationComponent, selector: "gn-ui-pagination", inputs: { currentPage: "currentPage", nPages: "nPages", hideButton: "hideButton" }, outputs: { newCurrentPageEvent: "newCurrentPageEvent" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"relative\">\n  <div class=\"sm:absolute sm:inset-0\" *ngIf=\"!hideButton\">\n    <gn-ui-button\n      (buttonClick)=\"nextPage()\"\n      type=\"secondary\"\n      [disabled]=\"currentPage === nPages\"\n      extraClass=\"lg:m-auto !p-[22px]\"\n    >\n      <span class=\"uppercase font-medium tracking-widest\" translate\n        >pagination.nextPage</span\n      >\n    </gn-ui-button>\n  </div>\n  <div\n    class=\"relative pointer-events-none flex flex-row justify-start sm:justify-end\"\n  >\n    <div class=\"pointer-events-auto flex flex-row items-center py-[13px]\">\n      <span class=\"mr-3 capitalize text-sm text-gray-900\" translate\n        >pagination.page</span\n      >\n      <input\n        type=\"number\"\n        [ngModel]=\"currentPage\"\n        [min]=\"1\"\n        [max]=\"nPages\"\n        (ngModelChange)=\"setPage($event)\"\n        class=\"border border-gray-300 rounded w-[54px] h-[34px] pl-[12px] mr-3 text-center\"\n      />\n      <span class=\"mr-3 text-sm text-gray-900\"\n        ><span translate>pagination.pageOf</span> {{ nPages }}</span\n      >\n      <gn-ui-button\n        (buttonClick)=\"previousPage()\"\n        id=\"navigate_previous\"\n        class=\"mr-2\"\n        [disabled]=\"currentPage === 1\"\n        [type]=\"'light'\"\n        extraClass=\"!px-[3px]\"\n        data-cy=\"prev-page\"\n      >\n        <mat-icon class=\"material-symbols-outlined\">navigate_before</mat-icon>\n      </gn-ui-button>\n      <gn-ui-button\n        (buttonClick)=\"nextPage()\"\n        id=\"navigate_next\"\n        [disabled]=\"currentPage === nPages\"\n        [type]=\"'light'\"\n        extraClass=\"!px-[3px]\"\n        data-cy=\"next-page\"\n      >\n        <mat-icon class=\"material-symbols-outlined\">navigate_next</mat-icon>\n      </gn-ui-button>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i5.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PaginationComponent, decorators: [{
             type: Component,
@@ -28784,7 +28920,7 @@ class RelatedRecordCardComponent {
         return `${this.baseClasses} ${this.extraClass}`;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RelatedRecordCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: RelatedRecordCardComponent, selector: "gn-ui-related-record-card", inputs: { record: "record", extraClass: "extraClass" }, ngImport: i0, template: "<a\n  [class]=\"classList\"\n  [routerLink]=\"['/dataset', record.uniqueIdentifier]\"\n  target=\"_blank\"\n>\n  <div class=\"h-52 bg-gray-100\">\n    <gn-ui-thumbnail\n      class=\"h-52 w-full object-cover\"\n      [thumbnailUrl]=\"record.overviews?.[0]?.url.toString()\"\n    ></gn-ui-thumbnail>\n  </div>\n  <div class=\"flex flex-col justify-between h-44 px-5 pt-4 pb-6\">\n    <h4\n      class=\"max-h-24 font-title text-21 text-black text-ellipsis overflow-hidden\"\n    >\n      {{ record.title }}\n    </h4>\n    <div>\n      <button\n        mat-raised-button\n        [matTooltip]=\"'tooltip.url.open' | translate\"\n        matTooltipPosition=\"above\"\n      >\n        <mat-icon class=\"material-symbols-outlined align-middle text-secondary\"\n          >open_in_new</mat-icon\n        >\n      </button>\n    </div>\n  </div>\n</a>\n", styles: [""], dependencies: [{ kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "directive", type: i1$8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ThumbnailComponent, selector: "gn-ui-thumbnail", inputs: ["thumbnailUrl", "fit"], outputs: ["placeholderShown"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: RelatedRecordCardComponent, selector: "gn-ui-related-record-card", inputs: { record: "record", extraClass: "extraClass" }, ngImport: i0, template: "<a\n  [class]=\"classList\"\n  [routerLink]=\"['/dataset', record.uniqueIdentifier]\"\n  target=\"_blank\"\n>\n  <div class=\"h-52 bg-gray-100\">\n    <gn-ui-thumbnail\n      class=\"h-52 w-full object-cover\"\n      [thumbnailUrl]=\"record.overviews?.[0]?.url.toString()\"\n    ></gn-ui-thumbnail>\n  </div>\n  <div class=\"flex flex-col justify-between h-44 px-5 pt-4 pb-6\">\n    <h4\n      class=\"max-h-24 font-title text-21 text-black text-ellipsis overflow-hidden\"\n    >\n      {{ record.title }}\n    </h4>\n    <div>\n      <button\n        mat-raised-button\n        [matTooltip]=\"'tooltip.url.open' | translate\"\n        matTooltipPosition=\"above\"\n      >\n        <mat-icon class=\"material-symbols-outlined align-middle text-secondary\"\n          >open_in_new</mat-icon\n        >\n      </button>\n    </div>\n  </div>\n</a>\n", styles: [""], dependencies: [{ kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "directive", type: i1$9.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ThumbnailComponent, selector: "gn-ui-thumbnail", inputs: ["thumbnailUrl", "fit"], outputs: ["placeholderShown"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RelatedRecordCardComponent, decorators: [{
             type: Component,
@@ -28797,9 +28933,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
 
 class SortableListComponent {
     constructor() {
-        this.addOptions = [];
         this.elementsChange = new EventEmitter();
-        this.add = new EventEmitter();
     }
     drop(event) {
         moveItemInArray(this.elements, event.previousIndex, event.currentIndex);
@@ -28813,7 +28947,7 @@ class SortableListComponent {
         return index;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SortableListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SortableListComponent, isStandalone: true, selector: "gn-ui-sortable-list", inputs: { elements: "elements", addOptions: "addOptions" }, outputs: { elementsChange: "elementsChange", add: "add" }, ngImport: i0, template: "<div class=\"flex gap-2 mb-2\">\n  <gn-ui-button\n    *ngFor=\"let addOption of addOptions\"\n    (buttonClick)=\"add.emit(addOption.eventName)\"\n  >\n    <span class=\"material-symbols-outlined gn-ui-icon-small\"> add </span>\n    &nbsp;{{ addOption.buttonLabel }}</gn-ui-button\n  >\n</div>\n<div\n  cdkDropList\n  class=\"sortable-list flex flex-col gap-3 p-2\"\n  (cdkDropListDropped)=\"drop($event)\"\n>\n  <ng-container\n    *ngFor=\"let element of elements; index as index; trackBy: trackByFn\"\n  >\n    <div class=\"sortable-box bg-white flex items-center\" cdkDrag>\n      <span\n        cdkDragHandle\n        class=\"material-symbols-outlined mx-[10px] cursor-grab gn-ui-icon-medium flex-none\"\n      >\n        drag_handle\n      </span>\n      <div class=\"flex-1\">\n        <ng-container\n          *ngComponentOutlet=\"element.component; inputs: element.inputs\"\n        ></ng-container>\n      </div>\n      <span\n        (click)=\"removeElement(index)\"\n        class=\"material-symbols-outlined mx-[10px] cursor-pointer gn-ui-icon-medium flex-none\"\n      >\n        close\n      </span>\n    </div>\n  </ng-container>\n</div>\n", styles: [".cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.sortable-list.cdk-drop-list-dragging .sortable-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SortableListComponent, isStandalone: true, selector: "gn-ui-sortable-list", inputs: { elements: "elements" }, outputs: { elementsChange: "elementsChange" }, ngImport: i0, template: "<div\n  cdkDropList\n  class=\"sortable-list flex flex-col gap-3 p-2\"\n  (cdkDropListDropped)=\"drop($event)\"\n>\n  <ng-container\n    *ngFor=\"let element of elements; index as index; trackBy: trackByFn\"\n  >\n    <div class=\"sortable-box bg-white flex items-center\" cdkDrag>\n      <span\n        cdkDragHandle\n        class=\"material-symbols-outlined mx-[10px] cursor-grab gn-ui-icon-medium flex-none\"\n      >\n        drag_handle\n      </span>\n      <div class=\"flex-1\">\n        <ng-container\n          *ngComponentOutlet=\"element.component; inputs: element.inputs\"\n        ></ng-container>\n      </div>\n      <span\n        (click)=\"removeElement(index)\"\n        class=\"material-symbols-outlined mx-[10px] cursor-pointer gn-ui-icon-medium flex-none\"\n      >\n        close\n      </span>\n    </div>\n  </ng-container>\n</div>\n", styles: [".cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.sortable-list.cdk-drop-list-dragging .sortable-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: MatIconModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SortableListComponent, decorators: [{
             type: Component,
@@ -28824,16 +28958,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         CdkDrag,
                         CdkDragHandle,
                         MatIconModule,
-                        ButtonComponent,
-                    ], template: "<div class=\"flex gap-2 mb-2\">\n  <gn-ui-button\n    *ngFor=\"let addOption of addOptions\"\n    (buttonClick)=\"add.emit(addOption.eventName)\"\n  >\n    <span class=\"material-symbols-outlined gn-ui-icon-small\"> add </span>\n    &nbsp;{{ addOption.buttonLabel }}</gn-ui-button\n  >\n</div>\n<div\n  cdkDropList\n  class=\"sortable-list flex flex-col gap-3 p-2\"\n  (cdkDropListDropped)=\"drop($event)\"\n>\n  <ng-container\n    *ngFor=\"let element of elements; index as index; trackBy: trackByFn\"\n  >\n    <div class=\"sortable-box bg-white flex items-center\" cdkDrag>\n      <span\n        cdkDragHandle\n        class=\"material-symbols-outlined mx-[10px] cursor-grab gn-ui-icon-medium flex-none\"\n      >\n        drag_handle\n      </span>\n      <div class=\"flex-1\">\n        <ng-container\n          *ngComponentOutlet=\"element.component; inputs: element.inputs\"\n        ></ng-container>\n      </div>\n      <span\n        (click)=\"removeElement(index)\"\n        class=\"material-symbols-outlined mx-[10px] cursor-pointer gn-ui-icon-medium flex-none\"\n      >\n        close\n      </span>\n    </div>\n  </ng-container>\n</div>\n", styles: [".cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.sortable-list.cdk-drop-list-dragging .sortable-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"] }]
+                    ], template: "<div\n  cdkDropList\n  class=\"sortable-list flex flex-col gap-3 p-2\"\n  (cdkDropListDropped)=\"drop($event)\"\n>\n  <ng-container\n    *ngFor=\"let element of elements; index as index; trackBy: trackByFn\"\n  >\n    <div class=\"sortable-box bg-white flex items-center\" cdkDrag>\n      <span\n        cdkDragHandle\n        class=\"material-symbols-outlined mx-[10px] cursor-grab gn-ui-icon-medium flex-none\"\n      >\n        drag_handle\n      </span>\n      <div class=\"flex-1\">\n        <ng-container\n          *ngComponentOutlet=\"element.component; inputs: element.inputs\"\n        ></ng-container>\n      </div>\n      <span\n        (click)=\"removeElement(index)\"\n        class=\"material-symbols-outlined mx-[10px] cursor-pointer gn-ui-icon-medium flex-none\"\n      >\n        close\n      </span>\n    </div>\n  </ng-container>\n</div>\n", styles: [".cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.sortable-list.cdk-drop-list-dragging .sortable-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"] }]
         }], propDecorators: { elements: [{
                 type: Input
-            }], addOptions: [{
-                type: Input
             }], elementsChange: [{
                 type: Output
-            }], add: [{
-                type: Output
             }] } });
 
 class UserPreviewComponent {
@@ -29229,7 +29358,7 @@ class ActionMenuComponent {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionMenuComponent, deps: [{ token: i1$7.MatDialog }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionMenuComponent, deps: [{ token: i1$8.MatDialog }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ActionMenuComponent, isStandalone: true, selector: "gn-ui-action-menu", inputs: { canDuplicate: "canDuplicate", canDelete: "canDelete" }, outputs: { duplicate: "duplicate", delete: "delete" }, viewQueries: [{ propertyName: "trigger", first: true, predicate: MatMenuTrigger, descendants: true }], ngImport: i0, template: "<gn-ui-button\n  type=\"light\"\n  [matMenuTriggerFor]=\"menu\"\n  (buttonClick)=\"openMenu()\"\n  data-test=\"record-menu-button\"\n>\n  <mat-icon class=\"material-symbols-outlined\">more_vert</mat-icon>\n</gn-ui-button>\n<mat-menu #menu=\"matMenu\">\n  <button\n    mat-menu-item\n    [disabled]=\"!canDuplicate\"\n    (click)=\"duplicate.emit()\"\n    data-test=\"record-menu-duplicate-button\"\n  >\n    <span translate>record.action.duplicate</span>\n  </button>\n  <button\n    mat-menu-item\n    [disabled]=\"!canDelete\"\n    (click)=\"openDeleteConfirmationDialog()\"\n    data-test=\"record-menu-delete-button\"\n  >\n    <span translate>record.action.delete</span>\n  </button>\n</mat-menu>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionMenuComponent, decorators: [{
@@ -29242,7 +29371,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         ConfirmationDialogComponent,
                         TranslateModule,
                     ], template: "<gn-ui-button\n  type=\"light\"\n  [matMenuTriggerFor]=\"menu\"\n  (buttonClick)=\"openMenu()\"\n  data-test=\"record-menu-button\"\n>\n  <mat-icon class=\"material-symbols-outlined\">more_vert</mat-icon>\n</gn-ui-button>\n<mat-menu #menu=\"matMenu\">\n  <button\n    mat-menu-item\n    [disabled]=\"!canDuplicate\"\n    (click)=\"duplicate.emit()\"\n    data-test=\"record-menu-duplicate-button\"\n  >\n    <span translate>record.action.duplicate</span>\n  </button>\n  <button\n    mat-menu-item\n    [disabled]=\"!canDelete\"\n    (click)=\"openDeleteConfirmationDialog()\"\n    data-test=\"record-menu-delete-button\"\n  >\n    <span translate>record.action.delete</span>\n  </button>\n</mat-menu>\n" }]
-        }], ctorParameters: function () { return [{ type: i1$7.MatDialog }, { type: i1$1.TranslateService }]; }, propDecorators: { canDuplicate: [{
+        }], ctorParameters: function () { return [{ type: i1$8.MatDialog }, { type: i1$1.TranslateService }]; }, propDecorators: { canDuplicate: [{
                 type: Input
             }], canDelete: [{
                 type: Input
@@ -30845,12 +30974,12 @@ class SearchEffects {
             );
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SearchEffects, deps: [{ token: i1$9.Actions }, { token: i1$2.Store }, { token: RecordsRepositoryInterface }, { token: FavoritesService }, { token: PlatformServiceInterface }, { token: FILTER_GEOMETRY, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SearchEffects, deps: [{ token: i1$a.Actions }, { token: i1$2.Store }, { token: RecordsRepositoryInterface }, { token: FavoritesService }, { token: PlatformServiceInterface }, { token: FILTER_GEOMETRY, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SearchEffects }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SearchEffects, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i1$9.Actions }, { type: i1$2.Store }, { type: RecordsRepositoryInterface }, { type: FavoritesService }, { type: PlatformServiceInterface }, { type: Promise, decorators: [{
+        }], ctorParameters: function () { return [{ type: i1$a.Actions }, { type: i1$2.Store }, { type: RecordsRepositoryInterface }, { type: FavoritesService }, { type: PlatformServiceInterface }, { type: Promise, decorators: [{
                     type: Optional
                 }, {
                     type: Inject,
@@ -31264,7 +31393,7 @@ class FeatureSearchModule {
             ResultsHitsContainerComponent,
             SearchStateContainerDirective,
             FavoriteStarComponent,
-            FilterDropdownComponent], imports: [CommonModule, i1$1.TranslateModule, i1$2.StoreFeatureModule, i1$9.EffectsFeatureModule, HttpClientModule,
+            FilterDropdownComponent], imports: [CommonModule, i1$1.TranslateModule, i1$2.StoreFeatureModule, i1$a.EffectsFeatureModule, HttpClientModule,
             HttpClientXsrfModule,
             UiSearchModule,
             UiInputsModule,
@@ -31511,12 +31640,12 @@ class MapEffects {
     constructor(actions$) {
         this.actions$ = actions$;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapEffects, deps: [{ token: i1$9.Actions }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapEffects, deps: [{ token: i1$a.Actions }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapEffects }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MapEffects, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i1$9.Actions }]; } });
+        }], ctorParameters: function () { return [{ type: i1$a.Actions }]; } });
 
 class MapContainerComponent {
     constructor(mapFacade) {
@@ -31775,7 +31904,7 @@ class FeatureMapModule {
             MatIconModule,
             MatTabsModule,
             TranslateModule,
-            FeatureSearchModule, i1$2.StoreFeatureModule, i1$9.EffectsFeatureModule, UiElementsModule,
+            FeatureSearchModule, i1$2.StoreFeatureModule, i1$a.EffectsFeatureModule, UiElementsModule,
             UiInputsModule,
             AddLayerFromOgcApiComponent,
             TextInputComponent], exports: [MapContextComponent,
@@ -32189,7 +32318,7 @@ class LayersPanelComponent {
         this.mapFacade.addLayer(layer);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LayersPanelComponent, deps: [{ token: MapFacade }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LayersPanelComponent, isStandalone: true, selector: "gn-ui-layers-panel", ngImport: i0, template: "<div\n  class=\"bg-white rounded shadow shadow-lg relative h-full w-[400px] overflow-hidden\"\n>\n  <div class=\"p-3 border-b border-gray-300 flex items-center\">\n    <mat-icon class=\"material-symbols-outlined mr-2\">layers</mat-icon>\n    <span translate>map.layers.list</span>\n  </div>\n  <div class=\"flex flex-col px-4 divide-y divide-y-gray-50\">\n    <div\n      *ngFor=\"let layer of layers$ | async; let index = index\"\n      class=\"flex flex-row py-3\"\n    >\n      <mat-icon class=\"material-symbols-outlined -ml-2 mr-2 shrink-0\"\n        >chevron_right</mat-icon\n      >\n      <span class=\"mr-2 grow\">{{ layer.title }}</span>\n      <a\n        href\n        class=\"underline text-sm text-red-700 hover:text-red-900\"\n        (click)=\"deleteLayer(index)\"\n      >\n        delete\n      </a>\n    </div>\n  </div>\n  <gn-ui-expandable-panel-button [titleTemplate]=\"addLayerTitle\">\n    <mat-tab-group animationDuration=\"200ms\" class=\"h-full\">\n      <mat-tab [label]=\"'map.add.layer.catalog' | translate\">\n        <div class=\"p-3\">\n          <gn-ui-add-layer-from-catalog></gn-ui-add-layer-from-catalog>\n        </div>\n      </mat-tab>\n      <mat-tab [label]=\"'map.add.layer.wms' | translate\" bodyClass=\"h-full\">\n        <div class=\"p-3\">\n          <gn-ui-add-layer-from-wms></gn-ui-add-layer-from-wms>\n        </div>\n      </mat-tab>\n      <mat-tab [label]=\"'map.add.layer.wfs' | translate\" bodyClass=\"h-full\">\n        <div class=\"p-3\">\n          <gn-ui-add-layer-from-wfs></gn-ui-add-layer-from-wfs>\n        </div>\n      </mat-tab>\n      <mat-tab [label]=\"'map.add.layer.ogc.api' | translate\" bodyClass=\"h-full\">\n        <div class=\"p-3\">\n          <gn-ui-add-layer-from-ogc-api\n            [ogcUrl]=\"ogcUrl\"\n            (layerAdded)=\"addLayer($event)\"\n          ></gn-ui-add-layer-from-ogc-api>\n        </div>\n      </mat-tab>\n      <mat-tab [label]=\"'map.add.layer.file' | translate\" bodyClass=\"h-full\">\n        <div class=\"p-3\">\n          <gn-ui-add-layer-from-file></gn-ui-add-layer-from-file>\n        </div>\n      </mat-tab>\n    </mat-tab-group>\n  </gn-ui-expandable-panel-button>\n</div>\n\n<ng-template #addLayerTitle>\n  <mat-icon class=\"material-symbols-outlined mr-4\">add_circle</mat-icon>\n  <span translate>map.add.layer</span>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: UiLayoutModule }, { kind: "component", type: ExpandablePanelButtonComponent, selector: "gn-ui-expandable-panel-button", inputs: ["titleTemplate", "collapsed"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2$4.MatTab, selector: "mat-tab", inputs: ["disabled"], exportAs: ["matTab"] }, { kind: "component", type: i2$4.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple", "fitInkBarToContent", "mat-stretch-tabs"], exportAs: ["matTabGroup"] }, { kind: "component", type: AddLayerFromOgcApiComponent, selector: "gn-ui-add-layer-from-ogc-api", inputs: ["ogcUrl"], outputs: ["layerAdded"] }, { kind: "component", type: AddLayerFromWfsComponent, selector: "gn-ui-add-layer-from-wfs" }, { kind: "component", type: AddLayerFromWmsComponent, selector: "gn-ui-add-layer-from-wms" }, { kind: "component", type: AddLayerFromCatalogComponent, selector: "gn-ui-add-layer-from-catalog" }, { kind: "component", type: AddLayerFromFileComponent, selector: "gn-ui-add-layer-from-file" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LayersPanelComponent, isStandalone: true, selector: "gn-ui-layers-panel", ngImport: i0, template: "<div\n  class=\"bg-white rounded shadow shadow-lg relative h-full w-[400px] overflow-hidden\"\n>\n  <div class=\"p-3 border-b border-gray-300 flex items-center\">\n    <mat-icon class=\"material-symbols-outlined mr-2\">layers</mat-icon>\n    <span translate>map.layers.list</span>\n  </div>\n  <div class=\"flex flex-col px-4 divide-y divide-y-gray-50\">\n    <div\n      *ngFor=\"let layer of layers$ | async; let index = index\"\n      class=\"flex flex-row py-3\"\n    >\n      <mat-icon class=\"material-symbols-outlined -ml-2 mr-2 shrink-0\"\n        >chevron_right</mat-icon\n      >\n      <span class=\"mr-2 grow\">{{ layer.title }}</span>\n      <a\n        href\n        class=\"underline text-sm text-red-700 hover:text-red-900\"\n        (click)=\"deleteLayer(index)\"\n      >\n        delete\n      </a>\n    </div>\n  </div>\n  <gn-ui-expandable-panel-button [titleTemplate]=\"addLayerTitle\">\n    <mat-tab-group animationDuration=\"200ms\" class=\"h-full\">\n      <mat-tab [label]=\"'map.add.layer.catalog' | translate\">\n        <div class=\"p-3\">\n          <gn-ui-add-layer-from-catalog></gn-ui-add-layer-from-catalog>\n        </div>\n      </mat-tab>\n      <mat-tab [label]=\"'map.add.layer.wms' | translate\" bodyClass=\"h-full\">\n        <div class=\"p-3\">\n          <gn-ui-add-layer-from-wms></gn-ui-add-layer-from-wms>\n        </div>\n      </mat-tab>\n      <mat-tab [label]=\"'map.add.layer.wfs' | translate\" bodyClass=\"h-full\">\n        <div class=\"p-3\">\n          <gn-ui-add-layer-from-wfs></gn-ui-add-layer-from-wfs>\n        </div>\n      </mat-tab>\n      <mat-tab [label]=\"'map.add.layer.ogc.api' | translate\" bodyClass=\"h-full\">\n        <div class=\"p-3\">\n          <gn-ui-add-layer-from-ogc-api\n            [ogcUrl]=\"ogcUrl\"\n            (layerAdded)=\"addLayer($event)\"\n          ></gn-ui-add-layer-from-ogc-api>\n        </div>\n      </mat-tab>\n      <mat-tab [label]=\"'map.add.layer.file' | translate\" bodyClass=\"h-full\">\n        <div class=\"p-3\">\n          <gn-ui-add-layer-from-file></gn-ui-add-layer-from-file>\n        </div>\n      </mat-tab>\n    </mat-tab-group>\n  </gn-ui-expandable-panel-button>\n</div>\n\n<ng-template #addLayerTitle>\n  <mat-icon class=\"material-symbols-outlined mr-4\">add_circle</mat-icon>\n  <span translate>map.add.layer</span>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: UiLayoutModule }, { kind: "component", type: ExpandablePanelButtonComponent, selector: "gn-ui-expandable-panel-button", inputs: ["titleTemplate", "collapsed"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2$3.MatTab, selector: "mat-tab", inputs: ["disabled"], exportAs: ["matTab"] }, { kind: "component", type: i2$3.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple", "fitInkBarToContent", "mat-stretch-tabs"], exportAs: ["matTabGroup"] }, { kind: "component", type: AddLayerFromOgcApiComponent, selector: "gn-ui-add-layer-from-ogc-api", inputs: ["ogcUrl"], outputs: ["layerAdded"] }, { kind: "component", type: AddLayerFromWfsComponent, selector: "gn-ui-add-layer-from-wfs" }, { kind: "component", type: AddLayerFromWmsComponent, selector: "gn-ui-add-layer-from-wms" }, { kind: "component", type: AddLayerFromCatalogComponent, selector: "gn-ui-add-layer-from-catalog" }, { kind: "component", type: AddLayerFromFileComponent, selector: "gn-ui-add-layer-from-file" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LayersPanelComponent, decorators: [{
             type: Component,
@@ -32574,7 +32703,7 @@ class TableComponent {
         return rowIdPrefix + id;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TableComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TableComponent, isStandalone: true, selector: "gn-ui-table", inputs: { data: "data", activeId: "activeId" }, outputs: { selected: "selected" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }], ngImport: i0, template: "<div class=\"border border-gray-300 rounded-lg overflow-hidden bg-white h-full\">\n  <cdk-virtual-scroll-viewport\n    tvsItemSize=\"48\"\n    headerHeight=\"56\"\n    style=\"height: calc(100% - 37px)\"\n  >\n    <table mat-table [dataSource]=\"dataSource\" class=\"mat-elevation-z8\" matSort>\n      <ng-container *ngFor=\"let prop of properties\" [matColumnDef]=\"prop\">\n        <th\n          mat-header-cell\n          *matHeaderCellDef\n          mat-sort-header\n          class=\"text-sm text-black bg-white\"\n        >\n          {{ prop }}\n        </th>\n        <td\n          mat-cell\n          *matCellDef=\"let element\"\n          class=\"whitespace-nowrap pr-1 truncate\"\n        >\n          {{ element[prop] }}\n        </td>\n      </ng-container>\n\n      <tr mat-header-row *matHeaderRowDef=\"properties; sticky: true\"></tr>\n      <tr\n        [id]=\"getRowEltId(row.id)\"\n        mat-row\n        *matRowDef=\"let row; columns: properties\"\n        (click)=\"selected.emit(row)\"\n        [class.active]=\"row.id === activeId\"\n      ></tr>\n    </table>\n  </cdk-virtual-scroll-viewport>\n  <div class=\"text-gray-900 border-t border-gray-300 px-4 py-2 text-sm\">\n    <span class=\"count font-extrabold text-primary\">{{ count }}</span\n    >&nbsp;<span translate>table.object.count</span>.\n  </div>\n</div>\n", styles: ["table{width:100%;background:white}th.mat-mdc-header-cell,td.mat-mdc-cell,td.mat-mdc-footer-cell{padding-right:20px}tr.mat-mdc-row,tr.mat-mdc-footer-row{height:36px}tr:hover{background:whitesmoke}tr.mat-mdc-header-row{height:48px}[mat-header-cell]{color:#0000008a;font-size:12px;font-weight:500}tr{cursor:pointer}.active .mat-mdc-cell{color:var(--color-primary)}\n"], dependencies: [{ kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i1$a.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i1$a.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i1$a.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i1$a.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i1$a.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i1$a.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i1$a.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i1$a.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i1$a.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i1$a.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i2$5.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i2$5.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: TableVirtualScrollModule }, { kind: "directive", type: i3$3.TableItemSizeDirective, selector: "cdk-virtual-scroll-viewport[tvsItemSize]", inputs: ["tvsItemSize", "headerEnabled", "headerHeight", "footerEnabled", "footerHeight", "bufferMultiplier"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "component", type: i4$1.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TableComponent, isStandalone: true, selector: "gn-ui-table", inputs: { data: "data", activeId: "activeId" }, outputs: { selected: "selected" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }], ngImport: i0, template: "<div class=\"border border-gray-300 rounded-lg overflow-hidden bg-white h-full\">\n  <cdk-virtual-scroll-viewport\n    tvsItemSize=\"48\"\n    headerHeight=\"56\"\n    style=\"height: calc(100% - 37px)\"\n  >\n    <table mat-table [dataSource]=\"dataSource\" class=\"mat-elevation-z8\" matSort>\n      <ng-container *ngFor=\"let prop of properties\" [matColumnDef]=\"prop\">\n        <th\n          mat-header-cell\n          *matHeaderCellDef\n          mat-sort-header\n          class=\"text-sm text-black bg-white\"\n        >\n          {{ prop }}\n        </th>\n        <td\n          mat-cell\n          *matCellDef=\"let element\"\n          class=\"whitespace-nowrap pr-1 truncate\"\n        >\n          {{ element[prop] }}\n        </td>\n      </ng-container>\n\n      <tr mat-header-row *matHeaderRowDef=\"properties; sticky: true\"></tr>\n      <tr\n        [id]=\"getRowEltId(row.id)\"\n        mat-row\n        *matRowDef=\"let row; columns: properties\"\n        (click)=\"selected.emit(row)\"\n        [class.active]=\"row.id === activeId\"\n      ></tr>\n    </table>\n  </cdk-virtual-scroll-viewport>\n  <div class=\"text-gray-900 border-t border-gray-300 px-4 py-2 text-sm\">\n    <span class=\"count font-extrabold text-primary\">{{ count }}</span\n    >&nbsp;<span translate>table.object.count</span>.\n  </div>\n</div>\n", styles: ["table{width:100%;background:white}th.mat-mdc-header-cell,td.mat-mdc-cell,td.mat-mdc-footer-cell{padding-right:20px}tr.mat-mdc-row,tr.mat-mdc-footer-row{height:36px}tr:hover{background:whitesmoke}tr.mat-mdc-header-row{height:48px}[mat-header-cell]{color:#0000008a;font-size:12px;font-weight:500}tr{cursor:pointer}.active .mat-mdc-cell{color:var(--color-primary)}\n"], dependencies: [{ kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i1$b.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i1$b.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i1$b.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i1$b.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i1$b.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i1$b.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i1$b.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i1$b.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i1$b.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i1$b.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i2$4.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i2$4.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: TableVirtualScrollModule }, { kind: "directive", type: i3$3.TableItemSizeDirective, selector: "cdk-virtual-scroll-viewport[tvsItemSize]", inputs: ["tvsItemSize", "headerEnabled", "headerHeight", "footerEnabled", "footerHeight", "bufferMultiplier"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "component", type: i4$1.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TableComponent, decorators: [{
             type: Component,
@@ -34040,12 +34169,12 @@ class MdViewEffects {
             }));
         })))));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MdViewEffects, deps: [{ token: i1$9.Actions }, { token: RecordsRepositoryInterface }, { token: PlatformServiceInterface }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MdViewEffects, deps: [{ token: i1$a.Actions }, { token: RecordsRepositoryInterface }, { token: PlatformServiceInterface }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MdViewEffects }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MdViewEffects, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i1$9.Actions }, { type: RecordsRepositoryInterface }, { type: PlatformServiceInterface }]; } });
+        }], ctorParameters: function () { return [{ type: i1$a.Actions }, { type: RecordsRepositoryInterface }, { type: PlatformServiceInterface }]; } });
 
 marker('externalviewer.dataset.unnamed');
 class ExternalViewerButtonComponent {
@@ -34873,7 +35002,7 @@ class DataViewShareComponent {
         this.wcEmbedderBaseUrl = wcEmbedderBaseUrl;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataViewShareComponent, deps: [{ token: WEB_COMPONENT_EMBEDDER_URL, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DataViewShareComponent, selector: "gn-ui-data-view-share", inputs: { viewType: "viewType" }, ngImport: i0, template: "<div class=\"container-lg px-5 my-1 lg:mx-auto\">\n  <mat-tab-group\n    [selectedIndex]=\"0\"\n    animationDuration=\"0ms\"\n    mat-stretch-tabs=\"false\"\n    mat-align-tabs=\"start\"\n    [disableRipple]=\"!wcEmbedderBaseUrl\"\n  >\n    <mat-tab *ngIf=\"wcEmbedderBaseUrl\">\n      <ng-template mat-tab-label>\n        <span class=\"tab-header-label-gray\" translate>share.tab.permalink</span>\n      </ng-template>\n      <gn-ui-data-view-permalink\n        [viewType]=\"viewType\"\n      ></gn-ui-data-view-permalink>\n    </mat-tab>\n    <mat-tab>\n      <ng-template mat-tab-label>\n        <span\n          [class]=\"\n            wcEmbedderBaseUrl\n              ? 'tab-header-label-gray'\n              : 'single-tab-header-label-gray'\n          \"\n          translate\n          >share.tab.webComponent</span\n        >\n      </ng-template>\n      <gn-ui-data-view-web-component\n        [viewType]=\"viewType\"\n      ></gn-ui-data-view-web-component>\n    </mat-tab>\n  </mat-tab-group>\n</div>\n", styles: ["::ng-deep .mat-mdc-tab.mdc-tab.mdc-tab--active .tab-header-label-gray{opacity:100%;font-weight:700}.tab-header-label-gray{@apply text-sm text-gray-700 opacity-75 hover:text-gray-900;}.single-tab-header-label-gray{@apply text-sm text-gray-900;}\n"], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$4.MatTabLabel, selector: "[mat-tab-label], [matTabLabel]" }, { kind: "component", type: i2$4.MatTab, selector: "mat-tab", inputs: ["disabled"], exportAs: ["matTab"] }, { kind: "component", type: i2$4.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple", "fitInkBarToContent", "mat-stretch-tabs"], exportAs: ["matTabGroup"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: DataViewPermalinkComponent, selector: "gn-ui-data-view-permalink", inputs: ["viewType"] }, { kind: "component", type: DataViewWebComponentComponent, selector: "gn-ui-data-view-web-component", inputs: ["viewType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DataViewShareComponent, selector: "gn-ui-data-view-share", inputs: { viewType: "viewType" }, ngImport: i0, template: "<div class=\"container-lg px-5 my-1 lg:mx-auto\">\n  <mat-tab-group\n    [selectedIndex]=\"0\"\n    animationDuration=\"0ms\"\n    mat-stretch-tabs=\"false\"\n    mat-align-tabs=\"start\"\n    [disableRipple]=\"!wcEmbedderBaseUrl\"\n  >\n    <mat-tab *ngIf=\"wcEmbedderBaseUrl\">\n      <ng-template mat-tab-label>\n        <span class=\"tab-header-label-gray\" translate>share.tab.permalink</span>\n      </ng-template>\n      <gn-ui-data-view-permalink\n        [viewType]=\"viewType\"\n      ></gn-ui-data-view-permalink>\n    </mat-tab>\n    <mat-tab>\n      <ng-template mat-tab-label>\n        <span\n          [class]=\"\n            wcEmbedderBaseUrl\n              ? 'tab-header-label-gray'\n              : 'single-tab-header-label-gray'\n          \"\n          translate\n          >share.tab.webComponent</span\n        >\n      </ng-template>\n      <gn-ui-data-view-web-component\n        [viewType]=\"viewType\"\n      ></gn-ui-data-view-web-component>\n    </mat-tab>\n  </mat-tab-group>\n</div>\n", styles: ["::ng-deep .mat-mdc-tab.mdc-tab.mdc-tab--active .tab-header-label-gray{opacity:100%;font-weight:700}.tab-header-label-gray{@apply text-sm text-gray-700 opacity-75 hover:text-gray-900;}.single-tab-header-label-gray{@apply text-sm text-gray-900;}\n"], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.MatTabLabel, selector: "[mat-tab-label], [matTabLabel]" }, { kind: "component", type: i2$3.MatTab, selector: "mat-tab", inputs: ["disabled"], exportAs: ["matTab"] }, { kind: "component", type: i2$3.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple", "fitInkBarToContent", "mat-stretch-tabs"], exportAs: ["matTabGroup"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: DataViewPermalinkComponent, selector: "gn-ui-data-view-permalink", inputs: ["viewType"] }, { kind: "component", type: DataViewWebComponentComponent, selector: "gn-ui-data-view-web-component", inputs: ["viewType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataViewShareComponent, decorators: [{
             type: Component,
@@ -34894,7 +35023,7 @@ class FeatureRecordModule {
             ExternalViewerButtonComponent,
             DataViewPermalinkComponent,
             DataViewWebComponentComponent,
-            DataViewShareComponent], imports: [CommonModule, i1$2.StoreFeatureModule, i1$9.EffectsFeatureModule, UiLayoutModule,
+            DataViewShareComponent], imports: [CommonModule, i1$2.StoreFeatureModule, i1$a.EffectsFeatureModule, UiLayoutModule,
             FeatureMapModule,
             FeatureCatalogModule,
             UiMapModule,
@@ -34975,6 +35104,7 @@ const saveRecord = createAction('[Editor] Save record');
 const saveRecordSuccess = createAction('[Editor] Save record success');
 const saveRecordFailure = createAction('[Editor] Save record failure', props());
 const draftSaveSuccess = createAction('[Editor] Draft save success');
+const undoRecordDraft = createAction('[Editor] Undo record draft');
 const setCurrentPage = createAction('[Editor] Set current page', props());
 
 /**
@@ -35056,6 +35186,12 @@ const RECORD_GRAPHICAL_OVERVIEW_FIELD = {
         labelKey: marker('editor.record.form.field.overviews'),
     },
 };
+const RECORD_SPATIAL_EXTENTS_FIELD = {
+    model: 'spatialExtents',
+    formFieldConfig: {
+        labelKey: marker('editor.record.form.field.spatialExtents'),
+    },
+};
 /************************************************************
  ***************          SECTIONS          *****************
  ************************************************************
@@ -35083,7 +35219,7 @@ const ABOUT_SECTION = {
 const GEOGRAPHICAL_COVERAGE_SECTION = {
     labelKey: marker('editor.record.form.section.geographicalCoverage.label'),
     hidden: false,
-    fields: [],
+    fields: [RECORD_SPATIAL_EXTENTS_FIELD],
 };
 const ASSOCIATED_RESOURCES_SECTION = {
     labelKey: marker('editor.record.form.section.associatedResources.label'),
@@ -35248,6 +35384,9 @@ class EditorFacade {
     saveRecord() {
         this.store.dispatch(saveRecord());
     }
+    undoRecordDraft() {
+        this.store.dispatch(undoRecordDraft());
+    }
     updateRecordField(field, value) {
         this.store.dispatch(updateRecordField({ field, value }));
     }
@@ -35308,6 +35447,10 @@ class EditorService {
             .saveRecordAsDraft(record)
             .pipe(map$1(() => undefined));
     }
+    undoRecordDraft(record) {
+        this.recordsRepository.clearRecordDraft(record.uniqueIdentifier);
+        return this.recordsRepository.openRecordForEdition(record.uniqueIdentifier);
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EditorService, deps: [{ token: RecordsRepositoryInterface }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EditorService, providedIn: 'root' }); }
 }
@@ -35335,6 +35478,11 @@ class EditorEffects {
         })))))));
         this.markAsChanged$ = createEffect(() => this.actions$.pipe(ofType(updateRecordField), map$1(() => markRecordAsChanged())));
         this.saveRecordDraft$ = createEffect(() => this.actions$.pipe(ofType(updateRecordField), debounceTime$1(1000), withLatestFrom$1(this.store.select(selectRecord)), switchMap$1(([, record]) => this.editorService.saveRecordAsDraft(record)), map$1(() => draftSaveSuccess())));
+        this.undoRecordDraft$ = createEffect(() => this.actions$.pipe(ofType(undoRecordDraft), withLatestFrom$1(this.store.select(selectRecord)), switchMap$1(([, record]) => this.editorService.undoRecordDraft(record)), map$1(([record, recordSource, alreadySavedOnce]) => openRecord({
+            record,
+            alreadySavedOnce,
+            recordSource,
+        }))));
         this.checkHasChangesOnOpen$ = createEffect(() => this.actions$.pipe(ofType(openRecord), map$1(({ record }) => this.recordsRepository.recordHasDraft(record.uniqueIdentifier)), filter$1((hasDraft) => hasDraft), map$1(() => markRecordAsChanged())));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EditorEffects, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
@@ -35565,7 +35713,7 @@ class WizardFieldComponent {
                 deps: [MAT_DATE_LOCALE, MAT_MOMENT_DATE_ADAPTER_OPTIONS],
             },
             { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS },
-        ], viewQueries: [{ propertyName: "searchText", first: true, predicate: ["searchText"], descendants: true }, { propertyName: "chips", first: true, predicate: ["chips"], descendants: true }, { propertyName: "textArea", first: true, predicate: ["textArea"], descendants: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }], ngImport: i0, template: "<div class=\"flex flex-1\">\n  <span [class]=\"wizardFieldConfig.icon + ' pr-10'\"></span>\n  <div class=\"flex flex-col flex-1\">\n    <div translate class=\"text-xl font-bold pb-1\">\n      {{ wizardFieldConfig.label }}\n    </div>\n    <div\n      class=\"w-1/2 h-12\"\n      *ngIf=\"wizardFieldType.TEXT === wizardFieldConfig.type\"\n    >\n      <gn-ui-text-input\n        #searchText\n        [id]=\"wizardFieldConfig.id\"\n        [value]=\"wizardFieldData\"\n        [required]=\"wizardFieldConfig.required || false\"\n        placeholder=\"\"\n      ></gn-ui-text-input>\n    </div>\n    <div\n      class=\"flex-1 w-11/12\"\n      *ngIf=\"wizardFieldType.CHIPS === wizardFieldConfig.type\"\n    >\n      <gn-ui-chips-input\n        #chips\n        [selectedItems]=\"wizardFieldData\"\n        placeholder=\"\"\n        [id]=\"wizardFieldConfig.id\"\n        [url]=\"wizardFieldConfig.options.url\"\n        [loadOnce]=\"wizardFieldConfig.options.loadOnce\"\n      ></gn-ui-chips-input>\n    </div>\n    <div\n      class=\"h-32 w-11/12\"\n      *ngIf=\"wizardFieldType.TEXT_AREA === wizardFieldConfig.type\"\n    >\n      <gn-ui-text-area\n        #textArea\n        [id]=\"wizardFieldConfig.id\"\n        [value]=\"wizardFieldData\"\n        [required]=\"wizardFieldConfig.required || false\"\n        placeholder=\"\"\n      ></gn-ui-text-area>\n    </div>\n    <div\n      class=\"w-1/2 h-12\"\n      *ngIf=\"wizardFieldType.DATA_PICKER === wizardFieldConfig.type\"\n    >\n      <input\n        [id]=\"wizardFieldConfig.id\"\n        type=\"text\"\n        (click)=\"datepicker.open()\"\n        class=\"rounded p-2 text-gray-700 w-full leading-tight focus:outline-none focus:border-primary\"\n        [value]=\"wizardFieldData\"\n        [matDatepicker]=\"datepicker\"\n        (dateChange)=\"onDateChange($event)\"\n      />\n      <mat-datepicker #datepicker></mat-datepicker>\n    </div>\n    <div\n      class=\"w-1/2 h-12\"\n      *ngIf=\"wizardFieldType.DROPDOWN === wizardFieldConfig.type\"\n    >\n      <gn-ui-dropdown-selector\n        #dropdown\n        [id]=\"wizardFieldConfig.id\"\n        [title]=\"''\"\n        [extraBtnClass]=\"'secondary min-w-full'\"\n        [showTitle]=\"false\"\n        [choices]=\"dropdownChoices\"\n        [selected]=\"wizardFieldData\"\n        ariaName=\"search-sort-by\"\n      ></gn-ui-dropdown-selector>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:flex;flex:1}gn-ui-text-input::ng-deep input,input[type=text]{height:100%;background:white;color:#000;font-style:italic;border-width:2px;border-color:var(--color-primary)}gn-ui-text-area::ng-deep textarea{border-width:2px;border-color:var(--color-primary)}gn-ui-dropdown-selector::ng-deep div{height:100%}gn-ui-dropdown-selector::ng-deep select{height:100%;border-width:2px;border-color:var(--color-primary);background-color:#fff}\n"], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DropdownSelectorComponent, selector: "gn-ui-dropdown-selector", inputs: ["title", "showTitle", "ariaName", "choices", "selected", "maxRows", "extraBtnClass", "minWidth", "disabled"], outputs: ["selectValue"] }, { kind: "component", type: TextAreaComponent, selector: "gn-ui-text-area", inputs: ["value", "disabled", "extraClass", "placeholder", "required"], outputs: ["valueChange"] }, { kind: "component", type: ChipsInputComponent, selector: "gn-ui-chips-input", inputs: ["url", "placeholder", "selectedItems", "required", "loadOnce", "autocompleteItems"], outputs: ["itemsChange"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: i2$3.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i2$3.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: TextInputComponent, selector: "gn-ui-text-input", inputs: ["value", "extraClass", "placeholder", "required", "disabled"], outputs: ["valueChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "searchText", first: true, predicate: ["searchText"], descendants: true }, { propertyName: "chips", first: true, predicate: ["chips"], descendants: true }, { propertyName: "textArea", first: true, predicate: ["textArea"], descendants: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }], ngImport: i0, template: "<div class=\"flex flex-1\">\n  <span [class]=\"wizardFieldConfig.icon + ' pr-10'\"></span>\n  <div class=\"flex flex-col flex-1\">\n    <div translate class=\"text-xl font-bold pb-1\">\n      {{ wizardFieldConfig.label }}\n    </div>\n    <div\n      class=\"w-1/2 h-12\"\n      *ngIf=\"wizardFieldType.TEXT === wizardFieldConfig.type\"\n    >\n      <gn-ui-text-input\n        #searchText\n        [id]=\"wizardFieldConfig.id\"\n        [value]=\"wizardFieldData\"\n        [required]=\"wizardFieldConfig.required || false\"\n        placeholder=\"\"\n      ></gn-ui-text-input>\n    </div>\n    <div\n      class=\"flex-1 w-11/12\"\n      *ngIf=\"wizardFieldType.CHIPS === wizardFieldConfig.type\"\n    >\n      <gn-ui-chips-input\n        #chips\n        [selectedItems]=\"wizardFieldData\"\n        placeholder=\"\"\n        [id]=\"wizardFieldConfig.id\"\n        [url]=\"wizardFieldConfig.options.url\"\n        [loadOnce]=\"wizardFieldConfig.options.loadOnce\"\n      ></gn-ui-chips-input>\n    </div>\n    <div\n      class=\"h-32 w-11/12\"\n      *ngIf=\"wizardFieldType.TEXT_AREA === wizardFieldConfig.type\"\n    >\n      <gn-ui-text-area\n        #textArea\n        [id]=\"wizardFieldConfig.id\"\n        [value]=\"wizardFieldData\"\n        [required]=\"wizardFieldConfig.required || false\"\n        placeholder=\"\"\n      ></gn-ui-text-area>\n    </div>\n    <div\n      class=\"w-1/2 h-12\"\n      *ngIf=\"wizardFieldType.DATA_PICKER === wizardFieldConfig.type\"\n    >\n      <input\n        [id]=\"wizardFieldConfig.id\"\n        type=\"text\"\n        (click)=\"datepicker.open()\"\n        class=\"rounded p-2 text-gray-700 w-full leading-tight focus:outline-none focus:border-primary\"\n        [value]=\"wizardFieldData\"\n        [matDatepicker]=\"datepicker\"\n        (dateChange)=\"onDateChange($event)\"\n      />\n      <mat-datepicker #datepicker></mat-datepicker>\n    </div>\n    <div\n      class=\"w-1/2 h-12\"\n      *ngIf=\"wizardFieldType.DROPDOWN === wizardFieldConfig.type\"\n    >\n      <gn-ui-dropdown-selector\n        #dropdown\n        [id]=\"wizardFieldConfig.id\"\n        [title]=\"''\"\n        [extraBtnClass]=\"'secondary min-w-full'\"\n        [showTitle]=\"false\"\n        [choices]=\"dropdownChoices\"\n        [selected]=\"wizardFieldData\"\n        ariaName=\"search-sort-by\"\n      ></gn-ui-dropdown-selector>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:flex;flex:1}gn-ui-text-input::ng-deep input,input[type=text]{height:100%;background:white;color:#000;font-style:italic;border-width:2px;border-color:var(--color-primary)}gn-ui-text-area::ng-deep textarea{border-width:2px;border-color:var(--color-primary)}gn-ui-dropdown-selector::ng-deep div{height:100%}gn-ui-dropdown-selector::ng-deep select{height:100%;border-width:2px;border-color:var(--color-primary);background-color:#fff}\n"], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DropdownSelectorComponent, selector: "gn-ui-dropdown-selector", inputs: ["title", "showTitle", "ariaName", "choices", "selected", "maxRows", "extraBtnClass", "minWidth", "disabled"], outputs: ["selectValue"] }, { kind: "component", type: TextAreaComponent, selector: "gn-ui-text-area", inputs: ["value", "disabled", "extraClass", "placeholder", "required"], outputs: ["valueChange"] }, { kind: "component", type: ChipsInputComponent, selector: "gn-ui-chips-input", inputs: ["url", "placeholder", "selectedItems", "required", "loadOnce", "autocompleteItems"], outputs: ["itemsChange"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: i2$2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i2$2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: TextInputComponent, selector: "gn-ui-text-input", inputs: ["value", "extraClass", "placeholder", "required", "disabled"], outputs: ["valueChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: WizardFieldComponent, decorators: [{
             type: Component,
@@ -35715,7 +35863,7 @@ class FeatureEditorModule {
             MatNativeDateModule,
             MatFormFieldModule,
             HttpClientModule,
-            HttpClientXsrfModule, i1$2.StoreFeatureModule, i1$9.EffectsFeatureModule, TextInputComponent], exports: [WizardComponent, WizardSummarizeComponent] }); }
+            HttpClientXsrfModule, i1$2.StoreFeatureModule, i1$a.EffectsFeatureModule, TextInputComponent], exports: [WizardComponent, WizardSummarizeComponent] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FeatureEditorModule, providers: [EditorFacade, Gn4PlatformService], imports: [CommonModule,
             UiInputsModule,
             UiWidgetsModule,
@@ -35756,16 +35904,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 }]
         }] });
 
-class FormFieldKeywordsComponent {
+class GenericKeywordsComponent {
     constructor(platformService) {
         this.platformService = platformService;
+        this.changedKeywords = new EventEmitter();
+        this.addedKeyword = new EventEmitter();
+        this.deletedKeyword = new EventEmitter();
         this.displayWithFn = (item) => {
             return `${item.title} (${item.value.thesaurus?.name})`;
         };
         this.autoCompleteAction = (query) => {
-            return this.platformService
-                .searchKeywords(query, ['temporal', 'theme', 'other'])
-                .pipe(map$2((keywords) => keywords.map((keyword) => {
+            return this.platformService.searchKeywords(query, this.keywordTypes).pipe(map$2((keywords) => keywords.map((keyword) => {
                 return { title: keyword.label, value: keyword };
             })));
         };
@@ -35774,22 +35923,62 @@ class FormFieldKeywordsComponent {
         this.addKeyword(item.value);
     }
     addKeyword(keyword) {
-        const addedKeywords = [...this.control.value, keyword];
-        // remove duplicates from keyword
-        const filteredKeywords = addedKeywords.filter((value, index, self) => {
-            return (index ===
-                self.findIndex((t) => t?.label === value?.label &&
-                    t?.thesaurus?.id === value?.thesaurus?.id &&
-                    t?.type === value?.type));
-        });
-        this.control.setValue(filteredKeywords);
+        const duplicatedKeyword = this.keywords.find((k) => k.label === keyword.label);
+        if (!duplicatedKeyword) {
+            this.keywords = [...this.keywords, keyword];
+            this.changedKeywords.emit(this.keywords);
+            this.addedKeyword.emit(keyword);
+        }
     }
-    removeKeyword(index) {
-        const removeKeywords = this.control.value.filter((_, i) => i !== index);
-        this.control.setValue(removeKeywords);
+    removeKeyword(keyword) {
+        this.keywords = this.keywords.filter((k) => k.label !== keyword.label);
+        this.changedKeywords.emit(this.keywords);
+        this.deletedKeyword.emit(keyword);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldKeywordsComponent, deps: [{ token: PlatformServiceInterface }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldKeywordsComponent, isStandalone: true, selector: "gn-ui-form-field-keywords", inputs: { control: "control" }, ngImport: i0, template: "<div class=\"flex flex-col gap-3\">\n  <gn-ui-autocomplete\n    [placeholder]=\"'Search for keywords in all thesaurus'\"\n    [displayWithFn]=\"displayWithFn\"\n    [action]=\"autoCompleteAction\"\n    (itemSelected)=\"handleItemSelection($event)\"\n    [preventCompleteOnSelection]=\"true\"\n    [minCharacterCount]=\"0\"\n    [allowSubmit]=\"false\"\n  ></gn-ui-autocomplete>\n  <div class=\"flex gap-2 flex-wrap\">\n    <gn-ui-badge\n      *ngFor=\"let keyword of control.value; let index = index\"\n      [removable]=\"true\"\n      (badgeRemoveClicked)=\"removeKeyword(index)\"\n      >{{ keyword.label }}</gn-ui-badge\n    >\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: UiInputsModule }, { kind: "component", type: BadgeComponent, selector: "gn-ui-badge", inputs: ["clickable", "removable"], outputs: ["badgeRemoveClicked"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: UiWidgetsModule }, { kind: "component", type: AutocompleteComponent, selector: "gn-ui-autocomplete", inputs: ["placeholder", "action", "value", "clearOnSelection", "preventCompleteOnSelection", "autoFocus", "minCharacterCount", "allowSubmit", "displayWithFn"], outputs: ["itemSelected", "inputSubmitted", "inputCleared"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    isPlaceWithoutExtent(keyword) {
+        if (keyword.type !== 'place')
+            return false;
+        return !keyword.bbox;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GenericKeywordsComponent, deps: [{ token: PlatformServiceInterface }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GenericKeywordsComponent, isStandalone: true, selector: "gn-ui-generic-keywords", inputs: { keywords: "keywords", keywordTypes: "keywordTypes", placeholder: "placeholder" }, outputs: { changedKeywords: "changedKeywords", addedKeyword: "addedKeyword", deletedKeyword: "deletedKeyword" }, ngImport: i0, template: "<div class=\"flex flex-col gap-3\">\n  <gn-ui-autocomplete\n    [placeholder]=\"placeholder\"\n    [displayWithFn]=\"displayWithFn\"\n    [action]=\"autoCompleteAction\"\n    (itemSelected)=\"handleItemSelection($event)\"\n    [preventCompleteOnSelection]=\"true\"\n    [minCharacterCount]=\"0\"\n    [allowSubmit]=\"false\"\n  ></gn-ui-autocomplete>\n  <div class=\"flex gap-2 flex-wrap\">\n    <gn-ui-badge\n      *ngFor=\"let keyword of keywords\"\n      [removable]=\"true\"\n      (badgeRemoveClicked)=\"removeKeyword(keyword)\"\n      >{{ keyword.label }}\n\n      <mat-icon\n        *ngIf=\"isPlaceWithoutExtent(keyword)\"\n        [title]=\"'editor.form.placeKeywordWithoutExtent' | translate\"\n        class=\"material-symbols-outlined\"\n        >warning</mat-icon\n      >\n    </gn-ui-badge>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: UiInputsModule }, { kind: "component", type: BadgeComponent, selector: "gn-ui-badge", inputs: ["clickable", "removable"], outputs: ["badgeRemoveClicked"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: UiWidgetsModule }, { kind: "component", type: AutocompleteComponent, selector: "gn-ui-autocomplete", inputs: ["placeholder", "action", "value", "clearOnSelection", "preventCompleteOnSelection", "autoFocus", "minCharacterCount", "allowSubmit", "displayWithFn"], outputs: ["itemSelected", "inputSubmitted", "inputCleared"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GenericKeywordsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'gn-ui-generic-keywords', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
+                        DropdownSelectorComponent,
+                        UiInputsModule,
+                        CommonModule,
+                        UiWidgetsModule,
+                        AutocompleteComponent,
+                        MatIconModule,
+                        TranslateModule,
+                    ], template: "<div class=\"flex flex-col gap-3\">\n  <gn-ui-autocomplete\n    [placeholder]=\"placeholder\"\n    [displayWithFn]=\"displayWithFn\"\n    [action]=\"autoCompleteAction\"\n    (itemSelected)=\"handleItemSelection($event)\"\n    [preventCompleteOnSelection]=\"true\"\n    [minCharacterCount]=\"0\"\n    [allowSubmit]=\"false\"\n  ></gn-ui-autocomplete>\n  <div class=\"flex gap-2 flex-wrap\">\n    <gn-ui-badge\n      *ngFor=\"let keyword of keywords\"\n      [removable]=\"true\"\n      (badgeRemoveClicked)=\"removeKeyword(keyword)\"\n      >{{ keyword.label }}\n\n      <mat-icon\n        *ngIf=\"isPlaceWithoutExtent(keyword)\"\n        [title]=\"'editor.form.placeKeywordWithoutExtent' | translate\"\n        class=\"material-symbols-outlined\"\n        >warning</mat-icon\n      >\n    </gn-ui-badge>\n  </div>\n</div>\n" }]
+        }], ctorParameters: function () { return [{ type: PlatformServiceInterface }]; }, propDecorators: { keywords: [{
+                type: Input
+            }], keywordTypes: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], changedKeywords: [{
+                type: Output
+            }], addedKeyword: [{
+                type: Output
+            }], deletedKeyword: [{
+                type: Output
+            }] } });
+
+class FormFieldKeywordsComponent {
+    constructor() {
+        this.valueChange = new EventEmitter();
+        this.keywordTypes = ['temporal', 'theme', 'other'];
+        this.placeholder = 'editor.form.keywords.placeholder';
+    }
+    handleKeywordsChange(keywords) {
+        this.valueChange.emit(keywords);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldKeywordsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldKeywordsComponent, isStandalone: true, selector: "gn-ui-form-field-keywords", inputs: { value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"flex flex-col gap-3\">\n  <gn-ui-generic-keywords\n    [keywords]=\"value\"\n    [keywordTypes]=\"keywordTypes\"\n    [placeholder]=\"placeholder | translate\"\n    (changedKeywords)=\"handleKeywordsChange($event)\"\n  >\n  </gn-ui-generic-keywords>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: UiInputsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: UiWidgetsModule }, { kind: "component", type: GenericKeywordsComponent, selector: "gn-ui-generic-keywords", inputs: ["keywords", "keywordTypes", "placeholder"], outputs: ["changedKeywords", "addedKeyword", "deletedKeyword"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldKeywordsComponent, decorators: [{
             type: Component,
@@ -35799,13 +35988,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         CommonModule,
                         UiWidgetsModule,
                         AutocompleteComponent,
-                    ], template: "<div class=\"flex flex-col gap-3\">\n  <gn-ui-autocomplete\n    [placeholder]=\"'Search for keywords in all thesaurus'\"\n    [displayWithFn]=\"displayWithFn\"\n    [action]=\"autoCompleteAction\"\n    (itemSelected)=\"handleItemSelection($event)\"\n    [preventCompleteOnSelection]=\"true\"\n    [minCharacterCount]=\"0\"\n    [allowSubmit]=\"false\"\n  ></gn-ui-autocomplete>\n  <div class=\"flex gap-2 flex-wrap\">\n    <gn-ui-badge\n      *ngFor=\"let keyword of control.value; let index = index\"\n      [removable]=\"true\"\n      (badgeRemoveClicked)=\"removeKeyword(index)\"\n      >{{ keyword.label }}</gn-ui-badge\n    >\n  </div>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: PlatformServiceInterface }]; }, propDecorators: { control: [{
+                        GenericKeywordsComponent,
+                        TranslateModule,
+                    ], template: "<div class=\"flex flex-col gap-3\">\n  <gn-ui-generic-keywords\n    [keywords]=\"value\"\n    [keywordTypes]=\"keywordTypes\"\n    [placeholder]=\"placeholder | translate\"\n    (changedKeywords)=\"handleKeywordsChange($event)\"\n  >\n  </gn-ui-generic-keywords>\n</div>\n" }]
+        }], propDecorators: { value: [{
                 type: Input
+            }], valueChange: [{
+                type: Output
             }] } });
 
 class FormFieldLicenseComponent {
     constructor() {
+        this.valueChange = new EventEmitter();
         this.choices = [
             {
                 value: 'cc-by',
@@ -35846,32 +36040,39 @@ class FormFieldLicenseComponent {
         ];
     }
     get selected() {
-        return this.control.value[0]?.text;
+        return this.value[0]?.text;
     }
     onSelectValue(value) {
-        this.control.setValue([{ text: value }]);
+        this.valueChange.emit([{ text: value }]);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldLicenseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldLicenseComponent, isStandalone: true, selector: "gn-ui-form-field-license", inputs: { control: "control", label: "label" }, ngImport: i0, template: "<gn-ui-dropdown-selector\n  [title]=\"label\"\n  [showTitle]=\"false\"\n  [choices]=\"choices\"\n  [selected]=\"selected\"\n  (selectValue)=\"onSelectValue($event)\"\n>\n</gn-ui-dropdown-selector>\n", styles: [""], dependencies: [{ kind: "component", type: DropdownSelectorComponent, selector: "gn-ui-dropdown-selector", inputs: ["title", "showTitle", "ariaName", "choices", "selected", "maxRows", "extraBtnClass", "minWidth", "disabled"], outputs: ["selectValue"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldLicenseComponent, isStandalone: true, selector: "gn-ui-form-field-license", inputs: { label: "label", value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<gn-ui-dropdown-selector\n  [title]=\"label\"\n  [showTitle]=\"false\"\n  [choices]=\"choices\"\n  [selected]=\"selected\"\n  (selectValue)=\"onSelectValue($event)\"\n>\n</gn-ui-dropdown-selector>\n", styles: [""], dependencies: [{ kind: "component", type: DropdownSelectorComponent, selector: "gn-ui-dropdown-selector", inputs: ["title", "showTitle", "ariaName", "choices", "selected", "maxRows", "extraBtnClass", "minWidth", "disabled"], outputs: ["selectValue"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldLicenseComponent, decorators: [{
             type: Component,
             args: [{ selector: 'gn-ui-form-field-license', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [DropdownSelectorComponent], template: "<gn-ui-dropdown-selector\n  [title]=\"label\"\n  [showTitle]=\"false\"\n  [choices]=\"choices\"\n  [selected]=\"selected\"\n  (selectValue)=\"onSelectValue($event)\"\n>\n</gn-ui-dropdown-selector>\n" }]
-        }], propDecorators: { control: [{
+        }], propDecorators: { label: [{
                 type: Input
-            }], label: [{
+            }], value: [{
                 type: Input
+            }], valueChange: [{
+                type: Output
             }] } });
 
 class FormFieldResourceUpdatedComponent {
+    constructor() {
+        this.valueChange = new EventEmitter();
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldResourceUpdatedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldResourceUpdatedComponent, isStandalone: true, selector: "gn-ui-form-field-resource-updated", inputs: { control: "control" }, ngImport: i0, template: "<gn-ui-date-picker\n  [date]=\"control.value\"\n  (dateChange)=\"control.setValue($event)\"\n></gn-ui-date-picker>\n", styles: [""], dependencies: [{ kind: "component", type: DatePickerComponent, selector: "gn-ui-date-picker", inputs: ["date"], outputs: ["dateChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldResourceUpdatedComponent, isStandalone: true, selector: "gn-ui-form-field-resource-updated", inputs: { value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<gn-ui-date-picker\n  [date]=\"value\"\n  (dateChange)=\"valueChange.emit($event)\"\n></gn-ui-date-picker>\n", styles: [""], dependencies: [{ kind: "component", type: DatePickerComponent, selector: "gn-ui-date-picker", inputs: ["date"], outputs: ["dateChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldResourceUpdatedComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-form-field-resource-updated', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [DatePickerComponent], template: "<gn-ui-date-picker\n  [date]=\"control.value\"\n  (dateChange)=\"control.setValue($event)\"\n></gn-ui-date-picker>\n" }]
-        }], propDecorators: { control: [{
+            args: [{ selector: 'gn-ui-form-field-resource-updated', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [DatePickerComponent], template: "<gn-ui-date-picker\n  [date]=\"value\"\n  (dateChange)=\"valueChange.emit($event)\"\n></gn-ui-date-picker>\n" }]
+        }], propDecorators: { value: [{
                 type: Input
+            }], valueChange: [{
+                type: Output
             }] } });
 
 class FormFieldTemporalExtentsDateComponent {
@@ -35900,6 +36101,7 @@ class FormFieldTemporalExtentsComponent {
     constructor(translateService) {
         this.translateService = translateService;
         this.array = new FormArray([]);
+        this.elements = [];
         this.addOptions$ = combineLatest([
             this.translateService
                 .get('editor.record.form.temporalExtents.addDate')
@@ -35908,87 +36110,81 @@ class FormFieldTemporalExtentsComponent {
                 .get('editor.record.form.temporalExtents.addRange')
                 .pipe(map$2((buttonLabel) => ({ buttonLabel, eventName: 'range' }))),
         ]);
+        this.valueChange = this.array.valueChanges;
     }
-    ngOnInit() {
-        this.resetValueFromInput(this.control.value);
-        this.subscription = new Subscription();
-        this.subscription.add(this.control.valueChanges.subscribe((value) => {
-            this.resetValueFromInput(value);
-        }));
-        this.subscription.add(this.array.valueChanges.subscribe((value) => {
-            this.control.setValue(value);
-        }));
+    ngOnChanges() {
+        this.resetValueFromInput(this.value);
     }
     onElementsChange(elements) {
+        this.elements = elements;
         this.array.clear({ emitEvent: false });
-        elements.forEach((e, i) => this.array.push(e.inputs.control, {
+        this.elements.forEach((e, i) => this.array.push(e.inputs.control, {
             emitEvent: i === elements.length - 1,
         }));
     }
     onAdd(eventName) {
         switch (eventName) {
             case 'date': {
-                const dateControl = new FormControl({ start: new Date() });
-                this.array.push(dateControl);
+                const instant = { start: new Date() };
+                this.pushDate(instant, this.elements, true);
                 break;
             }
             case 'range': {
-                const rangeControl = new FormControl({
+                const range = {
                     start: new Date(),
                     end: new Date(),
-                });
-                this.array.push(rangeControl);
+                };
+                this.pushRange(range, this.elements, true);
                 break;
             }
         }
     }
-    ngOnDestroy() {
-        this.subscription.unsubscribe();
-    }
     resetValueFromInput(value) {
         this.array.clear({ emitEvent: false });
-        let newElements = [];
+        this.elements = [];
+        if (!value)
+            return;
+        const newElements = [];
         value.forEach((v) => {
             if ('start' in v && 'end' in v) {
-                const rangeControl = new FormControl({
-                    start: v.start,
-                    end: v.end,
-                });
-                this.array.push(rangeControl, { emitEvent: false });
-                newElements = [
-                    ...newElements,
-                    {
-                        component: FormFieldTemporalExtentsRangeComponent,
-                        inputs: {
-                            control: rangeControl,
-                        },
-                    },
-                ];
+                this.pushRange(v, newElements, false);
             }
             else {
-                const dateControl = new FormControl({ start: v.start });
-                this.array.push(dateControl, { emitEvent: false });
-                newElements = [
-                    ...newElements,
-                    {
-                        component: FormFieldTemporalExtentsDateComponent,
-                        inputs: {
-                            control: dateControl,
-                        },
-                    },
-                ];
+                this.pushDate(v, newElements, false);
             }
         });
         this.elements = newElements;
     }
+    pushDate(instant, elements, emitEvent) {
+        const dateControl = new FormControl(instant);
+        this.array.push(dateControl, { emitEvent });
+        elements.push({
+            component: FormFieldTemporalExtentsDateComponent,
+            inputs: {
+                control: dateControl,
+            },
+        });
+    }
+    pushRange(period, elements, emitEvent) {
+        const rangeControl = new FormControl(period);
+        this.array.push(rangeControl, { emitEvent });
+        elements.push({
+            component: FormFieldTemporalExtentsRangeComponent,
+            inputs: {
+                control: rangeControl,
+            },
+        });
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldTemporalExtentsComponent, deps: [{ token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldTemporalExtentsComponent, isStandalone: true, selector: "gn-ui-form-field-temporal-extents", inputs: { control: "control" }, ngImport: i0, template: "<gn-ui-sortable-list\n  [elements]=\"elements\"\n  (elementsChange)=\"onElementsChange($event)\"\n  [addOptions]=\"addOptions$ | async\"\n  (add)=\"onAdd($event)\"\n></gn-ui-sortable-list>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "component", type: SortableListComponent, selector: "gn-ui-sortable-list", inputs: ["elements", "addOptions"], outputs: ["elementsChange", "add"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldTemporalExtentsComponent, isStandalone: true, selector: "gn-ui-form-field-temporal-extents", inputs: { value: "value" }, outputs: { valueChange: "valueChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"flex gap-2 mb-2\">\n  <gn-ui-button\n    *ngFor=\"let addOption of addOptions$ | async\"\n    (buttonClick)=\"onAdd(addOption.eventName)\"\n  >\n    <span class=\"material-symbols-outlined gn-ui-icon-small\"> add </span>\n    &nbsp;{{ addOption.buttonLabel }}</gn-ui-button\n  >\n</div>\n<gn-ui-sortable-list\n  [elements]=\"elements\"\n  (elementsChange)=\"onElementsChange($event)\"\n></gn-ui-sortable-list>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: SortableListComponent, selector: "gn-ui-sortable-list", inputs: ["elements"], outputs: ["elementsChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldTemporalExtentsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-form-field-temporal-extents', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, SortableListComponent], template: "<gn-ui-sortable-list\n  [elements]=\"elements\"\n  (elementsChange)=\"onElementsChange($event)\"\n  [addOptions]=\"addOptions$ | async\"\n  (add)=\"onAdd($event)\"\n></gn-ui-sortable-list>\n" }]
-        }], ctorParameters: function () { return [{ type: i1$1.TranslateService }]; }, propDecorators: { control: [{
+            args: [{ selector: 'gn-ui-form-field-temporal-extents', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, ButtonComponent, SortableListComponent], template: "<div class=\"flex gap-2 mb-2\">\n  <gn-ui-button\n    *ngFor=\"let addOption of addOptions$ | async\"\n    (buttonClick)=\"onAdd(addOption.eventName)\"\n  >\n    <span class=\"material-symbols-outlined gn-ui-icon-small\"> add </span>\n    &nbsp;{{ addOption.buttonLabel }}</gn-ui-button\n  >\n</div>\n<gn-ui-sortable-list\n  [elements]=\"elements\"\n  (elementsChange)=\"onElementsChange($event)\"\n></gn-ui-sortable-list>\n" }]
+        }], ctorParameters: function () { return [{ type: i1$1.TranslateService }]; }, propDecorators: { value: [{
                 type: Input
+            }], valueChange: [{
+                type: Output
             }] } });
 
 class FormFieldSimpleComponent {
@@ -35996,6 +36192,7 @@ class FormFieldSimpleComponent {
         this.readonly = false;
         this.invalid = false;
         this.placeholder = '';
+        this.valueChange = new EventEmitter();
     }
     get inputType() {
         switch (this.type) {
@@ -36016,15 +36213,13 @@ class FormFieldSimpleComponent {
         return this.type === 'list';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldSimpleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldSimpleComponent, isStandalone: true, selector: "gn-ui-form-field-simple", inputs: { type: "type", control: "control", readonly: "readonly", invalid: "invalid", placeholder: "placeholder", options: "options" }, ngImport: i0, template: "<input\n  *ngIf=\"!isSelect\"\n  [type]=\"inputType\"\n  [readonly]=\"readonly\"\n  [formControl]=\"control\"\n  [placeholder]=\"placeholder\"\n  class=\"border rounded-md p-3 w-full bg-white transition-colors\"\n  [ngClass]=\"{\n    'border-pink-500': invalid,\n    'border-gray-200': !invalid,\n    'text-gray-600': readonly\n  }\"\n/>\n<select\n  *ngIf=\"isSelect\"\n  [formControl]=\"control\"\n  class=\"border rounded-md p-3 w-full bg-white transition-colors\"\n  [ngClass]=\"{\n    'border-pink-500': invalid,\n    'border-gray-200': !invalid,\n    'text-gray-600': readonly\n  }\"\n>\n  <option *ngFor=\"let option of options\" [ngValue]=\"option.value\">\n    {{ option.label }}\n  </option>\n</select>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldSimpleComponent, isStandalone: true, selector: "gn-ui-form-field-simple", inputs: { type: "type", readonly: "readonly", invalid: "invalid", placeholder: "placeholder", options: "options", value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<input\n  *ngIf=\"!isSelect\"\n  [type]=\"inputType\"\n  [readonly]=\"readonly\"\n  [placeholder]=\"placeholder\"\n  [value]=\"value\"\n  (valueChange)=\"valueChange.emit($event)\"\n  class=\"border rounded-md p-3 w-full bg-white transition-colors\"\n  [ngClass]=\"{\n    'border-pink-500': invalid,\n    'border-gray-200': !invalid,\n    'text-gray-600': readonly\n  }\"\n/>\n<select\n  *ngIf=\"isSelect\"\n  [value]=\"value\"\n  (valueChange)=\"valueChange.emit($event)\"\n  class=\"border rounded-md p-3 w-full bg-white transition-colors\"\n  [ngClass]=\"{\n    'border-pink-500': invalid,\n    'border-gray-200': !invalid,\n    'text-gray-600': readonly\n  }\"\n>\n  <option *ngFor=\"let option of options\" [value]=\"option.value\">\n    {{ option.label }}\n  </option>\n</select>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldSimpleComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-form-field-simple', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, ReactiveFormsModule], template: "<input\n  *ngIf=\"!isSelect\"\n  [type]=\"inputType\"\n  [readonly]=\"readonly\"\n  [formControl]=\"control\"\n  [placeholder]=\"placeholder\"\n  class=\"border rounded-md p-3 w-full bg-white transition-colors\"\n  [ngClass]=\"{\n    'border-pink-500': invalid,\n    'border-gray-200': !invalid,\n    'text-gray-600': readonly\n  }\"\n/>\n<select\n  *ngIf=\"isSelect\"\n  [formControl]=\"control\"\n  class=\"border rounded-md p-3 w-full bg-white transition-colors\"\n  [ngClass]=\"{\n    'border-pink-500': invalid,\n    'border-gray-200': !invalid,\n    'text-gray-600': readonly\n  }\"\n>\n  <option *ngFor=\"let option of options\" [ngValue]=\"option.value\">\n    {{ option.label }}\n  </option>\n</select>\n" }]
+            args: [{ selector: 'gn-ui-form-field-simple', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule], template: "<input\n  *ngIf=\"!isSelect\"\n  [type]=\"inputType\"\n  [readonly]=\"readonly\"\n  [placeholder]=\"placeholder\"\n  [value]=\"value\"\n  (valueChange)=\"valueChange.emit($event)\"\n  class=\"border rounded-md p-3 w-full bg-white transition-colors\"\n  [ngClass]=\"{\n    'border-pink-500': invalid,\n    'border-gray-200': !invalid,\n    'text-gray-600': readonly\n  }\"\n/>\n<select\n  *ngIf=\"isSelect\"\n  [value]=\"value\"\n  (valueChange)=\"valueChange.emit($event)\"\n  class=\"border rounded-md p-3 w-full bg-white transition-colors\"\n  [ngClass]=\"{\n    'border-pink-500': invalid,\n    'border-gray-200': !invalid,\n    'text-gray-600': readonly\n  }\"\n>\n  <option *ngFor=\"let option of options\" [value]=\"option.value\">\n    {{ option.label }}\n  </option>\n</select>\n" }]
         }], propDecorators: { type: [{
                 type: Input
-            }], control: [{
-                type: Input
             }], readonly: [{
                 type: Input
             }], invalid: [{
@@ -36033,6 +36228,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }], options: [{
                 type: Input
+            }], value: [{
+                type: Input
+            }], valueChange: [{
+                type: Output
             }] } });
 
 class FormFieldFileComponent {
@@ -36042,7 +36241,7 @@ class FormFieldFileComponent {
         this.placeholder = '';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldFileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldFileComponent, isStandalone: true, selector: "gn-ui-form-field-file", inputs: { control: "control", readonly: "readonly", invalid: "invalid", placeholder: "placeholder" }, ngImport: i0, template: "<input\n  type=\"file\"\n  [readonly]=\"readonly\"\n  [formControl]=\"control\"\n  [placeholder]=\"placeholder\"\n  class=\"border rounded-md p-3 w-full bg-white transition-colors\"\n  [ngClass]=\"{\n    'border-pink-500': invalid,\n    'border-gray-200': !invalid,\n    'text-gray-600': readonly\n  }\"\n/>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldFileComponent, isStandalone: true, selector: "gn-ui-form-field-file", inputs: { control: "control", readonly: "readonly", invalid: "invalid", placeholder: "placeholder" }, ngImport: i0, template: "<input\n  type=\"file\"\n  [readonly]=\"readonly\"\n  [formControl]=\"control\"\n  [placeholder]=\"placeholder\"\n  class=\"border rounded-md p-3 w-full bg-white transition-colors\"\n  [ngClass]=\"{\n    'border-pink-500': invalid,\n    'border-gray-200': !invalid,\n    'text-gray-600': readonly\n  }\"\n/>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldFileComponent, decorators: [{
             type: Component,
@@ -36060,6 +36259,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
 class FormFieldRichComponent {
     constructor() {
         this.placeholder = 'Votre texte ici'; //TODO: translate
+        this.valueChange = new EventEmitter();
         this.preview = false;
     }
     getButtonExtraClass() {
@@ -36068,11 +36268,8 @@ class FormFieldRichComponent {
     togglePreview() {
         this.preview = !this.preview;
     }
-    handleTextContentChanged(textContent) {
-        this.control.setValue(textContent);
-    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldRichComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldRichComponent, isStandalone: true, selector: "gn-ui-form-field-rich", inputs: { control: "control", label: "label", hint: "hint", helperText: "helperText", placeholder: "placeholder" }, ngImport: i0, template: "<gn-ui-form-field-wrapper [label]=\"label\" [hint]=\"hint\">\n  <gn-ui-button\n    form-field-interaction\n    [extraClass]=\"getButtonExtraClass()\"\n    (buttonClick)=\"togglePreview()\"\n  >\n    <span class=\"material-symbols-outlined mr-1 gn-ui-icon-small\">{{\n      preview ? 'visibility' : 'visibility_off'\n    }}</span>\n    {{ preview ? 'WYSIWYG' : 'Markdown' }}\n  </gn-ui-button>\n  <gn-ui-markdown-editor\n    class=\"h-full\"\n    [preview]=\"preview\"\n    [helperText]=\"helperText\"\n    [placeholder]=\"placeholder\"\n    [textContent]=\"control.value\"\n    (textContentChanged)=\"handleTextContentChanged($event)\"\n  ></gn-ui-markdown-editor>\n</gn-ui-form-field-wrapper>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: MarkdownEditorComponent, selector: "gn-ui-markdown-editor", inputs: ["preview", "helperText", "placeholder", "textContent"], outputs: ["textContentChanged"] }, { kind: "component", type: FormFieldWrapperComponent, selector: "gn-ui-form-field-wrapper", inputs: ["label", "hint"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldRichComponent, isStandalone: true, selector: "gn-ui-form-field-rich", inputs: { label: "label", hint: "hint", helperText: "helperText", placeholder: "placeholder", value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<gn-ui-form-field-wrapper [label]=\"label\" [hint]=\"hint\">\n  <gn-ui-button\n    form-field-interaction\n    [extraClass]=\"getButtonExtraClass()\"\n    (buttonClick)=\"togglePreview()\"\n  >\n    <span class=\"material-symbols-outlined mr-1 gn-ui-icon-small\">{{\n      preview ? 'visibility' : 'visibility_off'\n    }}</span>\n    {{ preview ? 'WYSIWYG' : 'Markdown' }}\n  </gn-ui-button>\n  <gn-ui-markdown-editor\n    class=\"h-full\"\n    [preview]=\"preview\"\n    [helperText]=\"helperText\"\n    [placeholder]=\"placeholder\"\n    [textContent]=\"value\"\n    (textContentChanged)=\"valueChange.emit($event)\"\n  ></gn-ui-markdown-editor>\n</gn-ui-form-field-wrapper>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: MarkdownEditorComponent, selector: "gn-ui-markdown-editor", inputs: ["preview", "helperText", "placeholder", "textContent"], outputs: ["textContentChanged"] }, { kind: "component", type: FormFieldWrapperComponent, selector: "gn-ui-form-field-wrapper", inputs: ["label", "hint"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldRichComponent, decorators: [{
             type: Component,
@@ -36082,10 +36279,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         MarkdownEditorComponent,
                         FormFieldWrapperComponent,
                         ButtonComponent,
-                    ], template: "<gn-ui-form-field-wrapper [label]=\"label\" [hint]=\"hint\">\n  <gn-ui-button\n    form-field-interaction\n    [extraClass]=\"getButtonExtraClass()\"\n    (buttonClick)=\"togglePreview()\"\n  >\n    <span class=\"material-symbols-outlined mr-1 gn-ui-icon-small\">{{\n      preview ? 'visibility' : 'visibility_off'\n    }}</span>\n    {{ preview ? 'WYSIWYG' : 'Markdown' }}\n  </gn-ui-button>\n  <gn-ui-markdown-editor\n    class=\"h-full\"\n    [preview]=\"preview\"\n    [helperText]=\"helperText\"\n    [placeholder]=\"placeholder\"\n    [textContent]=\"control.value\"\n    (textContentChanged)=\"handleTextContentChanged($event)\"\n  ></gn-ui-markdown-editor>\n</gn-ui-form-field-wrapper>\n" }]
-        }], propDecorators: { control: [{
-                type: Input
-            }], label: [{
+                    ], template: "<gn-ui-form-field-wrapper [label]=\"label\" [hint]=\"hint\">\n  <gn-ui-button\n    form-field-interaction\n    [extraClass]=\"getButtonExtraClass()\"\n    (buttonClick)=\"togglePreview()\"\n  >\n    <span class=\"material-symbols-outlined mr-1 gn-ui-icon-small\">{{\n      preview ? 'visibility' : 'visibility_off'\n    }}</span>\n    {{ preview ? 'WYSIWYG' : 'Markdown' }}\n  </gn-ui-button>\n  <gn-ui-markdown-editor\n    class=\"h-full\"\n    [preview]=\"preview\"\n    [helperText]=\"helperText\"\n    [placeholder]=\"placeholder\"\n    [textContent]=\"value\"\n    (textContentChanged)=\"valueChange.emit($event)\"\n  ></gn-ui-markdown-editor>\n</gn-ui-form-field-wrapper>\n" }]
+        }], propDecorators: { label: [{
                 type: Input
             }], hint: [{
                 type: Input
@@ -36093,6 +36288,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }], placeholder: [{
                 type: Input
+            }], value: [{
+                type: Input
+            }], valueChange: [{
+                type: Output
             }] } });
 
 class FormFieldObjectComponent {
@@ -36113,264 +36312,197 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
             args: [{ selector: 'gn-ui-form-field-array', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<p>form-field-array works!</p>\n" }]
         }] });
 
-class FormFieldSpatialExtentComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldSpatialExtentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldSpatialExtentComponent, isStandalone: true, selector: "gn-ui-form-field-spatial-extent", ngImport: i0, template: "<p>form-field-spatial-extent works!</p>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldSpatialExtentComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'gn-ui-form-field-spatial-extent', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<p>form-field-spatial-extent works!</p>\n" }]
-        }] });
-
-class FormFieldUpdateFrequencyComponent {
-    get planned() {
-        return typeof this.control.value !== 'string';
-    }
-    constructor(translateService) {
-        this.translateService = translateService;
-        this.choices = [];
-    }
-    async ngOnInit() {
-        this.choices = await this.getInitialChoices();
-        if (typeof this.control.value === 'string') {
-            return;
-        }
-        const updatedTimes = this.control.value.updatedTimes;
-        const per = this.control.value.per;
-        // the update frequency is not in the list; make it appear there
-        if (updatedTimes && updatedTimes !== 1 && updatedTimes !== 2) {
-            this.choices = [
-                {
-                    value: `${per}.${updatedTimes}`,
-                    label: await firstValueFrom(this.translateService.get(`domain.record.updateFrequency.${per}`, {
-                        count: updatedTimes,
-                    })),
+class FormFieldMapContainerComponent {
+    constructor(mapFacade, mapUtils, styleService) {
+        this.mapFacade = mapFacade;
+        this.mapUtils = mapUtils;
+        this.styleService = styleService;
+        this.error = '';
+        this.mapContext$ = this.mapFacade.layers$.pipe(switchMap((layers) => from(this.mapUtils.getLayerExtent(layers[0])).pipe(catchError$1(() => {
+            this.error = 'The layer has no extent';
+            return of(undefined);
+        }), map$2((extent) => {
+            return {
+                layers: [DEFAULT_BASELAYER_CONTEXT, ...layers],
+                view: {
+                    extent: extent,
                 },
-                ...this.choices,
-            ];
-        }
+            };
+        }))));
+        this.mapConfig = getOptionalMapConfig();
+        const fill = new Fill({
+            color: 'transparent',
+        });
+        const stroke = new Stroke({
+            color: 'black',
+            width: 2,
+        });
+        const styles = [
+            new Style$1({
+                fill: fill,
+                stroke: stroke,
+            }),
+        ];
+        this.styleService.styles.default = this.styleService.createStyleFunction({
+            ...this.styleService.createGeometryStyles({ color: 'black' }),
+            polygon: styles,
+        });
     }
-    onPlannedToggled() {
-        if (this.planned) {
-            this.control.setValue('notPlanned');
-        }
-        else {
-            this.control.setValue({ updatedTimes: 1, per: 'day' });
+    ngOnChanges() {
+        this.mapFacade.removeLayer(0);
+        if (this.spatialExtents) {
+            const featureCollection = {
+                type: 'FeatureCollection',
+                features: [],
+            };
+            this.spatialExtents.forEach((extent) => {
+                if (extent.geometry) {
+                    featureCollection.features.push({
+                        type: 'Feature',
+                        properties: {},
+                        geometry: extent.geometry,
+                    });
+                }
+                else if (extent.bbox?.length >= 0) {
+                    featureCollection.features.push({
+                        type: 'Feature',
+                        properties: {},
+                        geometry: this.bboxCoordsToGeometry(extent.bbox),
+                    });
+                }
+            });
+            this.mapFacade.addLayer({
+                type: MapContextLayerTypeEnum.GEOJSON,
+                data: featureCollection,
+                title: 'Spatial extents',
+            });
         }
     }
-    get selectedFrequency() {
-        if (typeof this.control.value === 'string')
-            return null;
-        const { updatedTimes, per } = this.control.value;
-        return `${per}.${updatedTimes}`;
-    }
-    onSelectFrequencyValue(value) {
-        const split = value.split('.');
-        this.control.setValue({
-            updatedTimes: Number(split[1]),
-            per: split[0],
-        });
-    }
-    async getInitialChoices() {
-        return [
-            {
-                value: 'day.1',
-                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.day', {
-                    count: 1,
-                })),
-            },
-            {
-                value: 'day.2',
-                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.day', {
-                    count: 2,
-                })),
-            },
-            {
-                value: 'week.1',
-                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.week', {
-                    count: 1,
-                })),
-            },
-            {
-                value: 'week.2',
-                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.week', {
-                    count: 2,
-                })),
-            },
-            {
-                value: 'month.1',
-                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.month', {
-                    count: 1,
-                })),
-            },
-            {
-                value: 'month.2',
-                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.month', {
-                    count: 2,
-                })),
-            },
-            {
-                value: 'year.1',
-                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.year', {
-                    count: 1,
-                })),
-            },
-            {
-                value: 'year.2',
-                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.year', {
-                    count: 2,
-                })),
-            },
-        ];
+    bboxCoordsToGeometry(bbox) {
+        const geometry = new Polygon([
+            [
+                [bbox[0], bbox[1]],
+                [bbox[0], bbox[3]],
+                [bbox[2], bbox[3]],
+                [bbox[2], bbox[1]],
+                [bbox[0], bbox[1]],
+            ],
+        ]);
+        const geoJSONGeom = new GeoJSON().writeGeometryObject(geometry);
+        return geoJSONGeom;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldUpdateFrequencyComponent, deps: [{ token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldUpdateFrequencyComponent, isStandalone: true, selector: "gn-ui-form-field-update-frequency", inputs: { control: "control" }, ngImport: i0, template: "<gn-ui-check-toggle\n  [label]=\"'editor.record.form.updateFrequency.planned' | translate\"\n  [value]=\"planned\"\n  (toggled)=\"onPlannedToggled()\"\n></gn-ui-check-toggle>\n<gn-ui-dropdown-selector\n  title=\"updateFrequency\"\n  [showTitle]=\"false\"\n  [choices]=\"choices\"\n  [selected]=\"selectedFrequency\"\n  (selectValue)=\"onSelectFrequencyValue($event)\"\n  [disabled]=\"!planned\"\n>\n</gn-ui-dropdown-selector>\n", styles: [""], dependencies: [{ kind: "component", type: CheckToggleComponent, selector: "gn-ui-check-toggle", inputs: ["title", "label", "value", "color"], outputs: ["toggled"] }, { kind: "component", type: DropdownSelectorComponent, selector: "gn-ui-dropdown-selector", inputs: ["title", "showTitle", "ariaName", "choices", "selected", "maxRows", "extraBtnClass", "minWidth", "disabled"], outputs: ["selectValue"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldMapContainerComponent, deps: [{ token: MapFacade }, { token: MapUtilsService }, { token: MapStyleService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldMapContainerComponent, isStandalone: true, selector: "gn-ui-form-field-map-container", inputs: { spatialExtents: "spatialExtents" }, usesOnChanges: true, ngImport: i0, template: "<gn-ui-map-context\n  [context]=\"mapContext$ | async\"\n  [mapConfig]=\"mapConfig\"\n></gn-ui-map-context>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "ngmodule", type: FeatureMapModule }, { kind: "component", type: MapContextComponent, selector: "gn-ui-map-context", inputs: ["context", "mapConfig"], outputs: ["featureClicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldUpdateFrequencyComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldMapContainerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-form-field-update-frequency', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CheckToggleComponent, DropdownSelectorComponent, TranslateModule], template: "<gn-ui-check-toggle\n  [label]=\"'editor.record.form.updateFrequency.planned' | translate\"\n  [value]=\"planned\"\n  (toggled)=\"onPlannedToggled()\"\n></gn-ui-check-toggle>\n<gn-ui-dropdown-selector\n  title=\"updateFrequency\"\n  [showTitle]=\"false\"\n  [choices]=\"choices\"\n  [selected]=\"selectedFrequency\"\n  (selectValue)=\"onSelectFrequencyValue($event)\"\n  [disabled]=\"!planned\"\n>\n</gn-ui-dropdown-selector>\n" }]
-        }], ctorParameters: function () { return [{ type: i1$1.TranslateService }]; }, propDecorators: { control: [{
+            args: [{ selector: 'gn-ui-form-field-map-container', standalone: true, imports: [CommonModule, FeatureMapModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<gn-ui-map-context\n  [context]=\"mapContext$ | async\"\n  [mapConfig]=\"mapConfig\"\n></gn-ui-map-context>\n" }]
+        }], ctorParameters: function () { return [{ type: MapFacade }, { type: MapUtilsService }, { type: MapStyleService }]; }, propDecorators: { spatialExtents: [{
                 type: Input
             }] } });
 
-class OverviewUploadComponent {
-    constructor(recordsApiService, cd) {
-        this.recordsApiService = recordsApiService;
-        this.cd = cd;
-        this.overviewChange = new EventEmitter();
-        this.altTextChange = new EventEmitter();
-        this.errorHandle = (error) => {
-            console.error(error);
-            this.resourceUrl = '';
-            this.resourceAltText = '';
-            this.resourceFileName = '';
-            this.overviewChange.emit(null);
-            this.cd.markForCheck();
-        };
-    }
-    ngOnInit() {
-        this.recordsApiService.getAllResources(this.metadataUuid).subscribe({
-            next: (resources) => {
-                if (resources && resources.length > 0) {
-                    this.resourceUrl = resources[0].url;
-                    this.resourceFileName = resources[0].filename;
-                    if (!this.resourceAltText) {
-                        this.resourceAltText = this.resourceFileName;
-                    }
+/**
+ * This form field is not like the others, as it will read directly from the state to handle both spatial extents
+ * and place keywords.
+ * Other types of keywords will not be touched by this field.
+ */
+class FormFieldSpatialExtentComponent {
+    constructor(platformService, editorFacade, translateService) {
+        this.platformService = platformService;
+        this.editorFacade = editorFacade;
+        this.translateService = translateService;
+        this.spatialExtents$ = this.editorFacade.record$.pipe(map$2((record) => ('spatialExtents' in record ? record?.spatialExtents : [])));
+        this.shownKeywords$ = this.editorFacade.record$.pipe(map$2((record) => record?.keywords.filter((k) => k.type === 'place')), 
+        // look for full keywords in the thesauri
+        switchMap$1((keywords) => Promise.all(keywords.map(async (keyword) => {
+            if (!keyword.thesaurus)
+                return keyword;
+            const allKeywords = await firstValueFrom(this.platformService.searchKeywordsInThesaurus(keyword.label, keyword.thesaurus.id));
+            const found = allKeywords.find((k) => k.label === keyword.label);
+            return found ?? keyword;
+        }))), 
+        // add additional "unnamed" keywords for extents without a matching keyword
+        switchMap$1(async (keywords) => {
+            const spatialExtents = await firstValueFrom(this.spatialExtents$);
+            const keywordsFromExtents = await Promise.all(spatialExtents.map(async (extent) => {
+                const existingKeyword = extent.description &&
+                    keywords.find((k) => k.key === extent.description);
+                if (existingKeyword) {
+                    existingKeyword._linkedExtent = extent;
+                    return null;
                 }
-                else {
-                    this.resourceUrl = '';
-                    this.resourceAltText = '';
-                    this.resourceFileName = '';
+                let bbox = null;
+                if ('geometry' in extent) {
+                    bbox = extent.geometry; // FIXME: this should be a bbox too but for now it works...
                 }
-                this.cd.markForCheck();
-            },
-            error: this.errorHandle,
-        });
-    }
-    handleFileChange(file) {
-        this.recordsApiService
-            .putResource(this.metadataUuid, file, 'public')
-            .subscribe({
-            next: (resource) => {
-                this.resourceUrl = resource.url;
-                this.resourceAltText = resource.filename;
-                this.overviewChange.emit({
-                    url: new URL(resource.url),
-                    description: resource.filename,
-                });
-                this.cd.markForCheck();
-            },
-            error: this.errorHandle,
-        });
-    }
-    handleUrlChange(url) {
-        this.recordsApiService
-            .putResourceFromURL(this.metadataUuid, url, 'public')
-            .subscribe({
-            next: (resource) => {
-                this.resourceUrl = resource.url;
-                this.resourceAltText = resource.filename;
-                this.overviewChange.emit({
-                    url: new URL(resource.url),
-                    description: resource.filename,
-                });
-                this.cd.markForCheck();
-            },
-            error: this.errorHandle,
-        });
-    }
-    handleAltTextChange(newAltText) {
-        this.resourceAltText = newAltText;
-        this.overviewChange.emit({
-            url: new URL(this.resourceUrl),
-            description: this.resourceAltText,
-        });
-        this.cd.markForCheck();
-    }
-    handleDelete() {
-        //this.formControl.markAsDirty()
-        this.recordsApiService
-            .delResource(this.metadataUuid, this.resourceFileName)
-            .subscribe({
-            next: () => {
-                this.resourceAltText = '';
-                this.resourceUrl = '';
-                this.overviewChange.emit(null);
-                this.cd.markForCheck();
-            },
-            error: this.errorHandle,
-        });
-    }
-    ngOnChanges(changes) {
-        const overviewChanges = changes['formControl'];
-        if (overviewChanges &&
-            overviewChanges.currentValue !== overviewChanges.previousValue) {
-            let overview;
-            if (overviewChanges.currentValue.value &&
-                overviewChanges.currentValue.value.length > 0) {
-                overview = overviewChanges.currentValue.value[0];
-            }
-            else {
-                return;
-            }
-            if (overview.description) {
-                this.resourceAltText = overview.description;
-                this.cd.markForCheck();
-            }
+                else if ('bbox' in extent) {
+                    bbox = extent.bbox;
+                }
+                const label = await firstValueFrom(this.translateService.get('editor.record.placeKeywordWithoutLabel'));
+                return {
+                    label,
+                    type: 'place',
+                    ...(bbox && { bbox }),
+                    _linkedExtent: extent,
+                    _doNotSave: true,
+                };
+            })).then((keywords) => keywords.filter((k) => !!k));
+            return [...keywords, ...keywordsFromExtents];
+        }), shareReplay$1(1));
+    }
+    async handleKeywordDelete(keyword) {
+        const spatialExtents = await firstValueFrom(this.spatialExtents$);
+        const shownKeywords = (await firstValueFrom(this.shownKeywords$));
+        const newKeywords = shownKeywords.filter((k) => k !== keyword);
+        const linkedExtent = '_linkedExtent' in keyword ? keyword._linkedExtent : null;
+        const newExtents = linkedExtent
+            ? spatialExtents.filter((extent) => linkedExtent !== extent)
+            : spatialExtents;
+        return this.emitChanges(newKeywords, newExtents);
+    }
+    async handleKeywordAdd(keyword) {
+        const spatialExtents = await firstValueFrom(this.spatialExtents$);
+        const shownKeywords = await firstValueFrom(this.shownKeywords$);
+        const newKeywords = [...shownKeywords, keyword];
+        let newExtents = spatialExtents;
+        if (keyword.bbox) {
+            newExtents = [
+                ...spatialExtents,
+                {
+                    bbox: keyword.bbox,
+                    description: keyword.key ?? undefined,
+                },
+            ];
         }
+        return this.emitChanges(newKeywords, newExtents);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OverviewUploadComponent, deps: [{ token: RecordsApiService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OverviewUploadComponent, isStandalone: true, selector: "gn-ui-overview-upload", inputs: { metadataUuid: "metadataUuid", formControl: "formControl" }, outputs: { overviewChange: "overviewChange", altTextChange: "altTextChange" }, usesOnChanges: true, ngImport: i0, template: "<gn-ui-image-input\n  [maxSizeMB]=\"5\"\n  [previewUrl]=\"resourceUrl\"\n  [altText]=\"resourceAltText\"\n  (fileChange)=\"handleFileChange($event)\"\n  (urlChange)=\"handleUrlChange($event)\"\n  (altTextChange)=\"handleAltTextChange($event)\"\n  (delete)=\"handleDelete()\"\n></gn-ui-image-input>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: UiInputsModule }, { kind: "component", type: ImageInputComponent, selector: "gn-ui-image-input", inputs: ["maxSizeMB", "previewUrl", "altText", "uploadProgress", "uploadError"], outputs: ["fileChange", "urlChange", "uploadCancel", "delete", "altTextChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OverviewUploadComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'gn-ui-overview-upload', standalone: true, imports: [CommonModule, UiInputsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<gn-ui-image-input\n  [maxSizeMB]=\"5\"\n  [previewUrl]=\"resourceUrl\"\n  [altText]=\"resourceAltText\"\n  (fileChange)=\"handleFileChange($event)\"\n  (urlChange)=\"handleUrlChange($event)\"\n  (altTextChange)=\"handleAltTextChange($event)\"\n  (delete)=\"handleDelete()\"\n></gn-ui-image-input>\n" }]
-        }], ctorParameters: function () { return [{ type: RecordsApiService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { metadataUuid: [{
-                type: Input
-            }], formControl: [{
-                type: Input
-            }], overviewChange: [{
-                type: Output
-            }], altTextChange: [{
-                type: Output
-            }] } });
-
-class FormFieldOverviewsComponent {
-    handleOverviewChange(overView) {
-        this.control.setValue(overView ? [overView] : []);
+    async emitChanges(placeKeywords, spatialExtents) {
+        // some keywords are only present to allow control over extents; they **should not** be saved!
+        const filteredPlaceKeywords = placeKeywords
+            .filter((keyword) => !keyword._doNotSave)
+            .map(({ label, thesaurus, type }) => ({
+            label,
+            type,
+            ...(thesaurus && { thesaurus }),
+        }));
+        const notPlaceKeywords = await firstValueFrom(this.editorFacade.record$.pipe(map$2((record) => record.keywords.filter((k) => k.type !== 'place'))));
+        this.editorFacade.updateRecordField('keywords', [
+            ...notPlaceKeywords,
+            ...filteredPlaceKeywords,
+        ]);
+        this.editorFacade.updateRecordField('spatialExtents', spatialExtents);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldOverviewsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldOverviewsComponent, isStandalone: true, selector: "gn-ui-form-field-overviews", inputs: { metadataUuid: "metadataUuid", control: "control" }, ngImport: i0, template: "<gn-ui-overview-upload\n  [metadataUuid]=\"metadataUuid\"\n  [formControl]=\"control\"\n  (overviewChange)=\"handleOverviewChange($event)\"\n></gn-ui-overview-upload>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: OverviewUploadComponent, selector: "gn-ui-overview-upload", inputs: ["metadataUuid", "formControl"], outputs: ["overviewChange", "altTextChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldSpatialExtentComponent, deps: [{ token: PlatformServiceInterface }, { token: EditorFacade }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldSpatialExtentComponent, isStandalone: true, selector: "gn-ui-form-field-spatial-extent", ngImport: i0, template: "<div class=\"flex flex-col gap-3\">\n  <gn-ui-generic-keywords\n    [placeholder]=\"'Search for place keywords'\"\n    [keywords]=\"shownKeywords$ | async\"\n    [keywordTypes]=\"['place']\"\n    (deletedKeyword)=\"handleKeywordDelete($event)\"\n    (addedKeyword)=\"handleKeywordAdd($event)\"\n  >\n  </gn-ui-generic-keywords>\n</div>\n<div class=\"w-full h-96\">\n  <gn-ui-form-field-map-container\n    [spatialExtents]=\"spatialExtents$ | async\"\n  ></gn-ui-form-field-map-container>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "component", type: GenericKeywordsComponent, selector: "gn-ui-generic-keywords", inputs: ["keywords", "keywordTypes", "placeholder"], outputs: ["changedKeywords", "addedKeyword", "deletedKeyword"] }, { kind: "component", type: FormFieldMapContainerComponent, selector: "gn-ui-form-field-map-container", inputs: ["spatialExtents"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldOverviewsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldSpatialExtentComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-form-field-overviews', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, OverviewUploadComponent], template: "<gn-ui-overview-upload\n  [metadataUuid]=\"metadataUuid\"\n  [formControl]=\"control\"\n  (overviewChange)=\"handleOverviewChange($event)\"\n></gn-ui-overview-upload>\n" }]
-        }], propDecorators: { metadataUuid: [{
-                type: Input
-            }], control: [{
-                type: Input
-            }] } });
+            args: [{ selector: 'gn-ui-form-field-spatial-extent', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
+                        CommonModule,
+                        GenericKeywordsComponent,
+                        FormFieldMapContainerComponent,
+                    ], template: "<div class=\"flex flex-col gap-3\">\n  <gn-ui-generic-keywords\n    [placeholder]=\"'Search for place keywords'\"\n    [keywords]=\"shownKeywords$ | async\"\n    [keywordTypes]=\"['place']\"\n    (deletedKeyword)=\"handleKeywordDelete($event)\"\n    (addedKeyword)=\"handleKeywordAdd($event)\"\n  >\n  </gn-ui-generic-keywords>\n</div>\n<div class=\"w-full h-96\">\n  <gn-ui-form-field-map-container\n    [spatialExtents]=\"spatialExtents$ | async\"\n  ></gn-ui-form-field-map-container>\n</div>\n" }]
+        }], ctorParameters: function () { return [{ type: PlatformServiceInterface }, { type: EditorFacade }, { type: i1$1.TranslateService }]; } });
 
 const RoleValues = [
     'unspecified',
@@ -36454,11 +36586,11 @@ class ContactCardComponent {
         this.contactRemoved.emit(contact);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ContactCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ContactCardComponent, isStandalone: true, selector: "gn-ui-contact-card", inputs: { contact: "contact", removable: "removable" }, outputs: { contactRemoved: "contactRemoved" }, ngImport: i0, template: "<div class=\"flex flex-row gap-4 items-center\">\n  <div class=\"flex flex-row border border-gray-200 rounded-xl p-4 gap-4 w-full\">\n    <gn-ui-thumbnail\n      class=\"w-[56px] h-[56px] rounded-[4px]\"\n      [thumbnailUrl]=\"contact.organization.logoUrl?.href\"\n      [fit]=\"'contain'\"\n    ></gn-ui-thumbnail>\n    <div class=\"flex flex-col w-full\">\n      <div class=\"flex flex-row justify-between\">\n        <span class=\"flex flex-wrap font-bold w-full\"\n          >{{ contact.firstName }} {{ contact.lastName }}</span\n        >\n      </div>\n      <div>{{ contact.email }}</div>\n    </div>\n  </div>\n  <gn-ui-button\n    *ngIf=\"removable\"\n    data-test=\"removeContactButton\"\n    type=\"light\"\n    extraClass=\"w-[20px] h-[20px] flex items-center justify-center\"\n    (buttonClick)=\"removeContact(contact)\"\n    ><span class=\"material-symbols-outlined\"> close </span>\n  </gn-ui-button>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: ThumbnailComponent, selector: "gn-ui-thumbnail", inputs: ["thumbnailUrl", "fit"], outputs: ["placeholderShown"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ContactCardComponent, isStandalone: true, selector: "gn-ui-contact-card", inputs: { contact: "contact", removable: "removable" }, outputs: { contactRemoved: "contactRemoved" }, ngImport: i0, template: "<div class=\"flex flex-row gap-4 items-center\">\n  <div class=\"flex flex-row border border-gray-200 rounded-xl p-4 gap-4 w-full\">\n    <gn-ui-thumbnail\n      class=\"w-[56px] h-[56px] rounded-[4px]\"\n      [thumbnailUrl]=\"contact.organization.logoUrl?.href\"\n      [fit]=\"'contain'\"\n    ></gn-ui-thumbnail>\n    <div class=\"flex flex-col w-full\">\n      <div class=\"flex flex-row justify-between\">\n        <span\n          class=\"flex flex-wrap font-bold w-full\"\n          data-test=\"contactCardName\"\n          >{{ contact.firstName }} {{ contact.lastName }}</span\n        >\n      </div>\n      <div data-test=\"contactCardEmail\">{{ contact.email }}</div>\n    </div>\n  </div>\n  <gn-ui-button\n    *ngIf=\"removable\"\n    data-test=\"removeContactButton\"\n    type=\"light\"\n    extraClass=\"w-[20px] h-[20px] flex items-center justify-center\"\n    (buttonClick)=\"removeContact(contact)\"\n    ><span class=\"material-symbols-outlined\"> close </span>\n  </gn-ui-button>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: ThumbnailComponent, selector: "gn-ui-thumbnail", inputs: ["thumbnailUrl", "fit"], outputs: ["placeholderShown"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ContactCardComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-contact-card', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, MatIconModule, ButtonComponent, ThumbnailComponent], template: "<div class=\"flex flex-row gap-4 items-center\">\n  <div class=\"flex flex-row border border-gray-200 rounded-xl p-4 gap-4 w-full\">\n    <gn-ui-thumbnail\n      class=\"w-[56px] h-[56px] rounded-[4px]\"\n      [thumbnailUrl]=\"contact.organization.logoUrl?.href\"\n      [fit]=\"'contain'\"\n    ></gn-ui-thumbnail>\n    <div class=\"flex flex-col w-full\">\n      <div class=\"flex flex-row justify-between\">\n        <span class=\"flex flex-wrap font-bold w-full\"\n          >{{ contact.firstName }} {{ contact.lastName }}</span\n        >\n      </div>\n      <div>{{ contact.email }}</div>\n    </div>\n  </div>\n  <gn-ui-button\n    *ngIf=\"removable\"\n    data-test=\"removeContactButton\"\n    type=\"light\"\n    extraClass=\"w-[20px] h-[20px] flex items-center justify-center\"\n    (buttonClick)=\"removeContact(contact)\"\n    ><span class=\"material-symbols-outlined\"> close </span>\n  </gn-ui-button>\n</div>\n" }]
+            args: [{ selector: 'gn-ui-contact-card', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, MatIconModule, ButtonComponent, ThumbnailComponent], template: "<div class=\"flex flex-row gap-4 items-center\">\n  <div class=\"flex flex-row border border-gray-200 rounded-xl p-4 gap-4 w-full\">\n    <gn-ui-thumbnail\n      class=\"w-[56px] h-[56px] rounded-[4px]\"\n      [thumbnailUrl]=\"contact.organization.logoUrl?.href\"\n      [fit]=\"'contain'\"\n    ></gn-ui-thumbnail>\n    <div class=\"flex flex-col w-full\">\n      <div class=\"flex flex-row justify-between\">\n        <span\n          class=\"flex flex-wrap font-bold w-full\"\n          data-test=\"contactCardName\"\n          >{{ contact.firstName }} {{ contact.lastName }}</span\n        >\n      </div>\n      <div data-test=\"contactCardEmail\">{{ contact.email }}</div>\n    </div>\n  </div>\n  <gn-ui-button\n    *ngIf=\"removable\"\n    data-test=\"removeContactButton\"\n    type=\"light\"\n    extraClass=\"w-[20px] h-[20px] flex items-center justify-center\"\n    (buttonClick)=\"removeContact(contact)\"\n    ><span class=\"material-symbols-outlined\"> close </span>\n  </gn-ui-button>\n</div>\n" }]
         }], propDecorators: { contact: [{
                 type: Input
             }], removable: [{
@@ -36468,11 +36600,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
             }] } });
 
 class FormFieldContactsForResourceComponent {
-    constructor(platformServiceInterface, organizationsServiceInterface, changeDetectorRef) {
+    constructor(platformServiceInterface, organizationsServiceInterface) {
         this.platformServiceInterface = platformServiceInterface;
         this.organizationsServiceInterface = organizationsServiceInterface;
-        this.changeDetectorRef = changeDetectorRef;
-        this.subscription = new Subscription();
+        this.valueChange = new EventEmitter();
         this.contactsForRessourceByRole = new Map();
         this.contactsAsDynElemByRole = new Map();
         this.rolesToPick = [
@@ -36493,24 +36624,21 @@ class FormFieldContactsForResourceComponent {
          */
         this.autoCompleteAction = (query) => {
             const fuzzyFilter = createFuzzyFilter(query);
-            return this.allUsers$.pipe(switchMap((users) => [
+            return this.platformServiceInterface.getUsers().pipe(switchMap((users) => [
                 users.filter((user) => fuzzyFilter(user.username)),
             ]), map$1((results) => results.slice(0, 10)), debounceTime$1(300), distinctUntilChanged$1());
         };
-        this.allUsers$ = this.platformServiceInterface.getUsers();
+    }
+    ngOnChanges() {
+        this.updateContactsForRessource();
+        this.manageRoleSectionsToDisplay(this.value);
+        this.filterRolesToPick();
     }
     async ngOnInit() {
         this.allOrganizations = new Map((await firstValueFrom(this.organizationsServiceInterface.organisations$)).map((organization) => [organization.name, organization]));
         this.updateContactsForRessource();
-        this.manageRoleSectionsToDisplay(this.control.value);
+        this.manageRoleSectionsToDisplay(this.value);
         this.filterRolesToPick();
-        this.changeDetectorRef.markForCheck();
-        this.subscription.add(this.control.valueChanges.subscribe((contactsForResource) => {
-            this.updateContactsForRessource();
-            this.manageRoleSectionsToDisplay(contactsForResource);
-            this.filterRolesToPick();
-            this.changeDetectorRef.markForCheck();
-        }));
     }
     addRoleToDisplay(roleToAdd) {
         this.roleSectionsToDisplay.push(roleToAdd);
@@ -36520,7 +36648,7 @@ class FormFieldContactsForResourceComponent {
         this.rolesToPick = this.rolesToPick.filter((role) => !this.roleSectionsToDisplay.includes(role));
     }
     updateContactsForRessource() {
-        this.contactsForRessourceByRole = this.control.value.reduce((acc, contact) => {
+        this.contactsForRessourceByRole = this.value.reduce((acc, contact) => {
             const completeOrganization = this.allOrganizations.get(contact.organization.name);
             const updatedContact = {
                 ...contact,
@@ -36533,7 +36661,7 @@ class FormFieldContactsForResourceComponent {
             acc.get(contact.role).push(updatedContact);
             return acc;
         }, new Map());
-        this.contactsAsDynElemByRole = this.control.value.reduce((acc, contact) => {
+        this.contactsAsDynElemByRole = this.value.reduce((acc, contact) => {
             const completeOrganization = this.allOrganizations.get(contact.organization.name);
             const updatedContact = {
                 ...contact,
@@ -36553,7 +36681,6 @@ class FormFieldContactsForResourceComponent {
             acc.get(contact.role).push(contactAsDynElem);
             return acc;
         }, new Map());
-        this.changeDetectorRef.markForCheck();
     }
     manageRoleSectionsToDisplay(contactsForResource) {
         const roles = contactsForResource.map((contact) => contact.role);
@@ -36564,15 +36691,15 @@ class FormFieldContactsForResourceComponent {
         });
     }
     removeContact(index) {
-        const newContactsforRessource = this.control.value.filter((_, i) => i !== index);
-        this.control.setValue(newContactsforRessource);
+        const newContactsforRessource = this.value.filter((_, i) => i !== index);
+        this.valueChange.emit(newContactsforRessource);
     }
     handleContactsChanged(event) {
         const newContactsOrdered = event.map((contactAsDynElem) => contactAsDynElem.inputs['contact']);
         const role = newContactsOrdered[0].role;
         this.contactsForRessourceByRole.set(role, newContactsOrdered);
         const newControlValue = Array.from(this.contactsForRessourceByRole.values()).flat();
-        this.control.setValue(newControlValue);
+        this.valueChange.emit(newControlValue);
     }
     roleToLabel(role) {
         return RoleLabels.get(role);
@@ -36581,25 +36708,23 @@ class FormFieldContactsForResourceComponent {
      * gn-ui-autocomplete
      */
     addContact(contact, role) {
+        const newContact = contact;
         const newContactsForRessource = {
-            firstName: contact.name ?? '',
-            lastName: contact.surname ?? '',
-            organization: this.allOrganizations.get(contact.organisation) ??
-                { name: contact.organisation },
-            email: contact.email ?? '',
+            firstName: newContact.name ?? '',
+            lastName: newContact.surname ?? '',
+            organization: this.allOrganizations.get(newContact.organisation) ??
+                { name: newContact.organisation },
+            email: newContact.email ?? '',
             role,
             address: '',
             phone: '',
             position: '',
         };
-        const newControlValue = [...this.control.value, newContactsForRessource];
-        this.control.setValue(newControlValue);
-    }
-    ngOnDestroy() {
-        this.subscription.unsubscribe();
+        const newControlValue = [...this.value, newContactsForRessource];
+        this.valueChange.emit(newControlValue);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldContactsForResourceComponent, deps: [{ token: PlatformServiceInterface }, { token: OrganizationsServiceInterface }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldContactsForResourceComponent, isStandalone: true, selector: "gn-ui-form-field-contacts-for-resource", inputs: { control: "control" }, ngImport: i0, template: "<div class=\"flex flex-col gap-3\">\n  <div class=\"flex flex-row flex-wrap gap-2\" data-test=\"rolesToPick\">\n    <ng-container *ngFor=\"let role of rolesToPick\">\n      <gn-ui-button\n        extraClass=\"px-2 py-1.5\"\n        (buttonClick)=\"addRoleToDisplay(role)\"\n      >\n        <div class=\"flex flex-row gap-1 items-center\">\n          <span class=\"text-primary text-[20px] leading-[0] font-bold pb-[5px]\"\n            >&#8330;</span\n          >\n          <span class=\"font-bold\" translate>{{ roleToLabel(role) }}</span>\n        </div>\n      </gn-ui-button>\n    </ng-container>\n  </div>\n  <div\n    class=\"mt-8\"\n    *ngIf=\"\n      roleSectionsToDisplay && roleSectionsToDisplay.length > 0;\n      else noContact\n    \"\n    data-test=\"displayedRoles\"\n  >\n    <div\n      *ngFor=\"\n        let role of roleSectionsToDisplay;\n        let index = index;\n        let isLast = last\n      \"\n      class=\"flex flex-col gap-4\"\n    >\n      <div class=\"flex flex-row justify-between\">\n        <span class=\"font-bold text-base\" translate>{{\n          roleToLabel(role)\n        }}</span>\n      </div>\n\n      <gn-ui-autocomplete\n        [placeholder]=\"'Choose a contact'\"\n        [action]=\"autoCompleteAction\"\n        (itemSelected)=\"addContact($event, role)\"\n        [displayWithFn]=\"displayWithFn\"\n        [minCharacterCount]=\"1\"\n        [clearOnSelection]=\"true\"\n      >\n      </gn-ui-autocomplete>\n\n      <ng-container *ngIf=\"contactsForRessourceByRole.get(role) as contacts\">\n        <ng-container *ngIf=\"contacts.length > 1\">\n          <gn-ui-sortable-list\n            [elements]=\"contactsAsDynElemByRole.get(role)\"\n            (elementsChange)=\"handleContactsChanged($event)\"\n          ></gn-ui-sortable-list>\n        </ng-container>\n        <ng-container *ngIf=\"contacts.length === 1\">\n          <ng-container *ngFor=\"let contact of contacts\">\n            <gn-ui-contact-card\n              [contact]=\"contact\"\n              (contactRemoved)=\"removeContact(index)\"\n            ></gn-ui-contact-card> </ng-container\n        ></ng-container>\n      </ng-container>\n\n      <hr class=\"border-t-[#D6D3D1] mt-4 mb-6\" *ngIf=\"!isLast\" />\n    </div>\n  </div>\n  <ng-template #noContact>\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  </ng-template>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: UiInputsModule }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: UiWidgetsModule }, { kind: "component", type: AutocompleteComponent, selector: "gn-ui-autocomplete", inputs: ["placeholder", "action", "value", "clearOnSelection", "preventCompleteOnSelection", "autoFocus", "minCharacterCount", "allowSubmit", "displayWithFn"], outputs: ["itemSelected", "inputSubmitted", "inputCleared"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: ContactCardComponent, selector: "gn-ui-contact-card", inputs: ["contact", "removable"], outputs: ["contactRemoved"] }, { kind: "component", type: SortableListComponent, selector: "gn-ui-sortable-list", inputs: ["elements", "addOptions"], outputs: ["elementsChange", "add"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldContactsForResourceComponent, deps: [{ token: PlatformServiceInterface }, { token: OrganizationsServiceInterface }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldContactsForResourceComponent, isStandalone: true, selector: "gn-ui-form-field-contacts-for-resource", inputs: { value: "value" }, outputs: { valueChange: "valueChange" }, 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    <ng-container *ngFor=\"let role of rolesToPick\">\n      <gn-ui-button\n        extraClass=\"px-2 py-1.5\"\n        (buttonClick)=\"addRoleToDisplay(role)\"\n      >\n        <div class=\"flex flex-row gap-1 items-center\">\n          <span class=\"text-primary text-[20px] leading-[0] font-bold pb-[5px]\"\n            >&#8330;</span\n          >\n          <span class=\"font-bold\" translate>{{ roleToLabel(role) }}</span>\n        </div>\n      </gn-ui-button>\n    </ng-container>\n  </div>\n  <div\n    class=\"mt-8\"\n    *ngIf=\"\n      roleSectionsToDisplay && roleSectionsToDisplay.length > 0;\n      else noContact\n    \"\n    data-test=\"displayedRoles\"\n  >\n    <div\n      *ngFor=\"\n        let role of roleSectionsToDisplay;\n        let index = index;\n        let isLast = last\n      \"\n      class=\"flex flex-col gap-4\"\n    >\n      <div class=\"flex flex-row justify-between\">\n        <span class=\"font-bold text-base\" translate>{{\n          roleToLabel(role)\n        }}</span>\n      </div>\n\n      <gn-ui-autocomplete\n        [placeholder]=\"'Choose a contact'\"\n        [action]=\"autoCompleteAction\"\n        (itemSelected)=\"addContact($event, role)\"\n        [displayWithFn]=\"displayWithFn\"\n        [minCharacterCount]=\"1\"\n        [clearOnSelection]=\"true\"\n      >\n      </gn-ui-autocomplete>\n\n      <ng-container *ngIf=\"contactsForRessourceByRole.get(role) as contacts\">\n        <ng-container *ngIf=\"contacts.length > 1\">\n          <gn-ui-sortable-list\n            [elements]=\"contactsAsDynElemByRole.get(role)\"\n            (elementsChange)=\"handleContactsChanged($event)\"\n          ></gn-ui-sortable-list>\n        </ng-container>\n        <ng-container *ngIf=\"contacts.length === 1\">\n          <ng-container *ngFor=\"let contact of contacts\">\n            <gn-ui-contact-card\n              [contact]=\"contact\"\n              (contactRemoved)=\"removeContact(index)\"\n            ></gn-ui-contact-card> </ng-container\n        ></ng-container>\n      </ng-container>\n\n      <hr class=\"border-t-[#D6D3D1] mt-4 mb-6\" *ngIf=\"!isLast\" />\n    </div>\n  </div>\n  <ng-template #noContact>\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  </ng-template>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: UiInputsModule }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: UiWidgetsModule }, { kind: "component", type: AutocompleteComponent, selector: "gn-ui-autocomplete", inputs: ["placeholder", "action", "value", "clearOnSelection", "preventCompleteOnSelection", "autoFocus", "minCharacterCount", "allowSubmit", "displayWithFn"], outputs: ["itemSelected", "inputSubmitted", "inputCleared"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: ContactCardComponent, selector: "gn-ui-contact-card", inputs: ["contact", "removable"], outputs: ["contactRemoved"] }, { kind: "component", type: SortableListComponent, selector: "gn-ui-sortable-list", inputs: ["elements"], outputs: ["elementsChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldContactsForResourceComponent, decorators: [{
             type: Component,
@@ -36613,118 +36738,316 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         ContactCardComponent,
                         SortableListComponent,
                     ], template: "<div class=\"flex flex-col gap-3\">\n  <div class=\"flex flex-row flex-wrap gap-2\" data-test=\"rolesToPick\">\n    <ng-container *ngFor=\"let role of rolesToPick\">\n      <gn-ui-button\n        extraClass=\"px-2 py-1.5\"\n        (buttonClick)=\"addRoleToDisplay(role)\"\n      >\n        <div class=\"flex flex-row gap-1 items-center\">\n          <span class=\"text-primary text-[20px] leading-[0] font-bold pb-[5px]\"\n            >&#8330;</span\n          >\n          <span class=\"font-bold\" translate>{{ roleToLabel(role) }}</span>\n        </div>\n      </gn-ui-button>\n    </ng-container>\n  </div>\n  <div\n    class=\"mt-8\"\n    *ngIf=\"\n      roleSectionsToDisplay && roleSectionsToDisplay.length > 0;\n      else noContact\n    \"\n    data-test=\"displayedRoles\"\n  >\n    <div\n      *ngFor=\"\n        let role of roleSectionsToDisplay;\n        let index = index;\n        let isLast = last\n      \"\n      class=\"flex flex-col gap-4\"\n    >\n      <div class=\"flex flex-row justify-between\">\n        <span class=\"font-bold text-base\" translate>{{\n          roleToLabel(role)\n        }}</span>\n      </div>\n\n      <gn-ui-autocomplete\n        [placeholder]=\"'Choose a contact'\"\n        [action]=\"autoCompleteAction\"\n        (itemSelected)=\"addContact($event, role)\"\n        [displayWithFn]=\"displayWithFn\"\n        [minCharacterCount]=\"1\"\n        [clearOnSelection]=\"true\"\n      >\n      </gn-ui-autocomplete>\n\n      <ng-container *ngIf=\"contactsForRessourceByRole.get(role) as contacts\">\n        <ng-container *ngIf=\"contacts.length > 1\">\n          <gn-ui-sortable-list\n            [elements]=\"contactsAsDynElemByRole.get(role)\"\n            (elementsChange)=\"handleContactsChanged($event)\"\n          ></gn-ui-sortable-list>\n        </ng-container>\n        <ng-container *ngIf=\"contacts.length === 1\">\n          <ng-container *ngFor=\"let contact of contacts\">\n            <gn-ui-contact-card\n              [contact]=\"contact\"\n              (contactRemoved)=\"removeContact(index)\"\n            ></gn-ui-contact-card> </ng-container\n        ></ng-container>\n      </ng-container>\n\n      <hr class=\"border-t-[#D6D3D1] mt-4 mb-6\" *ngIf=\"!isLast\" />\n    </div>\n  </div>\n  <ng-template #noContact>\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  </ng-template>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: PlatformServiceInterface }, { type: OrganizationsServiceInterface }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { control: [{
+        }], ctorParameters: function () { return [{ type: PlatformServiceInterface }, { type: OrganizationsServiceInterface }]; }, propDecorators: { value: [{
+                type: Input
+            }], valueChange: [{
+                type: Output
+            }] } });
+
+class OverviewUploadComponent {
+    set overview(value) {
+        this._overview = value;
+        if (this._overview) {
+            this.recordsApiService.getAllResources(this.metadataUuid).subscribe({
+                next: (resources) => {
+                    const resource = resources.find((r) => r.url === this._overview.url.toString());
+                    if (resource) {
+                        this.resourceFileName = resource.filename;
+                    }
+                },
+                error: this.errorHandle,
+            });
+            this.resourceUrl = this._overview.url.toString();
+            this.altText = this._overview.description;
+        }
+        else {
+            this.resourceUrl = '';
+            this.resourceFileName = '';
+            this.altText = '';
+        }
+    }
+    constructor(recordsApiService, notificationsService, translateService) {
+        this.recordsApiService = recordsApiService;
+        this.notificationsService = notificationsService;
+        this.translateService = translateService;
+        this.overviewChange = new EventEmitter();
+        this.errorHandle = (error) => {
+            this.notificationsService.showNotification({
+                type: 'error',
+                title: this.translateService.instant('editor.record.resourceError.title'),
+                text: `${this.translateService.instant('editor.record.resourceError.body')} ${error.message}`,
+                closeMessage: this.translateService.instant('editor.record.resourceError.closeMessage'),
+            });
+        };
+    }
+    handleFileChange(file) {
+        this.recordsApiService
+            .putResource(this.metadataUuid, file, 'public')
+            .subscribe({
+            next: (resource) => {
+                this.overviewChange.emit({
+                    url: new URL(resource.url),
+                    description: resource.filename,
+                });
+            },
+            error: this.errorHandle,
+        });
+    }
+    handleUrlChange(url) {
+        this.recordsApiService
+            .putResourceFromURL(this.metadataUuid, url, 'public')
+            .subscribe({
+            next: (resource) => {
+                this.overviewChange.emit({
+                    url: new URL(resource.url),
+                    description: resource.filename,
+                });
+            },
+            error: this.errorHandle,
+        });
+    }
+    handleAltTextChange(newAltText) {
+        this.overviewChange.emit({
+            url: new URL(this.resourceUrl),
+            description: newAltText,
+        });
+    }
+    handleDelete() {
+        this.overviewChange.emit(null);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OverviewUploadComponent, deps: [{ token: RecordsApiService }, { token: NotificationsService }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OverviewUploadComponent, isStandalone: true, selector: "gn-ui-overview-upload", inputs: { metadataUuid: "metadataUuid", overview: "overview" }, outputs: { overviewChange: "overviewChange" }, ngImport: i0, template: "<gn-ui-image-input\n  [maxSizeMB]=\"5\"\n  [previewUrl]=\"resourceUrl\"\n  [altText]=\"altText\"\n  (fileChange)=\"handleFileChange($event)\"\n  (urlChange)=\"handleUrlChange($event)\"\n  (altTextChange)=\"handleAltTextChange($event)\"\n  (delete)=\"handleDelete()\"\n></gn-ui-image-input>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: UiInputsModule }, { kind: "component", type: ImageInputComponent, selector: "gn-ui-image-input", inputs: ["maxSizeMB", "previewUrl", "altText", "uploadProgress", "uploadError"], outputs: ["fileChange", "urlChange", "uploadCancel", "delete", "altTextChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OverviewUploadComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'gn-ui-overview-upload', standalone: true, imports: [CommonModule, UiInputsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<gn-ui-image-input\n  [maxSizeMB]=\"5\"\n  [previewUrl]=\"resourceUrl\"\n  [altText]=\"altText\"\n  (fileChange)=\"handleFileChange($event)\"\n  (urlChange)=\"handleUrlChange($event)\"\n  (altTextChange)=\"handleAltTextChange($event)\"\n  (delete)=\"handleDelete()\"\n></gn-ui-image-input>\n" }]
+        }], ctorParameters: function () { return [{ type: RecordsApiService }, { type: NotificationsService }, { type: i1$1.TranslateService }]; }, propDecorators: { metadataUuid: [{
                 type: Input
+            }], overview: [{
+                type: Input
+            }], overviewChange: [{
+                type: Output
+            }] } });
+
+class FormFieldOverviewsComponent {
+    constructor() {
+        this.valueChange = new EventEmitter();
+    }
+    get firstOverview() {
+        return this.value[0];
+    }
+    handleOverviewChange(overView) {
+        this.valueChange.emit(overView ? [overView] : []);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldOverviewsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldOverviewsComponent, isStandalone: true, selector: "gn-ui-form-field-overviews", inputs: { metadataUuid: "metadataUuid", value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<gn-ui-overview-upload\n  [metadataUuid]=\"metadataUuid\"\n  [overview]=\"firstOverview\"\n  (overviewChange)=\"handleOverviewChange($event)\"\n></gn-ui-overview-upload>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: OverviewUploadComponent, selector: "gn-ui-overview-upload", inputs: ["metadataUuid", "overview"], outputs: ["overviewChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldOverviewsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'gn-ui-form-field-overviews', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, OverviewUploadComponent], template: "<gn-ui-overview-upload\n  [metadataUuid]=\"metadataUuid\"\n  [overview]=\"firstOverview\"\n  (overviewChange)=\"handleOverviewChange($event)\"\n></gn-ui-overview-upload>\n" }]
+        }], propDecorators: { metadataUuid: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], valueChange: [{
+                type: Output
+            }] } });
+
+class FormFieldUpdateFrequencyComponent {
+    get planned() {
+        return typeof this.value !== 'string';
+    }
+    constructor(translateService) {
+        this.translateService = translateService;
+        this.valueChange = new EventEmitter();
+        this.choices = [];
+    }
+    async ngOnInit() {
+        this.choices = await this.getInitialChoices();
+        if (typeof this.value === 'string') {
+            return;
+        }
+        const updatedTimes = this.value.updatedTimes;
+        const per = this.value.per;
+        // the update frequency is not in the list; make it appear there
+        if (updatedTimes && updatedTimes !== 1 && updatedTimes !== 2) {
+            this.choices = [
+                {
+                    value: `${per}.${updatedTimes}`,
+                    label: await firstValueFrom(this.translateService.get(`domain.record.updateFrequency.${per}`, {
+                        count: updatedTimes,
+                    })),
+                },
+                ...this.choices,
+            ];
+        }
+    }
+    onPlannedToggled() {
+        if (this.planned) {
+            this.valueChange.emit('notPlanned');
+        }
+        else {
+            this.valueChange.emit({ updatedTimes: 1, per: 'day' });
+        }
+    }
+    get selectedFrequency() {
+        if (typeof this.value === 'string')
+            return null;
+        const { updatedTimes, per } = this.value;
+        return `${per}.${updatedTimes}`;
+    }
+    onSelectFrequencyValue(value) {
+        const split = value.split('.');
+        this.valueChange.emit({
+            updatedTimes: Number(split[1]),
+            per: split[0],
+        });
+    }
+    async getInitialChoices() {
+        return [
+            {
+                value: 'day.1',
+                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.day', {
+                    count: 1,
+                })),
+            },
+            {
+                value: 'day.2',
+                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.day', {
+                    count: 2,
+                })),
+            },
+            {
+                value: 'week.1',
+                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.week', {
+                    count: 1,
+                })),
+            },
+            {
+                value: 'week.2',
+                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.week', {
+                    count: 2,
+                })),
+            },
+            {
+                value: 'month.1',
+                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.month', {
+                    count: 1,
+                })),
+            },
+            {
+                value: 'month.2',
+                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.month', {
+                    count: 2,
+                })),
+            },
+            {
+                value: 'year.1',
+                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.year', {
+                    count: 1,
+                })),
+            },
+            {
+                value: 'year.2',
+                label: await firstValueFrom(this.translateService.get('domain.record.updateFrequency.year', {
+                    count: 2,
+                })),
+            },
+        ];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldUpdateFrequencyComponent, deps: [{ token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldUpdateFrequencyComponent, isStandalone: true, selector: "gn-ui-form-field-update-frequency", inputs: { value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<gn-ui-check-toggle\n  [label]=\"'editor.record.form.updateFrequency.planned' | translate\"\n  [value]=\"planned\"\n  (toggled)=\"onPlannedToggled()\"\n></gn-ui-check-toggle>\n<gn-ui-dropdown-selector\n  title=\"updateFrequency\"\n  [showTitle]=\"false\"\n  [choices]=\"choices\"\n  [selected]=\"selectedFrequency\"\n  (selectValue)=\"onSelectFrequencyValue($event)\"\n  [disabled]=\"!planned\"\n>\n</gn-ui-dropdown-selector>\n", styles: [""], dependencies: [{ kind: "component", type: CheckToggleComponent, selector: "gn-ui-check-toggle", inputs: ["title", "label", "value", "color"], outputs: ["toggled"] }, { kind: "component", type: DropdownSelectorComponent, selector: "gn-ui-dropdown-selector", inputs: ["title", "showTitle", "ariaName", "choices", "selected", "maxRows", "extraBtnClass", "minWidth", "disabled"], outputs: ["selectValue"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldUpdateFrequencyComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'gn-ui-form-field-update-frequency', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CheckToggleComponent, DropdownSelectorComponent, TranslateModule], template: "<gn-ui-check-toggle\n  [label]=\"'editor.record.form.updateFrequency.planned' | translate\"\n  [value]=\"planned\"\n  (toggled)=\"onPlannedToggled()\"\n></gn-ui-check-toggle>\n<gn-ui-dropdown-selector\n  title=\"updateFrequency\"\n  [showTitle]=\"false\"\n  [choices]=\"choices\"\n  [selected]=\"selectedFrequency\"\n  (selectValue)=\"onSelectFrequencyValue($event)\"\n  [disabled]=\"!planned\"\n>\n</gn-ui-dropdown-selector>\n" }]
+        }], ctorParameters: function () { return [{ type: i1$1.TranslateService }]; }, propDecorators: { value: [{
+                type: Input
+            }], valueChange: [{
+                type: Output
             }] } });
 
 class FormFieldOpenDataComponent {
     constructor() {
-        this.value = false;
-        this.visibilityChange = new EventEmitter();
+        this.valueChange = new EventEmitter();
+        this.openDataChange = new EventEmitter();
+        this.openData = false;
     }
     get config() {
         return OPEN_DATA_LICENSES;
     }
-    ngOnInit() {
-        this.initToggle();
-        this.subscription = new Subscription();
-        this.subscription.add(this.control.valueChanges.subscribe((value) => {
-            this.value = this.config.includes(value[0].text);
-            this.visibilityChange.emit(this.value);
-        }));
-    }
-    initToggle() {
-        this.value = this.config.includes(this.control.value[0].text);
-        this.visibilityChange.emit(this.value);
+    ngOnChanges() {
+        if (this.value && this.value.length > 0) {
+            this.openData = this.config.includes(this.value[0].text);
+        }
+        else {
+            this.openData = false;
+        }
+        this.openDataChange.emit(this.openData);
     }
-    onOpenDataToggled(boolean) {
-        if (boolean) {
-            this.control.setValue([{ text: this.config[0] }]);
+    onOpenDataToggled(openData) {
+        this.openDataChange.emit(openData);
+        if (openData) {
+            this.valueChange.emit([{ text: this.config[0] }]);
         }
-        this.value = !this.value;
-        this.visibilityChange.emit(boolean);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldOpenDataComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldOpenDataComponent, isStandalone: true, selector: "gn-ui-form-field-open-data", inputs: { control: "control" }, outputs: { visibilityChange: "visibilityChange" }, ngImport: i0, template: "<gn-ui-check-toggle\n  [label]=\"'editor.record.form.classification.opendata' | translate\"\n  [value]=\"value\"\n  (toggled)=\"onOpenDataToggled($event)\"\n  data-cy=\"openDataToggle\"\n></gn-ui-check-toggle>\n", styles: [""], dependencies: [{ kind: "component", type: CheckToggleComponent, selector: "gn-ui-check-toggle", inputs: ["title", "label", "value", "color"], outputs: ["toggled"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldOpenDataComponent, isStandalone: true, selector: "gn-ui-form-field-open-data", inputs: { value: "value" }, outputs: { valueChange: "valueChange", openDataChange: "openDataChange" }, usesOnChanges: true, ngImport: i0, template: "<gn-ui-check-toggle\n  [label]=\"'editor.record.form.classification.opendata' | translate\"\n  [value]=\"openData\"\n  (toggled)=\"onOpenDataToggled($event)\"\n  data-cy=\"openDataToggle\"\n></gn-ui-check-toggle>\n", styles: [""], dependencies: [{ kind: "component", type: CheckToggleComponent, selector: "gn-ui-check-toggle", inputs: ["title", "label", "value", "color"], outputs: ["toggled"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldOpenDataComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-form-field-open-data', standalone: true, imports: [CheckToggleComponent, TranslateModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<gn-ui-check-toggle\n  [label]=\"'editor.record.form.classification.opendata' | translate\"\n  [value]=\"value\"\n  (toggled)=\"onOpenDataToggled($event)\"\n  data-cy=\"openDataToggle\"\n></gn-ui-check-toggle>\n" }]
-        }], propDecorators: { control: [{
+            args: [{ selector: 'gn-ui-form-field-open-data', standalone: true, imports: [CheckToggleComponent, TranslateModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<gn-ui-check-toggle\n  [label]=\"'editor.record.form.classification.opendata' | translate\"\n  [value]=\"openData\"\n  (toggled)=\"onOpenDataToggled($event)\"\n  data-cy=\"openDataToggle\"\n></gn-ui-check-toggle>\n" }]
+        }], propDecorators: { value: [{
                 type: Input
-            }], visibilityChange: [{
+            }], valueChange: [{
+                type: Output
+            }], openDataChange: [{
                 type: Output
             }] } });
 
 class FormFieldComponent {
-    set value(v) {
-        this.formControl.setValue(v, {
-            emitEvent: false,
-        });
-    }
-    constructor(facade) {
-        this.facade = facade;
+    constructor() {
+        this.valueChange = new EventEmitter();
         this.isHidden = false;
-        this.metadataUuid$ = this.facade.record$.pipe(take(1), map$1((record) => record.uniqueIdentifier));
-        this.formControl = new FormControl();
-        this.valueChange = this.formControl.valueChanges;
     }
     focusTitleInput() {
         this.titleInput.nativeElement.children[0].focus();
     }
-    onVisibilityChange(visibility) {
-        this.isHidden = visibility;
-    }
-    get isTitle() {
-        return this.model === 'title';
-    }
-    get isAbstract() {
-        return this.model === 'abstract';
-    }
-    get isLicenses() {
-        return this.model === 'licenses';
-    }
-    get isResourceUpdated() {
-        return this.model === 'resourceUpdated';
-    }
-    get isUpdateFrequency() {
-        return this.model === 'updateFrequency';
-    }
-    get isTemporalExtents() {
-        return this.model === 'temporalExtents';
+    get withoutWrapper() {
+        return this.model === 'title' || this.model === 'abstract';
     }
-    get isSpatialExtentField() {
-        return this.model === 'spatialExtents';
+    get valueAsString() {
+        return this.value;
     }
-    get isGraphicOverview() {
-        return this.model === 'overviews';
+    get valueAsDate() {
+        return this.value;
     }
-    get isSimpleField() {
-        return this.model === 'uniqueIdentifier' || this.model === 'recordUpdated';
+    get valueAsOverviews() {
+        return this.value;
     }
-    get isReadOnly() {
-        return this.model === 'uniqueIdentifier' || this.model === 'recordUpdated';
+    get valueAsUpdateFrequency() {
+        return this.value;
     }
-    get isKeywords() {
-        return this.model === 'keywords';
+    get valueAsTemporalExtents() {
+        return this.value;
     }
-    get isContactsForResource() {
-        return this.model === 'contactsForResource';
+    get valueAsKeywords() {
+        return this.value;
     }
-    get withoutWrapper() {
-        return this.model === 'title' || this.model === 'abstract';
+    get valueAsConstraints() {
+        return this.value;
     }
-    get isOpenData() {
-        return this.model === 'licenses';
+    get valueAsIndividuals() {
+        return this.value;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldComponent, deps: [{ token: EditorFacade }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldComponent, isStandalone: true, selector: "gn-ui-form-field", inputs: { model: "model", config: "config", value: "value" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "titleInput", first: true, predicate: ["titleInput"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"isOpenData\">\n  <gn-ui-form-field-open-data\n    [control]=\"formControl\"\n    (visibilityChange)=\"onVisibilityChange($event)\"\n  ></gn-ui-form-field-open-data>\n</ng-container>\n<div class=\"flex flex-col h-full\" *ngIf=\"!isHidden\">\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 *ngIf=\"isTitle\">\n    <div class=\"flex justify-between items-center gap-3\">\n      <span\n        #titleInput\n        class=\"grow font-title text-3xl font-normal\"\n        [gnUiEditableLabel]=\"true\"\n        (editableLabelChanged)=\"formControl.setValue($event)\"\n      >\n        {{ formControl.value }}\n      </span>\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        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  </ng-container>\n  <ng-container *ngIf=\"isAbstract\">\n    <gn-ui-form-field-rich\n      class=\"h-[8rem]\"\n      [control]=\"formControl\"\n      [label]=\"config.labelKey! | translate\"\n      [hint]=\"config.hintKey! | translate\"\n    ></gn-ui-form-field-rich>\n  </ng-container>\n  <ng-container *ngIf=\"isLicenses\">\n    <gn-ui-form-field-license\n      [control]=\"formControl\"\n      [label]=\"config.labelKey! | translate\"\n    ></gn-ui-form-field-license>\n  </ng-container>\n  <ng-container *ngIf=\"isResourceUpdated\">\n    <gn-ui-form-field-resource-updated\n      [control]=\"formControl\"\n    ></gn-ui-form-field-resource-updated>\n  </ng-container>\n  <ng-container *ngIf=\"isUpdateFrequency\">\n    <gn-ui-form-field-update-frequency\n      [control]=\"formControl\"\n    ></gn-ui-form-field-update-frequency>\n  </ng-container>\n  <ng-container *ngIf=\"isTemporalExtents\">\n    <gn-ui-form-field-temporal-extents\n      [control]=\"formControl\"\n    ></gn-ui-form-field-temporal-extents>\n  </ng-container>\n  <ng-container *ngIf=\"isSimpleField\">\n    <gn-ui-form-field-simple\n      type=\"text\"\n      [control]=\"formControl\"\n      [readonly]=\"isReadOnly\"\n    ></gn-ui-form-field-simple>\n  </ng-container>\n  <ng-container *ngIf=\"isSpatialExtentField\">\n    <gn-ui-form-field-spatial-extent></gn-ui-form-field-spatial-extent>\n  </ng-container>\n  <ng-container *ngIf=\"isGraphicOverview\">\n    <gn-ui-form-field-overviews\n      [control]=\"formControl\"\n      [metadataUuid]=\"metadataUuid$ | async\"\n    ></gn-ui-form-field-overviews>\n  </ng-container>\n  <ng-container *ngIf=\"isKeywords\">\n    <gn-ui-form-field-keywords\n      [control]=\"formControl\"\n    ></gn-ui-form-field-keywords>\n  </ng-container>\n  <ng-container *ngIf=\"isContactsForResource\">\n    <gn-ui-form-field-contacts-for-resource\n      [control]=\"formControl\"\n    ></gn-ui-form-field-contacts-for-resource>\n  </ng-container>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: EditableLabelDirective, selector: "[gnUiEditableLabel]", inputs: ["gnUiEditableLabel"], outputs: ["editableLabelChanged"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", 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: ["control", "label"] }, { kind: "component", type: FormFieldResourceUpdatedComponent, selector: "gn-ui-form-field-resource-updated", inputs: ["control"] }, { kind: "component", type: FormFieldUpdateFrequencyComponent, selector: "gn-ui-form-field-update-frequency", inputs: ["control"] }, { kind: "component", type: FormFieldTemporalExtentsComponent, selector: "gn-ui-form-field-temporal-extents", inputs: ["control"] }, { kind: "component", type: FormFieldSimpleComponent, selector: "gn-ui-form-field-simple", inputs: ["type", "control", "readonly", "invalid", "placeholder", "options"] }, { kind: "component", type: FormFieldRichComponent, selector: "gn-ui-form-field-rich", inputs: ["control", "label", "hint", "helperText", "placeholder"] }, { kind: "component", type: FormFieldSpatialExtentComponent, selector: "gn-ui-form-field-spatial-extent" }, { kind: "component", type: FormFieldKeywordsComponent, selector: "gn-ui-form-field-keywords", inputs: ["control"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "component", type: FormFieldOverviewsComponent, selector: "gn-ui-form-field-overviews", inputs: ["metadataUuid", "control"] }, { kind: "component", type: FormFieldContactsForResourceComponent, selector: "gn-ui-form-field-contacts-for-resource", inputs: ["control"] }, { kind: "component", type: FormFieldOpenDataComponent, selector: "gn-ui-form-field-open-data", inputs: ["control"], outputs: ["visibilityChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldComponent, isStandalone: true, selector: "gn-ui-form-field", inputs: { uniqueIdentifier: "uniqueIdentifier", model: "model", config: "config", value: "value" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "titleInput", first: true, predicate: ["titleInput"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"model === 'licenses'\">\n  <gn-ui-form-field-open-data\n    [value]=\"valueAsConstraints\"\n    (valueChange)=\"valueChange.emit($event)\"\n    (openDataChange)=\"isHidden = $event\"\n  ></gn-ui-form-field-open-data>\n</ng-container>\n<div class=\"flex flex-col h-full\" *ngIf=\"!isHidden\">\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 justify-between items-center gap-3\">\n        <span\n          #titleInput\n          class=\"grow font-title text-3xl font-normal\"\n          [gnUiEditableLabel]=\"valueAsString\"\n          (editableLabelChanged)=\"valueChange.emit($event)\"\n        ></span>\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          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    </ng-container>\n    <ng-container *ngSwitchCase=\"'abstract'\">\n      <gn-ui-form-field-rich\n        class=\"h-[8rem]\"\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=\"'uniqueIdentifier'\">\n      <gn-ui-form-field-simple\n        type=\"text\"\n        [readonly]=\"true\"\n        [value]=\"valueAsString\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-simple>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'resourceUpdated'\">\n      <gn-ui-form-field-resource-updated\n        [value]=\"valueAsDate\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-resource-updated>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'recordUpdated'\">\n      <gn-ui-form-field-simple\n        type=\"date\"\n        [readonly]=\"true\"\n        [value]=\"valueAsDate\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-simple>\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=\"'licenses'\">\n      <gn-ui-form-field-license\n        [label]=\"config.labelKey! | translate\"\n        [value]=\"valueAsConstraints\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-license>\n    </ng-container>\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>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: EditableLabelDirective, selector: "[gnUiEditableLabel]", inputs: ["gnUiEditableLabel"], outputs: ["editableLabelChanged"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", 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", "value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldResourceUpdatedComponent, selector: "gn-ui-form-field-resource-updated", 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", "options", "value"], outputs: ["valueChange"] }, { kind: "component", type: FormFieldRichComponent, selector: "gn-ui-form-field-rich", inputs: ["label", "hint", "helperText", "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: FormFieldOpenDataComponent, selector: "gn-ui-form-field-open-data", inputs: ["value"], outputs: ["valueChange", "openDataChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldComponent, decorators: [{
             type: Component,
             args: [{ selector: 'gn-ui-form-field', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
                         CommonModule,
-                        ReactiveFormsModule,
+                        TranslateModule,
                         EditableLabelDirective,
                         MatIconModule,
                         MatTooltipModule,
@@ -36740,12 +37063,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         FormFieldFileComponent,
                         FormFieldArrayComponent,
                         FormFieldKeywordsComponent,
-                        TranslateModule,
                         FormFieldOverviewsComponent,
                         FormFieldContactsForResourceComponent,
                         FormFieldOpenDataComponent,
-                    ], template: "<ng-container *ngIf=\"isOpenData\">\n  <gn-ui-form-field-open-data\n    [control]=\"formControl\"\n    (visibilityChange)=\"onVisibilityChange($event)\"\n  ></gn-ui-form-field-open-data>\n</ng-container>\n<div class=\"flex flex-col h-full\" *ngIf=\"!isHidden\">\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 *ngIf=\"isTitle\">\n    <div class=\"flex justify-between items-center gap-3\">\n      <span\n        #titleInput\n        class=\"grow font-title text-3xl font-normal\"\n        [gnUiEditableLabel]=\"true\"\n        (editableLabelChanged)=\"formControl.setValue($event)\"\n      >\n        {{ formControl.value }}\n      </span>\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        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  </ng-container>\n  <ng-container *ngIf=\"isAbstract\">\n    <gn-ui-form-field-rich\n      class=\"h-[8rem]\"\n      [control]=\"formControl\"\n      [label]=\"config.labelKey! | translate\"\n      [hint]=\"config.hintKey! | translate\"\n    ></gn-ui-form-field-rich>\n  </ng-container>\n  <ng-container *ngIf=\"isLicenses\">\n    <gn-ui-form-field-license\n      [control]=\"formControl\"\n      [label]=\"config.labelKey! | translate\"\n    ></gn-ui-form-field-license>\n  </ng-container>\n  <ng-container *ngIf=\"isResourceUpdated\">\n    <gn-ui-form-field-resource-updated\n      [control]=\"formControl\"\n    ></gn-ui-form-field-resource-updated>\n  </ng-container>\n  <ng-container *ngIf=\"isUpdateFrequency\">\n    <gn-ui-form-field-update-frequency\n      [control]=\"formControl\"\n    ></gn-ui-form-field-update-frequency>\n  </ng-container>\n  <ng-container *ngIf=\"isTemporalExtents\">\n    <gn-ui-form-field-temporal-extents\n      [control]=\"formControl\"\n    ></gn-ui-form-field-temporal-extents>\n  </ng-container>\n  <ng-container *ngIf=\"isSimpleField\">\n    <gn-ui-form-field-simple\n      type=\"text\"\n      [control]=\"formControl\"\n      [readonly]=\"isReadOnly\"\n    ></gn-ui-form-field-simple>\n  </ng-container>\n  <ng-container *ngIf=\"isSpatialExtentField\">\n    <gn-ui-form-field-spatial-extent></gn-ui-form-field-spatial-extent>\n  </ng-container>\n  <ng-container *ngIf=\"isGraphicOverview\">\n    <gn-ui-form-field-overviews\n      [control]=\"formControl\"\n      [metadataUuid]=\"metadataUuid$ | async\"\n    ></gn-ui-form-field-overviews>\n  </ng-container>\n  <ng-container *ngIf=\"isKeywords\">\n    <gn-ui-form-field-keywords\n      [control]=\"formControl\"\n    ></gn-ui-form-field-keywords>\n  </ng-container>\n  <ng-container *ngIf=\"isContactsForResource\">\n    <gn-ui-form-field-contacts-for-resource\n      [control]=\"formControl\"\n    ></gn-ui-form-field-contacts-for-resource>\n  </ng-container>\n</ng-template>\n" }]
-        }], ctorParameters: function () { return [{ type: EditorFacade }]; }, propDecorators: { model: [{
+                    ], template: "<ng-container *ngIf=\"model === 'licenses'\">\n  <gn-ui-form-field-open-data\n    [value]=\"valueAsConstraints\"\n    (valueChange)=\"valueChange.emit($event)\"\n    (openDataChange)=\"isHidden = $event\"\n  ></gn-ui-form-field-open-data>\n</ng-container>\n<div class=\"flex flex-col h-full\" *ngIf=\"!isHidden\">\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 justify-between items-center gap-3\">\n        <span\n          #titleInput\n          class=\"grow font-title text-3xl font-normal\"\n          [gnUiEditableLabel]=\"valueAsString\"\n          (editableLabelChanged)=\"valueChange.emit($event)\"\n        ></span>\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          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    </ng-container>\n    <ng-container *ngSwitchCase=\"'abstract'\">\n      <gn-ui-form-field-rich\n        class=\"h-[8rem]\"\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=\"'uniqueIdentifier'\">\n      <gn-ui-form-field-simple\n        type=\"text\"\n        [readonly]=\"true\"\n        [value]=\"valueAsString\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-simple>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'resourceUpdated'\">\n      <gn-ui-form-field-resource-updated\n        [value]=\"valueAsDate\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-resource-updated>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'recordUpdated'\">\n      <gn-ui-form-field-simple\n        type=\"date\"\n        [readonly]=\"true\"\n        [value]=\"valueAsDate\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-simple>\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=\"'licenses'\">\n      <gn-ui-form-field-license\n        [label]=\"config.labelKey! | translate\"\n        [value]=\"valueAsConstraints\"\n        (valueChange)=\"valueChange.emit($event)\"\n      ></gn-ui-form-field-license>\n    </ng-container>\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>\n</ng-template>\n" }]
+        }], propDecorators: { uniqueIdentifier: [{
+                type: Input
+            }], model: [{
                 type: Input
             }], config: [{
                 type: Input
@@ -36761,6 +37085,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
 class RecordFormComponent {
     constructor(facade) {
         this.facade = facade;
+        this.recordUniqueIdentifier$ = this.facade.record$.pipe(map$2((record) => record.uniqueIdentifier));
     }
     handleFieldValueChange(model, newValue) {
         if (!model) {
@@ -36775,11 +37100,11 @@ class RecordFormComponent {
         return section.labelKey;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RecordFormComponent, deps: [{ token: EditorFacade }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: RecordFormComponent, isStandalone: true, selector: "gn-ui-record-form", ngImport: i0, template: "<ng-container>\n  <div class=\"flex flex-col gap-6 p-8\">\n    <ng-container\n      *ngFor=\"\n        let section of facade.currentSections$ | async;\n        trackBy: sectionTracker\n      \"\n    >\n      <ng-container *ngIf=\"!section.hidden\">\n        <div class=\"flex flex-col gap-8 border p-8 rounded-[8px] shadow\">\n          <div\n            class=\"flex flex-col gap-2\"\n            [ngClass]=\"section.labelKey ? 'mb-4' : 'hidden'\"\n          >\n            <div\n              *ngIf=\"section.labelKey\"\n              class=\"text-2xl font-title text-secondary\"\n              translate\n            >\n              {{ section.labelKey }}\n            </div>\n            <div\n              *ngIf=\"section.descriptionKey\"\n              class=\"text-secondary-lightest\"\n              translate\n            >\n              {{ section.descriptionKey }}\n            </div>\n          </div>\n          <ng-container\n            *ngFor=\"\n              let field of section.fieldsWithValues;\n              trackBy: fieldTracker\n            \"\n          >\n            <ng-container *ngIf=\"!field.config.hidden\">\n              <gn-ui-form-field\n                [model]=\"field.config.model!\"\n                [config]=\"field.config.formFieldConfig\"\n                [value]=\"field.value\"\n                (valueChange)=\"\n                  handleFieldValueChange(field.config.model!, $event)\n                \"\n              ></gn-ui-form-field>\n            </ng-container>\n          </ng-container>\n        </div>\n      </ng-container>\n    </ng-container>\n  </div>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "component", type: FormFieldComponent, selector: "gn-ui-form-field", inputs: ["model", "config", "value"], outputs: ["valueChange"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: RecordFormComponent, isStandalone: true, selector: "gn-ui-record-form", ngImport: i0, template: "<ng-container>\n  <div class=\"flex flex-col gap-6 p-8\">\n    <ng-container\n      *ngFor=\"\n        let section of facade.currentSections$ | async;\n        trackBy: sectionTracker\n      \"\n    >\n      <ng-container *ngIf=\"!section.hidden\">\n        <div class=\"flex flex-col gap-8 border p-8 rounded-[8px] shadow\">\n          <div\n            class=\"flex flex-col gap-2\"\n            [ngClass]=\"section.labelKey ? 'mb-4' : 'hidden'\"\n          >\n            <div\n              *ngIf=\"section.labelKey\"\n              class=\"text-2xl font-title text-secondary\"\n              translate\n            >\n              {{ section.labelKey }}\n            </div>\n            <div\n              *ngIf=\"section.descriptionKey\"\n              class=\"text-secondary-lightest\"\n              translate\n            >\n              {{ section.descriptionKey }}\n            </div>\n          </div>\n          <ng-container\n            *ngFor=\"\n              let field of section.fieldsWithValues;\n              trackBy: fieldTracker\n            \"\n          >\n            <ng-container *ngIf=\"!field.config.hidden\">\n              <gn-ui-form-field\n                [uniqueIdentifier]=\"recordUniqueIdentifier$ | async\"\n                [model]=\"field.config.model!\"\n                [config]=\"field.config.formFieldConfig\"\n                [value]=\"field.value\"\n                (valueChange)=\"\n                  handleFieldValueChange(field.config.model!, $event)\n                \"\n              ></gn-ui-form-field>\n            </ng-container>\n          </ng-container>\n        </div>\n      </ng-container>\n    </ng-container>\n  </div>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "component", type: FormFieldComponent, selector: "gn-ui-form-field", inputs: ["uniqueIdentifier", "model", "config", "value"], outputs: ["valueChange"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RecordFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-record-form', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, FormFieldComponent, TranslateModule], template: "<ng-container>\n  <div class=\"flex flex-col gap-6 p-8\">\n    <ng-container\n      *ngFor=\"\n        let section of facade.currentSections$ | async;\n        trackBy: sectionTracker\n      \"\n    >\n      <ng-container *ngIf=\"!section.hidden\">\n        <div class=\"flex flex-col gap-8 border p-8 rounded-[8px] shadow\">\n          <div\n            class=\"flex flex-col gap-2\"\n            [ngClass]=\"section.labelKey ? 'mb-4' : 'hidden'\"\n          >\n            <div\n              *ngIf=\"section.labelKey\"\n              class=\"text-2xl font-title text-secondary\"\n              translate\n            >\n              {{ section.labelKey }}\n            </div>\n            <div\n              *ngIf=\"section.descriptionKey\"\n              class=\"text-secondary-lightest\"\n              translate\n            >\n              {{ section.descriptionKey }}\n            </div>\n          </div>\n          <ng-container\n            *ngFor=\"\n              let field of section.fieldsWithValues;\n              trackBy: fieldTracker\n            \"\n          >\n            <ng-container *ngIf=\"!field.config.hidden\">\n              <gn-ui-form-field\n                [model]=\"field.config.model!\"\n                [config]=\"field.config.formFieldConfig\"\n                [value]=\"field.value\"\n                (valueChange)=\"\n                  handleFieldValueChange(field.config.model!, $event)\n                \"\n              ></gn-ui-form-field>\n            </ng-container>\n          </ng-container>\n        </div>\n      </ng-container>\n    </ng-container>\n  </div>\n</ng-container>\n" }]
+            args: [{ selector: 'gn-ui-record-form', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, FormFieldComponent, TranslateModule], template: "<ng-container>\n  <div class=\"flex flex-col gap-6 p-8\">\n    <ng-container\n      *ngFor=\"\n        let section of facade.currentSections$ | async;\n        trackBy: sectionTracker\n      \"\n    >\n      <ng-container *ngIf=\"!section.hidden\">\n        <div class=\"flex flex-col gap-8 border p-8 rounded-[8px] shadow\">\n          <div\n            class=\"flex flex-col gap-2\"\n            [ngClass]=\"section.labelKey ? 'mb-4' : 'hidden'\"\n          >\n            <div\n              *ngIf=\"section.labelKey\"\n              class=\"text-2xl font-title text-secondary\"\n              translate\n            >\n              {{ section.labelKey }}\n            </div>\n            <div\n              *ngIf=\"section.descriptionKey\"\n              class=\"text-secondary-lightest\"\n              translate\n            >\n              {{ section.descriptionKey }}\n            </div>\n          </div>\n          <ng-container\n            *ngFor=\"\n              let field of section.fieldsWithValues;\n              trackBy: fieldTracker\n            \"\n          >\n            <ng-container *ngIf=\"!field.config.hidden\">\n              <gn-ui-form-field\n                [uniqueIdentifier]=\"recordUniqueIdentifier$ | async\"\n                [model]=\"field.config.model!\"\n                [config]=\"field.config.formFieldConfig\"\n                [value]=\"field.value\"\n                (valueChange)=\"\n                  handleFieldValueChange(field.config.model!, $event)\n                \"\n              ></gn-ui-form-field>\n            </ng-container>\n          </ng-container>\n        </div>\n      </ng-container>\n    </ng-container>\n  </div>\n</ng-container>\n" }]
         }], ctorParameters: function () { return [{ type: EditorFacade }]; } });
 
 const ROUTER_STATE_KEY = 'router';
@@ -36829,7 +37154,7 @@ class RouterService {
     getOrganizationPageRoute() {
         return ROUTER_ROUTE_ORGANIZATION;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RouterService, deps: [{ token: ROUTER_CONFIG }, { token: i1$8.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RouterService, deps: [{ token: ROUTER_CONFIG }, { token: i1$9.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RouterService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RouterService, decorators: [{
@@ -36840,7 +37165,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [ROUTER_CONFIG]
-                }] }, { type: i1$8.Router }]; } });
+                }] }, { type: i1$9.Router }]; } });
 
 const goAction = createAction('[Router] Go', props());
 const backAction = createAction('[Router] Back');
@@ -37097,12 +37422,12 @@ class RouterEffects {
         this.navigateBack$ = createEffect(() => this._actions$.pipe(ofType(backAction), tap$1(() => this._location.back())), { dispatch: false });
         this.navigateForward$ = createEffect(() => this._actions$.pipe(ofType(forwardAction), tap$1(() => this._location.forward())), { dispatch: false });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RouterEffects, deps: [{ token: i1$9.Actions }, { token: i1$8.Router }, { token: i1$3.Location }, { token: RouterFacade }, { token: ROUTER_CONFIG }, { token: FieldsService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RouterEffects, deps: [{ token: i1$a.Actions }, { token: i1$9.Router }, { token: i1$3.Location }, { token: RouterFacade }, { token: ROUTER_CONFIG }, { token: FieldsService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RouterEffects }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RouterEffects, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i1$9.Actions }, { type: i1$8.Router }, { type: i1$3.Location }, { type: RouterFacade }, { type: undefined, decorators: [{
+        }], ctorParameters: function () { return [{ type: i1$a.Actions }, { type: i1$9.Router }, { type: i1$3.Location }, { type: RouterFacade }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [ROUTER_CONFIG]
                 }] }, { type: FieldsService }]; } });
@@ -37119,7 +37444,7 @@ class DefaultRouterModule {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DefaultRouterModule, deps: [{ token: RouterService }], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: DefaultRouterModule, declarations: [SearchRouterContainerDirective], imports: [i1$2.StoreFeatureModule, i3$4.StoreRouterConnectingModule, i1$9.EffectsFeatureModule], exports: [SearchRouterContainerDirective] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: DefaultRouterModule, declarations: [SearchRouterContainerDirective], imports: [i1$2.StoreFeatureModule, i3$4.StoreRouterConnectingModule, i1$a.EffectsFeatureModule], exports: [SearchRouterContainerDirective] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DefaultRouterModule, providers: [
             RouterFacade,
             {
@@ -37162,5 +37487,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ADD_RESULTS, ADD_SEARCH, AbstractAction, AbstractSearchField, AddLayerFromCatalogComponent, AddLayerRecordPreviewComponent, AddResults, AddSearch, AnchorLinkDirective, ApiCardComponent, AuthService, AutocompleteComponent, AvatarComponent, AvatarServiceInterface, BLOCK_MODEL_FIXTURE, BadgeComponent, BaseReader, BlockListComponent, ButtonComponent, CLEAR_ERROR, CLEAR_RESULTS, CONFIG_MALFORMED, CONFIG_MINIMAL, CONFIG_MISSING_MANDATORY, CONFIG_OK, CONFIG_UNRECOGNIZED_KEYS, CONFIG_WITH_TRANSLATIONS, CONFIG_WRONG_LANGUAGE_CODE, CarouselComponent, CatalogTitleComponent, ChartComponent, ChartViewComponent, CheckToggleComponent, CheckboxComponent, ChipsInputComponent, ClearError, ClearResults, ColorScaleComponent, ConfirmationDialogComponent, ContentGhostComponent, CopyTextButtonComponent, DEFAULT_BASELAYER_CONTEXT, DEFAULT_GN4_LOGIN_URL, DEFAULT_LANG, DEFAULT_PAGE_SIZE, DEFAULT_RESULTS_LAYOUT_CONFIG, DEFAULT_SEARCH_KEY, DEFAULT_STYLE_FIXTURE, DEFAULT_STYLE_HL_FIXTURE, DEFAULT_VIEW, DataService, DataViewComponent, DataViewPermalinkComponent, DataViewShareComponent, DataViewWebComponentComponent, DatePickerComponent, DateRangePickerComponent, DefaultRouterModule, DownloadItemComponent, DownloadsListComponent, DragAndDropFileInputComponent, DropdownMultiselectComponent, DropdownSelectorComponent, EDITOR_FEATURE_KEY, EMPTY_BLOCK_MODEL_FIXTURE, ES_QUERY_FIELDS_PRIORITY, ES_RESOURCES_VALUES, ES_SOURCE_SUMMARY, EditableLabelDirective, EditorFacade, EditorService, ElasticsearchService, EmbeddedTranslateLoader, ErrorComponent, ErrorType, ExpandablePanelButtonComponent, ExpandablePanelComponent, ExternalViewerButtonComponent, FACET_ITEM_FIXTURE, FEATURE_MAP_OPTIONS, FIELDS_BRIEF, FIELDS_SUMMARY, FILTER_GEOMETRY, FORMATS, FacetBlockComponent, FacetBlockStubComponent, FacetItemComponent, FacetItemStubComponent, FacetListComponent, FacetsContainerComponent, FacetsModule, FavoriteStarComponent, FavoritesService, FeatureAuthModule, FeatureCatalogModule, FeatureDatavizModule, FeatureDetailComponent, FeatureEditorModule, FeatureInfoService, FeatureMapModule, FeatureNotificationsModule, FeatureRecordModule, FeatureSearchModule, FetchError, FieldsService, FigureComponent, FigureContainerComponent, FileTranslateLoader, FilterDropdownComponent, FormFieldWrapperComponent, FullTextSearchField, FuzzySearchComponent, GN_UI_VERSION, GeoTableViewComponent, GeocodingComponent, Gn4Converter, Gn4PlatformMapper, Gn4PlatformService, Gn4Repository, Gn4SettingsService, GravatarService, HttpLoaderFactory, I18nInterceptor, ImageFallbackDirective, ImageOverlayPreviewComponent, InteractiveTableColumnComponent, InteractiveTableComponent, IsSpatialSearchField, Iso191153Converter, Iso19139Converter, LANGUAGES_LIST, LANGUAGE_NAMES, LANGUAGE_STORAGE_KEY, LANG_2_TO_3_MAPPER, LANG_3_TO_2_MAPPER, LOGIN_URL, LONLAT_CRS_CODES, LangService, LanguageSwitcherComponent, LayersPanelComponent, LicenseSearchField, LinkCardComponent, LinkClassifierService, LinkUsage, LoadingMaskComponent, LogService, MAP_CONFIG_FIXTURE, MAP_FEATURE_KEY, METADATA_LANGUAGE, MY_FORMATS, MapComponent, MapContainerComponent, MapContextComponent, MapContextLayerTypeEnum, MapContextService, MapFacade, MapInstanceDirective, MapManagerService, MapStyleService, MapUtilsService, MapViewComponent, MarkdownEditorComponent, MarkdownParserComponent, MaxLinesComponent, mdview_actions as MdViewActions, MdViewFacade, MetadataCatalogComponent, MetadataContactComponent, MetadataInfoComponent, MetadataLinkType, MetadataQualityComponent, MetadataQualityItemComponent, MultilingualSearchField, MyOrgService, NavigationButtonComponent, NotificationComponent, NotificationsContainerComponent, NotificationsService, ORGANIZATIONS_STRATEGY, ORGANIZATION_PAGE_URL_TOKEN, ORGANIZATION_URL_TOKEN, OrganisationPreviewComponent, OrganisationsComponent, OrganisationsFilterComponent, OrganisationsResultComponent, OrganizationSearchField, OrganizationsFromGroupsService, OrganizationsFromMetadataService, OwnerSearchField, PAGINATE, PARSE_DELIMITER, PATCH_RESULTS_AGGREGATIONS, PROXY_PATH, Paginate, PaginationButtonsComponent, PaginationComponent, PatchResultsAggregations, PopoverComponent, PopupAlertComponent, PreviousNextButtonsComponent, ProgressBarComponent, ProxyService, QUERY_FIELDS, RECORD_URL_TOKEN, REQUEST_MORE_ON_AGGREGATION, REQUEST_MORE_RESULTS, REQUEST_NEW_RESULTS, RESULTS_LAYOUT_CONFIG, ROUTER_CONFIG, ROUTER_ROUTE_DATASET, ROUTER_ROUTE_ORGANIZATION, ROUTER_ROUTE_SEARCH, ROUTER_STATE_KEY, ROUTE_PARAMS, RecordApiFormComponent, RecordFormComponent, RecordMetricComponent, RecordPreviewCardComponent, RecordPreviewComponent, RecordPreviewFeedComponent, RecordPreviewListComponent, RecordPreviewRowComponent, RecordPreviewTextComponent, RecordPreviewTitleComponent, RecordsMetricsComponent, RecordsService, RelatedRecordCardComponent, RequestMoreOnAggregation, RequestMoreResults, RequestNewResults, ResultsHitsContainerComponent, ResultsHitsNumberComponent, ResultsLayoutComponent, ResultsLayoutConfigItem, ResultsListComponent, ResultsListContainerComponent, ResultsListItemComponent, ResultsTableComponent, ResultsTableContainerComponent, RouterEffects, RouterFacade, RouterService, SEARCH_FEATURE_KEY, SET_CONFIG_AGGREGATIONS, SET_CONFIG_FILTERS, SET_CONFIG_REQUEST_FIELDS, SET_ERROR, SET_FAVORITES_ONLY, SET_FILTERS, SET_INCLUDE_ON_AGGREGATION, SET_PAGE_SIZE, SET_RESULTS_AGGREGATIONS, SET_RESULTS_HITS, SET_RESULTS_LAYOUT, SET_SEARCH, SET_SORT_BY, SET_SPATIAL_FILTER_ENABLED, SearchEffects, SearchFacade, SearchInputComponent, SearchRouterContainerDirective, SearchService, SearchStateContainerDirective, SelectionService, SetConfigAggregations, SetConfigFilters, SetConfigRequestFields, SetError, SetFavoritesOnly, SetFilters, SetIncludeOnAggregation, SetPageSize, SetResultsAggregations, SetResultsHits, SetResultsLayout, SetSearch, SetSortBy, SetSpatialFilterEnabled, SimpleSearchField, SiteTitleComponent, SortByComponent, SortableListComponent, SourceLabelComponent, SourcesService, SpinningLoaderComponent, StarToggleComponent, StepBarComponent, StickyHeaderComponent, SupportedTypes, TABLE_ITEM_FIXTURE, TABLE_ITEM_FIXTURE_HAB, THUMBNAIL_PLACEHOLDER, TRANSLATE_DEFAULT_CONFIG, TRANSLATE_WITH_OVERRIDES_CONFIG, TableComponent, TableViewComponent, TextAreaComponent, TextInputComponent, ThemeService, ThumbnailComponent, TranslatedSearchField, UPDATE_CONFIG_AGGREGATIONS, UPDATE_FILTERS, UPDATE_REQUEST_AGGREGATION_TERM, UiCatalogModule, UiDatavizModule, UiElementsModule, FacetsModule$1 as UiFacetsModule, UiInputsModule, UiLayoutModule, UiMapModule, UiSearchModule, UiWidgetsModule, UpdateConfigAggregations, UpdateFilters, UserPreviewComponent, UtilI18nModule, UtilSharedModule, ViewportIntersectorComponent, WEB_COMPONENT_EMBEDDER_URL, WFS_MAX_FEATURES, WizardComponent, WizardFieldComponent, WizardFieldType, WizardService, WizardSummarizeComponent, _reset, addLayer, changeLayerOrder, checkFileFormat, clearLayerError, createFuzzyFilter, currentPage, defaultMapOptions, downgradeImage, downsizeImage, draftSaveSuccess, dragPanCondition, dropEmptyTranslations, editorReducer, findConverterForDocument, getArrayItem, getAsArray, getAsUrl, getBadgeColor, getCustomTranslations, getError, getFavoritesOnly, getFileFormat, getFileFormatFromServiceOutput, getFirstValue, getFormatPriority, getGeometryFromGeoJSON, getGlobalConfig, getJsonDataItemsProxy, getLangFromBrowser, getLinkLabel, getLinkPriority, getMapLayers, getMapState, getMetadataQualityConfig, getMimeTypeForFormat, getOptionalMapConfig, getOptionalSearchConfig, getPageSize, getSearchConfigAggregations, getSearchFilters, getSearchResults, getSearchResultsAggregations, getSearchResultsHits, getSearchResultsLayout, getSearchResultsLoading, getSearchSortBy, getSearchState, getSearchStateSearch, getSpatialFilterEnabled, getTemporalRangeUnion, getThemeConfig, initSearch, initialEditorState, initialMapState, initialState, isBeginningOfResults, isConfigLoaded, isEndOfResults, isFormatInQueryParam, loadAppConfig, mapContact, mapKeywords, mapLogo, mapOrganization, mapReducer, markRecordAsChanged, megabytesToBytes, mimeTypeToFormat, mouseWheelZoomCondition, openDataset, openRecord, parse, placeholder, propagateToDocumentOnly, provideGn4, provideRepositoryUrl, readDataset, readDatasetHeaders, reducer$2 as reducer, reducerSearch, removeLayer, removeSearchParams, removeWhitespace, saveRecord, saveRecordFailure, saveRecordSuccess, selectCurrentPage, selectEditorConfig, selectEditorState, selectFallback, selectFallbackFields, selectField, selectRecord, selectRecordAlreadySavedOnce, selectRecordChangedSinceSave, selectRecordSaveError, selectRecordSaving, selectRecordSections, selectRecordSource, selectTranslatedField, selectTranslatedValue, setCurrentPage, setLayerError, sortByFromString, sortByToString, sortByToStrings, stripHtml, toDate, totalPages, updateLayer, updateRecordField };
+export { ADD_RESULTS, ADD_SEARCH, AbstractAction, AbstractSearchField, AddLayerFromCatalogComponent, AddLayerRecordPreviewComponent, AddResults, AddSearch, AnchorLinkDirective, ApiCardComponent, AuthService, AutocompleteComponent, AvatarComponent, AvatarServiceInterface, BLOCK_MODEL_FIXTURE, BadgeComponent, BaseReader, BlockListComponent, ButtonComponent, CLEAR_ERROR, CLEAR_RESULTS, CONFIG_MALFORMED, CONFIG_MINIMAL, CONFIG_MISSING_MANDATORY, CONFIG_OK, CONFIG_UNRECOGNIZED_KEYS, CONFIG_WITH_TRANSLATIONS, CONFIG_WRONG_LANGUAGE_CODE, CarouselComponent, CatalogTitleComponent, ChartComponent, ChartViewComponent, CheckToggleComponent, CheckboxComponent, ChipsInputComponent, ClearError, ClearResults, ColorScaleComponent, ConfirmationDialogComponent, ContentGhostComponent, CopyTextButtonComponent, DEFAULT_BASELAYER_CONTEXT, DEFAULT_GN4_LOGIN_URL, DEFAULT_LANG, DEFAULT_PAGE_SIZE, DEFAULT_RESULTS_LAYOUT_CONFIG, DEFAULT_SEARCH_KEY, DEFAULT_STYLE_FIXTURE, DEFAULT_STYLE_HL_FIXTURE, DEFAULT_VIEW, DataService, DataViewComponent, DataViewPermalinkComponent, DataViewShareComponent, DataViewWebComponentComponent, DatePickerComponent, DateRangePickerComponent, DefaultRouterModule, DownloadItemComponent, DownloadsListComponent, DragAndDropFileInputComponent, DropdownMultiselectComponent, DropdownSelectorComponent, EDITOR_FEATURE_KEY, EMPTY_BLOCK_MODEL_FIXTURE, ES_QUERY_FIELDS_PRIORITY, ES_RESOURCES_VALUES, ES_SOURCE_SUMMARY, EditableLabelDirective, EditorFacade, EditorService, ElasticsearchService, EmbeddedTranslateLoader, ErrorComponent, ErrorType, ExpandablePanelButtonComponent, ExpandablePanelComponent, ExternalViewerButtonComponent, FACET_ITEM_FIXTURE, FEATURE_MAP_OPTIONS, FIELDS_BRIEF, FIELDS_SUMMARY, FILTER_GEOMETRY, FORMATS, FacetBlockComponent, FacetBlockStubComponent, FacetItemComponent, FacetItemStubComponent, FacetListComponent, FacetsContainerComponent, FacetsModule, FavoriteStarComponent, FavoritesService, FeatureAuthModule, FeatureCatalogModule, FeatureDatavizModule, FeatureDetailComponent, FeatureEditorModule, FeatureInfoService, FeatureMapModule, FeatureNotificationsModule, FeatureRecordModule, FeatureSearchModule, FetchError, FieldsService, FigureComponent, FigureContainerComponent, FileTranslateLoader, FilterDropdownComponent, FormFieldWrapperComponent, FullTextSearchField, FuzzySearchComponent, GN_UI_VERSION, GeoTableViewComponent, GeocodingComponent, Gn4Converter, Gn4PlatformMapper, Gn4PlatformService, Gn4Repository, Gn4SettingsService, GravatarService, HttpLoaderFactory, I18nInterceptor, ImageFallbackDirective, ImageOverlayPreviewComponent, InteractiveTableColumnComponent, InteractiveTableComponent, IsSpatialSearchField, Iso191153Converter, Iso19139Converter, LANGUAGES_LIST, LANGUAGE_NAMES, LANGUAGE_STORAGE_KEY, LANG_2_TO_3_MAPPER, LANG_3_TO_2_MAPPER, LOGIN_URL, LONLAT_CRS_CODES, LangService, LanguageSwitcherComponent, LayersPanelComponent, LicenseSearchField, LinkCardComponent, LinkClassifierService, LinkUsage, LoadingMaskComponent, LogService, MAP_CONFIG_FIXTURE, MAP_FEATURE_KEY, METADATA_LANGUAGE, MY_FORMATS, MapComponent, MapContainerComponent, MapContextComponent, MapContextLayerTypeEnum, MapContextService, MapFacade, MapInstanceDirective, MapManagerService, MapStyleService, MapUtilsService, MapViewComponent, MarkdownEditorComponent, MarkdownParserComponent, MaxLinesComponent, mdview_actions as MdViewActions, MdViewFacade, MetadataCatalogComponent, MetadataContactComponent, MetadataInfoComponent, MetadataLinkType, MetadataQualityComponent, MetadataQualityItemComponent, MultilingualSearchField, MyOrgService, NavigationButtonComponent, NotificationComponent, NotificationsContainerComponent, NotificationsService, ORGANIZATIONS_STRATEGY, ORGANIZATION_PAGE_URL_TOKEN, ORGANIZATION_URL_TOKEN, OrganisationPreviewComponent, OrganisationsComponent, OrganisationsFilterComponent, OrganisationsResultComponent, OrganizationSearchField, OrganizationsFromGroupsService, OrganizationsFromMetadataService, OwnerSearchField, PAGINATE, PARSE_DELIMITER, PATCH_RESULTS_AGGREGATIONS, PROXY_PATH, Paginate, PaginationButtonsComponent, PaginationComponent, PatchResultsAggregations, PopoverComponent, PopupAlertComponent, PreviousNextButtonsComponent, ProgressBarComponent, ProxyService, QUERY_FIELDS, RECORD_URL_TOKEN, REQUEST_MORE_ON_AGGREGATION, REQUEST_MORE_RESULTS, REQUEST_NEW_RESULTS, RESULTS_LAYOUT_CONFIG, ROUTER_CONFIG, ROUTER_ROUTE_DATASET, ROUTER_ROUTE_ORGANIZATION, ROUTER_ROUTE_SEARCH, ROUTER_STATE_KEY, ROUTE_PARAMS, RecordApiFormComponent, RecordFormComponent, RecordMetricComponent, RecordPreviewCardComponent, RecordPreviewComponent, RecordPreviewFeedComponent, RecordPreviewListComponent, RecordPreviewRowComponent, RecordPreviewTextComponent, RecordPreviewTitleComponent, RecordsMetricsComponent, RecordsService, RelatedRecordCardComponent, RequestMoreOnAggregation, RequestMoreResults, RequestNewResults, ResultsHitsContainerComponent, ResultsHitsNumberComponent, ResultsLayoutComponent, ResultsLayoutConfigItem, ResultsListComponent, ResultsListContainerComponent, ResultsListItemComponent, ResultsTableComponent, ResultsTableContainerComponent, RouterEffects, RouterFacade, RouterService, SEARCH_FEATURE_KEY, SET_CONFIG_AGGREGATIONS, SET_CONFIG_FILTERS, SET_CONFIG_REQUEST_FIELDS, SET_ERROR, SET_FAVORITES_ONLY, SET_FILTERS, SET_INCLUDE_ON_AGGREGATION, SET_PAGE_SIZE, SET_RESULTS_AGGREGATIONS, SET_RESULTS_HITS, SET_RESULTS_LAYOUT, SET_SEARCH, SET_SORT_BY, SET_SPATIAL_FILTER_ENABLED, SearchEffects, SearchFacade, SearchInputComponent, SearchRouterContainerDirective, SearchService, SearchStateContainerDirective, SelectionService, SetConfigAggregations, SetConfigFilters, SetConfigRequestFields, SetError, SetFavoritesOnly, SetFilters, SetIncludeOnAggregation, SetPageSize, SetResultsAggregations, SetResultsHits, SetResultsLayout, SetSearch, SetSortBy, SetSpatialFilterEnabled, SimpleSearchField, SiteTitleComponent, SortByComponent, SortableListComponent, SourceLabelComponent, SourcesService, SpinningLoaderComponent, StarToggleComponent, StepBarComponent, StickyHeaderComponent, SupportedTypes, SwitchToggleComponent, TABLE_ITEM_FIXTURE, TABLE_ITEM_FIXTURE_HAB, THUMBNAIL_PLACEHOLDER, TRANSLATE_DEFAULT_CONFIG, TRANSLATE_WITH_OVERRIDES_CONFIG, TableComponent, TableViewComponent, TextAreaComponent, TextInputComponent, ThemeService, ThumbnailComponent, TranslatedSearchField, UPDATE_CONFIG_AGGREGATIONS, UPDATE_FILTERS, UPDATE_REQUEST_AGGREGATION_TERM, UiCatalogModule, UiDatavizModule, UiElementsModule, FacetsModule$1 as UiFacetsModule, UiInputsModule, UiLayoutModule, UiMapModule, UiSearchModule, UiWidgetsModule, UpdateConfigAggregations, UpdateFilters, UserPreviewComponent, UtilI18nModule, UtilSharedModule, ViewportIntersectorComponent, WEB_COMPONENT_EMBEDDER_URL, WFS_MAX_FEATURES, WizardComponent, WizardFieldComponent, WizardFieldType, WizardService, WizardSummarizeComponent, _reset, addLayer, changeLayerOrder, checkFileFormat, clearLayerError, createFuzzyFilter, currentPage, defaultMapOptions, downgradeImage, downsizeImage, draftSaveSuccess, dragPanCondition, dropEmptyTranslations, editorReducer, findConverterForDocument, getArrayItem, getAsArray, getAsUrl, getBadgeColor, getCustomTranslations, getError, getFavoritesOnly, getFileFormat, getFileFormatFromServiceOutput, getFirstValue, getFormatPriority, getGeometryFromGeoJSON, getGlobalConfig, getJsonDataItemsProxy, getLangFromBrowser, getLinkLabel, getLinkPriority, getMapLayers, getMapState, getMetadataQualityConfig, getMimeTypeForFormat, getOptionalMapConfig, getOptionalSearchConfig, getPageSize, getSearchConfigAggregations, getSearchFilters, getSearchResults, getSearchResultsAggregations, getSearchResultsHits, getSearchResultsLayout, getSearchResultsLoading, getSearchSortBy, getSearchState, getSearchStateSearch, getSpatialFilterEnabled, getTemporalRangeUnion, getThemeConfig, initSearch, initialEditorState, initialMapState, initialState, isBeginningOfResults, isConfigLoaded, isEndOfResults, isFormatInQueryParam, loadAppConfig, mapContact, mapKeywords, mapLogo, mapOrganization, mapReducer, markRecordAsChanged, megabytesToBytes, mimeTypeToFormat, mouseWheelZoomCondition, openDataset, openRecord, parse, placeholder, propagateToDocumentOnly, provideGn4, provideRepositoryUrl, readDataset, readDatasetHeaders, reducer$2 as reducer, reducerSearch, removeLayer, removeSearchParams, removeWhitespace, saveRecord, saveRecordFailure, saveRecordSuccess, selectCurrentPage, selectEditorConfig, selectEditorState, selectFallback, selectFallbackFields, selectField, selectRecord, selectRecordAlreadySavedOnce, selectRecordChangedSinceSave, selectRecordSaveError, selectRecordSaving, selectRecordSections, selectRecordSource, selectTranslatedField, selectTranslatedValue, setCurrentPage, setLayerError, sortByFromString, sortByToString, sortByToStrings, stripHtml, toDate, totalPages, undoRecordDraft, updateLayer, updateRecordField };
 //# sourceMappingURL=geonetwork-ui.mjs.map