@sinequa/atomic-angular 0.2.2 → 0.2.5

package/fesm2022/sinequa-atomic-angular.mjs

@@ -2997,20 +2997,24 @@ class NavigationService {
      *
      * @type Observable<RouterEvent>
      */
-    navigationEnd$ = this.router.events.pipe(map(event => event), filter((event) => event instanceof NavigationEnd), tap(event => {
-        const url = event.url.slice(1).split('?')[0]; // Extract route name
+    navigationEnd$ = this.router.events.pipe(map((event) => event), filter((event) => event instanceof NavigationEnd), tap((event) => {
+        const url = event.url.slice(1).split("?")[0]; // Extract route name
         // TODO: use a "loading" configuration from globalConfig
-        if (url && url !== 'loading' && url !== this.urlAfterNavigation) {
+        if (url && url !== "loading" && url !== this.urlAfterNavigation) {
             this.auditService.notifyRouteChange(url);
         }
-    }), tap(event => (this.urlAfterNavigation = event.url)), shareReplay(1));
+    }), tap((event) => {
+        if (event.url !== "/login") {
+            this.urlAfterNavigation = event.url;
+        }
+    }), shareReplay(1));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: NavigationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: NavigationService, providedIn: 'root' });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: NavigationService, providedIn: "root" });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: NavigationService, decorators: [{
             type: Injectable,
             args: [{
-                    providedIn: 'root'
+                    providedIn: "root"
                 }]
         }] });
 
@@ -10301,11 +10305,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.7", ngImpor
  *
  * @public
  */
-const FILTER_DATE_ALLOW_CUSTOM_RANGE = new InjectionToken('date allow custom range', { factory: () => true });
+const FILTER_DATE_ALLOW_CUSTOM_RANGE = new InjectionToken("date allow custom range", {
+    factory: () => true
+});
 class DateComponent extends AggregationComponent {
     destroyRef;
     datepicker = viewChild(DateRangePickerDirective, ...(ngDevMode ? [{ debugName: "datepicker" }] : []));
-    title = input({ label: 'Date', icon: 'far fa-calendar-day' }, ...(ngDevMode ? [{ debugName: "title" }] : []));
+    title = input({ label: "Date", icon: "far fa-calendar-day" }, ...(ngDevMode ? [{ debugName: "title" }] : []));
     displayEmptyDistributionIntervals = input(false, ...(ngDevMode ? [{ debugName: "displayEmptyDistributionIntervals" }] : []));
     allowCustomRange = inject(FILTER_DATE_ALLOW_CUSTOM_RANGE);
     transloco = inject(TranslocoService);
@@ -10323,20 +10329,24 @@ class DateComponent extends AggregationComponent {
     constructor(destroyRef) {
         super();
         this.destroyRef = destroyRef;
-        this.transloco.langChanges$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(lang => {
+        this.transloco.langChanges$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((lang) => {
             this.lang.set(lang);
             this.datepicker()?.setOptions({ language: lang });
         });
         const abortController = new AbortController();
-        addEventListener('changeDate', this.onDateChange.bind(this), {
+        addEventListener("changeDate", this.onDateChange.bind(this), {
             signal: abortController.signal
         });
         // apply current date filter from queryParamsStore
         effect(() => {
-            this.updateForm(this.queryParamsStore.getFilter({ field: this.aggregation()?.column, name: this.aggregation()?.name }));
+            this.updateForm(this.queryParamsStore.getFilter({
+                field: this.aggregation()?.column,
+                name: this.aggregation()?.name
+            }));
         });
-        this.form.valueChanges.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(changes => {
-            this.validSelection.set(!!changes.option && (changes.option !== 'custom-range' || changes.customRange?.from !== null || changes.customRange?.to !== null));
+        this.form.valueChanges.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((changes) => {
+            this.validSelection.set(!!changes.option &&
+                (changes.option !== "custom-range" || changes.customRange?.from !== null || changes.customRange?.to !== null));
         });
         destroyRef.onDestroy(() => {
             abortController.abort();
@@ -10346,7 +10356,10 @@ class DateComponent extends AggregationComponent {
         const name = this.name();
         if (name !== null) {
             const agg = this.aggregationsService.processAggregation(name, this.column());
-            return { ...agg, items: agg?.items?.filter((item) => item.display !== 'custom-range') ?? [] };
+            return {
+                ...agg,
+                items: agg?.items?.filter((item) => item.display !== "custom-range") ?? []
+            };
         }
         return null;
     }, ...(ngDevMode ? [{ debugName: "aggregation" }] : []));
@@ -10354,9 +10367,10 @@ class DateComponent extends AggregationComponent {
         try {
             const filter = this.getFormValueFilter();
             this.queryParamsStore.updateFilter(filter);
+            this.selection.set(false);
         }
         catch (err) {
-            warn('Error applying date filter:', err);
+            warn("Error applying date filter:", err);
             if (err instanceof Error) {
                 notify.error(this.transloco.translate(err.message));
             }
@@ -10381,17 +10395,18 @@ class DateComponent extends AggregationComponent {
             return;
         }
         const { operator, value } = filter;
-        const code = this.dateOptions().find((option) => option.operator === operator && option.value === value)?.display ?? 'custom-range';
-        let from, to;
-        if (code === 'custom-range') {
+        const code = this.dateOptions().find((option) => option.operator === operator && option.value === value)
+            ?.display ?? "custom-range";
+        let from = null, to = null;
+        if (code === "custom-range") {
             switch (operator) {
-                case 'lte':
+                case "lte":
                     to = filter.value;
                     break;
-                case 'gte':
+                case "gte":
                     from = filter.value;
                     break;
-                case 'between':
+                case "between":
                     from = filter.start;
                     to = filter.end;
                     break;
@@ -10400,16 +10415,16 @@ class DateComponent extends AggregationComponent {
         const formValue = {
             option: code,
             customRange: {
-                from: code === 'custom-range' ? (from ?? null) : null,
-                to: code === 'custom-range' ? (to ?? null) : null
+                from: code === "custom-range" ? (from ?? null) : null,
+                to: code === "custom-range" ? (to ?? null) : null
             }
         };
         this.form.setValue(formValue);
         // Update the date range picker
         const datepicker = this.datepicker();
         if (datepicker) {
-            const start = new Date(formValue.customRange.from || '');
-            const end = new Date(formValue.customRange.to || '');
+            const start = new Date(formValue.customRange.from || "");
+            const end = new Date(formValue.customRange.to || "");
             setTimeout(() => {
                 datepicker.rangeDatepicker?.setDates(start, end);
             }, 1000);
@@ -10419,19 +10434,19 @@ class DateComponent extends AggregationComponent {
         const value = this.form.value;
         // value.option is null
         if (!value.option) {
-            throw new Error('filters.selectionInvalid');
+            throw new Error("filters.selectionInvalid");
         }
-        if (value.option !== 'custom-range') {
+        if (value.option !== "custom-range") {
             const dateOption = this.dateOptions().find((option) => option.display === value.option);
             const aggregation = this.aggregation();
             if (!aggregation) {
-                throw new Error('filters.aggregationNotFound');
+                throw new Error("filters.aggregationNotFound");
             }
             return {
                 name: aggregation.name,
-                operator: dateOption?.operator || 'eq',
+                operator: dateOption?.operator || "eq",
                 field: aggregation.column,
-                display: dateOption?.display ?? '',
+                display: dateOption?.display ?? "",
                 filters: dateOption?.filters,
                 value: dateOption?.value
             };
@@ -10442,7 +10457,7 @@ class DateComponent extends AggregationComponent {
             // if both are not null, operator is between
             const aggregation = this.aggregation();
             if (!aggregation) {
-                throw new Error('filters.aggregationNotFound');
+                throw new Error("filters.aggregationNotFound");
             }
             const filter = {
                 name: aggregation.name,
@@ -10450,24 +10465,24 @@ class DateComponent extends AggregationComponent {
                 display: value.option
             };
             if (value.customRange.from && value.customRange.to) {
-                filter.operator = 'between';
+                filter.operator = "between";
                 filter.start = value.customRange.from;
                 filter.end = value.customRange.to;
             }
             else if (value.customRange.from) {
-                filter.operator = 'gte';
+                filter.operator = "gte";
                 filter.value = value.customRange.from;
             }
             else if (value.customRange.to) {
-                filter.operator = 'lte';
+                filter.operator = "lte";
                 filter.value = value.customRange.to;
             }
             else {
-                throw new Error('filters.customRangeInvalid');
+                throw new Error("filters.customRangeInvalid");
             }
             return filter;
         }
-        throw new Error('filters.filterInvalid');
+        throw new Error("filters.filterInvalid");
     }
     onDateChange(event) {
         // Get the selected dates
@@ -10490,11 +10505,11 @@ class DateComponent extends AggregationComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: DateComponent, deps: [{ token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.7", type: DateComponent, isStandalone: true, selector: "date-filter,DateFilter", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, displayEmptyDistributionIntervals: { classPropertyName: "displayEmptyDistributionIntervals", publicName: "displayEmptyDistributionIntervals", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideTranslocoScope('filters')], viewQueries: [{ propertyName: "datepicker", first: true, predicate: DateRangePickerDirective, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<details (toggle)=\"onToggle($event)\" [attr.open]=\"expanded()\" [attr.name]=\"id()\" class=\"group space-y-2\">\n  <summary\n    [class.cursor-pointer]=\"collapsible()\"\n    class=\"m-0 flex h-8 w-full select-none items-center pl-1 text-sm font-semibold\"\n    (click)=\"onHeaderClick($event)\">\n    <ng-content select=\"label\">\n      @if (aggregation()?.icon) {\n        <i class=\"fa-fw {{ aggregation()?.icon }} mr-1\" aria-hidden=\"true\"></i>\n      }\n      <span class=\"grow\">{{ aggregation()?.display | syslang | transloco }}</span>\n    </ng-content>\n\n    <div class=\"ms-4\">\n      @if (hasFilters()) {\n        <button\n          variant=\"ghost\"\n          size=\"icon\"\n          [attr.title]=\"'filters.clearFilters' | transloco\"\n          [attr.aria-label]=\"'filters.clearFilters' | transloco\"\n          (click)=\"clear()\"\n          (keydown.enter)=\"clear()\">\n          <i class=\"fa-fw far fa-filter-circle-xmark\" aria-hidden=\"true\"></i>\n        </button>\n      }\n\n      @if (selection() && validSelection()) {\n        <button\n          variant=\"ghost\"\n          size=\"icon\"\n          [attr.title]=\"'filters.applyFilters' | transloco\"\n          [attr.aria-label]=\"'filters.applyFilters' | transloco\"\n          (click)=\"apply()\"\n          (keydown.enter)=\"apply()\">\n          <i class=\"fa-fw far fa-filter\" aria-hidden=\"true\"></i>\n        </button>\n      }\n      @if (collapsible()) {\n        <button variant=\"none\" title=\"Open/Close\" class=\"cursor-pointer [&_svg]:transition-transform [&_svg]:duration-150 group-open:[&_svg]:rotate-90\">\n          <chevronright />\n        </button>\n      }\n    </div>\n  </summary>\n\n  <!-- content wrapper -->\n  <form [formGroup]=\"form\">\n    <ul class=\"flex flex-col gap-1 pt-2\" role=\"list\">\n      @for (option of dateOptions(); track $index) {\n        <li\n          role=\"listitem\"\n          tabindex=\"0\"\n          (click)=\"radio.click()\"\n          [attr.aria-label]=\"option.display | syslang | transloco\"\n          [class]=\"\n            cn(\n              'flex p-0 px-2 leading-7',\n              form.get('option')?.value === option.display && 'bg-accent',\n              option.hidden && 'hidden',\n              option.disabled && 'disabled pointer-events-none text-neutral-300'\n            )\n          \"\n          [attr.aria-hidden]=\"option.disabled\">\n          <input\n            #radio\n            type=\"radio\"\n            formControlName=\"option\"\n            id=\"date-filter-{{ option.display }}\"\n            [attr.disabled]=\"option.disabled ? true : null\"\n            [attr.aria-disabled]=\"option.disabled\"\n            (click)=\"select()\"\n            value=\"{{ option.display }}\" />\n\n          <label for=\"date-filter-{{ option.display }}\" class=\"grow cursor-pointer p-1\">\n            {{ option.display | syslang | transloco }}\n          </label>\n        </li>\n      }\n\n      @if (allowCustomRange) {\n        <li role=\"listitem\" aria-label=\"custom range\" class=\"flex px-2 leading-7\" [class.select]=\"form.get('option')?.value === 'custom-range'\">\n          <input #radiorange type=\"radio\" formControlName=\"option\" id=\"date-filter-custom-range\" value=\"custom-range\" (click)=\"select()\" />\n\n          <div\n            class=\"flex w-[300px] grow gap-1 p-1\"\n            daterangepicker\n            datepicker-buttons\n            [datepicker-language]=\"lang()\"\n            [datepicker-min]=\"form.get('customRange.from')?.value || undefined\"\n            [datepicker-max]=\"form.get('customRange.to')?.value ?? today.toISOString()\"\n            (click)=\"radiorange.click()\">\n            <label for=\"datepicker-range-start\">{{ 'from' | transloco }}</label>\n\n            <input id=\"datepicker-range-start\" name=\"start\" type=\"text\" class=\"h-8\" />\n\n            <label for=\"datepicker-range-end\">{{ 'to' | transloco }}</label>\n\n            <input id=\"datepicker-range-end\" name=\"end\" type=\"text\" class=\"h-8\" />\n          </div>\n        </li>\n      }\n    </ul>\n  </form>\n</details>\n", styles: [":host{display:block}ul[role=list]{scrollbar-width:thin}\n"], dependencies: [{ kind: "directive", type: InputComponent, selector: "input[type=\"text\"], input[type=\"email\"], input[type=\"number\"], input[type=\"password\"], input[type=\"tel\"], input[type=\"url\"], input[type=\"time\"]", inputs: ["class", "variant", "decoration"] }, { kind: "directive", type: ButtonComponent, selector: "button,[role=\"button\"]", inputs: ["class", "variant", "decoration", "size"] }, { kind: "directive", type: ListItemComponent, selector: "[role=\"listitem\"], [role=\"option\"]", inputs: ["class", "variant", "decoration"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: DateRangePickerDirective, selector: "[daterangepicker]", inputs: ["datepicker-title", "datepicker-autohide", "datepicker-clear", "datepicker-today", "datepicker-buttons", "datepicker-today-highlight", "datepicker-language", "datepicker-format", "datepicker-max", "datepicker-min", "datepicker-orientation"] }, { kind: "component", type: ChevronRightIconComponent, selector: "chevron-right, ChevronRight, chevronright", inputs: ["class"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }, { kind: "pipe", type: SyslangPipe, name: "syslang" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.7", type: DateComponent, isStandalone: true, selector: "date-filter,DateFilter", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, displayEmptyDistributionIntervals: { classPropertyName: "displayEmptyDistributionIntervals", publicName: "displayEmptyDistributionIntervals", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "@container" }, providers: [provideTranslocoScope("filters")], viewQueries: [{ propertyName: "datepicker", first: true, predicate: DateRangePickerDirective, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<details (toggle)=\"onToggle($event)\" [attr.open]=\"expanded()\" [attr.name]=\"id()\" class=\"group space-y-2\">\n  <summary\n    [class.cursor-pointer]=\"collapsible()\"\n    class=\"m-0 flex h-8 w-full select-none items-center pl-1 text-sm font-semibold\"\n    (click)=\"onHeaderClick($event)\">\n    <ng-content select=\"label\">\n      @if (aggregation()?.icon) {\n        <i class=\"fa-fw {{ aggregation()?.icon }} mr-1\" aria-hidden=\"true\"></i>\n      }\n      <span class=\"grow\">{{ aggregation()?.display | syslang | transloco }}</span>\n    </ng-content>\n\n      @if (hasFilters()) {\n        <button\n          variant=\"ghost\"\n          size=\"icon\"\n          [attr.title]=\"'filters.clearFilters' | transloco\"\n          [attr.aria-label]=\"'filters.clearFilters' | transloco\"\n          (click)=\"clear()\"\n          (keydown.enter)=\"clear()\">\n          <i class=\"fa-fw far fa-filter-circle-xmark\" aria-hidden=\"true\"></i>\n        </button>\n      }\n\n      @if (selection() && validSelection()) {\n        <button\n          variant=\"ghost\"\n          size=\"icon\"\n          [attr.title]=\"'filters.applyFilters' | transloco\"\n          [attr.aria-label]=\"'filters.applyFilters' | transloco\"\n          (click)=\"apply()\"\n          (keydown.enter)=\"apply()\">\n          <i class=\"fa-fw far fa-filter\" aria-hidden=\"true\"></i>\n        </button>\n      }\n      @if (collapsible()) {\n        <button variant=\"none\" title=\"Open/Close\" class=\"cursor-pointer [&_svg]:transition-transform [&_svg]:duration-150 group-open:[&_svg]:rotate-90\">\n          <chevronright />\n        </button>\n      }\n  </summary>\n\n  <!-- content wrapper -->\n  <form [formGroup]=\"form\">\n    <ul class=\"flex flex-col gap-1 pt-2 scrollbar-thin max-h-[calc(var(--height,100%)-100px)] snap-y snap-start overflow-auto\" role=\"list\">\n      @for (option of dateOptions(); track $index) {\n        <li\n          role=\"listitem\"\n          tabindex=\"0\"\n          (click)=\"radio.click()\"\n          [attr.aria-label]=\"option.display | syslang | transloco\"\n          [class]=\"\n            cn(\n              'flex p-0 px-2 leading-7',\n              form.get('option')?.value === option.display && 'bg-accent',\n              option.hidden && 'hidden',\n              option.disabled && 'disabled pointer-events-none text-neutral-300'\n            )\n          \"\n          [attr.aria-hidden]=\"option.disabled\">\n          <input\n            #radio\n            type=\"radio\"\n            formControlName=\"option\"\n            id=\"date-filter-{{ option.display }}\"\n            [attr.disabled]=\"option.disabled ? true : null\"\n            [attr.aria-disabled]=\"option.disabled\"\n            (click)=\"select()\"\n            value=\"{{ option.display }}\" />\n\n          <label for=\"date-filter-{{ option.display }}\" class=\"grow cursor-pointer p-1\">\n            {{ option.display | syslang | transloco }}\n          </label>\n        </li>\n      }\n\n      @if (allowCustomRange) {\n        <li role=\"listitem\" aria-label=\"custom range\" class=\"flex px-2 leading-7\" [class.select]=\"form.get('option')?.value === 'custom-range'\">\n          <input #radiorange type=\"radio\" formControlName=\"option\" id=\"date-filter-custom-range\" value=\"custom-range\" (click)=\"select()\" />\n\n          <div\n            class=\"flex @max-[340px]:flex-wrap grow gap-1 p-1 @container\"\n            daterangepicker\n            datepicker-buttons\n            [datepicker-language]=\"lang()\"\n            [datepicker-min]=\"form.get('customRange.from')?.value || undefined\"\n            [datepicker-max]=\"form.get('customRange.to')?.value ?? today.toISOString()\"\n            (click)=\"radiorange.click()\">\n            <div class=\"flex gap-1\">\n              <label for=\"datepicker-range-start\" class=\"min-w-10\">{{ 'from' | transloco }}</label>\n              <input id=\"datepicker-range-start\" name=\"start\" type=\"text\" class=\"h-8 min-w-[13ch]\" />\n            </div>\n            <div class=\"flex gap-1\">\n              <label for=\"datepicker-range-end\" class=\"text-right min-w-10\">{{ 'to' | transloco }}</label>\n              <input id=\"datepicker-range-end\" name=\"end\" type=\"text\" class=\"h-8 min-w-[13ch]\" />\n            </div>\n          </div>\n        </li>\n      }\n    </ul>\n  </form>\n</details>\n", styles: [":host{display:block;width:340px;min-width:200px}ul[role=list]{scrollbar-width:thin}\n"], dependencies: [{ kind: "directive", type: InputComponent, selector: "input[type=\"text\"], input[type=\"email\"], input[type=\"number\"], input[type=\"password\"], input[type=\"tel\"], input[type=\"url\"], input[type=\"time\"]", inputs: ["class", "variant", "decoration"] }, { kind: "directive", type: ButtonComponent, selector: "button,[role=\"button\"]", inputs: ["class", "variant", "decoration", "size"] }, { kind: "directive", type: ListItemComponent, selector: "[role=\"listitem\"], [role=\"option\"]", inputs: ["class", "variant", "decoration"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: DateRangePickerDirective, selector: "[daterangepicker]", inputs: ["datepicker-title", "datepicker-autohide", "datepicker-clear", "datepicker-today", "datepicker-buttons", "datepicker-today-highlight", "datepicker-language", "datepicker-format", "datepicker-max", "datepicker-min", "datepicker-orientation"] }, { kind: "component", type: ChevronRightIconComponent, selector: "chevron-right, ChevronRight, chevronright", inputs: ["class"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }, { kind: "pipe", type: SyslangPipe, name: "syslang" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: DateComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'date-filter,DateFilter', standalone: true, providers: [provideTranslocoScope('filters')], imports: [
+            args: [{ selector: "date-filter,DateFilter", standalone: true, providers: [provideTranslocoScope("filters")], imports: [
                         InputComponent,
                         ButtonComponent,
                         ListItemComponent,
@@ -10503,7 +10518,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.7", ngImpor
                         SyslangPipe,
                         DateRangePickerDirective,
                         ChevronRightIconComponent
-                    ], template: "<details (toggle)=\"onToggle($event)\" [attr.open]=\"expanded()\" [attr.name]=\"id()\" class=\"group space-y-2\">\n  <summary\n    [class.cursor-pointer]=\"collapsible()\"\n    class=\"m-0 flex h-8 w-full select-none items-center pl-1 text-sm font-semibold\"\n    (click)=\"onHeaderClick($event)\">\n    <ng-content select=\"label\">\n      @if (aggregation()?.icon) {\n        <i class=\"fa-fw {{ aggregation()?.icon }} mr-1\" aria-hidden=\"true\"></i>\n      }\n      <span class=\"grow\">{{ aggregation()?.display | syslang | transloco }}</span>\n    </ng-content>\n\n    <div class=\"ms-4\">\n      @if (hasFilters()) {\n        <button\n          variant=\"ghost\"\n          size=\"icon\"\n          [attr.title]=\"'filters.clearFilters' | transloco\"\n          [attr.aria-label]=\"'filters.clearFilters' | transloco\"\n          (click)=\"clear()\"\n          (keydown.enter)=\"clear()\">\n          <i class=\"fa-fw far fa-filter-circle-xmark\" aria-hidden=\"true\"></i>\n        </button>\n      }\n\n      @if (selection() && validSelection()) {\n        <button\n          variant=\"ghost\"\n          size=\"icon\"\n          [attr.title]=\"'filters.applyFilters' | transloco\"\n          [attr.aria-label]=\"'filters.applyFilters' | transloco\"\n          (click)=\"apply()\"\n          (keydown.enter)=\"apply()\">\n          <i class=\"fa-fw far fa-filter\" aria-hidden=\"true\"></i>\n        </button>\n      }\n      @if (collapsible()) {\n        <button variant=\"none\" title=\"Open/Close\" class=\"cursor-pointer [&_svg]:transition-transform [&_svg]:duration-150 group-open:[&_svg]:rotate-90\">\n          <chevronright />\n        </button>\n      }\n    </div>\n  </summary>\n\n  <!-- content wrapper -->\n  <form [formGroup]=\"form\">\n    <ul class=\"flex flex-col gap-1 pt-2\" role=\"list\">\n      @for (option of dateOptions(); track $index) {\n        <li\n          role=\"listitem\"\n          tabindex=\"0\"\n          (click)=\"radio.click()\"\n          [attr.aria-label]=\"option.display | syslang | transloco\"\n          [class]=\"\n            cn(\n              'flex p-0 px-2 leading-7',\n              form.get('option')?.value === option.display && 'bg-accent',\n              option.hidden && 'hidden',\n              option.disabled && 'disabled pointer-events-none text-neutral-300'\n            )\n          \"\n          [attr.aria-hidden]=\"option.disabled\">\n          <input\n            #radio\n            type=\"radio\"\n            formControlName=\"option\"\n            id=\"date-filter-{{ option.display }}\"\n            [attr.disabled]=\"option.disabled ? true : null\"\n            [attr.aria-disabled]=\"option.disabled\"\n            (click)=\"select()\"\n            value=\"{{ option.display }}\" />\n\n          <label for=\"date-filter-{{ option.display }}\" class=\"grow cursor-pointer p-1\">\n            {{ option.display | syslang | transloco }}\n          </label>\n        </li>\n      }\n\n      @if (allowCustomRange) {\n        <li role=\"listitem\" aria-label=\"custom range\" class=\"flex px-2 leading-7\" [class.select]=\"form.get('option')?.value === 'custom-range'\">\n          <input #radiorange type=\"radio\" formControlName=\"option\" id=\"date-filter-custom-range\" value=\"custom-range\" (click)=\"select()\" />\n\n          <div\n            class=\"flex w-[300px] grow gap-1 p-1\"\n            daterangepicker\n            datepicker-buttons\n            [datepicker-language]=\"lang()\"\n            [datepicker-min]=\"form.get('customRange.from')?.value || undefined\"\n            [datepicker-max]=\"form.get('customRange.to')?.value ?? today.toISOString()\"\n            (click)=\"radiorange.click()\">\n            <label for=\"datepicker-range-start\">{{ 'from' | transloco }}</label>\n\n            <input id=\"datepicker-range-start\" name=\"start\" type=\"text\" class=\"h-8\" />\n\n            <label for=\"datepicker-range-end\">{{ 'to' | transloco }}</label>\n\n            <input id=\"datepicker-range-end\" name=\"end\" type=\"text\" class=\"h-8\" />\n          </div>\n        </li>\n      }\n    </ul>\n  </form>\n</details>\n", styles: [":host{display:block}ul[role=list]{scrollbar-width:thin}\n"] }]
+                    ], host: {
+                        class: "@container"
+                    }, template: "<details (toggle)=\"onToggle($event)\" [attr.open]=\"expanded()\" [attr.name]=\"id()\" class=\"group space-y-2\">\n  <summary\n    [class.cursor-pointer]=\"collapsible()\"\n    class=\"m-0 flex h-8 w-full select-none items-center pl-1 text-sm font-semibold\"\n    (click)=\"onHeaderClick($event)\">\n    <ng-content select=\"label\">\n      @if (aggregation()?.icon) {\n        <i class=\"fa-fw {{ aggregation()?.icon }} mr-1\" aria-hidden=\"true\"></i>\n      }\n      <span class=\"grow\">{{ aggregation()?.display | syslang | transloco }}</span>\n    </ng-content>\n\n      @if (hasFilters()) {\n        <button\n          variant=\"ghost\"\n          size=\"icon\"\n          [attr.title]=\"'filters.clearFilters' | transloco\"\n          [attr.aria-label]=\"'filters.clearFilters' | transloco\"\n          (click)=\"clear()\"\n          (keydown.enter)=\"clear()\">\n          <i class=\"fa-fw far fa-filter-circle-xmark\" aria-hidden=\"true\"></i>\n        </button>\n      }\n\n      @if (selection() && validSelection()) {\n        <button\n          variant=\"ghost\"\n          size=\"icon\"\n          [attr.title]=\"'filters.applyFilters' | transloco\"\n          [attr.aria-label]=\"'filters.applyFilters' | transloco\"\n          (click)=\"apply()\"\n          (keydown.enter)=\"apply()\">\n          <i class=\"fa-fw far fa-filter\" aria-hidden=\"true\"></i>\n        </button>\n      }\n      @if (collapsible()) {\n        <button variant=\"none\" title=\"Open/Close\" class=\"cursor-pointer [&_svg]:transition-transform [&_svg]:duration-150 group-open:[&_svg]:rotate-90\">\n          <chevronright />\n        </button>\n      }\n  </summary>\n\n  <!-- content wrapper -->\n  <form [formGroup]=\"form\">\n    <ul class=\"flex flex-col gap-1 pt-2 scrollbar-thin max-h-[calc(var(--height,100%)-100px)] snap-y snap-start overflow-auto\" role=\"list\">\n      @for (option of dateOptions(); track $index) {\n        <li\n          role=\"listitem\"\n          tabindex=\"0\"\n          (click)=\"radio.click()\"\n          [attr.aria-label]=\"option.display | syslang | transloco\"\n          [class]=\"\n            cn(\n              'flex p-0 px-2 leading-7',\n              form.get('option')?.value === option.display && 'bg-accent',\n              option.hidden && 'hidden',\n              option.disabled && 'disabled pointer-events-none text-neutral-300'\n            )\n          \"\n          [attr.aria-hidden]=\"option.disabled\">\n          <input\n            #radio\n            type=\"radio\"\n            formControlName=\"option\"\n            id=\"date-filter-{{ option.display }}\"\n            [attr.disabled]=\"option.disabled ? true : null\"\n            [attr.aria-disabled]=\"option.disabled\"\n            (click)=\"select()\"\n            value=\"{{ option.display }}\" />\n\n          <label for=\"date-filter-{{ option.display }}\" class=\"grow cursor-pointer p-1\">\n            {{ option.display | syslang | transloco }}\n          </label>\n        </li>\n      }\n\n      @if (allowCustomRange) {\n        <li role=\"listitem\" aria-label=\"custom range\" class=\"flex px-2 leading-7\" [class.select]=\"form.get('option')?.value === 'custom-range'\">\n          <input #radiorange type=\"radio\" formControlName=\"option\" id=\"date-filter-custom-range\" value=\"custom-range\" (click)=\"select()\" />\n\n          <div\n            class=\"flex @max-[340px]:flex-wrap grow gap-1 p-1 @container\"\n            daterangepicker\n            datepicker-buttons\n            [datepicker-language]=\"lang()\"\n            [datepicker-min]=\"form.get('customRange.from')?.value || undefined\"\n            [datepicker-max]=\"form.get('customRange.to')?.value ?? today.toISOString()\"\n            (click)=\"radiorange.click()\">\n            <div class=\"flex gap-1\">\n              <label for=\"datepicker-range-start\" class=\"min-w-10\">{{ 'from' | transloco }}</label>\n              <input id=\"datepicker-range-start\" name=\"start\" type=\"text\" class=\"h-8 min-w-[13ch]\" />\n            </div>\n            <div class=\"flex gap-1\">\n              <label for=\"datepicker-range-end\" class=\"text-right min-w-10\">{{ 'to' | transloco }}</label>\n              <input id=\"datepicker-range-end\" name=\"end\" type=\"text\" class=\"h-8 min-w-[13ch]\" />\n            </div>\n          </div>\n        </li>\n      }\n    </ul>\n  </form>\n</details>\n", styles: [":host{display:block;width:340px;min-width:200px}ul[role=list]{scrollbar-width:thin}\n"] }]
         }], ctorParameters: () => [{ type: i0.DestroyRef }], propDecorators: { datepicker: [{ type: i0.ViewChild, args: [i0.forwardRef(() => DateRangePickerDirective), { isSignal: true }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], displayEmptyDistributionIntervals: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayEmptyDistributionIntervals", required: false }] }] } });
 
 class FilterButtonComponent {
@@ -10596,13 +10613,19 @@ class FilterButtonComponent {
         }
       </button>
 
-      <PopoverContent class="min-w-fit" [position]="position()" [offset]="offset()">
+      <PopoverContent
+        class="min-w-fit w-max max-w-[90vw]"
+        [position]="position()"
+        [offset]="offset()"
+      >
         @if (isDate(filter().column)) {
           <DateFilter
+            class="*:details-content:[--height:19lh] w-max max-w-80"
             [name]="filter().name"
             [column]="filter().column"
             id="filter-{{ filter().column }}"
-            [title]="{ label: 'Date', icon: 'far fa-calendar-day' }" />
+            [title]="{ label: 'Date', icon: 'far fa-calendar-day' }"
+          />
         } @else {
           <Aggregation
             class="*:details-content:[--height:19lh] w-max max-w-80"
@@ -10660,13 +10683,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.7", ngImpor
         }
       </button>
 
-      <PopoverContent class="min-w-fit" [position]="position()" [offset]="offset()">
+      <PopoverContent
+        class="min-w-fit w-max max-w-[90vw]"
+        [position]="position()"
+        [offset]="offset()"
+      >
         @if (isDate(filter().column)) {
           <DateFilter
+            class="*:details-content:[--height:19lh] w-max max-w-80"
             [name]="filter().name"
             [column]="filter().column"
             id="filter-{{ filter().column }}"
-            [title]="{ label: 'Date', icon: 'far fa-calendar-day' }" />
+            [title]="{ label: 'Date', icon: 'far fa-calendar-day' }"
+          />
         } @else {
           <Aggregation
             class="*:details-content:[--height:19lh] w-max max-w-80"
@@ -11043,17 +11072,11 @@ class FiltersBarComponent {
      * ```
      */
     getFilterCriteria = () => {
-        const filtersbyName = this.appStore
-            .filters()
-            .map((f) => f.name)
-            .filter((name) => name !== undefined);
-        const filtersByColumn = this.appStore
-            .filters()
-            .map((f) => f.column)
-            .filter((column) => column !== undefined);
         return (filter) => {
-            const useColumnFilter = filtersbyName.length === 0;
-            return useColumnFilter ? filtersByColumn.includes(filter.column) : filtersbyName.includes(filter.name);
+            return this.appStore
+                .filters()
+                .some((f) => (!!f.name && filter.name === f.name && filter.column === f.column) ||
+                (!f.name && filter.column === f.column));
         };
     };
     constructor() {
@@ -12405,9 +12428,12 @@ class SignInComponent {
     config = globalConfig;
     class = input(...(ngDevMode ? [undefined, { debugName: "class" }] : []));
     changePassword = output();
-    username = model("", ...(ngDevMode ? [{ debugName: "username" }] : []));
-    password = model("", ...(ngDevMode ? [{ debugName: "password" }] : []));
-    credentials = computed(() => ({ username: this.username(), password: this.password() }), ...(ngDevMode ? [{ debugName: "credentials" }] : []));
+    username = model('', ...(ngDevMode ? [{ debugName: "username" }] : []));
+    password = model('', ...(ngDevMode ? [{ debugName: "password" }] : []));
+    credentials = computed(() => ({
+        username: this.username(),
+        password: this.password(),
+    }), ...(ngDevMode ? [{ debugName: "credentials" }] : []));
     authenticated = signal(isAuthenticated(), ...(ngDevMode ? [{ debugName: "authenticated" }] : []));
     user = signal(null, ...(ngDevMode ? [{ debugName: "user" }] : []));
     returnUrl = signal(null, ...(ngDevMode ? [{ debugName: "returnUrl" }] : []));
@@ -12416,6 +12442,7 @@ class SignInComponent {
     principalService = inject(PrincipalService);
     applicationService = inject(ApplicationService);
     appStore = inject(AppStore);
+    navigationService = inject(NavigationService);
     isValid = computed(() => {
         const creds = this.credentials();
         return creds?.username?.length > 0 && creds?.password?.length > 0;
@@ -12432,20 +12459,20 @@ class SignInComponent {
         });
         effect(() => {
             if (this.returnUrl() !== null) {
-                const [url] = this.returnUrl() || ["/"];
+                const [url] = this.returnUrl() || ['/'];
                 this.router.navigateByUrl(url);
             }
         });
-        fromEvent(window, "authenticated")
+        fromEvent(window, 'authenticated')
             .pipe(takeUntilDestroyed(this.destroyRef))
             .subscribe((event) => {
             this.authenticated.set(event.detail.authenticated);
-            const url = this.route.snapshot.queryParams["returnUrl"] || null;
+            const url = this.route.snapshot.queryParams['returnUrl'] || null;
             if (url !== null) {
                 this.returnUrl.set([url]);
             }
             if (isAuthenticated()) {
-                this.router.navigateByUrl(url ?? "/");
+                this.router.navigateByUrl(url ?? '/');
             }
         });
     }
@@ -12459,8 +12486,8 @@ class SignInComponent {
     }
     async handleLogin() {
         login().catch((error) => {
-            console.warn("An error occurred while logging in", error);
-            this.router.navigate(["error"]);
+            console.warn('An error occurred while logging in', error);
+            this.router.navigate(['error']);
         });
     }
     async handleLoginWithCredentials() {
@@ -12468,83 +12495,109 @@ class SignInComponent {
             return;
         try {
             const response = await login(this.credentials());
-            info("SignIn Login response:", response);
+            info('SignIn Login response:', response);
             if (response) {
                 const { createRoutes = false } = globalConfig;
                 this.applicationService.initialize(createRoutes);
             }
         }
         catch (err) {
-            warn("An error occurred while logging in", err);
-            if (typeof err === "string") {
-                notify.error("Login", { description: err });
+            warn('An error occurred while logging in', err);
+            if (typeof err === 'string') {
+                notify.error('Login', { description: err });
             }
             else {
                 const { errorMessage } = err;
-                notify.error("Login", { description: errorMessage });
+                notify.error('Login', { description: errorMessage });
             }
         }
     }
     handleBack() {
-        try {
-            window.history.back();
-        }
-        catch (err) {
-            error("Error navigating back:", err);
-            this.router.navigate(["/"]);
-        }
+        this.router.navigate([this.navigationService.urlAfterNavigation || "/"]);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: SignInComponent, deps: [{ token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.7", type: SignInComponent, isStandalone: true, selector: "signIn, signin, sign-in", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, username: { classPropertyName: "username", publicName: "username", isSignal: true, isRequired: false, transformFunction: null }, password: { classPropertyName: "password", publicName: "password", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changePassword: "changePassword", username: "usernameChange", password: "passwordChange" }, host: { properties: { "class": "cn('grid h-full w-full place-content-center', class())" } }, providers: [provideTranslocoScope("login")], ngImport: i0, template: `
-    <Card hover="no" cdkTrapFocus cdkTrapFocusAutoCapture="true" class="bg-card rounded-xl shadow-sm">
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.7", type: SignInComponent, isStandalone: true, selector: "signIn, signin, sign-in", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, username: { classPropertyName: "username", publicName: "username", isSignal: true, isRequired: false, transformFunction: null }, password: { classPropertyName: "password", publicName: "password", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changePassword: "changePassword", username: "usernameChange", password: "passwordChange" }, host: { properties: { "class": "cn('grid h-full w-full place-content-center', class())" } }, providers: [provideTranslocoScope('login')], ngImport: i0, template: `
+    <Card
+      hover="no"
+      cdkTrapFocus
+      cdkTrapFocusAutoCapture="true"
+      class="bg-card rounded-xl shadow-sm"
+    >
       @if (authenticated()) {
-        <CardHeader class="flex flex-row items-start gap-4">
-          <img class="content-(--logo-large) h-12" alt="logo" />
-          <div class="space-y-1">
-            <h3 class="text-2xl font-semibold leading-tight">
-              {{ 'login.welcomeBack' | transloco: { name: user()?.fullName ?? '' } }}
-            </h3>
-            <p class="text-muted-foreground text-sm">
-              {{ 'login.youAreLoggedIn' | transloco }}
-            </p>
-          </div>
-        </CardHeader>
+      <CardHeader class="flex flex-row items-start gap-4">
+        <img class="content-(--logo-large) h-12" alt="logo" />
+        <div class="space-y-1">
+          <h3 class="text-2xl font-semibold leading-tight">
+            {{
+              'login.welcomeBack' | transloco : { name: user()?.fullName ?? '' }
+            }}
+          </h3>
+          <p class="text-muted-foreground text-sm">
+            {{ 'login.youAreLoggedIn' | transloco }}
+          </p>
+        </div>
+      </CardHeader>
 
-        <CardFooter class="grid grid-cols-2 gap-3">
-          <button type="button" (click)="handleLogout()">{{ 'login.disconnect' | transloco }}</button>
-          <button (click)="handleBack()">{{ 'login.back' | transloco }}</button>
-        </CardFooter>
+      <CardFooter class="grid grid-cols-2 gap-3">
+        <button type="button" (click)="handleLogout()">
+          {{ 'login.disconnect' | transloco }}
+        </button>
+        <button (click)="handleBack()">{{ 'login.back' | transloco }}</button>
+      </CardFooter>
       } @else {
-        <CardHeader class="flex flex-col items-center gap-3 text-center">
-          <img class="content-(--logo-large) h-12" alt="logo" />
-        </CardHeader>
-
-        <CardContent class="grid gap-4">
-          @if (!config.autoOAuthProvider && !config.autoSAMLProvider) {
-            <div class="grid gap-2">
-              <label class="text-sm font-medium" for="username">{{ 'login.username' | transloco }}</label>
-              <input id="username" type="text" required [(ngModel)]="username" (keydown.enter)="handleLoginWithCredentials()" />
-            </div>
-
-            <div class="grid gap-2">
-              <label class="text-sm font-medium" for="password">{{ 'login.password' | transloco }}</label>
-              <input id="password" type="password" required [(ngModel)]="password" (keydown.enter)="handleLoginWithCredentials()" />
-            </div>
-
-            <button variant="primary" [disabled]="!isValid()" (click)="handleLoginWithCredentials()">
-              {{ 'login.connect' | transloco }}
-            </button>
-            @if (allowChangePassword()) {
-              <button (click)="changePassword.emit()">
-                {{ 'login.changePassword' | transloco }}
-              </button>
-            }
-          } @else {
-            <button (click)="handleLogin()">
-              {{ 'login.SignInWith' | transloco: { provider: config.autoOAuthProvider ? 'OAuth' : 'SAML' } }}
-            </button>
-          }
-        </CardContent>
+      <CardHeader class="flex flex-col items-center gap-3 text-center">
+        <img class="content-(--logo-large) h-12" alt="logo" />
+      </CardHeader>
+
+      <CardContent class="grid gap-4">
+        @if (!config.autoOAuthProvider && !config.autoSAMLProvider) {
+        <div class="grid gap-2">
+          <label class="text-sm font-medium" for="username">{{
+            'login.username' | transloco
+          }}</label>
+          <input
+            id="username"
+            type="text"
+            required
+            [(ngModel)]="username"
+            (keydown.enter)="handleLoginWithCredentials()"
+          />
+        </div>
+
+        <div class="grid gap-2">
+          <label class="text-sm font-medium" for="password">{{
+            'login.password' | transloco
+          }}</label>
+          <input
+            id="password"
+            type="password"
+            required
+            [(ngModel)]="password"
+            (keydown.enter)="handleLoginWithCredentials()"
+          />
+        </div>
+
+        <button
+          variant="primary"
+          [disabled]="!isValid()"
+          (click)="handleLoginWithCredentials()"
+        >
+          {{ 'login.connect' | transloco }}
+        </button>
+        @if (allowChangePassword()) {
+        <button (click)="changePassword.emit()">
+          {{ 'login.changePassword' | transloco }}
+        </button>
+        } } @else {
+        <button (click)="handleLogin()">
+          {{
+            'login.SignInWith'
+              | transloco
+                : { provider: config.autoOAuthProvider ? 'OAuth' : 'SAML' }
+          }}
+        </button>
+        }
+      </CardContent>
       }
     </Card>
   `, isInline: true, dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i2.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: InputComponent, selector: "input[type=\"text\"], input[type=\"email\"], input[type=\"number\"], input[type=\"password\"], input[type=\"tel\"], input[type=\"url\"], input[type=\"time\"]", inputs: ["class", "variant", "decoration"] }, { kind: "directive", type: ButtonComponent, selector: "button,[role=\"button\"]", inputs: ["class", "variant", "decoration", "size"] }, { kind: "directive", type: CardComponent, selector: ".card, card, Card", inputs: ["class", "variant", "hover"] }, { kind: "directive", type: CardHeaderComponent, selector: ".card-header, card-header, CardHeader, cardheader", inputs: ["class"] }, { kind: "directive", type: CardContentComponent, selector: ".card-content, card-content, CardContent, cardcontent", inputs: ["class"] }, { kind: "directive", type: CardFooterComponent, selector: ".card-footer, card-footer, CardFooter, cardfooter", inputs: ["class"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }] });
@@ -12552,7 +12605,7 @@ class SignInComponent {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.7", ngImport: i0, type: SignInComponent, decorators: [{
             type: Component,
             args: [{
-                    selector: "signIn, signin, sign-in",
+                    selector: 'signIn, signin, sign-in',
                     imports: [
                         RouterModule,
                         FormsModule,
@@ -12563,65 +12616,97 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.7", ngImpor
                         CardComponent,
                         CardHeaderComponent,
                         CardContentComponent,
-                        CardFooterComponent
+                        CardFooterComponent,
                     ],
-                    providers: [provideTranslocoScope("login")],
+                    providers: [provideTranslocoScope('login')],
                     template: `
-    <Card hover="no" cdkTrapFocus cdkTrapFocusAutoCapture="true" class="bg-card rounded-xl shadow-sm">
+    <Card
+      hover="no"
+      cdkTrapFocus
+      cdkTrapFocusAutoCapture="true"
+      class="bg-card rounded-xl shadow-sm"
+    >
       @if (authenticated()) {
-        <CardHeader class="flex flex-row items-start gap-4">
-          <img class="content-(--logo-large) h-12" alt="logo" />
-          <div class="space-y-1">
-            <h3 class="text-2xl font-semibold leading-tight">
-              {{ 'login.welcomeBack' | transloco: { name: user()?.fullName ?? '' } }}
-            </h3>
-            <p class="text-muted-foreground text-sm">
-              {{ 'login.youAreLoggedIn' | transloco }}
-            </p>
-          </div>
-        </CardHeader>
+      <CardHeader class="flex flex-row items-start gap-4">
+        <img class="content-(--logo-large) h-12" alt="logo" />
+        <div class="space-y-1">
+          <h3 class="text-2xl font-semibold leading-tight">
+            {{
+              'login.welcomeBack' | transloco : { name: user()?.fullName ?? '' }
+            }}
+          </h3>
+          <p class="text-muted-foreground text-sm">
+            {{ 'login.youAreLoggedIn' | transloco }}
+          </p>
+        </div>
+      </CardHeader>
 
-        <CardFooter class="grid grid-cols-2 gap-3">
-          <button type="button" (click)="handleLogout()">{{ 'login.disconnect' | transloco }}</button>
-          <button (click)="handleBack()">{{ 'login.back' | transloco }}</button>
-        </CardFooter>
+      <CardFooter class="grid grid-cols-2 gap-3">
+        <button type="button" (click)="handleLogout()">
+          {{ 'login.disconnect' | transloco }}
+        </button>
+        <button (click)="handleBack()">{{ 'login.back' | transloco }}</button>
+      </CardFooter>
       } @else {
-        <CardHeader class="flex flex-col items-center gap-3 text-center">
-          <img class="content-(--logo-large) h-12" alt="logo" />
-        </CardHeader>
-
-        <CardContent class="grid gap-4">
-          @if (!config.autoOAuthProvider && !config.autoSAMLProvider) {
-            <div class="grid gap-2">
-              <label class="text-sm font-medium" for="username">{{ 'login.username' | transloco }}</label>
-              <input id="username" type="text" required [(ngModel)]="username" (keydown.enter)="handleLoginWithCredentials()" />
-            </div>
-
-            <div class="grid gap-2">
-              <label class="text-sm font-medium" for="password">{{ 'login.password' | transloco }}</label>
-              <input id="password" type="password" required [(ngModel)]="password" (keydown.enter)="handleLoginWithCredentials()" />
-            </div>
-
-            <button variant="primary" [disabled]="!isValid()" (click)="handleLoginWithCredentials()">
-              {{ 'login.connect' | transloco }}
-            </button>
-            @if (allowChangePassword()) {
-              <button (click)="changePassword.emit()">
-                {{ 'login.changePassword' | transloco }}
-              </button>
-            }
-          } @else {
-            <button (click)="handleLogin()">
-              {{ 'login.SignInWith' | transloco: { provider: config.autoOAuthProvider ? 'OAuth' : 'SAML' } }}
-            </button>
-          }
-        </CardContent>
+      <CardHeader class="flex flex-col items-center gap-3 text-center">
+        <img class="content-(--logo-large) h-12" alt="logo" />
+      </CardHeader>
+
+      <CardContent class="grid gap-4">
+        @if (!config.autoOAuthProvider && !config.autoSAMLProvider) {
+        <div class="grid gap-2">
+          <label class="text-sm font-medium" for="username">{{
+            'login.username' | transloco
+          }}</label>
+          <input
+            id="username"
+            type="text"
+            required
+            [(ngModel)]="username"
+            (keydown.enter)="handleLoginWithCredentials()"
+          />
+        </div>
+
+        <div class="grid gap-2">
+          <label class="text-sm font-medium" for="password">{{
+            'login.password' | transloco
+          }}</label>
+          <input
+            id="password"
+            type="password"
+            required
+            [(ngModel)]="password"
+            (keydown.enter)="handleLoginWithCredentials()"
+          />
+        </div>
+
+        <button
+          variant="primary"
+          [disabled]="!isValid()"
+          (click)="handleLoginWithCredentials()"
+        >
+          {{ 'login.connect' | transloco }}
+        </button>
+        @if (allowChangePassword()) {
+        <button (click)="changePassword.emit()">
+          {{ 'login.changePassword' | transloco }}
+        </button>
+        } } @else {
+        <button (click)="handleLogin()">
+          {{
+            'login.SignInWith'
+              | transloco
+                : { provider: config.autoOAuthProvider ? 'OAuth' : 'SAML' }
+          }}
+        </button>
+        }
+      </CardContent>
       }
     </Card>
   `,
                     host: {
-                        "[class]": "cn('grid h-full w-full place-content-center', class())"
-                    }
+                        '[class]': "cn('grid h-full w-full place-content-center', class())",
+                    },
                 }]
         }], ctorParameters: () => [{ type: i0.DestroyRef }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], changePassword: [{ type: i0.Output, args: ["changePassword"] }], username: [{ type: i0.Input, args: [{ isSignal: true, alias: "username", required: false }] }, { type: i0.Output, args: ["usernameChange"] }], password: [{ type: i0.Input, args: [{ isSignal: true, alias: "password", required: false }] }, { type: i0.Output, args: ["passwordChange"] }] } });