geonetwork-ui 2.11.0-dev.a5c259d9e → 2.11.0-dev.aed5b2e5b

package/fesm2022/geonetwork-ui.mjs

@@ -8,7 +8,7 @@ import { format } from 'date-fns/format';
 import { Namespace, Literal, lit, parse as parse$2, sym, BlankNode, graph } from 'rdflib';
 import { lastValueFrom, fromEvent, startWith, map as map$2, shareReplay, filter, pairwise, of, switchMap, Subject, forkJoin, combineLatest, from, exhaustMap, throwError, takeLast, firstValueFrom, merge, BehaviorSubject, timer, ReplaySubject, Subscription, first, distinctUntilChanged as distinctUntilChanged$1, animationFrameScheduler, debounceTime as debounceTime$1, Observable, buffer, tap as tap$2, combineLatestWith, take as take$1, catchError as catchError$1, takeUntil, EMPTY, mergeMap as mergeMap$1, withLatestFrom as withLatestFrom$1 } from 'rxjs';
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, Injectable, NgModule, Injector, provideAppInitializer, makeEnvironmentProviders, ElementRef, HostListener, Input, Directive, Renderer2, DestroyRef, EventEmitter, Output, ViewChild, ChangeDetectionStrategy, Component, ViewEncapsulation, ChangeDetectorRef, HostBinding, ViewContainerRef, TemplateRef, ViewChildren, ContentChild, input, output, signal, viewChild, computed, ContentChildren, NgZone, ComponentFactoryResolver, afterNextRender, viewChildren } from '@angular/core';
+import { InjectionToken, inject, Injectable, NgModule, Injector, provideAppInitializer, makeEnvironmentProviders, ElementRef, afterNextRender, booleanAttribute, Input, Directive, HostListener, Renderer2, DestroyRef, EventEmitter, Output, ViewChild, ChangeDetectionStrategy, Component, ViewEncapsulation, ChangeDetectorRef, HostBinding, ViewContainerRef, TemplateRef, ViewChildren, ContentChild, input, output, signal, viewChild, computed, ContentChildren, NgZone, ComponentFactoryResolver, viewChildren } from '@angular/core';
 import { HttpClient, HttpHeaders, HttpParams, HTTP_INTERCEPTORS, provideHttpClient, withInterceptorsFromDi, HttpEventType } from '@angular/common/http';
 import * as i4 from '@ngx-translate/core';
 import { TranslateLoader, TranslateCompiler, TranslateDefaultParser, TranslateParser, TranslateService, provideTranslateService, TranslateDirective, TranslatePipe, TranslateModule } from '@ngx-translate/core';
@@ -18,7 +18,7 @@ import { map as map$1, shareReplay as shareReplay$1, catchError, tap as tap$1, f
 import { lt, valid, coerce, satisfies, ltr } from 'semver';
 import chroma from 'chroma-js';
 import * as i1$1 from '@angular/common';
-import { Location, CommonModule, NgClass, NgTemplateOutlet, DatePipe, AsyncPipe } from '@angular/common';
+import { Location, CommonModule, NgTemplateOutlet, NgClass, AsyncPipe } from '@angular/common';
 import { formatDistance } from 'date-fns/formatDistance';
 import { Scroll, NavigationEnd, Router, RouteReuseStrategy } from '@angular/router';
 import { WmtsEndpoint, WmsEndpoint, WfsEndpoint, OgcApiEndpoint, sharedFetch, useCache, StacEndpoint, TmsEndpoint } from '@camptocamp/ogc-client';
@@ -43,8 +43,8 @@ import CircleStyle from 'ol/style/Circle.js';
 import EmblaCarousel from 'embla-carousel';
 import { iconoirNavArrowLeft, iconoirNavArrowRight, iconoirLongArrowDownLeft, iconoirSearch, iconoirCalendar, iconoirArrowUp, iconoirLink, iconoirFramePlusIn, iconoirCloudUpload, iconoirTrash, iconoirSquareDashed, iconoirImport, iconoirCheckCircle, iconoirReduce, iconoirNavArrowUp, iconoirNavArrowDown, iconoirExpand, iconoirSettings, iconoirDownload, iconoirPlus, iconoirBin, iconoirMediaImageXmark, iconoirMediaImage, iconoirAppWindow, iconoirCode, iconoirDatabase, iconoirAppleWallet, iconoirBank, iconoirList, iconoirTranslate, iconoirLock, iconoirUser, iconoirArrowLeft, iconoirLightBulbOn, iconoirBadgeCheck, iconoirSystemShut, iconoirCircle, iconoirAttachment, iconoirRefresh } from '@ng-icons/iconoir';
 import { MatButtonModule } from '@angular/material/button';
-import * as i1$8 from '@angular/cdk/overlay';
-import { OverlayContainer, ScrollStrategyOptions, OverlayModule, CdkConnectedOverlay, ScrollDispatcher, Overlay, CdkOverlayOrigin } from '@angular/cdk/overlay';
+import * as i1$7 from '@angular/cdk/overlay';
+import { ScrollStrategyOptions, OverlayModule, CdkConnectedOverlay, ScrollDispatcher, Overlay, CdkOverlayOrigin } from '@angular/cdk/overlay';
 import * as i1$3 from '@angular/forms';
 import { UntypedFormControl, ReactiveFormsModule, FormsModule } from '@angular/forms';
 import * as i1$2 from '@angular/material/autocomplete';
@@ -52,15 +52,17 @@ import { MatAutocompleteModule, MatAutocompleteTrigger, MatAutocomplete } from '
 import tippy from 'tippy.js';
 import * as i2 from '@angular/material/progress-spinner';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-import { matClose, matContentCopy, matExpandLess, matExpandMore, matSearch, matStarBorder, matStar, matRemove, matAdd, matChevronRight, matChevronLeft, matArrowForwardIos, matArrowBackIos, matMoodBad, matQuestionMark, matFace, matZoomOutMap, matOpenInNew, matPersonOutline, matMailOutline, matWarningAmber, matCheck, matCheckCircleOutline, matWarning, matMoreVert } from '@ng-icons/material-icons/baseline';
+import { matClose, matContentCopy, matExpandMore, matExpandLess, matSearch, matStarBorder, matStar, matRemove, matAdd, matChevronRight, matChevronLeft, matArrowForwardIos, matArrowBackIos, matMoodBad, matQuestionMark, matFace, matZoomOutMap, matOpenInNew, matPersonOutline, matMailOutline, matWarningAmber, matCheck, matCheckCircleOutline, matWarning, matMoreVert } from '@ng-icons/material-icons/baseline';
 import * as i1$4 from '@angular/material/checkbox';
 import { MatCheckboxModule } from '@angular/material/checkbox';
 import * as i1$5 from '@angular/material/tooltip';
 import { MatTooltipModule } from '@angular/material/tooltip';
-import { DateAdapter, MatNativeDateModule, MAT_DATE_LOCALE } from '@angular/material/core';
+import { MAT_DATE_LOCALE, MAT_DATE_FORMATS, DateAdapter } from '@angular/material/core';
+import { MAT_DATE_FNS_FORMATS, DateFnsAdapter } from '@angular/material-date-fns-adapter';
+import { enUS } from 'date-fns/locale/en-US';
 import * as i1$6 from '@angular/material/datepicker';
 import { MatDatepickerModule } from '@angular/material/datepicker';
-import * as i1$7 from 'ngx-dropzone';
+import * as i1$8 from 'ngx-dropzone';
 import { NgxDropzoneModule, NgxDropzoneComponent } from 'ngx-dropzone';
 import * as i1$9 from '@angular/material/button-toggle';
 import { MatButtonToggleModule } from '@angular/material/button-toggle';
@@ -19467,10 +19469,10 @@ class DateService {
         const dateObj = this.getDateObject(date);
         return { locale, dateObj };
     }
-    async getDateLocale() {
+    async getDateFnsLocale() {
         const lang = this.translateService.getCurrentLang() || DEFAULT_LANGUAGE;
         const locales = await this.dateLocales;
-        return locales[lang];
+        return locales[lang] ?? locales[DEFAULT_LANGUAGE];
     }
     formatDate(date, options) {
         const { locale, dateObj } = this.getLocaleAndDate(date);
@@ -19483,7 +19485,7 @@ class DateService {
     async formatRelativeDateTime(date) {
         const dateObj = this.getDateObject(date);
         const now = new Date();
-        const locale = await this.getDateLocale();
+        const locale = await this.getDateFnsLocale();
         return formatDistance(dateObj, now, {
             addSuffix: true,
             locale: locale,
@@ -20374,6 +20376,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                 }]
         }] });
 
+class AutofocusDirective {
+    constructor() {
+        this.el = inject(ElementRef);
+        this.injector = inject(Injector);
+    }
+    set autofocus(active) {
+        if (!active)
+            return;
+        afterNextRender(() => this.el.nativeElement.focus(), {
+            injector: this.injector,
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: AutofocusDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "20.3.19", type: AutofocusDirective, isStandalone: true, selector: "[gnUiAutofocus]", inputs: { autofocus: ["gnUiAutofocus", "autofocus", booleanAttribute] }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: AutofocusDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[gnUiAutofocus]',
+                    standalone: true,
+                }]
+        }], propDecorators: { autofocus: [{
+                type: Input,
+                args: [{ alias: 'gnUiAutofocus', transform: booleanAttribute }]
+            }] } });
+
 class ImageFallbackDirective {
     constructor() {
         this.el = inject(ElementRef);
@@ -20401,7 +20429,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
             }] } });
 
 var name = "geonetwork-ui";
-var version = "2.11.0-dev.a5c259d9e";
+var version = "2.11.0-dev.aed5b2e5b";
 var engines = {
 	node: ">=24"
 };
@@ -24590,12 +24618,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                 type: Input
             }] } });
 
+function provideLocalizedDateAdapter() {
+    return [
+        { provide: MAT_DATE_LOCALE, useValue: enUS },
+        { provide: MAT_DATE_FORMATS, useValue: MAT_DATE_FNS_FORMATS },
+        {
+            provide: DateAdapter,
+            useFactory: () => {
+                const dateService = inject(DateService);
+                const adapter = new DateFnsAdapter();
+                dateService
+                    .getDateFnsLocale()
+                    .then((locale) => adapter.setLocale(locale));
+                return adapter;
+            },
+        },
+    ];
+}
+
 class DatePickerComponent {
     constructor() {
-        this.dateAdapter = inject(DateAdapter);
-        this.translate = inject(TranslateService);
         this.dateChange = new EventEmitter();
-        this.dateAdapter.setLocale(this.translate.getCurrentLang());
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DatePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: DatePickerComponent, isStandalone: true, selector: "gn-ui-date-picker", inputs: { date: "date" }, outputs: { dateChange: "dateChange" }, providers: [
@@ -24603,30 +24646,19 @@ class DatePickerComponent {
             provideNgIconsConfig({
                 size: '1.5rem',
             }),
-            {
-                provide: MAT_DATE_LOCALE,
-                useFactory: (locale) => locale,
-            },
-        ], ngImport: i0, template: "<span class=\"w-full inline-block relative\">\n  <input\n    class=\"gn-ui-text-input pr-[var(--text-padding)]\"\n    [matDatepicker]=\"picker\"\n    [value]=\"date\"\n    (dateChange)=\"dateChange.emit($event.value)\"\n  />\n  <gn-ui-button\n    type=\"light\"\n    class=\"absolute inset-y-[var(--side-padding)] right-[var(--side-padding)] z-10\"\n    (buttonClick)=\"picker.open()\"\n    data-cy=\"date-picker-button\"\n    extraClass=\"h-full\"\n  >\n    <ng-icon name=\"iconoirCalendar\" class=\"text-primary\"></ng-icon>\n  </gn-ui-button>\n</span>\n<mat-datepicker #picker></mat-datepicker>\n", styles: [":host{--gn-ui-button-rounded: 8px;--gn-ui-button-width: 32px;--gn-ui-button-padding: 0;--side-padding: calc(var(--gn-ui-text-input-padding, .6em) - 6px);--text-padding: calc(var(--side-padding) + 40px)}\n"], dependencies: [{ kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i1$6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i1$6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+            provideLocalizedDateAdapter(),
+        ], ngImport: i0, template: "<span class=\"w-full inline-block relative\">\n  <input\n    class=\"gn-ui-text-input pr-[var(--text-padding)]\"\n    [matDatepicker]=\"picker\"\n    [value]=\"date\"\n    (dateChange)=\"dateChange.emit($event.value)\"\n  />\n  <gn-ui-button\n    type=\"light\"\n    class=\"absolute inset-y-[var(--side-padding)] right-[var(--side-padding)] z-10\"\n    (buttonClick)=\"picker.open()\"\n    data-cy=\"date-picker-button\"\n    extraClass=\"h-full\"\n  >\n    <ng-icon name=\"iconoirCalendar\" class=\"text-primary\"></ng-icon>\n  </gn-ui-button>\n</span>\n<mat-datepicker #picker></mat-datepicker>\n", styles: [":host{--gn-ui-button-rounded: 8px;--gn-ui-button-width: 32px;--gn-ui-button-padding: 0;--side-padding: calc(var(--gn-ui-text-input-padding, .6em) - 6px);--text-padding: calc(var(--side-padding) + 40px)}\n"], dependencies: [{ kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i1$6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i1$6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DatePickerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-date-picker', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        MatNativeDateModule,
-                        MatDatepickerModule,
-                        ButtonComponent,
-                        NgIconComponent,
-                    ], providers: [
+            args: [{ selector: 'gn-ui-date-picker', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [MatDatepickerModule, ButtonComponent, NgIconComponent], providers: [
                         provideIcons({ iconoirCalendar }),
                         provideNgIconsConfig({
                             size: '1.5rem',
                         }),
-                        {
-                            provide: MAT_DATE_LOCALE,
-                            useFactory: (locale) => locale,
-                        },
+                        provideLocalizedDateAdapter(),
                     ], template: "<span class=\"w-full inline-block relative\">\n  <input\n    class=\"gn-ui-text-input pr-[var(--text-padding)]\"\n    [matDatepicker]=\"picker\"\n    [value]=\"date\"\n    (dateChange)=\"dateChange.emit($event.value)\"\n  />\n  <gn-ui-button\n    type=\"light\"\n    class=\"absolute inset-y-[var(--side-padding)] right-[var(--side-padding)] z-10\"\n    (buttonClick)=\"picker.open()\"\n    data-cy=\"date-picker-button\"\n    extraClass=\"h-full\"\n  >\n    <ng-icon name=\"iconoirCalendar\" class=\"text-primary\"></ng-icon>\n  </gn-ui-button>\n</span>\n<mat-datepicker #picker></mat-datepicker>\n", styles: [":host{--gn-ui-button-rounded: 8px;--gn-ui-button-width: 32px;--gn-ui-button-padding: 0;--side-padding: calc(var(--gn-ui-text-input-padding, .6em) - 6px);--text-padding: calc(var(--side-padding) + 40px)}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { date: [{
+        }], propDecorators: { date: [{
                 type: Input
             }], dateChange: [{
                 type: Output
@@ -24634,58 +24666,159 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
 
 class DateRangeDropdownComponent {
     constructor() {
-        this.overlayContainer = inject(OverlayContainer);
+        this.scrollStrategies = inject(ScrollStrategyOptions);
+        this.dateAdapter = inject(DateAdapter);
+        this.dateFormats = inject(MAT_DATE_FORMATS);
         this.cdr = inject(ChangeDetectorRef);
-        this.startDateChange = new EventEmitter();
-        this.endDateChange = new EventEmitter();
-        this.isPickerDisplayed = false;
+        this.dateRange = {};
+        this.dateRangeChange = new EventEmitter();
+        this.overlayPositions = [
+            {
+                originX: 'start',
+                originY: 'bottom',
+                overlayX: 'start',
+                overlayY: 'top',
+                offsetY: 8,
+            },
+            {
+                originX: 'start',
+                originY: 'top',
+                overlayX: 'start',
+                overlayY: 'bottom',
+                offsetY: -8,
+            },
+        ];
+        this.scrollStrategy = this.scrollStrategies.reposition();
+        this.overlayOpen = false;
+        this.expandedBound = 'start';
+        this.invalidBounds = { start: false, end: false };
+        // redraw when the lazily loaded UI locale reaches the adapter
+        this.dateAdapter.localeChanges
+            .pipe(takeUntilDestroyed())
+            .subscribe(() => this.cdr.markForCheck());
     }
-    ngAfterViewChecked() {
-        this.checkPickerOverlay();
+    get startDate() {
+        return this.dateRange.start;
     }
-    checkPickerOverlay() {
-        const overlayContainerElement = this.overlayContainer.getContainerElement();
-        setTimeout(() => {
-            this.isPickerDisplayed =
-                overlayContainerElement.querySelector('.mat-datepicker-content') !==
-                    null;
-            this.cdr.detectChanges();
-        }, 200); // FIXME: find a better way to deal with animation delay
+    get endDate() {
+        return this.dateRange.end;
+    }
+    get selectedDatesCount() {
+        return (this.startDate ? 1 : 0) + (this.endDate ? 1 : 0);
+    }
+    openOverlay() {
+        this.expandedBound = 'start';
+        this.overlayOpen = true;
+    }
+    closeOverlay() {
+        this.overlayOpen = false;
+    }
+    toggleBound(bound) {
+        this.expandedBound = this.expandedBound === bound ? null : bound;
+    }
+    formatDate(date) {
+        return this.dateAdapter.format(date, this.dateFormats.display.dateInput);
+    }
+    onDateInput(bound, event) {
+        const typedText = event.target.value.trim();
+        const date = typedText
+            ? this.dateAdapter.parse(typedText, this.dateFormats.parse.dateInput)
+            : null;
+        if (!this.isAcceptable(bound, typedText, date)) {
+            // keep the text as typed and flag it; the filter stays on its last value
+            this.invalidBounds = { ...this.invalidBounds, [bound]: true };
+            return;
+        }
+        if (bound === 'start')
+            this.setStartDate(date);
+        else
+            this.setEndDate(date);
+    }
+    normalizeDateInput(bound, event) {
+        if (this.invalidBounds[bound])
+            return;
+        const date = bound === 'start' ? this.startDate : this.endDate;
+        const input = event.target;
+        input.value = date ? this.formatDate(date) : '';
+    }
+    isAcceptable(bound, typedText, date) {
+        if (!typedText)
+            return true;
+        if (!date || !this.dateAdapter.isValid(date))
+            return false;
+        return bound === 'start'
+            ? !this.endDate || date <= this.endDate
+            : !this.startDate || date >= this.startDate;
+    }
+    setStartDate(date) {
+        this.invalidBounds = { ...this.invalidBounds, start: false };
+        this.applyDateRange({ ...this.dateRange, start: date });
+        this.expandedBound = 'end';
+    }
+    setEndDate(date) {
+        this.invalidBounds = { ...this.invalidBounds, end: false };
+        this.applyDateRange({ ...this.dateRange, end: date });
+        this.expandedBound = null;
+    }
+    clearDates(event) {
+        this.invalidBounds = { start: false, end: false };
+        this.expandedBound = 'start';
+        this.applyDateRange({});
+        propagateToDocumentOnly(event);
+    }
+    applyDateRange(dateRange) {
+        this.dateRange = {
+            ...(dateRange.start && { start: dateRange.start }),
+            ...(dateRange.end && { end: dateRange.end }),
+        };
+        this.dateRangeChange.emit(this.dateRange);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DateRangeDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: DateRangeDropdownComponent, isStandalone: true, selector: "gn-ui-date-range-dropdown", inputs: { title: "title", startDate: "startDate", endDate: "endDate" }, outputs: { startDateChange: "startDateChange", endDateChange: "endDateChange" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: DateRangeDropdownComponent, isStandalone: true, selector: "gn-ui-date-range-dropdown", inputs: { title: "title", dateRange: "dateRange" }, outputs: { dateRangeChange: "dateRangeChange" }, providers: [
             provideIcons({
-                matExpandMore,
+                iconoirCalendar,
+                matClose,
                 matExpandLess,
+                matExpandMore,
             }),
-        ], viewQueries: [{ propertyName: "picker", first: true, predicate: ["picker"], descendants: true }], ngImport: i0, template: "<gn-ui-button\n  type=\"outline\"\n  extraClass=\"bg-background w-full !p-[8px] !pl-[16px]\"\n  (buttonClick)=\"picker.open()\"\n>\n  <div class=\"grow flex items-center mr-2 gap-2 overflow-hidden\">\n    <div class=\"text-left font-medium truncate py-1\">\n      {{ title }}\n    </div>\n  </div>\n  <ng-icon\n    [name]=\"isPickerDisplayed ? 'matExpandLess' : 'matExpandMore'\"\n    class=\"shrink-0 opacity-40\"\n  >\n  </ng-icon>\n</gn-ui-button>\n<!--date range input is just present for output events and hidden from the DOM-->\n<mat-date-range-input [rangePicker]=\"picker\">\n  <input\n    matStartDate\n    [value]=\"startDate\"\n    (dateInput)=\"startDateChange.emit($event.value)\"\n  />\n  <input\n    matEndDate\n    [value]=\"endDate\"\n    (dateInput)=\"endDateChange.emit($event.value)\"\n  />\n</mat-date-range-input>\n<mat-date-range-picker #picker></mat-date-range-picker>\n", styles: [":host .mat-date-range-input-container{display:none}\n"], dependencies: [{ kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i1$6.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i1$6.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i1$6.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i1$6.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }] }); }
+            provideNgIconsConfig({
+                size: '1.5rem',
+            }),
+            provideLocalizedDateAdapter(),
+        ], viewQueries: [{ propertyName: "overlayOrigin", first: true, predicate: ["overlayOrigin"], descendants: true }], ngImport: i0, template: "<gn-ui-button\n  type=\"outline\"\n  extraClass=\"bg-background w-full !p-[8px] !pl-[16px]\"\n  [title]=\"title\"\n  (buttonClick)=\"openOverlay()\"\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    @if (selectedDatesCount) {\n      <div\n        class=\"gn-ui-multiselect-counter shrink-0 rounded-full font-bold text-[12px] w-5 h-5 flex items-center justify-center mr-1 selected-count\"\n      >\n        {{ selectedDatesCount }}\n      </div>\n    }\n  </div>\n  <button\n    class=\"h-6 w-6 flex items-center justify-center\"\n    data-test=\"dropdown-clear\"\n  >\n    @if (selectedDatesCount && !overlayOpen) {\n      <ng-icon\n        class=\"shrink-0 opacity-40 hover:opacity-80 transition-colors clear-btn\"\n        (click)=\"clearDates($event)\"\n        name=\"matClose\"\n      ></ng-icon>\n    }\n  </button>\n  <ng-icon\n    data-test=\"dropdown-toggle\"\n    [name]=\"overlayOpen ? 'matExpandLess' : 'matExpandMore'\"\n    class=\"shrink-0 opacity-40\"\n  >\n  </ng-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  (overlayOutsideClick)=\"closeOverlay()\"\n  (detach)=\"closeOverlay()\"\n>\n  <div\n    class=\"w-[296px] flex flex-col gap-2 bg-white border border-gray-400 rounded px-4 py-3 shadow-lg text-main text-[16px] leading-[24px]\"\n    data-test=\"date-range-panel\"\n  >\n    <div class=\"flex flex-col justify-center border-b border-gray-300 pb-1\">\n      <ng-container\n        [ngTemplateOutlet]=\"boundRow\"\n        [ngTemplateOutletContext]=\"{\n          bound: 'start',\n          label: 'daterange.filter.from',\n          date: startDate,\n        }\"\n      ></ng-container>\n      @if (expandedBound === 'start') {\n        <div class=\"calendar\" animate.enter=\"expand\" animate.leave=\"collapse\">\n          <mat-calendar\n            data-test=\"start-date-calendar\"\n            [selected]=\"startDate\"\n            [startAt]=\"startDate ?? endDate\"\n            [maxDate]=\"endDate\"\n            (selectedChange)=\"setStartDate($event)\"\n          ></mat-calendar>\n        </div>\n      }\n    </div>\n    <div class=\"flex flex-col justify-center\">\n      <ng-container\n        [ngTemplateOutlet]=\"boundRow\"\n        [ngTemplateOutletContext]=\"{\n          bound: 'end',\n          label: 'daterange.filter.to',\n          date: endDate,\n        }\"\n      ></ng-container>\n      @if (expandedBound === 'end') {\n        <div class=\"calendar\" animate.enter=\"expand\" animate.leave=\"collapse\">\n          <mat-calendar\n            data-test=\"end-date-calendar\"\n            [selected]=\"endDate\"\n            [startAt]=\"endDate ?? startDate\"\n            [minDate]=\"startDate\"\n            (selectedChange)=\"setEndDate($event)\"\n          ></mat-calendar>\n        </div>\n      }\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #boundRow let-bound=\"bound\" let-label=\"label\" let-date=\"date\">\n  <div class=\"flex items-center gap-1 w-full\">\n    <span class=\"w-[80px] shrink-0\" [translate]=\"label\"></span>\n    <div\n      class=\"flex-1 min-w-0 flex items-center gap-1 border rounded-lg px-2 py-1 transition-colors\"\n      [class]=\"\n        invalidBounds[bound]\n          ? 'border-red-400 text-red-800 focus-within:border-red-800 hover:border-red-800'\n          : 'border-gray-400 focus-within:border-main hover:border-main'\n      \"\n    >\n      <ng-icon\n        name=\"iconoirCalendar\"\n        class=\"shrink-0\"\n        aria-hidden=\"true\"\n      ></ng-icon>\n      <input\n        type=\"text\"\n        inputmode=\"numeric\"\n        autocomplete=\"off\"\n        [gnUiAutofocus]=\"bound === expandedBound\"\n        class=\"min-w-0 grow bg-transparent focus:outline-none\"\n        [value]=\"date ? formatDate(date) : ''\"\n        [placeholder]=\"'daterange.filter.datePlaceholder' | translate\"\n        [attr.aria-label]=\"label | translate\"\n        [attr.aria-invalid]=\"invalidBounds[bound] || null\"\n        [attr.data-test]=\"bound + '-date-input'\"\n        (change)=\"onDateInput(bound, $event)\"\n        (blur)=\"normalizeDateInput(bound, $event)\"\n        (click)=\"expandedBound !== bound && toggleBound(bound)\"\n      />\n    </div>\n    <div class=\"shrink-0 flex items-center justify-end\">\n      <gn-ui-button\n        type=\"light\"\n        [style.--gn-ui-button-padding]=\"0\"\n        [style.--gn-ui-button-width]=\"'24px'\"\n        [style.--gn-ui-button-height]=\"'24px'\"\n        [attr.aria-expanded]=\"expandedBound === bound\"\n        [attr.data-test]=\"bound + '-date-toggle'\"\n        (buttonClick)=\"toggleBound(bound)\"\n      >\n        <ng-icon\n          [name]=\"expandedBound === bound ? 'matExpandLess' : 'matExpandMore'\"\n        ></ng-icon>\n      </gn-ui-button>\n    </div>\n  </div>\n</ng-template>\n", styles: ["mat-calendar{width:100%}.calendar{display:grid;grid-template-rows:1fr}.calendar>mat-calendar{min-height:0;overflow:hidden}.calendar.expand{animation:open .2s ease-out}.calendar.collapse{animation:open .2s ease-in reverse}@keyframes open{0%{grid-template-rows:0fr;opacity:0}to{grid-template-rows:1fr;opacity:1}}@media (prefers-reduced-motion: reduce){.calendar.expand,.calendar.collapse{animation-duration:1ms}}\n"], dependencies: [{ kind: "directive", type: AutofocusDirective, selector: "[gnUiAutofocus]", inputs: ["gnUiAutofocus"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i1$6.MatCalendar, selector: "mat-calendar", inputs: ["headerComponent", "startAt", "startView", "selected", "minDate", "maxDate", "dateFilter", "dateClass", "comparisonStart", "comparisonEnd", "startDateAccessibleName", "endDateAccessibleName"], outputs: ["selectedChange", "yearSelected", "monthSelected", "viewChanged", "_userSelection", "_userDragDrop"], exportAs: ["matCalendar"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$7.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$7.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DateRangeDropdownComponent, decorators: [{
             type: Component,
             args: [{ selector: 'gn-ui-date-range-dropdown', standalone: true, imports: [
-                        NgIconComponent,
-                        MatNativeDateModule,
-                        MatDatepickerModule,
+                        AutofocusDirective,
                         ButtonComponent,
+                        MatDatepickerModule,
+                        NgIcon,
+                        NgTemplateOutlet,
+                        OverlayModule,
+                        TranslateDirective,
+                        TranslatePipe,
                     ], providers: [
                         provideIcons({
-                            matExpandMore,
+                            iconoirCalendar,
+                            matClose,
                             matExpandLess,
+                            matExpandMore,
                         }),
-                    ], template: "<gn-ui-button\n  type=\"outline\"\n  extraClass=\"bg-background w-full !p-[8px] !pl-[16px]\"\n  (buttonClick)=\"picker.open()\"\n>\n  <div class=\"grow flex items-center mr-2 gap-2 overflow-hidden\">\n    <div class=\"text-left font-medium truncate py-1\">\n      {{ title }}\n    </div>\n  </div>\n  <ng-icon\n    [name]=\"isPickerDisplayed ? 'matExpandLess' : 'matExpandMore'\"\n    class=\"shrink-0 opacity-40\"\n  >\n  </ng-icon>\n</gn-ui-button>\n<!--date range input is just present for output events and hidden from the DOM-->\n<mat-date-range-input [rangePicker]=\"picker\">\n  <input\n    matStartDate\n    [value]=\"startDate\"\n    (dateInput)=\"startDateChange.emit($event.value)\"\n  />\n  <input\n    matEndDate\n    [value]=\"endDate\"\n    (dateInput)=\"endDateChange.emit($event.value)\"\n  />\n</mat-date-range-input>\n<mat-date-range-picker #picker></mat-date-range-picker>\n", styles: [":host .mat-date-range-input-container{display:none}\n"] }]
-        }], propDecorators: { title: [{
-                type: Input
-            }], startDate: [{
+                        provideNgIconsConfig({
+                            size: '1.5rem',
+                        }),
+                        provideLocalizedDateAdapter(),
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<gn-ui-button\n  type=\"outline\"\n  extraClass=\"bg-background w-full !p-[8px] !pl-[16px]\"\n  [title]=\"title\"\n  (buttonClick)=\"openOverlay()\"\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    @if (selectedDatesCount) {\n      <div\n        class=\"gn-ui-multiselect-counter shrink-0 rounded-full font-bold text-[12px] w-5 h-5 flex items-center justify-center mr-1 selected-count\"\n      >\n        {{ selectedDatesCount }}\n      </div>\n    }\n  </div>\n  <button\n    class=\"h-6 w-6 flex items-center justify-center\"\n    data-test=\"dropdown-clear\"\n  >\n    @if (selectedDatesCount && !overlayOpen) {\n      <ng-icon\n        class=\"shrink-0 opacity-40 hover:opacity-80 transition-colors clear-btn\"\n        (click)=\"clearDates($event)\"\n        name=\"matClose\"\n      ></ng-icon>\n    }\n  </button>\n  <ng-icon\n    data-test=\"dropdown-toggle\"\n    [name]=\"overlayOpen ? 'matExpandLess' : 'matExpandMore'\"\n    class=\"shrink-0 opacity-40\"\n  >\n  </ng-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  (overlayOutsideClick)=\"closeOverlay()\"\n  (detach)=\"closeOverlay()\"\n>\n  <div\n    class=\"w-[296px] flex flex-col gap-2 bg-white border border-gray-400 rounded px-4 py-3 shadow-lg text-main text-[16px] leading-[24px]\"\n    data-test=\"date-range-panel\"\n  >\n    <div class=\"flex flex-col justify-center border-b border-gray-300 pb-1\">\n      <ng-container\n        [ngTemplateOutlet]=\"boundRow\"\n        [ngTemplateOutletContext]=\"{\n          bound: 'start',\n          label: 'daterange.filter.from',\n          date: startDate,\n        }\"\n      ></ng-container>\n      @if (expandedBound === 'start') {\n        <div class=\"calendar\" animate.enter=\"expand\" animate.leave=\"collapse\">\n          <mat-calendar\n            data-test=\"start-date-calendar\"\n            [selected]=\"startDate\"\n            [startAt]=\"startDate ?? endDate\"\n            [maxDate]=\"endDate\"\n            (selectedChange)=\"setStartDate($event)\"\n          ></mat-calendar>\n        </div>\n      }\n    </div>\n    <div class=\"flex flex-col justify-center\">\n      <ng-container\n        [ngTemplateOutlet]=\"boundRow\"\n        [ngTemplateOutletContext]=\"{\n          bound: 'end',\n          label: 'daterange.filter.to',\n          date: endDate,\n        }\"\n      ></ng-container>\n      @if (expandedBound === 'end') {\n        <div class=\"calendar\" animate.enter=\"expand\" animate.leave=\"collapse\">\n          <mat-calendar\n            data-test=\"end-date-calendar\"\n            [selected]=\"endDate\"\n            [startAt]=\"endDate ?? startDate\"\n            [minDate]=\"startDate\"\n            (selectedChange)=\"setEndDate($event)\"\n          ></mat-calendar>\n        </div>\n      }\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #boundRow let-bound=\"bound\" let-label=\"label\" let-date=\"date\">\n  <div class=\"flex items-center gap-1 w-full\">\n    <span class=\"w-[80px] shrink-0\" [translate]=\"label\"></span>\n    <div\n      class=\"flex-1 min-w-0 flex items-center gap-1 border rounded-lg px-2 py-1 transition-colors\"\n      [class]=\"\n        invalidBounds[bound]\n          ? 'border-red-400 text-red-800 focus-within:border-red-800 hover:border-red-800'\n          : 'border-gray-400 focus-within:border-main hover:border-main'\n      \"\n    >\n      <ng-icon\n        name=\"iconoirCalendar\"\n        class=\"shrink-0\"\n        aria-hidden=\"true\"\n      ></ng-icon>\n      <input\n        type=\"text\"\n        inputmode=\"numeric\"\n        autocomplete=\"off\"\n        [gnUiAutofocus]=\"bound === expandedBound\"\n        class=\"min-w-0 grow bg-transparent focus:outline-none\"\n        [value]=\"date ? formatDate(date) : ''\"\n        [placeholder]=\"'daterange.filter.datePlaceholder' | translate\"\n        [attr.aria-label]=\"label | translate\"\n        [attr.aria-invalid]=\"invalidBounds[bound] || null\"\n        [attr.data-test]=\"bound + '-date-input'\"\n        (change)=\"onDateInput(bound, $event)\"\n        (blur)=\"normalizeDateInput(bound, $event)\"\n        (click)=\"expandedBound !== bound && toggleBound(bound)\"\n      />\n    </div>\n    <div class=\"shrink-0 flex items-center justify-end\">\n      <gn-ui-button\n        type=\"light\"\n        [style.--gn-ui-button-padding]=\"0\"\n        [style.--gn-ui-button-width]=\"'24px'\"\n        [style.--gn-ui-button-height]=\"'24px'\"\n        [attr.aria-expanded]=\"expandedBound === bound\"\n        [attr.data-test]=\"bound + '-date-toggle'\"\n        (buttonClick)=\"toggleBound(bound)\"\n      >\n        <ng-icon\n          [name]=\"expandedBound === bound ? 'matExpandLess' : 'matExpandMore'\"\n        ></ng-icon>\n      </gn-ui-button>\n    </div>\n  </div>\n</ng-template>\n", styles: ["mat-calendar{width:100%}.calendar{display:grid;grid-template-rows:1fr}.calendar>mat-calendar{min-height:0;overflow:hidden}.calendar.expand{animation:open .2s ease-out}.calendar.collapse{animation:open .2s ease-in reverse}@keyframes open{0%{grid-template-rows:0fr;opacity:0}to{grid-template-rows:1fr;opacity:1}}@media (prefers-reduced-motion: reduce){.calendar.expand,.calendar.collapse{animation-duration:1ms}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { title: [{
                 type: Input
-            }], endDate: [{
+            }], dateRange: [{
                 type: Input
-            }], startDateChange: [{
-                type: Output
-            }], endDateChange: [{
+            }], dateRangeChange: [{
                 type: Output
-            }], picker: [{
+            }], overlayOrigin: [{
                 type: ViewChild,
-                args: ['picker']
+                args: ['overlayOrigin']
             }] } });
 
 class DateRangePickerComponent {
@@ -24699,20 +24832,17 @@ class DateRangePickerComponent {
             provideNgIconsConfig({
                 size: '1.5rem',
             }),
-        ], ngImport: i0, template: "<span class=\"w-full inline-block relative\">\n  <mat-date-range-input [rangePicker]=\"picker\" class=\"gn-ui-text-input\">\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\n  <gn-ui-button\n    type=\"light\"\n    class=\"absolute inset-y-[var(--side-padding)] right-[var(--side-padding)] z-10\"\n    (buttonClick)=\"picker.open()\"\n    extraClass=\"h-full\"\n    data-cy=\"date-picker-button\"\n  >\n    <ng-icon name=\"iconoirCalendar\" class=\"text-primary\"></ng-icon>\n  </gn-ui-button>\n</span>\n<mat-date-range-picker #picker></mat-date-range-picker>\n", styles: [":host{--gn-ui-button-rounded: 8px;--gn-ui-button-width: 32px;--gn-ui-button-padding: 0;--side-padding: calc(var(--gn-ui-text-input-padding, .6em) - 6px);--text-padding: calc(var(--side-padding) + 40px)}\n"], dependencies: [{ kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i1$6.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i1$6.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i1$6.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i1$6.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+            provideLocalizedDateAdapter(),
+        ], ngImport: i0, template: "<span class=\"w-full inline-block relative\">\n  <mat-date-range-input [rangePicker]=\"picker\" class=\"gn-ui-text-input\">\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\n  <gn-ui-button\n    type=\"light\"\n    class=\"absolute inset-y-[var(--side-padding)] right-[var(--side-padding)] z-10\"\n    (buttonClick)=\"picker.open()\"\n    extraClass=\"h-full\"\n    data-cy=\"date-picker-button\"\n  >\n    <ng-icon name=\"iconoirCalendar\" class=\"text-primary\"></ng-icon>\n  </gn-ui-button>\n</span>\n<mat-date-range-picker #picker></mat-date-range-picker>\n", styles: [":host{--gn-ui-button-rounded: 8px;--gn-ui-button-width: 32px;--gn-ui-button-padding: 0;--side-padding: calc(var(--gn-ui-text-input-padding, .6em) - 6px);--text-padding: calc(var(--side-padding) + 40px)}\n"], dependencies: [{ kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i1$6.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i1$6.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i1$6.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i1$6.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DateRangePickerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-date-range-picker', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
-                        MatNativeDateModule,
-                        MatDatepickerModule,
-                        ButtonComponent,
-                        NgIconComponent,
-                    ], providers: [
+            args: [{ selector: 'gn-ui-date-range-picker', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [MatDatepickerModule, ButtonComponent, NgIconComponent], providers: [
                         provideIcons({ iconoirCalendar }),
                         provideNgIconsConfig({
                             size: '1.5rem',
                         }),
+                        provideLocalizedDateAdapter(),
                     ], template: "<span class=\"w-full inline-block relative\">\n  <mat-date-range-input [rangePicker]=\"picker\" class=\"gn-ui-text-input\">\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\n  <gn-ui-button\n    type=\"light\"\n    class=\"absolute inset-y-[var(--side-padding)] right-[var(--side-padding)] z-10\"\n    (buttonClick)=\"picker.open()\"\n    extraClass=\"h-full\"\n    data-cy=\"date-picker-button\"\n  >\n    <ng-icon name=\"iconoirCalendar\" class=\"text-primary\"></ng-icon>\n  </gn-ui-button>\n</span>\n<mat-date-range-picker #picker></mat-date-range-picker>\n", styles: [":host{--gn-ui-button-rounded: 8px;--gn-ui-button-width: 32px;--gn-ui-button-padding: 0;--side-padding: calc(var(--gn-ui-text-input-padding, .6em) - 6px);--text-padding: calc(var(--side-padding) + 40px)}\n"] }]
         }], propDecorators: { startDate: [{
                 type: Input
@@ -24764,7 +24894,7 @@ class DragAndDropFileInputComponent {
         this.selectedFile = null;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DragAndDropFileInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: DragAndDropFileInputComponent, isStandalone: true, selector: "gn-ui-drag-and-drop-file-input", inputs: { placeholder: "placeholder", accept: "accept", maxFileSizeMb: "maxFileSizeMb", icon: "icon", dropzoneBackgroundColor: "dropzoneBackgroundColor", textClass: "textClass", extraClass: "extraClass", showFileName: "showFileName" }, outputs: { fileChange: "fileChange", errorChange: "errorChange" }, viewQueries: [{ propertyName: "dropzone", first: true, predicate: NgxDropzoneComponent, descendants: true }], ngImport: i0, template: "<div\n  class=\"flex h-full items-center\"\n  [class]=\"extraClass\"\n  (click)=\"openFileSelector()\"\n>\n  <ngx-dropzone\n    class=\"flex-1 overflow-hidden\"\n    [multiple]=\"false\"\n    [disableClick]=\"true\"\n    [accept]=\"accept\"\n    [maxFileSize]=\"maxFileSizeBytes\"\n    [style.background-color]=\"dropzoneBackgroundColor\"\n    (change)=\"selectFile($event)\"\n  >\n    @if (!fileName || !showFileName) {\n      <div [class]=\"textClass\">\n        {{ placeholder }}\n      </div>\n    }\n\n    @if (fileName && showFileName) {\n      <div [class]=\"textClass\">\n        {{ fileName }}\n      </div>\n    }\n  </ngx-dropzone>\n\n  @if (icon) {\n    <ng-icon [name]=\"icon\" class=\"shrink-0 text-gray-950\"></ng-icon>\n  }\n</div>\n", styles: ["ngx-dropzone{height:auto;border:none;overflow:hidden}\n"], dependencies: [{ kind: "ngmodule", type: NgxDropzoneModule }, { kind: "component", type: i1$7.NgxDropzoneComponent, selector: "ngx-dropzone, [ngx-dropzone]", inputs: ["accept", "disabled", "multiple", "maxFileSize", "expandable", "disableClick", "processDirectoryDrop", "id", "aria-label", "aria-labelledby", "aria-describedby"], outputs: ["change"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: DragAndDropFileInputComponent, isStandalone: true, selector: "gn-ui-drag-and-drop-file-input", inputs: { placeholder: "placeholder", accept: "accept", maxFileSizeMb: "maxFileSizeMb", icon: "icon", dropzoneBackgroundColor: "dropzoneBackgroundColor", textClass: "textClass", extraClass: "extraClass", showFileName: "showFileName" }, outputs: { fileChange: "fileChange", errorChange: "errorChange" }, viewQueries: [{ propertyName: "dropzone", first: true, predicate: NgxDropzoneComponent, descendants: true }], ngImport: i0, template: "<div\n  class=\"flex h-full items-center\"\n  [class]=\"extraClass\"\n  (click)=\"openFileSelector()\"\n>\n  <ngx-dropzone\n    class=\"flex-1 overflow-hidden\"\n    [multiple]=\"false\"\n    [disableClick]=\"true\"\n    [accept]=\"accept\"\n    [maxFileSize]=\"maxFileSizeBytes\"\n    [style.background-color]=\"dropzoneBackgroundColor\"\n    (change)=\"selectFile($event)\"\n  >\n    @if (!fileName || !showFileName) {\n      <div [class]=\"textClass\">\n        {{ placeholder }}\n      </div>\n    }\n\n    @if (fileName && showFileName) {\n      <div [class]=\"textClass\">\n        {{ fileName }}\n      </div>\n    }\n  </ngx-dropzone>\n\n  @if (icon) {\n    <ng-icon [name]=\"icon\" class=\"shrink-0 text-gray-950\"></ng-icon>\n  }\n</div>\n", styles: ["ngx-dropzone{height:auto;border:none;overflow:hidden}\n"], dependencies: [{ kind: "ngmodule", type: NgxDropzoneModule }, { kind: "component", type: i1$8.NgxDropzoneComponent, selector: "ngx-dropzone, [ngx-dropzone]", inputs: ["accept", "disabled", "multiple", "maxFileSize", "expandable", "disableClick", "processDirectoryDrop", "id", "aria-label", "aria-labelledby", "aria-describedby"], outputs: ["change"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DragAndDropFileInputComponent, decorators: [{
             type: Component,
@@ -24946,7 +25076,7 @@ class DropdownMultiselectComponent {
                 matExpandMore,
                 matExpandLess,
             }),
-        ], 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    @if (hasSelectedChoices) {\n      <div\n        class=\"gn-ui-multiselect-counter shrink-0 rounded-full font-bold text-[12px] w-5 h-5 flex items-center justify-center mr-1 selected-count\"\n      >\n        {{ selected.length }}\n      </div>\n    }\n  </div>\n  <button class=\"h-6 w-6\" data-cy=\"clearSelection\">\n    @if (hasSelectedChoices && !overlayOpen) {\n      <ng-icon\n        class=\"shrink-0 opacity-40 mr-1.5 hover:opacity-80 transition-colors clear-btn\"\n        (click)=\"clearSelection($event)\"\n        name=\"matClose\"\n      ></ng-icon>\n    }\n  </button>\n  <ng-icon\n    [name]=\"overlayOpen ? 'matExpandLess' : 'matExpandMore'\"\n    class=\"shrink-0 opacity-40\"\n  >\n  </ng-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.min-width]=\"overlayMinWidth\"\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 gap-[2px] flex-wrap p-2 focus-within:rounded focus-within:border-2 focus-within:border-primary\"\n    >\n      @for (selected of selectedChoices; track selected) {\n        <button\n          type=\"button\"\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            <ng-icon\n              name=\"matClose\"\n              class=\"!h-[12px] !w-[11px] text-[12px]\"\n            ></ng-icon>\n          </div>\n        </button>\n      }\n\n      @if (allowSearch) {\n        <div 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          @if (!!searchInputValue) {\n            <button\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              <ng-icon class=\"!h-[10px] !w-[12px] text-[12px]\" name=\"matClose\">\n              </ng-icon>\n            </button>\n          }\n        </div>\n      }\n    </div>\n\n    @for (choice of filteredChoicesByText; track choice) {\n      <label\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    }\n  </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$8.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$8.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], 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    @if (hasSelectedChoices) {\n      <div\n        class=\"gn-ui-multiselect-counter shrink-0 rounded-full font-bold text-[12px] w-5 h-5 flex items-center justify-center mr-1 selected-count\"\n      >\n        {{ selected.length }}\n      </div>\n    }\n  </div>\n  <button class=\"h-6 w-6\" data-test=\"dropdown-clear\">\n    @if (hasSelectedChoices && !overlayOpen) {\n      <ng-icon\n        class=\"shrink-0 opacity-40 mr-1.5 hover:opacity-80 transition-colors clear-btn\"\n        (click)=\"clearSelection($event)\"\n        name=\"matClose\"\n      ></ng-icon>\n    }\n  </button>\n  <ng-icon\n    [name]=\"overlayOpen ? 'matExpandLess' : 'matExpandMore'\"\n    class=\"shrink-0 opacity-40\"\n  >\n  </ng-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.min-width]=\"overlayMinWidth\"\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 gap-[2px] flex-wrap p-2 focus-within:rounded focus-within:border-2 focus-within:border-primary\"\n    >\n      @for (selected of selectedChoices; track selected) {\n        <button\n          type=\"button\"\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            <ng-icon\n              name=\"matClose\"\n              class=\"!h-[12px] !w-[11px] text-[12px]\"\n            ></ng-icon>\n          </div>\n        </button>\n      }\n\n      @if (allowSearch) {\n        <div 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          @if (!!searchInputValue) {\n            <button\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              <ng-icon class=\"!h-[10px] !w-[12px] text-[12px]\" name=\"matClose\">\n              </ng-icon>\n            </button>\n          }\n        </div>\n      }\n    </div>\n\n    @for (choice of filteredChoicesByText; track choice) {\n      <label\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    }\n  </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$7.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$7.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DropdownMultiselectComponent, decorators: [{
             type: Component,
@@ -24956,7 +25086,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                             matExpandMore,
                             matExpandLess,
                         }),
-                    ], standalone: true, 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    @if (hasSelectedChoices) {\n      <div\n        class=\"gn-ui-multiselect-counter shrink-0 rounded-full font-bold text-[12px] w-5 h-5 flex items-center justify-center mr-1 selected-count\"\n      >\n        {{ selected.length }}\n      </div>\n    }\n  </div>\n  <button class=\"h-6 w-6\" data-cy=\"clearSelection\">\n    @if (hasSelectedChoices && !overlayOpen) {\n      <ng-icon\n        class=\"shrink-0 opacity-40 mr-1.5 hover:opacity-80 transition-colors clear-btn\"\n        (click)=\"clearSelection($event)\"\n        name=\"matClose\"\n      ></ng-icon>\n    }\n  </button>\n  <ng-icon\n    [name]=\"overlayOpen ? 'matExpandLess' : 'matExpandMore'\"\n    class=\"shrink-0 opacity-40\"\n  >\n  </ng-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.min-width]=\"overlayMinWidth\"\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 gap-[2px] flex-wrap p-2 focus-within:rounded focus-within:border-2 focus-within:border-primary\"\n    >\n      @for (selected of selectedChoices; track selected) {\n        <button\n          type=\"button\"\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            <ng-icon\n              name=\"matClose\"\n              class=\"!h-[12px] !w-[11px] text-[12px]\"\n            ></ng-icon>\n          </div>\n        </button>\n      }\n\n      @if (allowSearch) {\n        <div 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          @if (!!searchInputValue) {\n            <button\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              <ng-icon class=\"!h-[10px] !w-[12px] text-[12px]\" name=\"matClose\">\n              </ng-icon>\n            </button>\n          }\n        </div>\n      }\n    </div>\n\n    @for (choice of filteredChoicesByText; track choice) {\n      <label\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    }\n  </div>\n</ng-template>\n" }]
+                    ], standalone: true, 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    @if (hasSelectedChoices) {\n      <div\n        class=\"gn-ui-multiselect-counter shrink-0 rounded-full font-bold text-[12px] w-5 h-5 flex items-center justify-center mr-1 selected-count\"\n      >\n        {{ selected.length }}\n      </div>\n    }\n  </div>\n  <button class=\"h-6 w-6\" data-test=\"dropdown-clear\">\n    @if (hasSelectedChoices && !overlayOpen) {\n      <ng-icon\n        class=\"shrink-0 opacity-40 mr-1.5 hover:opacity-80 transition-colors clear-btn\"\n        (click)=\"clearSelection($event)\"\n        name=\"matClose\"\n      ></ng-icon>\n    }\n  </button>\n  <ng-icon\n    [name]=\"overlayOpen ? 'matExpandLess' : 'matExpandMore'\"\n    class=\"shrink-0 opacity-40\"\n  >\n  </ng-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.min-width]=\"overlayMinWidth\"\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 gap-[2px] flex-wrap p-2 focus-within:rounded focus-within:border-2 focus-within:border-primary\"\n    >\n      @for (selected of selectedChoices; track selected) {\n        <button\n          type=\"button\"\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            <ng-icon\n              name=\"matClose\"\n              class=\"!h-[12px] !w-[11px] text-[12px]\"\n            ></ng-icon>\n          </div>\n        </button>\n      }\n\n      @if (allowSearch) {\n        <div 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          @if (!!searchInputValue) {\n            <button\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              <ng-icon class=\"!h-[10px] !w-[12px] text-[12px]\" name=\"matClose\">\n              </ng-icon>\n            </button>\n          }\n        </div>\n      }\n    </div>\n\n    @for (choice of filteredChoicesByText; track choice) {\n      <label\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    }\n  </div>\n</ng-template>\n" }]
         }], propDecorators: { title: [{
                 type: Input
             }], choices: [{
@@ -25128,7 +25258,7 @@ class DropdownSelectorComponent {
             provideNgIconsConfig({
                 size: '1.5em',
             }),
-        ], viewQueries: [{ propertyName: "overlayOrigin", first: true, predicate: ["overlayOrigin"], descendants: true }, { propertyName: "overlay", first: true, predicate: CdkConnectedOverlay, descendants: true }, { propertyName: "choiceInputs", predicate: ["choiceInputs"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"flex flex-col sm:flex-row sm:items-center relative w-full\">\n  @if (showTitle) {\n    <span\n      class=\"tracking-wide text-sm mb-2 sm:mb-0 sm:mr-2 whitespace-nowrap\"\n      [attr.for]=\"id\"\n    >\n      {{ title }}\n    </span>\n  }\n  <gn-ui-button\n    type=\"outline\"\n    class=\"grow min-w-0\"\n    [style.--gn-ui-button-padding]=\"'8px 8px 8px 16px'\"\n    extraClass=\"bg-background flex flex-row w-full {{ extraBtnClass }}\"\n    [title]=\"title\"\n    [attr.aria-owns]=\"id\"\n    (buttonClick)=\"openOverlay()\"\n    cdkOverlayOrigin\n    #overlayOrigin=\"cdkOverlayOrigin\"\n    (keydown)=\"handleTriggerKeydown($event)\"\n    [disabled]=\"disabled\"\n  >\n    <div class=\"grow truncate py-1 mr-2 text-left\">\n      {{ getChoiceLabel() | translate }}\n    </div>\n    <ng-icon\n      [name]=\"overlayOpen ? 'matExpandLess' : 'matExpandMore'\"\n      class=\"shrink-0 opacity-40\"\n    >\n    </ng-icon>\n  </gn-ui-button>\n</div>\n\n<ng-template\n  cdkConnectedOverlay\n  cdkConnectedOverlayHasBackdrop\n  cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n  [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\n  [cdkConnectedOverlayOpen]=\"overlayOpen\"\n  [cdkConnectedOverlayPositions]=\"overlayPositions\"\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.min-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  >\n    @for (choice of choices; track choice) {\n      <button\n        #choiceInputs\n        type=\"button\"\n        [title]=\"choice.label | translate\"\n        class=\"flex px-5 py-1 w-full text-start cursor-pointer transition-colors\"\n        [ngClass]=\"\n          isSelected(choice)\n            ? 'text-white bg-primary hover:text-white hover:bg-primary-darker focus:text-white focus:bg-primary-darker'\n            : 'text-gray-900 hover:text-primary-darkest hover:bg-gray-50 focus:text-primary-darkest focus:bg-gray-50'\n        \"\n        (click)=\"onSelectValue(choice)\"\n        (keydown)=\"selectIfEnter($event, choice)\"\n        [attr.data-cy-value]=\"choice.value.toString()\"\n        [attr.data-cy-active]=\"isSelected(choice) ? 'true' : undefined\"\n      >\n        <span class=\"text-[14px]\">\n          {{ choice.label | translate }}\n        </span>\n      </button>\n    }\n  </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$8.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$8.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "overlayOrigin", first: true, predicate: ["overlayOrigin"], descendants: true }, { propertyName: "overlay", first: true, predicate: CdkConnectedOverlay, descendants: true }, { propertyName: "choiceInputs", predicate: ["choiceInputs"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"flex flex-col sm:flex-row sm:items-center relative w-full\">\n  @if (showTitle) {\n    <span\n      class=\"tracking-wide text-sm mb-2 sm:mb-0 sm:mr-2 whitespace-nowrap\"\n      [attr.for]=\"id\"\n    >\n      {{ title }}\n    </span>\n  }\n  <gn-ui-button\n    type=\"outline\"\n    class=\"grow min-w-0\"\n    [style.--gn-ui-button-padding]=\"'8px 8px 8px 16px'\"\n    extraClass=\"bg-background flex flex-row w-full {{ extraBtnClass }}\"\n    [title]=\"title\"\n    [attr.aria-owns]=\"id\"\n    (buttonClick)=\"openOverlay()\"\n    cdkOverlayOrigin\n    #overlayOrigin=\"cdkOverlayOrigin\"\n    (keydown)=\"handleTriggerKeydown($event)\"\n    [disabled]=\"disabled\"\n  >\n    <div class=\"grow truncate py-1 mr-2 text-left\">\n      {{ getChoiceLabel() | translate }}\n    </div>\n    <ng-icon\n      [name]=\"overlayOpen ? 'matExpandLess' : 'matExpandMore'\"\n      class=\"shrink-0 opacity-40\"\n    >\n    </ng-icon>\n  </gn-ui-button>\n</div>\n\n<ng-template\n  cdkConnectedOverlay\n  cdkConnectedOverlayHasBackdrop\n  cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n  [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\n  [cdkConnectedOverlayOpen]=\"overlayOpen\"\n  [cdkConnectedOverlayPositions]=\"overlayPositions\"\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.min-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  >\n    @for (choice of choices; track choice) {\n      <button\n        #choiceInputs\n        type=\"button\"\n        [title]=\"choice.label | translate\"\n        class=\"flex px-5 py-1 w-full text-start cursor-pointer transition-colors\"\n        [ngClass]=\"\n          isSelected(choice)\n            ? 'text-white bg-primary hover:text-white hover:bg-primary-darker focus:text-white focus:bg-primary-darker'\n            : 'text-gray-900 hover:text-primary-darkest hover:bg-gray-50 focus:text-primary-darkest focus:bg-gray-50'\n        \"\n        (click)=\"onSelectValue(choice)\"\n        (keydown)=\"selectIfEnter($event, choice)\"\n        [attr.data-cy-value]=\"choice.value.toString()\"\n        [attr.data-cy-active]=\"isSelected(choice) ? 'true' : undefined\"\n      >\n        <span class=\"text-[14px]\">\n          {{ choice.label | translate }}\n        </span>\n      </button>\n    }\n  </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$7.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$7.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DropdownSelectorComponent, decorators: [{
             type: Component,
@@ -25979,7 +26109,7 @@ class SpatialExtentDropdownComponent {
                 matExpandLess,
                 matExpandMore,
             }),
-        ], viewQueries: [{ propertyName: "overlayOrigin", first: true, predicate: ["overlayOrigin"], descendants: true }, { propertyName: "overlay", first: true, predicate: CdkConnectedOverlay, descendants: true }, { propertyName: "fileInput", first: true, predicate: DragAndDropFileInputComponent, descendants: true }], ngImport: i0, template: "<gn-ui-button\n  type=\"outline\"\n  extraClass=\"bg-background w-full !p-[8px] !pl-[16px]\"\n  [title]=\"title\"\n  (buttonClick)=\"toggleOverlay()\"\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    @if (hasSelection) {\n      <div\n        class=\"bg-primary-lighter text-white shrink-0 rounded-full font-bold text-[12px] w-[22px] h-[22px] flex items-center justify-center\"\n      >\n        1\n      </div>\n    }\n  </div>\n  <button class=\"h-6 w-6 flex items-center\" data-cy=\"clearSelection\">\n    @if (hasSelection && !overlayOpen) {\n      <ng-icon\n        class=\"shrink-0 opacity-40 mr-1.5 hover:opacity-80 transition-colors clear-btn\"\n        (click)=\"removeSelection($event)\"\n        name=\"matClose\"\n      ></ng-icon>\n    }\n  </button>\n  <ng-icon\n    [name]=\"overlayOpen ? 'matExpandLess' : 'matExpandMore'\"\n    class=\"shrink-0 opacity-40\"\n  >\n  </ng-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-400 rounded shadow-lg pt-[12px] px-[16px] overlay-container w-[280px] flex flex-col gap-2\"\n    [style.min-width]=\"overlayMinWidth\"\n  >\n    <div class=\"text-xs text-black\">\n      {{ 'search.filters.spatialExtent.helpText' | translate }}\n    </div>\n\n    <div\n      [class]=\"\n        (hasSelection\n          ? 'border-b-[1px] border-gray-400 pb-[20px]'\n          : 'pb-[8px]') + ' text-black'\n      \"\n    >\n      <gn-ui-drag-and-drop-file-input\n        accept=\".json,.geojson\"\n        [placeholder]=\"'search.filters.spatialExtent.import' | translate\"\n        [maxFileSizeMb]=\"maxFileSizeMb\"\n        [showFileName]=\"false\"\n        textClass=\"text-black truncate\"\n        dropzoneBackgroundColor=\"transparent\"\n        icon=\"iconoirImport\"\n        extraClass=\"gn-ui-gray-outline-input w-full !h-[32px] px-[8px] py-[4px] justify-between\"\n        (fileChange)=\"handleFileSelected($event)\"\n        (errorChange)=\"handleFileError($event)\"\n        data-cy=\"importGeojson\"\n      ></gn-ui-drag-and-drop-file-input>\n    </div>\n\n    @if (hasSelection) {\n      <gn-ui-button\n        [type]=\"'primary-light'\"\n        [title]=\"\n          ('search.filters.spatialExtent.bboxDelete' | translate) +\n          ' ' +\n          fileName\n        \"\n        (buttonClick)=\"removeSelection($event)\"\n        extraClass=\"group gap-x-2 w-full h-[28px] px-[8px] py-[4px] mb-[12px] bg-primary-lighter text-white\"\n        data-test=\"spatial-extent-selected-item\"\n      >\n        <ng-icon\n          name=\"iconoirSquareDashed\"\n          class=\"shrink-0\"\n          size=\"15px\"\n        ></ng-icon>\n        <span class=\"group-hover:hidden truncate text-sm m-auto\">\n          {{ 'search.filters.spatialExtent.bboxPrefix' | translate }}\n          {{ fileName }}\n        </span>\n        <span class=\"hidden group-hover:block truncate text-sm m-auto\">\n          {{ 'search.filters.spatialExtent.bboxDelete' | translate }}\n          {{ fileName }}\n        </span>\n        <ng-icon\n          name=\"iconoirCheckCircle\"\n          class=\"group-hover:hidden shrink-0\"\n          size=\"14px\"\n        ></ng-icon>\n        <ng-icon\n          name=\"iconoirTrash\"\n          class=\"!hidden group-hover:!block shrink-0\"\n          size=\"15px\"\n        ></ng-icon>\n      </gn-ui-button>\n    }\n  </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$8.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$8.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: DragAndDropFileInputComponent, selector: "gn-ui-drag-and-drop-file-input", inputs: ["placeholder", "accept", "maxFileSizeMb", "icon", "dropzoneBackgroundColor", "textClass", "extraClass", "showFileName"], outputs: ["fileChange", "errorChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "overlayOrigin", first: true, predicate: ["overlayOrigin"], descendants: true }, { propertyName: "overlay", first: true, predicate: CdkConnectedOverlay, descendants: true }, { propertyName: "fileInput", first: true, predicate: DragAndDropFileInputComponent, descendants: true }], ngImport: i0, template: "<gn-ui-button\n  type=\"outline\"\n  extraClass=\"bg-background w-full !p-[8px] !pl-[16px]\"\n  [title]=\"title\"\n  (buttonClick)=\"toggleOverlay()\"\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    @if (hasSelection) {\n      <div\n        class=\"bg-primary-lighter text-white shrink-0 rounded-full font-bold text-[12px] w-[22px] h-[22px] flex items-center justify-center\"\n      >\n        1\n      </div>\n    }\n  </div>\n  <button class=\"h-6 w-6 flex items-center\" data-cy=\"clearSelection\">\n    @if (hasSelection && !overlayOpen) {\n      <ng-icon\n        class=\"shrink-0 opacity-40 mr-1.5 hover:opacity-80 transition-colors clear-btn\"\n        (click)=\"removeSelection($event)\"\n        name=\"matClose\"\n      ></ng-icon>\n    }\n  </button>\n  <ng-icon\n    [name]=\"overlayOpen ? 'matExpandLess' : 'matExpandMore'\"\n    class=\"shrink-0 opacity-40\"\n  >\n  </ng-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-400 rounded shadow-lg pt-[12px] px-[16px] overlay-container w-[280px] flex flex-col gap-2\"\n    [style.min-width]=\"overlayMinWidth\"\n  >\n    <div class=\"text-xs text-black\">\n      {{ 'search.filters.spatialExtent.helpText' | translate }}\n    </div>\n\n    <div\n      [class]=\"\n        (hasSelection\n          ? 'border-b-[1px] border-gray-400 pb-[20px]'\n          : 'pb-[8px]') + ' text-black'\n      \"\n    >\n      <gn-ui-drag-and-drop-file-input\n        accept=\".json,.geojson\"\n        [placeholder]=\"'search.filters.spatialExtent.import' | translate\"\n        [maxFileSizeMb]=\"maxFileSizeMb\"\n        [showFileName]=\"false\"\n        textClass=\"text-black truncate\"\n        dropzoneBackgroundColor=\"transparent\"\n        icon=\"iconoirImport\"\n        extraClass=\"gn-ui-gray-outline-input w-full !h-[32px] px-[8px] py-[4px] justify-between\"\n        (fileChange)=\"handleFileSelected($event)\"\n        (errorChange)=\"handleFileError($event)\"\n        data-cy=\"importGeojson\"\n      ></gn-ui-drag-and-drop-file-input>\n    </div>\n\n    @if (hasSelection) {\n      <gn-ui-button\n        [type]=\"'primary-light'\"\n        [title]=\"\n          ('search.filters.spatialExtent.bboxDelete' | translate) +\n          ' ' +\n          fileName\n        \"\n        (buttonClick)=\"removeSelection($event)\"\n        extraClass=\"group gap-x-2 w-full h-[28px] px-[8px] py-[4px] mb-[12px] bg-primary-lighter text-white\"\n        data-test=\"spatial-extent-selected-item\"\n      >\n        <ng-icon\n          name=\"iconoirSquareDashed\"\n          class=\"shrink-0\"\n          size=\"15px\"\n        ></ng-icon>\n        <span class=\"group-hover:hidden truncate text-sm m-auto\">\n          {{ 'search.filters.spatialExtent.bboxPrefix' | translate }}\n          {{ fileName }}\n        </span>\n        <span class=\"hidden group-hover:block truncate text-sm m-auto\">\n          {{ 'search.filters.spatialExtent.bboxDelete' | translate }}\n          {{ fileName }}\n        </span>\n        <ng-icon\n          name=\"iconoirCheckCircle\"\n          class=\"group-hover:hidden shrink-0\"\n          size=\"14px\"\n        ></ng-icon>\n        <ng-icon\n          name=\"iconoirTrash\"\n          class=\"!hidden group-hover:!block shrink-0\"\n          size=\"15px\"\n        ></ng-icon>\n      </gn-ui-button>\n    }\n  </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$7.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$7.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: DragAndDropFileInputComponent, selector: "gn-ui-drag-and-drop-file-input", inputs: ["placeholder", "accept", "maxFileSizeMb", "icon", "dropzoneBackgroundColor", "textClass", "extraClass", "showFileName"], outputs: ["fileChange", "errorChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: SpatialExtentDropdownComponent, decorators: [{
             type: Component,
@@ -26095,7 +26225,7 @@ class CellPopinComponent {
         this.isOpen = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: CellPopinComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: CellPopinComponent, isStandalone: true, selector: "gn-ui-cell-popin", inputs: { extraClass: "extraClass", cdkScrollContainer: "cdkScrollContainer", scrollContainer: "scrollContainer", activePopin: "activePopin" }, providers: [provideIcons({ iconoirReduce })], viewQueries: [{ propertyName: "anchorRef", first: true, predicate: ["anchorRef"], descendants: true }], ngImport: i0, template: "<div\n  class=\"h-full flex items-center justify-center\"\n  cdkOverlayOrigin\n  #anchorRef\n  #trigger=\"cdkOverlayOrigin\"\n  [class]=\"extraClass\"\n  data-cy=\"cell-popin\"\n>\n  <ng-content select=\"[cellContent]\"></ng-content>\n  @if (activePopin) {\n    <ng-template\n      cdkConnectedOverlay\n      [cdkConnectedOverlayPush]=\"false\"\n      [cdkConnectedOverlayOrigin]=\"trigger\"\n      [cdkConnectedOverlayOpen]=\"isOpen\"\n      [cdkConnectedOverlayPositions]=\"overlayPositions\"\n      [cdkConnectedOverlayWidth]=\"'auto'\"\n      [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n      [cdkConnectedOverlayGrowAfterOpen]=\"true\"\n      (detach)=\"closeOverlay()\"\n    >\n      @if (activePopin && isVisible) {\n        <div\n          class=\"bg-white shadow-lg border border-gray-300 relative\"\n          data-cy=\"cell-popin-content\"\n        >\n          <ng-content select=\"[popinContent]\"></ng-content>\n          <gn-ui-button\n            data-cy=\"cell-popin-close\"\n            [style.--gn-ui-button-background]=\"'bg-transparent'\"\n            class=\"absolute top-2 right-2\"\n            type=\"light\"\n            (buttonClick)=\"closeOverlay()\"\n            extraClass=\"w-10 h-8 px-1\"\n          >\n            <ng-icon name=\"iconoirReduce\" size=\"24\"></ng-icon>\n          </gn-ui-button>\n        </div>\n      }\n    </ng-template>\n  }\n</div>\n", dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$8.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$8.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: CellPopinComponent, isStandalone: true, selector: "gn-ui-cell-popin", inputs: { extraClass: "extraClass", cdkScrollContainer: "cdkScrollContainer", scrollContainer: "scrollContainer", activePopin: "activePopin" }, providers: [provideIcons({ iconoirReduce })], viewQueries: [{ propertyName: "anchorRef", first: true, predicate: ["anchorRef"], descendants: true }], ngImport: i0, template: "<div\n  class=\"h-full flex items-center justify-center\"\n  cdkOverlayOrigin\n  #anchorRef\n  #trigger=\"cdkOverlayOrigin\"\n  [class]=\"extraClass\"\n  data-cy=\"cell-popin\"\n>\n  <ng-content select=\"[cellContent]\"></ng-content>\n  @if (activePopin) {\n    <ng-template\n      cdkConnectedOverlay\n      [cdkConnectedOverlayPush]=\"false\"\n      [cdkConnectedOverlayOrigin]=\"trigger\"\n      [cdkConnectedOverlayOpen]=\"isOpen\"\n      [cdkConnectedOverlayPositions]=\"overlayPositions\"\n      [cdkConnectedOverlayWidth]=\"'auto'\"\n      [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n      [cdkConnectedOverlayGrowAfterOpen]=\"true\"\n      (detach)=\"closeOverlay()\"\n    >\n      @if (activePopin && isVisible) {\n        <div\n          class=\"bg-white shadow-lg border border-gray-300 relative\"\n          data-cy=\"cell-popin-content\"\n        >\n          <ng-content select=\"[popinContent]\"></ng-content>\n          <gn-ui-button\n            data-cy=\"cell-popin-close\"\n            [style.--gn-ui-button-background]=\"'bg-transparent'\"\n            class=\"absolute top-2 right-2\"\n            type=\"light\"\n            (buttonClick)=\"closeOverlay()\"\n            extraClass=\"w-10 h-8 px-1\"\n          >\n            <ng-icon name=\"iconoirReduce\" size=\"24\"></ng-icon>\n          </gn-ui-button>\n        </div>\n      }\n    </ng-template>\n  }\n</div>\n", dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$7.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$7.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "component", type: NgIconComponent, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: CellPopinComponent, decorators: [{
             type: Component,
@@ -29628,7 +29758,7 @@ class ContactPillComponent {
         this.overlayOpen = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ContactPillComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: ContactPillComponent, isStandalone: true, selector: "gn-ui-contact-pill", inputs: { contact: "contact" }, ngImport: i0, template: "<gn-ui-button\n  [type]=\"overlayOpen ? 'gray-light' : 'primary-light'\"\n  extraClass=\"group w-full min-h-12 gap-3 justify-between py-2 pl-5 pr-4 rounded\"\n  data-test=\"contact-pill\"\n  (buttonClick)=\"toggleOverlay()\"\n  cdkOverlayOrigin\n  #overlayOrigin=\"cdkOverlayOrigin\"\n>\n  <span\n    class=\"font-title font-medium text-base leading-tight truncate\"\n    [class]=\"!overlayOpen ? 'text-primary-black group-hover:text-white' : ''\"\n    [title]=\"displayName\"\n    >{{ displayName }}</span\n  >\n  <div\n    class=\"gn-ui-card-icon items-center justify-center w-10 h-8\"\n    [class]=\"\n      !overlayOpen ? 'group-hover:border-white group-hover:text-white' : ''\n    \"\n  >\n    @if (overlayOpen) {\n      <ng-icon class=\"!w-6 !h-6 !text-[24px]\" name=\"matClose\"></ng-icon>\n    } @else {\n      <ng-icon class=\"!w-6 !h-6 !text-[24px]\" name=\"matInfoOutline\"></ng-icon>\n    }\n  </div>\n</gn-ui-button>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\n  [cdkConnectedOverlayOpen]=\"overlayOpen\"\n  [cdkConnectedOverlayPositions]=\"overlayPositions\"\n  [cdkConnectedOverlayOffsetX]=\"overlayOffsetX\"\n  (overlayOutsideClick)=\"closeOverlay()\"\n  (detach)=\"closeOverlay()\"\n>\n  <div [style.width.px]=\"overlayWidth\">\n    <gn-ui-contact-details [contact]=\"contact\"></gn-ui-contact-details>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$8.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$8.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: ContactDetailsComponent, selector: "gn-ui-contact-details", inputs: ["contact"] }], viewProviders: [provideIcons({ matClose, matInfoOutline })], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: ContactPillComponent, isStandalone: true, selector: "gn-ui-contact-pill", inputs: { contact: "contact" }, ngImport: i0, template: "<gn-ui-button\n  [type]=\"overlayOpen ? 'gray-light' : 'primary-light'\"\n  extraClass=\"group w-full min-h-12 gap-3 justify-between py-2 pl-5 pr-4 rounded\"\n  data-test=\"contact-pill\"\n  (buttonClick)=\"toggleOverlay()\"\n  cdkOverlayOrigin\n  #overlayOrigin=\"cdkOverlayOrigin\"\n>\n  <span\n    class=\"font-title font-medium text-base leading-tight truncate\"\n    [class]=\"!overlayOpen ? 'text-primary-black group-hover:text-white' : ''\"\n    [title]=\"displayName\"\n    >{{ displayName }}</span\n  >\n  <div\n    class=\"gn-ui-card-icon items-center justify-center w-10 h-8\"\n    [class]=\"\n      !overlayOpen ? 'group-hover:border-white group-hover:text-white' : ''\n    \"\n  >\n    @if (overlayOpen) {\n      <ng-icon class=\"!w-6 !h-6 !text-[24px]\" name=\"matClose\"></ng-icon>\n    } @else {\n      <ng-icon class=\"!w-6 !h-6 !text-[24px]\" name=\"matInfoOutline\"></ng-icon>\n    }\n  </div>\n</gn-ui-button>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\n  [cdkConnectedOverlayOpen]=\"overlayOpen\"\n  [cdkConnectedOverlayPositions]=\"overlayPositions\"\n  [cdkConnectedOverlayOffsetX]=\"overlayOffsetX\"\n  (overlayOutsideClick)=\"closeOverlay()\"\n  (detach)=\"closeOverlay()\"\n>\n  <div [style.width.px]=\"overlayWidth\">\n    <gn-ui-contact-details [contact]=\"contact\"></gn-ui-contact-details>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$7.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$7.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: ContactDetailsComponent, selector: "gn-ui-contact-details", inputs: ["contact"] }], viewProviders: [provideIcons({ matClose, matInfoOutline })], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ContactPillComponent, decorators: [{
             type: Component,
@@ -31628,7 +31758,7 @@ class FilterDropdownComponent {
         this.translateService = inject(TranslateService);
         this.spatialExtentMaxFileSize = getOptionalSearchConfig()?.SPATIAL_EXTENT_MAX_FILE_SIZE;
         this.selected$ = this.searchFacade.searchFilters$.pipe(switchMap((filters) => this.fieldsService.readFieldValuesFromFilters(filters)), map$1((fieldValues) => fieldValues[this.fieldName]), filter$1((selected) => !!selected), startWith$1([]), catchError(() => of([])));
-        this.selectedDateRange$ = this.selected$.pipe(map$1((selectedDateRange) => selectedDateRange));
+        this.selectedDateRange$ = this.selected$.pipe(map$1((selected) => (Array.isArray(selected) ? {} : selected)));
         this.spatialExtentErrorNotificationId = null;
     }
     onSelectedValues(values) {
@@ -31662,27 +31792,15 @@ class FilterDropdownComponent {
             value: v.value.toString(), // converting to string for the dropdown
         }))), catchError(() => of([])));
     }
-    onStartDateChange(start) {
-        if (!start)
-            return;
-        this.dateRange = { ...this.dateRange, start };
-    }
-    onEndDateChange(end) {
-        if (!end)
-            return;
-        this.dateRange = { ...this.dateRange, end };
-        if (this.dateRange.start && this.dateRange.end) {
-            this.fieldsService
-                .buildFiltersFromFieldValues({
-                [this.fieldName]: this.dateRange,
-            })
-                .subscribe((filters) => {
-                return this.searchService.updateFilters(filters);
-            });
-        }
+    onDateRangeChange(dateRange) {
+        this.fieldsService
+            .buildFiltersFromFieldValues({
+            [this.fieldName]: dateRange,
+        })
+            .subscribe((filters) => this.searchService.updateFilters(filters));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FilterDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: FilterDropdownComponent, isStandalone: true, selector: "gn-ui-filter-dropdown", inputs: { fieldName: "fieldName", title: "title" }, ngImport: i0, template: "@if (fieldType === 'dateRange') {\n  <gn-ui-date-range-dropdown\n    [title]=\"title\"\n    [startDate]=\"(selectedDateRange$ | async)?.start\"\n    [endDate]=\"(selectedDateRange$ | async)?.end\"\n    (startDateChange)=\"onStartDateChange($event)\"\n    (endDateChange)=\"onEndDateChange($event)\"\n  ></gn-ui-date-range-dropdown>\n} @else if (fieldType === 'spatialExtent') {\n  <gn-ui-spatial-extent-dropdown\n    [title]=\"title\"\n    [maxFileSizeMb]=\"spatialExtentMaxFileSize\"\n    (bboxChange)=\"onBboxChange($event)\"\n    (errorChange)=\"onSpatialExtentError($event)\"\n  ></gn-ui-spatial-extent-dropdown>\n} @else {\n  <gn-ui-dropdown-multiselect\n    class=\"w-full\"\n    [title]=\"title\"\n    [maxRows]=\"6\"\n    [choices]=\"(choices$ | async) || []\"\n    [selected]=\"selected$ | async\"\n    [allowSearch]=\"true\"\n    (selectValues)=\"onSelectedValues($event)\"\n    [attr.data-cy-field]=\"fieldName\"\n  >\n  </gn-ui-dropdown-multiselect>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DateRangeDropdownComponent, selector: "gn-ui-date-range-dropdown", inputs: ["title", "startDate", "endDate"], outputs: ["startDateChange", "endDateChange"] }, { kind: "component", type: DropdownMultiselectComponent, selector: "gn-ui-dropdown-multiselect", inputs: ["title", "choices", "selected", "allowSearch", "maxRows", "searchInputValue"], outputs: ["selectValues"] }, { kind: "component", type: SpatialExtentDropdownComponent, selector: "gn-ui-spatial-extent-dropdown", inputs: ["title", "maxFileSizeMb"], outputs: ["bboxChange", "errorChange"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: FilterDropdownComponent, isStandalone: true, selector: "gn-ui-filter-dropdown", inputs: { fieldName: "fieldName", title: "title" }, ngImport: i0, template: "@if (fieldType === 'dateRange') {\n  <gn-ui-date-range-dropdown\n    [title]=\"title\"\n    [dateRange]=\"(selectedDateRange$ | async) ?? {}\"\n    (dateRangeChange)=\"onDateRangeChange($event)\"\n  ></gn-ui-date-range-dropdown>\n} @else if (fieldType === 'spatialExtent') {\n  <gn-ui-spatial-extent-dropdown\n    [title]=\"title\"\n    [maxFileSizeMb]=\"spatialExtentMaxFileSize\"\n    (bboxChange)=\"onBboxChange($event)\"\n    (errorChange)=\"onSpatialExtentError($event)\"\n  ></gn-ui-spatial-extent-dropdown>\n} @else {\n  <gn-ui-dropdown-multiselect\n    class=\"w-full\"\n    [title]=\"title\"\n    [maxRows]=\"6\"\n    [choices]=\"(choices$ | async) || []\"\n    [selected]=\"selected$ | async\"\n    [allowSearch]=\"true\"\n    (selectValues)=\"onSelectedValues($event)\"\n    [attr.data-cy-field]=\"fieldName\"\n  >\n  </gn-ui-dropdown-multiselect>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DateRangeDropdownComponent, selector: "gn-ui-date-range-dropdown", inputs: ["title", "dateRange"], outputs: ["dateRangeChange"] }, { kind: "component", type: DropdownMultiselectComponent, selector: "gn-ui-dropdown-multiselect", inputs: ["title", "choices", "selected", "allowSearch", "maxRows", "searchInputValue"], outputs: ["selectValues"] }, { kind: "component", type: SpatialExtentDropdownComponent, selector: "gn-ui-spatial-extent-dropdown", inputs: ["title", "maxFileSizeMb"], outputs: ["bboxChange", "errorChange"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FilterDropdownComponent, decorators: [{
             type: Component,
@@ -31691,7 +31809,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                         DateRangeDropdownComponent,
                         DropdownMultiselectComponent,
                         SpatialExtentDropdownComponent,
-                    ], template: "@if (fieldType === 'dateRange') {\n  <gn-ui-date-range-dropdown\n    [title]=\"title\"\n    [startDate]=\"(selectedDateRange$ | async)?.start\"\n    [endDate]=\"(selectedDateRange$ | async)?.end\"\n    (startDateChange)=\"onStartDateChange($event)\"\n    (endDateChange)=\"onEndDateChange($event)\"\n  ></gn-ui-date-range-dropdown>\n} @else if (fieldType === 'spatialExtent') {\n  <gn-ui-spatial-extent-dropdown\n    [title]=\"title\"\n    [maxFileSizeMb]=\"spatialExtentMaxFileSize\"\n    (bboxChange)=\"onBboxChange($event)\"\n    (errorChange)=\"onSpatialExtentError($event)\"\n  ></gn-ui-spatial-extent-dropdown>\n} @else {\n  <gn-ui-dropdown-multiselect\n    class=\"w-full\"\n    [title]=\"title\"\n    [maxRows]=\"6\"\n    [choices]=\"(choices$ | async) || []\"\n    [selected]=\"selected$ | async\"\n    [allowSearch]=\"true\"\n    (selectValues)=\"onSelectedValues($event)\"\n    [attr.data-cy-field]=\"fieldName\"\n  >\n  </gn-ui-dropdown-multiselect>\n}\n" }]
+                    ], template: "@if (fieldType === 'dateRange') {\n  <gn-ui-date-range-dropdown\n    [title]=\"title\"\n    [dateRange]=\"(selectedDateRange$ | async) ?? {}\"\n    (dateRangeChange)=\"onDateRangeChange($event)\"\n  ></gn-ui-date-range-dropdown>\n} @else if (fieldType === 'spatialExtent') {\n  <gn-ui-spatial-extent-dropdown\n    [title]=\"title\"\n    [maxFileSizeMb]=\"spatialExtentMaxFileSize\"\n    (bboxChange)=\"onBboxChange($event)\"\n    (errorChange)=\"onSpatialExtentError($event)\"\n  ></gn-ui-spatial-extent-dropdown>\n} @else {\n  <gn-ui-dropdown-multiselect\n    class=\"w-full\"\n    [title]=\"title\"\n    [maxRows]=\"6\"\n    [choices]=\"(choices$ | async) || []\"\n    [selected]=\"selected$ | async\"\n    [allowSearch]=\"true\"\n    (selectValues)=\"onSelectedValues($event)\"\n    [attr.data-cy-field]=\"fieldName\"\n  >\n  </gn-ui-dropdown-multiselect>\n}\n" }]
         }], propDecorators: { fieldName: [{
                 type: Input
             }], title: [{
@@ -32311,12 +32429,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
 
 marker('search.filters.summaryLabel.user');
 marker('search.filters.summaryLabel.changeDate');
+const OPEN_BOUND = '…';
 class SearchFiltersSummaryItemComponent {
     constructor() {
         this.searchFacade = inject(SearchFacade);
         this.searchService = inject(SearchService);
         this.fieldsService = inject(FieldsService);
-        this.datePipe = inject(DatePipe);
+        this.dateService = inject(DateService);
         this.translate = inject(TranslateService);
         this.fieldValues$ = this.searchFacade.searchFilters$.pipe(switchMap((filters) => this.fieldsService.readFieldValuesFromFilters(filters)), map$2((fieldValues) => Array.isArray(fieldValues[this.fieldName])
             ? fieldValues[this.fieldName]
@@ -32343,9 +32462,10 @@ class SearchFiltersSummaryItemComponent {
     getReadableValues(fieldValues) {
         return fieldValues.map((value) => {
             if (this.fieldType === 'dateRange') {
+                const { start, end } = value;
                 return {
                     value,
-                    label: `${this.datePipe.transform(value.start, 'dd.MM.yyyy')} - ${this.datePipe.transform(value.end, 'dd.MM.yyyy')}`,
+                    label: `${this.formatBound(start)} - ${this.formatBound(end)}`,
                 };
             }
             else if (this.fieldName === 'user') {
@@ -32356,6 +32476,15 @@ class SearchFiltersSummaryItemComponent {
             }
         });
     }
+    formatBound(date) {
+        return date
+            ? this.dateService.formatDate(date, {
+                day: '2-digit',
+                month: '2-digit',
+                year: 'numeric',
+            })
+            : OPEN_BOUND;
+    }
     async removeFilterValue(fieldValue) {
         const currentFieldValues = await firstValueFrom(this.fieldValues$);
         const updatedFieldValues = currentFieldValues
@@ -32368,11 +32497,11 @@ class SearchFiltersSummaryItemComponent {
             .subscribe((filters) => this.searchService.updateFilters(filters));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: SearchFiltersSummaryItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: SearchFiltersSummaryItemComponent, isStandalone: true, selector: "gn-ui-search-filters-summary-item", inputs: { fieldName: "fieldName" }, providers: [DatePipe], ngImport: i0, template: "@if ((fieldValues$ | async)?.length > 0) {\n  <div class=\"flex flex-row items-center gap-2\">\n    <span class=\"text-gray-800\" data-cy=\"filterSummaryLabel\">{{\n      translatedLabel\n    }}</span>\n    @for (fieldValue of fieldValues$ | async; track fieldValue) {\n      <gn-ui-badge\n        class=\"gn-ui-badge\"\n        [style.--gn-ui-badge-rounded]=\"'8px'\"\n        [style.--gn-ui-badge-padding]=\"'3px 4px'\"\n        [style.--gn-ui-badge-text-color]=\"'black'\"\n        [style.--gn-ui-badge-background-color]=\"'#F2F2F2'\"\n        [style.--gn-ui-badge-font-weight]=\"'700'\"\n        [removable]=\"true\"\n        (badgeRemoveClicked)=\"removeFilterValue(fieldValue.value)\"\n        >{{ fieldValue.label }}</gn-ui-badge\n      >\n    }\n  </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: BadgeComponent, selector: "gn-ui-badge", inputs: ["clickable", "removable"], outputs: ["badgeRemoveClicked", "badgeClicked"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: SearchFiltersSummaryItemComponent, isStandalone: true, selector: "gn-ui-search-filters-summary-item", inputs: { fieldName: "fieldName" }, ngImport: i0, template: "@if ((fieldValues$ | async)?.length > 0) {\n  <div class=\"flex flex-row items-center gap-2\">\n    <span class=\"text-gray-800\" data-cy=\"filterSummaryLabel\">{{\n      translatedLabel\n    }}</span>\n    @for (fieldValue of fieldValues$ | async; track fieldValue) {\n      <gn-ui-badge\n        class=\"gn-ui-badge\"\n        [style.--gn-ui-badge-rounded]=\"'8px'\"\n        [style.--gn-ui-badge-padding]=\"'3px 4px'\"\n        [style.--gn-ui-badge-text-color]=\"'black'\"\n        [style.--gn-ui-badge-background-color]=\"'#F2F2F2'\"\n        [style.--gn-ui-badge-font-weight]=\"'700'\"\n        [removable]=\"true\"\n        (badgeRemoveClicked)=\"removeFilterValue(fieldValue.value)\"\n        >{{ fieldValue.label }}</gn-ui-badge\n      >\n    }\n  </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: BadgeComponent, selector: "gn-ui-badge", inputs: ["clickable", "removable"], outputs: ["badgeRemoveClicked", "badgeClicked"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: SearchFiltersSummaryItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gn-ui-search-filters-summary-item', standalone: true, imports: [CommonModule, BadgeComponent], providers: [DatePipe], template: "@if ((fieldValues$ | async)?.length > 0) {\n  <div class=\"flex flex-row items-center gap-2\">\n    <span class=\"text-gray-800\" data-cy=\"filterSummaryLabel\">{{\n      translatedLabel\n    }}</span>\n    @for (fieldValue of fieldValues$ | async; track fieldValue) {\n      <gn-ui-badge\n        class=\"gn-ui-badge\"\n        [style.--gn-ui-badge-rounded]=\"'8px'\"\n        [style.--gn-ui-badge-padding]=\"'3px 4px'\"\n        [style.--gn-ui-badge-text-color]=\"'black'\"\n        [style.--gn-ui-badge-background-color]=\"'#F2F2F2'\"\n        [style.--gn-ui-badge-font-weight]=\"'700'\"\n        [removable]=\"true\"\n        (badgeRemoveClicked)=\"removeFilterValue(fieldValue.value)\"\n        >{{ fieldValue.label }}</gn-ui-badge\n      >\n    }\n  </div>\n}\n" }]
+            args: [{ selector: 'gn-ui-search-filters-summary-item', standalone: true, imports: [CommonModule, BadgeComponent], template: "@if ((fieldValues$ | async)?.length > 0) {\n  <div class=\"flex flex-row items-center gap-2\">\n    <span class=\"text-gray-800\" data-cy=\"filterSummaryLabel\">{{\n      translatedLabel\n    }}</span>\n    @for (fieldValue of fieldValues$ | async; track fieldValue) {\n      <gn-ui-badge\n        class=\"gn-ui-badge\"\n        [style.--gn-ui-badge-rounded]=\"'8px'\"\n        [style.--gn-ui-badge-padding]=\"'3px 4px'\"\n        [style.--gn-ui-badge-text-color]=\"'black'\"\n        [style.--gn-ui-badge-background-color]=\"'#F2F2F2'\"\n        [style.--gn-ui-badge-font-weight]=\"'700'\"\n        [removable]=\"true\"\n        (badgeRemoveClicked)=\"removeFilterValue(fieldValue.value)\"\n        >{{ fieldValue.label }}</gn-ui-badge\n      >\n    }\n  </div>\n}\n" }]
         }], propDecorators: { fieldName: [{
                 type: Input
             }] } });
@@ -40392,7 +40521,7 @@ function flattenQueryParams(params) {
             const start = flattened[key].start;
             const end = flattened[key].end;
             flattened[key] = [
-                `${start ? formatDate(start) : ''}..${formatDate(end) || ''}`,
+                `${start ? formatDate(start) : ''}..${end ? formatDate(end) : ''}`,
             ];
         }
     }
@@ -40749,5 +40878,5 @@ const CHART_TYPE_VALUES = [
  * Generated bundle index. Do not edit.
  */
 
-export { ADD_RESULTS, ADD_SEARCH, AVAILABLE_LICENSES, AbstractAction, AbstractSearchField, ActionMenuComponent, AddLayerFromCatalogComponent, AddLayerRecordPreviewComponent, AddResults, AddSearch, AnchorLinkDirective, ApiCardComponent, ApplicationBannerComponent, AuthService, AutocompleteComponent, AvailableServicesField, AvatarComponent, AvatarServiceInterface, BASEMAP_LAYERS, BadgeComponent, BaseConverter, BaseFileReader, BaseReader, BlockListComponent, ButtonComponent, CHART_TYPE_VALUES, CLEAR_ERROR, CLEAR_RESULTS, CarouselComponent, CatalogTitleComponent, CellPopinComponent, ChartComponent, ChartViewComponent, CheckToggleComponent, CheckboxComponent, ClearError, ClearResults, ColorScaleComponent, ConfirmationDialogComponent, ContactDetailsComponent, ContactDetailsFormComponent, ContactPillComponent, ContentGhostComponent, CopyTextButtonComponent, DEFAULT_BASEMAP_LAYER, DEFAULT_CONFIGURATION, DEFAULT_GN4_LOGIN_URL, DEFAULT_GN4_LOGOUT_URL, DEFAULT_GN4_SETTINGS_URL, DEFAULT_LANG, DEFAULT_PAGE_SIZE, DEFAULT_RECORD_CONVERTER, DEFAULT_RESULTS_LAYOUT_CONFIG, DEFAULT_SEARCH_KEY, DEFAULT_SPATIAL_EXTENT_STYLE, DISABLE_AUTH, DISABLE_DRAFT, DO_NOT_USE_DEFAULT_BASEMAP, DataService, DataTableComponent, DataViewComponent, DataViewPermalinkComponent, DataViewShareComponent, DataViewWebComponentComponent, DatePickerComponent, DateRangeDropdownComponent, DateRangeInputsComponent, DateRangePickerComponent, DateRangeSearchField, DateService, DcatApConverter, DefaultRouterModule, DownloadItemComponent, DownloadsListComponent, DragAndDropFileInputComponent, DropdownMultiselectComponent, DropdownSelectorComponent, EDITOR_FEATURE_KEY, ES_QUERY_FIELDS_PRIORITY, ES_RESOURCES_VALUES, ES_SOURCE_SUMMARY, EXTERNAL_VIEWER_OPEN_NEW_TAB, EXTERNAL_VIEWER_URL_TEMPLATE, EditableLabelDirective, EditorFacade, EditorService, ElasticsearchService, ErrorComponent, ErrorType, ExpandablePanelButtonComponent, ExpandablePanelComponent, ExternalLinkCardComponent, ExternalViewerButtonComponent, FIELDS_BRIEF, FIELDS_SUMMARY, FILTER_GEOMETRY, FILTER_SUMMARY_IGNORE_LIST, FORMATS, FacetBlockComponent, FacetItemComponent, FacetListComponent, FacetsContainerComponent, FavoriteStarComponent, FavoritesService, FeatureCatalogListComponent, FeatureDetailComponent, FeatureEditorModule, FeatureMapModule, FeatureRecordModule, FeatureSearchModule, FetchError, FieldFocusDirective, FieldsService, FigureComponent, FigureContainerComponent, FileInputComponent, FileTranslateLoader, FilesDropDirective, FilterDropdownComponent, FormFieldArrayComponent, FormFieldComponent, FormFieldDateComponent, FormFieldFileComponent, FormFieldKeywordsComponent, FormFieldLicenseComponent, FormFieldObjectComponent, FormFieldRichComponent, FormFieldSimpleComponent, FormFieldSpatialExtentComponent, FormFieldTemporalExtentsComponent, FormFieldTopicsComponent, FormFieldWrapperComponent, FullTextSearchField, FuzzySearchComponent, GEONETWORK_UI_TAG_NAME, GEONETWORK_UI_VERSION, GeoDataBadgeComponent, GeoTableViewComponent, GeocodingComponent, GeojsonReader, Gn4Converter, Gn4PlatformMapper, Gn4PlatformService, Gn4Repository, Gn4SettingsService, GnUiHumanizeDateDirective, GpfApiDlComponent, GravatarService, I18nInterceptor, ISO_TOPICS, ImageFallbackDirective, ImageInputComponent, ImageOverlayPreviewComponent, ImportRecordComponent, InlineFilterComponent, InteractiveTableColumnComponent, InteractiveTableComponent, InternalLinkCardComponent, IsSpatialSearchField, Iso191153Converter, Iso19139Converter, KeywordBadgeComponent, KindBadgeComponent, LANGUAGES_LIST, LANGUAGE_NAMES, LANGUAGE_STORAGE_KEY, LANG_2_TO_3_MAPPER, LOGIN_URL, LOGOUT_URL, LONLAT_CRS_CODES, LanguageSwitcherComponent, LayersPanelComponent, LicenseSearchField, LinkClassifierService, LinkUsage, LoadingMaskComponent, LogService, MAP_FEATURE_KEY, MAP_VIEW_CONSTRAINTS, MAX_UPLOAD_SIZE_MB, METADATA_LANGUAGE, MapContainerComponent, MapFacade, MapLegendComponent, MapStateContainerComponent, MapStyleService, MapUtilsService, MapViewComponent, MarkdownEditorComponent, MarkdownParserComponent, MaxLinesComponent, mdview_actions as MdViewActions, MdViewFacade, MetadataCatalogComponent, MetadataContactComponent, MetadataDoiComponent, MetadataInfoComponent, MetadataLinkType, MetadataMapperContext, MetadataQualityComponent, MetadataQualityItemComponent, MetadataQualityPanelComponent, ModalDialogComponent, MultilingualPanelComponent, MultilingualSearchField, MyOrgService, NAMESPACES, NOT_APPLICABLE_CONSTRAINT, NOT_KNOWN_CONSTRAINT, NotificationComponent, NotificationsContainerComponent, NotificationsService, OPEN_DATA_LICENSE, ORGANIZATIONS_STRATEGY, ORGANIZATION_PAGE_URL_TOKEN, ORGANIZATION_URL_TOKEN, OnlineResourceCardComponent, OnlineServiceResourceInputComponent, OrganisationPreviewComponent, OrganisationsComponent, OrganisationsFilterComponent, OrganisationsResultComponent, OrganizationSearchField, OrganizationsFromGroupsService, OrganizationsFromMetadataService, OrganizationsServiceInterface, OwnerSearchField, PAGINATE, PARSE_DELIMITER, PATCH_RESULTS_AGGREGATIONS, PROXY_PATH, Paginate, PaginationButtonsComponent, PaginationComponent, PaginationDotsComponent, PatchResultsAggregations, PlatformServiceInterface, PopoverComponent, PopupAlertComponent, PossibleResourceTypes, PossibleResourceTypesDefinition, PreviousNextButtonsComponent, ProgressBarComponent, ProxyService, QUERY_FIELDS, RECORD_DATASET_URL_TOKEN, RECORD_REUSE_URL_TOKEN, RECORD_SERVICE_URL_TOKEN, REQUEST_MORE_ON_AGGREGATION, REQUEST_MORE_RESULTS, REQUEST_NEW_RESULTS, RESULTS_LAYOUT_CONFIG, REUSE_LIGHT_CONFIGURATION, ROUTER_CONFIG, ROUTER_ROUTE_DATASET, ROUTER_ROUTE_ORGANIZATION, ROUTER_ROUTE_REUSE, ROUTER_ROUTE_SEARCH, ROUTER_ROUTE_SERVICE, ROUTER_STATE_KEY, ROUTE_PARAMS, RecordApiFormComponent, RecordFormComponent, RecordKindField, RecordMetaComponent, RecordMetricComponent, RecordPreviewCardComponent, RecordPreviewComponent, RecordPreviewFeedComponent, RecordPreviewListComponent, RecordPreviewRowComponent, RecordPreviewTextComponent, RecordPreviewTitleComponent, RecordStatusValues, RecordsMetricsComponent, RecordsRepositoryInterface, RecordsService, RequestMoreOnAggregation, RequestMoreResults, RequestNewResults, ResourceTypeLegacyField, ResultsHitsContainerComponent, ResultsHitsNumberComponent, ResultsHitsSearchKindComponent, ResultsLayoutComponent, ResultsLayoutConfigItem, ResultsListComponent, ResultsListContainerComponent, ResultsListItemComponent, ResultsTableComponent, ResultsTableContainerComponent, ReusePresentationForms, RoleLabels, RoleValues, RouterEffects, RouterFacade, RouterService, SEARCH_FEATURE_KEY, SETTINGS_URL, SET_CONFIG_AGGREGATIONS, SET_CONFIG_FILTERS, SET_CONFIG_REQUEST_FIELDS, SET_ERROR, SET_FAVORITES_ONLY, SET_FILTERS, SET_INCLUDE_ON_AGGREGATION, SET_PAGE_SIZE, SET_RESULTS_AGGREGATIONS, SET_RESULTS_HITS, SET_RESULTS_LAYOUT, SET_SEARCH, SET_SORT_BY, SET_SPATIAL_FILTER_ENABLED, SPATIAL_SCOPES, SearchEffects, SearchFacade, SearchFeatureCatalogComponent, SearchFiltersSummaryComponent, SearchFiltersSummaryItemComponent, SearchInputComponent, SearchRouterContainerDirective, SearchService, SearchStateContainerDirective, SelectionService, ServiceCapabilitiesComponent, SetConfigAggregations, SetConfigFilters, SetConfigRequestFields, SetError, SetFavoritesOnly, SetFilters, SetIncludeOnAggregation, SetPageSize, SetResultsAggregations, SetResultsHits, SetResultsLayout, SetSearch, SetSortBy, SetSpatialFilterEnabled, SimpleSearchField, SiteTitleComponent, SortByComponent, SortByEnum, SortableListComponent, SourceLabelComponent, SourcesService, SpatialExtentComponent, SpatialExtentDropdownComponent, SpatialExtentSearchField, SpinningLoaderComponent, StacItemsResultGridComponent, StacViewComponent, StarToggleComponent, StickyHeaderComponent, SupportedTypes, SwitchToggleComponent, THUMBNAIL_PLACEHOLDER, TRANSLATE_DEBUG_CONFIG, TRANSLATE_DEFAULT_CONFIG, TRANSLATE_WITH_OVERRIDES_CONFIG, TableViewComponent, TextAreaComponent, TextInputComponent, ThemeService, ThumbnailComponent, TranslatedSearchField, TruncatedTextComponent, UPDATE_CONFIG_AGGREGATIONS, UPDATE_FILTERS, UPDATE_REQUEST_AGGREGATION_TERM, UpdateConfigAggregations, UpdateFilters, UrlInputComponent, UserFeedbackItemComponent, UserPreviewComponent, UserSearchField, VECTOR_STYLE_DEFAULT, ViewportIntersectorComponent, WEB_COMPONENT_EMBEDDER_URL, XmlParseError, _reset, allChildrenElement, appConfigWithTranslationFixture, appendChildTree, appendChildren, assertValidXml, associationTypeValues, bboxToPolygon, blockModelFixture, bytesToMegabytes, canEditRecord, checkFileFormat, clearSelectedFeatures, createChild, createDocument, createElement, createFuzzyFilter, createNestedChild, createNestedElement, createSpatialExtentLayer, currentPage, defaultMapStyleFixture, defaultMapStyleHlFixture, downgradeImage, downsizeImage, draftSaveSuccess, dragPanCondition, dropEmptyTranslations, editorReducer, emptyBlockModelFixture, findChildElement, findChildOrCreate, findChildrenElement, findConverterForDocument, findNestedChildOrCreate, findNestedElement, findNestedElements, findParent, firstChildElement, formatDate, formatUserInfo, getAddressLines, getAllKeysValidator, getArrayItem, getAsArray, getAsUrl, getBadgeColor, getCustomTranslations, getError, getFavoritesOnly, getFileFormat, getFileFormatFromServiceOutput, getFirstValue, getFormatPriority, getGeometryBoundingBox, getGeometryFromGeoJSON, getGlobalConfig, getIndividualDisplayName, getIsMobile, getJsonDataItemsProxy, getKeywordHierarchyPath, getLayers, getLinkId, getLinkLabel, getLinkPriority, getMapContext, getMapContextLayerFromConfig, getMapState, getMetadataQualityConfig, getMimeTypeForFormat, getNamespace, getOptionalEditorConfig, getOptionalMapConfig, getOptionalSearchConfig, getPageSize, getQualityValidators, getResourceType, getReusePresentationForm, getReuseType, getRootElement, getSearchConfigAggregations, getSearchFilters, getSearchResults, getSearchResultsAggregations, getSearchResultsHits, getSearchResultsLayout, getSearchResultsLoading, getSearchSortBy, getSearchState, getSearchStateSearch, getSelectedFeatures, getSpatialFilterEnabled, getTemporalRangeUnion, getThemeConfig, handleScrollOnNavigation, hasRecordChangedSinceDraft, hasRecordChangedSinceDraftSuccess, initSearch, initialEditorState, initialMapState, initialState, isConfigLoaded, isDateRange, isFileExtensionValid, isFormatInQueryParam, isPublished, itemModelFixture, kindToCodeListValue, loadAppConfig, malformedConfigFixture, mapConfigFixture, mapContact, mapKeywords, mapLogo, mapOrganization, mapReducer, markRecordAsChanged, matchesNoApplicableConstraint, matchesNoKnownConstraint, megabytesToBytes, mimeTypeToFormat, minimalAppConfigFixture, missingMandatoryConfigFixture, mouseWheelZoomCondition, noDuplicateFileName, okAppConfigFixture, openDataset, openRecord, organizationsServiceFactory, parse, parseXmlString, placeholder, prioritizePageScroll, propagateToDocumentOnly, provideGn4, provideI18n, provideRepositoryUrl, readAttribute, readDataset, readDatasetHeaders, readFileAsText, readText, reducer$2 as reducer, reducerSearch, removeAllChildren, removeChildren, removeChildrenByName, removeSearchParams, removeWhitespace, renameElements, saveRecord, saveRecordFailure, saveRecordSuccess, selectCanEditRecord, selectCurrentPage, selectEditorConfig, selectEditorState, selectFallback, selectFallbackFields, selectField, selectHasRecordChanged, selectIsPublished, selectRecord, selectRecordChangedSinceSave, selectRecordSaveError, selectRecordSaving, selectRecordSections, selectRecordSource, selectTranslatedField, selectTranslatedValue, setContext, setCurrentPage, setEditorConfiguration, setFieldVisibility, setFocusedField, setSelectedFeatures, setTextContent, sortByFromString, sortByToString, sortByToStrings, spatialExtentToGeometry, spatialExtentsToFeatureCollection, stripHtml, stripNamespace, toDate, toIndividual, toLang2, toLang3, totalPages, undoRecordDraft, unrecognizedKeysConfigFixture, updateFrequencyCodeValues, updateLanguages, updateRecordField, updateRecordLanguages, wmsLayerFlatten, writeAttribute, wrongLanguageCodeConfigFixture, xmlToString };
+export { ADD_RESULTS, ADD_SEARCH, AVAILABLE_LICENSES, AbstractAction, AbstractSearchField, ActionMenuComponent, AddLayerFromCatalogComponent, AddLayerRecordPreviewComponent, AddResults, AddSearch, AnchorLinkDirective, ApiCardComponent, ApplicationBannerComponent, AuthService, AutocompleteComponent, AutofocusDirective, AvailableServicesField, AvatarComponent, AvatarServiceInterface, BASEMAP_LAYERS, BadgeComponent, BaseConverter, BaseFileReader, BaseReader, BlockListComponent, ButtonComponent, CHART_TYPE_VALUES, CLEAR_ERROR, CLEAR_RESULTS, CarouselComponent, CatalogTitleComponent, CellPopinComponent, ChartComponent, ChartViewComponent, CheckToggleComponent, CheckboxComponent, ClearError, ClearResults, ColorScaleComponent, ConfirmationDialogComponent, ContactDetailsComponent, ContactDetailsFormComponent, ContactPillComponent, ContentGhostComponent, CopyTextButtonComponent, DEFAULT_BASEMAP_LAYER, DEFAULT_CONFIGURATION, DEFAULT_GN4_LOGIN_URL, DEFAULT_GN4_LOGOUT_URL, DEFAULT_GN4_SETTINGS_URL, DEFAULT_LANG, DEFAULT_PAGE_SIZE, DEFAULT_RECORD_CONVERTER, DEFAULT_RESULTS_LAYOUT_CONFIG, DEFAULT_SEARCH_KEY, DEFAULT_SPATIAL_EXTENT_STYLE, DISABLE_AUTH, DISABLE_DRAFT, DO_NOT_USE_DEFAULT_BASEMAP, DataService, DataTableComponent, DataViewComponent, DataViewPermalinkComponent, DataViewShareComponent, DataViewWebComponentComponent, DatePickerComponent, DateRangeDropdownComponent, DateRangeInputsComponent, DateRangePickerComponent, DateRangeSearchField, DateService, DcatApConverter, DefaultRouterModule, DownloadItemComponent, DownloadsListComponent, DragAndDropFileInputComponent, DropdownMultiselectComponent, DropdownSelectorComponent, EDITOR_FEATURE_KEY, ES_QUERY_FIELDS_PRIORITY, ES_RESOURCES_VALUES, ES_SOURCE_SUMMARY, EXTERNAL_VIEWER_OPEN_NEW_TAB, EXTERNAL_VIEWER_URL_TEMPLATE, EditableLabelDirective, EditorFacade, EditorService, ElasticsearchService, ErrorComponent, ErrorType, ExpandablePanelButtonComponent, ExpandablePanelComponent, ExternalLinkCardComponent, ExternalViewerButtonComponent, FIELDS_BRIEF, FIELDS_SUMMARY, FILTER_GEOMETRY, FILTER_SUMMARY_IGNORE_LIST, FORMATS, FacetBlockComponent, FacetItemComponent, FacetListComponent, FacetsContainerComponent, FavoriteStarComponent, FavoritesService, FeatureCatalogListComponent, FeatureDetailComponent, FeatureEditorModule, FeatureMapModule, FeatureRecordModule, FeatureSearchModule, FetchError, FieldFocusDirective, FieldsService, FigureComponent, FigureContainerComponent, FileInputComponent, FileTranslateLoader, FilesDropDirective, FilterDropdownComponent, FormFieldArrayComponent, FormFieldComponent, FormFieldDateComponent, FormFieldFileComponent, FormFieldKeywordsComponent, FormFieldLicenseComponent, FormFieldObjectComponent, FormFieldRichComponent, FormFieldSimpleComponent, FormFieldSpatialExtentComponent, FormFieldTemporalExtentsComponent, FormFieldTopicsComponent, FormFieldWrapperComponent, FullTextSearchField, FuzzySearchComponent, GEONETWORK_UI_TAG_NAME, GEONETWORK_UI_VERSION, GeoDataBadgeComponent, GeoTableViewComponent, GeocodingComponent, GeojsonReader, Gn4Converter, Gn4PlatformMapper, Gn4PlatformService, Gn4Repository, Gn4SettingsService, GnUiHumanizeDateDirective, GpfApiDlComponent, GravatarService, I18nInterceptor, ISO_TOPICS, ImageFallbackDirective, ImageInputComponent, ImageOverlayPreviewComponent, ImportRecordComponent, InlineFilterComponent, InteractiveTableColumnComponent, InteractiveTableComponent, InternalLinkCardComponent, IsSpatialSearchField, Iso191153Converter, Iso19139Converter, KeywordBadgeComponent, KindBadgeComponent, LANGUAGES_LIST, LANGUAGE_NAMES, LANGUAGE_STORAGE_KEY, LANG_2_TO_3_MAPPER, LOGIN_URL, LOGOUT_URL, LONLAT_CRS_CODES, LanguageSwitcherComponent, LayersPanelComponent, LicenseSearchField, LinkClassifierService, LinkUsage, LoadingMaskComponent, LogService, MAP_FEATURE_KEY, MAP_VIEW_CONSTRAINTS, MAX_UPLOAD_SIZE_MB, METADATA_LANGUAGE, MapContainerComponent, MapFacade, MapLegendComponent, MapStateContainerComponent, MapStyleService, MapUtilsService, MapViewComponent, MarkdownEditorComponent, MarkdownParserComponent, MaxLinesComponent, mdview_actions as MdViewActions, MdViewFacade, MetadataCatalogComponent, MetadataContactComponent, MetadataDoiComponent, MetadataInfoComponent, MetadataLinkType, MetadataMapperContext, MetadataQualityComponent, MetadataQualityItemComponent, MetadataQualityPanelComponent, ModalDialogComponent, MultilingualPanelComponent, MultilingualSearchField, MyOrgService, NAMESPACES, NOT_APPLICABLE_CONSTRAINT, NOT_KNOWN_CONSTRAINT, NotificationComponent, NotificationsContainerComponent, NotificationsService, OPEN_DATA_LICENSE, ORGANIZATIONS_STRATEGY, ORGANIZATION_PAGE_URL_TOKEN, ORGANIZATION_URL_TOKEN, OnlineResourceCardComponent, OnlineServiceResourceInputComponent, OrganisationPreviewComponent, OrganisationsComponent, OrganisationsFilterComponent, OrganisationsResultComponent, OrganizationSearchField, OrganizationsFromGroupsService, OrganizationsFromMetadataService, OrganizationsServiceInterface, OwnerSearchField, PAGINATE, PARSE_DELIMITER, PATCH_RESULTS_AGGREGATIONS, PROXY_PATH, Paginate, PaginationButtonsComponent, PaginationComponent, PaginationDotsComponent, PatchResultsAggregations, PlatformServiceInterface, PopoverComponent, PopupAlertComponent, PossibleResourceTypes, PossibleResourceTypesDefinition, PreviousNextButtonsComponent, ProgressBarComponent, ProxyService, QUERY_FIELDS, RECORD_DATASET_URL_TOKEN, RECORD_REUSE_URL_TOKEN, RECORD_SERVICE_URL_TOKEN, REQUEST_MORE_ON_AGGREGATION, REQUEST_MORE_RESULTS, REQUEST_NEW_RESULTS, RESULTS_LAYOUT_CONFIG, REUSE_LIGHT_CONFIGURATION, ROUTER_CONFIG, ROUTER_ROUTE_DATASET, ROUTER_ROUTE_ORGANIZATION, ROUTER_ROUTE_REUSE, ROUTER_ROUTE_SEARCH, ROUTER_ROUTE_SERVICE, ROUTER_STATE_KEY, ROUTE_PARAMS, RecordApiFormComponent, RecordFormComponent, RecordKindField, RecordMetaComponent, RecordMetricComponent, RecordPreviewCardComponent, RecordPreviewComponent, RecordPreviewFeedComponent, RecordPreviewListComponent, RecordPreviewRowComponent, RecordPreviewTextComponent, RecordPreviewTitleComponent, RecordStatusValues, RecordsMetricsComponent, RecordsRepositoryInterface, RecordsService, RequestMoreOnAggregation, RequestMoreResults, RequestNewResults, ResourceTypeLegacyField, ResultsHitsContainerComponent, ResultsHitsNumberComponent, ResultsHitsSearchKindComponent, ResultsLayoutComponent, ResultsLayoutConfigItem, ResultsListComponent, ResultsListContainerComponent, ResultsListItemComponent, ResultsTableComponent, ResultsTableContainerComponent, ReusePresentationForms, RoleLabels, RoleValues, RouterEffects, RouterFacade, RouterService, SEARCH_FEATURE_KEY, SETTINGS_URL, SET_CONFIG_AGGREGATIONS, SET_CONFIG_FILTERS, SET_CONFIG_REQUEST_FIELDS, SET_ERROR, SET_FAVORITES_ONLY, SET_FILTERS, SET_INCLUDE_ON_AGGREGATION, SET_PAGE_SIZE, SET_RESULTS_AGGREGATIONS, SET_RESULTS_HITS, SET_RESULTS_LAYOUT, SET_SEARCH, SET_SORT_BY, SET_SPATIAL_FILTER_ENABLED, SPATIAL_SCOPES, SearchEffects, SearchFacade, SearchFeatureCatalogComponent, SearchFiltersSummaryComponent, SearchFiltersSummaryItemComponent, SearchInputComponent, SearchRouterContainerDirective, SearchService, SearchStateContainerDirective, SelectionService, ServiceCapabilitiesComponent, SetConfigAggregations, SetConfigFilters, SetConfigRequestFields, SetError, SetFavoritesOnly, SetFilters, SetIncludeOnAggregation, SetPageSize, SetResultsAggregations, SetResultsHits, SetResultsLayout, SetSearch, SetSortBy, SetSpatialFilterEnabled, SimpleSearchField, SiteTitleComponent, SortByComponent, SortByEnum, SortableListComponent, SourceLabelComponent, SourcesService, SpatialExtentComponent, SpatialExtentDropdownComponent, SpatialExtentSearchField, SpinningLoaderComponent, StacItemsResultGridComponent, StacViewComponent, StarToggleComponent, StickyHeaderComponent, SupportedTypes, SwitchToggleComponent, THUMBNAIL_PLACEHOLDER, TRANSLATE_DEBUG_CONFIG, TRANSLATE_DEFAULT_CONFIG, TRANSLATE_WITH_OVERRIDES_CONFIG, TableViewComponent, TextAreaComponent, TextInputComponent, ThemeService, ThumbnailComponent, TranslatedSearchField, TruncatedTextComponent, UPDATE_CONFIG_AGGREGATIONS, UPDATE_FILTERS, UPDATE_REQUEST_AGGREGATION_TERM, UpdateConfigAggregations, UpdateFilters, UrlInputComponent, UserFeedbackItemComponent, UserPreviewComponent, UserSearchField, VECTOR_STYLE_DEFAULT, ViewportIntersectorComponent, WEB_COMPONENT_EMBEDDER_URL, XmlParseError, _reset, allChildrenElement, appConfigWithTranslationFixture, appendChildTree, appendChildren, assertValidXml, associationTypeValues, bboxToPolygon, blockModelFixture, bytesToMegabytes, canEditRecord, checkFileFormat, clearSelectedFeatures, createChild, createDocument, createElement, createFuzzyFilter, createNestedChild, createNestedElement, createSpatialExtentLayer, currentPage, defaultMapStyleFixture, defaultMapStyleHlFixture, downgradeImage, downsizeImage, draftSaveSuccess, dragPanCondition, dropEmptyTranslations, editorReducer, emptyBlockModelFixture, findChildElement, findChildOrCreate, findChildrenElement, findConverterForDocument, findNestedChildOrCreate, findNestedElement, findNestedElements, findParent, firstChildElement, formatDate, formatUserInfo, getAddressLines, getAllKeysValidator, getArrayItem, getAsArray, getAsUrl, getBadgeColor, getCustomTranslations, getError, getFavoritesOnly, getFileFormat, getFileFormatFromServiceOutput, getFirstValue, getFormatPriority, getGeometryBoundingBox, getGeometryFromGeoJSON, getGlobalConfig, getIndividualDisplayName, getIsMobile, getJsonDataItemsProxy, getKeywordHierarchyPath, getLayers, getLinkId, getLinkLabel, getLinkPriority, getMapContext, getMapContextLayerFromConfig, getMapState, getMetadataQualityConfig, getMimeTypeForFormat, getNamespace, getOptionalEditorConfig, getOptionalMapConfig, getOptionalSearchConfig, getPageSize, getQualityValidators, getResourceType, getReusePresentationForm, getReuseType, getRootElement, getSearchConfigAggregations, getSearchFilters, getSearchResults, getSearchResultsAggregations, getSearchResultsHits, getSearchResultsLayout, getSearchResultsLoading, getSearchSortBy, getSearchState, getSearchStateSearch, getSelectedFeatures, getSpatialFilterEnabled, getTemporalRangeUnion, getThemeConfig, handleScrollOnNavigation, hasRecordChangedSinceDraft, hasRecordChangedSinceDraftSuccess, initSearch, initialEditorState, initialMapState, initialState, isConfigLoaded, isDateRange, isFileExtensionValid, isFormatInQueryParam, isPublished, itemModelFixture, kindToCodeListValue, loadAppConfig, malformedConfigFixture, mapConfigFixture, mapContact, mapKeywords, mapLogo, mapOrganization, mapReducer, markRecordAsChanged, matchesNoApplicableConstraint, matchesNoKnownConstraint, megabytesToBytes, mimeTypeToFormat, minimalAppConfigFixture, missingMandatoryConfigFixture, mouseWheelZoomCondition, noDuplicateFileName, okAppConfigFixture, openDataset, openRecord, organizationsServiceFactory, parse, parseXmlString, placeholder, prioritizePageScroll, propagateToDocumentOnly, provideGn4, provideI18n, provideLocalizedDateAdapter, provideRepositoryUrl, readAttribute, readDataset, readDatasetHeaders, readFileAsText, readText, reducer$2 as reducer, reducerSearch, removeAllChildren, removeChildren, removeChildrenByName, removeSearchParams, removeWhitespace, renameElements, saveRecord, saveRecordFailure, saveRecordSuccess, selectCanEditRecord, selectCurrentPage, selectEditorConfig, selectEditorState, selectFallback, selectFallbackFields, selectField, selectHasRecordChanged, selectIsPublished, selectRecord, selectRecordChangedSinceSave, selectRecordSaveError, selectRecordSaving, selectRecordSections, selectRecordSource, selectTranslatedField, selectTranslatedValue, setContext, setCurrentPage, setEditorConfiguration, setFieldVisibility, setFocusedField, setSelectedFeatures, setTextContent, sortByFromString, sortByToString, sortByToStrings, spatialExtentToGeometry, spatialExtentsToFeatureCollection, stripHtml, stripNamespace, toDate, toIndividual, toLang2, toLang3, totalPages, undoRecordDraft, unrecognizedKeysConfigFixture, updateFrequencyCodeValues, updateLanguages, updateRecordField, updateRecordLanguages, wmsLayerFlatten, writeAttribute, wrongLanguageCodeConfigFixture, xmlToString };
 //# sourceMappingURL=geonetwork-ui.mjs.map