@dflat-core/web 1.7.2077 → 1.7.2078

package/fesm2022/dflat-core-web-core-ux.mjs

@@ -2,7 +2,7 @@ import { ActionDisplay, AggregateFunction, ApiErrorTypes, ConditionalResults, Co
 import * as i1$5 from "@angular/common";
 import { CommonModule, Location } from "@angular/common";
 import * as i0 from "@angular/core";
-import { ApplicationRef, ChangeDetectionStrategy, Component, ContentChild, ContentChildren, Directive, ElementRef, EnvironmentInjector, EventEmitter, Host, HostBinding, HostListener, Inject, Injectable, InjectionToken, Injector, Input, LOCALE_ID, NgModule, Optional, Output, Pipe, TemplateRef, ViewChild, ViewChildren, ViewContainerRef, computed, createComponent, forwardRef, inject, signal } from "@angular/core";
+import { ApplicationRef, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChild, ContentChildren, Directive, ElementRef, EnvironmentInjector, EventEmitter, Host, HostBinding, HostListener, Inject, Injectable, InjectionToken, Injector, Input, LOCALE_ID, NgModule, Optional, Output, Pipe, TemplateRef, ViewChild, ViewChildren, ViewContainerRef, computed, createComponent, forwardRef, inject, signal } from "@angular/core";
 import * as i5 from "@angular/forms";
 import { FormControl, FormGroup, FormsModule, NG_VALIDATORS, NG_VALUE_ACCESSOR, ReactiveFormsModule, UntypedFormControl, UntypedFormGroup, Validators } from "@angular/forms";
 import * as i2$1 from "@angular/router";
@@ -2953,22 +2953,57 @@ var FilterContext = class FilterContext {
 		this.applyAdditionalQuery();
 	}
 	applyAdditionalQuery() {
-		const groups = this.additionalQuery$.value.Rows.map((row) => {
+		const filter = {
+			...this.filter$.value,
+			AdditionalQuery: this.buildAdditionalQuery() ?? null
+		};
+		this.setFilter(filter);
+	}
+	buildAdditionalQuery(excludedProperty) {
+		return toAdditionalQuery(this.additionalQuery$.value.Rows.map((row) => {
 			const conditions = [];
 			row.ClausesByPropertyName.forEach((element, property) => {
+				if (property === excludedProperty) return;
 				if (!Utilities.IsNil(element.FilterValue) && element.FilterValue !== "") conditions.push({
 					Property: property,
 					Operator: "like",
 					Value: String(element.FilterValue)
 				});
+				if (element.FilterValues?.length) conditions.push({
+					Property: property,
+					Operator: "in",
+					Values: element.FilterValues
+				});
 			});
 			return { Conditions: conditions };
-		});
-		const filter = {
+		}));
+	}
+	getDistinctValuesFilter(property) {
+		return {
 			...this.filter$.value,
-			AdditionalQuery: toAdditionalQuery(groups) ?? null
+			AdditionalQuery: this.buildAdditionalQuery(property) ?? null
 		};
-		this.setFilter(filter);
+	}
+	getFilterValues(property) {
+		return this.additionalQuery$.value.Rows[0]?.ClausesByPropertyName.get(property)?.FilterValues ?? [];
+	}
+	setFilterValues(property, values) {
+		if (!property) return;
+		let current = this.additionalQuery$.value;
+		if (current.Rows.length === 0) {
+			if (!values.length) return;
+			current.Rows.push(this.newFilterRow());
+		}
+		const row = current.Rows[0];
+		const clause = row.ClausesByPropertyName.get(property) ?? {
+			PropertyName: property,
+			Operator: FilterOperator.Contains,
+			FilterValue: void 0
+		};
+		clause.FilterValues = values.length ? [...values] : void 0;
+		row.ClausesByPropertyName.set(property, clause);
+		this.additionalQuery$.next(current);
+		this.applyAdditionalQuery();
 	}
 	setAggregateClause(aggregationRequest) {
 		this.setFilter({ AggregateClause: aggregationRequest });
@@ -15082,7 +15117,7 @@ var FieldComponent = class FieldComponent {
 			}],
 			ngImport: i0,
 			template: "<div [formGroup]=\"form\" class=\"field-container\">\r\n    <ng-container *ngIf=\"field\">\r\n        <div [hidden]=\"!!field.IsHidden\" [ngSwitch]=\"field.FilterType\">\r\n            <div class=\"label-group\" *ngIf=\"showLabel\">\r\n                <label *ngIf=\"field.FilterType != filterType.CheckBox &&\r\n                        field.FilterType != filterType.HorizComboBox\"\r\n                        [htmlFor]=\"field.PropertyName\">\r\n                    {{ field.Label }}\r\n                </label>\r\n                <img *ngIf=\"field.Required\"\r\n                    class=\"required-icon\"\r\n                    [src]=\"this.getRequiredIcon()\"\r\n                    alt=\"obligatoire\"\r\n                />\r\n            </div>\r\n\r\n            <!--String Input-->\r\n            <div *ngSwitchCase=\"filterType.String\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        [class]=\"this.inputClass\"\r\n                        [readonly]=\"this.readonly || field.ReadOnly\"\r\n                        [formControl]=\"this.control\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [type]=\"field.InputType\"\r\n                        (change)=\"this.onValueChanged($event)\"\r\n                        (input)=\"onValueInput($event)\"\r\n                        focusable\r\n                    />\r\n                </div>\r\n            </div>\r\n\r\n            <!--Number Input-->\r\n            <div *ngSwitchCase=\"filterType.Integer\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        [class]=\"this.inputClass\"\r\n                        [readonly]=\"this.readonly || field.ReadOnly\"\r\n                        [formControl]=\"this.control\"\r\n                        [id]=\"field.PropertyName\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        (input)=\"onValueInput($event)\"\r\n                        type=\"number\"\r\n                        focusable\r\n                        />\r\n                </div>\r\n            </div>\r\n             <div *ngSwitchCase=\"filterType.Decimal\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        [class]=\"this.inputClass\"\r\n                        [readonly]=\"this.readonly || field.ReadOnly\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        (input)=\"onValueInput($event)\"\r\n                        type=\"text\"\r\n                        inputmode=\"decimal\"\r\n                        algDecimalInput\r\n                        />\r\n                </div>\r\n            </div>\r\n            <!--ComboBox Input-->\r\n            <div *ngSwitchCase=\"filterType.ComboBox\" class=\"form-group\">\r\n                <div>\r\n                    <ng-select\r\n                        appendTo=\"body\"\r\n                        placeholder=\"Sélectionner {{ field.Label }}\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [items]=\"field.Data\"\r\n                        [multiple]=\"field.MultipleSelection\"\r\n                        [hideSelected]=\"field.HideSelected\"\r\n                        bindValue=\"{{ field.ValueMember }}\"\r\n                        [clearable]=\"field.IsClearable\"\r\n                        bindLabel=\"{{ field.DisplayMember }}\"\r\n                        [selectOnTab]=\"true\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [readonly]=\"this.readonly || field.ReadOnly\"\r\n                    >\r\n                    </ng-select>\r\n                </div>\r\n            </div>\r\n\r\n            <!-- InputSelect -->\r\n            <!-- <div *ngSwitchCase=\"this.filterType.Custom\" class=\"form-group input\">\r\n        <alg-input-selector #inputSelector\r\n            type=\"text\"\r\n            (change)=\"onValueChanged($event)\"\r\n            [id]=\"this.field.PropertyName\"\r\n            [formControlName]=\"field.PropertyName\"\r\n            [modalPropertyValue]=\"this.field.ModalPropertyValue\"\r\n            [modalPropertyName]=\"this.field.ModalPropertyName\"\r\n            [modalEntityKey]=\"this.field.ModalEntityKey\"\r\n            [modalTitle]=\"this.field.ModalTitle\"\r\n            [readonly]=\"this.field.ReadOnly\">\r\n        </alg-input-selector>\r\n    </div> -->\r\n\r\n            <!-- InputSelector with button -->\r\n            <ng-container *ngSwitchCase=\"this.filterType.Custom\">\r\n                <!-- <alg-selector\r\n                    #inputSelector\r\n                    type=\"text\"\r\n                    (change)=\"this.inputSelectorChanged($event)\"\r\n                    [id]=\"field.PropertyName\"\r\n                    [formControlName]=\"field.PropertyName\"\r\n                    [modalPropertyValue]=\"field.ModalPropertyValue\"\r\n                    [modalPropertyName]=\"field.ModalPropertyName\"\r\n                    [modalEntityKey]=\"field.ModalEntityKey\"\r\n                    [modalTitle]=\"field.ModalTitle\">\r\n                </alg-selector> -->\r\n\r\n                <!-- *ngSwitchCase=\"filterType.Custom\" -->\r\n                 <ng-container *ngIf=\"field.ModalOnly\">\r\n                    <div class=\"pull-left input-select-default with-button\">\r\n                        <input\r\n                            class=\"form-control\"\r\n                            [readonly]=\"true\"\r\n                            [name]=\"this.field.PropertyName\"\r\n                            [id]=\"this.field.PropertyName\"\r\n                            [formControlName]=\"field.PropertyName\"\r\n                            />\r\n                 </div>    \r\n                </ng-container>\r\n\r\n                <alg-selector\r\n                    [field]=\"field\"\r\n                    [control]=\"this.control\"\r\n                    (change)=\"this.inputSelectorChanged($event)\"\r\n                    \r\n                    >\r\n                    <!-- [control]=\"this.form.controls[field.PropertyName]\" -->\r\n                </alg-selector>\r\n\r\n            </ng-container>\r\n\r\n            <!-- TreeSelector -->\r\n            <ng-container *ngSwitchCase=\"this.filterType.TreeSelector\">\r\n                <alg-input-tree-selector\r\n                    [items]=\"field.Data\"\r\n                    [id]=\"field.PropertyName\"\r\n                    [bindValue]=\"field.ValueMember\"\r\n                    [bindLabel]=\"field.DisplayMember\"\r\n                    childrenKey=\"children\"\r\n                    countKey=\"childrenCount\"\r\n                    [formControlName]=\"field.PropertyName\"\r\n                    placeholder=\"{{ field.Label }}\"\r\n                    (change)=\"onValueChanged($event)\"\r\n                >\r\n                </alg-input-tree-selector>\r\n            </ng-container>\r\n\r\n            <!-- TextWithbutton -->\r\n            <ng-container\r\n                *ngSwitchCase=\"this.filterType.TextWithButton\"\r\n                class=\"form-group\"\r\n            >\r\n                <div class=\"input-with-button\">\r\n\r\n                    <input\r\n                        type=\"text\"\r\n                        class=\"form-control\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [name]=\"this.field.PropertyName\"\r\n                        [id]=\"this.field.PropertyName\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [readonly]=\"this.readonly || field.ReadOnly\"\r\n                    />\r\n\r\n                    <button\r\n                        class=\"btn btn-secondary btn-32 btn-input-select\"\r\n                        (click)=\"onClick(field)\"\r\n                    >\r\n                        <span class=\"fa fa-ellipsis-h\"></span>\r\n                    </button>\r\n                </div>\r\n            </ng-container>\r\n\r\n            <!--HorizComboBox Input-->\r\n            <div *ngSwitchCase=\"filterType.HorizComboBox\" class=\"form-group\">\r\n                <div>\r\n                    <ng-select\r\n                        appendTo=\"body\"\r\n                        class=\"horiz-combox-box\"\r\n                        placeholder=\"{{ field.Label }}\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [items]=\"field.Data\"\r\n                        [multiple]=\"field.MultipleSelection\"\r\n                        [hideSelected]=\"field.HideSelected\"\r\n                        bindValue=\"{{ field.ValueMember }}\"\r\n                        bindLabel=\"{{ field.DisplayMember }}\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                    >\r\n                    </ng-select>\r\n                </div>\r\n            </div>\r\n\r\n            <!--Boolean Input-->\r\n            <div *ngSwitchCase=\"filterType.CheckBox\" class=\"form-group\">\r\n                <div class=\"checkbox-container\">\r\n                    <label class=\"switch\" [htmlFor]=\"field.PropertyName\">\r\n                        <input\r\n                            [formControlName]=\"field.PropertyName\"\r\n                            [id]=\"field.PropertyName\"\r\n                            [readonly]=\"this.readonly || field.ReadOnly\"\r\n                            type=\"checkbox\"\r\n                            (change)=\"onValueChanged($event)\"\r\n                        />\r\n                        <span class=\"slider round\"></span>\r\n                    </label>\r\n                    <span class=\"checkbox-label\">{{ field.Label }}</span>\r\n                </div>\r\n            </div>\r\n\r\n            <!--Enum Input-->\r\n            <div *ngSwitchCase=\"filterType.RadioButton\" class=\"form-group\">\r\n                <div class=\"radio-button-container\">\r\n                    <form [formGroup]=\"form\" class=\"radio-buttons\">\r\n                        <div\r\n                            *ngFor=\"let data of field.Data;let indexOfData = index\" class=\"radio-button\">\r\n                            <input\r\n                                type=\"radio\"\r\n                                [formControlName]=\"field.PropertyName\"\r\n                                [id]=\"getRadioButtonId(field.PropertyName,indexOfData)\"\r\n                                [value]=\"indexOfData\"\r\n                                (change)=\"onValueChanged($event)\"\r\n                                />\r\n                            <label class=\"radio-button-label\">{{ data }}</label>\r\n                        </div>\r\n                    </form>\r\n                </div>\r\n            </div>\r\n\r\n            <!-- Text zone with button -->\r\n            <div *ngSwitchCase=\"filterType.TextZoneWithButton\"\r\n                class=\"form-group\">\r\n                <div class=\"text-zone-and-button\">\r\n                    <div class=\"text-zone-container\">\r\n                        <textarea\r\n                            #textarea\r\n                            type=\"text\"\r\n                            class=\"text-area\"\r\n                            spellcheck=\"false\"\r\n                            [formControlName]=\"field.ValueMember\"\r\n                            [id]=\"field.PropertyName\"\r\n                            [readonly]=\"this.readonly || field.ReadOnly\"\r\n                            (change)=\"onValueChanged($event)\"\r\n                        >\r\n                        </textarea>\r\n                    </div>\r\n                    <div class=\"feedback-and-button\">\r\n                        <div class=\"feedback\">\r\n                            <div class=\"feedback-green\" *ngIf=\"field.TextWithStyle.GreenText.length > 0\">\r\n                                {{ field.TextWithStyle.GreenText }}\r\n                            </div>\r\n                            <div class=\"feedback-yellow\" *ngIf=\"field.TextWithStyle.YellowText.length > 0\">\r\n                                {{ field.TextWithStyle.YellowText }}\r\n                            </div>\r\n                            <div class=\"feedback-red\" *ngIf=\"field.TextWithStyle.RedText.length > 0\">\r\n                                {{ field.TextWithStyle.RedText }}\r\n                            </div>\r\n                        </div>\r\n                        <button\r\n                            type=\"button\"\r\n                            id=\"botton-compile\"\r\n                            class=\"btn btn-primary btn-flat pull-right button\"\r\n                            (click)=\"onClick(field)\"\r\n                        >\r\n                            {{ field.ButtonLabel }}\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <!--Date -->\r\n            <div *ngSwitchCase=\"filterType.Date\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        type=\"text\"\r\n                        [class]=\"this.inputClass\"\r\n                        placeholder=\"Sélectionner une date\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [bsConfig]=\"bsConfig\"\r\n                        [bsValue]=\"dateValue\"\r\n                        (bsValueChange)=\"onBsValueChanged($event)\"\r\n                        [disabled]=\"this.readonly || field.ReadOnly\"\r\n                        algDatepicker\r\n                    />\r\n                </div>\r\n            </div>\r\n            <!--DateTime -->\r\n            <div *ngSwitchCase=\"filterType.DateTime\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        type=\"datetime-local\"\r\n                        [class]=\"this.inputClass\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [value]=\"dateTimeLocalValue\"\r\n                        [disabled]=\"this.readonly || field.ReadOnly\"\r\n                        (change)=\"onDateTimeLocalChanged($event)\"\r\n                    />\r\n                </div>\r\n            </div>\r\n\r\n            <!-- Text input -->\r\n            <div *ngSwitchCase=\"filterType.Text\" class=\"form-group\">\r\n                <div>\r\n                    <textarea\r\n                        type=\"text\"\r\n                        rows=\"5\"\r\n                        [class]=\"this.inputClass\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [readonly]=\"this.readonly || field.ReadOnly\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [id]=\"field.PropertyName\"\r\n                    >\r\n                    </textarea>\r\n                </div>\r\n            </div>\r\n\r\n            <!-- DropFileZone -->\r\n            <div\r\n                *ngSwitchCase=\"filterType.DropFileZone\"\r\n                class=\"form-group ml-4\"\r\n            >\r\n                <fieldset>\r\n                    <input\r\n                        [id]=\"field.PropertyName\"\r\n                        type=\"file\"\r\n                        class=\"ml--3\"\r\n                        (change)=\"fileEvent($event)\"\r\n                    />\r\n                </fieldset>\r\n            </div>\r\n\r\n            <!-- Password -->\r\n            <div *ngSwitchCase=\"filterType.Password\" class=\"form-group\">\r\n                <div  class=\"input-with-button\">\r\n                    <input\r\n                        class=\"form-control\"\r\n                        [type]=\"hidePassword ? 'password' : 'text'\"\r\n                        [formControl]=\"control\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [name]=\"field.PropertyName\"\r\n                        [readonly]=\"this.readonly || field.ReadOnly\"\r\n                        autocomplete=\"new-password\"\r\n                    />\r\n                    <!-- btn-32 pull-right button -->\r\n                    <button class=\"btn btn-secondary btn-32 btn-input-select\" (click)=\"showPassword()\">\r\n                        <i class=\"fa fa-eye\" aria-hidden=\"true\"></i>\r\n                    </button>\r\n                </div>\r\n            </div>\r\n\r\n            <ng-container *ngIf=\"this.showValidationErrors()\">\r\n                <div class=\"validation-message\">\r\n                    {{ this.getValidationErrors() }}\r\n                </div>\r\n                <!-- <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('required')\">\r\n            Ce champ est obligatoire\r\n        </ng-container>\r\n        <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('min')\">\r\n            Minimum: {{field.FieldValidators.MinValue}}\r\n        </ng-container>\r\n        <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('max')\">\r\n            Maximum: {{field.FieldValidators.MaxValue}}\r\n        </ng-container>\r\n        <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('maxLength')\">\r\n            Longueur maximale: {{field.FieldValidators.MaxLength}} caractères\r\n        </ng-container> -->\r\n            </ng-container>\r\n        </div>\r\n    </ng-container>\r\n</div>\r\n",
-			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}:host{width:100%}.input-select-default{width:100%}.input-select-default.with-button{padding-right:35px;margin-right:-32px}.btn-input-select{padding:6px 10px 8px 8px;border-top-right-radius:0;border-bottom-right-radius:0;width:32px;border-color:#adb5bd}.form-group{display:flex;flex-direction:column}.field-container{margin-bottom:5px}.comboBox-icon-and-text{display:inline-block}.comboBox-icon{margin-right:5px;margin-bottom:5px}.comboBox-text{padding-right:10px}.checkbox-label{margin-left:5px;margin-top:5px;flex:1}.checkbox-input{width:17px;height:17px}.radio-button-container{border:1px solid #cbc8d0;border-radius:5px;width:100%;margin-top:5px;padding-top:12px;display:flex;flex-direction:row;flex-wrap:wrap}.under-line{margin:3px 10px 5px}.radio-buttons{margin:0;display:flex;flex-direction:column}.radio-button{margin-right:20px}.radio-buttons input{margin-right:0;margin-left:10px;margin-top:0;height:18px;width:18px;min-height:18px;flex-grow:0}.radio-button-label{margin-right:10px;margin-bottom:12px;margin-left:5px;vertical-align:middle}.text-zone-and-button{width:100%;display:flex;flex-direction:column}.text-area{background-color:#343a40;border-radius:5px;color:#e6e65f;caret-color:#ff0;font-family:monospace;font-weight:700;font-size:large;width:100%;height:200px;padding:10px;cursor:text}.feedback-and-button,.input-with-button{display:flex;flex-direction:row;width:100%}.input-with-button input{margin-right:3px}.button{margin-right:0;margin-top:5px;float:right}.feedback{width:100%;float:left;padding-left:10px}.feedback-green{float:left;width:90%;color:green;font-weight:700}.feedback-yellow{float:left;width:90%;color:orange;font-weight:700}.feedback-red{float:left;width:90%;color:var(--red-error);font-weight:700}.errorMessage{display:block;color:var(--red-error);width:100%}.validation-message{color:#a94442!important;display:inline-block;font-size:small;margin:3px}::ng-deep .ng-select.horiz-combox-box{height:30px;width:230px}::ng-deep .ng-select.horiz-combox-box .ng-select-container{height:30px;width:230px}.ng-select.horiz-combox-box ::ng-deep .ng-select-container .ng-placeholder{color:#3e4152}.input alg-input-selector{width:73.6%;margin:.75rem 0 .75rem .95rem}.ml-15px{margin-left:15px;margin-top:.4em}.textButton{margin-top:.4em;padding-bottom:.4em;margin-right:.8rem}fieldset input.ml--3{margin-left:-3%!important}.label-group{color:var(--main-bg-color)}.label-group span{padding-top:5px;display:inline-block;margin-right:5px}.label-group .required-icon{height:8px;margin:-6px 0 5px 5px;filter:invert(25%) sepia(61%) saturate(2196%) hue-rotate(334deg) brightness(100%) contrast(94%)}.checkbox-container{display:flex;flex-direction:row;align-items:center}.switch{position:relative;display:inline-block;width:48px;height:26px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s}.slider:before{position:absolute;content:\"\";height:18px;width:18px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}input:checked+.slider{background-color:#2196f3}input:focus+.slider{box-shadow:0 0 1px #2196f3}input:checked+.slider:before{-webkit-transform:translateX(22px);-ms-transform:translateX(22px);transform:translate(22px)}.slider.round{border-radius:25px}.slider.round:before{border-radius:50%}\n"],
+			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}:host{width:100%}.input-select-default{width:100%}.input-select-default.with-button{padding-right:35px;margin-right:-32px}.btn-input-select{padding:6px 10px 8px 8px;border-top-right-radius:0;border-bottom-right-radius:0;width:32px;border-color:#adb5bd}.form-group{display:flex;flex-direction:column}.field-container{margin-bottom:5px}.comboBox-icon-and-text{display:inline-block}.comboBox-icon{margin-right:5px;margin-bottom:5px}.comboBox-text{padding-right:10px}.checkbox-label{margin-left:5px;margin-top:5px;flex:1}.checkbox-input{width:17px;height:17px}.radio-button-container{border:1px solid #cbc8d0;border-radius:5px;width:100%;margin-top:5px;padding-top:12px;display:flex;flex-direction:row;flex-wrap:wrap}.under-line{margin:3px 10px 5px}.radio-buttons{margin:0;display:flex;flex-direction:column}.radio-button{margin-right:20px}.radio-buttons input{margin-right:0;margin-left:10px;margin-top:0;height:18px;width:18px;min-height:18px;flex-grow:0}.radio-button-label{margin-right:10px;margin-bottom:12px;margin-left:5px;vertical-align:middle}.text-zone-and-button{width:100%;display:flex;flex-direction:column}.text-area{background-color:#343a40;border-radius:5px;color:#e6e65f;caret-color:#ff0;font-family:monospace;font-weight:700;font-size:large;width:100%;height:200px;padding:10px;cursor:text}.feedback-and-button,.input-with-button{display:flex;flex-direction:row;width:100%}.input-with-button input{margin-right:3px}.button{margin-right:0;margin-top:5px;float:right}.feedback{width:100%;float:left;padding-left:10px}.feedback-green{float:left;width:90%;color:green;font-weight:700}.feedback-yellow{float:left;width:90%;color:orange;font-weight:700}.feedback-red{float:left;width:90%;color:var(--red-error);font-weight:700}.errorMessage{display:block;color:var(--red-error);width:100%}.validation-message{color:#a94442!important;display:inline-block;font-size:small;margin:3px}::ng-deep .ng-select.horiz-combox-box{height:30px;width:230px}::ng-deep .ng-select.horiz-combox-box .ng-select-container{height:30px;width:230px}.ng-select.horiz-combox-box ::ng-deep .ng-select-container .ng-placeholder{color:#3e4152}.input alg-input-selector{width:73.6%;margin:.75rem 0 .75rem .95rem}.ml-15px{margin-left:15px;margin-top:.4em}.textButton{margin-top:.4em;padding-bottom:.4em;margin-right:.8rem}fieldset input.ml--3{margin-left:-3%!important}.label-group{color:var(--main-bg-color)}.label-group span{padding-top:5px;display:inline-block;margin-right:5px}.label-group .required-icon{height:8px;margin:-6px 0 5px 5px;filter:invert(25%) sepia(61%) saturate(2196%) hue-rotate(334deg) brightness(100%) contrast(94%)}.checkbox-container{display:flex;flex-direction:row;align-items:center}.switch{position:relative;display:inline-block;width:48px;height:26px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s}.slider:before{position:absolute;content:\"\";height:18px;width:18px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}input:checked+.slider{background-color:#4465c9}input:focus+.slider{box-shadow:0 0 1px #4465c9}input:checked+.slider:before{-webkit-transform:translateX(22px);-ms-transform:translateX(22px);transform:translate(22px)}.slider.round{border-radius:25px}.slider.round:before{border-radius:50%}\n"],
 			dependencies: [
 				{
 					kind: "directive",
@@ -15337,7 +15372,7 @@ i0.ɵɵngDeclareClassMetadata({
 			changeDetection: ChangeDetectionStrategy.Eager,
 			standalone: false,
 			template: "<div [formGroup]=\"form\" class=\"field-container\">\r\n    <ng-container *ngIf=\"field\">\r\n        <div [hidden]=\"!!field.IsHidden\" [ngSwitch]=\"field.FilterType\">\r\n            <div class=\"label-group\" *ngIf=\"showLabel\">\r\n                <label *ngIf=\"field.FilterType != filterType.CheckBox &&\r\n                        field.FilterType != filterType.HorizComboBox\"\r\n                        [htmlFor]=\"field.PropertyName\">\r\n                    {{ field.Label }}\r\n                </label>\r\n                <img *ngIf=\"field.Required\"\r\n                    class=\"required-icon\"\r\n                    [src]=\"this.getRequiredIcon()\"\r\n                    alt=\"obligatoire\"\r\n                />\r\n            </div>\r\n\r\n            <!--String Input-->\r\n            <div *ngSwitchCase=\"filterType.String\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        [class]=\"this.inputClass\"\r\n                        [readonly]=\"this.readonly || field.ReadOnly\"\r\n                        [formControl]=\"this.control\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [type]=\"field.InputType\"\r\n                        (change)=\"this.onValueChanged($event)\"\r\n                        (input)=\"onValueInput($event)\"\r\n                        focusable\r\n                    />\r\n                </div>\r\n            </div>\r\n\r\n            <!--Number Input-->\r\n            <div *ngSwitchCase=\"filterType.Integer\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        [class]=\"this.inputClass\"\r\n                        [readonly]=\"this.readonly || field.ReadOnly\"\r\n                        [formControl]=\"this.control\"\r\n                        [id]=\"field.PropertyName\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        (input)=\"onValueInput($event)\"\r\n                        type=\"number\"\r\n                        focusable\r\n                        />\r\n                </div>\r\n            </div>\r\n             <div *ngSwitchCase=\"filterType.Decimal\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        [class]=\"this.inputClass\"\r\n                        [readonly]=\"this.readonly || field.ReadOnly\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        (input)=\"onValueInput($event)\"\r\n                        type=\"text\"\r\n                        inputmode=\"decimal\"\r\n                        algDecimalInput\r\n                        />\r\n                </div>\r\n            </div>\r\n            <!--ComboBox Input-->\r\n            <div *ngSwitchCase=\"filterType.ComboBox\" class=\"form-group\">\r\n                <div>\r\n                    <ng-select\r\n                        appendTo=\"body\"\r\n                        placeholder=\"Sélectionner {{ field.Label }}\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [items]=\"field.Data\"\r\n                        [multiple]=\"field.MultipleSelection\"\r\n                        [hideSelected]=\"field.HideSelected\"\r\n                        bindValue=\"{{ field.ValueMember }}\"\r\n                        [clearable]=\"field.IsClearable\"\r\n                        bindLabel=\"{{ field.DisplayMember }}\"\r\n                        [selectOnTab]=\"true\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [readonly]=\"this.readonly || field.ReadOnly\"\r\n                    >\r\n                    </ng-select>\r\n                </div>\r\n            </div>\r\n\r\n            <!-- InputSelect -->\r\n            <!-- <div *ngSwitchCase=\"this.filterType.Custom\" class=\"form-group input\">\r\n        <alg-input-selector #inputSelector\r\n            type=\"text\"\r\n            (change)=\"onValueChanged($event)\"\r\n            [id]=\"this.field.PropertyName\"\r\n            [formControlName]=\"field.PropertyName\"\r\n            [modalPropertyValue]=\"this.field.ModalPropertyValue\"\r\n            [modalPropertyName]=\"this.field.ModalPropertyName\"\r\n            [modalEntityKey]=\"this.field.ModalEntityKey\"\r\n            [modalTitle]=\"this.field.ModalTitle\"\r\n            [readonly]=\"this.field.ReadOnly\">\r\n        </alg-input-selector>\r\n    </div> -->\r\n\r\n            <!-- InputSelector with button -->\r\n            <ng-container *ngSwitchCase=\"this.filterType.Custom\">\r\n                <!-- <alg-selector\r\n                    #inputSelector\r\n                    type=\"text\"\r\n                    (change)=\"this.inputSelectorChanged($event)\"\r\n                    [id]=\"field.PropertyName\"\r\n                    [formControlName]=\"field.PropertyName\"\r\n                    [modalPropertyValue]=\"field.ModalPropertyValue\"\r\n                    [modalPropertyName]=\"field.ModalPropertyName\"\r\n                    [modalEntityKey]=\"field.ModalEntityKey\"\r\n                    [modalTitle]=\"field.ModalTitle\">\r\n                </alg-selector> -->\r\n\r\n                <!-- *ngSwitchCase=\"filterType.Custom\" -->\r\n                 <ng-container *ngIf=\"field.ModalOnly\">\r\n                    <div class=\"pull-left input-select-default with-button\">\r\n                        <input\r\n                            class=\"form-control\"\r\n                            [readonly]=\"true\"\r\n                            [name]=\"this.field.PropertyName\"\r\n                            [id]=\"this.field.PropertyName\"\r\n                            [formControlName]=\"field.PropertyName\"\r\n                            />\r\n                 </div>    \r\n                </ng-container>\r\n\r\n                <alg-selector\r\n                    [field]=\"field\"\r\n                    [control]=\"this.control\"\r\n                    (change)=\"this.inputSelectorChanged($event)\"\r\n                    \r\n                    >\r\n                    <!-- [control]=\"this.form.controls[field.PropertyName]\" -->\r\n                </alg-selector>\r\n\r\n            </ng-container>\r\n\r\n            <!-- TreeSelector -->\r\n            <ng-container *ngSwitchCase=\"this.filterType.TreeSelector\">\r\n                <alg-input-tree-selector\r\n                    [items]=\"field.Data\"\r\n                    [id]=\"field.PropertyName\"\r\n                    [bindValue]=\"field.ValueMember\"\r\n                    [bindLabel]=\"field.DisplayMember\"\r\n                    childrenKey=\"children\"\r\n                    countKey=\"childrenCount\"\r\n                    [formControlName]=\"field.PropertyName\"\r\n                    placeholder=\"{{ field.Label }}\"\r\n                    (change)=\"onValueChanged($event)\"\r\n                >\r\n                </alg-input-tree-selector>\r\n            </ng-container>\r\n\r\n            <!-- TextWithbutton -->\r\n            <ng-container\r\n                *ngSwitchCase=\"this.filterType.TextWithButton\"\r\n                class=\"form-group\"\r\n            >\r\n                <div class=\"input-with-button\">\r\n\r\n                    <input\r\n                        type=\"text\"\r\n                        class=\"form-control\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [name]=\"this.field.PropertyName\"\r\n                        [id]=\"this.field.PropertyName\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [readonly]=\"this.readonly || field.ReadOnly\"\r\n                    />\r\n\r\n                    <button\r\n                        class=\"btn btn-secondary btn-32 btn-input-select\"\r\n                        (click)=\"onClick(field)\"\r\n                    >\r\n                        <span class=\"fa fa-ellipsis-h\"></span>\r\n                    </button>\r\n                </div>\r\n            </ng-container>\r\n\r\n            <!--HorizComboBox Input-->\r\n            <div *ngSwitchCase=\"filterType.HorizComboBox\" class=\"form-group\">\r\n                <div>\r\n                    <ng-select\r\n                        appendTo=\"body\"\r\n                        class=\"horiz-combox-box\"\r\n                        placeholder=\"{{ field.Label }}\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [items]=\"field.Data\"\r\n                        [multiple]=\"field.MultipleSelection\"\r\n                        [hideSelected]=\"field.HideSelected\"\r\n                        bindValue=\"{{ field.ValueMember }}\"\r\n                        bindLabel=\"{{ field.DisplayMember }}\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                    >\r\n                    </ng-select>\r\n                </div>\r\n            </div>\r\n\r\n            <!--Boolean Input-->\r\n            <div *ngSwitchCase=\"filterType.CheckBox\" class=\"form-group\">\r\n                <div class=\"checkbox-container\">\r\n                    <label class=\"switch\" [htmlFor]=\"field.PropertyName\">\r\n                        <input\r\n                            [formControlName]=\"field.PropertyName\"\r\n                            [id]=\"field.PropertyName\"\r\n                            [readonly]=\"this.readonly || field.ReadOnly\"\r\n                            type=\"checkbox\"\r\n                            (change)=\"onValueChanged($event)\"\r\n                        />\r\n                        <span class=\"slider round\"></span>\r\n                    </label>\r\n                    <span class=\"checkbox-label\">{{ field.Label }}</span>\r\n                </div>\r\n            </div>\r\n\r\n            <!--Enum Input-->\r\n            <div *ngSwitchCase=\"filterType.RadioButton\" class=\"form-group\">\r\n                <div class=\"radio-button-container\">\r\n                    <form [formGroup]=\"form\" class=\"radio-buttons\">\r\n                        <div\r\n                            *ngFor=\"let data of field.Data;let indexOfData = index\" class=\"radio-button\">\r\n                            <input\r\n                                type=\"radio\"\r\n                                [formControlName]=\"field.PropertyName\"\r\n                                [id]=\"getRadioButtonId(field.PropertyName,indexOfData)\"\r\n                                [value]=\"indexOfData\"\r\n                                (change)=\"onValueChanged($event)\"\r\n                                />\r\n                            <label class=\"radio-button-label\">{{ data }}</label>\r\n                        </div>\r\n                    </form>\r\n                </div>\r\n            </div>\r\n\r\n            <!-- Text zone with button -->\r\n            <div *ngSwitchCase=\"filterType.TextZoneWithButton\"\r\n                class=\"form-group\">\r\n                <div class=\"text-zone-and-button\">\r\n                    <div class=\"text-zone-container\">\r\n                        <textarea\r\n                            #textarea\r\n                            type=\"text\"\r\n                            class=\"text-area\"\r\n                            spellcheck=\"false\"\r\n                            [formControlName]=\"field.ValueMember\"\r\n                            [id]=\"field.PropertyName\"\r\n                            [readonly]=\"this.readonly || field.ReadOnly\"\r\n                            (change)=\"onValueChanged($event)\"\r\n                        >\r\n                        </textarea>\r\n                    </div>\r\n                    <div class=\"feedback-and-button\">\r\n                        <div class=\"feedback\">\r\n                            <div class=\"feedback-green\" *ngIf=\"field.TextWithStyle.GreenText.length > 0\">\r\n                                {{ field.TextWithStyle.GreenText }}\r\n                            </div>\r\n                            <div class=\"feedback-yellow\" *ngIf=\"field.TextWithStyle.YellowText.length > 0\">\r\n                                {{ field.TextWithStyle.YellowText }}\r\n                            </div>\r\n                            <div class=\"feedback-red\" *ngIf=\"field.TextWithStyle.RedText.length > 0\">\r\n                                {{ field.TextWithStyle.RedText }}\r\n                            </div>\r\n                        </div>\r\n                        <button\r\n                            type=\"button\"\r\n                            id=\"botton-compile\"\r\n                            class=\"btn btn-primary btn-flat pull-right button\"\r\n                            (click)=\"onClick(field)\"\r\n                        >\r\n                            {{ field.ButtonLabel }}\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <!--Date -->\r\n            <div *ngSwitchCase=\"filterType.Date\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        type=\"text\"\r\n                        [class]=\"this.inputClass\"\r\n                        placeholder=\"Sélectionner une date\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [bsConfig]=\"bsConfig\"\r\n                        [bsValue]=\"dateValue\"\r\n                        (bsValueChange)=\"onBsValueChanged($event)\"\r\n                        [disabled]=\"this.readonly || field.ReadOnly\"\r\n                        algDatepicker\r\n                    />\r\n                </div>\r\n            </div>\r\n            <!--DateTime -->\r\n            <div *ngSwitchCase=\"filterType.DateTime\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        type=\"datetime-local\"\r\n                        [class]=\"this.inputClass\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [value]=\"dateTimeLocalValue\"\r\n                        [disabled]=\"this.readonly || field.ReadOnly\"\r\n                        (change)=\"onDateTimeLocalChanged($event)\"\r\n                    />\r\n                </div>\r\n            </div>\r\n\r\n            <!-- Text input -->\r\n            <div *ngSwitchCase=\"filterType.Text\" class=\"form-group\">\r\n                <div>\r\n                    <textarea\r\n                        type=\"text\"\r\n                        rows=\"5\"\r\n                        [class]=\"this.inputClass\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [readonly]=\"this.readonly || field.ReadOnly\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [id]=\"field.PropertyName\"\r\n                    >\r\n                    </textarea>\r\n                </div>\r\n            </div>\r\n\r\n            <!-- DropFileZone -->\r\n            <div\r\n                *ngSwitchCase=\"filterType.DropFileZone\"\r\n                class=\"form-group ml-4\"\r\n            >\r\n                <fieldset>\r\n                    <input\r\n                        [id]=\"field.PropertyName\"\r\n                        type=\"file\"\r\n                        class=\"ml--3\"\r\n                        (change)=\"fileEvent($event)\"\r\n                    />\r\n                </fieldset>\r\n            </div>\r\n\r\n            <!-- Password -->\r\n            <div *ngSwitchCase=\"filterType.Password\" class=\"form-group\">\r\n                <div  class=\"input-with-button\">\r\n                    <input\r\n                        class=\"form-control\"\r\n                        [type]=\"hidePassword ? 'password' : 'text'\"\r\n                        [formControl]=\"control\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [name]=\"field.PropertyName\"\r\n                        [readonly]=\"this.readonly || field.ReadOnly\"\r\n                        autocomplete=\"new-password\"\r\n                    />\r\n                    <!-- btn-32 pull-right button -->\r\n                    <button class=\"btn btn-secondary btn-32 btn-input-select\" (click)=\"showPassword()\">\r\n                        <i class=\"fa fa-eye\" aria-hidden=\"true\"></i>\r\n                    </button>\r\n                </div>\r\n            </div>\r\n\r\n            <ng-container *ngIf=\"this.showValidationErrors()\">\r\n                <div class=\"validation-message\">\r\n                    {{ this.getValidationErrors() }}\r\n                </div>\r\n                <!-- <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('required')\">\r\n            Ce champ est obligatoire\r\n        </ng-container>\r\n        <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('min')\">\r\n            Minimum: {{field.FieldValidators.MinValue}}\r\n        </ng-container>\r\n        <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('max')\">\r\n            Maximum: {{field.FieldValidators.MaxValue}}\r\n        </ng-container>\r\n        <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('maxLength')\">\r\n            Longueur maximale: {{field.FieldValidators.MaxLength}} caractères\r\n        </ng-container> -->\r\n            </ng-container>\r\n        </div>\r\n    </ng-container>\r\n</div>\r\n",
-			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}:host{width:100%}.input-select-default{width:100%}.input-select-default.with-button{padding-right:35px;margin-right:-32px}.btn-input-select{padding:6px 10px 8px 8px;border-top-right-radius:0;border-bottom-right-radius:0;width:32px;border-color:#adb5bd}.form-group{display:flex;flex-direction:column}.field-container{margin-bottom:5px}.comboBox-icon-and-text{display:inline-block}.comboBox-icon{margin-right:5px;margin-bottom:5px}.comboBox-text{padding-right:10px}.checkbox-label{margin-left:5px;margin-top:5px;flex:1}.checkbox-input{width:17px;height:17px}.radio-button-container{border:1px solid #cbc8d0;border-radius:5px;width:100%;margin-top:5px;padding-top:12px;display:flex;flex-direction:row;flex-wrap:wrap}.under-line{margin:3px 10px 5px}.radio-buttons{margin:0;display:flex;flex-direction:column}.radio-button{margin-right:20px}.radio-buttons input{margin-right:0;margin-left:10px;margin-top:0;height:18px;width:18px;min-height:18px;flex-grow:0}.radio-button-label{margin-right:10px;margin-bottom:12px;margin-left:5px;vertical-align:middle}.text-zone-and-button{width:100%;display:flex;flex-direction:column}.text-area{background-color:#343a40;border-radius:5px;color:#e6e65f;caret-color:#ff0;font-family:monospace;font-weight:700;font-size:large;width:100%;height:200px;padding:10px;cursor:text}.feedback-and-button,.input-with-button{display:flex;flex-direction:row;width:100%}.input-with-button input{margin-right:3px}.button{margin-right:0;margin-top:5px;float:right}.feedback{width:100%;float:left;padding-left:10px}.feedback-green{float:left;width:90%;color:green;font-weight:700}.feedback-yellow{float:left;width:90%;color:orange;font-weight:700}.feedback-red{float:left;width:90%;color:var(--red-error);font-weight:700}.errorMessage{display:block;color:var(--red-error);width:100%}.validation-message{color:#a94442!important;display:inline-block;font-size:small;margin:3px}::ng-deep .ng-select.horiz-combox-box{height:30px;width:230px}::ng-deep .ng-select.horiz-combox-box .ng-select-container{height:30px;width:230px}.ng-select.horiz-combox-box ::ng-deep .ng-select-container .ng-placeholder{color:#3e4152}.input alg-input-selector{width:73.6%;margin:.75rem 0 .75rem .95rem}.ml-15px{margin-left:15px;margin-top:.4em}.textButton{margin-top:.4em;padding-bottom:.4em;margin-right:.8rem}fieldset input.ml--3{margin-left:-3%!important}.label-group{color:var(--main-bg-color)}.label-group span{padding-top:5px;display:inline-block;margin-right:5px}.label-group .required-icon{height:8px;margin:-6px 0 5px 5px;filter:invert(25%) sepia(61%) saturate(2196%) hue-rotate(334deg) brightness(100%) contrast(94%)}.checkbox-container{display:flex;flex-direction:row;align-items:center}.switch{position:relative;display:inline-block;width:48px;height:26px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s}.slider:before{position:absolute;content:\"\";height:18px;width:18px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}input:checked+.slider{background-color:#2196f3}input:focus+.slider{box-shadow:0 0 1px #2196f3}input:checked+.slider:before{-webkit-transform:translateX(22px);-ms-transform:translateX(22px);transform:translate(22px)}.slider.round{border-radius:25px}.slider.round:before{border-radius:50%}\n"]
+			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}:host{width:100%}.input-select-default{width:100%}.input-select-default.with-button{padding-right:35px;margin-right:-32px}.btn-input-select{padding:6px 10px 8px 8px;border-top-right-radius:0;border-bottom-right-radius:0;width:32px;border-color:#adb5bd}.form-group{display:flex;flex-direction:column}.field-container{margin-bottom:5px}.comboBox-icon-and-text{display:inline-block}.comboBox-icon{margin-right:5px;margin-bottom:5px}.comboBox-text{padding-right:10px}.checkbox-label{margin-left:5px;margin-top:5px;flex:1}.checkbox-input{width:17px;height:17px}.radio-button-container{border:1px solid #cbc8d0;border-radius:5px;width:100%;margin-top:5px;padding-top:12px;display:flex;flex-direction:row;flex-wrap:wrap}.under-line{margin:3px 10px 5px}.radio-buttons{margin:0;display:flex;flex-direction:column}.radio-button{margin-right:20px}.radio-buttons input{margin-right:0;margin-left:10px;margin-top:0;height:18px;width:18px;min-height:18px;flex-grow:0}.radio-button-label{margin-right:10px;margin-bottom:12px;margin-left:5px;vertical-align:middle}.text-zone-and-button{width:100%;display:flex;flex-direction:column}.text-area{background-color:#343a40;border-radius:5px;color:#e6e65f;caret-color:#ff0;font-family:monospace;font-weight:700;font-size:large;width:100%;height:200px;padding:10px;cursor:text}.feedback-and-button,.input-with-button{display:flex;flex-direction:row;width:100%}.input-with-button input{margin-right:3px}.button{margin-right:0;margin-top:5px;float:right}.feedback{width:100%;float:left;padding-left:10px}.feedback-green{float:left;width:90%;color:green;font-weight:700}.feedback-yellow{float:left;width:90%;color:orange;font-weight:700}.feedback-red{float:left;width:90%;color:var(--red-error);font-weight:700}.errorMessage{display:block;color:var(--red-error);width:100%}.validation-message{color:#a94442!important;display:inline-block;font-size:small;margin:3px}::ng-deep .ng-select.horiz-combox-box{height:30px;width:230px}::ng-deep .ng-select.horiz-combox-box .ng-select-container{height:30px;width:230px}.ng-select.horiz-combox-box ::ng-deep .ng-select-container .ng-placeholder{color:#3e4152}.input alg-input-selector{width:73.6%;margin:.75rem 0 .75rem .95rem}.ml-15px{margin-left:15px;margin-top:.4em}.textButton{margin-top:.4em;padding-bottom:.4em;margin-right:.8rem}fieldset input.ml--3{margin-left:-3%!important}.label-group{color:var(--main-bg-color)}.label-group span{padding-top:5px;display:inline-block;margin-right:5px}.label-group .required-icon{height:8px;margin:-6px 0 5px 5px;filter:invert(25%) sepia(61%) saturate(2196%) hue-rotate(334deg) brightness(100%) contrast(94%)}.checkbox-container{display:flex;flex-direction:row;align-items:center}.switch{position:relative;display:inline-block;width:48px;height:26px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s}.slider:before{position:absolute;content:\"\";height:18px;width:18px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}input:checked+.slider{background-color:#4465c9}input:focus+.slider{box-shadow:0 0 1px #4465c9}input:checked+.slider:before{-webkit-transform:translateX(22px);-ms-transform:translateX(22px);transform:translate(22px)}.slider.round{border-radius:25px}.slider.round:before{border-radius:50%}\n"]
 		}]
 	}],
 	ctorParameters: () => [{ type: ValidationService }],
@@ -16957,8 +16992,8 @@ var ActionPanelComponent = class ActionPanelComponent {
 				guid: "guid"
 			},
 			ngImport: i0,
-			template: "<!-- Téléphone (narrow) : seulement le titre et la recherche, sur fond bleu ; les actions passent par le menu de l'écran. -->\r\n<div class=\"action-panel\" [class.narrow]=\"this.facade.layout.narrow$ | async\">\r\n    <div class=\"action-panel-container\">\r\n        <ng-container *ngIf=\"this.facade.layout.showActionTitle$ |async\">\r\n            <div class=\"action-title\">\r\n                <h1>{{ this.title }}</h1>\r\n                <span>|</span>\r\n            </div>\r\n        </ng-container>\r\n        \r\n        <!-- ACTIONS-->\r\n        <ng-container *ngIf=\"this.fields.length && this.facade.layout.showFilterButton$ |async\">\r\n            <div class=\"button-container img\">\r\n                <button\r\n                    type=\"button\"\r\n                    id=\"toggleFilter\"\r\n                    class=\"btn btn-svg action-btn\"\r\n                    data-toggle=\"tooltip\"\r\n                    title=\"Afficher/Masquer les filtres\"\r\n                    (click)=\"toggleFilterView()\"\r\n                >\r\n                    <!-- <div class=\"pull-left action-icon\"><i class=\"fa fa-filter fa-lg\"></i></div> -->\r\n                    <img\r\n                        class=\"action-icon\"\r\n                        [src]=\"getImageUrl('filter-solid')\"\r\n                        alt=\"Afficher/Masquer les filtres\"\r\n                    />\r\n                </button>\r\n            </div>\r\n        </ng-container>\r\n        \r\n        \r\n\r\n        <ng-container *ngIf=\"this.facade.layout.showActionSearchBar$ | async\">\r\n            <div class=\"input-img\">\r\n                <input\r\n                    \r\n                    type=\"text\"\r\n                    class=\"form-control search-bar-action\"\r\n                    name=\"keyword\"\r\n                    #uniquename=\"ngModel\"\r\n                    [placeholder]=\"this.searchText\"\r\n                    [(ngModel)]=\"keyword\"\r\n                    (ngModelChange)=\"handleKeywordsChanged($event)\"\r\n                    focusable\r\n                />\r\n            </div>\r\n        </ng-container>\r\n        \r\n        <ng-container *ngFor=\"let action of actions\">\r\n            <div\r\n                *ngIf=\"action.isVisible && action.showTitle\"\r\n                class=\"button-container\">\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"btn btn-svg action-btn\"\r\n                    title=\"{{ action.title }}\"\r\n                    (click)=\"this.executeAction(action)\"\r\n                    [disabled]=\"action.disabled$ | async\">\r\n\r\n                    <img\r\n                        class=\"action-icon\"\r\n                        [src]=\"getImageUrl(action.icon)\"\r\n                        alt=\"{{ action.title }}\"\r\n                    />\r\n                    <div class=\"action-label\">\r\n                        <span>{{ action.title }}</span>\r\n                    </div>\r\n                </button>\r\n            </div>\r\n\r\n            <div *ngIf=\"action.isVisible && !action.showTitle\" class=\"button-container img\">\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"btn btn-svg action-btn\"\r\n                    data-toggle=\"tooltip\"\r\n                    title=\"{{ action.title }}\"\r\n                    (click)=\"this.executeAction(action)\"\r\n                    [disabled]=\"! this.enableActions() || action.disabled\"\r\n                >\r\n                    <img\r\n                        class=\"action-icon\"\r\n                        [src]=\"getImageUrl(action.icon)\"\r\n                        alt=\"{{ action.title }}\"\r\n                    />\r\n                </button>\r\n            </div>\r\n        </ng-container>\r\n\r\n        <ng-content select=\"[actions-content]\"> </ng-content>\r\n\r\n        <!-- Téléphone : menu de l'écran (actions, affichage, navigation) derrière trois points. -->\r\n        <alg-mobile-menu *ngIf=\"this.facade.layout.narrow$ | async\" class=\"action-mobile-menu\" [inline]=\"true\"\r\n            [entityKey]=\"this.entityKey\" [guid]=\"this.guid\" [title]=\"this.title\"></alg-mobile-menu>\r\n    </div>\r\n</div>\r\n",
-			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.action-panel{display:block;height:auto;border-bottom:solid 1px #3C5DC4;width:auto;overflow:hidden;padding:3px 0}.action-panel-container{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;justify-items:center;justify-content:flex-start;width:30000px;padding:2px 5px;min-height:34px}.action-panel-container .input-img{margin-right:5px;min-width:150px}.action-panel-container>div{padding:2px;margin-right:0}.action-panel-container>button{padding:2px;margin-right:0}.action-panel-container .button-container{margin-right:3px;padding:3px;height:30px}.action-panel-container .button-container .img{padding:3px;margin-right:0}.action-panel-container .button-container:hover{background-color:#eaeaea}.action-panel-container .action-title{display:flex}.action-panel-container .action-title h1{display:block;font-size:14px;background:#fff;border-bottom:none;padding:2px 0 2px 10px;margin:0;line-height:24px;font-weight:700}.action-panel-container .action-title span{display:flex;margin:0 8px;padding:0;font-size:15px;flex-wrap:nowrap}.action-label{display:flex;flex-wrap:nowrap}.action-icon{margin:0 2px;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.search-bar-action{height:26px;min-height:26px;border-radius:5px}.input-img{position:relative;margin:0 5px 0 0;min-width:250px}.input-img .search-pin{position:absolute;top:5px;left:5px;height:16px;width:16px}.action-panel.narrow{background:#4465c9;border-bottom:none;padding:6px 0}.action-panel.narrow .action-panel-container{width:auto;min-height:30px;padding:0 8px;gap:8px}.action-panel.narrow .action-panel-container>div{padding:0}.action-panel.narrow .action-panel-container .button-container,.action-panel.narrow .action-panel-container ::ng-deep [actions-content]{display:none!important}.action-panel.narrow .action-panel-container .action-title{flex:0 1 auto;min-width:0}.action-panel.narrow .action-panel-container .action-title h1{overflow:hidden;height:30px;padding:0 12px;border-radius:5px;background:#6684e0;color:#fff;font-size:12.5px;font-weight:600;line-height:30px;white-space:nowrap;text-overflow:ellipsis}.action-panel.narrow .action-panel-container .action-title span{display:none}.action-panel.narrow .action-panel-container .input-img{flex:1 1 auto;min-width:0;margin:0}.action-panel.narrow .action-panel-container .action-mobile-menu{flex:none;margin-left:auto}.action-panel.narrow .action-panel-container .search-bar-action{width:100%;height:30px;border:none}\n"],
+			template: "<!-- Téléphone (narrow) : seulement le titre et la recherche, sur fond bleu ; les actions passent par le menu de l'écran. -->\r\n<div class=\"action-panel\" [class.narrow]=\"this.facade.layout.narrow$ | async\">\r\n    <div class=\"action-panel-container\">\r\n        <ng-container *ngIf=\"this.facade.layout.showActionTitle$ |async\">\r\n            <div class=\"action-title\">\r\n                <h1>{{ this.title }}</h1>\r\n                <span>|</span>\r\n            </div>\r\n        </ng-container>\r\n        \r\n        <!-- ACTIONS-->\r\n        <ng-container *ngIf=\"this.fields.length && this.facade.layout.showFilterButton$ |async\">\r\n            <div class=\"button-container img\">\r\n                <button\r\n                    type=\"button\"\r\n                    id=\"toggleFilter\"\r\n                    class=\"btn btn-svg action-btn\"\r\n                    data-toggle=\"tooltip\"\r\n                    title=\"Afficher/Masquer les filtres\"\r\n                    (click)=\"toggleFilterView()\"\r\n                >\r\n                    <!-- <div class=\"pull-left action-icon\"><i class=\"fa fa-filter fa-lg\"></i></div> -->\r\n                    <img\r\n                        class=\"action-icon\"\r\n                        [src]=\"getImageUrl('filter-solid')\"\r\n                        alt=\"Afficher/Masquer les filtres\"\r\n                    />\r\n                </button>\r\n            </div>\r\n        </ng-container>\r\n        \r\n        \r\n\r\n        <ng-container *ngIf=\"this.facade.layout.showActionSearchBar$ | async\">\r\n            <div class=\"input-img\">\r\n                <i class=\"fa fa-search search-icon\"></i>\r\n                <input\r\n                    \r\n                    type=\"text\"\r\n                    class=\"form-control search-bar-action\"\r\n                    name=\"keyword\"\r\n                    #uniquename=\"ngModel\"\r\n                    [placeholder]=\"this.searchText\"\r\n                    [(ngModel)]=\"keyword\"\r\n                    (ngModelChange)=\"handleKeywordsChanged($event)\"\r\n                    focusable\r\n                />\r\n            </div>\r\n        </ng-container>\r\n        \r\n        <ng-container *ngFor=\"let action of actions\">\r\n            <div\r\n                *ngIf=\"action.isVisible && action.showTitle\"\r\n                class=\"button-container\">\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"btn btn-svg action-btn\"\r\n                    title=\"{{ action.title }}\"\r\n                    (click)=\"this.executeAction(action)\"\r\n                    [class.save-active]=\"action.name === 'save' && !(action.disabled$ | async)\"\r\n                    [disabled]=\"action.disabled$ | async\">\r\n\r\n                    <img\r\n                        class=\"action-icon\"\r\n                        [src]=\"getImageUrl(action.icon)\"\r\n                        alt=\"{{ action.title }}\"\r\n                    />\r\n                    <div class=\"action-label\">\r\n                        <span>{{ action.title }}</span>\r\n                    </div>\r\n                </button>\r\n            </div>\r\n\r\n            <div *ngIf=\"action.isVisible && !action.showTitle\" class=\"button-container img\">\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"btn btn-svg action-btn\"\r\n                    data-toggle=\"tooltip\"\r\n                    title=\"{{ action.title }}\"\r\n                    (click)=\"this.executeAction(action)\"\r\n                    [class.save-active]=\"action.name === 'save' && this.enableActions() && !action.disabled\"\r\n                    [disabled]=\"! this.enableActions() || action.disabled\"\r\n                >\r\n                    <img\r\n                        class=\"action-icon\"\r\n                        [src]=\"getImageUrl(action.icon)\"\r\n                        alt=\"{{ action.title }}\"\r\n                    />\r\n                </button>\r\n            </div>\r\n        </ng-container>\r\n\r\n        <ng-content select=\"[actions-content]\"> </ng-content>\r\n\r\n        <!-- Téléphone : menu de l'écran (actions, affichage, navigation) derrière trois points. -->\r\n        <alg-mobile-menu *ngIf=\"this.facade.layout.narrow$ | async\" class=\"action-mobile-menu\" [inline]=\"true\"\r\n            [entityKey]=\"this.entityKey\" [guid]=\"this.guid\" [title]=\"this.title\"></alg-mobile-menu>\r\n    </div>\r\n</div>\r\n",
+			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.action-panel{display:block;height:auto;border-bottom:solid 1px #3C5DC4;width:auto;overflow:hidden;padding:3px 0}.action-panel-container{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;justify-items:center;justify-content:flex-start;width:30000px;padding:2px 5px;min-height:34px}.action-panel-container .input-img{margin-right:5px;min-width:150px}.action-panel-container>div{padding:2px;margin-right:0}.action-panel-container>button{padding:2px;margin-right:0}.action-panel-container .button-container{margin-right:3px;padding:3px;height:30px}.action-panel-container .button-container .img{padding:3px;margin-right:0}.action-panel-container .button-container:hover{background-color:#eaeaea}.action-panel-container .action-title{display:flex}.action-panel-container .action-title h1{display:block;font-size:14px;background:#fff;border-bottom:none;padding:2px 0 2px 10px;margin:0;line-height:24px;font-weight:700}.action-panel-container .action-title span{display:flex;margin:0 8px;padding:0;font-size:15px;flex-wrap:nowrap}.action-label{display:flex;flex-wrap:nowrap}.action-icon{margin:0 2px;filter:brightness(0) saturate(100%) invert(36%) sepia(91%) saturate(628%) hue-rotate(191deg) brightness(89%) contrast(85%) brightness(75%)}.search-bar-action{height:26px;min-height:26px;border-radius:5px}.input-img{position:relative;margin:0 5px 0 0;min-width:250px}.input-img .search-icon{position:absolute;top:50%;left:9px;transform:translateY(-50%);font-size:12px;color:#9fa9c7;pointer-events:none;z-index:1}.input-img .search-bar-action{padding-left:27px}.input-img .search-pin{position:absolute;top:5px;left:5px;height:16px;width:16px}.action-panel.narrow{background:#4465c9;border-bottom:none;padding:6px 0}.action-panel.narrow .action-panel-container{width:auto;min-height:30px;padding:0 8px;gap:8px}.action-panel.narrow .action-panel-container>div{padding:0}.action-panel.narrow .action-panel-container .button-container,.action-panel.narrow .action-panel-container ::ng-deep [actions-content]{display:none!important}.action-panel.narrow .action-panel-container .action-title{flex:0 1 auto;min-width:0}.action-panel.narrow .action-panel-container .action-title h1{overflow:hidden;height:30px;padding:0 12px;border-radius:5px;background:#6684e0;color:#fff;font-size:12.5px;font-weight:600;line-height:30px;white-space:nowrap;text-overflow:ellipsis}.action-panel.narrow .action-panel-container .action-title span{display:none}.action-panel.narrow .action-panel-container .input-img{flex:1 1 auto;min-width:0;margin:0}.action-panel.narrow .action-panel-container .action-mobile-menu{flex:none;margin-left:auto}.action-panel.narrow .action-panel-container .search-bar-action{width:100%;height:30px;border:none}.action-btn.save-active{color:#d1353a}.action-btn.save-active .action-icon{filter:brightness(0) saturate(100%) invert(25%) sepia(61%) saturate(2196%) hue-rotate(334deg) brightness(100%) contrast(94%)}\n"],
 			dependencies: [
 				{
 					kind: "directive",
@@ -17040,8 +17075,8 @@ i0.ɵɵngDeclareClassMetadata({
 			selector: "alg-action-panel",
 			changeDetection: ChangeDetectionStrategy.Eager,
 			standalone: false,
-			template: "<!-- Téléphone (narrow) : seulement le titre et la recherche, sur fond bleu ; les actions passent par le menu de l'écran. -->\r\n<div class=\"action-panel\" [class.narrow]=\"this.facade.layout.narrow$ | async\">\r\n    <div class=\"action-panel-container\">\r\n        <ng-container *ngIf=\"this.facade.layout.showActionTitle$ |async\">\r\n            <div class=\"action-title\">\r\n                <h1>{{ this.title }}</h1>\r\n                <span>|</span>\r\n            </div>\r\n        </ng-container>\r\n        \r\n        <!-- ACTIONS-->\r\n        <ng-container *ngIf=\"this.fields.length && this.facade.layout.showFilterButton$ |async\">\r\n            <div class=\"button-container img\">\r\n                <button\r\n                    type=\"button\"\r\n                    id=\"toggleFilter\"\r\n                    class=\"btn btn-svg action-btn\"\r\n                    data-toggle=\"tooltip\"\r\n                    title=\"Afficher/Masquer les filtres\"\r\n                    (click)=\"toggleFilterView()\"\r\n                >\r\n                    <!-- <div class=\"pull-left action-icon\"><i class=\"fa fa-filter fa-lg\"></i></div> -->\r\n                    <img\r\n                        class=\"action-icon\"\r\n                        [src]=\"getImageUrl('filter-solid')\"\r\n                        alt=\"Afficher/Masquer les filtres\"\r\n                    />\r\n                </button>\r\n            </div>\r\n        </ng-container>\r\n        \r\n        \r\n\r\n        <ng-container *ngIf=\"this.facade.layout.showActionSearchBar$ | async\">\r\n            <div class=\"input-img\">\r\n                <input\r\n                    \r\n                    type=\"text\"\r\n                    class=\"form-control search-bar-action\"\r\n                    name=\"keyword\"\r\n                    #uniquename=\"ngModel\"\r\n                    [placeholder]=\"this.searchText\"\r\n                    [(ngModel)]=\"keyword\"\r\n                    (ngModelChange)=\"handleKeywordsChanged($event)\"\r\n                    focusable\r\n                />\r\n            </div>\r\n        </ng-container>\r\n        \r\n        <ng-container *ngFor=\"let action of actions\">\r\n            <div\r\n                *ngIf=\"action.isVisible && action.showTitle\"\r\n                class=\"button-container\">\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"btn btn-svg action-btn\"\r\n                    title=\"{{ action.title }}\"\r\n                    (click)=\"this.executeAction(action)\"\r\n                    [disabled]=\"action.disabled$ | async\">\r\n\r\n                    <img\r\n                        class=\"action-icon\"\r\n                        [src]=\"getImageUrl(action.icon)\"\r\n                        alt=\"{{ action.title }}\"\r\n                    />\r\n                    <div class=\"action-label\">\r\n                        <span>{{ action.title }}</span>\r\n                    </div>\r\n                </button>\r\n            </div>\r\n\r\n            <div *ngIf=\"action.isVisible && !action.showTitle\" class=\"button-container img\">\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"btn btn-svg action-btn\"\r\n                    data-toggle=\"tooltip\"\r\n                    title=\"{{ action.title }}\"\r\n                    (click)=\"this.executeAction(action)\"\r\n                    [disabled]=\"! this.enableActions() || action.disabled\"\r\n                >\r\n                    <img\r\n                        class=\"action-icon\"\r\n                        [src]=\"getImageUrl(action.icon)\"\r\n                        alt=\"{{ action.title }}\"\r\n                    />\r\n                </button>\r\n            </div>\r\n        </ng-container>\r\n\r\n        <ng-content select=\"[actions-content]\"> </ng-content>\r\n\r\n        <!-- Téléphone : menu de l'écran (actions, affichage, navigation) derrière trois points. -->\r\n        <alg-mobile-menu *ngIf=\"this.facade.layout.narrow$ | async\" class=\"action-mobile-menu\" [inline]=\"true\"\r\n            [entityKey]=\"this.entityKey\" [guid]=\"this.guid\" [title]=\"this.title\"></alg-mobile-menu>\r\n    </div>\r\n</div>\r\n",
-			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.action-panel{display:block;height:auto;border-bottom:solid 1px #3C5DC4;width:auto;overflow:hidden;padding:3px 0}.action-panel-container{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;justify-items:center;justify-content:flex-start;width:30000px;padding:2px 5px;min-height:34px}.action-panel-container .input-img{margin-right:5px;min-width:150px}.action-panel-container>div{padding:2px;margin-right:0}.action-panel-container>button{padding:2px;margin-right:0}.action-panel-container .button-container{margin-right:3px;padding:3px;height:30px}.action-panel-container .button-container .img{padding:3px;margin-right:0}.action-panel-container .button-container:hover{background-color:#eaeaea}.action-panel-container .action-title{display:flex}.action-panel-container .action-title h1{display:block;font-size:14px;background:#fff;border-bottom:none;padding:2px 0 2px 10px;margin:0;line-height:24px;font-weight:700}.action-panel-container .action-title span{display:flex;margin:0 8px;padding:0;font-size:15px;flex-wrap:nowrap}.action-label{display:flex;flex-wrap:nowrap}.action-icon{margin:0 2px;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.search-bar-action{height:26px;min-height:26px;border-radius:5px}.input-img{position:relative;margin:0 5px 0 0;min-width:250px}.input-img .search-pin{position:absolute;top:5px;left:5px;height:16px;width:16px}.action-panel.narrow{background:#4465c9;border-bottom:none;padding:6px 0}.action-panel.narrow .action-panel-container{width:auto;min-height:30px;padding:0 8px;gap:8px}.action-panel.narrow .action-panel-container>div{padding:0}.action-panel.narrow .action-panel-container .button-container,.action-panel.narrow .action-panel-container ::ng-deep [actions-content]{display:none!important}.action-panel.narrow .action-panel-container .action-title{flex:0 1 auto;min-width:0}.action-panel.narrow .action-panel-container .action-title h1{overflow:hidden;height:30px;padding:0 12px;border-radius:5px;background:#6684e0;color:#fff;font-size:12.5px;font-weight:600;line-height:30px;white-space:nowrap;text-overflow:ellipsis}.action-panel.narrow .action-panel-container .action-title span{display:none}.action-panel.narrow .action-panel-container .input-img{flex:1 1 auto;min-width:0;margin:0}.action-panel.narrow .action-panel-container .action-mobile-menu{flex:none;margin-left:auto}.action-panel.narrow .action-panel-container .search-bar-action{width:100%;height:30px;border:none}\n"]
+			template: "<!-- Téléphone (narrow) : seulement le titre et la recherche, sur fond bleu ; les actions passent par le menu de l'écran. -->\r\n<div class=\"action-panel\" [class.narrow]=\"this.facade.layout.narrow$ | async\">\r\n    <div class=\"action-panel-container\">\r\n        <ng-container *ngIf=\"this.facade.layout.showActionTitle$ |async\">\r\n            <div class=\"action-title\">\r\n                <h1>{{ this.title }}</h1>\r\n                <span>|</span>\r\n            </div>\r\n        </ng-container>\r\n        \r\n        <!-- ACTIONS-->\r\n        <ng-container *ngIf=\"this.fields.length && this.facade.layout.showFilterButton$ |async\">\r\n            <div class=\"button-container img\">\r\n                <button\r\n                    type=\"button\"\r\n                    id=\"toggleFilter\"\r\n                    class=\"btn btn-svg action-btn\"\r\n                    data-toggle=\"tooltip\"\r\n                    title=\"Afficher/Masquer les filtres\"\r\n                    (click)=\"toggleFilterView()\"\r\n                >\r\n                    <!-- <div class=\"pull-left action-icon\"><i class=\"fa fa-filter fa-lg\"></i></div> -->\r\n                    <img\r\n                        class=\"action-icon\"\r\n                        [src]=\"getImageUrl('filter-solid')\"\r\n                        alt=\"Afficher/Masquer les filtres\"\r\n                    />\r\n                </button>\r\n            </div>\r\n        </ng-container>\r\n        \r\n        \r\n\r\n        <ng-container *ngIf=\"this.facade.layout.showActionSearchBar$ | async\">\r\n            <div class=\"input-img\">\r\n                <i class=\"fa fa-search search-icon\"></i>\r\n                <input\r\n                    \r\n                    type=\"text\"\r\n                    class=\"form-control search-bar-action\"\r\n                    name=\"keyword\"\r\n                    #uniquename=\"ngModel\"\r\n                    [placeholder]=\"this.searchText\"\r\n                    [(ngModel)]=\"keyword\"\r\n                    (ngModelChange)=\"handleKeywordsChanged($event)\"\r\n                    focusable\r\n                />\r\n            </div>\r\n        </ng-container>\r\n        \r\n        <ng-container *ngFor=\"let action of actions\">\r\n            <div\r\n                *ngIf=\"action.isVisible && action.showTitle\"\r\n                class=\"button-container\">\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"btn btn-svg action-btn\"\r\n                    title=\"{{ action.title }}\"\r\n                    (click)=\"this.executeAction(action)\"\r\n                    [class.save-active]=\"action.name === 'save' && !(action.disabled$ | async)\"\r\n                    [disabled]=\"action.disabled$ | async\">\r\n\r\n                    <img\r\n                        class=\"action-icon\"\r\n                        [src]=\"getImageUrl(action.icon)\"\r\n                        alt=\"{{ action.title }}\"\r\n                    />\r\n                    <div class=\"action-label\">\r\n                        <span>{{ action.title }}</span>\r\n                    </div>\r\n                </button>\r\n            </div>\r\n\r\n            <div *ngIf=\"action.isVisible && !action.showTitle\" class=\"button-container img\">\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"btn btn-svg action-btn\"\r\n                    data-toggle=\"tooltip\"\r\n                    title=\"{{ action.title }}\"\r\n                    (click)=\"this.executeAction(action)\"\r\n                    [class.save-active]=\"action.name === 'save' && this.enableActions() && !action.disabled\"\r\n                    [disabled]=\"! this.enableActions() || action.disabled\"\r\n                >\r\n                    <img\r\n                        class=\"action-icon\"\r\n                        [src]=\"getImageUrl(action.icon)\"\r\n                        alt=\"{{ action.title }}\"\r\n                    />\r\n                </button>\r\n            </div>\r\n        </ng-container>\r\n\r\n        <ng-content select=\"[actions-content]\"> </ng-content>\r\n\r\n        <!-- Téléphone : menu de l'écran (actions, affichage, navigation) derrière trois points. -->\r\n        <alg-mobile-menu *ngIf=\"this.facade.layout.narrow$ | async\" class=\"action-mobile-menu\" [inline]=\"true\"\r\n            [entityKey]=\"this.entityKey\" [guid]=\"this.guid\" [title]=\"this.title\"></alg-mobile-menu>\r\n    </div>\r\n</div>\r\n",
+			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.action-panel{display:block;height:auto;border-bottom:solid 1px #3C5DC4;width:auto;overflow:hidden;padding:3px 0}.action-panel-container{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;justify-items:center;justify-content:flex-start;width:30000px;padding:2px 5px;min-height:34px}.action-panel-container .input-img{margin-right:5px;min-width:150px}.action-panel-container>div{padding:2px;margin-right:0}.action-panel-container>button{padding:2px;margin-right:0}.action-panel-container .button-container{margin-right:3px;padding:3px;height:30px}.action-panel-container .button-container .img{padding:3px;margin-right:0}.action-panel-container .button-container:hover{background-color:#eaeaea}.action-panel-container .action-title{display:flex}.action-panel-container .action-title h1{display:block;font-size:14px;background:#fff;border-bottom:none;padding:2px 0 2px 10px;margin:0;line-height:24px;font-weight:700}.action-panel-container .action-title span{display:flex;margin:0 8px;padding:0;font-size:15px;flex-wrap:nowrap}.action-label{display:flex;flex-wrap:nowrap}.action-icon{margin:0 2px;filter:brightness(0) saturate(100%) invert(36%) sepia(91%) saturate(628%) hue-rotate(191deg) brightness(89%) contrast(85%) brightness(75%)}.search-bar-action{height:26px;min-height:26px;border-radius:5px}.input-img{position:relative;margin:0 5px 0 0;min-width:250px}.input-img .search-icon{position:absolute;top:50%;left:9px;transform:translateY(-50%);font-size:12px;color:#9fa9c7;pointer-events:none;z-index:1}.input-img .search-bar-action{padding-left:27px}.input-img .search-pin{position:absolute;top:5px;left:5px;height:16px;width:16px}.action-panel.narrow{background:#4465c9;border-bottom:none;padding:6px 0}.action-panel.narrow .action-panel-container{width:auto;min-height:30px;padding:0 8px;gap:8px}.action-panel.narrow .action-panel-container>div{padding:0}.action-panel.narrow .action-panel-container .button-container,.action-panel.narrow .action-panel-container ::ng-deep [actions-content]{display:none!important}.action-panel.narrow .action-panel-container .action-title{flex:0 1 auto;min-width:0}.action-panel.narrow .action-panel-container .action-title h1{overflow:hidden;height:30px;padding:0 12px;border-radius:5px;background:#6684e0;color:#fff;font-size:12.5px;font-weight:600;line-height:30px;white-space:nowrap;text-overflow:ellipsis}.action-panel.narrow .action-panel-container .action-title span{display:none}.action-panel.narrow .action-panel-container .input-img{flex:1 1 auto;min-width:0;margin:0}.action-panel.narrow .action-panel-container .action-mobile-menu{flex:none;margin-left:auto}.action-panel.narrow .action-panel-container .search-bar-action{width:100%;height:30px;border:none}.action-btn.save-active{color:#d1353a}.action-btn.save-active .action-icon{filter:brightness(0) saturate(100%) invert(25%) sepia(61%) saturate(2196%) hue-rotate(334deg) brightness(100%) contrast(94%)}\n"]
 		}]
 	}],
 	ctorParameters: () => [
@@ -17499,6 +17534,222 @@ i0.ɵɵngDeclareClassMetadata({
 		args: ["rowRef"]
 	}] }
 });
+var GridDistinctFilterComponent = class GridDistinctFilterComponent {
+	constructor() {
+		this.done = new EventEmitter();
+		this.loaded = new EventEmitter();
+		this.dataService = inject(DataService, { optional: true });
+		this.cd = inject(ChangeDetectorRef);
+		this.values = [];
+		this.hasMore = false;
+		this.loading = false;
+		this.error = false;
+		this.search = "";
+		this.selected = /* @__PURE__ */ new Set();
+		this.search$ = new Subject();
+		this.subscriptions = new Subscription();
+	}
+	static {
+		this.PageSize = 50;
+	}
+	ngOnInit() {
+		this.facade.filter.getFilterValues(this.property).forEach((v) => this.selected.add(v));
+		this.subscriptions.add(this.search$.pipe(debounceTime(300)).subscribe(() => this.load(true)));
+		this.load(true);
+	}
+	ngOnDestroy() {
+		this.subscriptions.unsubscribe();
+		this.request?.unsubscribe();
+	}
+	load(reset) {
+		if (!this.dataService) return;
+		this.request?.unsubscribe();
+		if (reset) {
+			this.values = [];
+			this.hasMore = false;
+		}
+		this.loading = true;
+		this.error = false;
+		const filter = this.facade.filter.getDistinctValuesFilter(this.property);
+		this.request = this.dataService.distinctValues(this.entityKey, filter, this.property, this.search.trim(), this.values.length, GridDistinctFilterComponent.PageSize).subscribe({
+			next: (result) => {
+				this.values = [...this.values, ...(result?.Values ?? []).filter((v) => v !== null && v !== void 0)];
+				this.hasMore = !!result?.HasMore;
+				this.loading = false;
+				this.cd.markForCheck();
+				if (reset) this.loaded.emit();
+			},
+			error: () => {
+				this.loading = false;
+				this.error = true;
+				this.cd.markForCheck();
+			}
+		});
+	}
+	onSearchChange() {
+		this.search$.next(this.search);
+	}
+	onScroll(event) {
+		const list = event.target;
+		if (this.hasMore && !this.loading && list.scrollTop + list.clientHeight >= list.scrollHeight - 24) this.load(false);
+	}
+	key(value) {
+		return String(value);
+	}
+	label(value) {
+		if (value === true) return "Oui";
+		if (value === false) return "Non";
+		const text = String(value);
+		const date = /^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2})/.exec(text);
+		if (date) {
+			const [, y, m, d, hh, mm] = date;
+			return hh === "00" && mm === "00" ? `${d}/${m}/${y}` : `${d}/${m}/${y} ${hh}:${mm}`;
+		}
+		return text;
+	}
+	isSelected(value) {
+		return this.selected.has(this.key(value));
+	}
+	toggle(value) {
+		const key = this.key(value);
+		if (this.selected.has(key)) this.selected.delete(key);
+		else this.selected.add(key);
+	}
+	allShownSelected() {
+		return this.values.length > 0 && this.values.every((v) => this.isSelected(v));
+	}
+	toggleAllShown() {
+		const select = !this.allShownSelected();
+		this.values.forEach((v) => select ? this.selected.add(this.key(v)) : this.selected.delete(this.key(v)));
+	}
+	apply() {
+		this.facade.filter.setFilterValues(this.property, [...this.selected]);
+		this.done.emit();
+	}
+	clear() {
+		this.selected.clear();
+		this.facade.filter.setFilterValues(this.property, []);
+		this.done.emit();
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.1",
+			ngImport: i0,
+			type: GridDistinctFilterComponent,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "14.0.0",
+			version: "22.2.1",
+			type: GridDistinctFilterComponent,
+			isStandalone: true,
+			selector: "alg-grid-distinct-filter",
+			inputs: {
+				facade: "facade",
+				entityKey: "entityKey",
+				property: "property"
+			},
+			outputs: {
+				done: "done",
+				loaded: "loaded"
+			},
+			ngImport: i0,
+			template: "<li class=\"gdf-panel\">\r\n    <input class=\"gdf-search\" type=\"text\" placeholder=\"Rechercher…\" [(ngModel)]=\"search\" (ngModelChange)=\"onSearchChange()\" />\r\n\r\n    <div *ngIf=\"values.length\" class=\"gdf-item gdf-all\" (click)=\"toggleAllShown()\">\r\n        <input type=\"checkbox\" tabindex=\"-1\" [checked]=\"allShownSelected()\" (click)=\"$event.preventDefault()\" />\r\n        <span class=\"gdf-label\">{{ search.trim() ? '(Ajouter les valeurs trouvées)' : '(Tout sélectionner)' }}</span>\r\n    </div>\r\n\r\n    <!-- Valeurs distinctes : page suivante chargée en défilant vers le bas. -->\r\n    <ul class=\"gdf-list\" (scroll)=\"onScroll($event)\">\r\n        <li *ngFor=\"let value of values\" class=\"gdf-item\" [class.checked]=\"isSelected(value)\" [title]=\"label(value)\" (click)=\"toggle(value)\">\r\n            <input type=\"checkbox\" tabindex=\"-1\" [checked]=\"isSelected(value)\" (click)=\"$event.preventDefault()\" />\r\n            <span class=\"gdf-label\">{{ label(value) }}</span>\r\n        </li>\r\n        <li *ngIf=\"loading\" class=\"gdf-info\">Chargement…</li>\r\n        <li *ngIf=\"error\" class=\"gdf-info\">Valeurs indisponibles pour cette colonne</li>\r\n        <li *ngIf=\"!loading && !error && !values.length\" class=\"gdf-info\">Aucune valeur</li>\r\n    </ul>\r\n\r\n    <div class=\"gdf-footer\">\r\n        <span class=\"gdf-count\">{{ selected.size ? selected.size + (selected.size > 1 ? ' valeurs cochées' : ' valeur cochée') : '' }}</span>\r\n        <button type=\"button\" class=\"gdf-btn\" (click)=\"clear()\">Effacer</button>\r\n        <button type=\"button\" class=\"gdf-btn primary\" (click)=\"apply()\">OK</button>\r\n    </div>\r\n</li>\r\n",
+			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}:host{display:contents}li{list-style:none}.gdf-panel{display:flex;flex-direction:column;width:240px;padding:4px 0;cursor:default}.gdf-search{margin:2px 8px 4px;padding:3px 6px;border:1px solid #DBE4FF;border-radius:4px;font-size:12px;outline:none}.gdf-search:focus{border-color:#4465c9}.gdf-list{max-height:240px;margin:0;padding:0;overflow-y:auto}.gdf-item{display:flex;align-items:center;gap:8px;padding:4px 12px;white-space:nowrap;cursor:pointer;font-size:12px;color:#4d5a81}.gdf-item:hover{background:#ebf0ff}.gdf-item.checked{color:#4465c9}.gdf-item input[type=checkbox]{width:14px;margin:0;pointer-events:none}.gdf-all{border-bottom:1px solid #ebf0ff}.gdf-label{flex:1;overflow:hidden;text-overflow:ellipsis}.gdf-info{padding:4px 12px;font-size:12px;color:#9fa9c7}.gdf-footer{display:flex;align-items:center;gap:6px;padding:6px 8px 2px;border-top:1px solid #ebf0ff}.gdf-count{flex:1;font-size:11px;color:#9fa9c7}.gdf-btn{padding:1px 10px;border:1px solid #DBE4FF;border-radius:4px;background:#fff;color:#4465c9;font-size:12px;cursor:pointer}.gdf-btn.primary{background:#4465c9;border-color:#4465c9;color:#fff}\n"],
+			dependencies: [
+				{
+					kind: "ngmodule",
+					type: CommonModule
+				},
+				{
+					kind: "directive",
+					type: i1$5.NgForOf,
+					selector: "[ngFor][ngForOf]",
+					inputs: [
+						"ngForOf",
+						"ngForTrackBy",
+						"ngForTemplate"
+					]
+				},
+				{
+					kind: "directive",
+					type: i1$5.NgIf,
+					selector: "[ngIf]",
+					inputs: [
+						"ngIf",
+						"ngIfThen",
+						"ngIfElse"
+					]
+				},
+				{
+					kind: "ngmodule",
+					type: FormsModule
+				},
+				{
+					kind: "directive",
+					type: i5.DefaultValueAccessor,
+					selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]"
+				},
+				{
+					kind: "directive",
+					type: i5.NgControlStatus,
+					selector: "[formControlName],[ngModel],[formControl]"
+				},
+				{
+					kind: "directive",
+					type: i5.NgModel,
+					selector: "[ngModel]:not([formControlName]):not([formControl])",
+					inputs: [
+						"name",
+						"disabled",
+						"ngModel",
+						"ngModelOptions"
+					],
+					outputs: ["ngModelChange"],
+					exportAs: ["ngModel"]
+				}
+			],
+			changeDetection: i0.ChangeDetectionStrategy.Eager
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: GridDistinctFilterComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "alg-grid-distinct-filter",
+			standalone: true,
+			imports: [CommonModule, FormsModule],
+			changeDetection: ChangeDetectionStrategy.Eager,
+			template: "<li class=\"gdf-panel\">\r\n    <input class=\"gdf-search\" type=\"text\" placeholder=\"Rechercher…\" [(ngModel)]=\"search\" (ngModelChange)=\"onSearchChange()\" />\r\n\r\n    <div *ngIf=\"values.length\" class=\"gdf-item gdf-all\" (click)=\"toggleAllShown()\">\r\n        <input type=\"checkbox\" tabindex=\"-1\" [checked]=\"allShownSelected()\" (click)=\"$event.preventDefault()\" />\r\n        <span class=\"gdf-label\">{{ search.trim() ? '(Ajouter les valeurs trouvées)' : '(Tout sélectionner)' }}</span>\r\n    </div>\r\n\r\n    <!-- Valeurs distinctes : page suivante chargée en défilant vers le bas. -->\r\n    <ul class=\"gdf-list\" (scroll)=\"onScroll($event)\">\r\n        <li *ngFor=\"let value of values\" class=\"gdf-item\" [class.checked]=\"isSelected(value)\" [title]=\"label(value)\" (click)=\"toggle(value)\">\r\n            <input type=\"checkbox\" tabindex=\"-1\" [checked]=\"isSelected(value)\" (click)=\"$event.preventDefault()\" />\r\n            <span class=\"gdf-label\">{{ label(value) }}</span>\r\n        </li>\r\n        <li *ngIf=\"loading\" class=\"gdf-info\">Chargement…</li>\r\n        <li *ngIf=\"error\" class=\"gdf-info\">Valeurs indisponibles pour cette colonne</li>\r\n        <li *ngIf=\"!loading && !error && !values.length\" class=\"gdf-info\">Aucune valeur</li>\r\n    </ul>\r\n\r\n    <div class=\"gdf-footer\">\r\n        <span class=\"gdf-count\">{{ selected.size ? selected.size + (selected.size > 1 ? ' valeurs cochées' : ' valeur cochée') : '' }}</span>\r\n        <button type=\"button\" class=\"gdf-btn\" (click)=\"clear()\">Effacer</button>\r\n        <button type=\"button\" class=\"gdf-btn primary\" (click)=\"apply()\">OK</button>\r\n    </div>\r\n</li>\r\n",
+			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}:host{display:contents}li{list-style:none}.gdf-panel{display:flex;flex-direction:column;width:240px;padding:4px 0;cursor:default}.gdf-search{margin:2px 8px 4px;padding:3px 6px;border:1px solid #DBE4FF;border-radius:4px;font-size:12px;outline:none}.gdf-search:focus{border-color:#4465c9}.gdf-list{max-height:240px;margin:0;padding:0;overflow-y:auto}.gdf-item{display:flex;align-items:center;gap:8px;padding:4px 12px;white-space:nowrap;cursor:pointer;font-size:12px;color:#4d5a81}.gdf-item:hover{background:#ebf0ff}.gdf-item.checked{color:#4465c9}.gdf-item input[type=checkbox]{width:14px;margin:0;pointer-events:none}.gdf-all{border-bottom:1px solid #ebf0ff}.gdf-label{flex:1;overflow:hidden;text-overflow:ellipsis}.gdf-info{padding:4px 12px;font-size:12px;color:#9fa9c7}.gdf-footer{display:flex;align-items:center;gap:6px;padding:6px 8px 2px;border-top:1px solid #ebf0ff}.gdf-count{flex:1;font-size:11px;color:#9fa9c7}.gdf-btn{padding:1px 10px;border:1px solid #DBE4FF;border-radius:4px;background:#fff;color:#4465c9;font-size:12px;cursor:pointer}.gdf-btn.primary{background:#4465c9;border-color:#4465c9;color:#fff}\n"]
+		}]
+	}],
+	propDecorators: {
+		facade: [{
+			type: Input,
+			args: [{ required: true }]
+		}],
+		entityKey: [{
+			type: Input,
+			args: [{ required: true }]
+		}],
+		property: [{
+			type: Input,
+			args: [{ required: true }]
+		}],
+		done: [{ type: Output }],
+		loaded: [{ type: Output }]
+	}
+});
 var GridStylePipe = class GridStylePipe {
 	transform(type, context, args = {}) {
 		if (!context) return "";
@@ -18910,8 +19161,8 @@ var DataGridComponent = class DataGridComponent {
 				}
 			],
 			ngImport: i0,
-			template: "<div #datagridContainer [class]=\"this.datagridClass\" tabindex=\"-1\" (keydown)=\"onGridKeyDown($event)\" (scroll)=\"onGridScroll($event)\"\r\n    (copy)=\"onCopy($event)\" (paste)=\"onPaste($event)\" (contextmenu)=\"openEmptyAreaContextMenu($event)\">\r\n    <ng-container>\r\n        <table class=\"data-grid-datatable\">\r\n            <ng-container *ngIf=\"this.facade.style as ctx\">\r\n                <ng-container *ngIf=\"this.facade.config.columns$ | async as rcolumns\">\r\n                    <thead>\r\n                        <tr>\r\n                            <th class=\"header row-state\" (click)=\"addFilterQuery()\"></th>\r\n                            <!-- En-tête : poignée de déplacement à gauche, intitulé, indicateur de tri,\r\n                                 flèche du menu (tri, agrégation) à droite. Le clic ne trie plus. -->\r\n                            <th #thHeader *ngFor=\"let col of rcolumns;let i = index\"\r\n                                    [attr.id]=\"guid.toString() + '-col-' + col.Property\"\r\n                                    [attr.class]=\"'header' | gridStyle : ctx : { column : col }\"\r\n                                    [style.width.px]=\"colWidth(col)\" [style.min-width.px]=\"colWidth(col)\" [style.max-width.px]=\"colWidth(col)\"\r\n                                    [attr.data-frozen]=\"isFrozen(i) ? '' : null\" [style.left.px]=\"frozenLeft(i)\">\r\n                                <div class=\"header-cell\"\r\n                                    [class.col-dragging]=\"draggedColumn === col.Property\">\r\n                                    <span class=\"header-handle\" title=\"Déplacer la colonne\"\r\n                                        (mousedown)=\"onHeaderMouseDown(col, $event)\">\r\n                                        <i class=\"fa fa-ellipsis-v\"></i>\r\n                                    </span>\r\n                                    <label>{{ getHeaderLabel(col) }}</label>\r\n                                    <i *ngIf=\"this.facade.filter.isAsc(col.Property)\" class=\"fa fa-long-arrow-up header-sort\" title=\"Tri croissant\"></i>\r\n                                    <i *ngIf=\"this.facade.filter.isDesc(col.Property)\" class=\"fa fa-long-arrow-down header-sort\" title=\"Tri décroissant\"></i>\r\n                                    <sup *ngIf=\"this.facade.filter.sortRank(col.Property) > 0\" class=\"header-sort-rank\"\r\n                                        title=\"Rang dans le tri personnalisé\">{{ this.facade.filter.sortRank(col.Property) }}</sup>\r\n                                    <i *ngIf=\"activeAggregations[col.Property]\" class=\"header-agg\" [title]=\"'Agrégation : ' + aggregationLabel(activeAggregations[col.Property])\">Σ</i>\r\n                                    <!-- Dernière colonne suivie de la colonne vide de fin : sa flèche est dans la colonne vide. -->\r\n                                    <button type=\"button\" class=\"header-menu-button\" title=\"Trier, agréger\"\r\n                                        *ngIf=\"!(ctx.enableLastColumnResize && i === rcolumns.length - 1)\"\r\n                                        [class.open]=\"headerMenu?.column.Property === col.Property\"\r\n                                        (click)=\"toggleHeaderMenu(col, $event)\">\r\n                                        <i class=\"fa fa-caret-down\"></i>\r\n                                    </button>\r\n                                </div>\r\n                                <!-- Bord droit : largeur de la colonne (tirer), ajustée au contenu (double clic). -->\r\n                                <span class=\"col-resizer\" title=\"Largeur de la colonne (double clic : ajuster au contenu)\"\r\n                                    (mousedown)=\"startResize(col, $event)\" (dblclick)=\"autoFitColumn(col, $event)\"\r\n                                    (click)=\"$event.stopPropagation()\"></span>\r\n                            </th>\r\n                            <th *ngIf=\"ctx.enableLastColumnResize\" #lastColumnHeader class=\"header last-column\"\r\n                                (contextmenu)=\"openHeaderContextMenu($event, rcolumns[rcolumns.length - 1])\">\r\n                                <div class=\"header-cell header-cell-end\" *ngIf=\"rcolumns.length > 0\">\r\n                                    <button type=\"button\" class=\"header-menu-button\" title=\"Trier, agréger\"\r\n                                        [class.open]=\"headerMenu?.column.Property === rcolumns[rcolumns.length - 1].Property\"\r\n                                        (click)=\"toggleHeaderMenu(rcolumns[rcolumns.length - 1], $event)\">\r\n                                        <i class=\"fa fa-caret-down\"></i>\r\n                                    </button>\r\n                                </div>\r\n                            </th>\r\n\r\n                        </tr>\r\n                        <ng-container *ngIf=\"this.facade.filter.additionalQuery$ | async as additionalQuery\">\r\n                            <tr #thFilterRows *ngFor=\"let filterRow of additionalQuery.Rows;let i = index\" >\r\n                                <th class=\"filter-header row-state\" (click)=\"removeFilterQuery(i)\"></th>\r\n                                <th class=\"filter-header\" [ngClass]=\"{disabled: !col.IsFilterEnabled}\" *ngFor=\"let col of rcolumns;let i = index\"\r\n                                    [attr.id]=\"guid.toString() + '-filter-' + i\">\r\n                                    <input *ngIf=\"col.IsFilterEnabled\" type=\"text\"\r\n                                        class=\"filter-header-input\"\r\n                                        name=\"keyword\"\r\n                                        #uniquename=\"ngModel\"\r\n                                        [attr.id]=\"guid.toString() + '-filter-input-' + col.Property\"\r\n                                        [(ngModel)]=\"filterRow.ClausesByPropertyName.get(col.Property).FilterValue\"\r\n                                        (ngModelChange)=\"handleFilterChanged($event, filterRow, col.Property)\"\r\n                                        (change)=\"validateFilterChanged($event, filterRow, col.Property)\"\r\n                                    />\r\n                                </th>\r\n                                <ng-container>\r\n                                    <th #lastColumnFilter class=\"filter-header last-column\"></th>\r\n                                </ng-container>\r\n                            </tr>\r\n                        </ng-container>\r\n                    </thead>\r\n\r\n                    <tbody>\r\n                        <ng-container *ngIf=\"this.facade.data\">\r\n                            <ng-container *ngFor=\"let row of this.data.Values; let r = index;\">\r\n                            <tr\r\n                                [class]=\"'alternating' | gridStyle : ctx : { row : row, index : r, maxIndex : this.data.Values.length, hasAggregates: hasAggregates  }\"\r\n                                [class.selected]=\"isRowSelected(row)\"\r\n                                [attr.id]=\"guid.toString() + '-row-' + row.Id\"\r\n                                (mousedown)=\"onRowMouseDown(row, $event)\"\r\n                                (mouseup)=\"onRowMouseUp(row, $event)\"\r\n                                (click)=\"onRowClick(row, $event)\"\r\n\r\n                                [rowRef]=\"guid + '-row-' + row.Id\"\r\n                            >\r\n\r\n                            <th [attr.class]=\"'rowstate' | gridStyle : ctx : { row : row }\">\r\n                                <ng-container *ngIf=\"selectionStyler.isModified(row) && !selectionStyler.isInvalid(row) && !selectionStyler.isWarning(row)\">\r\n                                    <div class=\"new-rowstate\"><span>...</span></div>\r\n                                </ng-container>\r\n\r\n                                <ng-container *ngIf=\"selectionStyler.isInvalid(row)\">\r\n                                    <div> <img class=\"error-row-icon\" src=\"assets/images/error.svg\" /> </div>\r\n                                </ng-container>\r\n\r\n                                <ng-container *ngIf=\"selectionStyler.isWarning(row) && !selectionStyler.isInvalid(row)\">\r\n                                    <div> <img class=\"error-row-icon\" src=\"assets/images/warning.svg\" /> </div>\r\n                                </ng-container>\r\n\r\n                                <ng-container *ngIf=\"ctx.displayDetail\">\r\n                                    <button type=\"button\" [attr.id]=\"row.Id + '_button'\" class=\"toggle-button btn\" (click)=\"toggleDetail(row)\">\r\n                                        <i class=\"fa fa-chevron-right fa-custom\"></i>\r\n                                    </button>\r\n                                </ng-container>\r\n                            </th>\r\n\r\n                            <td *ngFor=\"let column of rcolumns; index as i\"\r\n                                [attr.id]=\"cellId(row, column)\"\r\n                                [style.max-width.px]=\"colWidth(column)\" [attr.data-sized]=\"colWidth(column) ? '' : null\"\r\n                                [attr.data-frozen]=\"isFrozen(i) ? '' : null\" [style.left.px]=\"frozenLeft(i)\"\r\n                                [class]=\"'cell' | gridStyle : ctx : { row : row,column : column,index : r }\"\r\n                                [class.selected]=\"isRowSelected(row)\"\r\n                                (mousedown)=\"onCellMouseDown(r, i, $event)\"\r\n                                (mouseenter)=\"onCellMouseEnter(r, i, $event)\"\r\n                                (click)=\"onCellClick(row, column)\"\r\n                                (dblclick)=\"onCellDblClick(row, column)\">\r\n\r\n                                <alg-datagrid-cell #dataGridCellComponent\r\n                                    class=\"gridcell-container\"\r\n                                    [entity]=\"row\"\r\n                                    [isEditable]=\"canEditCell(row, column)\"\r\n                                    [property]=\"column.Property\"\r\n                                    [managed]=\"true\"\r\n                                    [mode]=\"showEditor(row, column) ? 'edit' : 'view'\"\r\n                                    [class.grid-cursor]=\"isCursorCell(row, column)\"\r\n                                    [class.grid-range]=\"isInRange(r, i)\"\r\n                                    (contextmenu)=\"openContextMenu($event, row, column)\">\r\n\r\n                                    <ng-template alg-editMode>\r\n                                        <!-- Éditeur du champ du formulaire qui correspond à la colonne (sinon déduit de la colonne), à la hauteur de la ligne. -->\r\n                                        <alg-field class=\"grid-editor\"\r\n                                            [field]=\"getEditField(column)\"\r\n                                            [form]=\"getRowForm(row)\"\r\n                                            [showLabel]=\"false\"\r\n                                            (propertyChanged)=\"onCellChanged(row, $event)\"\r\n                                            >\r\n                                            <!-- [focusable]=\"cellFocus\" -->\r\n                                        </alg-field>\r\n                                    </ng-template>\r\n                                    <ng-template alg-viewMode>\r\n\r\n                                        <div [ngSwitch]=\"column.Display?.type\" *ngIf=\"!isUndefined(row[column.Property])\">\r\n                                            <div *ngSwitchCase=\"'url'\">\r\n                                                <a [routerLink]=\"[$safeNavigationMigration(column.Display?.baseUrl),row[column.Property]]\">\r\n                                                    {{ row.Id || row[column.Property] }}\r\n                                                </a>\r\n                                            </div>\r\n\r\n                                            <div *ngSwitchCase=\"'img'\" class=\"image\">\r\n                                                <img *ngIf=\"column.Display?.imagePath?.length == 0\"\r\n                                                    [src]=\"(column.Display?.imgBase || '') + (column.Display?.sourceProperty ? row[column.Display?.sourceProperty] : row[column.Property])\" />\r\n\r\n                                                <alg-image *ngIf=\"column.Display?.imagePath?.length != 0\"\r\n                                                    [imageUrl]=\"this.getEnumImageUrl(row,column)\" [imageHeight]=\"20\" [imageWidth]=\"20\">\r\n                                                </alg-image>\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"!isUndefined(column.ToolTipProperty)\">\r\n                                                    {{ row[column.ToolTipProperty] }}\r\n                                                </div>\r\n                                            </div>\r\n\r\n                                            <div *ngSwitchCase=\"'img-file'\" class=\"image\">\r\n\r\n                                                <alg-image\r\n                                                    [imageUrl]=\"this.getImageUrl(row,column)\" [wide]=\"true\" [imageHeight]=\"40\" [imageWidth]=\"40\">\r\n                                                </alg-image>\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"!isUndefined(column.ToolTipProperty)\">\r\n                                                    {{ row[column.ToolTipProperty] }}\r\n                                                </div>\r\n                                            </div>\r\n\r\n                                            <div *ngSwitchCase=\"'wide-img'\" class=\"image\">\r\n                                                <img *ngIf=\"column.Display?.imagePath?.length == 0\"\r\n                                                    [src]=\"(column.Display?.imgBase || '') + (column.Display?.sourceProperty ? row[column.Display?.sourceProperty] : row[column.Property])\" />\r\n\r\n                                                <alg-image *ngIf=\"column.Display?.imagePath?.length != 0\" [wide]=\"true\"\r\n                                                    [imageUrl]=\"this.getEnumImageUrl(row,column)\" [imageHeight]=\"40\" [imageWidth]=\"40\">\r\n                                                </alg-image>\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"!isUndefined(column.ToolTipProperty)\">\r\n                                                    {{ row[column.ToolTipProperty] }}\r\n                                                </div>\r\n                                            </div>\r\n\r\n                                            <span *ngSwitchCase=\"'date'\">\r\n                                                {{row[column.Property]| date: column.Display?.format || 'dd/MM/yyyy'}}\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'boolean'\">{{row[column.Property] ? 'OUI' : 'NON'}} </span>\r\n\r\n                                            <span *ngSwitchCase=\"'datetime'\">{{row[column.Property] | date: column.Display?.format || 'dd/MM/yyyy HH:mm:ss'}}</span>\r\n\r\n                                            <span *ngSwitchCase=\"'money'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\"\r\n                                                class=\"money\">\r\n                                                {{\r\n                                                    row[column.Property]\r\n                                                    | currency: column.Display?.currency\r\n                                                    || (column.Display?.sourceProperty && row[column.Display?.sourceProperty] ? row[column.Display?.sourceProperty] : false)\r\n                                                    || 'EUR' : 'symbol'\r\n\r\n                                                    | todefine: $safeNavigationMigration(column.Display?.handleError)\r\n                                                }}\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"ctx.showOnToolTip(row,column)\">\r\n                                                    {{ctx.showOnToolTip(row,column)}}\r\n                                                </div>\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'percent'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\">\r\n                                                {{row[column.Property] * $safeNavigationMigration(column.Display?.multiplier) | percent : column.Display?.format\r\n                                                || '1.0-2' | todefine: $safeNavigationMigration(column.Display?.handleError)}}\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'number'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\">\r\n                                                {{row[column.Property] * $safeNavigationMigration(column.Display?.multiplier) | number: column.Display?.format\r\n                                                || '1.0-3' | todefine : $safeNavigationMigration(column.Display?.handleError)}}\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'fixedsizeinteger'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\">\r\n                                                {{row[column.Property] | tofixedsizeinteger : $safeNavigationMigration(column.Display?.completingCaracter) : $safeNavigationMigration(column.Display?.width) }}\r\n                                            </span>\r\n                                            <span *ngSwitchDefault [innerText]=\"column.Property == 'Id' ? (row[column.Property] < 0 ? '' : row[column.Property]) : row[column.Property]\">\r\n                                            </span>\r\n                                        </div>\r\n\r\n                                        <div *ngIf=\"isUndefined(row[column.Property])\">\r\n                                            <span *ngIf=\"!isUndefined($safeNavigationMigration(column.Display?.nullCaseText))\" class=\"mw-invalid\">\r\n                                                {{ column.Display?.nullCaseText }}\r\n                                            </span>\r\n\r\n                                            <span *ngIf=\"isUndefined($safeNavigationMigration(column.Display?.nullCaseText))\">\r\n                                                &nbsp;&nbsp;&nbsp;\r\n                                            </span>\r\n                                        </div>\r\n\r\n                                    </ng-template>\r\n\r\n                                </alg-datagrid-cell>\r\n                            </td>\r\n                            <ng-container *ngIf=\"ctx.enableLastColumnResize\">\r\n                                <!-- Colonne vide de fin : clic droit = menu de la dernière colonne. -->\r\n                                <td (contextmenu)=\"openContextMenu($event, row, rcolumns[rcolumns.length - 1])\"></td>\r\n                            </ng-container>\r\n                            </tr>\r\n                            </ng-container>\r\n                        </ng-container>\r\n                    </tbody>\r\n\r\n                    <tfoot>\r\n                        <tr class=\"empty-row\" *ngIf=\"hasAggregates\">\r\n                             <td></td>\r\n                        </tr>\r\n                        <tr class=\"aggregation-row\" *ngIf=\"hasAggregates\">\r\n                            <td class=\"row-state\"></td>\r\n                            <td *ngFor=\"let column of rcolumns; index as i\" [attr.class]=\"'cell' | gridStyle : ctx : { column : column, index : i }\"\r\n                                [attr.data-frozen]=\"isFrozen(i) ? '' : null\" [style.left.px]=\"frozenLeft(i)\">\r\n\r\n                                <ng-container *ngFor=\"let agg of columnAggregates[column.Property]\">\r\n\r\n                                    <span class=\"agg-label\">{{ aggregationLabel(agg.op) }}</span>\r\n                                    <span [ngSwitch]=\"agg.op === 'COUNT' ? 'count' : column.Display?.type\">\r\n\r\n                                        <span *ngSwitchCase=\"'count'\">{{ agg.value | number: '1.0-0' }}</span>\r\n                                        <span *ngSwitchCase=\"'percent'\">{{ agg.value | number: column.Display?.format || '1.0-3' }}</span>\r\n                                        <span *ngSwitchCase=\"'fixedsizeinteger'\">{{ agg.value | number: column.Display?.format || '1.0-3' }}</span>\r\n\r\n                                        <span *ngSwitchCase=\"'money'\" class=\"money\">\r\n                                            {{ agg.value | currency: getColCurrency(column) }}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchCase=\"'date'\">\r\n                                            {{agg.value | date: column.Display?.format || 'dd/MM/yyyy'}}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchCase=\"'datetime'\">\r\n                                            {{agg.value | date: column.Display?.format || 'dd/MM/yyyy HH:mm:ss'}}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchCase=\"'number'\">\r\n                                            {{agg.value | number: column.Display?.format || '1.0-3'}}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchDefault>\r\n                                            {{agg.value}}\r\n                                        </span>\r\n\r\n                                    </span>\r\n\r\n                                </ng-container>\r\n\r\n                            </td>\r\n\r\n                            <ng-container *ngIf=\"ctx.enableLastColumnResize\">\r\n                                <td class=\"last-column\"></td>\r\n                            </ng-container>\r\n\r\n                        </tr>\r\n                    </tfoot>\r\n                </ng-container>\r\n            </ng-container>\r\n        </table>\r\n    </ng-container>\r\n</div>\r\n\r\n\r\n<!-- Emplacement visé par une colonne déplacée : trait orange sur la séparation des deux en-têtes. -->\r\n<div class=\"col-drop-indicator\" *ngIf=\"dropIndicator\"\r\n    [ngStyle]=\"{ left: dropIndicator.left + 'px', top: dropIndicator.top + 'px', height: dropIndicator.height + 'px' }\"></div>\r\n\r\n<!-- Menu d'une colonne (flèche de l'en-tête ou clic droit sur une cellule), en trois zones séparées\r\n     par un trait : Tri, Actions (celles du panneau des actions), Fonctions (sous-menu « Fonctions »). -->\r\n<div class=\"header-menu\" *ngIf=\"headerMenu\"\r\n    [ngStyle]=\"{ top: headerMenu.y + 'px', left: headerMenu.x + 'px', visibility: headerMenu.ready ? 'visible' : 'hidden' }\"\r\n    (click)=\"$event.stopPropagation()\" (contextmenu)=\"$event.preventDefault()\">\r\n    <ul>\r\n        <!-- Tri -->\r\n        <li [class.checked]=\"this.facade.filter.isAsc(headerMenu.column.Property)\" (click)=\"sortColumn('asc')\"\r\n            (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-sort-amount-asc\"></i><span>Trier par ordre croissant</span>\r\n        </li>\r\n        <li [class.checked]=\"this.facade.filter.isDesc(headerMenu.column.Property)\" (click)=\"sortColumn('desc')\"\r\n            (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-sort-amount-desc\"></i><span>Trier par ordre décroissant</span>\r\n        </li>\r\n        <li [class.checked]=\"this.facade.filter.getSortList().length > 1\" (click)=\"openCustomSort()\"\r\n            (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-sort\"></i><span>Tri personnalisé…</span>\r\n        </li>\r\n        <!-- Filtre sur la valeur de la cellule (clic droit sur une cellule) : première ligne des filtres composés. -->\r\n        <li *ngIf=\"cellFilterValue() !== undefined\" (click)=\"filterOnCell()\" (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-filter\"></i><span>Filtrer sur « {{ cellFilterLabel() }} »</span>\r\n        </li>\r\n        <!-- Affichage : vues personnalisées (cochée = affichée), puis « Modifier… ». -->\r\n        <li *ngIf=\"this.facade.config.viewChooser\" class=\"has-submenu\" [class.open]=\"headerMenu.submenu === 'columns'\"\r\n            (mouseenter)=\"setSubmenu('columns')\" (click)=\"setSubmenu('columns')\">\r\n            <i class=\"fa fa-columns\"></i><span>Affichage</span><i class=\"fa fa-caret-right submenu-caret\"></i>\r\n\r\n            <ul class=\"header-submenu header-submenu-columns\" *ngIf=\"headerMenu.submenu === 'columns'\"\r\n                [class.left]=\"headerMenu.submenuLeft\" [class.up]=\"headerMenu.submenuUp\"\r\n                (click)=\"$event.stopPropagation()\">\r\n                <alg-grid-view-menu [chooser]=\"this.facade.config.viewChooser\" (done)=\"closeViewMenu()\" (loaded)=\"onViewMenuLoaded()\"></alg-grid-view-menu>\r\n            </ul>\r\n        </li>\r\n        <!-- Colonnes figées à gauche, de la première jusqu'à celle-ci. -->\r\n        <li [class.checked]=\"isFrozen(columnIndex(headerMenu.column))\" (click)=\"toggleFrozen()\" (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-thumb-tack\"></i>\r\n            <span>{{ frozenUntil === columnIndex(headerMenu.column) ? 'Libérer les colonnes' : 'Figer jusqu\\'à cette colonne' }}</span>\r\n        </li>\r\n        <li *ngIf=\"frozenUntil !== undefined && frozenUntil !== columnIndex(headerMenu.column)\"\r\n            (click)=\"unfreezeColumns()\" (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-unlock\"></i><span>Libérer les colonnes</span>\r\n        </li>\r\n\r\n        <!-- Actions -->\r\n        <ng-container *ngIf=\"visibleActions.length > 0\">\r\n            <li class=\"separator\"></li>\r\n            <ng-container *ngFor=\"let action of visibleActions\">\r\n                <ng-container *ngIf=\"{ disabled: (action.disabled$ | async) } as state\">\r\n                    <li class=\"menu-action\" [class.disabled]=\"state.disabled\"\r\n                        (click)=\"executeMenuAction(action, state.disabled)\" (mouseenter)=\"setSubmenu(undefined)\">\r\n                        <img class=\"menu-action-icon\" [src]=\"getActionImageUrl(action.icon)\" [alt]=\"action.title\" />\r\n                        <span>{{ action.title }}</span>\r\n                    </li>\r\n                </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n\r\n        <!-- Affichage -->\r\n        <li class=\"separator\"></li>\r\n        <li class=\"has-submenu\" [class.open]=\"headerMenu.submenu === 'display'\"\r\n            (mouseenter)=\"setSubmenu('display')\" (click)=\"setSubmenu('display')\">\r\n            <i class=\"fa fa-calculator\"></i><span>Fonctions</span><i class=\"fa fa-caret-right submenu-caret\"></i>\r\n\r\n            <ul class=\"header-submenu\" *ngIf=\"headerMenu.submenu === 'display'\"\r\n                [class.left]=\"headerMenu.submenuLeft\" [class.up]=\"headerMenu.submenuUp\"\r\n                (click)=\"$event.stopPropagation()\">\r\n                <li *ngFor=\"let op of getAggregationOptions(headerMenu.column)\"\r\n                    [class.checked]=\"activeAggregations[headerMenu.column.Property] === op\"\r\n                    (click)=\"aggregateColumn(op)\">\r\n                    <i class=\"fa fa-check\"></i><span>{{ aggregationLabel(op) }}</span>\r\n                </li>\r\n                <ng-container *ngIf=\"activeAggregations[headerMenu.column.Property]\">\r\n                    <li class=\"separator\"></li>\r\n                    <li (click)=\"aggregateColumn(null)\">\r\n                        <i class=\"fa fa-times\"></i><span>Ne plus afficher</span>\r\n                    </li>\r\n                </ng-container>\r\n            </ul>\r\n        </li>\r\n    </ul>\r\n</div>\r\n\r\n",
-			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}:host{flex:1}.header.last-column{border-left:none!important;width:100%}table thead .sorting,table thead .sorting_asc,table thead .sorting_desc,table thead .sorting_asc_disabled,table thead .sorting_desc_disabled{background-repeat:no-repeat;background-position:center right}table thead th:first-child,table tfoot tr:first-child{position:sticky;left:0;z-index:2}table tbody th:first-child{position:sticky;left:0;z-index:1;border-right:none}table tbody th:first-child div{text-align:center;vertical-align:middle;line-height:20px}table tbody tr.row-odd th:first-child{background:#ebf0ff}table tbody tr.selected.row-odd.mw-invalid th:first-child,table tbody tr.selected.row-even.mw-invalid th:first-child,table tbody tr.selected.row-odd.mw-warning th:first-child,table tbody tr.selected.row-even.mw-warning th:first-child,table tbody tr.selected.row-even th:first-child,table tbody tr.selected.row-odd th:first-child{background-color:#8ea7f8;color:#fff}table tbody tr.row-odd.mw-invalid th:first-child,table tbody tr.row-even.mw-invalid th:first-child{background-color:#f2dede}table tbody tr.row-odd.mw-warning th:first-child,table tbody tr.row-even.mw-warning th:first-child{background-color:#fff4de}table thead th{position:-webkit-sticky;position:sticky;top:0;z-index:1;background:#fff;border-left:1px solid #3C5DC4;border-bottom:1px solid #3C5DC4}table thead .sorting{background-image:none;cursor:pointer}table thead .sorting_asc{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowMTgwMTE3NDA3MjA2ODExQjM4MkY2QzVGRUYwRTJDNCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo4MkFEQzYxNjIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4MkFEQzYxNTIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjAyODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAxODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+z5ABTAAAAI5JREFUeNpi/P//PwO1ABMDFQELIQXVjfe4gFQbEJe11iv9otRl2UCcBcSphBQy4gszoKu0gNROIJYB4jtA7AF03V2SXQY0iBFIFUMNAgEVIM6DipPsTQcgDkQTSwRia5IMA9rOC6RqgVgQTQokXgOUZyfFZSFQF/zAgh2BOIjkCBjQRDtq2Khh9DAMIMAAT9AmNBDSXegAAAAASUVORK5CYII=);cursor:pointer}table thead .sorting_desc{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowMTgwMTE3NDA3MjA2ODExQjM4MkY2QzVGRUYwRTJDNCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo4MkFEQzYxQTIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4MkFEQzYxOTIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjAyODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAxODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+1fsfwAAAAJdJREFUeNpi/P//PwO1ABMDFcGoYaOG0cMwFmyC1Y33IoHUAiD+h8MBGa31SvOJddk6IN4PxBxY8FEgXkO0N4G2/gRSLUD8GU3qPRA3A+U/kxpmIBege2U9EB/ApYERX6kBDDtlILUDiFWA+AkQuwNddY2s2ARqvAukJgDxbyCehM8gnLGJBmYDsSoQTyWkkHHQFo4AAQYAAA0piq4hbqwAAAAASUVORK5CYII=);cursor:pointer}table thead .sorting_asc_disabled,table thead .sorting_desc_disabled{background-image:none}.checkbok-container{align-items:center;margin:0;padding:0}.gridcell-container{padding:0;min-width:fit-content}.gridcell-container input[type=number]{display:block;size:1;font-size:10pt;width:100%!important;height:100%;margin:0!important;border:2px solid #F78383}.datagrid-custom-container{height:100%;overflow:auto;margin-left:-1px}.data-grid-datatable{table-layout:fixed;cursor:pointer;border-spacing:0px}.data-grid-datatable td{box-shadow:none;padding:2px 5px;white-space:nowrap}.data-grid-datatable td.row-state{padding:2px 5px;width:16px}.data-grid-datatable td.img{padding:2px 5px}.data-grid-datatable td.row-state img{height:16px;width:16px;margin-top:-3px;padding:0}.data-grid-datatable tr{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.header{vertical-align:bottom;padding:2px 5px 2px 0;font-weight:400;color:#3c5dc4;white-space:nowrap;line-height:25px;min-width:32px;margin-bottom:5px}.header.img{min-width:16px}.header.row-state{min-width:27px;position:-webkit-sticky;position:sticky;top:0;left:0;z-index:2;background:#fff;border-left:none;border-right:none}.filter-header{background-color:#f7f7f7!important}.filter-header.disabled{background-color:#9fa9c7!important}.filter-header.row-state:hover:before{position:relative;display:block;float:left;width:16px;height:16px;content:\" \";background-size:16px 16px;-webkit-background-size:16px 16px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"57\" height=\"57\" viewBox=\"0 0 57 57\">%0D%0A  <path id=\"Rond_Croix\" data-name=\"Rond Croix\" d=\"M28.5,57A28.5,28.5,0,0,1,8.347,8.347,28.5,28.5,0,1,1,48.652,48.652,28.317,28.317,0,0,1,28.5,57Zm0-24.036h0l11.9,11.9L44.869,40.4,32.964,28.5,44.869,16.593,40.4,12.129,28.5,24.034,16.594,12.129l-4.465,4.464L24.034,28.5,12.129,40.4l4.463,4.465L28.5,32.965Z\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 0 0 3px;filter:brightness(0) saturate(100%) invert(70%) sepia(93%) saturate(1540%) hue-rotate(309deg) brightness(105%) contrast(94%)}.filter-header-input{height:calc(100% - 2px);width:calc(100% - 2px);margin:0;border:none!important;background-color:#f7f7f7;padding:0 0 0 5px;color:#4d5a81}.header.row-state:before{position:relative;display:block;float:left;width:16px;height:16px;content:\" \";background-size:16px 16px;-webkit-background-size:16px 16px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->%0D%0A<path fill=\"currentColor\" d=\"M3.9 54.9C10.5 40.9 24.5 32 40 32l432 0c15.5 0 29.5 8.9 36.1 22.9s4.6 30.5-5.2 42.5L320 320.9 320 448c0 12.1-6.8 23.2-17.7 28.6s-23.8 4.3-33.5-3l-64-48c-8.1-6-12.8-15.5-12.8-25.6l0-79.1L9 97.3C-.7 85.4-2.8 68.8 3.9 54.9z\"/></svg>');background-repeat:no-repeat;margin:0 0 3px 5px;filter:brightness(0) saturate(100%) invert(56%) sepia(79%) saturate(2301%) hue-rotate(202deg) brightness(92%) contrast(91%)}.filter-header.last-column{border-left:none!important}.header label{cursor:pointer;margin-bottom:0;margin-right:10px;padding-left:5px;width:100%}.row-odd{background-color:#ebf0ff;border-left:1px solid #C1D0FD;border-bottom:1px solid #C1D0FD}.row-even{background-color:#f7faff;border-left:1px solid #C1D0FD;border-bottom:1px solid #C1D0FD}.error-row-icon{padding:2px;width:20px}.selected{background-color:#8ea7f8;color:#fff}.mw-invalid{font-weight:600;background-color:#f2dede;border:1px solid var(--red-error)}.mw-invalid td{background-color:#f2dede!important}.data-grid-datatable tbody tr.mw-invalid>td,.data-grid-datatable tbody tr.mw-invalid>th{box-shadow:inset 0 1px 0 var(--red-error),inset 0 -1px 0 var(--red-error)}span.mw-invalid{padding:0 3px;color:var(--red-error);background-color:transparent}.mw-warning.selected,.mw-invalid.selected{background-color:#8ea7f8}.mw-warning.selected td,.mw-invalid.selected td{background-color:#8ea7f8!important}.mw-warning{font-weight:600;background-color:#fff4de;border:1px solid var(--orange-algorima)}.mw-warning td{background-color:#fff4de!important}.mw-modified{font-weight:600;border:1px solid var(--main-bg-color)}.first-row{border-top:none}.last-row,.last-row td{border-bottom:none!important}.data-grid-datatable>tbody>tr{z-index:50}.image{position:relative;display:flex;flex-direction:row}.image img{height:20px;width:auto}td.money{position:relative}.tool-tip{visibility:hidden;background-color:#424242;color:#fff;text-align:left;border-radius:3px;font-size:15px;position:absolute;z-index:1;top:-10%;left:150%;opacity:0;transition:opacity .3s;padding:5px 15px;white-space:nowrap;overflow:visible}.tool-tip:after{content:\" \";position:absolute;top:50%;right:100%;margin-top:-5px;border-width:5px;border-style:solid;border-color:transparent rgb(66,66,66) transparent transparent}.image:hover .tool-tip{visibility:visible;opacity:1}td.money:hover .tool-tip{visibility:visible;opacity:1;left:100%;height:28px;font-size:13px;margin-top:0;padding:5px 10px 10px}.disabled{pointer-events:none}.edit-mode{background-color:#fff;border:1px solid #4465C9;min-width:90px!important;height:30px!important}.edit-mode .form-group{min-height:0px}.edit-mode .inactivated{background-color:#dbe4ff80}.edit-mode .inactivated-fo{background-color:#dbe4ff}.edit-mode .ecartclass{border:2px solid #4465C9}.edit-mode .error-cell{font-weight:700;color:#f78383!important}.edit-mode .selected{color:#4d5a81}.highlight-1,.highlight-1.selected,.edit-mode.highlight-1.selected{background-color:#4d5a81!important;color:#fff!important}.highlight-2,.highlight-2.selected,.edit-mode.highlight-2.selected{background-color:#dbe4ff!important;color:#4d5a81!important}.highlight-3,.highlight-3.selected,.edit-mode.highlight-3.selected{background-color:#4465c9!important;color:#fff!important}.highlight-4,.highlight-4.selected,.edit-mode.highlight-4.selected{background-color:#f78383!important;color:#fff!important}.highlight-5,.highlight-5.selected{background-color:#4465c9!important;color:#fff}.fixed-column{position:-webkit-sticky;position:sticky;left:27px;z-index:2!important;border-left:none}.fixed-header{position:-webkit-sticky;position:sticky;left:27px;z-index:3!important;background:#fff}.has-focus{padding:0!important}.has-focus ::ng-deep input,.has-focus ::ng-deep input:focus-visible,.has-focus ::ng-deep input:focus{border-radius:.1;outline:none!important;width:100%;height:29px;min-height:0;margin:0;border:1px solid #4465C9}.has-focus ::ng-deep .form-group{margin-bottom:0;min-height:0}.has-focus ::ng-deep .field-container{margin-bottom:0}.edit-mode.has-focus{width:90px!important}.bordered{border-left:1px solid #14358f!important;border-right:1px solid #14358f!important}.match-keywords{color:var(--main-bg-color);font-weight:700}.datagrid-img img{height:20px;width:20px}.right-align{text-align:right}.left-align{text-align:left}.detail-div{height:0px;overflow:hidden;transition:all .2s linear;width:100%}.fa-custom{font-size:smaller}.detail-div-show{height:150px;transition:all .2s linear}.toggleable{visibility:collapse}.toggleable-show{visibility:visible}.toggle-button-down{transform:rotate(90deg);transition:all .2s linear}.no-result{color:#5272d3;height:100%;width:100%;padding:15px 15px 150px}.new-rowstate{display:flex;flex-direction:row;align-items:center;align-self:center;height:100%;width:100%}.new-rowstate span{height:100%;width:100%;margin-top:-6px}.context-menu{position:absolute;background:#ffffff26;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);box-shadow:0 4px 12px #0000004d;padding:8px;z-index:1000;min-width:75px;max-width:250px;transition:all .3s ease-in-out}.context-menu ul{list-style:none;margin:0;padding:0}.context-menu li{padding:10px 14px;cursor:pointer;border-radius:8px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}.context-menu li:hover{background:linear-gradient(135deg,#ffffff4d,#ffffff1a);transform:scale(1.02)}.context-menu li:active{transform:scale(.98)}.grid-container{overflow:auto;position:relative}.aggregation-row{position:sticky;bottom:0;z-index:50;background:#f7faff!important;background-color:#f7faff!important;font-weight:700;border-top:1px solid #4D5A81!important;border-bottom:1px solid #4D5A81!important}.aggregation-row td{background:#f7faff!important;background-color:#f7faff!important;border-top:1px solid #4D5A81!important;border-bottom:1px solid #4D5A81!important;border-left:none!important;border-right:none!important}.empty-row td{padding:0}.col-resizer{position:absolute;top:0;right:-5px;z-index:4;width:10px;height:100%;cursor:col-resize}.col-resizer:hover{background:#3c5dc440}.data-grid-datatable td[data-sized]{overflow:hidden;text-overflow:ellipsis}:where(.data-grid-datatable tbody tr,.data-grid-datatable tfoot tr){background-color:#fff}.data-grid-datatable td[data-frozen]{position:sticky;z-index:1;background-color:inherit}.data-grid-datatable thead th[data-frozen]{position:sticky;z-index:3}.data-grid-datatable td[data-frozen]:has(+td:not([data-frozen])),.data-grid-datatable thead th[data-frozen]:has(+th:not([data-frozen])){box-shadow:inset -2px 0 #3c5dc459}table thead th.header{background-image:none!important;cursor:default}.header-cell{position:relative;display:flex;align-items:center;gap:2px}.header-cell label{flex:1 1 auto;cursor:default;margin:0;padding-left:2px;overflow:hidden;text-overflow:ellipsis}.header-cell.col-dragging{opacity:.8}.dg-column-ghost{border:1px solid #C1D0FD;box-sizing:border-box}.col-drop-indicator{position:fixed;z-index:3100;width:1px;border-radius:0;background:var(--orange-algorima, #f59d0f);pointer-events:none}.header-cell-end{justify-content:flex-end;align-items:center;height:25px}.header-handle{flex-shrink:0;display:flex;align-items:center;justify-content:center;box-sizing:content-box;width:17px;height:20px;padding:0 2px;color:#3c5dc4;opacity:.35;cursor:grab}.header-handle:hover{opacity:1}.header-handle:active{cursor:grabbing}.header-sort,.header-agg{flex-shrink:0;color:#3c5dc4;font-size:11px;font-style:normal}.header-menu-button{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:16px;height:18px;padding:0;border:0;border-radius:3px;background:none;color:#3c5dc4;opacity:.5;cursor:pointer}.header-menu-button:hover,.header-menu-button.open{opacity:1;background:#4465c926}.header-menu{position:fixed;z-index:3000;width:230px;padding:4px 0;background:#fff;border:1px solid #DBE4FF;border-radius:5px;box-shadow:0 4px 14px #0003}.header-menu ul{margin:0;padding:0;list-style:none}.header-menu li{display:flex;align-items:center;gap:8px;padding:5px 12px;color:#3c5dc4;font-size:12.5px;cursor:pointer}.header-menu li i{width:14px;text-align:center;visibility:visible}.header-menu li:hover{background:#dbe4ff}.header-menu li.checked{font-weight:600}.header-menu li.separator{height:1px;margin:4px 0;padding:0;background:#dbe4ff;cursor:default}.header-menu li .fa-check{visibility:hidden}.header-menu li.checked>.fa-check{visibility:visible}.header-menu li.menu-action.disabled{opacity:.45;cursor:default}.header-menu li.menu-action.disabled:hover{background:none}.header-menu .menu-action-icon{width:14px;height:14px}.header-menu li.has-submenu{position:relative}.header-menu li.has-submenu.open{background:#dbe4ff}.header-menu li.has-submenu .submenu-caret{margin-left:auto}.header-menu .header-submenu{position:absolute;top:-5px;left:100%;width:200px;padding:4px 0;background:#fff;border:1px solid #DBE4FF;border-radius:5px;box-shadow:0 4px 14px #0003;font-weight:400}.header-menu .header-submenu.left{left:auto;right:100%}.header-menu .header-submenu.header-submenu-columns{width:240px;max-height:320px;overflow-y:auto}.header-menu .header-submenu .column-choice input[type=checkbox]{width:14px;margin:0;pointer-events:none}.header-menu .header-submenu .submenu-loading{opacity:.6;cursor:default}.header-menu .header-submenu .view-lock{margin-left:auto;padding-left:8px;opacity:.5;font-size:11px}.header-menu .header-submenu.up{top:auto;bottom:-5px}.header-sort-rank{flex-shrink:0;color:#3c5dc4;font-size:9px}.aggregation-row .agg-label{margin-right:4px;color:#3c5dc4;font-size:10.5px;opacity:.7}.datagrid-custom-container:focus,.datagrid-custom-container:focus-visible{outline:none}.data-grid-datatable td .image ::ng-deep img{display:block}.data-grid-datatable td:has(>.grid-cursor){outline:2px solid #4465C9;outline-offset:-2px}.data-grid-datatable td:has(>.grid-range){background-color:#4465c940!important;box-shadow:inset 0 0 0 1px #4465c980;color:#4d5a81!important}.data-grid-datatable td:has(>.grid-range) ::ng-deep *{color:#4d5a81!important}.data-grid-datatable td:has(.grid-editor){padding:0!important;background-color:#fff}.grid-editor{display:block;height:23px;overflow:visible;color:#4d5a81}.grid-editor ::ng-deep .field-container,.grid-editor ::ng-deep .form-group,.grid-editor ::ng-deep .form-group>div,.grid-editor ::ng-deep .checkbox-container{margin:0!important;padding:0;min-height:0!important;height:23px}.grid-editor ::ng-deep .validation-message,.grid-editor ::ng-deep .checkbox-label{display:none}.grid-editor ::ng-deep input,.grid-editor ::ng-deep input:focus,.grid-editor ::ng-deep textarea{box-sizing:border-box;width:100%;height:23px!important;min-height:0!important;margin:0!important;padding:0 4px;border:1px solid #4465C9;border-radius:0;box-shadow:none;font-size:inherit;line-height:normal;resize:none}.grid-editor ::ng-deep input.ng-invalid.ng-touched,.grid-editor ::ng-deep input.ng-invalid.ng-dirty{border-color:#f78383}.grid-editor ::ng-deep input[type=checkbox]{width:auto}.grid-editor ::ng-deep .ng-select .ng-select-container{color:#4d5a81;min-height:0!important;height:23px!important;border-radius:0;border-color:#4465c9}.grid-editor ::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{top:0}.grid-editor ::ng-deep .ng-select .ng-select-container .ng-value-container{padding-top:0}.grid-editor ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input>input{height:100%!important;border:none}.grid-editor ::ng-deep .form-group>div{flex:1;min-width:0;width:100%}.grid-editor ::ng-deep .ng-select{width:100%}.grid-editor ::ng-deep alg-selector{display:flex;width:100%;height:23px}.grid-editor ::ng-deep .input-select-default,.grid-editor ::ng-deep .input-select-default.with-button{flex:1;min-width:0;padding-right:0;margin-right:0}.grid-editor ::ng-deep .input-group-btn{float:none}.grid-editor ::ng-deep .btn,.grid-editor ::ng-deep .btn-32,.grid-editor ::ng-deep .btn-input-select{height:23px;width:23px;padding:0;line-height:1;border-radius:0}.grid-editor ::ng-deep .input-with-button{display:flex;height:23px}.grid-editor ::ng-deep .switch{margin:2px 0 0 4px;transform:scale(.7);transform-origin:left top}::ng-deep body.dg-column-dragging,::ng-deep body.dg-column-dragging *{cursor:grabbing!important;-webkit-user-select:none!important;user-select:none!important}\n"],
+			template: "<div #datagridContainer [class]=\"this.datagridClass\" tabindex=\"-1\" (keydown)=\"onGridKeyDown($event)\" (scroll)=\"onGridScroll($event)\"\r\n    (copy)=\"onCopy($event)\" (paste)=\"onPaste($event)\" (contextmenu)=\"openEmptyAreaContextMenu($event)\">\r\n    <ng-container>\r\n        <table class=\"data-grid-datatable\">\r\n            <ng-container *ngIf=\"this.facade.style as ctx\">\r\n                <ng-container *ngIf=\"this.facade.config.columns$ | async as rcolumns\">\r\n                    <thead>\r\n                        <tr>\r\n                            <th class=\"header row-state\" (click)=\"addFilterQuery()\"></th>\r\n                            <!-- En-tête : poignée de déplacement à gauche, intitulé, indicateur de tri,\r\n                                 flèche du menu (tri, agrégation) à droite. Le clic ne trie plus. -->\r\n                            <th #thHeader *ngFor=\"let col of rcolumns;let i = index\"\r\n                                    [attr.id]=\"guid.toString() + '-col-' + col.Property\"\r\n                                    [attr.class]=\"'header' | gridStyle : ctx : { column : col }\"\r\n                                    [style.width.px]=\"colWidth(col)\" [style.min-width.px]=\"colWidth(col)\" [style.max-width.px]=\"colWidth(col)\"\r\n                                    [attr.data-frozen]=\"isFrozen(i) ? '' : null\" [style.left.px]=\"frozenLeft(i)\">\r\n                                <div class=\"header-cell\"\r\n                                    [class.col-dragging]=\"draggedColumn === col.Property\">\r\n                                    <span class=\"header-handle\" title=\"Déplacer la colonne\"\r\n                                        (mousedown)=\"onHeaderMouseDown(col, $event)\">\r\n                                        <i class=\"fa fa-ellipsis-v\"></i>\r\n                                    </span>\r\n                                    <label>{{ getHeaderLabel(col) }}</label>\r\n                                    <i *ngIf=\"this.facade.filter.isAsc(col.Property)\" class=\"fa fa-long-arrow-up header-sort\" title=\"Tri croissant\"></i>\r\n                                    <i *ngIf=\"this.facade.filter.isDesc(col.Property)\" class=\"fa fa-long-arrow-down header-sort\" title=\"Tri décroissant\"></i>\r\n                                    <sup *ngIf=\"this.facade.filter.sortRank(col.Property) > 0\" class=\"header-sort-rank\"\r\n                                        title=\"Rang dans le tri personnalisé\">{{ this.facade.filter.sortRank(col.Property) }}</sup>\r\n                                    <i *ngIf=\"activeAggregations[col.Property]\" class=\"header-agg\" [title]=\"'Agrégation : ' + aggregationLabel(activeAggregations[col.Property])\">Σ</i>\r\n                                    <!-- Dernière colonne suivie de la colonne vide de fin : sa flèche est dans la colonne vide. -->\r\n                                    <button type=\"button\" class=\"header-menu-button\" title=\"Trier, agréger\"\r\n                                        *ngIf=\"!(ctx.enableLastColumnResize && i === rcolumns.length - 1)\"\r\n                                        [class.open]=\"headerMenu?.column.Property === col.Property\"\r\n                                        (click)=\"toggleHeaderMenu(col, $event)\">\r\n                                        <i class=\"fa fa-caret-down\"></i>\r\n                                    </button>\r\n                                </div>\r\n                                <!-- Bord droit : largeur de la colonne (tirer), ajustée au contenu (double clic). -->\r\n                                <span class=\"col-resizer\" title=\"Largeur de la colonne (double clic : ajuster au contenu)\"\r\n                                    (mousedown)=\"startResize(col, $event)\" (dblclick)=\"autoFitColumn(col, $event)\"\r\n                                    (click)=\"$event.stopPropagation()\"></span>\r\n                            </th>\r\n                            <th *ngIf=\"ctx.enableLastColumnResize\" #lastColumnHeader class=\"header last-column\"\r\n                                (contextmenu)=\"openHeaderContextMenu($event, rcolumns[rcolumns.length - 1])\">\r\n                                <div class=\"header-cell header-cell-end\" *ngIf=\"rcolumns.length > 0\">\r\n                                    <button type=\"button\" class=\"header-menu-button\" title=\"Trier, agréger\"\r\n                                        [class.open]=\"headerMenu?.column.Property === rcolumns[rcolumns.length - 1].Property\"\r\n                                        (click)=\"toggleHeaderMenu(rcolumns[rcolumns.length - 1], $event)\">\r\n                                        <i class=\"fa fa-caret-down\"></i>\r\n                                    </button>\r\n                                </div>\r\n                            </th>\r\n\r\n                        </tr>\r\n                        <ng-container *ngIf=\"this.facade.filter.additionalQuery$ | async as additionalQuery\">\r\n                            <tr #thFilterRows *ngFor=\"let filterRow of additionalQuery.Rows;let i = index\" >\r\n                                <th class=\"filter-header row-state\" (click)=\"removeFilterQuery(i)\"></th>\r\n                                <th class=\"filter-header\" [ngClass]=\"{disabled: !col.IsFilterEnabled}\" *ngFor=\"let col of rcolumns;let i = index\"\r\n                                    [attr.id]=\"guid.toString() + '-filter-' + i\">\r\n                                    <input *ngIf=\"col.IsFilterEnabled\" type=\"text\"\r\n                                        class=\"filter-header-input\"\r\n                                        name=\"keyword\"\r\n                                        #uniquename=\"ngModel\"\r\n                                        [attr.id]=\"guid.toString() + '-filter-input-' + col.Property\"\r\n                                        [placeholder]=\"filterRow.ClausesByPropertyName.get(col.Property).FilterValues?.length ? 'Filtre avancé : ' + filterRow.ClausesByPropertyName.get(col.Property).FilterValues.length + ' valeur(s)' : ''\"\r\n                                        [(ngModel)]=\"filterRow.ClausesByPropertyName.get(col.Property).FilterValue\"\r\n                                        (ngModelChange)=\"handleFilterChanged($event, filterRow, col.Property)\"\r\n                                        (change)=\"validateFilterChanged($event, filterRow, col.Property)\"\r\n                                    />\r\n                                </th>\r\n                                <ng-container>\r\n                                    <th #lastColumnFilter class=\"filter-header last-column\"></th>\r\n                                </ng-container>\r\n                            </tr>\r\n                        </ng-container>\r\n                    </thead>\r\n\r\n                    <tbody>\r\n                        <ng-container *ngIf=\"this.facade.data\">\r\n                            <ng-container *ngFor=\"let row of this.data.Values; let r = index;\">\r\n                            <tr\r\n                                [class]=\"'alternating' | gridStyle : ctx : { row : row, index : r, maxIndex : this.data.Values.length, hasAggregates: hasAggregates  }\"\r\n                                [class.selected]=\"isRowSelected(row)\"\r\n                                [attr.id]=\"guid.toString() + '-row-' + row.Id\"\r\n                                (mousedown)=\"onRowMouseDown(row, $event)\"\r\n                                (mouseup)=\"onRowMouseUp(row, $event)\"\r\n                                (click)=\"onRowClick(row, $event)\"\r\n\r\n                                [rowRef]=\"guid + '-row-' + row.Id\"\r\n                            >\r\n\r\n                            <th [attr.class]=\"'rowstate' | gridStyle : ctx : { row : row }\">\r\n                                <ng-container *ngIf=\"selectionStyler.isModified(row) && !selectionStyler.isInvalid(row) && !selectionStyler.isWarning(row)\">\r\n                                    <div class=\"new-rowstate\"><span>...</span></div>\r\n                                </ng-container>\r\n\r\n                                <ng-container *ngIf=\"selectionStyler.isInvalid(row)\">\r\n                                    <div> <img class=\"error-row-icon\" src=\"assets/images/error.svg\" /> </div>\r\n                                </ng-container>\r\n\r\n                                <ng-container *ngIf=\"selectionStyler.isWarning(row) && !selectionStyler.isInvalid(row)\">\r\n                                    <div> <img class=\"error-row-icon\" src=\"assets/images/warning.svg\" /> </div>\r\n                                </ng-container>\r\n\r\n                                <ng-container *ngIf=\"ctx.displayDetail\">\r\n                                    <button type=\"button\" [attr.id]=\"row.Id + '_button'\" class=\"toggle-button btn\" (click)=\"toggleDetail(row)\">\r\n                                        <i class=\"fa fa-chevron-right fa-custom\"></i>\r\n                                    </button>\r\n                                </ng-container>\r\n                            </th>\r\n\r\n                            <td *ngFor=\"let column of rcolumns; index as i\"\r\n                                [attr.id]=\"cellId(row, column)\"\r\n                                [style.max-width.px]=\"colWidth(column)\" [attr.data-sized]=\"colWidth(column) ? '' : null\"\r\n                                [attr.data-frozen]=\"isFrozen(i) ? '' : null\" [style.left.px]=\"frozenLeft(i)\"\r\n                                [class]=\"'cell' | gridStyle : ctx : { row : row,column : column,index : r }\"\r\n                                [class.selected]=\"isRowSelected(row)\"\r\n                                (mousedown)=\"onCellMouseDown(r, i, $event)\"\r\n                                (mouseenter)=\"onCellMouseEnter(r, i, $event)\"\r\n                                (click)=\"onCellClick(row, column)\"\r\n                                (dblclick)=\"onCellDblClick(row, column)\">\r\n\r\n                                <alg-datagrid-cell #dataGridCellComponent\r\n                                    class=\"gridcell-container\"\r\n                                    [entity]=\"row\"\r\n                                    [isEditable]=\"canEditCell(row, column)\"\r\n                                    [property]=\"column.Property\"\r\n                                    [managed]=\"true\"\r\n                                    [mode]=\"showEditor(row, column) ? 'edit' : 'view'\"\r\n                                    [class.grid-cursor]=\"isCursorCell(row, column)\"\r\n                                    [class.grid-range]=\"isInRange(r, i)\"\r\n                                    (contextmenu)=\"openContextMenu($event, row, column)\">\r\n\r\n                                    <ng-template alg-editMode>\r\n                                        <!-- Éditeur du champ du formulaire qui correspond à la colonne (sinon déduit de la colonne), à la hauteur de la ligne. -->\r\n                                        <alg-field class=\"grid-editor\"\r\n                                            [field]=\"getEditField(column)\"\r\n                                            [form]=\"getRowForm(row)\"\r\n                                            [showLabel]=\"false\"\r\n                                            (propertyChanged)=\"onCellChanged(row, $event)\"\r\n                                            >\r\n                                            <!-- [focusable]=\"cellFocus\" -->\r\n                                        </alg-field>\r\n                                    </ng-template>\r\n                                    <ng-template alg-viewMode>\r\n\r\n                                        <div [ngSwitch]=\"column.Display?.type\" *ngIf=\"!isUndefined(row[column.Property])\">\r\n                                            <div *ngSwitchCase=\"'url'\">\r\n                                                <a [routerLink]=\"[$safeNavigationMigration(column.Display?.baseUrl),row[column.Property]]\">\r\n                                                    {{ row.Id || row[column.Property] }}\r\n                                                </a>\r\n                                            </div>\r\n\r\n                                            <div *ngSwitchCase=\"'img'\" class=\"image\">\r\n                                                <img *ngIf=\"column.Display?.imagePath?.length == 0\"\r\n                                                    [src]=\"(column.Display?.imgBase || '') + (column.Display?.sourceProperty ? row[column.Display?.sourceProperty] : row[column.Property])\" />\r\n\r\n                                                <alg-image *ngIf=\"column.Display?.imagePath?.length != 0\"\r\n                                                    [imageUrl]=\"this.getEnumImageUrl(row,column)\" [imageHeight]=\"20\" [imageWidth]=\"20\">\r\n                                                </alg-image>\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"!isUndefined(column.ToolTipProperty)\">\r\n                                                    {{ row[column.ToolTipProperty] }}\r\n                                                </div>\r\n                                            </div>\r\n\r\n                                            <div *ngSwitchCase=\"'img-file'\" class=\"image\">\r\n\r\n                                                <alg-image\r\n                                                    [imageUrl]=\"this.getImageUrl(row,column)\" [wide]=\"true\" [imageHeight]=\"40\" [imageWidth]=\"40\">\r\n                                                </alg-image>\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"!isUndefined(column.ToolTipProperty)\">\r\n                                                    {{ row[column.ToolTipProperty] }}\r\n                                                </div>\r\n                                            </div>\r\n\r\n                                            <div *ngSwitchCase=\"'wide-img'\" class=\"image\">\r\n                                                <img *ngIf=\"column.Display?.imagePath?.length == 0\"\r\n                                                    [src]=\"(column.Display?.imgBase || '') + (column.Display?.sourceProperty ? row[column.Display?.sourceProperty] : row[column.Property])\" />\r\n\r\n                                                <alg-image *ngIf=\"column.Display?.imagePath?.length != 0\" [wide]=\"true\"\r\n                                                    [imageUrl]=\"this.getEnumImageUrl(row,column)\" [imageHeight]=\"40\" [imageWidth]=\"40\">\r\n                                                </alg-image>\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"!isUndefined(column.ToolTipProperty)\">\r\n                                                    {{ row[column.ToolTipProperty] }}\r\n                                                </div>\r\n                                            </div>\r\n\r\n                                            <span *ngSwitchCase=\"'date'\">\r\n                                                {{row[column.Property]| date: column.Display?.format || 'dd/MM/yyyy'}}\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'boolean'\">{{row[column.Property] ? 'OUI' : 'NON'}} </span>\r\n\r\n                                            <span *ngSwitchCase=\"'datetime'\">{{row[column.Property] | date: column.Display?.format || 'dd/MM/yyyy HH:mm:ss'}}</span>\r\n\r\n                                            <span *ngSwitchCase=\"'money'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\"\r\n                                                class=\"money\">\r\n                                                {{\r\n                                                    row[column.Property]\r\n                                                    | currency: column.Display?.currency\r\n                                                    || (column.Display?.sourceProperty && row[column.Display?.sourceProperty] ? row[column.Display?.sourceProperty] : false)\r\n                                                    || 'EUR' : 'symbol'\r\n\r\n                                                    | todefine: $safeNavigationMigration(column.Display?.handleError)\r\n                                                }}\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"ctx.showOnToolTip(row,column)\">\r\n                                                    {{ctx.showOnToolTip(row,column)}}\r\n                                                </div>\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'percent'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\">\r\n                                                {{row[column.Property] * $safeNavigationMigration(column.Display?.multiplier) | percent : column.Display?.format\r\n                                                || '1.0-2' | todefine: $safeNavigationMigration(column.Display?.handleError)}}\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'number'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\">\r\n                                                {{row[column.Property] * $safeNavigationMigration(column.Display?.multiplier) | number: column.Display?.format\r\n                                                || '1.0-3' | todefine : $safeNavigationMigration(column.Display?.handleError)}}\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'fixedsizeinteger'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\">\r\n                                                {{row[column.Property] | tofixedsizeinteger : $safeNavigationMigration(column.Display?.completingCaracter) : $safeNavigationMigration(column.Display?.width) }}\r\n                                            </span>\r\n                                            <span *ngSwitchDefault [innerText]=\"column.Property == 'Id' ? (row[column.Property] < 0 ? '' : row[column.Property]) : row[column.Property]\">\r\n                                            </span>\r\n                                        </div>\r\n\r\n                                        <div *ngIf=\"isUndefined(row[column.Property])\">\r\n                                            <span *ngIf=\"!isUndefined($safeNavigationMigration(column.Display?.nullCaseText))\" class=\"mw-invalid\">\r\n                                                {{ column.Display?.nullCaseText }}\r\n                                            </span>\r\n\r\n                                            <span *ngIf=\"isUndefined($safeNavigationMigration(column.Display?.nullCaseText))\">\r\n                                                &nbsp;&nbsp;&nbsp;\r\n                                            </span>\r\n                                        </div>\r\n\r\n                                    </ng-template>\r\n\r\n                                </alg-datagrid-cell>\r\n                            </td>\r\n                            <ng-container *ngIf=\"ctx.enableLastColumnResize\">\r\n                                <!-- Colonne vide de fin : clic droit = menu de la dernière colonne. -->\r\n                                <td (contextmenu)=\"openContextMenu($event, row, rcolumns[rcolumns.length - 1])\"></td>\r\n                            </ng-container>\r\n                            </tr>\r\n                            </ng-container>\r\n                        </ng-container>\r\n                    </tbody>\r\n\r\n                    <tfoot>\r\n                        <tr class=\"empty-row\" *ngIf=\"hasAggregates\">\r\n                             <td></td>\r\n                        </tr>\r\n                        <tr class=\"aggregation-row\" *ngIf=\"hasAggregates\">\r\n                            <td class=\"row-state\"></td>\r\n                            <td *ngFor=\"let column of rcolumns; index as i\" [attr.class]=\"'cell' | gridStyle : ctx : { column : column, index : i }\"\r\n                                [attr.data-frozen]=\"isFrozen(i) ? '' : null\" [style.left.px]=\"frozenLeft(i)\">\r\n\r\n                                <ng-container *ngFor=\"let agg of columnAggregates[column.Property]\">\r\n\r\n                                    <span class=\"agg-label\">{{ aggregationLabel(agg.op) }}</span>\r\n                                    <span [ngSwitch]=\"agg.op === 'COUNT' ? 'count' : column.Display?.type\">\r\n\r\n                                        <span *ngSwitchCase=\"'count'\">{{ agg.value | number: '1.0-0' }}</span>\r\n                                        <span *ngSwitchCase=\"'percent'\">{{ agg.value | number: column.Display?.format || '1.0-3' }}</span>\r\n                                        <span *ngSwitchCase=\"'fixedsizeinteger'\">{{ agg.value | number: column.Display?.format || '1.0-3' }}</span>\r\n\r\n                                        <span *ngSwitchCase=\"'money'\" class=\"money\">\r\n                                            {{ agg.value | currency: getColCurrency(column) }}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchCase=\"'date'\">\r\n                                            {{agg.value | date: column.Display?.format || 'dd/MM/yyyy'}}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchCase=\"'datetime'\">\r\n                                            {{agg.value | date: column.Display?.format || 'dd/MM/yyyy HH:mm:ss'}}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchCase=\"'number'\">\r\n                                            {{agg.value | number: column.Display?.format || '1.0-3'}}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchDefault>\r\n                                            {{agg.value}}\r\n                                        </span>\r\n\r\n                                    </span>\r\n\r\n                                </ng-container>\r\n\r\n                            </td>\r\n\r\n                            <ng-container *ngIf=\"ctx.enableLastColumnResize\">\r\n                                <td class=\"last-column\"></td>\r\n                            </ng-container>\r\n\r\n                        </tr>\r\n                    </tfoot>\r\n                </ng-container>\r\n            </ng-container>\r\n        </table>\r\n    </ng-container>\r\n</div>\r\n\r\n\r\n<!-- Emplacement visé par une colonne déplacée : trait orange sur la séparation des deux en-têtes. -->\r\n<div class=\"col-drop-indicator\" *ngIf=\"dropIndicator\"\r\n    [ngStyle]=\"{ left: dropIndicator.left + 'px', top: dropIndicator.top + 'px', height: dropIndicator.height + 'px' }\"></div>\r\n\r\n<!-- Menu d'une colonne (flèche de l'en-tête ou clic droit sur une cellule), en trois zones séparées\r\n     par un trait : Tri (sous-menu « Trier »), Actions (celles du panneau des actions), Fonctions (sous-menu « Fonctions »). -->\r\n<div class=\"header-menu\" *ngIf=\"headerMenu\"\r\n    [ngStyle]=\"{ top: headerMenu.y + 'px', left: headerMenu.x + 'px', visibility: headerMenu.ready ? 'visible' : 'hidden' }\"\r\n    (click)=\"$event.stopPropagation()\" (contextmenu)=\"$event.preventDefault()\">\r\n    <ul>\r\n        <!-- Tri : sous-menu « Trier » (croissant, décroissant, personnalisé). -->\r\n        <li class=\"has-submenu\" [class.open]=\"headerMenu.submenu === 'sort'\"\r\n            [class.checked]=\"this.facade.filter.isAsc(headerMenu.column.Property) || this.facade.filter.isDesc(headerMenu.column.Property) || this.facade.filter.getSortList().length > 1\"\r\n            (mouseenter)=\"setSubmenu('sort')\" (click)=\"setSubmenu('sort')\">\r\n            <i class=\"fa fa-sort\"></i><span>Trier</span><i class=\"fa fa-caret-right submenu-caret\"></i>\r\n\r\n            <ul class=\"header-submenu\" *ngIf=\"headerMenu.submenu === 'sort'\"\r\n                [class.left]=\"headerMenu.submenuLeft\" [class.up]=\"headerMenu.submenuUp\"\r\n                (click)=\"$event.stopPropagation()\">\r\n                <li [class.checked]=\"this.facade.filter.isAsc(headerMenu.column.Property)\" (click)=\"sortColumn('asc')\">\r\n                    <i class=\"fa fa-sort-amount-asc\"></i><span>Par ordre croissant</span>\r\n                </li>\r\n                <li [class.checked]=\"this.facade.filter.isDesc(headerMenu.column.Property)\" (click)=\"sortColumn('desc')\">\r\n                    <i class=\"fa fa-sort-amount-desc\"></i><span>Par ordre décroissant</span>\r\n                </li>\r\n                <li [class.checked]=\"this.facade.filter.getSortList().length > 1\" (click)=\"openCustomSort()\">\r\n                    <i class=\"fa fa-sort\"></i><span>Tri personnalisé…</span>\r\n                </li>\r\n            </ul>\r\n        </li>\r\n        <!-- Filtre sur la valeur de la cellule (clic droit sur une cellule) : première ligne des filtres composés. -->\r\n        <li *ngIf=\"cellFilterValue() !== undefined\" (click)=\"filterOnCell()\" (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-filter\"></i><span>Filtrer sur « {{ cellFilterLabel() }} »</span>\r\n        </li>\r\n        <!-- Filtre avancé : valeurs distinctes de la colonne sur les résultats, à cocher (condition « dans la liste »). -->\r\n        <li *ngIf=\"headerMenu.column.IsFilterEnabled\" class=\"has-submenu\" [class.open]=\"headerMenu.submenu === 'distinct'\"\r\n            [class.checked]=\"this.facade.filter.getFilterValues(headerMenu.column.Property).length > 0\"\r\n            (mouseenter)=\"setSubmenu('distinct')\" (click)=\"setSubmenu('distinct')\">\r\n            <i class=\"fa fa-filter\"></i><span>Filtre avancé</span><i class=\"fa fa-caret-right submenu-caret\"></i>\r\n\r\n            <ul class=\"header-submenu header-submenu-distinct\" *ngIf=\"headerMenu.submenu === 'distinct'\"\r\n                [class.left]=\"headerMenu.submenuLeft\" [class.up]=\"headerMenu.submenuUp\"\r\n                (click)=\"$event.stopPropagation()\">\r\n                <alg-grid-distinct-filter [facade]=\"this.facade\" [entityKey]=\"this.entityKey\" [property]=\"headerMenu.column.Property\"\r\n                    (done)=\"closeViewMenu()\" (loaded)=\"onViewMenuLoaded()\"></alg-grid-distinct-filter>\r\n            </ul>\r\n        </li>\r\n        <!-- Affichage : vues personnalisées (cochée = affichée), puis « Modifier… ». -->\r\n        <li *ngIf=\"this.facade.config.viewChooser\" class=\"has-submenu\" [class.open]=\"headerMenu.submenu === 'columns'\"\r\n            (mouseenter)=\"setSubmenu('columns')\" (click)=\"setSubmenu('columns')\">\r\n            <i class=\"fa fa-columns\"></i><span>Affichage</span><i class=\"fa fa-caret-right submenu-caret\"></i>\r\n\r\n            <ul class=\"header-submenu header-submenu-columns\" *ngIf=\"headerMenu.submenu === 'columns'\"\r\n                [class.left]=\"headerMenu.submenuLeft\" [class.up]=\"headerMenu.submenuUp\"\r\n                (click)=\"$event.stopPropagation()\">\r\n                <alg-grid-view-menu [chooser]=\"this.facade.config.viewChooser\" (done)=\"closeViewMenu()\" (loaded)=\"onViewMenuLoaded()\"></alg-grid-view-menu>\r\n            </ul>\r\n        </li>\r\n        <!-- Colonnes figées à gauche, de la première jusqu'à celle-ci. -->\r\n        <li [class.checked]=\"isFrozen(columnIndex(headerMenu.column))\" (click)=\"toggleFrozen()\" (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-thumb-tack\"></i>\r\n            <span>{{ frozenUntil === columnIndex(headerMenu.column) ? 'Libérer les colonnes' : 'Figer jusqu\\'à cette colonne' }}</span>\r\n        </li>\r\n        <li *ngIf=\"frozenUntil !== undefined && frozenUntil !== columnIndex(headerMenu.column)\"\r\n            (click)=\"unfreezeColumns()\" (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-unlock\"></i><span>Libérer les colonnes</span>\r\n        </li>\r\n\r\n        <!-- Actions -->\r\n        <ng-container *ngIf=\"visibleActions.length > 0\">\r\n            <li class=\"separator\"></li>\r\n            <ng-container *ngFor=\"let action of visibleActions\">\r\n                <ng-container *ngIf=\"{ disabled: (action.disabled$ | async) } as state\">\r\n                    <li class=\"menu-action\" [class.disabled]=\"state.disabled\"\r\n                        (click)=\"executeMenuAction(action, state.disabled)\" (mouseenter)=\"setSubmenu(undefined)\">\r\n                        <img class=\"menu-action-icon\" [src]=\"getActionImageUrl(action.icon)\" [alt]=\"action.title\" />\r\n                        <span>{{ action.title }}</span>\r\n                    </li>\r\n                </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n\r\n        <!-- Affichage -->\r\n        <li class=\"separator\"></li>\r\n        <li class=\"has-submenu\" [class.open]=\"headerMenu.submenu === 'display'\"\r\n            (mouseenter)=\"setSubmenu('display')\" (click)=\"setSubmenu('display')\">\r\n            <i class=\"fa fa-calculator\"></i><span>Fonctions</span><i class=\"fa fa-caret-right submenu-caret\"></i>\r\n\r\n            <ul class=\"header-submenu\" *ngIf=\"headerMenu.submenu === 'display'\"\r\n                [class.left]=\"headerMenu.submenuLeft\" [class.up]=\"headerMenu.submenuUp\"\r\n                (click)=\"$event.stopPropagation()\">\r\n                <li *ngFor=\"let op of getAggregationOptions(headerMenu.column)\"\r\n                    [class.checked]=\"activeAggregations[headerMenu.column.Property] === op\"\r\n                    (click)=\"aggregateColumn(op)\">\r\n                    <i class=\"fa fa-check\"></i><span>{{ aggregationLabel(op) }}</span>\r\n                </li>\r\n                <ng-container *ngIf=\"activeAggregations[headerMenu.column.Property]\">\r\n                    <li class=\"separator\"></li>\r\n                    <li (click)=\"aggregateColumn(null)\">\r\n                        <i class=\"fa fa-times\"></i><span>Ne plus afficher</span>\r\n                    </li>\r\n                </ng-container>\r\n            </ul>\r\n        </li>\r\n    </ul>\r\n</div>\r\n\r\n",
+			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}:host{flex:1}.header.last-column{border-left:none!important;width:100%}table thead .sorting,table thead .sorting_asc,table thead .sorting_desc,table thead .sorting_asc_disabled,table thead .sorting_desc_disabled{background-repeat:no-repeat;background-position:center right}table thead th:first-child,table tfoot tr:first-child{position:sticky;left:0;z-index:2}table tbody th:first-child{position:sticky;left:0;z-index:1;border-right:none}table tbody th:first-child div{text-align:center;vertical-align:middle;line-height:20px}table tbody tr.row-odd th:first-child{background:#ebf0ff}table tbody tr.selected.row-odd.mw-invalid th:first-child,table tbody tr.selected.row-even.mw-invalid th:first-child,table tbody tr.selected.row-odd.mw-warning th:first-child,table tbody tr.selected.row-even.mw-warning th:first-child,table tbody tr.selected.row-even th:first-child,table tbody tr.selected.row-odd th:first-child{background-color:#8ea7f8;color:#fff}table tbody tr.row-odd.mw-invalid th:first-child,table tbody tr.row-even.mw-invalid th:first-child{background-color:#f2dede}table tbody tr.row-odd.mw-warning th:first-child,table tbody tr.row-even.mw-warning th:first-child{background-color:#fff4de}table thead th{position:-webkit-sticky;position:sticky;top:0;z-index:1;background:#fff;border-left:1px solid #3C5DC4;border-bottom:1px solid #3C5DC4}table thead .sorting{background-image:none;cursor:pointer}table thead .sorting_asc{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowMTgwMTE3NDA3MjA2ODExQjM4MkY2QzVGRUYwRTJDNCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo4MkFEQzYxNjIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4MkFEQzYxNTIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjAyODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAxODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+z5ABTAAAAI5JREFUeNpi/P//PwO1ABMDFQELIQXVjfe4gFQbEJe11iv9otRl2UCcBcSphBQy4gszoKu0gNROIJYB4jtA7AF03V2SXQY0iBFIFUMNAgEVIM6DipPsTQcgDkQTSwRia5IMA9rOC6RqgVgQTQokXgOUZyfFZSFQF/zAgh2BOIjkCBjQRDtq2Khh9DAMIMAAT9AmNBDSXegAAAAASUVORK5CYII=);cursor:pointer}table thead .sorting_desc{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowMTgwMTE3NDA3MjA2ODExQjM4MkY2QzVGRUYwRTJDNCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo4MkFEQzYxQTIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4MkFEQzYxOTIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjAyODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAxODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+1fsfwAAAAJdJREFUeNpi/P//PwO1ABMDFcGoYaOG0cMwFmyC1Y33IoHUAiD+h8MBGa31SvOJddk6IN4PxBxY8FEgXkO0N4G2/gRSLUD8GU3qPRA3A+U/kxpmIBege2U9EB/ApYERX6kBDDtlILUDiFWA+AkQuwNddY2s2ARqvAukJgDxbyCehM8gnLGJBmYDsSoQTyWkkHHQFo4AAQYAAA0piq4hbqwAAAAASUVORK5CYII=);cursor:pointer}table thead .sorting_asc_disabled,table thead .sorting_desc_disabled{background-image:none}.checkbok-container{align-items:center;margin:0;padding:0}.gridcell-container{padding:0;min-width:fit-content}.gridcell-container input[type=number]{display:block;size:1;font-size:10pt;width:100%!important;height:100%;margin:0!important;border:2px solid #F78383}.datagrid-custom-container{height:100%;overflow:auto;margin-left:-1px}.data-grid-datatable{table-layout:fixed;cursor:pointer;border-spacing:0px}.data-grid-datatable td{box-shadow:none;padding:2px 5px;white-space:nowrap}.data-grid-datatable td.row-state{padding:2px 5px;width:16px}.data-grid-datatable td.img{padding:2px 5px}.data-grid-datatable td.row-state img{height:16px;width:16px;margin-top:-3px;padding:0}.data-grid-datatable tr{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.header{vertical-align:bottom;padding:2px 5px 2px 0;font-weight:400;color:#3c5dc4;white-space:nowrap;line-height:25px;min-width:32px;margin-bottom:5px}.header.img{min-width:16px}.header.row-state{min-width:27px;position:-webkit-sticky;position:sticky;top:0;left:0;z-index:2;background:#fff;border-left:none;border-right:none}.filter-header{background-color:#f7f7f7!important}.filter-header.disabled{background-color:#9fa9c7!important}.filter-header.row-state:hover:before{position:relative;display:block;float:left;width:16px;height:16px;content:\" \";background-size:16px 16px;-webkit-background-size:16px 16px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"57\" height=\"57\" viewBox=\"0 0 57 57\">%0D%0A  <path id=\"Rond_Croix\" data-name=\"Rond Croix\" d=\"M28.5,57A28.5,28.5,0,0,1,8.347,8.347,28.5,28.5,0,1,1,48.652,48.652,28.317,28.317,0,0,1,28.5,57Zm0-24.036h0l11.9,11.9L44.869,40.4,32.964,28.5,44.869,16.593,40.4,12.129,28.5,24.034,16.594,12.129l-4.465,4.464L24.034,28.5,12.129,40.4l4.463,4.465L28.5,32.965Z\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 0 0 3px;filter:brightness(0) saturate(100%) invert(70%) sepia(93%) saturate(1540%) hue-rotate(309deg) brightness(105%) contrast(94%)}.filter-header-input{height:calc(100% - 2px);width:calc(100% - 2px);margin:0;border:none!important;background-color:#f7f7f7;padding:0 0 0 5px;color:#4d5a81}.header.row-state:before{position:relative;display:block;float:left;width:16px;height:16px;content:\" \";background-size:16px 16px;-webkit-background-size:16px 16px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->%0D%0A<path fill=\"currentColor\" d=\"M3.9 54.9C10.5 40.9 24.5 32 40 32l432 0c15.5 0 29.5 8.9 36.1 22.9s4.6 30.5-5.2 42.5L320 320.9 320 448c0 12.1-6.8 23.2-17.7 28.6s-23.8 4.3-33.5-3l-64-48c-8.1-6-12.8-15.5-12.8-25.6l0-79.1L9 97.3C-.7 85.4-2.8 68.8 3.9 54.9z\"/></svg>');background-repeat:no-repeat;margin:0 0 3px 5px;filter:brightness(0) saturate(100%) invert(56%) sepia(79%) saturate(2301%) hue-rotate(202deg) brightness(92%) contrast(91%)}.filter-header.last-column{border-left:none!important}.header label{cursor:pointer;margin-bottom:0;margin-right:10px;padding-left:5px;width:100%}.row-odd{background-color:#ebf0ff;border-left:1px solid #C1D0FD;border-bottom:1px solid #C1D0FD}.row-even{background-color:#f7faff;border-left:1px solid #C1D0FD;border-bottom:1px solid #C1D0FD}.error-row-icon{padding:2px;width:20px}.selected{background-color:#8ea7f8;color:#fff}.mw-invalid{font-weight:600;background-color:#f2dede;border:1px solid var(--red-error)}.mw-invalid td{background-color:#f2dede!important}.data-grid-datatable tbody tr.mw-invalid>td,.data-grid-datatable tbody tr.mw-invalid>th{box-shadow:inset 0 1px 0 var(--red-error),inset 0 -1px 0 var(--red-error)}span.mw-invalid{padding:0 3px;color:var(--red-error);background-color:transparent}.mw-warning.selected,.mw-invalid.selected{background-color:#8ea7f8}.mw-warning.selected td,.mw-invalid.selected td{background-color:#8ea7f8!important}.mw-warning{font-weight:600;background-color:#fff4de;border:1px solid var(--orange-algorima)}.mw-warning td{background-color:#fff4de!important}.mw-modified{font-weight:600;border:1px solid var(--main-bg-color)}.first-row{border-top:none}.last-row,.last-row td{border-bottom:none!important}.data-grid-datatable>tbody>tr{z-index:50}.image{position:relative;display:flex;flex-direction:row}.image img{height:20px;width:auto}td.money{position:relative}.tool-tip{visibility:hidden;background-color:#424242;color:#fff;text-align:left;border-radius:3px;font-size:15px;position:absolute;z-index:1;top:-10%;left:150%;opacity:0;transition:opacity .3s;padding:5px 15px;white-space:nowrap;overflow:visible}.tool-tip:after{content:\" \";position:absolute;top:50%;right:100%;margin-top:-5px;border-width:5px;border-style:solid;border-color:transparent rgb(66,66,66) transparent transparent}.image:hover .tool-tip{visibility:visible;opacity:1}td.money:hover .tool-tip{visibility:visible;opacity:1;left:100%;height:28px;font-size:13px;margin-top:0;padding:5px 10px 10px}.disabled{pointer-events:none}.edit-mode{background-color:#fff;border:1px solid #4465C9;min-width:90px!important;height:30px!important}.edit-mode .form-group{min-height:0px}.edit-mode .inactivated{background-color:#dbe4ff80}.edit-mode .inactivated-fo{background-color:#dbe4ff}.edit-mode .ecartclass{border:2px solid #4465C9}.edit-mode .error-cell{font-weight:700;color:#f78383!important}.edit-mode .selected{color:#4d5a81}.highlight-1,.highlight-1.selected,.edit-mode.highlight-1.selected{background-color:#4d5a81!important;color:#fff!important}.highlight-2,.highlight-2.selected,.edit-mode.highlight-2.selected{background-color:#dbe4ff!important;color:#4d5a81!important}.highlight-3,.highlight-3.selected,.edit-mode.highlight-3.selected{background-color:#4465c9!important;color:#fff!important}.highlight-4,.highlight-4.selected,.edit-mode.highlight-4.selected{background-color:#f78383!important;color:#fff!important}.highlight-5,.highlight-5.selected{background-color:#4465c9!important;color:#fff}.fixed-column{position:-webkit-sticky;position:sticky;left:27px;z-index:2!important;border-left:none}.fixed-header{position:-webkit-sticky;position:sticky;left:27px;z-index:3!important;background:#fff}.has-focus{padding:0!important}.has-focus ::ng-deep input,.has-focus ::ng-deep input:focus-visible,.has-focus ::ng-deep input:focus{border-radius:.1;outline:none!important;width:100%;height:29px;min-height:0;margin:0;border:1px solid #4465C9}.has-focus ::ng-deep .form-group{margin-bottom:0;min-height:0}.has-focus ::ng-deep .field-container{margin-bottom:0}.edit-mode.has-focus{width:90px!important}.bordered{border-left:1px solid #14358f!important;border-right:1px solid #14358f!important}.match-keywords{color:var(--main-bg-color);font-weight:700}.datagrid-img img{height:20px;width:20px}.right-align{text-align:right}.left-align{text-align:left}.detail-div{height:0px;overflow:hidden;transition:all .2s linear;width:100%}.fa-custom{font-size:smaller}.detail-div-show{height:150px;transition:all .2s linear}.toggleable{visibility:collapse}.toggleable-show{visibility:visible}.toggle-button-down{transform:rotate(90deg);transition:all .2s linear}.no-result{color:#5272d3;height:100%;width:100%;padding:15px 15px 150px}.new-rowstate{display:flex;flex-direction:row;align-items:center;align-self:center;height:100%;width:100%}.new-rowstate span{height:100%;width:100%;margin-top:-6px}.context-menu{position:absolute;background:#ffffff26;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);box-shadow:0 4px 12px #0000004d;padding:8px;z-index:1000;min-width:75px;max-width:250px;transition:all .3s ease-in-out}.context-menu ul{list-style:none;margin:0;padding:0}.context-menu li{padding:10px 14px;cursor:pointer;border-radius:8px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}.context-menu li:hover{background:linear-gradient(135deg,#ffffff4d,#ffffff1a);transform:scale(1.02)}.context-menu li:active{transform:scale(.98)}.grid-container{overflow:auto;position:relative}.aggregation-row{position:sticky;bottom:0;z-index:50;background:#f7faff!important;background-color:#f7faff!important;font-weight:700;border-top:1px solid #4D5A81!important;border-bottom:1px solid #4D5A81!important}.aggregation-row td{background:#f7faff!important;background-color:#f7faff!important;border-top:1px solid #4D5A81!important;border-bottom:1px solid #4D5A81!important;border-left:none!important;border-right:none!important}.empty-row td{padding:0}.col-resizer{position:absolute;top:0;right:-5px;z-index:4;width:10px;height:100%;cursor:col-resize}.col-resizer:hover{background:#3c5dc440}.data-grid-datatable td[data-sized]{overflow:hidden;text-overflow:ellipsis}:where(.data-grid-datatable tbody tr,.data-grid-datatable tfoot tr){background-color:#fff}.data-grid-datatable td[data-frozen]{position:sticky;z-index:1;background-color:inherit}.data-grid-datatable thead th[data-frozen]{position:sticky;z-index:3}.data-grid-datatable td[data-frozen]:has(+td:not([data-frozen])),.data-grid-datatable thead th[data-frozen]:has(+th:not([data-frozen])){box-shadow:inset -2px 0 #3c5dc459}table thead th.header{background-image:none!important;cursor:default}.header-cell{position:relative;display:flex;align-items:center;gap:2px}.header-cell label{flex:1 1 auto;cursor:default;margin:0;padding-left:2px;overflow:hidden;text-overflow:ellipsis}.header-cell.col-dragging{opacity:.8}.dg-column-ghost{border:1px solid #C1D0FD;box-sizing:border-box}.col-drop-indicator{position:fixed;z-index:3100;width:1px;border-radius:0;background:var(--orange-algorima, #f59d0f);pointer-events:none}.header-cell-end{justify-content:flex-end;align-items:center;height:25px}.header-handle{flex-shrink:0;display:flex;align-items:center;justify-content:center;box-sizing:content-box;width:17px;height:20px;padding:0 2px;color:#3c5dc4;opacity:.35;cursor:grab}.header-handle:hover{opacity:1}.header-handle:active{cursor:grabbing}.header-sort,.header-agg{flex-shrink:0;color:#3c5dc4;font-size:11px;font-style:normal}.header-menu-button{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:16px;height:18px;padding:0;border:0;border-radius:3px;background:none;color:#3c5dc4;opacity:.5;cursor:pointer}.header-menu-button:hover,.header-menu-button.open{opacity:1;background:#4465c926}.header-menu{position:fixed;z-index:3000;width:230px;padding:4px 0;background:#fff;border:1px solid #DBE4FF;border-radius:5px;box-shadow:0 4px 14px #0003}.header-menu ul{margin:0;padding:0;list-style:none}.header-menu li{display:flex;align-items:center;gap:8px;padding:5px 12px;color:#3c5dc4;font-size:12.5px;cursor:pointer}.header-menu li i{width:14px;text-align:center;visibility:visible}.header-menu li:hover{background:#dbe4ff}.header-menu li.checked{font-weight:600}.header-menu li.separator{height:1px;margin:4px 0;padding:0;background:#dbe4ff;cursor:default}.header-menu li .fa-check{visibility:hidden}.header-menu li.checked>.fa-check{visibility:visible}.header-menu li.menu-action.disabled{opacity:.45;cursor:default}.header-menu li.menu-action.disabled:hover{background:none}.header-menu .menu-action-icon{width:14px;height:14px;filter:brightness(0) saturate(100%) invert(36%) sepia(91%) saturate(628%) hue-rotate(191deg) brightness(89%) contrast(85%) brightness(75%)}.header-menu li.has-submenu{position:relative}.header-menu li.has-submenu.open{background:#dbe4ff}.header-menu li.has-submenu .submenu-caret{margin-left:auto}.header-menu .header-submenu{position:absolute;top:-5px;left:100%;width:200px;padding:4px 0;background:#fff;border:1px solid #DBE4FF;border-radius:5px;box-shadow:0 4px 14px #0003;font-weight:400}.header-menu .header-submenu.left{left:auto;right:100%}.header-menu .header-submenu.header-submenu-distinct{width:240px}.header-menu .header-submenu.header-submenu-columns{width:240px;max-height:320px;overflow-y:auto}.header-menu .header-submenu .column-choice input[type=checkbox]{width:14px;margin:0;pointer-events:none}.header-menu .header-submenu .submenu-loading{opacity:.6;cursor:default}.header-menu .header-submenu .view-lock{margin-left:auto;padding-left:8px;opacity:.5;font-size:11px}.header-menu .header-submenu.up{top:auto;bottom:-5px}.header-sort-rank{flex-shrink:0;color:#3c5dc4;font-size:9px}.aggregation-row .agg-label{margin-right:4px;color:#3c5dc4;font-size:10.5px;opacity:.7}.datagrid-custom-container:focus,.datagrid-custom-container:focus-visible{outline:none}.data-grid-datatable td .image ::ng-deep img{display:block}.data-grid-datatable td:has(>.grid-cursor){outline:2px solid #4465C9;outline-offset:-2px}.data-grid-datatable td:has(>.grid-range){background-color:#4465c940!important;box-shadow:inset 0 0 0 1px #4465c980;color:#4d5a81!important}.data-grid-datatable td:has(>.grid-range) ::ng-deep *{color:#4d5a81!important}.data-grid-datatable td:has(.grid-editor){padding:0!important;background-color:#fff}.grid-editor{display:block;height:23px;overflow:visible;color:#4d5a81}.grid-editor ::ng-deep .field-container,.grid-editor ::ng-deep .form-group,.grid-editor ::ng-deep .form-group>div,.grid-editor ::ng-deep .checkbox-container{margin:0!important;padding:0;min-height:0!important;height:23px}.grid-editor ::ng-deep .validation-message,.grid-editor ::ng-deep .checkbox-label{display:none}.grid-editor ::ng-deep input,.grid-editor ::ng-deep input:focus,.grid-editor ::ng-deep textarea{box-sizing:border-box;width:100%;height:23px!important;min-height:0!important;margin:0!important;padding:0 4px;border:1px solid #4465C9;border-radius:0;box-shadow:none;font-size:inherit;line-height:normal;resize:none}.grid-editor ::ng-deep input.ng-invalid.ng-touched,.grid-editor ::ng-deep input.ng-invalid.ng-dirty{border-color:#f78383}.grid-editor ::ng-deep input[type=checkbox]{width:auto}.grid-editor ::ng-deep .ng-select .ng-select-container{color:#4d5a81;min-height:0!important;height:23px!important;border-radius:0;border-color:#4465c9}.grid-editor ::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{top:0}.grid-editor ::ng-deep .ng-select .ng-select-container .ng-value-container{padding-top:0}.grid-editor ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input>input{height:100%!important;border:none}.grid-editor ::ng-deep .form-group>div{flex:1;min-width:0;width:100%}.grid-editor ::ng-deep .ng-select{width:100%}.grid-editor ::ng-deep alg-selector{display:flex;width:100%;height:23px}.grid-editor ::ng-deep .input-select-default,.grid-editor ::ng-deep .input-select-default.with-button{flex:1;min-width:0;padding-right:0;margin-right:0}.grid-editor ::ng-deep .input-group-btn{float:none}.grid-editor ::ng-deep .btn,.grid-editor ::ng-deep .btn-32,.grid-editor ::ng-deep .btn-input-select{height:23px;width:23px;padding:0;line-height:1;border-radius:0}.grid-editor ::ng-deep .input-with-button{display:flex;height:23px}.grid-editor ::ng-deep .switch{margin:2px 0 0 4px;transform:scale(.7);transform-origin:left top}::ng-deep body.dg-column-dragging,::ng-deep body.dg-column-dragging *{cursor:grabbing!important;-webkit-user-select:none!important;user-select:none!important}\n"],
 			dependencies: [
 				{
 					kind: "directive",
@@ -19017,6 +19268,17 @@ var DataGridComponent = class DataGridComponent {
 					inputs: ["chooser", "mobile"],
 					outputs: ["done", "loaded"]
 				},
+				{
+					kind: "component",
+					type: GridDistinctFilterComponent,
+					selector: "alg-grid-distinct-filter",
+					inputs: [
+						"facade",
+						"entityKey",
+						"property"
+					],
+					outputs: ["done", "loaded"]
+				},
 				{
 					kind: "component",
 					type: ImageComponent,
@@ -19130,8 +19392,8 @@ i0.ɵɵngDeclareClassMetadata({
 				provide: RowRefHost,
 				useExisting: forwardRef(() => DataGridComponent)
 			}],
-			template: "<div #datagridContainer [class]=\"this.datagridClass\" tabindex=\"-1\" (keydown)=\"onGridKeyDown($event)\" (scroll)=\"onGridScroll($event)\"\r\n    (copy)=\"onCopy($event)\" (paste)=\"onPaste($event)\" (contextmenu)=\"openEmptyAreaContextMenu($event)\">\r\n    <ng-container>\r\n        <table class=\"data-grid-datatable\">\r\n            <ng-container *ngIf=\"this.facade.style as ctx\">\r\n                <ng-container *ngIf=\"this.facade.config.columns$ | async as rcolumns\">\r\n                    <thead>\r\n                        <tr>\r\n                            <th class=\"header row-state\" (click)=\"addFilterQuery()\"></th>\r\n                            <!-- En-tête : poignée de déplacement à gauche, intitulé, indicateur de tri,\r\n                                 flèche du menu (tri, agrégation) à droite. Le clic ne trie plus. -->\r\n                            <th #thHeader *ngFor=\"let col of rcolumns;let i = index\"\r\n                                    [attr.id]=\"guid.toString() + '-col-' + col.Property\"\r\n                                    [attr.class]=\"'header' | gridStyle : ctx : { column : col }\"\r\n                                    [style.width.px]=\"colWidth(col)\" [style.min-width.px]=\"colWidth(col)\" [style.max-width.px]=\"colWidth(col)\"\r\n                                    [attr.data-frozen]=\"isFrozen(i) ? '' : null\" [style.left.px]=\"frozenLeft(i)\">\r\n                                <div class=\"header-cell\"\r\n                                    [class.col-dragging]=\"draggedColumn === col.Property\">\r\n                                    <span class=\"header-handle\" title=\"Déplacer la colonne\"\r\n                                        (mousedown)=\"onHeaderMouseDown(col, $event)\">\r\n                                        <i class=\"fa fa-ellipsis-v\"></i>\r\n                                    </span>\r\n                                    <label>{{ getHeaderLabel(col) }}</label>\r\n                                    <i *ngIf=\"this.facade.filter.isAsc(col.Property)\" class=\"fa fa-long-arrow-up header-sort\" title=\"Tri croissant\"></i>\r\n                                    <i *ngIf=\"this.facade.filter.isDesc(col.Property)\" class=\"fa fa-long-arrow-down header-sort\" title=\"Tri décroissant\"></i>\r\n                                    <sup *ngIf=\"this.facade.filter.sortRank(col.Property) > 0\" class=\"header-sort-rank\"\r\n                                        title=\"Rang dans le tri personnalisé\">{{ this.facade.filter.sortRank(col.Property) }}</sup>\r\n                                    <i *ngIf=\"activeAggregations[col.Property]\" class=\"header-agg\" [title]=\"'Agrégation : ' + aggregationLabel(activeAggregations[col.Property])\">Σ</i>\r\n                                    <!-- Dernière colonne suivie de la colonne vide de fin : sa flèche est dans la colonne vide. -->\r\n                                    <button type=\"button\" class=\"header-menu-button\" title=\"Trier, agréger\"\r\n                                        *ngIf=\"!(ctx.enableLastColumnResize && i === rcolumns.length - 1)\"\r\n                                        [class.open]=\"headerMenu?.column.Property === col.Property\"\r\n                                        (click)=\"toggleHeaderMenu(col, $event)\">\r\n                                        <i class=\"fa fa-caret-down\"></i>\r\n                                    </button>\r\n                                </div>\r\n                                <!-- Bord droit : largeur de la colonne (tirer), ajustée au contenu (double clic). -->\r\n                                <span class=\"col-resizer\" title=\"Largeur de la colonne (double clic : ajuster au contenu)\"\r\n                                    (mousedown)=\"startResize(col, $event)\" (dblclick)=\"autoFitColumn(col, $event)\"\r\n                                    (click)=\"$event.stopPropagation()\"></span>\r\n                            </th>\r\n                            <th *ngIf=\"ctx.enableLastColumnResize\" #lastColumnHeader class=\"header last-column\"\r\n                                (contextmenu)=\"openHeaderContextMenu($event, rcolumns[rcolumns.length - 1])\">\r\n                                <div class=\"header-cell header-cell-end\" *ngIf=\"rcolumns.length > 0\">\r\n                                    <button type=\"button\" class=\"header-menu-button\" title=\"Trier, agréger\"\r\n                                        [class.open]=\"headerMenu?.column.Property === rcolumns[rcolumns.length - 1].Property\"\r\n                                        (click)=\"toggleHeaderMenu(rcolumns[rcolumns.length - 1], $event)\">\r\n                                        <i class=\"fa fa-caret-down\"></i>\r\n                                    </button>\r\n                                </div>\r\n                            </th>\r\n\r\n                        </tr>\r\n                        <ng-container *ngIf=\"this.facade.filter.additionalQuery$ | async as additionalQuery\">\r\n                            <tr #thFilterRows *ngFor=\"let filterRow of additionalQuery.Rows;let i = index\" >\r\n                                <th class=\"filter-header row-state\" (click)=\"removeFilterQuery(i)\"></th>\r\n                                <th class=\"filter-header\" [ngClass]=\"{disabled: !col.IsFilterEnabled}\" *ngFor=\"let col of rcolumns;let i = index\"\r\n                                    [attr.id]=\"guid.toString() + '-filter-' + i\">\r\n                                    <input *ngIf=\"col.IsFilterEnabled\" type=\"text\"\r\n                                        class=\"filter-header-input\"\r\n                                        name=\"keyword\"\r\n                                        #uniquename=\"ngModel\"\r\n                                        [attr.id]=\"guid.toString() + '-filter-input-' + col.Property\"\r\n                                        [(ngModel)]=\"filterRow.ClausesByPropertyName.get(col.Property).FilterValue\"\r\n                                        (ngModelChange)=\"handleFilterChanged($event, filterRow, col.Property)\"\r\n                                        (change)=\"validateFilterChanged($event, filterRow, col.Property)\"\r\n                                    />\r\n                                </th>\r\n                                <ng-container>\r\n                                    <th #lastColumnFilter class=\"filter-header last-column\"></th>\r\n                                </ng-container>\r\n                            </tr>\r\n                        </ng-container>\r\n                    </thead>\r\n\r\n                    <tbody>\r\n                        <ng-container *ngIf=\"this.facade.data\">\r\n                            <ng-container *ngFor=\"let row of this.data.Values; let r = index;\">\r\n                            <tr\r\n                                [class]=\"'alternating' | gridStyle : ctx : { row : row, index : r, maxIndex : this.data.Values.length, hasAggregates: hasAggregates  }\"\r\n                                [class.selected]=\"isRowSelected(row)\"\r\n                                [attr.id]=\"guid.toString() + '-row-' + row.Id\"\r\n                                (mousedown)=\"onRowMouseDown(row, $event)\"\r\n                                (mouseup)=\"onRowMouseUp(row, $event)\"\r\n                                (click)=\"onRowClick(row, $event)\"\r\n\r\n                                [rowRef]=\"guid + '-row-' + row.Id\"\r\n                            >\r\n\r\n                            <th [attr.class]=\"'rowstate' | gridStyle : ctx : { row : row }\">\r\n                                <ng-container *ngIf=\"selectionStyler.isModified(row) && !selectionStyler.isInvalid(row) && !selectionStyler.isWarning(row)\">\r\n                                    <div class=\"new-rowstate\"><span>...</span></div>\r\n                                </ng-container>\r\n\r\n                                <ng-container *ngIf=\"selectionStyler.isInvalid(row)\">\r\n                                    <div> <img class=\"error-row-icon\" src=\"assets/images/error.svg\" /> </div>\r\n                                </ng-container>\r\n\r\n                                <ng-container *ngIf=\"selectionStyler.isWarning(row) && !selectionStyler.isInvalid(row)\">\r\n                                    <div> <img class=\"error-row-icon\" src=\"assets/images/warning.svg\" /> </div>\r\n                                </ng-container>\r\n\r\n                                <ng-container *ngIf=\"ctx.displayDetail\">\r\n                                    <button type=\"button\" [attr.id]=\"row.Id + '_button'\" class=\"toggle-button btn\" (click)=\"toggleDetail(row)\">\r\n                                        <i class=\"fa fa-chevron-right fa-custom\"></i>\r\n                                    </button>\r\n                                </ng-container>\r\n                            </th>\r\n\r\n                            <td *ngFor=\"let column of rcolumns; index as i\"\r\n                                [attr.id]=\"cellId(row, column)\"\r\n                                [style.max-width.px]=\"colWidth(column)\" [attr.data-sized]=\"colWidth(column) ? '' : null\"\r\n                                [attr.data-frozen]=\"isFrozen(i) ? '' : null\" [style.left.px]=\"frozenLeft(i)\"\r\n                                [class]=\"'cell' | gridStyle : ctx : { row : row,column : column,index : r }\"\r\n                                [class.selected]=\"isRowSelected(row)\"\r\n                                (mousedown)=\"onCellMouseDown(r, i, $event)\"\r\n                                (mouseenter)=\"onCellMouseEnter(r, i, $event)\"\r\n                                (click)=\"onCellClick(row, column)\"\r\n                                (dblclick)=\"onCellDblClick(row, column)\">\r\n\r\n                                <alg-datagrid-cell #dataGridCellComponent\r\n                                    class=\"gridcell-container\"\r\n                                    [entity]=\"row\"\r\n                                    [isEditable]=\"canEditCell(row, column)\"\r\n                                    [property]=\"column.Property\"\r\n                                    [managed]=\"true\"\r\n                                    [mode]=\"showEditor(row, column) ? 'edit' : 'view'\"\r\n                                    [class.grid-cursor]=\"isCursorCell(row, column)\"\r\n                                    [class.grid-range]=\"isInRange(r, i)\"\r\n                                    (contextmenu)=\"openContextMenu($event, row, column)\">\r\n\r\n                                    <ng-template alg-editMode>\r\n                                        <!-- Éditeur du champ du formulaire qui correspond à la colonne (sinon déduit de la colonne), à la hauteur de la ligne. -->\r\n                                        <alg-field class=\"grid-editor\"\r\n                                            [field]=\"getEditField(column)\"\r\n                                            [form]=\"getRowForm(row)\"\r\n                                            [showLabel]=\"false\"\r\n                                            (propertyChanged)=\"onCellChanged(row, $event)\"\r\n                                            >\r\n                                            <!-- [focusable]=\"cellFocus\" -->\r\n                                        </alg-field>\r\n                                    </ng-template>\r\n                                    <ng-template alg-viewMode>\r\n\r\n                                        <div [ngSwitch]=\"column.Display?.type\" *ngIf=\"!isUndefined(row[column.Property])\">\r\n                                            <div *ngSwitchCase=\"'url'\">\r\n                                                <a [routerLink]=\"[$safeNavigationMigration(column.Display?.baseUrl),row[column.Property]]\">\r\n                                                    {{ row.Id || row[column.Property] }}\r\n                                                </a>\r\n                                            </div>\r\n\r\n                                            <div *ngSwitchCase=\"'img'\" class=\"image\">\r\n                                                <img *ngIf=\"column.Display?.imagePath?.length == 0\"\r\n                                                    [src]=\"(column.Display?.imgBase || '') + (column.Display?.sourceProperty ? row[column.Display?.sourceProperty] : row[column.Property])\" />\r\n\r\n                                                <alg-image *ngIf=\"column.Display?.imagePath?.length != 0\"\r\n                                                    [imageUrl]=\"this.getEnumImageUrl(row,column)\" [imageHeight]=\"20\" [imageWidth]=\"20\">\r\n                                                </alg-image>\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"!isUndefined(column.ToolTipProperty)\">\r\n                                                    {{ row[column.ToolTipProperty] }}\r\n                                                </div>\r\n                                            </div>\r\n\r\n                                            <div *ngSwitchCase=\"'img-file'\" class=\"image\">\r\n\r\n                                                <alg-image\r\n                                                    [imageUrl]=\"this.getImageUrl(row,column)\" [wide]=\"true\" [imageHeight]=\"40\" [imageWidth]=\"40\">\r\n                                                </alg-image>\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"!isUndefined(column.ToolTipProperty)\">\r\n                                                    {{ row[column.ToolTipProperty] }}\r\n                                                </div>\r\n                                            </div>\r\n\r\n                                            <div *ngSwitchCase=\"'wide-img'\" class=\"image\">\r\n                                                <img *ngIf=\"column.Display?.imagePath?.length == 0\"\r\n                                                    [src]=\"(column.Display?.imgBase || '') + (column.Display?.sourceProperty ? row[column.Display?.sourceProperty] : row[column.Property])\" />\r\n\r\n                                                <alg-image *ngIf=\"column.Display?.imagePath?.length != 0\" [wide]=\"true\"\r\n                                                    [imageUrl]=\"this.getEnumImageUrl(row,column)\" [imageHeight]=\"40\" [imageWidth]=\"40\">\r\n                                                </alg-image>\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"!isUndefined(column.ToolTipProperty)\">\r\n                                                    {{ row[column.ToolTipProperty] }}\r\n                                                </div>\r\n                                            </div>\r\n\r\n                                            <span *ngSwitchCase=\"'date'\">\r\n                                                {{row[column.Property]| date: column.Display?.format || 'dd/MM/yyyy'}}\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'boolean'\">{{row[column.Property] ? 'OUI' : 'NON'}} </span>\r\n\r\n                                            <span *ngSwitchCase=\"'datetime'\">{{row[column.Property] | date: column.Display?.format || 'dd/MM/yyyy HH:mm:ss'}}</span>\r\n\r\n                                            <span *ngSwitchCase=\"'money'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\"\r\n                                                class=\"money\">\r\n                                                {{\r\n                                                    row[column.Property]\r\n                                                    | currency: column.Display?.currency\r\n                                                    || (column.Display?.sourceProperty && row[column.Display?.sourceProperty] ? row[column.Display?.sourceProperty] : false)\r\n                                                    || 'EUR' : 'symbol'\r\n\r\n                                                    | todefine: $safeNavigationMigration(column.Display?.handleError)\r\n                                                }}\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"ctx.showOnToolTip(row,column)\">\r\n                                                    {{ctx.showOnToolTip(row,column)}}\r\n                                                </div>\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'percent'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\">\r\n                                                {{row[column.Property] * $safeNavigationMigration(column.Display?.multiplier) | percent : column.Display?.format\r\n                                                || '1.0-2' | todefine: $safeNavigationMigration(column.Display?.handleError)}}\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'number'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\">\r\n                                                {{row[column.Property] * $safeNavigationMigration(column.Display?.multiplier) | number: column.Display?.format\r\n                                                || '1.0-3' | todefine : $safeNavigationMigration(column.Display?.handleError)}}\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'fixedsizeinteger'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\">\r\n                                                {{row[column.Property] | tofixedsizeinteger : $safeNavigationMigration(column.Display?.completingCaracter) : $safeNavigationMigration(column.Display?.width) }}\r\n                                            </span>\r\n                                            <span *ngSwitchDefault [innerText]=\"column.Property == 'Id' ? (row[column.Property] < 0 ? '' : row[column.Property]) : row[column.Property]\">\r\n                                            </span>\r\n                                        </div>\r\n\r\n                                        <div *ngIf=\"isUndefined(row[column.Property])\">\r\n                                            <span *ngIf=\"!isUndefined($safeNavigationMigration(column.Display?.nullCaseText))\" class=\"mw-invalid\">\r\n                                                {{ column.Display?.nullCaseText }}\r\n                                            </span>\r\n\r\n                                            <span *ngIf=\"isUndefined($safeNavigationMigration(column.Display?.nullCaseText))\">\r\n                                                &nbsp;&nbsp;&nbsp;\r\n                                            </span>\r\n                                        </div>\r\n\r\n                                    </ng-template>\r\n\r\n                                </alg-datagrid-cell>\r\n                            </td>\r\n                            <ng-container *ngIf=\"ctx.enableLastColumnResize\">\r\n                                <!-- Colonne vide de fin : clic droit = menu de la dernière colonne. -->\r\n                                <td (contextmenu)=\"openContextMenu($event, row, rcolumns[rcolumns.length - 1])\"></td>\r\n                            </ng-container>\r\n                            </tr>\r\n                            </ng-container>\r\n                        </ng-container>\r\n                    </tbody>\r\n\r\n                    <tfoot>\r\n                        <tr class=\"empty-row\" *ngIf=\"hasAggregates\">\r\n                             <td></td>\r\n                        </tr>\r\n                        <tr class=\"aggregation-row\" *ngIf=\"hasAggregates\">\r\n                            <td class=\"row-state\"></td>\r\n                            <td *ngFor=\"let column of rcolumns; index as i\" [attr.class]=\"'cell' | gridStyle : ctx : { column : column, index : i }\"\r\n                                [attr.data-frozen]=\"isFrozen(i) ? '' : null\" [style.left.px]=\"frozenLeft(i)\">\r\n\r\n                                <ng-container *ngFor=\"let agg of columnAggregates[column.Property]\">\r\n\r\n                                    <span class=\"agg-label\">{{ aggregationLabel(agg.op) }}</span>\r\n                                    <span [ngSwitch]=\"agg.op === 'COUNT' ? 'count' : column.Display?.type\">\r\n\r\n                                        <span *ngSwitchCase=\"'count'\">{{ agg.value | number: '1.0-0' }}</span>\r\n                                        <span *ngSwitchCase=\"'percent'\">{{ agg.value | number: column.Display?.format || '1.0-3' }}</span>\r\n                                        <span *ngSwitchCase=\"'fixedsizeinteger'\">{{ agg.value | number: column.Display?.format || '1.0-3' }}</span>\r\n\r\n                                        <span *ngSwitchCase=\"'money'\" class=\"money\">\r\n                                            {{ agg.value | currency: getColCurrency(column) }}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchCase=\"'date'\">\r\n                                            {{agg.value | date: column.Display?.format || 'dd/MM/yyyy'}}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchCase=\"'datetime'\">\r\n                                            {{agg.value | date: column.Display?.format || 'dd/MM/yyyy HH:mm:ss'}}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchCase=\"'number'\">\r\n                                            {{agg.value | number: column.Display?.format || '1.0-3'}}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchDefault>\r\n                                            {{agg.value}}\r\n                                        </span>\r\n\r\n                                    </span>\r\n\r\n                                </ng-container>\r\n\r\n                            </td>\r\n\r\n                            <ng-container *ngIf=\"ctx.enableLastColumnResize\">\r\n                                <td class=\"last-column\"></td>\r\n                            </ng-container>\r\n\r\n                        </tr>\r\n                    </tfoot>\r\n                </ng-container>\r\n            </ng-container>\r\n        </table>\r\n    </ng-container>\r\n</div>\r\n\r\n\r\n<!-- Emplacement visé par une colonne déplacée : trait orange sur la séparation des deux en-têtes. -->\r\n<div class=\"col-drop-indicator\" *ngIf=\"dropIndicator\"\r\n    [ngStyle]=\"{ left: dropIndicator.left + 'px', top: dropIndicator.top + 'px', height: dropIndicator.height + 'px' }\"></div>\r\n\r\n<!-- Menu d'une colonne (flèche de l'en-tête ou clic droit sur une cellule), en trois zones séparées\r\n     par un trait : Tri, Actions (celles du panneau des actions), Fonctions (sous-menu « Fonctions »). -->\r\n<div class=\"header-menu\" *ngIf=\"headerMenu\"\r\n    [ngStyle]=\"{ top: headerMenu.y + 'px', left: headerMenu.x + 'px', visibility: headerMenu.ready ? 'visible' : 'hidden' }\"\r\n    (click)=\"$event.stopPropagation()\" (contextmenu)=\"$event.preventDefault()\">\r\n    <ul>\r\n        <!-- Tri -->\r\n        <li [class.checked]=\"this.facade.filter.isAsc(headerMenu.column.Property)\" (click)=\"sortColumn('asc')\"\r\n            (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-sort-amount-asc\"></i><span>Trier par ordre croissant</span>\r\n        </li>\r\n        <li [class.checked]=\"this.facade.filter.isDesc(headerMenu.column.Property)\" (click)=\"sortColumn('desc')\"\r\n            (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-sort-amount-desc\"></i><span>Trier par ordre décroissant</span>\r\n        </li>\r\n        <li [class.checked]=\"this.facade.filter.getSortList().length > 1\" (click)=\"openCustomSort()\"\r\n            (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-sort\"></i><span>Tri personnalisé…</span>\r\n        </li>\r\n        <!-- Filtre sur la valeur de la cellule (clic droit sur une cellule) : première ligne des filtres composés. -->\r\n        <li *ngIf=\"cellFilterValue() !== undefined\" (click)=\"filterOnCell()\" (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-filter\"></i><span>Filtrer sur « {{ cellFilterLabel() }} »</span>\r\n        </li>\r\n        <!-- Affichage : vues personnalisées (cochée = affichée), puis « Modifier… ». -->\r\n        <li *ngIf=\"this.facade.config.viewChooser\" class=\"has-submenu\" [class.open]=\"headerMenu.submenu === 'columns'\"\r\n            (mouseenter)=\"setSubmenu('columns')\" (click)=\"setSubmenu('columns')\">\r\n            <i class=\"fa fa-columns\"></i><span>Affichage</span><i class=\"fa fa-caret-right submenu-caret\"></i>\r\n\r\n            <ul class=\"header-submenu header-submenu-columns\" *ngIf=\"headerMenu.submenu === 'columns'\"\r\n                [class.left]=\"headerMenu.submenuLeft\" [class.up]=\"headerMenu.submenuUp\"\r\n                (click)=\"$event.stopPropagation()\">\r\n                <alg-grid-view-menu [chooser]=\"this.facade.config.viewChooser\" (done)=\"closeViewMenu()\" (loaded)=\"onViewMenuLoaded()\"></alg-grid-view-menu>\r\n            </ul>\r\n        </li>\r\n        <!-- Colonnes figées à gauche, de la première jusqu'à celle-ci. -->\r\n        <li [class.checked]=\"isFrozen(columnIndex(headerMenu.column))\" (click)=\"toggleFrozen()\" (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-thumb-tack\"></i>\r\n            <span>{{ frozenUntil === columnIndex(headerMenu.column) ? 'Libérer les colonnes' : 'Figer jusqu\\'à cette colonne' }}</span>\r\n        </li>\r\n        <li *ngIf=\"frozenUntil !== undefined && frozenUntil !== columnIndex(headerMenu.column)\"\r\n            (click)=\"unfreezeColumns()\" (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-unlock\"></i><span>Libérer les colonnes</span>\r\n        </li>\r\n\r\n        <!-- Actions -->\r\n        <ng-container *ngIf=\"visibleActions.length > 0\">\r\n            <li class=\"separator\"></li>\r\n            <ng-container *ngFor=\"let action of visibleActions\">\r\n                <ng-container *ngIf=\"{ disabled: (action.disabled$ | async) } as state\">\r\n                    <li class=\"menu-action\" [class.disabled]=\"state.disabled\"\r\n                        (click)=\"executeMenuAction(action, state.disabled)\" (mouseenter)=\"setSubmenu(undefined)\">\r\n                        <img class=\"menu-action-icon\" [src]=\"getActionImageUrl(action.icon)\" [alt]=\"action.title\" />\r\n                        <span>{{ action.title }}</span>\r\n                    </li>\r\n                </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n\r\n        <!-- Affichage -->\r\n        <li class=\"separator\"></li>\r\n        <li class=\"has-submenu\" [class.open]=\"headerMenu.submenu === 'display'\"\r\n            (mouseenter)=\"setSubmenu('display')\" (click)=\"setSubmenu('display')\">\r\n            <i class=\"fa fa-calculator\"></i><span>Fonctions</span><i class=\"fa fa-caret-right submenu-caret\"></i>\r\n\r\n            <ul class=\"header-submenu\" *ngIf=\"headerMenu.submenu === 'display'\"\r\n                [class.left]=\"headerMenu.submenuLeft\" [class.up]=\"headerMenu.submenuUp\"\r\n                (click)=\"$event.stopPropagation()\">\r\n                <li *ngFor=\"let op of getAggregationOptions(headerMenu.column)\"\r\n                    [class.checked]=\"activeAggregations[headerMenu.column.Property] === op\"\r\n                    (click)=\"aggregateColumn(op)\">\r\n                    <i class=\"fa fa-check\"></i><span>{{ aggregationLabel(op) }}</span>\r\n                </li>\r\n                <ng-container *ngIf=\"activeAggregations[headerMenu.column.Property]\">\r\n                    <li class=\"separator\"></li>\r\n                    <li (click)=\"aggregateColumn(null)\">\r\n                        <i class=\"fa fa-times\"></i><span>Ne plus afficher</span>\r\n                    </li>\r\n                </ng-container>\r\n            </ul>\r\n        </li>\r\n    </ul>\r\n</div>\r\n\r\n",
-			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}:host{flex:1}.header.last-column{border-left:none!important;width:100%}table thead .sorting,table thead .sorting_asc,table thead .sorting_desc,table thead .sorting_asc_disabled,table thead .sorting_desc_disabled{background-repeat:no-repeat;background-position:center right}table thead th:first-child,table tfoot tr:first-child{position:sticky;left:0;z-index:2}table tbody th:first-child{position:sticky;left:0;z-index:1;border-right:none}table tbody th:first-child div{text-align:center;vertical-align:middle;line-height:20px}table tbody tr.row-odd th:first-child{background:#ebf0ff}table tbody tr.selected.row-odd.mw-invalid th:first-child,table tbody tr.selected.row-even.mw-invalid th:first-child,table tbody tr.selected.row-odd.mw-warning th:first-child,table tbody tr.selected.row-even.mw-warning th:first-child,table tbody tr.selected.row-even th:first-child,table tbody tr.selected.row-odd th:first-child{background-color:#8ea7f8;color:#fff}table tbody tr.row-odd.mw-invalid th:first-child,table tbody tr.row-even.mw-invalid th:first-child{background-color:#f2dede}table tbody tr.row-odd.mw-warning th:first-child,table tbody tr.row-even.mw-warning th:first-child{background-color:#fff4de}table thead th{position:-webkit-sticky;position:sticky;top:0;z-index:1;background:#fff;border-left:1px solid #3C5DC4;border-bottom:1px solid #3C5DC4}table thead .sorting{background-image:none;cursor:pointer}table thead .sorting_asc{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowMTgwMTE3NDA3MjA2ODExQjM4MkY2QzVGRUYwRTJDNCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo4MkFEQzYxNjIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4MkFEQzYxNTIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjAyODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAxODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+z5ABTAAAAI5JREFUeNpi/P//PwO1ABMDFQELIQXVjfe4gFQbEJe11iv9otRl2UCcBcSphBQy4gszoKu0gNROIJYB4jtA7AF03V2SXQY0iBFIFUMNAgEVIM6DipPsTQcgDkQTSwRia5IMA9rOC6RqgVgQTQokXgOUZyfFZSFQF/zAgh2BOIjkCBjQRDtq2Khh9DAMIMAAT9AmNBDSXegAAAAASUVORK5CYII=);cursor:pointer}table thead .sorting_desc{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowMTgwMTE3NDA3MjA2ODExQjM4MkY2QzVGRUYwRTJDNCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo4MkFEQzYxQTIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4MkFEQzYxOTIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjAyODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAxODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+1fsfwAAAAJdJREFUeNpi/P//PwO1ABMDFcGoYaOG0cMwFmyC1Y33IoHUAiD+h8MBGa31SvOJddk6IN4PxBxY8FEgXkO0N4G2/gRSLUD8GU3qPRA3A+U/kxpmIBege2U9EB/ApYERX6kBDDtlILUDiFWA+AkQuwNddY2s2ARqvAukJgDxbyCehM8gnLGJBmYDsSoQTyWkkHHQFo4AAQYAAA0piq4hbqwAAAAASUVORK5CYII=);cursor:pointer}table thead .sorting_asc_disabled,table thead .sorting_desc_disabled{background-image:none}.checkbok-container{align-items:center;margin:0;padding:0}.gridcell-container{padding:0;min-width:fit-content}.gridcell-container input[type=number]{display:block;size:1;font-size:10pt;width:100%!important;height:100%;margin:0!important;border:2px solid #F78383}.datagrid-custom-container{height:100%;overflow:auto;margin-left:-1px}.data-grid-datatable{table-layout:fixed;cursor:pointer;border-spacing:0px}.data-grid-datatable td{box-shadow:none;padding:2px 5px;white-space:nowrap}.data-grid-datatable td.row-state{padding:2px 5px;width:16px}.data-grid-datatable td.img{padding:2px 5px}.data-grid-datatable td.row-state img{height:16px;width:16px;margin-top:-3px;padding:0}.data-grid-datatable tr{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.header{vertical-align:bottom;padding:2px 5px 2px 0;font-weight:400;color:#3c5dc4;white-space:nowrap;line-height:25px;min-width:32px;margin-bottom:5px}.header.img{min-width:16px}.header.row-state{min-width:27px;position:-webkit-sticky;position:sticky;top:0;left:0;z-index:2;background:#fff;border-left:none;border-right:none}.filter-header{background-color:#f7f7f7!important}.filter-header.disabled{background-color:#9fa9c7!important}.filter-header.row-state:hover:before{position:relative;display:block;float:left;width:16px;height:16px;content:\" \";background-size:16px 16px;-webkit-background-size:16px 16px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"57\" height=\"57\" viewBox=\"0 0 57 57\">%0D%0A  <path id=\"Rond_Croix\" data-name=\"Rond Croix\" d=\"M28.5,57A28.5,28.5,0,0,1,8.347,8.347,28.5,28.5,0,1,1,48.652,48.652,28.317,28.317,0,0,1,28.5,57Zm0-24.036h0l11.9,11.9L44.869,40.4,32.964,28.5,44.869,16.593,40.4,12.129,28.5,24.034,16.594,12.129l-4.465,4.464L24.034,28.5,12.129,40.4l4.463,4.465L28.5,32.965Z\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 0 0 3px;filter:brightness(0) saturate(100%) invert(70%) sepia(93%) saturate(1540%) hue-rotate(309deg) brightness(105%) contrast(94%)}.filter-header-input{height:calc(100% - 2px);width:calc(100% - 2px);margin:0;border:none!important;background-color:#f7f7f7;padding:0 0 0 5px;color:#4d5a81}.header.row-state:before{position:relative;display:block;float:left;width:16px;height:16px;content:\" \";background-size:16px 16px;-webkit-background-size:16px 16px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->%0D%0A<path fill=\"currentColor\" d=\"M3.9 54.9C10.5 40.9 24.5 32 40 32l432 0c15.5 0 29.5 8.9 36.1 22.9s4.6 30.5-5.2 42.5L320 320.9 320 448c0 12.1-6.8 23.2-17.7 28.6s-23.8 4.3-33.5-3l-64-48c-8.1-6-12.8-15.5-12.8-25.6l0-79.1L9 97.3C-.7 85.4-2.8 68.8 3.9 54.9z\"/></svg>');background-repeat:no-repeat;margin:0 0 3px 5px;filter:brightness(0) saturate(100%) invert(56%) sepia(79%) saturate(2301%) hue-rotate(202deg) brightness(92%) contrast(91%)}.filter-header.last-column{border-left:none!important}.header label{cursor:pointer;margin-bottom:0;margin-right:10px;padding-left:5px;width:100%}.row-odd{background-color:#ebf0ff;border-left:1px solid #C1D0FD;border-bottom:1px solid #C1D0FD}.row-even{background-color:#f7faff;border-left:1px solid #C1D0FD;border-bottom:1px solid #C1D0FD}.error-row-icon{padding:2px;width:20px}.selected{background-color:#8ea7f8;color:#fff}.mw-invalid{font-weight:600;background-color:#f2dede;border:1px solid var(--red-error)}.mw-invalid td{background-color:#f2dede!important}.data-grid-datatable tbody tr.mw-invalid>td,.data-grid-datatable tbody tr.mw-invalid>th{box-shadow:inset 0 1px 0 var(--red-error),inset 0 -1px 0 var(--red-error)}span.mw-invalid{padding:0 3px;color:var(--red-error);background-color:transparent}.mw-warning.selected,.mw-invalid.selected{background-color:#8ea7f8}.mw-warning.selected td,.mw-invalid.selected td{background-color:#8ea7f8!important}.mw-warning{font-weight:600;background-color:#fff4de;border:1px solid var(--orange-algorima)}.mw-warning td{background-color:#fff4de!important}.mw-modified{font-weight:600;border:1px solid var(--main-bg-color)}.first-row{border-top:none}.last-row,.last-row td{border-bottom:none!important}.data-grid-datatable>tbody>tr{z-index:50}.image{position:relative;display:flex;flex-direction:row}.image img{height:20px;width:auto}td.money{position:relative}.tool-tip{visibility:hidden;background-color:#424242;color:#fff;text-align:left;border-radius:3px;font-size:15px;position:absolute;z-index:1;top:-10%;left:150%;opacity:0;transition:opacity .3s;padding:5px 15px;white-space:nowrap;overflow:visible}.tool-tip:after{content:\" \";position:absolute;top:50%;right:100%;margin-top:-5px;border-width:5px;border-style:solid;border-color:transparent rgb(66,66,66) transparent transparent}.image:hover .tool-tip{visibility:visible;opacity:1}td.money:hover .tool-tip{visibility:visible;opacity:1;left:100%;height:28px;font-size:13px;margin-top:0;padding:5px 10px 10px}.disabled{pointer-events:none}.edit-mode{background-color:#fff;border:1px solid #4465C9;min-width:90px!important;height:30px!important}.edit-mode .form-group{min-height:0px}.edit-mode .inactivated{background-color:#dbe4ff80}.edit-mode .inactivated-fo{background-color:#dbe4ff}.edit-mode .ecartclass{border:2px solid #4465C9}.edit-mode .error-cell{font-weight:700;color:#f78383!important}.edit-mode .selected{color:#4d5a81}.highlight-1,.highlight-1.selected,.edit-mode.highlight-1.selected{background-color:#4d5a81!important;color:#fff!important}.highlight-2,.highlight-2.selected,.edit-mode.highlight-2.selected{background-color:#dbe4ff!important;color:#4d5a81!important}.highlight-3,.highlight-3.selected,.edit-mode.highlight-3.selected{background-color:#4465c9!important;color:#fff!important}.highlight-4,.highlight-4.selected,.edit-mode.highlight-4.selected{background-color:#f78383!important;color:#fff!important}.highlight-5,.highlight-5.selected{background-color:#4465c9!important;color:#fff}.fixed-column{position:-webkit-sticky;position:sticky;left:27px;z-index:2!important;border-left:none}.fixed-header{position:-webkit-sticky;position:sticky;left:27px;z-index:3!important;background:#fff}.has-focus{padding:0!important}.has-focus ::ng-deep input,.has-focus ::ng-deep input:focus-visible,.has-focus ::ng-deep input:focus{border-radius:.1;outline:none!important;width:100%;height:29px;min-height:0;margin:0;border:1px solid #4465C9}.has-focus ::ng-deep .form-group{margin-bottom:0;min-height:0}.has-focus ::ng-deep .field-container{margin-bottom:0}.edit-mode.has-focus{width:90px!important}.bordered{border-left:1px solid #14358f!important;border-right:1px solid #14358f!important}.match-keywords{color:var(--main-bg-color);font-weight:700}.datagrid-img img{height:20px;width:20px}.right-align{text-align:right}.left-align{text-align:left}.detail-div{height:0px;overflow:hidden;transition:all .2s linear;width:100%}.fa-custom{font-size:smaller}.detail-div-show{height:150px;transition:all .2s linear}.toggleable{visibility:collapse}.toggleable-show{visibility:visible}.toggle-button-down{transform:rotate(90deg);transition:all .2s linear}.no-result{color:#5272d3;height:100%;width:100%;padding:15px 15px 150px}.new-rowstate{display:flex;flex-direction:row;align-items:center;align-self:center;height:100%;width:100%}.new-rowstate span{height:100%;width:100%;margin-top:-6px}.context-menu{position:absolute;background:#ffffff26;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);box-shadow:0 4px 12px #0000004d;padding:8px;z-index:1000;min-width:75px;max-width:250px;transition:all .3s ease-in-out}.context-menu ul{list-style:none;margin:0;padding:0}.context-menu li{padding:10px 14px;cursor:pointer;border-radius:8px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}.context-menu li:hover{background:linear-gradient(135deg,#ffffff4d,#ffffff1a);transform:scale(1.02)}.context-menu li:active{transform:scale(.98)}.grid-container{overflow:auto;position:relative}.aggregation-row{position:sticky;bottom:0;z-index:50;background:#f7faff!important;background-color:#f7faff!important;font-weight:700;border-top:1px solid #4D5A81!important;border-bottom:1px solid #4D5A81!important}.aggregation-row td{background:#f7faff!important;background-color:#f7faff!important;border-top:1px solid #4D5A81!important;border-bottom:1px solid #4D5A81!important;border-left:none!important;border-right:none!important}.empty-row td{padding:0}.col-resizer{position:absolute;top:0;right:-5px;z-index:4;width:10px;height:100%;cursor:col-resize}.col-resizer:hover{background:#3c5dc440}.data-grid-datatable td[data-sized]{overflow:hidden;text-overflow:ellipsis}:where(.data-grid-datatable tbody tr,.data-grid-datatable tfoot tr){background-color:#fff}.data-grid-datatable td[data-frozen]{position:sticky;z-index:1;background-color:inherit}.data-grid-datatable thead th[data-frozen]{position:sticky;z-index:3}.data-grid-datatable td[data-frozen]:has(+td:not([data-frozen])),.data-grid-datatable thead th[data-frozen]:has(+th:not([data-frozen])){box-shadow:inset -2px 0 #3c5dc459}table thead th.header{background-image:none!important;cursor:default}.header-cell{position:relative;display:flex;align-items:center;gap:2px}.header-cell label{flex:1 1 auto;cursor:default;margin:0;padding-left:2px;overflow:hidden;text-overflow:ellipsis}.header-cell.col-dragging{opacity:.8}.dg-column-ghost{border:1px solid #C1D0FD;box-sizing:border-box}.col-drop-indicator{position:fixed;z-index:3100;width:1px;border-radius:0;background:var(--orange-algorima, #f59d0f);pointer-events:none}.header-cell-end{justify-content:flex-end;align-items:center;height:25px}.header-handle{flex-shrink:0;display:flex;align-items:center;justify-content:center;box-sizing:content-box;width:17px;height:20px;padding:0 2px;color:#3c5dc4;opacity:.35;cursor:grab}.header-handle:hover{opacity:1}.header-handle:active{cursor:grabbing}.header-sort,.header-agg{flex-shrink:0;color:#3c5dc4;font-size:11px;font-style:normal}.header-menu-button{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:16px;height:18px;padding:0;border:0;border-radius:3px;background:none;color:#3c5dc4;opacity:.5;cursor:pointer}.header-menu-button:hover,.header-menu-button.open{opacity:1;background:#4465c926}.header-menu{position:fixed;z-index:3000;width:230px;padding:4px 0;background:#fff;border:1px solid #DBE4FF;border-radius:5px;box-shadow:0 4px 14px #0003}.header-menu ul{margin:0;padding:0;list-style:none}.header-menu li{display:flex;align-items:center;gap:8px;padding:5px 12px;color:#3c5dc4;font-size:12.5px;cursor:pointer}.header-menu li i{width:14px;text-align:center;visibility:visible}.header-menu li:hover{background:#dbe4ff}.header-menu li.checked{font-weight:600}.header-menu li.separator{height:1px;margin:4px 0;padding:0;background:#dbe4ff;cursor:default}.header-menu li .fa-check{visibility:hidden}.header-menu li.checked>.fa-check{visibility:visible}.header-menu li.menu-action.disabled{opacity:.45;cursor:default}.header-menu li.menu-action.disabled:hover{background:none}.header-menu .menu-action-icon{width:14px;height:14px}.header-menu li.has-submenu{position:relative}.header-menu li.has-submenu.open{background:#dbe4ff}.header-menu li.has-submenu .submenu-caret{margin-left:auto}.header-menu .header-submenu{position:absolute;top:-5px;left:100%;width:200px;padding:4px 0;background:#fff;border:1px solid #DBE4FF;border-radius:5px;box-shadow:0 4px 14px #0003;font-weight:400}.header-menu .header-submenu.left{left:auto;right:100%}.header-menu .header-submenu.header-submenu-columns{width:240px;max-height:320px;overflow-y:auto}.header-menu .header-submenu .column-choice input[type=checkbox]{width:14px;margin:0;pointer-events:none}.header-menu .header-submenu .submenu-loading{opacity:.6;cursor:default}.header-menu .header-submenu .view-lock{margin-left:auto;padding-left:8px;opacity:.5;font-size:11px}.header-menu .header-submenu.up{top:auto;bottom:-5px}.header-sort-rank{flex-shrink:0;color:#3c5dc4;font-size:9px}.aggregation-row .agg-label{margin-right:4px;color:#3c5dc4;font-size:10.5px;opacity:.7}.datagrid-custom-container:focus,.datagrid-custom-container:focus-visible{outline:none}.data-grid-datatable td .image ::ng-deep img{display:block}.data-grid-datatable td:has(>.grid-cursor){outline:2px solid #4465C9;outline-offset:-2px}.data-grid-datatable td:has(>.grid-range){background-color:#4465c940!important;box-shadow:inset 0 0 0 1px #4465c980;color:#4d5a81!important}.data-grid-datatable td:has(>.grid-range) ::ng-deep *{color:#4d5a81!important}.data-grid-datatable td:has(.grid-editor){padding:0!important;background-color:#fff}.grid-editor{display:block;height:23px;overflow:visible;color:#4d5a81}.grid-editor ::ng-deep .field-container,.grid-editor ::ng-deep .form-group,.grid-editor ::ng-deep .form-group>div,.grid-editor ::ng-deep .checkbox-container{margin:0!important;padding:0;min-height:0!important;height:23px}.grid-editor ::ng-deep .validation-message,.grid-editor ::ng-deep .checkbox-label{display:none}.grid-editor ::ng-deep input,.grid-editor ::ng-deep input:focus,.grid-editor ::ng-deep textarea{box-sizing:border-box;width:100%;height:23px!important;min-height:0!important;margin:0!important;padding:0 4px;border:1px solid #4465C9;border-radius:0;box-shadow:none;font-size:inherit;line-height:normal;resize:none}.grid-editor ::ng-deep input.ng-invalid.ng-touched,.grid-editor ::ng-deep input.ng-invalid.ng-dirty{border-color:#f78383}.grid-editor ::ng-deep input[type=checkbox]{width:auto}.grid-editor ::ng-deep .ng-select .ng-select-container{color:#4d5a81;min-height:0!important;height:23px!important;border-radius:0;border-color:#4465c9}.grid-editor ::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{top:0}.grid-editor ::ng-deep .ng-select .ng-select-container .ng-value-container{padding-top:0}.grid-editor ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input>input{height:100%!important;border:none}.grid-editor ::ng-deep .form-group>div{flex:1;min-width:0;width:100%}.grid-editor ::ng-deep .ng-select{width:100%}.grid-editor ::ng-deep alg-selector{display:flex;width:100%;height:23px}.grid-editor ::ng-deep .input-select-default,.grid-editor ::ng-deep .input-select-default.with-button{flex:1;min-width:0;padding-right:0;margin-right:0}.grid-editor ::ng-deep .input-group-btn{float:none}.grid-editor ::ng-deep .btn,.grid-editor ::ng-deep .btn-32,.grid-editor ::ng-deep .btn-input-select{height:23px;width:23px;padding:0;line-height:1;border-radius:0}.grid-editor ::ng-deep .input-with-button{display:flex;height:23px}.grid-editor ::ng-deep .switch{margin:2px 0 0 4px;transform:scale(.7);transform-origin:left top}::ng-deep body.dg-column-dragging,::ng-deep body.dg-column-dragging *{cursor:grabbing!important;-webkit-user-select:none!important;user-select:none!important}\n"]
+			template: "<div #datagridContainer [class]=\"this.datagridClass\" tabindex=\"-1\" (keydown)=\"onGridKeyDown($event)\" (scroll)=\"onGridScroll($event)\"\r\n    (copy)=\"onCopy($event)\" (paste)=\"onPaste($event)\" (contextmenu)=\"openEmptyAreaContextMenu($event)\">\r\n    <ng-container>\r\n        <table class=\"data-grid-datatable\">\r\n            <ng-container *ngIf=\"this.facade.style as ctx\">\r\n                <ng-container *ngIf=\"this.facade.config.columns$ | async as rcolumns\">\r\n                    <thead>\r\n                        <tr>\r\n                            <th class=\"header row-state\" (click)=\"addFilterQuery()\"></th>\r\n                            <!-- En-tête : poignée de déplacement à gauche, intitulé, indicateur de tri,\r\n                                 flèche du menu (tri, agrégation) à droite. Le clic ne trie plus. -->\r\n                            <th #thHeader *ngFor=\"let col of rcolumns;let i = index\"\r\n                                    [attr.id]=\"guid.toString() + '-col-' + col.Property\"\r\n                                    [attr.class]=\"'header' | gridStyle : ctx : { column : col }\"\r\n                                    [style.width.px]=\"colWidth(col)\" [style.min-width.px]=\"colWidth(col)\" [style.max-width.px]=\"colWidth(col)\"\r\n                                    [attr.data-frozen]=\"isFrozen(i) ? '' : null\" [style.left.px]=\"frozenLeft(i)\">\r\n                                <div class=\"header-cell\"\r\n                                    [class.col-dragging]=\"draggedColumn === col.Property\">\r\n                                    <span class=\"header-handle\" title=\"Déplacer la colonne\"\r\n                                        (mousedown)=\"onHeaderMouseDown(col, $event)\">\r\n                                        <i class=\"fa fa-ellipsis-v\"></i>\r\n                                    </span>\r\n                                    <label>{{ getHeaderLabel(col) }}</label>\r\n                                    <i *ngIf=\"this.facade.filter.isAsc(col.Property)\" class=\"fa fa-long-arrow-up header-sort\" title=\"Tri croissant\"></i>\r\n                                    <i *ngIf=\"this.facade.filter.isDesc(col.Property)\" class=\"fa fa-long-arrow-down header-sort\" title=\"Tri décroissant\"></i>\r\n                                    <sup *ngIf=\"this.facade.filter.sortRank(col.Property) > 0\" class=\"header-sort-rank\"\r\n                                        title=\"Rang dans le tri personnalisé\">{{ this.facade.filter.sortRank(col.Property) }}</sup>\r\n                                    <i *ngIf=\"activeAggregations[col.Property]\" class=\"header-agg\" [title]=\"'Agrégation : ' + aggregationLabel(activeAggregations[col.Property])\">Σ</i>\r\n                                    <!-- Dernière colonne suivie de la colonne vide de fin : sa flèche est dans la colonne vide. -->\r\n                                    <button type=\"button\" class=\"header-menu-button\" title=\"Trier, agréger\"\r\n                                        *ngIf=\"!(ctx.enableLastColumnResize && i === rcolumns.length - 1)\"\r\n                                        [class.open]=\"headerMenu?.column.Property === col.Property\"\r\n                                        (click)=\"toggleHeaderMenu(col, $event)\">\r\n                                        <i class=\"fa fa-caret-down\"></i>\r\n                                    </button>\r\n                                </div>\r\n                                <!-- Bord droit : largeur de la colonne (tirer), ajustée au contenu (double clic). -->\r\n                                <span class=\"col-resizer\" title=\"Largeur de la colonne (double clic : ajuster au contenu)\"\r\n                                    (mousedown)=\"startResize(col, $event)\" (dblclick)=\"autoFitColumn(col, $event)\"\r\n                                    (click)=\"$event.stopPropagation()\"></span>\r\n                            </th>\r\n                            <th *ngIf=\"ctx.enableLastColumnResize\" #lastColumnHeader class=\"header last-column\"\r\n                                (contextmenu)=\"openHeaderContextMenu($event, rcolumns[rcolumns.length - 1])\">\r\n                                <div class=\"header-cell header-cell-end\" *ngIf=\"rcolumns.length > 0\">\r\n                                    <button type=\"button\" class=\"header-menu-button\" title=\"Trier, agréger\"\r\n                                        [class.open]=\"headerMenu?.column.Property === rcolumns[rcolumns.length - 1].Property\"\r\n                                        (click)=\"toggleHeaderMenu(rcolumns[rcolumns.length - 1], $event)\">\r\n                                        <i class=\"fa fa-caret-down\"></i>\r\n                                    </button>\r\n                                </div>\r\n                            </th>\r\n\r\n                        </tr>\r\n                        <ng-container *ngIf=\"this.facade.filter.additionalQuery$ | async as additionalQuery\">\r\n                            <tr #thFilterRows *ngFor=\"let filterRow of additionalQuery.Rows;let i = index\" >\r\n                                <th class=\"filter-header row-state\" (click)=\"removeFilterQuery(i)\"></th>\r\n                                <th class=\"filter-header\" [ngClass]=\"{disabled: !col.IsFilterEnabled}\" *ngFor=\"let col of rcolumns;let i = index\"\r\n                                    [attr.id]=\"guid.toString() + '-filter-' + i\">\r\n                                    <input *ngIf=\"col.IsFilterEnabled\" type=\"text\"\r\n                                        class=\"filter-header-input\"\r\n                                        name=\"keyword\"\r\n                                        #uniquename=\"ngModel\"\r\n                                        [attr.id]=\"guid.toString() + '-filter-input-' + col.Property\"\r\n                                        [placeholder]=\"filterRow.ClausesByPropertyName.get(col.Property).FilterValues?.length ? 'Filtre avancé : ' + filterRow.ClausesByPropertyName.get(col.Property).FilterValues.length + ' valeur(s)' : ''\"\r\n                                        [(ngModel)]=\"filterRow.ClausesByPropertyName.get(col.Property).FilterValue\"\r\n                                        (ngModelChange)=\"handleFilterChanged($event, filterRow, col.Property)\"\r\n                                        (change)=\"validateFilterChanged($event, filterRow, col.Property)\"\r\n                                    />\r\n                                </th>\r\n                                <ng-container>\r\n                                    <th #lastColumnFilter class=\"filter-header last-column\"></th>\r\n                                </ng-container>\r\n                            </tr>\r\n                        </ng-container>\r\n                    </thead>\r\n\r\n                    <tbody>\r\n                        <ng-container *ngIf=\"this.facade.data\">\r\n                            <ng-container *ngFor=\"let row of this.data.Values; let r = index;\">\r\n                            <tr\r\n                                [class]=\"'alternating' | gridStyle : ctx : { row : row, index : r, maxIndex : this.data.Values.length, hasAggregates: hasAggregates  }\"\r\n                                [class.selected]=\"isRowSelected(row)\"\r\n                                [attr.id]=\"guid.toString() + '-row-' + row.Id\"\r\n                                (mousedown)=\"onRowMouseDown(row, $event)\"\r\n                                (mouseup)=\"onRowMouseUp(row, $event)\"\r\n                                (click)=\"onRowClick(row, $event)\"\r\n\r\n                                [rowRef]=\"guid + '-row-' + row.Id\"\r\n                            >\r\n\r\n                            <th [attr.class]=\"'rowstate' | gridStyle : ctx : { row : row }\">\r\n                                <ng-container *ngIf=\"selectionStyler.isModified(row) && !selectionStyler.isInvalid(row) && !selectionStyler.isWarning(row)\">\r\n                                    <div class=\"new-rowstate\"><span>...</span></div>\r\n                                </ng-container>\r\n\r\n                                <ng-container *ngIf=\"selectionStyler.isInvalid(row)\">\r\n                                    <div> <img class=\"error-row-icon\" src=\"assets/images/error.svg\" /> </div>\r\n                                </ng-container>\r\n\r\n                                <ng-container *ngIf=\"selectionStyler.isWarning(row) && !selectionStyler.isInvalid(row)\">\r\n                                    <div> <img class=\"error-row-icon\" src=\"assets/images/warning.svg\" /> </div>\r\n                                </ng-container>\r\n\r\n                                <ng-container *ngIf=\"ctx.displayDetail\">\r\n                                    <button type=\"button\" [attr.id]=\"row.Id + '_button'\" class=\"toggle-button btn\" (click)=\"toggleDetail(row)\">\r\n                                        <i class=\"fa fa-chevron-right fa-custom\"></i>\r\n                                    </button>\r\n                                </ng-container>\r\n                            </th>\r\n\r\n                            <td *ngFor=\"let column of rcolumns; index as i\"\r\n                                [attr.id]=\"cellId(row, column)\"\r\n                                [style.max-width.px]=\"colWidth(column)\" [attr.data-sized]=\"colWidth(column) ? '' : null\"\r\n                                [attr.data-frozen]=\"isFrozen(i) ? '' : null\" [style.left.px]=\"frozenLeft(i)\"\r\n                                [class]=\"'cell' | gridStyle : ctx : { row : row,column : column,index : r }\"\r\n                                [class.selected]=\"isRowSelected(row)\"\r\n                                (mousedown)=\"onCellMouseDown(r, i, $event)\"\r\n                                (mouseenter)=\"onCellMouseEnter(r, i, $event)\"\r\n                                (click)=\"onCellClick(row, column)\"\r\n                                (dblclick)=\"onCellDblClick(row, column)\">\r\n\r\n                                <alg-datagrid-cell #dataGridCellComponent\r\n                                    class=\"gridcell-container\"\r\n                                    [entity]=\"row\"\r\n                                    [isEditable]=\"canEditCell(row, column)\"\r\n                                    [property]=\"column.Property\"\r\n                                    [managed]=\"true\"\r\n                                    [mode]=\"showEditor(row, column) ? 'edit' : 'view'\"\r\n                                    [class.grid-cursor]=\"isCursorCell(row, column)\"\r\n                                    [class.grid-range]=\"isInRange(r, i)\"\r\n                                    (contextmenu)=\"openContextMenu($event, row, column)\">\r\n\r\n                                    <ng-template alg-editMode>\r\n                                        <!-- Éditeur du champ du formulaire qui correspond à la colonne (sinon déduit de la colonne), à la hauteur de la ligne. -->\r\n                                        <alg-field class=\"grid-editor\"\r\n                                            [field]=\"getEditField(column)\"\r\n                                            [form]=\"getRowForm(row)\"\r\n                                            [showLabel]=\"false\"\r\n                                            (propertyChanged)=\"onCellChanged(row, $event)\"\r\n                                            >\r\n                                            <!-- [focusable]=\"cellFocus\" -->\r\n                                        </alg-field>\r\n                                    </ng-template>\r\n                                    <ng-template alg-viewMode>\r\n\r\n                                        <div [ngSwitch]=\"column.Display?.type\" *ngIf=\"!isUndefined(row[column.Property])\">\r\n                                            <div *ngSwitchCase=\"'url'\">\r\n                                                <a [routerLink]=\"[$safeNavigationMigration(column.Display?.baseUrl),row[column.Property]]\">\r\n                                                    {{ row.Id || row[column.Property] }}\r\n                                                </a>\r\n                                            </div>\r\n\r\n                                            <div *ngSwitchCase=\"'img'\" class=\"image\">\r\n                                                <img *ngIf=\"column.Display?.imagePath?.length == 0\"\r\n                                                    [src]=\"(column.Display?.imgBase || '') + (column.Display?.sourceProperty ? row[column.Display?.sourceProperty] : row[column.Property])\" />\r\n\r\n                                                <alg-image *ngIf=\"column.Display?.imagePath?.length != 0\"\r\n                                                    [imageUrl]=\"this.getEnumImageUrl(row,column)\" [imageHeight]=\"20\" [imageWidth]=\"20\">\r\n                                                </alg-image>\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"!isUndefined(column.ToolTipProperty)\">\r\n                                                    {{ row[column.ToolTipProperty] }}\r\n                                                </div>\r\n                                            </div>\r\n\r\n                                            <div *ngSwitchCase=\"'img-file'\" class=\"image\">\r\n\r\n                                                <alg-image\r\n                                                    [imageUrl]=\"this.getImageUrl(row,column)\" [wide]=\"true\" [imageHeight]=\"40\" [imageWidth]=\"40\">\r\n                                                </alg-image>\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"!isUndefined(column.ToolTipProperty)\">\r\n                                                    {{ row[column.ToolTipProperty] }}\r\n                                                </div>\r\n                                            </div>\r\n\r\n                                            <div *ngSwitchCase=\"'wide-img'\" class=\"image\">\r\n                                                <img *ngIf=\"column.Display?.imagePath?.length == 0\"\r\n                                                    [src]=\"(column.Display?.imgBase || '') + (column.Display?.sourceProperty ? row[column.Display?.sourceProperty] : row[column.Property])\" />\r\n\r\n                                                <alg-image *ngIf=\"column.Display?.imagePath?.length != 0\" [wide]=\"true\"\r\n                                                    [imageUrl]=\"this.getEnumImageUrl(row,column)\" [imageHeight]=\"40\" [imageWidth]=\"40\">\r\n                                                </alg-image>\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"!isUndefined(column.ToolTipProperty)\">\r\n                                                    {{ row[column.ToolTipProperty] }}\r\n                                                </div>\r\n                                            </div>\r\n\r\n                                            <span *ngSwitchCase=\"'date'\">\r\n                                                {{row[column.Property]| date: column.Display?.format || 'dd/MM/yyyy'}}\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'boolean'\">{{row[column.Property] ? 'OUI' : 'NON'}} </span>\r\n\r\n                                            <span *ngSwitchCase=\"'datetime'\">{{row[column.Property] | date: column.Display?.format || 'dd/MM/yyyy HH:mm:ss'}}</span>\r\n\r\n                                            <span *ngSwitchCase=\"'money'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\"\r\n                                                class=\"money\">\r\n                                                {{\r\n                                                    row[column.Property]\r\n                                                    | currency: column.Display?.currency\r\n                                                    || (column.Display?.sourceProperty && row[column.Display?.sourceProperty] ? row[column.Display?.sourceProperty] : false)\r\n                                                    || 'EUR' : 'symbol'\r\n\r\n                                                    | todefine: $safeNavigationMigration(column.Display?.handleError)\r\n                                                }}\r\n\r\n                                                <div class=\"tool-tip\" *ngIf=\"ctx.showOnToolTip(row,column)\">\r\n                                                    {{ctx.showOnToolTip(row,column)}}\r\n                                                </div>\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'percent'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\">\r\n                                                {{row[column.Property] * $safeNavigationMigration(column.Display?.multiplier) | percent : column.Display?.format\r\n                                                || '1.0-2' | todefine: $safeNavigationMigration(column.Display?.handleError)}}\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'number'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\">\r\n                                                {{row[column.Property] * $safeNavigationMigration(column.Display?.multiplier) | number: column.Display?.format\r\n                                                || '1.0-3' | todefine : $safeNavigationMigration(column.Display?.handleError)}}\r\n                                            </span>\r\n\r\n                                            <span *ngSwitchCase=\"'fixedsizeinteger'\"\r\n                                                [class.red]=\"!row[column.Property] && column.Display?.handleError\">\r\n                                                {{row[column.Property] | tofixedsizeinteger : $safeNavigationMigration(column.Display?.completingCaracter) : $safeNavigationMigration(column.Display?.width) }}\r\n                                            </span>\r\n                                            <span *ngSwitchDefault [innerText]=\"column.Property == 'Id' ? (row[column.Property] < 0 ? '' : row[column.Property]) : row[column.Property]\">\r\n                                            </span>\r\n                                        </div>\r\n\r\n                                        <div *ngIf=\"isUndefined(row[column.Property])\">\r\n                                            <span *ngIf=\"!isUndefined($safeNavigationMigration(column.Display?.nullCaseText))\" class=\"mw-invalid\">\r\n                                                {{ column.Display?.nullCaseText }}\r\n                                            </span>\r\n\r\n                                            <span *ngIf=\"isUndefined($safeNavigationMigration(column.Display?.nullCaseText))\">\r\n                                                &nbsp;&nbsp;&nbsp;\r\n                                            </span>\r\n                                        </div>\r\n\r\n                                    </ng-template>\r\n\r\n                                </alg-datagrid-cell>\r\n                            </td>\r\n                            <ng-container *ngIf=\"ctx.enableLastColumnResize\">\r\n                                <!-- Colonne vide de fin : clic droit = menu de la dernière colonne. -->\r\n                                <td (contextmenu)=\"openContextMenu($event, row, rcolumns[rcolumns.length - 1])\"></td>\r\n                            </ng-container>\r\n                            </tr>\r\n                            </ng-container>\r\n                        </ng-container>\r\n                    </tbody>\r\n\r\n                    <tfoot>\r\n                        <tr class=\"empty-row\" *ngIf=\"hasAggregates\">\r\n                             <td></td>\r\n                        </tr>\r\n                        <tr class=\"aggregation-row\" *ngIf=\"hasAggregates\">\r\n                            <td class=\"row-state\"></td>\r\n                            <td *ngFor=\"let column of rcolumns; index as i\" [attr.class]=\"'cell' | gridStyle : ctx : { column : column, index : i }\"\r\n                                [attr.data-frozen]=\"isFrozen(i) ? '' : null\" [style.left.px]=\"frozenLeft(i)\">\r\n\r\n                                <ng-container *ngFor=\"let agg of columnAggregates[column.Property]\">\r\n\r\n                                    <span class=\"agg-label\">{{ aggregationLabel(agg.op) }}</span>\r\n                                    <span [ngSwitch]=\"agg.op === 'COUNT' ? 'count' : column.Display?.type\">\r\n\r\n                                        <span *ngSwitchCase=\"'count'\">{{ agg.value | number: '1.0-0' }}</span>\r\n                                        <span *ngSwitchCase=\"'percent'\">{{ agg.value | number: column.Display?.format || '1.0-3' }}</span>\r\n                                        <span *ngSwitchCase=\"'fixedsizeinteger'\">{{ agg.value | number: column.Display?.format || '1.0-3' }}</span>\r\n\r\n                                        <span *ngSwitchCase=\"'money'\" class=\"money\">\r\n                                            {{ agg.value | currency: getColCurrency(column) }}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchCase=\"'date'\">\r\n                                            {{agg.value | date: column.Display?.format || 'dd/MM/yyyy'}}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchCase=\"'datetime'\">\r\n                                            {{agg.value | date: column.Display?.format || 'dd/MM/yyyy HH:mm:ss'}}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchCase=\"'number'\">\r\n                                            {{agg.value | number: column.Display?.format || '1.0-3'}}\r\n                                        </span>\r\n\r\n                                        <span *ngSwitchDefault>\r\n                                            {{agg.value}}\r\n                                        </span>\r\n\r\n                                    </span>\r\n\r\n                                </ng-container>\r\n\r\n                            </td>\r\n\r\n                            <ng-container *ngIf=\"ctx.enableLastColumnResize\">\r\n                                <td class=\"last-column\"></td>\r\n                            </ng-container>\r\n\r\n                        </tr>\r\n                    </tfoot>\r\n                </ng-container>\r\n            </ng-container>\r\n        </table>\r\n    </ng-container>\r\n</div>\r\n\r\n\r\n<!-- Emplacement visé par une colonne déplacée : trait orange sur la séparation des deux en-têtes. -->\r\n<div class=\"col-drop-indicator\" *ngIf=\"dropIndicator\"\r\n    [ngStyle]=\"{ left: dropIndicator.left + 'px', top: dropIndicator.top + 'px', height: dropIndicator.height + 'px' }\"></div>\r\n\r\n<!-- Menu d'une colonne (flèche de l'en-tête ou clic droit sur une cellule), en trois zones séparées\r\n     par un trait : Tri (sous-menu « Trier »), Actions (celles du panneau des actions), Fonctions (sous-menu « Fonctions »). -->\r\n<div class=\"header-menu\" *ngIf=\"headerMenu\"\r\n    [ngStyle]=\"{ top: headerMenu.y + 'px', left: headerMenu.x + 'px', visibility: headerMenu.ready ? 'visible' : 'hidden' }\"\r\n    (click)=\"$event.stopPropagation()\" (contextmenu)=\"$event.preventDefault()\">\r\n    <ul>\r\n        <!-- Tri : sous-menu « Trier » (croissant, décroissant, personnalisé). -->\r\n        <li class=\"has-submenu\" [class.open]=\"headerMenu.submenu === 'sort'\"\r\n            [class.checked]=\"this.facade.filter.isAsc(headerMenu.column.Property) || this.facade.filter.isDesc(headerMenu.column.Property) || this.facade.filter.getSortList().length > 1\"\r\n            (mouseenter)=\"setSubmenu('sort')\" (click)=\"setSubmenu('sort')\">\r\n            <i class=\"fa fa-sort\"></i><span>Trier</span><i class=\"fa fa-caret-right submenu-caret\"></i>\r\n\r\n            <ul class=\"header-submenu\" *ngIf=\"headerMenu.submenu === 'sort'\"\r\n                [class.left]=\"headerMenu.submenuLeft\" [class.up]=\"headerMenu.submenuUp\"\r\n                (click)=\"$event.stopPropagation()\">\r\n                <li [class.checked]=\"this.facade.filter.isAsc(headerMenu.column.Property)\" (click)=\"sortColumn('asc')\">\r\n                    <i class=\"fa fa-sort-amount-asc\"></i><span>Par ordre croissant</span>\r\n                </li>\r\n                <li [class.checked]=\"this.facade.filter.isDesc(headerMenu.column.Property)\" (click)=\"sortColumn('desc')\">\r\n                    <i class=\"fa fa-sort-amount-desc\"></i><span>Par ordre décroissant</span>\r\n                </li>\r\n                <li [class.checked]=\"this.facade.filter.getSortList().length > 1\" (click)=\"openCustomSort()\">\r\n                    <i class=\"fa fa-sort\"></i><span>Tri personnalisé…</span>\r\n                </li>\r\n            </ul>\r\n        </li>\r\n        <!-- Filtre sur la valeur de la cellule (clic droit sur une cellule) : première ligne des filtres composés. -->\r\n        <li *ngIf=\"cellFilterValue() !== undefined\" (click)=\"filterOnCell()\" (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-filter\"></i><span>Filtrer sur « {{ cellFilterLabel() }} »</span>\r\n        </li>\r\n        <!-- Filtre avancé : valeurs distinctes de la colonne sur les résultats, à cocher (condition « dans la liste »). -->\r\n        <li *ngIf=\"headerMenu.column.IsFilterEnabled\" class=\"has-submenu\" [class.open]=\"headerMenu.submenu === 'distinct'\"\r\n            [class.checked]=\"this.facade.filter.getFilterValues(headerMenu.column.Property).length > 0\"\r\n            (mouseenter)=\"setSubmenu('distinct')\" (click)=\"setSubmenu('distinct')\">\r\n            <i class=\"fa fa-filter\"></i><span>Filtre avancé</span><i class=\"fa fa-caret-right submenu-caret\"></i>\r\n\r\n            <ul class=\"header-submenu header-submenu-distinct\" *ngIf=\"headerMenu.submenu === 'distinct'\"\r\n                [class.left]=\"headerMenu.submenuLeft\" [class.up]=\"headerMenu.submenuUp\"\r\n                (click)=\"$event.stopPropagation()\">\r\n                <alg-grid-distinct-filter [facade]=\"this.facade\" [entityKey]=\"this.entityKey\" [property]=\"headerMenu.column.Property\"\r\n                    (done)=\"closeViewMenu()\" (loaded)=\"onViewMenuLoaded()\"></alg-grid-distinct-filter>\r\n            </ul>\r\n        </li>\r\n        <!-- Affichage : vues personnalisées (cochée = affichée), puis « Modifier… ». -->\r\n        <li *ngIf=\"this.facade.config.viewChooser\" class=\"has-submenu\" [class.open]=\"headerMenu.submenu === 'columns'\"\r\n            (mouseenter)=\"setSubmenu('columns')\" (click)=\"setSubmenu('columns')\">\r\n            <i class=\"fa fa-columns\"></i><span>Affichage</span><i class=\"fa fa-caret-right submenu-caret\"></i>\r\n\r\n            <ul class=\"header-submenu header-submenu-columns\" *ngIf=\"headerMenu.submenu === 'columns'\"\r\n                [class.left]=\"headerMenu.submenuLeft\" [class.up]=\"headerMenu.submenuUp\"\r\n                (click)=\"$event.stopPropagation()\">\r\n                <alg-grid-view-menu [chooser]=\"this.facade.config.viewChooser\" (done)=\"closeViewMenu()\" (loaded)=\"onViewMenuLoaded()\"></alg-grid-view-menu>\r\n            </ul>\r\n        </li>\r\n        <!-- Colonnes figées à gauche, de la première jusqu'à celle-ci. -->\r\n        <li [class.checked]=\"isFrozen(columnIndex(headerMenu.column))\" (click)=\"toggleFrozen()\" (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-thumb-tack\"></i>\r\n            <span>{{ frozenUntil === columnIndex(headerMenu.column) ? 'Libérer les colonnes' : 'Figer jusqu\\'à cette colonne' }}</span>\r\n        </li>\r\n        <li *ngIf=\"frozenUntil !== undefined && frozenUntil !== columnIndex(headerMenu.column)\"\r\n            (click)=\"unfreezeColumns()\" (mouseenter)=\"setSubmenu(undefined)\">\r\n            <i class=\"fa fa-unlock\"></i><span>Libérer les colonnes</span>\r\n        </li>\r\n\r\n        <!-- Actions -->\r\n        <ng-container *ngIf=\"visibleActions.length > 0\">\r\n            <li class=\"separator\"></li>\r\n            <ng-container *ngFor=\"let action of visibleActions\">\r\n                <ng-container *ngIf=\"{ disabled: (action.disabled$ | async) } as state\">\r\n                    <li class=\"menu-action\" [class.disabled]=\"state.disabled\"\r\n                        (click)=\"executeMenuAction(action, state.disabled)\" (mouseenter)=\"setSubmenu(undefined)\">\r\n                        <img class=\"menu-action-icon\" [src]=\"getActionImageUrl(action.icon)\" [alt]=\"action.title\" />\r\n                        <span>{{ action.title }}</span>\r\n                    </li>\r\n                </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n\r\n        <!-- Affichage -->\r\n        <li class=\"separator\"></li>\r\n        <li class=\"has-submenu\" [class.open]=\"headerMenu.submenu === 'display'\"\r\n            (mouseenter)=\"setSubmenu('display')\" (click)=\"setSubmenu('display')\">\r\n            <i class=\"fa fa-calculator\"></i><span>Fonctions</span><i class=\"fa fa-caret-right submenu-caret\"></i>\r\n\r\n            <ul class=\"header-submenu\" *ngIf=\"headerMenu.submenu === 'display'\"\r\n                [class.left]=\"headerMenu.submenuLeft\" [class.up]=\"headerMenu.submenuUp\"\r\n                (click)=\"$event.stopPropagation()\">\r\n                <li *ngFor=\"let op of getAggregationOptions(headerMenu.column)\"\r\n                    [class.checked]=\"activeAggregations[headerMenu.column.Property] === op\"\r\n                    (click)=\"aggregateColumn(op)\">\r\n                    <i class=\"fa fa-check\"></i><span>{{ aggregationLabel(op) }}</span>\r\n                </li>\r\n                <ng-container *ngIf=\"activeAggregations[headerMenu.column.Property]\">\r\n                    <li class=\"separator\"></li>\r\n                    <li (click)=\"aggregateColumn(null)\">\r\n                        <i class=\"fa fa-times\"></i><span>Ne plus afficher</span>\r\n                    </li>\r\n                </ng-container>\r\n            </ul>\r\n        </li>\r\n    </ul>\r\n</div>\r\n\r\n",
+			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}:host{flex:1}.header.last-column{border-left:none!important;width:100%}table thead .sorting,table thead .sorting_asc,table thead .sorting_desc,table thead .sorting_asc_disabled,table thead .sorting_desc_disabled{background-repeat:no-repeat;background-position:center right}table thead th:first-child,table tfoot tr:first-child{position:sticky;left:0;z-index:2}table tbody th:first-child{position:sticky;left:0;z-index:1;border-right:none}table tbody th:first-child div{text-align:center;vertical-align:middle;line-height:20px}table tbody tr.row-odd th:first-child{background:#ebf0ff}table tbody tr.selected.row-odd.mw-invalid th:first-child,table tbody tr.selected.row-even.mw-invalid th:first-child,table tbody tr.selected.row-odd.mw-warning th:first-child,table tbody tr.selected.row-even.mw-warning th:first-child,table tbody tr.selected.row-even th:first-child,table tbody tr.selected.row-odd th:first-child{background-color:#8ea7f8;color:#fff}table tbody tr.row-odd.mw-invalid th:first-child,table tbody tr.row-even.mw-invalid th:first-child{background-color:#f2dede}table tbody tr.row-odd.mw-warning th:first-child,table tbody tr.row-even.mw-warning th:first-child{background-color:#fff4de}table thead th{position:-webkit-sticky;position:sticky;top:0;z-index:1;background:#fff;border-left:1px solid #3C5DC4;border-bottom:1px solid #3C5DC4}table thead .sorting{background-image:none;cursor:pointer}table thead .sorting_asc{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowMTgwMTE3NDA3MjA2ODExQjM4MkY2QzVGRUYwRTJDNCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo4MkFEQzYxNjIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4MkFEQzYxNTIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjAyODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAxODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+z5ABTAAAAI5JREFUeNpi/P//PwO1ABMDFQELIQXVjfe4gFQbEJe11iv9otRl2UCcBcSphBQy4gszoKu0gNROIJYB4jtA7AF03V2SXQY0iBFIFUMNAgEVIM6DipPsTQcgDkQTSwRia5IMA9rOC6RqgVgQTQokXgOUZyfFZSFQF/zAgh2BOIjkCBjQRDtq2Khh9DAMIMAAT9AmNBDSXegAAAAASUVORK5CYII=);cursor:pointer}table thead .sorting_desc{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowMTgwMTE3NDA3MjA2ODExQjM4MkY2QzVGRUYwRTJDNCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo4MkFEQzYxQTIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4MkFEQzYxOTIyQzExMUUxQTFGMUFEQUQ1QjJBNTM4QyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjAyODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAxODAxMTc0MDcyMDY4MTFCMzgyRjZDNUZFRjBFMkM0Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+1fsfwAAAAJdJREFUeNpi/P//PwO1ABMDFcGoYaOG0cMwFmyC1Y33IoHUAiD+h8MBGa31SvOJddk6IN4PxBxY8FEgXkO0N4G2/gRSLUD8GU3qPRA3A+U/kxpmIBege2U9EB/ApYERX6kBDDtlILUDiFWA+AkQuwNddY2s2ARqvAukJgDxbyCehM8gnLGJBmYDsSoQTyWkkHHQFo4AAQYAAA0piq4hbqwAAAAASUVORK5CYII=);cursor:pointer}table thead .sorting_asc_disabled,table thead .sorting_desc_disabled{background-image:none}.checkbok-container{align-items:center;margin:0;padding:0}.gridcell-container{padding:0;min-width:fit-content}.gridcell-container input[type=number]{display:block;size:1;font-size:10pt;width:100%!important;height:100%;margin:0!important;border:2px solid #F78383}.datagrid-custom-container{height:100%;overflow:auto;margin-left:-1px}.data-grid-datatable{table-layout:fixed;cursor:pointer;border-spacing:0px}.data-grid-datatable td{box-shadow:none;padding:2px 5px;white-space:nowrap}.data-grid-datatable td.row-state{padding:2px 5px;width:16px}.data-grid-datatable td.img{padding:2px 5px}.data-grid-datatable td.row-state img{height:16px;width:16px;margin-top:-3px;padding:0}.data-grid-datatable tr{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.header{vertical-align:bottom;padding:2px 5px 2px 0;font-weight:400;color:#3c5dc4;white-space:nowrap;line-height:25px;min-width:32px;margin-bottom:5px}.header.img{min-width:16px}.header.row-state{min-width:27px;position:-webkit-sticky;position:sticky;top:0;left:0;z-index:2;background:#fff;border-left:none;border-right:none}.filter-header{background-color:#f7f7f7!important}.filter-header.disabled{background-color:#9fa9c7!important}.filter-header.row-state:hover:before{position:relative;display:block;float:left;width:16px;height:16px;content:\" \";background-size:16px 16px;-webkit-background-size:16px 16px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"57\" height=\"57\" viewBox=\"0 0 57 57\">%0D%0A  <path id=\"Rond_Croix\" data-name=\"Rond Croix\" d=\"M28.5,57A28.5,28.5,0,0,1,8.347,8.347,28.5,28.5,0,1,1,48.652,48.652,28.317,28.317,0,0,1,28.5,57Zm0-24.036h0l11.9,11.9L44.869,40.4,32.964,28.5,44.869,16.593,40.4,12.129,28.5,24.034,16.594,12.129l-4.465,4.464L24.034,28.5,12.129,40.4l4.463,4.465L28.5,32.965Z\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 0 0 3px;filter:brightness(0) saturate(100%) invert(70%) sepia(93%) saturate(1540%) hue-rotate(309deg) brightness(105%) contrast(94%)}.filter-header-input{height:calc(100% - 2px);width:calc(100% - 2px);margin:0;border:none!important;background-color:#f7f7f7;padding:0 0 0 5px;color:#4d5a81}.header.row-state:before{position:relative;display:block;float:left;width:16px;height:16px;content:\" \";background-size:16px 16px;-webkit-background-size:16px 16px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->%0D%0A<path fill=\"currentColor\" d=\"M3.9 54.9C10.5 40.9 24.5 32 40 32l432 0c15.5 0 29.5 8.9 36.1 22.9s4.6 30.5-5.2 42.5L320 320.9 320 448c0 12.1-6.8 23.2-17.7 28.6s-23.8 4.3-33.5-3l-64-48c-8.1-6-12.8-15.5-12.8-25.6l0-79.1L9 97.3C-.7 85.4-2.8 68.8 3.9 54.9z\"/></svg>');background-repeat:no-repeat;margin:0 0 3px 5px;filter:brightness(0) saturate(100%) invert(56%) sepia(79%) saturate(2301%) hue-rotate(202deg) brightness(92%) contrast(91%)}.filter-header.last-column{border-left:none!important}.header label{cursor:pointer;margin-bottom:0;margin-right:10px;padding-left:5px;width:100%}.row-odd{background-color:#ebf0ff;border-left:1px solid #C1D0FD;border-bottom:1px solid #C1D0FD}.row-even{background-color:#f7faff;border-left:1px solid #C1D0FD;border-bottom:1px solid #C1D0FD}.error-row-icon{padding:2px;width:20px}.selected{background-color:#8ea7f8;color:#fff}.mw-invalid{font-weight:600;background-color:#f2dede;border:1px solid var(--red-error)}.mw-invalid td{background-color:#f2dede!important}.data-grid-datatable tbody tr.mw-invalid>td,.data-grid-datatable tbody tr.mw-invalid>th{box-shadow:inset 0 1px 0 var(--red-error),inset 0 -1px 0 var(--red-error)}span.mw-invalid{padding:0 3px;color:var(--red-error);background-color:transparent}.mw-warning.selected,.mw-invalid.selected{background-color:#8ea7f8}.mw-warning.selected td,.mw-invalid.selected td{background-color:#8ea7f8!important}.mw-warning{font-weight:600;background-color:#fff4de;border:1px solid var(--orange-algorima)}.mw-warning td{background-color:#fff4de!important}.mw-modified{font-weight:600;border:1px solid var(--main-bg-color)}.first-row{border-top:none}.last-row,.last-row td{border-bottom:none!important}.data-grid-datatable>tbody>tr{z-index:50}.image{position:relative;display:flex;flex-direction:row}.image img{height:20px;width:auto}td.money{position:relative}.tool-tip{visibility:hidden;background-color:#424242;color:#fff;text-align:left;border-radius:3px;font-size:15px;position:absolute;z-index:1;top:-10%;left:150%;opacity:0;transition:opacity .3s;padding:5px 15px;white-space:nowrap;overflow:visible}.tool-tip:after{content:\" \";position:absolute;top:50%;right:100%;margin-top:-5px;border-width:5px;border-style:solid;border-color:transparent rgb(66,66,66) transparent transparent}.image:hover .tool-tip{visibility:visible;opacity:1}td.money:hover .tool-tip{visibility:visible;opacity:1;left:100%;height:28px;font-size:13px;margin-top:0;padding:5px 10px 10px}.disabled{pointer-events:none}.edit-mode{background-color:#fff;border:1px solid #4465C9;min-width:90px!important;height:30px!important}.edit-mode .form-group{min-height:0px}.edit-mode .inactivated{background-color:#dbe4ff80}.edit-mode .inactivated-fo{background-color:#dbe4ff}.edit-mode .ecartclass{border:2px solid #4465C9}.edit-mode .error-cell{font-weight:700;color:#f78383!important}.edit-mode .selected{color:#4d5a81}.highlight-1,.highlight-1.selected,.edit-mode.highlight-1.selected{background-color:#4d5a81!important;color:#fff!important}.highlight-2,.highlight-2.selected,.edit-mode.highlight-2.selected{background-color:#dbe4ff!important;color:#4d5a81!important}.highlight-3,.highlight-3.selected,.edit-mode.highlight-3.selected{background-color:#4465c9!important;color:#fff!important}.highlight-4,.highlight-4.selected,.edit-mode.highlight-4.selected{background-color:#f78383!important;color:#fff!important}.highlight-5,.highlight-5.selected{background-color:#4465c9!important;color:#fff}.fixed-column{position:-webkit-sticky;position:sticky;left:27px;z-index:2!important;border-left:none}.fixed-header{position:-webkit-sticky;position:sticky;left:27px;z-index:3!important;background:#fff}.has-focus{padding:0!important}.has-focus ::ng-deep input,.has-focus ::ng-deep input:focus-visible,.has-focus ::ng-deep input:focus{border-radius:.1;outline:none!important;width:100%;height:29px;min-height:0;margin:0;border:1px solid #4465C9}.has-focus ::ng-deep .form-group{margin-bottom:0;min-height:0}.has-focus ::ng-deep .field-container{margin-bottom:0}.edit-mode.has-focus{width:90px!important}.bordered{border-left:1px solid #14358f!important;border-right:1px solid #14358f!important}.match-keywords{color:var(--main-bg-color);font-weight:700}.datagrid-img img{height:20px;width:20px}.right-align{text-align:right}.left-align{text-align:left}.detail-div{height:0px;overflow:hidden;transition:all .2s linear;width:100%}.fa-custom{font-size:smaller}.detail-div-show{height:150px;transition:all .2s linear}.toggleable{visibility:collapse}.toggleable-show{visibility:visible}.toggle-button-down{transform:rotate(90deg);transition:all .2s linear}.no-result{color:#5272d3;height:100%;width:100%;padding:15px 15px 150px}.new-rowstate{display:flex;flex-direction:row;align-items:center;align-self:center;height:100%;width:100%}.new-rowstate span{height:100%;width:100%;margin-top:-6px}.context-menu{position:absolute;background:#ffffff26;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);box-shadow:0 4px 12px #0000004d;padding:8px;z-index:1000;min-width:75px;max-width:250px;transition:all .3s ease-in-out}.context-menu ul{list-style:none;margin:0;padding:0}.context-menu li{padding:10px 14px;cursor:pointer;border-radius:8px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}.context-menu li:hover{background:linear-gradient(135deg,#ffffff4d,#ffffff1a);transform:scale(1.02)}.context-menu li:active{transform:scale(.98)}.grid-container{overflow:auto;position:relative}.aggregation-row{position:sticky;bottom:0;z-index:50;background:#f7faff!important;background-color:#f7faff!important;font-weight:700;border-top:1px solid #4D5A81!important;border-bottom:1px solid #4D5A81!important}.aggregation-row td{background:#f7faff!important;background-color:#f7faff!important;border-top:1px solid #4D5A81!important;border-bottom:1px solid #4D5A81!important;border-left:none!important;border-right:none!important}.empty-row td{padding:0}.col-resizer{position:absolute;top:0;right:-5px;z-index:4;width:10px;height:100%;cursor:col-resize}.col-resizer:hover{background:#3c5dc440}.data-grid-datatable td[data-sized]{overflow:hidden;text-overflow:ellipsis}:where(.data-grid-datatable tbody tr,.data-grid-datatable tfoot tr){background-color:#fff}.data-grid-datatable td[data-frozen]{position:sticky;z-index:1;background-color:inherit}.data-grid-datatable thead th[data-frozen]{position:sticky;z-index:3}.data-grid-datatable td[data-frozen]:has(+td:not([data-frozen])),.data-grid-datatable thead th[data-frozen]:has(+th:not([data-frozen])){box-shadow:inset -2px 0 #3c5dc459}table thead th.header{background-image:none!important;cursor:default}.header-cell{position:relative;display:flex;align-items:center;gap:2px}.header-cell label{flex:1 1 auto;cursor:default;margin:0;padding-left:2px;overflow:hidden;text-overflow:ellipsis}.header-cell.col-dragging{opacity:.8}.dg-column-ghost{border:1px solid #C1D0FD;box-sizing:border-box}.col-drop-indicator{position:fixed;z-index:3100;width:1px;border-radius:0;background:var(--orange-algorima, #f59d0f);pointer-events:none}.header-cell-end{justify-content:flex-end;align-items:center;height:25px}.header-handle{flex-shrink:0;display:flex;align-items:center;justify-content:center;box-sizing:content-box;width:17px;height:20px;padding:0 2px;color:#3c5dc4;opacity:.35;cursor:grab}.header-handle:hover{opacity:1}.header-handle:active{cursor:grabbing}.header-sort,.header-agg{flex-shrink:0;color:#3c5dc4;font-size:11px;font-style:normal}.header-menu-button{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:16px;height:18px;padding:0;border:0;border-radius:3px;background:none;color:#3c5dc4;opacity:.5;cursor:pointer}.header-menu-button:hover,.header-menu-button.open{opacity:1;background:#4465c926}.header-menu{position:fixed;z-index:3000;width:230px;padding:4px 0;background:#fff;border:1px solid #DBE4FF;border-radius:5px;box-shadow:0 4px 14px #0003}.header-menu ul{margin:0;padding:0;list-style:none}.header-menu li{display:flex;align-items:center;gap:8px;padding:5px 12px;color:#3c5dc4;font-size:12.5px;cursor:pointer}.header-menu li i{width:14px;text-align:center;visibility:visible}.header-menu li:hover{background:#dbe4ff}.header-menu li.checked{font-weight:600}.header-menu li.separator{height:1px;margin:4px 0;padding:0;background:#dbe4ff;cursor:default}.header-menu li .fa-check{visibility:hidden}.header-menu li.checked>.fa-check{visibility:visible}.header-menu li.menu-action.disabled{opacity:.45;cursor:default}.header-menu li.menu-action.disabled:hover{background:none}.header-menu .menu-action-icon{width:14px;height:14px;filter:brightness(0) saturate(100%) invert(36%) sepia(91%) saturate(628%) hue-rotate(191deg) brightness(89%) contrast(85%) brightness(75%)}.header-menu li.has-submenu{position:relative}.header-menu li.has-submenu.open{background:#dbe4ff}.header-menu li.has-submenu .submenu-caret{margin-left:auto}.header-menu .header-submenu{position:absolute;top:-5px;left:100%;width:200px;padding:4px 0;background:#fff;border:1px solid #DBE4FF;border-radius:5px;box-shadow:0 4px 14px #0003;font-weight:400}.header-menu .header-submenu.left{left:auto;right:100%}.header-menu .header-submenu.header-submenu-distinct{width:240px}.header-menu .header-submenu.header-submenu-columns{width:240px;max-height:320px;overflow-y:auto}.header-menu .header-submenu .column-choice input[type=checkbox]{width:14px;margin:0;pointer-events:none}.header-menu .header-submenu .submenu-loading{opacity:.6;cursor:default}.header-menu .header-submenu .view-lock{margin-left:auto;padding-left:8px;opacity:.5;font-size:11px}.header-menu .header-submenu.up{top:auto;bottom:-5px}.header-sort-rank{flex-shrink:0;color:#3c5dc4;font-size:9px}.aggregation-row .agg-label{margin-right:4px;color:#3c5dc4;font-size:10.5px;opacity:.7}.datagrid-custom-container:focus,.datagrid-custom-container:focus-visible{outline:none}.data-grid-datatable td .image ::ng-deep img{display:block}.data-grid-datatable td:has(>.grid-cursor){outline:2px solid #4465C9;outline-offset:-2px}.data-grid-datatable td:has(>.grid-range){background-color:#4465c940!important;box-shadow:inset 0 0 0 1px #4465c980;color:#4d5a81!important}.data-grid-datatable td:has(>.grid-range) ::ng-deep *{color:#4d5a81!important}.data-grid-datatable td:has(.grid-editor){padding:0!important;background-color:#fff}.grid-editor{display:block;height:23px;overflow:visible;color:#4d5a81}.grid-editor ::ng-deep .field-container,.grid-editor ::ng-deep .form-group,.grid-editor ::ng-deep .form-group>div,.grid-editor ::ng-deep .checkbox-container{margin:0!important;padding:0;min-height:0!important;height:23px}.grid-editor ::ng-deep .validation-message,.grid-editor ::ng-deep .checkbox-label{display:none}.grid-editor ::ng-deep input,.grid-editor ::ng-deep input:focus,.grid-editor ::ng-deep textarea{box-sizing:border-box;width:100%;height:23px!important;min-height:0!important;margin:0!important;padding:0 4px;border:1px solid #4465C9;border-radius:0;box-shadow:none;font-size:inherit;line-height:normal;resize:none}.grid-editor ::ng-deep input.ng-invalid.ng-touched,.grid-editor ::ng-deep input.ng-invalid.ng-dirty{border-color:#f78383}.grid-editor ::ng-deep input[type=checkbox]{width:auto}.grid-editor ::ng-deep .ng-select .ng-select-container{color:#4d5a81;min-height:0!important;height:23px!important;border-radius:0;border-color:#4465c9}.grid-editor ::ng-deep .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{top:0}.grid-editor ::ng-deep .ng-select .ng-select-container .ng-value-container{padding-top:0}.grid-editor ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input>input{height:100%!important;border:none}.grid-editor ::ng-deep .form-group>div{flex:1;min-width:0;width:100%}.grid-editor ::ng-deep .ng-select{width:100%}.grid-editor ::ng-deep alg-selector{display:flex;width:100%;height:23px}.grid-editor ::ng-deep .input-select-default,.grid-editor ::ng-deep .input-select-default.with-button{flex:1;min-width:0;padding-right:0;margin-right:0}.grid-editor ::ng-deep .input-group-btn{float:none}.grid-editor ::ng-deep .btn,.grid-editor ::ng-deep .btn-32,.grid-editor ::ng-deep .btn-input-select{height:23px;width:23px;padding:0;line-height:1;border-radius:0}.grid-editor ::ng-deep .input-with-button{display:flex;height:23px}.grid-editor ::ng-deep .switch{margin:2px 0 0 4px;transform:scale(.7);transform-origin:left top}::ng-deep body.dg-column-dragging,::ng-deep body.dg-column-dragging *{cursor:grabbing!important;-webkit-user-select:none!important;user-select:none!important}\n"]
 		}]
 	}],
 	ctorParameters: () => [
@@ -20004,7 +20266,7 @@ var FilterEditorComponent = class FilterEditorComponent {
 				panelFields: "panelFields"
 			},
 			ngImport: i0,
-			template: "<div class=\"fe\">\r\n    <div class=\"fe-tabs\" role=\"tablist\" *ngIf=\"!section\">\r\n        <button type=\"button\" class=\"fe-tab\" [class.active]=\"tab === 'filters'\" (click)=\"tab = 'filters'\">Filtres</button>\r\n        <button type=\"button\" class=\"fe-tab\" [class.active]=\"tab === 'sort'\" (click)=\"tab = 'sort'\">Tri</button>\r\n    </div>\r\n\r\n    <div class=\"fe-body\" *ngIf=\"shownTab === 'filters'\">\r\n        <!-- Filtres de l'écran (FilterPanel) : valeurs enregistrées avec la vue, appliquées au FilterPanel. -->\r\n        <div class=\"fe-panel\" *ngIf=\"panelFields.length || shownPanelFields().length\">\r\n            <div class=\"fe-panel-title\">Filtres de l'écran</div>\r\n            <div class=\"fe-panel-field\" *ngFor=\"let field of shownPanelFields(); trackBy: trackKey\">\r\n                <span [title]=\"field.label\">{{ field.label }}</span>\r\n                <ng-container [ngSwitch]=\"field.type\">\r\n                    <select *ngSwitchCase=\"'list'\" class=\"form-control\" [ngModel]=\"panelValue(field)\" (ngModelChange)=\"setPanelValue(field, $event)\">\r\n                        <option value=\"\">Choisir…</option>\r\n                        <option *ngFor=\"let option of field.values\" [value]=\"option.value\">{{ option.label }}</option>\r\n                    </select>\r\n                    <select *ngSwitchCase=\"'bool'\" class=\"form-control\" [ngModel]=\"panelValue(field)\" (ngModelChange)=\"setPanelValue(field, $event)\">\r\n                        <option value=\"\">Choisir…</option>\r\n                        <option value=\"true\">Oui</option>\r\n                        <option value=\"false\">Non</option>\r\n                    </select>\r\n                    <input *ngSwitchDefault class=\"form-control\" [type]=\"field.type === 'number' ? 'number' : field.type === 'date' ? 'date' : 'text'\"\r\n                        [ngModel]=\"panelValue(field)\" (ngModelChange)=\"setPanelValue(field, $event)\" />\r\n                </ng-container>\r\n                <button type=\"button\" class=\"fe-icon\" title=\"Retirer le filtre de l'écran\" (click)=\"removePanelField(field)\"><i class=\"fa fa-times\"></i></button>\r\n            </div>\r\n            <!-- Ajout d'un filtre de l'écran : les champs du FilterPanel pas encore utilisés. -->\r\n            <div class=\"fe-adds\" *ngIf=\"availablePanelFields().length\">\r\n                <select class=\"form-control fe-add-panel\" [ngModel]=\"''\" (ngModelChange)=\"addPanelField($event)\">\r\n                    <option value=\"\">+ Filtre de l'écran</option>\r\n                    <option *ngFor=\"let field of availablePanelFields(); trackBy: trackKey\" [value]=\"field.key\">{{ field.label }}</option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n        <div class=\"fe-panel-title\" *ngIf=\"panelFields.length || shownPanelFields().length\">Filtre additionnel</div>\r\n        <ng-container *ngTemplateOutlet=\"groupTpl; context: { group: filter, parent: null, index: 0, depth: 0 }\"></ng-container>\r\n        <div class=\"fe-summary\">{{ summary() }}</div>\r\n    </div>\r\n\r\n    <div class=\"fe-body\" *ngIf=\"shownTab === 'sort'\">\r\n        <div class=\"fe-sort\" *ngFor=\"let level of sort; let i = index; trackBy: trackIndex\">\r\n            <span class=\"fe-sort-label\">{{ i === 0 ? 'Trier par' : 'Puis par' }}</span>\r\n            <select class=\"form-control\" [(ngModel)]=\"level.property\">\r\n                <option *ngFor=\"let column of columns\" [value]=\"column.key\">{{ column.label }}</option>\r\n            </select>\r\n            <select class=\"form-control fe-sort-direction\" [(ngModel)]=\"level.direction\">\r\n                <option value=\"asc\">Croissant</option>\r\n                <option value=\"desc\">Décroissant</option>\r\n            </select>\r\n            <button type=\"button\" class=\"fe-icon\" title=\"Monter\" [disabled]=\"i === 0\" (click)=\"moveSort(i, -1)\"><i class=\"fa fa-arrow-up\"></i></button>\r\n            <button type=\"button\" class=\"fe-icon\" title=\"Descendre\" [disabled]=\"i === sort.length - 1\" (click)=\"moveSort(i, 1)\"><i class=\"fa fa-arrow-down\"></i></button>\r\n            <button type=\"button\" class=\"fe-icon\" title=\"Retirer\" (click)=\"removeSort(i)\"><i class=\"fa fa-times\"></i></button>\r\n        </div>\r\n        <div class=\"fe-adds\"><button type=\"button\" class=\"fe-add\" (click)=\"addSort()\">+ Niveau</button></div>\r\n    </div>\r\n\r\n    <div class=\"fe-foot\">\r\n        <label class=\"fe-save\" *ngIf=\"!embedded\" [class.disabled]=\"!canSaveInView\"\r\n            [title]=\"canSaveInView ? '' : 'La vue par défaut est en lecture seule : dupliquez-la pour y enregistrer un filtre'\">\r\n            <input type=\"checkbox\" [(ngModel)]=\"saveInView\" [disabled]=\"!canSaveInView\" />\r\n            <span>Enregistrer dans la vue{{ viewLabel ? ' « ' + viewLabel + ' »' : '' }}</span>\r\n        </label>\r\n        <button type=\"button\" class=\"fe-clear\" (click)=\"clear()\">Tout effacer</button>\r\n    </div>\r\n</div>\r\n\r\n<!-- Groupe : relation ET / OU, conditions, groupes imbriqués. -->\r\n<ng-template #groupTpl let-group=\"group\" let-parent=\"parent\" let-index=\"index\" let-depth=\"depth\">\r\n    <div class=\"fe-group\" [class.or]=\"group.Logic === 'or'\" [class.nested]=\"depth > 0\">\r\n        <div class=\"fe-group-head\">\r\n            <span class=\"fe-logic\">\r\n                <button type=\"button\" [class.on]=\"group.Logic === 'and'\" class=\"and\" (click)=\"setLogic(group, 'and')\">ET</button>\r\n                <button type=\"button\" [class.on]=\"group.Logic === 'or'\" class=\"or\" (click)=\"setLogic(group, 'or')\">OU</button>\r\n            </span>\r\n            <span class=\"fe-group-hint\">{{ group.Logic === 'and' ? 'Toutes les conditions' : 'Au moins une condition' }}</span>\r\n            <button type=\"button\" *ngIf=\"parent\" class=\"fe-icon fe-group-remove\" title=\"Retirer le groupe\" (click)=\"removeGroup(parent, index)\">\r\n                <i class=\"fa fa-times\"></i>\r\n            </button>\r\n        </div>\r\n\r\n        <div class=\"fe-cond\" *ngFor=\"let condition of group.Conditions; let i = index; trackBy: trackIndex\">\r\n            <select class=\"form-control\" [(ngModel)]=\"condition.Property\" (ngModelChange)=\"onColumnChange(condition)\">\r\n                <option *ngFor=\"let column of columns\" [value]=\"column.key\">{{ column.label }}</option>\r\n            </select>\r\n            <select class=\"form-control\" [(ngModel)]=\"condition.Operator\" (ngModelChange)=\"onOperatorChange(condition)\">\r\n                <option *ngFor=\"let op of operatorsOf(condition)\" [value]=\"op.value\">{{ op.label }}</option>\r\n            </select>\r\n            <span class=\"fe-value\">\r\n                <ng-container *ngIf=\"isList(condition); else valueTpl\">\r\n                    <span class=\"fe-chips\">\r\n                        <button type=\"button\" *ngFor=\"let option of columnOf(condition.Property)?.values\" class=\"fe-chip\"\r\n                            [class.on]=\"condition.Values?.includes(option.value)\" (click)=\"toggleValue(condition, option.value)\">{{ option.label }}</button>\r\n                    </span>\r\n                </ng-container>\r\n                <ng-template #valueTpl>\r\n                    <ng-container *ngIf=\"hasValue(condition)\">\r\n                        <input class=\"form-control\" [type]=\"inputType(condition)\" [(ngModel)]=\"condition.Value\" />\r\n                        <input *ngIf=\"hasSecondValue(condition)\" class=\"form-control\" [type]=\"inputType(condition)\" [(ngModel)]=\"condition.Value2\" />\r\n                    </ng-container>\r\n                </ng-template>\r\n            </span>\r\n            <button type=\"button\" class=\"fe-icon\" title=\"Retirer la condition\" (click)=\"removeCondition(group, i)\"><i class=\"fa fa-times\"></i></button>\r\n        </div>\r\n\r\n        <ng-container *ngFor=\"let sub of group.Groups; let gi = index; trackBy: trackIndex\">\r\n            <ng-container *ngTemplateOutlet=\"groupTpl; context: { group: sub, parent: group, index: gi, depth: depth + 1 }\"></ng-container>\r\n        </ng-container>\r\n\r\n        <div class=\"fe-adds\">\r\n            <button type=\"button\" class=\"fe-add\" (click)=\"addCondition(group)\">+ Condition</button>\r\n            <button type=\"button\" class=\"fe-add\" *ngIf=\"depth < maxDepth - 1\" (click)=\"addGroup(group)\">+ Groupe</button>\r\n        </div>\r\n    </div>\r\n</ng-template>\r\n",
+			template: "<div class=\"fe\">\n    <div class=\"fe-tabs\" role=\"tablist\" *ngIf=\"!section\">\n        <button type=\"button\" class=\"fe-tab\" [class.active]=\"tab === 'filters'\" (click)=\"tab = 'filters'\">Filtres</button>\n        <button type=\"button\" class=\"fe-tab\" [class.active]=\"tab === 'sort'\" (click)=\"tab = 'sort'\">Tri</button>\n    </div>\n\n    <div class=\"fe-body\" *ngIf=\"shownTab === 'filters'\">\n        <!-- Filtres de l'écran (FilterPanel) : valeurs enregistrées avec la vue, appliquées au FilterPanel. -->\n        <div class=\"fe-panel\" *ngIf=\"panelFields.length || shownPanelFields().length\">\n            <div class=\"fe-panel-title\">Filtres de l'écran</div>\n            <div class=\"fe-panel-field\" *ngFor=\"let field of shownPanelFields(); trackBy: trackKey\">\n                <span [title]=\"field.label\">{{ field.label }}</span>\n                <ng-container [ngSwitch]=\"field.type\">\n                    <select *ngSwitchCase=\"'list'\" class=\"form-control\" [ngModel]=\"panelValue(field)\" (ngModelChange)=\"setPanelValue(field, $event)\">\n                        <option value=\"\">Choisir…</option>\n                        <option *ngFor=\"let option of field.values\" [value]=\"option.value\">{{ option.label }}</option>\n                    </select>\n                    <select *ngSwitchCase=\"'bool'\" class=\"form-control\" [ngModel]=\"panelValue(field)\" (ngModelChange)=\"setPanelValue(field, $event)\">\n                        <option value=\"\">Choisir…</option>\n                        <option value=\"true\">Oui</option>\n                        <option value=\"false\">Non</option>\n                    </select>\n                    <input *ngSwitchDefault class=\"form-control\" [type]=\"field.type === 'number' ? 'number' : field.type === 'date' ? 'date' : 'text'\"\n                        [ngModel]=\"panelValue(field)\" (ngModelChange)=\"setPanelValue(field, $event)\" />\n                </ng-container>\n                <button type=\"button\" class=\"fe-icon\" title=\"Retirer le filtre de l'écran\" (click)=\"removePanelField(field)\"><i class=\"fa fa-times\"></i></button>\n            </div>\n            <!-- Ajout d'un filtre de l'écran : les champs du FilterPanel pas encore utilisés. -->\n            <div class=\"fe-adds\" *ngIf=\"availablePanelFields().length\">\n                <select class=\"form-control fe-add-panel\" [ngModel]=\"''\" (ngModelChange)=\"addPanelField($event)\">\n                    <option value=\"\">+ Filtre de l'écran</option>\n                    <option *ngFor=\"let field of availablePanelFields(); trackBy: trackKey\" [value]=\"field.key\">{{ field.label }}</option>\n                </select>\n            </div>\n        </div>\n        <div class=\"fe-panel-title\" *ngIf=\"panelFields.length || shownPanelFields().length\">Filtre additionnel</div>\n        <ng-container *ngTemplateOutlet=\"groupTpl; context: { group: filter, parent: null, index: 0, depth: 0 }\"></ng-container>\n        <div class=\"fe-summary\">{{ summary() }}</div>\n    </div>\n\n    <div class=\"fe-body\" *ngIf=\"shownTab === 'sort'\">\n        <div class=\"fe-sort\" *ngFor=\"let level of sort; let i = index; trackBy: trackIndex\">\n            <span class=\"fe-sort-label\">{{ i === 0 ? 'Trier par' : 'Puis par' }}</span>\n            <select class=\"form-control\" [(ngModel)]=\"level.property\">\n                <option *ngFor=\"let column of columns\" [value]=\"column.key\">{{ column.label }}</option>\n            </select>\n            <select class=\"form-control fe-sort-direction\" [(ngModel)]=\"level.direction\">\n                <option value=\"asc\">Croissant</option>\n                <option value=\"desc\">Décroissant</option>\n            </select>\n            <button type=\"button\" class=\"fe-icon\" title=\"Monter\" [disabled]=\"i === 0\" (click)=\"moveSort(i, -1)\"><i class=\"fa fa-arrow-up\"></i></button>\n            <button type=\"button\" class=\"fe-icon\" title=\"Descendre\" [disabled]=\"i === sort.length - 1\" (click)=\"moveSort(i, 1)\"><i class=\"fa fa-arrow-down\"></i></button>\n            <button type=\"button\" class=\"fe-icon\" title=\"Retirer\" (click)=\"removeSort(i)\"><i class=\"fa fa-times\"></i></button>\n        </div>\n        <div class=\"fe-adds\"><button type=\"button\" class=\"fe-add\" (click)=\"addSort()\">+ Niveau</button></div>\n    </div>\n\n    <div class=\"fe-foot\">\n        <label class=\"fe-save\" *ngIf=\"!embedded\" [class.disabled]=\"!canSaveInView\"\n            [title]=\"canSaveInView ? '' : 'La vue par défaut est en lecture seule : dupliquez-la pour y enregistrer un filtre'\">\n            <input type=\"checkbox\" [(ngModel)]=\"saveInView\" [disabled]=\"!canSaveInView\" />\n            <span>Enregistrer dans la vue{{ viewLabel ? ' « ' + viewLabel + ' »' : '' }}</span>\n        </label>\n        <button type=\"button\" class=\"fe-clear\" (click)=\"clear()\">Tout effacer</button>\n    </div>\n</div>\n\n<!-- Groupe : relation ET / OU, conditions, groupes imbriqués. -->\n<ng-template #groupTpl let-group=\"group\" let-parent=\"parent\" let-index=\"index\" let-depth=\"depth\">\n    <div class=\"fe-group\" [class.or]=\"group.Logic === 'or'\" [class.nested]=\"depth > 0\">\n        <div class=\"fe-group-head\">\n            <span class=\"fe-logic\">\n                <button type=\"button\" [class.on]=\"group.Logic === 'and'\" class=\"and\" (click)=\"setLogic(group, 'and')\">ET</button>\n                <button type=\"button\" [class.on]=\"group.Logic === 'or'\" class=\"or\" (click)=\"setLogic(group, 'or')\">OU</button>\n            </span>\n            <span class=\"fe-group-hint\">{{ group.Logic === 'and' ? 'Toutes les conditions' : 'Au moins une condition' }}</span>\n            <button type=\"button\" *ngIf=\"parent\" class=\"fe-icon fe-group-remove\" title=\"Retirer le groupe\" (click)=\"removeGroup(parent, index)\">\n                <i class=\"fa fa-times\"></i>\n            </button>\n        </div>\n\n        <div class=\"fe-cond\" *ngFor=\"let condition of group.Conditions; let i = index; trackBy: trackIndex\">\n            <select class=\"form-control\" [(ngModel)]=\"condition.Property\" (ngModelChange)=\"onColumnChange(condition)\">\n                <option *ngFor=\"let column of columns\" [value]=\"column.key\">{{ column.label }}</option>\n            </select>\n            <select class=\"form-control\" [(ngModel)]=\"condition.Operator\" (ngModelChange)=\"onOperatorChange(condition)\">\n                <option *ngFor=\"let op of operatorsOf(condition)\" [value]=\"op.value\">{{ op.label }}</option>\n            </select>\n            <span class=\"fe-value\">\n                <ng-container *ngIf=\"isList(condition); else valueTpl\">\n                    <span class=\"fe-chips\">\n                        <button type=\"button\" *ngFor=\"let option of columnOf(condition.Property)?.values\" class=\"fe-chip\"\n                            [class.on]=\"condition.Values?.includes(option.value)\" (click)=\"toggleValue(condition, option.value)\">{{ option.label }}</button>\n                    </span>\n                </ng-container>\n                <ng-template #valueTpl>\n                    <ng-container *ngIf=\"hasValue(condition)\">\n                        <input class=\"form-control\" [type]=\"inputType(condition)\" [(ngModel)]=\"condition.Value\" />\n                        <input *ngIf=\"hasSecondValue(condition)\" class=\"form-control\" [type]=\"inputType(condition)\" [(ngModel)]=\"condition.Value2\" />\n                    </ng-container>\n                </ng-template>\n            </span>\n            <button type=\"button\" class=\"fe-icon\" title=\"Retirer la condition\" (click)=\"removeCondition(group, i)\"><i class=\"fa fa-times\"></i></button>\n        </div>\n\n        <ng-container *ngFor=\"let sub of group.Groups; let gi = index; trackBy: trackIndex\">\n            <ng-container *ngTemplateOutlet=\"groupTpl; context: { group: sub, parent: group, index: gi, depth: depth + 1 }\"></ng-container>\n        </ng-container>\n\n        <div class=\"fe-adds\">\n            <button type=\"button\" class=\"fe-add\" (click)=\"addCondition(group)\">+ Condition</button>\n            <button type=\"button\" class=\"fe-add\" *ngIf=\"depth < maxDepth - 1\" (click)=\"addGroup(group)\">+ Groupe</button>\n        </div>\n    </div>\n</ng-template>\n",
 			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.fe-panel{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));gap:6px 12px;margin-bottom:12px}.fe-panel .fe-adds{grid-column:1/-1}.fe-add-panel{width:auto;border-style:dashed;color:#4465c9}.fe-panel-title{grid-column:1/-1;margin:4px 0 2px;font-weight:600}.fe-panel-field{display:grid;grid-template-columns:120px minmax(0,1fr) auto;align-items:center;gap:8px;margin:0;font-weight:400}.fe-panel-field>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fe{display:flex;flex-direction:column;color:#4d5a81;font-size:13px}.fe-tabs{display:flex;gap:4px;padding:8px 14px 0;border-bottom:1px solid #DBE4FF}.fe-tab{padding:6px 12px;border:none;border-bottom:2px solid transparent;background:none;color:#9fa9c7;font:inherit;font-weight:700;cursor:pointer}.fe-tab.active{color:#4465c9;border-bottom-color:#5272d3}.fe-body{display:flex;flex-direction:column;gap:10px;max-height:60vh;overflow-y:auto;padding:12px 14px}.fe-group{display:flex;flex-direction:column;gap:8px;padding:10px;border:1px solid #DBE4FF;border-left:4px solid #3b57b8;border-radius:0 4px 4px 0;background:#fff}.fe-group.or{border-left-color:#e07b12}.fe-group.nested{background:#f6f8fd}.fe-group-head{display:flex;align-items:center;gap:8px;font-size:12px;color:#9fa9c7}.fe-group-remove{margin-left:auto}.fe-logic{display:inline-flex;border:1px solid #DBE4FF;border-radius:999px;overflow:hidden}.fe-logic button{padding:2px 10px;border:none;background:none;color:#9fa9c7;font:inherit;font-size:11px;font-weight:800;cursor:pointer}.fe-logic button.on.and{background:#3b57b8;color:#fff}.fe-logic button.on.or{background:#e07b12;color:#fff}.fe-cond{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1.4fr) 28px;gap:6px;align-items:center;padding:4px 6px;border:1px solid #DBE4FF;border-left:3px solid #3b57b8;border-radius:0 4px 4px 0;background:#fff}.fe-group.or>.fe-cond{border-left-color:#e07b12}@media(max-width:600px){.fe-cond{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 28px}.fe-cond .fe-value{grid-column:1/3}}select.form-control,input.form-control{height:30px;min-width:0;padding:2px 6px;font-size:13px}.fe-value{display:flex;gap:6px;min-width:0}.fe-value input{flex:1}.fe-chips{display:flex;flex-wrap:wrap;gap:4px}.fe-chip{padding:2px 8px;border:1px solid #C1D0FD;border-radius:999px;background:#fff;color:#4d5a81;font:inherit;font-size:12px;cursor:pointer}.fe-chip.on{background:#5272d3;border-color:#5272d3;color:#fff}.fe-icon{width:28px;height:28px;padding:0;border:none;border-radius:6px;background:none;color:#9fa9c7;cursor:pointer}.fe-icon:hover:not(:disabled){background:#ebf0ff;color:#4d5a81}.fe-icon:disabled{opacity:.3;cursor:default}.fe-adds{display:flex;gap:8px;flex-wrap:wrap}.fe-add{padding:3px 10px;border:1px dashed #C1D0FD;border-radius:6px;background:none;color:#4465c9;font:inherit;font-size:12px;cursor:pointer}.fe-summary{padding:8px 10px;border-radius:6px;background:#ebf0ff;font-size:12px;word-break:break-word}.fe-sort{display:grid;grid-template-columns:64px minmax(0,1fr) 120px 28px 28px 28px;gap:6px;align-items:center}.fe-sort-label{font-size:12px;color:#9fa9c7}.fe-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 14px;border-top:1px solid #DBE4FF}.fe-save{display:inline-flex;align-items:center;gap:6px;margin:0;font-weight:400;cursor:pointer}.fe-save.disabled{opacity:.55;cursor:default}.fe-save input{margin:0}.fe-clear{border:none;background:none;color:#4465c9;font:inherit;cursor:pointer}\n"],
 			dependencies: [
 				{
@@ -20125,7 +20387,7 @@ i0.ɵɵngDeclareClassMetadata({
 			standalone: true,
 			imports: [CommonModule, FormsModule],
 			changeDetection: ChangeDetectionStrategy.Eager,
-			template: "<div class=\"fe\">\r\n    <div class=\"fe-tabs\" role=\"tablist\" *ngIf=\"!section\">\r\n        <button type=\"button\" class=\"fe-tab\" [class.active]=\"tab === 'filters'\" (click)=\"tab = 'filters'\">Filtres</button>\r\n        <button type=\"button\" class=\"fe-tab\" [class.active]=\"tab === 'sort'\" (click)=\"tab = 'sort'\">Tri</button>\r\n    </div>\r\n\r\n    <div class=\"fe-body\" *ngIf=\"shownTab === 'filters'\">\r\n        <!-- Filtres de l'écran (FilterPanel) : valeurs enregistrées avec la vue, appliquées au FilterPanel. -->\r\n        <div class=\"fe-panel\" *ngIf=\"panelFields.length || shownPanelFields().length\">\r\n            <div class=\"fe-panel-title\">Filtres de l'écran</div>\r\n            <div class=\"fe-panel-field\" *ngFor=\"let field of shownPanelFields(); trackBy: trackKey\">\r\n                <span [title]=\"field.label\">{{ field.label }}</span>\r\n                <ng-container [ngSwitch]=\"field.type\">\r\n                    <select *ngSwitchCase=\"'list'\" class=\"form-control\" [ngModel]=\"panelValue(field)\" (ngModelChange)=\"setPanelValue(field, $event)\">\r\n                        <option value=\"\">Choisir…</option>\r\n                        <option *ngFor=\"let option of field.values\" [value]=\"option.value\">{{ option.label }}</option>\r\n                    </select>\r\n                    <select *ngSwitchCase=\"'bool'\" class=\"form-control\" [ngModel]=\"panelValue(field)\" (ngModelChange)=\"setPanelValue(field, $event)\">\r\n                        <option value=\"\">Choisir…</option>\r\n                        <option value=\"true\">Oui</option>\r\n                        <option value=\"false\">Non</option>\r\n                    </select>\r\n                    <input *ngSwitchDefault class=\"form-control\" [type]=\"field.type === 'number' ? 'number' : field.type === 'date' ? 'date' : 'text'\"\r\n                        [ngModel]=\"panelValue(field)\" (ngModelChange)=\"setPanelValue(field, $event)\" />\r\n                </ng-container>\r\n                <button type=\"button\" class=\"fe-icon\" title=\"Retirer le filtre de l'écran\" (click)=\"removePanelField(field)\"><i class=\"fa fa-times\"></i></button>\r\n            </div>\r\n            <!-- Ajout d'un filtre de l'écran : les champs du FilterPanel pas encore utilisés. -->\r\n            <div class=\"fe-adds\" *ngIf=\"availablePanelFields().length\">\r\n                <select class=\"form-control fe-add-panel\" [ngModel]=\"''\" (ngModelChange)=\"addPanelField($event)\">\r\n                    <option value=\"\">+ Filtre de l'écran</option>\r\n                    <option *ngFor=\"let field of availablePanelFields(); trackBy: trackKey\" [value]=\"field.key\">{{ field.label }}</option>\r\n                </select>\r\n            </div>\r\n        </div>\r\n        <div class=\"fe-panel-title\" *ngIf=\"panelFields.length || shownPanelFields().length\">Filtre additionnel</div>\r\n        <ng-container *ngTemplateOutlet=\"groupTpl; context: { group: filter, parent: null, index: 0, depth: 0 }\"></ng-container>\r\n        <div class=\"fe-summary\">{{ summary() }}</div>\r\n    </div>\r\n\r\n    <div class=\"fe-body\" *ngIf=\"shownTab === 'sort'\">\r\n        <div class=\"fe-sort\" *ngFor=\"let level of sort; let i = index; trackBy: trackIndex\">\r\n            <span class=\"fe-sort-label\">{{ i === 0 ? 'Trier par' : 'Puis par' }}</span>\r\n            <select class=\"form-control\" [(ngModel)]=\"level.property\">\r\n                <option *ngFor=\"let column of columns\" [value]=\"column.key\">{{ column.label }}</option>\r\n            </select>\r\n            <select class=\"form-control fe-sort-direction\" [(ngModel)]=\"level.direction\">\r\n                <option value=\"asc\">Croissant</option>\r\n                <option value=\"desc\">Décroissant</option>\r\n            </select>\r\n            <button type=\"button\" class=\"fe-icon\" title=\"Monter\" [disabled]=\"i === 0\" (click)=\"moveSort(i, -1)\"><i class=\"fa fa-arrow-up\"></i></button>\r\n            <button type=\"button\" class=\"fe-icon\" title=\"Descendre\" [disabled]=\"i === sort.length - 1\" (click)=\"moveSort(i, 1)\"><i class=\"fa fa-arrow-down\"></i></button>\r\n            <button type=\"button\" class=\"fe-icon\" title=\"Retirer\" (click)=\"removeSort(i)\"><i class=\"fa fa-times\"></i></button>\r\n        </div>\r\n        <div class=\"fe-adds\"><button type=\"button\" class=\"fe-add\" (click)=\"addSort()\">+ Niveau</button></div>\r\n    </div>\r\n\r\n    <div class=\"fe-foot\">\r\n        <label class=\"fe-save\" *ngIf=\"!embedded\" [class.disabled]=\"!canSaveInView\"\r\n            [title]=\"canSaveInView ? '' : 'La vue par défaut est en lecture seule : dupliquez-la pour y enregistrer un filtre'\">\r\n            <input type=\"checkbox\" [(ngModel)]=\"saveInView\" [disabled]=\"!canSaveInView\" />\r\n            <span>Enregistrer dans la vue{{ viewLabel ? ' « ' + viewLabel + ' »' : '' }}</span>\r\n        </label>\r\n        <button type=\"button\" class=\"fe-clear\" (click)=\"clear()\">Tout effacer</button>\r\n    </div>\r\n</div>\r\n\r\n<!-- Groupe : relation ET / OU, conditions, groupes imbriqués. -->\r\n<ng-template #groupTpl let-group=\"group\" let-parent=\"parent\" let-index=\"index\" let-depth=\"depth\">\r\n    <div class=\"fe-group\" [class.or]=\"group.Logic === 'or'\" [class.nested]=\"depth > 0\">\r\n        <div class=\"fe-group-head\">\r\n            <span class=\"fe-logic\">\r\n                <button type=\"button\" [class.on]=\"group.Logic === 'and'\" class=\"and\" (click)=\"setLogic(group, 'and')\">ET</button>\r\n                <button type=\"button\" [class.on]=\"group.Logic === 'or'\" class=\"or\" (click)=\"setLogic(group, 'or')\">OU</button>\r\n            </span>\r\n            <span class=\"fe-group-hint\">{{ group.Logic === 'and' ? 'Toutes les conditions' : 'Au moins une condition' }}</span>\r\n            <button type=\"button\" *ngIf=\"parent\" class=\"fe-icon fe-group-remove\" title=\"Retirer le groupe\" (click)=\"removeGroup(parent, index)\">\r\n                <i class=\"fa fa-times\"></i>\r\n            </button>\r\n        </div>\r\n\r\n        <div class=\"fe-cond\" *ngFor=\"let condition of group.Conditions; let i = index; trackBy: trackIndex\">\r\n            <select class=\"form-control\" [(ngModel)]=\"condition.Property\" (ngModelChange)=\"onColumnChange(condition)\">\r\n                <option *ngFor=\"let column of columns\" [value]=\"column.key\">{{ column.label }}</option>\r\n            </select>\r\n            <select class=\"form-control\" [(ngModel)]=\"condition.Operator\" (ngModelChange)=\"onOperatorChange(condition)\">\r\n                <option *ngFor=\"let op of operatorsOf(condition)\" [value]=\"op.value\">{{ op.label }}</option>\r\n            </select>\r\n            <span class=\"fe-value\">\r\n                <ng-container *ngIf=\"isList(condition); else valueTpl\">\r\n                    <span class=\"fe-chips\">\r\n                        <button type=\"button\" *ngFor=\"let option of columnOf(condition.Property)?.values\" class=\"fe-chip\"\r\n                            [class.on]=\"condition.Values?.includes(option.value)\" (click)=\"toggleValue(condition, option.value)\">{{ option.label }}</button>\r\n                    </span>\r\n                </ng-container>\r\n                <ng-template #valueTpl>\r\n                    <ng-container *ngIf=\"hasValue(condition)\">\r\n                        <input class=\"form-control\" [type]=\"inputType(condition)\" [(ngModel)]=\"condition.Value\" />\r\n                        <input *ngIf=\"hasSecondValue(condition)\" class=\"form-control\" [type]=\"inputType(condition)\" [(ngModel)]=\"condition.Value2\" />\r\n                    </ng-container>\r\n                </ng-template>\r\n            </span>\r\n            <button type=\"button\" class=\"fe-icon\" title=\"Retirer la condition\" (click)=\"removeCondition(group, i)\"><i class=\"fa fa-times\"></i></button>\r\n        </div>\r\n\r\n        <ng-container *ngFor=\"let sub of group.Groups; let gi = index; trackBy: trackIndex\">\r\n            <ng-container *ngTemplateOutlet=\"groupTpl; context: { group: sub, parent: group, index: gi, depth: depth + 1 }\"></ng-container>\r\n        </ng-container>\r\n\r\n        <div class=\"fe-adds\">\r\n            <button type=\"button\" class=\"fe-add\" (click)=\"addCondition(group)\">+ Condition</button>\r\n            <button type=\"button\" class=\"fe-add\" *ngIf=\"depth < maxDepth - 1\" (click)=\"addGroup(group)\">+ Groupe</button>\r\n        </div>\r\n    </div>\r\n</ng-template>\r\n",
+			template: "<div class=\"fe\">\n    <div class=\"fe-tabs\" role=\"tablist\" *ngIf=\"!section\">\n        <button type=\"button\" class=\"fe-tab\" [class.active]=\"tab === 'filters'\" (click)=\"tab = 'filters'\">Filtres</button>\n        <button type=\"button\" class=\"fe-tab\" [class.active]=\"tab === 'sort'\" (click)=\"tab = 'sort'\">Tri</button>\n    </div>\n\n    <div class=\"fe-body\" *ngIf=\"shownTab === 'filters'\">\n        <!-- Filtres de l'écran (FilterPanel) : valeurs enregistrées avec la vue, appliquées au FilterPanel. -->\n        <div class=\"fe-panel\" *ngIf=\"panelFields.length || shownPanelFields().length\">\n            <div class=\"fe-panel-title\">Filtres de l'écran</div>\n            <div class=\"fe-panel-field\" *ngFor=\"let field of shownPanelFields(); trackBy: trackKey\">\n                <span [title]=\"field.label\">{{ field.label }}</span>\n                <ng-container [ngSwitch]=\"field.type\">\n                    <select *ngSwitchCase=\"'list'\" class=\"form-control\" [ngModel]=\"panelValue(field)\" (ngModelChange)=\"setPanelValue(field, $event)\">\n                        <option value=\"\">Choisir…</option>\n                        <option *ngFor=\"let option of field.values\" [value]=\"option.value\">{{ option.label }}</option>\n                    </select>\n                    <select *ngSwitchCase=\"'bool'\" class=\"form-control\" [ngModel]=\"panelValue(field)\" (ngModelChange)=\"setPanelValue(field, $event)\">\n                        <option value=\"\">Choisir…</option>\n                        <option value=\"true\">Oui</option>\n                        <option value=\"false\">Non</option>\n                    </select>\n                    <input *ngSwitchDefault class=\"form-control\" [type]=\"field.type === 'number' ? 'number' : field.type === 'date' ? 'date' : 'text'\"\n                        [ngModel]=\"panelValue(field)\" (ngModelChange)=\"setPanelValue(field, $event)\" />\n                </ng-container>\n                <button type=\"button\" class=\"fe-icon\" title=\"Retirer le filtre de l'écran\" (click)=\"removePanelField(field)\"><i class=\"fa fa-times\"></i></button>\n            </div>\n            <!-- Ajout d'un filtre de l'écran : les champs du FilterPanel pas encore utilisés. -->\n            <div class=\"fe-adds\" *ngIf=\"availablePanelFields().length\">\n                <select class=\"form-control fe-add-panel\" [ngModel]=\"''\" (ngModelChange)=\"addPanelField($event)\">\n                    <option value=\"\">+ Filtre de l'écran</option>\n                    <option *ngFor=\"let field of availablePanelFields(); trackBy: trackKey\" [value]=\"field.key\">{{ field.label }}</option>\n                </select>\n            </div>\n        </div>\n        <div class=\"fe-panel-title\" *ngIf=\"panelFields.length || shownPanelFields().length\">Filtre additionnel</div>\n        <ng-container *ngTemplateOutlet=\"groupTpl; context: { group: filter, parent: null, index: 0, depth: 0 }\"></ng-container>\n        <div class=\"fe-summary\">{{ summary() }}</div>\n    </div>\n\n    <div class=\"fe-body\" *ngIf=\"shownTab === 'sort'\">\n        <div class=\"fe-sort\" *ngFor=\"let level of sort; let i = index; trackBy: trackIndex\">\n            <span class=\"fe-sort-label\">{{ i === 0 ? 'Trier par' : 'Puis par' }}</span>\n            <select class=\"form-control\" [(ngModel)]=\"level.property\">\n                <option *ngFor=\"let column of columns\" [value]=\"column.key\">{{ column.label }}</option>\n            </select>\n            <select class=\"form-control fe-sort-direction\" [(ngModel)]=\"level.direction\">\n                <option value=\"asc\">Croissant</option>\n                <option value=\"desc\">Décroissant</option>\n            </select>\n            <button type=\"button\" class=\"fe-icon\" title=\"Monter\" [disabled]=\"i === 0\" (click)=\"moveSort(i, -1)\"><i class=\"fa fa-arrow-up\"></i></button>\n            <button type=\"button\" class=\"fe-icon\" title=\"Descendre\" [disabled]=\"i === sort.length - 1\" (click)=\"moveSort(i, 1)\"><i class=\"fa fa-arrow-down\"></i></button>\n            <button type=\"button\" class=\"fe-icon\" title=\"Retirer\" (click)=\"removeSort(i)\"><i class=\"fa fa-times\"></i></button>\n        </div>\n        <div class=\"fe-adds\"><button type=\"button\" class=\"fe-add\" (click)=\"addSort()\">+ Niveau</button></div>\n    </div>\n\n    <div class=\"fe-foot\">\n        <label class=\"fe-save\" *ngIf=\"!embedded\" [class.disabled]=\"!canSaveInView\"\n            [title]=\"canSaveInView ? '' : 'La vue par défaut est en lecture seule : dupliquez-la pour y enregistrer un filtre'\">\n            <input type=\"checkbox\" [(ngModel)]=\"saveInView\" [disabled]=\"!canSaveInView\" />\n            <span>Enregistrer dans la vue{{ viewLabel ? ' « ' + viewLabel + ' »' : '' }}</span>\n        </label>\n        <button type=\"button\" class=\"fe-clear\" (click)=\"clear()\">Tout effacer</button>\n    </div>\n</div>\n\n<!-- Groupe : relation ET / OU, conditions, groupes imbriqués. -->\n<ng-template #groupTpl let-group=\"group\" let-parent=\"parent\" let-index=\"index\" let-depth=\"depth\">\n    <div class=\"fe-group\" [class.or]=\"group.Logic === 'or'\" [class.nested]=\"depth > 0\">\n        <div class=\"fe-group-head\">\n            <span class=\"fe-logic\">\n                <button type=\"button\" [class.on]=\"group.Logic === 'and'\" class=\"and\" (click)=\"setLogic(group, 'and')\">ET</button>\n                <button type=\"button\" [class.on]=\"group.Logic === 'or'\" class=\"or\" (click)=\"setLogic(group, 'or')\">OU</button>\n            </span>\n            <span class=\"fe-group-hint\">{{ group.Logic === 'and' ? 'Toutes les conditions' : 'Au moins une condition' }}</span>\n            <button type=\"button\" *ngIf=\"parent\" class=\"fe-icon fe-group-remove\" title=\"Retirer le groupe\" (click)=\"removeGroup(parent, index)\">\n                <i class=\"fa fa-times\"></i>\n            </button>\n        </div>\n\n        <div class=\"fe-cond\" *ngFor=\"let condition of group.Conditions; let i = index; trackBy: trackIndex\">\n            <select class=\"form-control\" [(ngModel)]=\"condition.Property\" (ngModelChange)=\"onColumnChange(condition)\">\n                <option *ngFor=\"let column of columns\" [value]=\"column.key\">{{ column.label }}</option>\n            </select>\n            <select class=\"form-control\" [(ngModel)]=\"condition.Operator\" (ngModelChange)=\"onOperatorChange(condition)\">\n                <option *ngFor=\"let op of operatorsOf(condition)\" [value]=\"op.value\">{{ op.label }}</option>\n            </select>\n            <span class=\"fe-value\">\n                <ng-container *ngIf=\"isList(condition); else valueTpl\">\n                    <span class=\"fe-chips\">\n                        <button type=\"button\" *ngFor=\"let option of columnOf(condition.Property)?.values\" class=\"fe-chip\"\n                            [class.on]=\"condition.Values?.includes(option.value)\" (click)=\"toggleValue(condition, option.value)\">{{ option.label }}</button>\n                    </span>\n                </ng-container>\n                <ng-template #valueTpl>\n                    <ng-container *ngIf=\"hasValue(condition)\">\n                        <input class=\"form-control\" [type]=\"inputType(condition)\" [(ngModel)]=\"condition.Value\" />\n                        <input *ngIf=\"hasSecondValue(condition)\" class=\"form-control\" [type]=\"inputType(condition)\" [(ngModel)]=\"condition.Value2\" />\n                    </ng-container>\n                </ng-template>\n            </span>\n            <button type=\"button\" class=\"fe-icon\" title=\"Retirer la condition\" (click)=\"removeCondition(group, i)\"><i class=\"fa fa-times\"></i></button>\n        </div>\n\n        <ng-container *ngFor=\"let sub of group.Groups; let gi = index; trackBy: trackIndex\">\n            <ng-container *ngTemplateOutlet=\"groupTpl; context: { group: sub, parent: group, index: gi, depth: depth + 1 }\"></ng-container>\n        </ng-container>\n\n        <div class=\"fe-adds\">\n            <button type=\"button\" class=\"fe-add\" (click)=\"addCondition(group)\">+ Condition</button>\n            <button type=\"button\" class=\"fe-add\" *ngIf=\"depth < maxDepth - 1\" (click)=\"addGroup(group)\">+ Groupe</button>\n        </div>\n    </div>\n</ng-template>\n",
 			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.fe-panel{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));gap:6px 12px;margin-bottom:12px}.fe-panel .fe-adds{grid-column:1/-1}.fe-add-panel{width:auto;border-style:dashed;color:#4465c9}.fe-panel-title{grid-column:1/-1;margin:4px 0 2px;font-weight:600}.fe-panel-field{display:grid;grid-template-columns:120px minmax(0,1fr) auto;align-items:center;gap:8px;margin:0;font-weight:400}.fe-panel-field>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fe{display:flex;flex-direction:column;color:#4d5a81;font-size:13px}.fe-tabs{display:flex;gap:4px;padding:8px 14px 0;border-bottom:1px solid #DBE4FF}.fe-tab{padding:6px 12px;border:none;border-bottom:2px solid transparent;background:none;color:#9fa9c7;font:inherit;font-weight:700;cursor:pointer}.fe-tab.active{color:#4465c9;border-bottom-color:#5272d3}.fe-body{display:flex;flex-direction:column;gap:10px;max-height:60vh;overflow-y:auto;padding:12px 14px}.fe-group{display:flex;flex-direction:column;gap:8px;padding:10px;border:1px solid #DBE4FF;border-left:4px solid #3b57b8;border-radius:0 4px 4px 0;background:#fff}.fe-group.or{border-left-color:#e07b12}.fe-group.nested{background:#f6f8fd}.fe-group-head{display:flex;align-items:center;gap:8px;font-size:12px;color:#9fa9c7}.fe-group-remove{margin-left:auto}.fe-logic{display:inline-flex;border:1px solid #DBE4FF;border-radius:999px;overflow:hidden}.fe-logic button{padding:2px 10px;border:none;background:none;color:#9fa9c7;font:inherit;font-size:11px;font-weight:800;cursor:pointer}.fe-logic button.on.and{background:#3b57b8;color:#fff}.fe-logic button.on.or{background:#e07b12;color:#fff}.fe-cond{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1.4fr) 28px;gap:6px;align-items:center;padding:4px 6px;border:1px solid #DBE4FF;border-left:3px solid #3b57b8;border-radius:0 4px 4px 0;background:#fff}.fe-group.or>.fe-cond{border-left-color:#e07b12}@media(max-width:600px){.fe-cond{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 28px}.fe-cond .fe-value{grid-column:1/3}}select.form-control,input.form-control{height:30px;min-width:0;padding:2px 6px;font-size:13px}.fe-value{display:flex;gap:6px;min-width:0}.fe-value input{flex:1}.fe-chips{display:flex;flex-wrap:wrap;gap:4px}.fe-chip{padding:2px 8px;border:1px solid #C1D0FD;border-radius:999px;background:#fff;color:#4d5a81;font:inherit;font-size:12px;cursor:pointer}.fe-chip.on{background:#5272d3;border-color:#5272d3;color:#fff}.fe-icon{width:28px;height:28px;padding:0;border:none;border-radius:6px;background:none;color:#9fa9c7;cursor:pointer}.fe-icon:hover:not(:disabled){background:#ebf0ff;color:#4d5a81}.fe-icon:disabled{opacity:.3;cursor:default}.fe-adds{display:flex;gap:8px;flex-wrap:wrap}.fe-add{padding:3px 10px;border:1px dashed #C1D0FD;border-radius:6px;background:none;color:#4465c9;font:inherit;font-size:12px;cursor:pointer}.fe-summary{padding:8px 10px;border-radius:6px;background:#ebf0ff;font-size:12px;word-break:break-word}.fe-sort{display:grid;grid-template-columns:64px minmax(0,1fr) 120px 28px 28px 28px;gap:6px;align-items:center}.fe-sort-label{font-size:12px;color:#9fa9c7}.fe-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 14px;border-top:1px solid #DBE4FF}.fe-save{display:inline-flex;align-items:center;gap:6px;margin:0;font-weight:400;cursor:pointer}.fe-save.disabled{opacity:.55;cursor:default}.fe-save input{margin:0}.fe-clear{border:none;background:none;color:#4465c9;font:inherit;cursor:pointer}\n"]
 		}]
 	}],
@@ -20165,6 +20427,8 @@ var FilterSummaryPanelComponent = class FilterSummaryPanelComponent {
 		this.currentCriteria = null;
 		this.hiddenFilters = [];
 		this.destroy$ = new Subject();
+		this.keptFilters = /* @__PURE__ */ new Set();
+		this.openedProperty = null;
 	}
 	ngOnInit() {
 		this.facade = this.entityFacadeRegistryService.getFacade(this.entityKey, this.guid);
@@ -20203,12 +20467,21 @@ var FilterSummaryPanelComponent = class FilterSummaryPanelComponent {
 		}
 	}
 	updateFieldSummary(field) {
-		const displayedVal = this.getFilterSummaryValue(field);
-		if (displayedVal !== null && displayedVal !== void 0) this.filterList.push({
+		let displayedVal = this.getFilterSummaryValue(field);
+		const kept = this.canOpenList(field);
+		if (displayedVal !== null && displayedVal !== void 0) {
+			if (kept) this.keptFilters.add(field.PropertyName);
+		} else if (kept && this.keptFilters.has(field.PropertyName)) displayedVal = this.emptyLabel(field);
+		else return;
+		this.filterList.push({
 			DisplayedValue: displayedVal,
 			Field: field
 		});
 	}
+	emptyLabel(field) {
+		const item = (Array.isArray(field.OriginalData) ? field.OriginalData : Array.isArray(field.Data) ? field.Data : []).find((d) => d?.[field.ValueMember] === -1);
+		return item?.[field.DisplayMember] != null ? `${item[field.DisplayMember]}` : "Tous";
+	}
 	getFilterSummaryValue(field) {
 		if (!field) return null;
 		const fv = this.currentCriteria != null ? this.currentCriteria[field.PropertyName] : this.wrapper.form.get(field.PropertyName)?.value;
@@ -20223,10 +20496,42 @@ var FilterSummaryPanelComponent = class FilterSummaryPanelComponent {
 		else return null;
 		return displayedValue;
 	}
+	set listSelect(select) {
+		if (select) setTimeout(() => {
+			select.open();
+			select.focus();
+		});
+	}
+	canOpenList(field) {
+		return (field.FilterType === FilterType.ComboBox || field.FilterType === FilterType.HorizComboBox) && Array.isArray(field.Data) && !field.MultipleSelection && !field.ReadOnly && !(field.PropertyName in this.facade.filter.lockedPanel);
+	}
+	openList(field) {
+		this.openedProperty = field.PropertyName;
+	}
+	closeList() {
+		this.openedProperty = null;
+	}
+	currentValue(field) {
+		return this.currentCriteria != null ? this.currentCriteria[field.PropertyName] : this.wrapper.form.get(field.PropertyName)?.value;
+	}
+	selectValue(field, item) {
+		this.closeList();
+		if (Utilities.IsNil(item)) return;
+		this.keptFilters.add(field.PropertyName);
+		this.wrapper.form.get(field.PropertyName)?.setValue(item[field.ValueMember], { emitEvent: false });
+		this.facade.filter.setFilter(this.wrapper.form.getRawValue());
+	}
+	canClear(field) {
+		return field.IsClearable && !(field.PropertyName in this.facade.filter.lockedPanel);
+	}
 	resetFormControl(field) {
-		if (!field.IsClearable || field.PropertyName in this.facade.filter.lockedPanel) return;
+		if (!this.canClear(field)) return;
+		this.keptFilters.delete(field.PropertyName);
 		const currentValue = this.currentCriteria != null ? this.currentCriteria[field.PropertyName] : this.wrapper.form.get(field.PropertyName)?.value;
-		if (Utilities.IsNil(currentValue) || currentValue === -1 || Utilities.isEmptyString(currentValue)) return;
+		if (Utilities.IsNil(currentValue) || currentValue === -1 || Utilities.isEmptyString(currentValue)) {
+			this.updateSummary();
+			return;
+		}
 		let newValue;
 		if (field.FilterType === FilterType.ComboBox) newValue = field.Data?.find((d) => d[field.ValueMember] === -1) ? -1 : null;
 		else if (field.FilterType === FilterType.String) newValue = "";
@@ -20297,28 +20602,138 @@ var FilterSummaryPanelComponent = class FilterSummaryPanelComponent {
 				entityKey: "entityKey",
 				guid: "guid"
 			},
-			ngImport: i0,
-			template: "<!-- <div class=\"clearfix\" *ngIf=\"!isEmptyFilter()\">\r\n    <div class=\"filter-summary\">\r\n        <div class=\"filter\" [formGroup]=\"wrapper.form\">\r\n            <ng-container *ngIf=\"filterList\">\r\n              \r\n                <div *ngFor=\"let field of Fields\" class=\"option\">\r\n                    <div [ngSwitch]=\"field.FilterType\">\r\n                        <div *ngSwitchCase=\"filterType.String\" class=\"form-group\">\r\n                                <input\r\n                                    class=\"form-control\"\r\n                                    [formControlName]=\"field.PropertyName\"\r\n                                    [id]=\"field.PropertyName\"\r\n                                    [readonly]=\"field.ReadOnly\"\r\n                                    [type]=\"field.InputType\"\r\n                                />\r\n                        </div>\r\n                        <div\r\n                            *ngSwitchCase=\"filterType.Integer\"\r\n                            class=\"form-group\"\r\n                        >\r\n                            <div>\r\n                                <input\r\n                                    class=\"form-control\"\r\n                                    [formControlName]=\"field.PropertyName\"\r\n                                    [id]=\"field.PropertyName\"\r\n                                    type=\"number\"\r\n                                    focusable\r\n                                    ng-pattern=\"/^[0-9]+$/\"\r\n                                    tabindex=\"0\"\r\n                                />\r\n                            </div>\r\n                            <div *ngSwitchCase=\"filterType.ComboBox\" class=\"form-group\">\r\n                                <div>\r\n                                    <ng-select\r\n                                        appendTo=\"body\"\r\n                                        placeholder=\"Sélectionner {{\r\n                                            field.Label\r\n                                        }}\"\r\n                                        [formControlName]=\"field.PropertyName\"\r\n                                        [id]=\"field.PropertyName\"\r\n                                        [items]=\"field.Data\"\r\n                                        [multiple]=\"field.MultipleSelection\"\r\n                                        [hideSelected]=\"field.HideSelected\"\r\n                                        bindValue=\"{{ field.ValueMember }}\"\r\n                                        [clearable]=\"field.IsClearable\"\r\n                                        bindLabel=\"{{ field.DisplayMember }}\"\r\n                                        [selectOnTab]=\"true\"\r\n                                        [readonly]=\"field.ReadOnly\"\r\n                                    >\r\n                                    </ng-select>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n</div> -->\r\n\r\n\r\n<div class=\"clearfix\" *ngIf=\"!isEmptyFilter()\">\r\n    <!-- Filtre fixé par la vue affichée : non modifiable à l'écran. -->\r\n    <div class=\"view-filter\" *ngIf=\"viewFilterText\" [class.editing]=\"editingViewFilter\">\r\n        <i class=\"fa\" [class.fa-lock]=\"!editingViewFilter\" [class.fa-unlock]=\"editingViewFilter\"></i>\r\n        <span class=\"view-filter-text\" [title]=\"viewFilterText\">{{ viewFilterText }}</span>\r\n        <!-- Mode édition (propriétaire de la vue ou administrateur) : filtres débloqués, puis réenregistrés. -->\r\n        <ng-container *ngIf=\"canEditViewFilter\">\r\n            <button *ngIf=\"!editingViewFilter\" type=\"button\" class=\"view-filter-btn\" title=\"Débloquer les filtres de la vue pour les modifier\"\r\n                (click)=\"editViewFilter()\"><i class=\"fa fa-pencil\"></i> Modifier</button>\r\n            <ng-container *ngIf=\"editingViewFilter\">\r\n                <button type=\"button\" class=\"view-filter-btn primary\" title=\"Enregistrer dans la vue le tri et les filtres de l'écran\"\r\n                    (click)=\"saveViewFilter()\"><i class=\"fa fa-check\"></i> Enregistrer</button>\r\n                <button type=\"button\" class=\"view-filter-btn\" title=\"Revenir aux filtres de la vue\" (click)=\"cancelViewFilter()\">Annuler</button>\r\n            </ng-container>\r\n        </ng-container>\r\n    </div>\r\n    <div class=\"filter-summary\" *ngIf=\"filterList.length\">\r\n        <div class=\"filter\">\r\n            <ng-container *ngIf=\"filterList\">\r\n                <div *ngFor=\"let field of filterList\">\r\n                    <div class=\"option\" [class.clearable]=\"field.Field.IsClearable\" (click)=\"resetFormControl(field.Field)\">\r\n                        {{field.Field.Label + ' : '+ field.DisplayedValue}}\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n</div>\r\n",
-			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.view-filter{display:flex;align-items:center;gap:6px;padding:4px 8px;border-bottom:solid 1px var(--main-bg-color);color:#4465c9;font-size:12px}.view-filter>.fa{opacity:.7}.view-filter.editing{background:#ebf0ff}.view-filter-text{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.view-filter-btn{flex:none;padding:1px 8px;border:1px solid #DBE4FF;border-radius:4px;background:#fff;color:#4465c9;font-size:12px;cursor:pointer}.view-filter-btn.primary{background:#4465c9;border-color:#4465c9;color:#fff}.filter-summary{padding:2px 3px;border-bottom:solid 1px var(--main-bg-color);display:flex}.option alg-field .form-group{display:flex!important}.filter-summary .filter{display:flex;flex-direction:row;padding:2px}.filter-summary .filter .option{display:block;float:left;position:relative;background-color:#dbe4ff;text-transform:capitalize;color:#4465c9;padding:5px 10px;margin:0 5px 0 0;border-radius:20px;cursor:pointer;-webkit-transition:background-color .1s ease-out;-moz-transition:background-color .1s ease-out;-o-transition:background-color .1s ease-out;transition:background-color .1s ease-out;border-left:1px solid #ffffff}.filter-summary .filter .option.clearable:hover{text-decoration:line-through}.filter-summary .filter:before,.filter-summary .filter:after{content:\"\";display:table}.filter-summary:before,.filter-summary:after{content:\"\";display:table}\n"],
-			dependencies: [{
-				kind: "directive",
-				type: i1$5.NgForOf,
-				selector: "[ngFor][ngForOf]",
-				inputs: [
-					"ngForOf",
-					"ngForTrackBy",
-					"ngForTemplate"
-				]
-			}, {
-				kind: "directive",
-				type: i1$5.NgIf,
-				selector: "[ngIf]",
-				inputs: [
-					"ngIf",
-					"ngIfThen",
-					"ngIfElse"
-				]
+			viewQueries: [{
+				propertyName: "listSelect",
+				first: true,
+				predicate: ["listSelect"],
+				descendants: true
 			}],
+			ngImport: i0,
+			template: "<!-- <div class=\"clearfix\" *ngIf=\"!isEmptyFilter()\">\r\n    <div class=\"filter-summary\">\r\n        <div class=\"filter\" [formGroup]=\"wrapper.form\">\r\n            <ng-container *ngIf=\"filterList\">\r\n              \r\n                <div *ngFor=\"let field of Fields\" class=\"option\">\r\n                    <div [ngSwitch]=\"field.FilterType\">\r\n                        <div *ngSwitchCase=\"filterType.String\" class=\"form-group\">\r\n                                <input\r\n                                    class=\"form-control\"\r\n                                    [formControlName]=\"field.PropertyName\"\r\n                                    [id]=\"field.PropertyName\"\r\n                                    [readonly]=\"field.ReadOnly\"\r\n                                    [type]=\"field.InputType\"\r\n                                />\r\n                        </div>\r\n                        <div\r\n                            *ngSwitchCase=\"filterType.Integer\"\r\n                            class=\"form-group\"\r\n                        >\r\n                            <div>\r\n                                <input\r\n                                    class=\"form-control\"\r\n                                    [formControlName]=\"field.PropertyName\"\r\n                                    [id]=\"field.PropertyName\"\r\n                                    type=\"number\"\r\n                                    focusable\r\n                                    ng-pattern=\"/^[0-9]+$/\"\r\n                                    tabindex=\"0\"\r\n                                />\r\n                            </div>\r\n                            <div *ngSwitchCase=\"filterType.ComboBox\" class=\"form-group\">\r\n                                <div>\r\n                                    <ng-select\r\n                                        appendTo=\"body\"\r\n                                        placeholder=\"Sélectionner {{\r\n                                            field.Label\r\n                                        }}\"\r\n                                        [formControlName]=\"field.PropertyName\"\r\n                                        [id]=\"field.PropertyName\"\r\n                                        [items]=\"field.Data\"\r\n                                        [multiple]=\"field.MultipleSelection\"\r\n                                        [hideSelected]=\"field.HideSelected\"\r\n                                        bindValue=\"{{ field.ValueMember }}\"\r\n                                        [clearable]=\"field.IsClearable\"\r\n                                        bindLabel=\"{{ field.DisplayMember }}\"\r\n                                        [selectOnTab]=\"true\"\r\n                                        [readonly]=\"field.ReadOnly\"\r\n                                    >\r\n                                    </ng-select>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n</div> -->\r\n\r\n\r\n<div class=\"clearfix\" *ngIf=\"!isEmptyFilter()\">\r\n    <!-- Filtre fixé par la vue affichée : non modifiable à l'écran. -->\r\n    <div class=\"view-filter\" *ngIf=\"viewFilterText\" [class.editing]=\"editingViewFilter\">\r\n        <i class=\"fa\" [class.fa-lock]=\"!editingViewFilter\" [class.fa-unlock]=\"editingViewFilter\"></i>\r\n        <span class=\"view-filter-text\" [title]=\"viewFilterText\">{{ viewFilterText }}</span>\r\n        <!-- Mode édition (propriétaire de la vue ou administrateur) : filtres débloqués, puis réenregistrés. -->\r\n        <ng-container *ngIf=\"canEditViewFilter\">\r\n            <button *ngIf=\"!editingViewFilter\" type=\"button\" class=\"view-filter-btn\" title=\"Débloquer les filtres de la vue pour les modifier\"\r\n                (click)=\"editViewFilter()\"><i class=\"fa fa-pencil\"></i> Modifier</button>\r\n            <ng-container *ngIf=\"editingViewFilter\">\r\n                <button type=\"button\" class=\"view-filter-btn primary\" title=\"Enregistrer dans la vue le tri et les filtres de l'écran\"\r\n                    (click)=\"saveViewFilter()\"><i class=\"fa fa-check\"></i> Enregistrer</button>\r\n                <button type=\"button\" class=\"view-filter-btn\" title=\"Revenir aux filtres de la vue\" (click)=\"cancelViewFilter()\">Annuler</button>\r\n            </ng-container>\r\n        </ng-container>\r\n    </div>\r\n    <div class=\"filter-summary\" *ngIf=\"filterList.length\">\r\n        <div class=\"filter\">\r\n            <ng-container *ngIf=\"filterList\">\r\n                <div *ngFor=\"let field of filterList\">\r\n                    <!-- Filtre à choix limités : un clic sur le rappel déroule sa liste dessous, le rappel reste affiché tel quel.\r\n                         La croix rouge supprime le filtre et son rappel,\r\n                         qui reste sinon affiché même sans valeur (« Tous »). -->\r\n                    <ng-container *ngIf=\"canOpenList(field.Field); else plainOption\">\r\n                        <div class=\"option list opens-list\" [class.opened]=\"openedProperty === field.Field.PropertyName\"\r\n                            title=\"Choisir {{ field.Field.Label }}\" (click)=\"openList(field.Field)\">\r\n                            {{field.Field.Label + ' : '+ field.DisplayedValue}}\r\n                            <i class=\"fa fa-caret-down option-caret\"></i>\r\n                            <i *ngIf=\"canClear(field.Field)\" class=\"fa fa-times option-clear\" title=\"Supprimer le filtre {{ field.Field.Label }}\"\r\n                                (click)=\"$event.stopPropagation(); resetFormControl(field.Field)\"></i>\r\n                            <!-- Liste invisible posée sur le rappel : seule sa liste déroulée s'affiche. -->\r\n                            <ng-select *ngIf=\"openedProperty === field.Field.PropertyName\"\r\n                                #listSelect\r\n                                class=\"option-select\"\r\n                                appendTo=\"body\"\r\n                                panelClass=\"filter-summary-panel\"\r\n                                [searchable]=\"false\"\r\n                                [items]=\"field.Field.Data\"\r\n                                [bindLabel]=\"field.Field.DisplayMember\"\r\n                                [bindValue]=\"field.Field.ValueMember\"\r\n                                [clearable]=\"false\"\r\n                                [ngModel]=\"currentValue(field.Field)\"\r\n                                (click)=\"$event.stopPropagation()\"\r\n                                (change)=\"selectValue(field.Field, $event)\"\r\n                                (close)=\"closeList()\"\r\n                            >\r\n                            </ng-select>\r\n                        </div>\r\n                    </ng-container>\r\n                    <ng-template #plainOption>\r\n                        <div class=\"option list\">\r\n                            {{field.Field.Label + ' : '+ field.DisplayedValue}}\r\n                            <i *ngIf=\"canClear(field.Field)\" class=\"fa fa-times option-clear\" title=\"Supprimer le filtre {{ field.Field.Label }}\"\r\n                                (click)=\"resetFormControl(field.Field)\"></i>\r\n                        </div>\r\n                    </ng-template>\r\n                </div>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n</div>\r\n",
+			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.view-filter{display:flex;align-items:center;gap:6px;padding:4px 8px;border-bottom:solid 1px var(--main-bg-color);color:#4465c9;font-size:12px}.view-filter>.fa{opacity:.7}.view-filter.editing{background:#ebf0ff}.view-filter-text{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.view-filter-btn{flex:none;padding:1px 8px;border:1px solid #DBE4FF;border-radius:4px;background:#fff;color:#4465c9;font-size:12px;cursor:pointer}.view-filter-btn.primary{background:#4465c9;border-color:#4465c9;color:#fff}.filter-summary{padding:2px 3px;border-bottom:solid 1px var(--main-bg-color);display:flex}.option alg-field .form-group{display:flex!important}.filter-summary .filter{display:flex;flex-direction:row;padding:2px}.filter-summary .filter .option{display:block;float:left;position:relative;background-color:#dbe4ff;text-transform:capitalize;color:#4465c9;padding:5px 10px;margin:0 5px 0 0;border-radius:20px;cursor:pointer;-webkit-transition:background-color .1s ease-out;-moz-transition:background-color .1s ease-out;-o-transition:background-color .1s ease-out;transition:background-color .1s ease-out;border-left:1px solid #ffffff}.filter-summary .filter .option.list{display:flex;align-items:center;gap:6px;cursor:default}.filter-summary .filter .option.list .option-caret,.filter-summary .filter .option.list .option-clear{display:inline-block;padding:0 2px;cursor:pointer;opacity:.7}.filter-summary .filter .option.list .option-caret:hover,.filter-summary .filter .option.list .option-clear:hover{opacity:1}.filter-summary .filter .option.list .option-clear{color:#f78383;visibility:hidden}.filter-summary .filter .option.list:hover .option-clear{visibility:visible}.filter-summary .filter .option.list.opens-list{cursor:pointer}.filter-summary .filter .option.list.opened{border-radius:4px 4px 0 0;box-shadow:inset 0 0 0 1px #4465c9}.filter-summary .filter .option-select{position:absolute;inset:0;opacity:0}.filter-summary .filter .option-select ::ng-deep .ng-select-container{min-height:0;height:100%;cursor:pointer}::ng-deep .ng-dropdown-panel.filter-summary-panel{min-width:180px;margin-top:-1px;border:1px solid #4465C9;border-radius:0 0 4px 4px;overflow:hidden;box-shadow:0 4px 12px #0000001f}::ng-deep .ng-dropdown-panel.filter-summary-panel .ng-dropdown-panel-items .ng-option{padding:5px 10px;background-color:#fff;color:#4465c9;font-weight:400}::ng-deep .ng-dropdown-panel.filter-summary-panel .ng-dropdown-panel-items .ng-option.ng-option-marked,::ng-deep .ng-dropdown-panel.filter-summary-panel .ng-dropdown-panel-items .ng-option.ng-option-selected,::ng-deep .ng-dropdown-panel.filter-summary-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{background-color:#dbe4ff;color:#4465c9}::ng-deep .ng-dropdown-panel.filter-summary-panel .ng-dropdown-panel-items .ng-option .ng-option-label{font-weight:400}.filter-summary .filter:before,.filter-summary .filter:after{content:\"\";display:table}.filter-summary:before,.filter-summary:after{content:\"\";display:table}\n"],
+			dependencies: [
+				{
+					kind: "directive",
+					type: i1$5.NgForOf,
+					selector: "[ngFor][ngForOf]",
+					inputs: [
+						"ngForOf",
+						"ngForTrackBy",
+						"ngForTemplate"
+					]
+				},
+				{
+					kind: "directive",
+					type: i1$5.NgIf,
+					selector: "[ngIf]",
+					inputs: [
+						"ngIf",
+						"ngIfThen",
+						"ngIfElse"
+					]
+				},
+				{
+					kind: "directive",
+					type: i5.NgControlStatus,
+					selector: "[formControlName],[ngModel],[formControl]"
+				},
+				{
+					kind: "directive",
+					type: i5.NgModel,
+					selector: "[ngModel]:not([formControlName]):not([formControl])",
+					inputs: [
+						"name",
+						"disabled",
+						"ngModel",
+						"ngModelOptions"
+					],
+					outputs: ["ngModelChange"],
+					exportAs: ["ngModel"]
+				},
+				{
+					kind: "component",
+					type: i6.NgSelectComponent,
+					selector: "ng-select",
+					inputs: [
+						"ariaLabelDropdown",
+						"ariaLabel",
+						"markFirst",
+						"placeholder",
+						"fixedPlaceholder",
+						"notFoundText",
+						"typeToSearchText",
+						"preventToggleOnRightClick",
+						"addTagText",
+						"loadingText",
+						"clearAllText",
+						"removeText",
+						"dropdownPosition",
+						"appendTo",
+						"outsideClickEvent",
+						"loading",
+						"closeOnSelect",
+						"closeOnScroll",
+						"hideSelected",
+						"selectOnTab",
+						"openOnEnter",
+						"maxSelectedItems",
+						"groupBy",
+						"groupValue",
+						"bufferAmount",
+						"virtualScroll",
+						"selectableGroup",
+						"tabFocusOnClearButton",
+						"selectableGroupAsModel",
+						"searchFn",
+						"trackByFn",
+						"clearOnBackspace",
+						"labelForId",
+						"inputAttrs",
+						"tabIndex",
+						"readonly",
+						"searchWhileComposing",
+						"minTermLength",
+						"editableSearchTerm",
+						"ngClass",
+						"panelClass",
+						"typeahead",
+						"multiple",
+						"addTag",
+						"searchable",
+						"clearable",
+						"clearKeepsDisabledOptions",
+						"deselectOnClick",
+						"clearSearchOnAdd",
+						"compareWith",
+						"keyDownFn",
+						"popover",
+						"bindLabel",
+						"bindValue",
+						"appearance",
+						"isOpen",
+						"items"
+					],
+					outputs: [
+						"bindLabelChange",
+						"bindValueChange",
+						"appearanceChange",
+						"isOpenChange",
+						"itemsChange",
+						"blur",
+						"focus",
+						"change",
+						"open",
+						"close",
+						"search",
+						"clear",
+						"add",
+						"remove",
+						"scroll",
+						"scrollToEnd"
+					],
+					exportAs: ["ngSelect"]
+				}
+			],
 			changeDetection: i0.ChangeDetectionStrategy.Eager
 		});
 	}
@@ -20334,8 +20749,8 @@ i0.ɵɵngDeclareClassMetadata({
 			selector: "alg-filter-summary-panel",
 			changeDetection: ChangeDetectionStrategy.Eager,
 			standalone: false,
-			template: "<!-- <div class=\"clearfix\" *ngIf=\"!isEmptyFilter()\">\r\n    <div class=\"filter-summary\">\r\n        <div class=\"filter\" [formGroup]=\"wrapper.form\">\r\n            <ng-container *ngIf=\"filterList\">\r\n              \r\n                <div *ngFor=\"let field of Fields\" class=\"option\">\r\n                    <div [ngSwitch]=\"field.FilterType\">\r\n                        <div *ngSwitchCase=\"filterType.String\" class=\"form-group\">\r\n                                <input\r\n                                    class=\"form-control\"\r\n                                    [formControlName]=\"field.PropertyName\"\r\n                                    [id]=\"field.PropertyName\"\r\n                                    [readonly]=\"field.ReadOnly\"\r\n                                    [type]=\"field.InputType\"\r\n                                />\r\n                        </div>\r\n                        <div\r\n                            *ngSwitchCase=\"filterType.Integer\"\r\n                            class=\"form-group\"\r\n                        >\r\n                            <div>\r\n                                <input\r\n                                    class=\"form-control\"\r\n                                    [formControlName]=\"field.PropertyName\"\r\n                                    [id]=\"field.PropertyName\"\r\n                                    type=\"number\"\r\n                                    focusable\r\n                                    ng-pattern=\"/^[0-9]+$/\"\r\n                                    tabindex=\"0\"\r\n                                />\r\n                            </div>\r\n                            <div *ngSwitchCase=\"filterType.ComboBox\" class=\"form-group\">\r\n                                <div>\r\n                                    <ng-select\r\n                                        appendTo=\"body\"\r\n                                        placeholder=\"Sélectionner {{\r\n                                            field.Label\r\n                                        }}\"\r\n                                        [formControlName]=\"field.PropertyName\"\r\n                                        [id]=\"field.PropertyName\"\r\n                                        [items]=\"field.Data\"\r\n                                        [multiple]=\"field.MultipleSelection\"\r\n                                        [hideSelected]=\"field.HideSelected\"\r\n                                        bindValue=\"{{ field.ValueMember }}\"\r\n                                        [clearable]=\"field.IsClearable\"\r\n                                        bindLabel=\"{{ field.DisplayMember }}\"\r\n                                        [selectOnTab]=\"true\"\r\n                                        [readonly]=\"field.ReadOnly\"\r\n                                    >\r\n                                    </ng-select>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n</div> -->\r\n\r\n\r\n<div class=\"clearfix\" *ngIf=\"!isEmptyFilter()\">\r\n    <!-- Filtre fixé par la vue affichée : non modifiable à l'écran. -->\r\n    <div class=\"view-filter\" *ngIf=\"viewFilterText\" [class.editing]=\"editingViewFilter\">\r\n        <i class=\"fa\" [class.fa-lock]=\"!editingViewFilter\" [class.fa-unlock]=\"editingViewFilter\"></i>\r\n        <span class=\"view-filter-text\" [title]=\"viewFilterText\">{{ viewFilterText }}</span>\r\n        <!-- Mode édition (propriétaire de la vue ou administrateur) : filtres débloqués, puis réenregistrés. -->\r\n        <ng-container *ngIf=\"canEditViewFilter\">\r\n            <button *ngIf=\"!editingViewFilter\" type=\"button\" class=\"view-filter-btn\" title=\"Débloquer les filtres de la vue pour les modifier\"\r\n                (click)=\"editViewFilter()\"><i class=\"fa fa-pencil\"></i> Modifier</button>\r\n            <ng-container *ngIf=\"editingViewFilter\">\r\n                <button type=\"button\" class=\"view-filter-btn primary\" title=\"Enregistrer dans la vue le tri et les filtres de l'écran\"\r\n                    (click)=\"saveViewFilter()\"><i class=\"fa fa-check\"></i> Enregistrer</button>\r\n                <button type=\"button\" class=\"view-filter-btn\" title=\"Revenir aux filtres de la vue\" (click)=\"cancelViewFilter()\">Annuler</button>\r\n            </ng-container>\r\n        </ng-container>\r\n    </div>\r\n    <div class=\"filter-summary\" *ngIf=\"filterList.length\">\r\n        <div class=\"filter\">\r\n            <ng-container *ngIf=\"filterList\">\r\n                <div *ngFor=\"let field of filterList\">\r\n                    <div class=\"option\" [class.clearable]=\"field.Field.IsClearable\" (click)=\"resetFormControl(field.Field)\">\r\n                        {{field.Field.Label + ' : '+ field.DisplayedValue}}\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n</div>\r\n",
-			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.view-filter{display:flex;align-items:center;gap:6px;padding:4px 8px;border-bottom:solid 1px var(--main-bg-color);color:#4465c9;font-size:12px}.view-filter>.fa{opacity:.7}.view-filter.editing{background:#ebf0ff}.view-filter-text{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.view-filter-btn{flex:none;padding:1px 8px;border:1px solid #DBE4FF;border-radius:4px;background:#fff;color:#4465c9;font-size:12px;cursor:pointer}.view-filter-btn.primary{background:#4465c9;border-color:#4465c9;color:#fff}.filter-summary{padding:2px 3px;border-bottom:solid 1px var(--main-bg-color);display:flex}.option alg-field .form-group{display:flex!important}.filter-summary .filter{display:flex;flex-direction:row;padding:2px}.filter-summary .filter .option{display:block;float:left;position:relative;background-color:#dbe4ff;text-transform:capitalize;color:#4465c9;padding:5px 10px;margin:0 5px 0 0;border-radius:20px;cursor:pointer;-webkit-transition:background-color .1s ease-out;-moz-transition:background-color .1s ease-out;-o-transition:background-color .1s ease-out;transition:background-color .1s ease-out;border-left:1px solid #ffffff}.filter-summary .filter .option.clearable:hover{text-decoration:line-through}.filter-summary .filter:before,.filter-summary .filter:after{content:\"\";display:table}.filter-summary:before,.filter-summary:after{content:\"\";display:table}\n"]
+			template: "<!-- <div class=\"clearfix\" *ngIf=\"!isEmptyFilter()\">\r\n    <div class=\"filter-summary\">\r\n        <div class=\"filter\" [formGroup]=\"wrapper.form\">\r\n            <ng-container *ngIf=\"filterList\">\r\n              \r\n                <div *ngFor=\"let field of Fields\" class=\"option\">\r\n                    <div [ngSwitch]=\"field.FilterType\">\r\n                        <div *ngSwitchCase=\"filterType.String\" class=\"form-group\">\r\n                                <input\r\n                                    class=\"form-control\"\r\n                                    [formControlName]=\"field.PropertyName\"\r\n                                    [id]=\"field.PropertyName\"\r\n                                    [readonly]=\"field.ReadOnly\"\r\n                                    [type]=\"field.InputType\"\r\n                                />\r\n                        </div>\r\n                        <div\r\n                            *ngSwitchCase=\"filterType.Integer\"\r\n                            class=\"form-group\"\r\n                        >\r\n                            <div>\r\n                                <input\r\n                                    class=\"form-control\"\r\n                                    [formControlName]=\"field.PropertyName\"\r\n                                    [id]=\"field.PropertyName\"\r\n                                    type=\"number\"\r\n                                    focusable\r\n                                    ng-pattern=\"/^[0-9]+$/\"\r\n                                    tabindex=\"0\"\r\n                                />\r\n                            </div>\r\n                            <div *ngSwitchCase=\"filterType.ComboBox\" class=\"form-group\">\r\n                                <div>\r\n                                    <ng-select\r\n                                        appendTo=\"body\"\r\n                                        placeholder=\"Sélectionner {{\r\n                                            field.Label\r\n                                        }}\"\r\n                                        [formControlName]=\"field.PropertyName\"\r\n                                        [id]=\"field.PropertyName\"\r\n                                        [items]=\"field.Data\"\r\n                                        [multiple]=\"field.MultipleSelection\"\r\n                                        [hideSelected]=\"field.HideSelected\"\r\n                                        bindValue=\"{{ field.ValueMember }}\"\r\n                                        [clearable]=\"field.IsClearable\"\r\n                                        bindLabel=\"{{ field.DisplayMember }}\"\r\n                                        [selectOnTab]=\"true\"\r\n                                        [readonly]=\"field.ReadOnly\"\r\n                                    >\r\n                                    </ng-select>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n</div> -->\r\n\r\n\r\n<div class=\"clearfix\" *ngIf=\"!isEmptyFilter()\">\r\n    <!-- Filtre fixé par la vue affichée : non modifiable à l'écran. -->\r\n    <div class=\"view-filter\" *ngIf=\"viewFilterText\" [class.editing]=\"editingViewFilter\">\r\n        <i class=\"fa\" [class.fa-lock]=\"!editingViewFilter\" [class.fa-unlock]=\"editingViewFilter\"></i>\r\n        <span class=\"view-filter-text\" [title]=\"viewFilterText\">{{ viewFilterText }}</span>\r\n        <!-- Mode édition (propriétaire de la vue ou administrateur) : filtres débloqués, puis réenregistrés. -->\r\n        <ng-container *ngIf=\"canEditViewFilter\">\r\n            <button *ngIf=\"!editingViewFilter\" type=\"button\" class=\"view-filter-btn\" title=\"Débloquer les filtres de la vue pour les modifier\"\r\n                (click)=\"editViewFilter()\"><i class=\"fa fa-pencil\"></i> Modifier</button>\r\n            <ng-container *ngIf=\"editingViewFilter\">\r\n                <button type=\"button\" class=\"view-filter-btn primary\" title=\"Enregistrer dans la vue le tri et les filtres de l'écran\"\r\n                    (click)=\"saveViewFilter()\"><i class=\"fa fa-check\"></i> Enregistrer</button>\r\n                <button type=\"button\" class=\"view-filter-btn\" title=\"Revenir aux filtres de la vue\" (click)=\"cancelViewFilter()\">Annuler</button>\r\n            </ng-container>\r\n        </ng-container>\r\n    </div>\r\n    <div class=\"filter-summary\" *ngIf=\"filterList.length\">\r\n        <div class=\"filter\">\r\n            <ng-container *ngIf=\"filterList\">\r\n                <div *ngFor=\"let field of filterList\">\r\n                    <!-- Filtre à choix limités : un clic sur le rappel déroule sa liste dessous, le rappel reste affiché tel quel.\r\n                         La croix rouge supprime le filtre et son rappel,\r\n                         qui reste sinon affiché même sans valeur (« Tous »). -->\r\n                    <ng-container *ngIf=\"canOpenList(field.Field); else plainOption\">\r\n                        <div class=\"option list opens-list\" [class.opened]=\"openedProperty === field.Field.PropertyName\"\r\n                            title=\"Choisir {{ field.Field.Label }}\" (click)=\"openList(field.Field)\">\r\n                            {{field.Field.Label + ' : '+ field.DisplayedValue}}\r\n                            <i class=\"fa fa-caret-down option-caret\"></i>\r\n                            <i *ngIf=\"canClear(field.Field)\" class=\"fa fa-times option-clear\" title=\"Supprimer le filtre {{ field.Field.Label }}\"\r\n                                (click)=\"$event.stopPropagation(); resetFormControl(field.Field)\"></i>\r\n                            <!-- Liste invisible posée sur le rappel : seule sa liste déroulée s'affiche. -->\r\n                            <ng-select *ngIf=\"openedProperty === field.Field.PropertyName\"\r\n                                #listSelect\r\n                                class=\"option-select\"\r\n                                appendTo=\"body\"\r\n                                panelClass=\"filter-summary-panel\"\r\n                                [searchable]=\"false\"\r\n                                [items]=\"field.Field.Data\"\r\n                                [bindLabel]=\"field.Field.DisplayMember\"\r\n                                [bindValue]=\"field.Field.ValueMember\"\r\n                                [clearable]=\"false\"\r\n                                [ngModel]=\"currentValue(field.Field)\"\r\n                                (click)=\"$event.stopPropagation()\"\r\n                                (change)=\"selectValue(field.Field, $event)\"\r\n                                (close)=\"closeList()\"\r\n                            >\r\n                            </ng-select>\r\n                        </div>\r\n                    </ng-container>\r\n                    <ng-template #plainOption>\r\n                        <div class=\"option list\">\r\n                            {{field.Field.Label + ' : '+ field.DisplayedValue}}\r\n                            <i *ngIf=\"canClear(field.Field)\" class=\"fa fa-times option-clear\" title=\"Supprimer le filtre {{ field.Field.Label }}\"\r\n                                (click)=\"resetFormControl(field.Field)\"></i>\r\n                        </div>\r\n                    </ng-template>\r\n                </div>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n</div>\r\n",
+			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.view-filter{display:flex;align-items:center;gap:6px;padding:4px 8px;border-bottom:solid 1px var(--main-bg-color);color:#4465c9;font-size:12px}.view-filter>.fa{opacity:.7}.view-filter.editing{background:#ebf0ff}.view-filter-text{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.view-filter-btn{flex:none;padding:1px 8px;border:1px solid #DBE4FF;border-radius:4px;background:#fff;color:#4465c9;font-size:12px;cursor:pointer}.view-filter-btn.primary{background:#4465c9;border-color:#4465c9;color:#fff}.filter-summary{padding:2px 3px;border-bottom:solid 1px var(--main-bg-color);display:flex}.option alg-field .form-group{display:flex!important}.filter-summary .filter{display:flex;flex-direction:row;padding:2px}.filter-summary .filter .option{display:block;float:left;position:relative;background-color:#dbe4ff;text-transform:capitalize;color:#4465c9;padding:5px 10px;margin:0 5px 0 0;border-radius:20px;cursor:pointer;-webkit-transition:background-color .1s ease-out;-moz-transition:background-color .1s ease-out;-o-transition:background-color .1s ease-out;transition:background-color .1s ease-out;border-left:1px solid #ffffff}.filter-summary .filter .option.list{display:flex;align-items:center;gap:6px;cursor:default}.filter-summary .filter .option.list .option-caret,.filter-summary .filter .option.list .option-clear{display:inline-block;padding:0 2px;cursor:pointer;opacity:.7}.filter-summary .filter .option.list .option-caret:hover,.filter-summary .filter .option.list .option-clear:hover{opacity:1}.filter-summary .filter .option.list .option-clear{color:#f78383;visibility:hidden}.filter-summary .filter .option.list:hover .option-clear{visibility:visible}.filter-summary .filter .option.list.opens-list{cursor:pointer}.filter-summary .filter .option.list.opened{border-radius:4px 4px 0 0;box-shadow:inset 0 0 0 1px #4465c9}.filter-summary .filter .option-select{position:absolute;inset:0;opacity:0}.filter-summary .filter .option-select ::ng-deep .ng-select-container{min-height:0;height:100%;cursor:pointer}::ng-deep .ng-dropdown-panel.filter-summary-panel{min-width:180px;margin-top:-1px;border:1px solid #4465C9;border-radius:0 0 4px 4px;overflow:hidden;box-shadow:0 4px 12px #0000001f}::ng-deep .ng-dropdown-panel.filter-summary-panel .ng-dropdown-panel-items .ng-option{padding:5px 10px;background-color:#fff;color:#4465c9;font-weight:400}::ng-deep .ng-dropdown-panel.filter-summary-panel .ng-dropdown-panel-items .ng-option.ng-option-marked,::ng-deep .ng-dropdown-panel.filter-summary-panel .ng-dropdown-panel-items .ng-option.ng-option-selected,::ng-deep .ng-dropdown-panel.filter-summary-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{background-color:#dbe4ff;color:#4465c9}::ng-deep .ng-dropdown-panel.filter-summary-panel .ng-dropdown-panel-items .ng-option .ng-option-label{font-weight:400}.filter-summary .filter:before,.filter-summary .filter:after{content:\"\";display:table}.filter-summary:before,.filter-summary:after{content:\"\";display:table}\n"]
 		}]
 	}],
 	ctorParameters: () => [
@@ -20345,7 +20760,11 @@ i0.ɵɵngDeclareClassMetadata({
 	],
 	propDecorators: {
 		entityKey: [{ type: Input }],
-		guid: [{ type: Input }]
+		guid: [{ type: Input }],
+		listSelect: [{
+			type: ViewChild,
+			args: ["listSelect"]
+		}]
 	}
 });
 var ViewModelLoaderService = class ViewModelLoaderService {
@@ -20750,7 +21169,7 @@ var PropertyEditorComponent = class PropertyEditorComponent {
 			}],
 			ngImport: i0,
 			template: "<form class=\"propertyGridform\">\r\n    <ng-container *ngIf=\"this.viewModel$ | async as vm\">\r\n        <alg-editor-tabset #tabs class=\"property-grid-tabset\" [sectionContext]=\"facade.sections\">\r\n            <alg-editor-tab [active]=\"1 == 1\">\r\n                <div [attr.id]=\"'content-0'\" class=\"property-grid-tab\">\r\n                    <div class=\"property-container\">\r\n                        <ng-container *ngIf=\"propertyForm\">\r\n                            <ng-container\r\n                                *ngFor=\" let section of vm.FieldSections;let i = index\">\r\n                                <div class=\"property-section-container\"\r\n                                    [hidden]=\"this.isSectionHidden(section)\">\r\n                                    <div class=\"property-section-title\">\r\n                                        {{ section.Name }}\r\n                                    </div>\r\n\r\n                                    <div class=\"property-section-content\">\r\n                                        <ng-container\r\n                                            *ngFor=\"let field of section.FieldViewModels;let j = index\">\r\n                                            <!-- [class.property-row-center]=\"field.FilterType ==filterTypes.CheckBox\" -->\r\n                                            <div class=\"property-row\"\r\n                                                [hidden]=\"field.IsHidden ||this.isFieldHidden(field)\">\r\n                                                <alg-field\r\n                                                    [field]=\"field\"\r\n                                                    [form]=\"propertyForm\"\r\n                                                    (propertyChanged)=\"onPropertyChanged($event)\"\r\n                                                    [readonly]=\"this.readonly\"\r\n                                                    >\r\n                                                    <!-- [readonly]=\"this.readonly\" -->\r\n                                                </alg-field>\r\n                                            </div>\r\n                                        </ng-container>\r\n                                    </div>\r\n                                </div>\r\n                            </ng-container>\r\n                        </ng-container>\r\n                    </div>\r\n                </div>\r\n            </alg-editor-tab>\r\n            <ng-container *ngIf=\"facade.sections.sections$ | async as dynamicSections\">\r\n                <ng-container *ngFor=\"let section of dynamicSections; let x = index\">\r\n                        <alg-editor-tab \r\n                            [title]=\"section.Name\" \r\n                            [active]=\"false\"\r\n                            [iconUrl]=\"section.IconUrl\"\r\n                            [hidden]=\"!section.IsVisible\">\r\n                            <ng-template #templateContainer></ng-template>\r\n                        </alg-editor-tab>\r\n                </ng-container>\r\n            </ng-container>\r\n\r\n        </alg-editor-tabset>\r\n    </ng-container>\r\n</form>\r\n",
-			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.propertyGridform{height:100%;width:100%}.property-grid-tabset{height:100%}.property-grid-tab{height:100%;width:100%;padding:5px}.property-row-center{padding-top:21px}.property-section-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(225px,1fr));align-items:flex-start;align-content:flex-start;gap:10px;margin:0 10px}.property-section-container{display:flex;flex-direction:column;background:#f7faff;border-radius:5px;border:1px solid #C1D0FD;padding-bottom:10px}.property-section-title{display:block;font-size:14px;background:#f7faff;border-bottom:none;padding:2px 0;margin:10px;line-height:24px;font-weight:700;border-bottom:solid 1px #C1D0FD;color:#4d5a81}.property-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:10px;padding:5px;height:100%;overflow:auto}.property-row{display:flex;flex-wrap:wrap;align-items:center;flex:25%;gap:10px}.property-label{color:#4465c9}.property-label span{padding-top:5px;display:inline-block;margin-right:5px}.property-label.invalid{color:red}.property-input{flex:2;min-width:200px}.checkbox-container{display:flex;align-items:center;gap:5px}.validation-error{color:red;font-size:.9rem}\n", ".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.action-panel{display:block;height:auto;border-bottom:solid 1px #3C5DC4;width:auto;overflow:hidden;padding:3px 0}.action-panel-container{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;justify-items:center;justify-content:flex-start;width:30000px;padding:2px 5px;min-height:34px}.action-panel-container .input-img{margin-right:5px;min-width:150px}.action-panel-container>div{padding:2px;margin-right:0}.action-panel-container>button{padding:2px;margin-right:0}.action-panel-container .button-container{margin-right:3px;padding:3px;height:30px}.action-panel-container .button-container .img{padding:3px;margin-right:0}.action-panel-container .button-container:hover{background-color:#eaeaea}.action-panel-container .action-title{display:flex}.action-panel-container .action-title h1{display:block;font-size:14px;background:#fff;border-bottom:none;padding:2px 0 2px 10px;margin:0;line-height:24px;font-weight:700}.action-panel-container .action-title span{display:flex;margin:0 8px;padding:0;font-size:15px;flex-wrap:nowrap}.action-label{display:flex;flex-wrap:nowrap}.action-icon{margin:0 2px;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.search-bar-action{height:26px;min-height:26px;border-radius:5px}.input-img{position:relative;margin:0 5px 0 0;min-width:250px}.input-img .search-pin{position:absolute;top:5px;left:5px;height:16px;width:16px}.action-panel.narrow{background:#4465c9;border-bottom:none;padding:6px 0}.action-panel.narrow .action-panel-container{width:auto;min-height:30px;padding:0 8px;gap:8px}.action-panel.narrow .action-panel-container>div{padding:0}.action-panel.narrow .action-panel-container .button-container,.action-panel.narrow .action-panel-container ::ng-deep [actions-content]{display:none!important}.action-panel.narrow .action-panel-container .action-title{flex:0 1 auto;min-width:0}.action-panel.narrow .action-panel-container .action-title h1{overflow:hidden;height:30px;padding:0 12px;border-radius:5px;background:#6684e0;color:#fff;font-size:12.5px;font-weight:600;line-height:30px;white-space:nowrap;text-overflow:ellipsis}.action-panel.narrow .action-panel-container .action-title span{display:none}.action-panel.narrow .action-panel-container .input-img{flex:1 1 auto;min-width:0;margin:0}.action-panel.narrow .action-panel-container .action-mobile-menu{flex:none;margin-left:auto}.action-panel.narrow .action-panel-container .search-bar-action{width:100%;height:30px;border:none}\n"],
+			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.propertyGridform{height:100%;width:100%}.property-grid-tabset{height:100%}.property-grid-tab{height:100%;width:100%;padding:5px}.property-row-center{padding-top:21px}.property-section-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(225px,1fr));align-items:flex-start;align-content:flex-start;gap:10px;margin:0 10px}.property-section-container{display:flex;flex-direction:column;background:#f7faff;border-radius:5px;border:1px solid #C1D0FD;padding-bottom:10px}.property-section-title{display:block;font-size:14px;background:#f7faff;border-bottom:none;padding:2px 0;margin:10px;line-height:24px;font-weight:700;border-bottom:solid 1px #C1D0FD;color:#4d5a81}.property-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:10px;padding:5px;height:100%;overflow:auto}.property-row{display:flex;flex-wrap:wrap;align-items:center;flex:25%;gap:10px}.property-label{color:#4465c9}.property-label span{padding-top:5px;display:inline-block;margin-right:5px}.property-label.invalid{color:red}.property-input{flex:2;min-width:200px}.checkbox-container{display:flex;align-items:center;gap:5px}.validation-error{color:red;font-size:.9rem}\n", ".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.action-panel{display:block;height:auto;border-bottom:solid 1px #3C5DC4;width:auto;overflow:hidden;padding:3px 0}.action-panel-container{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;justify-items:center;justify-content:flex-start;width:30000px;padding:2px 5px;min-height:34px}.action-panel-container .input-img{margin-right:5px;min-width:150px}.action-panel-container>div{padding:2px;margin-right:0}.action-panel-container>button{padding:2px;margin-right:0}.action-panel-container .button-container{margin-right:3px;padding:3px;height:30px}.action-panel-container .button-container .img{padding:3px;margin-right:0}.action-panel-container .button-container:hover{background-color:#eaeaea}.action-panel-container .action-title{display:flex}.action-panel-container .action-title h1{display:block;font-size:14px;background:#fff;border-bottom:none;padding:2px 0 2px 10px;margin:0;line-height:24px;font-weight:700}.action-panel-container .action-title span{display:flex;margin:0 8px;padding:0;font-size:15px;flex-wrap:nowrap}.action-label{display:flex;flex-wrap:nowrap}.action-icon{margin:0 2px;filter:brightness(0) saturate(100%) invert(36%) sepia(91%) saturate(628%) hue-rotate(191deg) brightness(89%) contrast(85%) brightness(75%)}.search-bar-action{height:26px;min-height:26px;border-radius:5px}.input-img{position:relative;margin:0 5px 0 0;min-width:250px}.input-img .search-icon{position:absolute;top:50%;left:9px;transform:translateY(-50%);font-size:12px;color:#9fa9c7;pointer-events:none;z-index:1}.input-img .search-bar-action{padding-left:27px}.input-img .search-pin{position:absolute;top:5px;left:5px;height:16px;width:16px}.action-panel.narrow{background:#4465c9;border-bottom:none;padding:6px 0}.action-panel.narrow .action-panel-container{width:auto;min-height:30px;padding:0 8px;gap:8px}.action-panel.narrow .action-panel-container>div{padding:0}.action-panel.narrow .action-panel-container .button-container,.action-panel.narrow .action-panel-container ::ng-deep [actions-content]{display:none!important}.action-panel.narrow .action-panel-container .action-title{flex:0 1 auto;min-width:0}.action-panel.narrow .action-panel-container .action-title h1{overflow:hidden;height:30px;padding:0 12px;border-radius:5px;background:#6684e0;color:#fff;font-size:12.5px;font-weight:600;line-height:30px;white-space:nowrap;text-overflow:ellipsis}.action-panel.narrow .action-panel-container .action-title span{display:none}.action-panel.narrow .action-panel-container .input-img{flex:1 1 auto;min-width:0;margin:0}.action-panel.narrow .action-panel-container .action-mobile-menu{flex:none;margin-left:auto}.action-panel.narrow .action-panel-container .search-bar-action{width:100%;height:30px;border:none}.action-btn.save-active{color:#d1353a}.action-btn.save-active .action-icon{filter:brightness(0) saturate(100%) invert(25%) sepia(61%) saturate(2196%) hue-rotate(334deg) brightness(100%) contrast(94%)}\n"],
 			dependencies: [
 				{
 					kind: "directive",
@@ -20849,7 +21268,7 @@ i0.ɵɵngDeclareClassMetadata({
 			changeDetection: ChangeDetectionStrategy.Eager,
 			standalone: false,
 			template: "<form class=\"propertyGridform\">\r\n    <ng-container *ngIf=\"this.viewModel$ | async as vm\">\r\n        <alg-editor-tabset #tabs class=\"property-grid-tabset\" [sectionContext]=\"facade.sections\">\r\n            <alg-editor-tab [active]=\"1 == 1\">\r\n                <div [attr.id]=\"'content-0'\" class=\"property-grid-tab\">\r\n                    <div class=\"property-container\">\r\n                        <ng-container *ngIf=\"propertyForm\">\r\n                            <ng-container\r\n                                *ngFor=\" let section of vm.FieldSections;let i = index\">\r\n                                <div class=\"property-section-container\"\r\n                                    [hidden]=\"this.isSectionHidden(section)\">\r\n                                    <div class=\"property-section-title\">\r\n                                        {{ section.Name }}\r\n                                    </div>\r\n\r\n                                    <div class=\"property-section-content\">\r\n                                        <ng-container\r\n                                            *ngFor=\"let field of section.FieldViewModels;let j = index\">\r\n                                            <!-- [class.property-row-center]=\"field.FilterType ==filterTypes.CheckBox\" -->\r\n                                            <div class=\"property-row\"\r\n                                                [hidden]=\"field.IsHidden ||this.isFieldHidden(field)\">\r\n                                                <alg-field\r\n                                                    [field]=\"field\"\r\n                                                    [form]=\"propertyForm\"\r\n                                                    (propertyChanged)=\"onPropertyChanged($event)\"\r\n                                                    [readonly]=\"this.readonly\"\r\n                                                    >\r\n                                                    <!-- [readonly]=\"this.readonly\" -->\r\n                                                </alg-field>\r\n                                            </div>\r\n                                        </ng-container>\r\n                                    </div>\r\n                                </div>\r\n                            </ng-container>\r\n                        </ng-container>\r\n                    </div>\r\n                </div>\r\n            </alg-editor-tab>\r\n            <ng-container *ngIf=\"facade.sections.sections$ | async as dynamicSections\">\r\n                <ng-container *ngFor=\"let section of dynamicSections; let x = index\">\r\n                        <alg-editor-tab \r\n                            [title]=\"section.Name\" \r\n                            [active]=\"false\"\r\n                            [iconUrl]=\"section.IconUrl\"\r\n                            [hidden]=\"!section.IsVisible\">\r\n                            <ng-template #templateContainer></ng-template>\r\n                        </alg-editor-tab>\r\n                </ng-container>\r\n            </ng-container>\r\n\r\n        </alg-editor-tabset>\r\n    </ng-container>\r\n</form>\r\n",
-			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.propertyGridform{height:100%;width:100%}.property-grid-tabset{height:100%}.property-grid-tab{height:100%;width:100%;padding:5px}.property-row-center{padding-top:21px}.property-section-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(225px,1fr));align-items:flex-start;align-content:flex-start;gap:10px;margin:0 10px}.property-section-container{display:flex;flex-direction:column;background:#f7faff;border-radius:5px;border:1px solid #C1D0FD;padding-bottom:10px}.property-section-title{display:block;font-size:14px;background:#f7faff;border-bottom:none;padding:2px 0;margin:10px;line-height:24px;font-weight:700;border-bottom:solid 1px #C1D0FD;color:#4d5a81}.property-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:10px;padding:5px;height:100%;overflow:auto}.property-row{display:flex;flex-wrap:wrap;align-items:center;flex:25%;gap:10px}.property-label{color:#4465c9}.property-label span{padding-top:5px;display:inline-block;margin-right:5px}.property-label.invalid{color:red}.property-input{flex:2;min-width:200px}.checkbox-container{display:flex;align-items:center;gap:5px}.validation-error{color:red;font-size:.9rem}\n", ".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.action-panel{display:block;height:auto;border-bottom:solid 1px #3C5DC4;width:auto;overflow:hidden;padding:3px 0}.action-panel-container{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;justify-items:center;justify-content:flex-start;width:30000px;padding:2px 5px;min-height:34px}.action-panel-container .input-img{margin-right:5px;min-width:150px}.action-panel-container>div{padding:2px;margin-right:0}.action-panel-container>button{padding:2px;margin-right:0}.action-panel-container .button-container{margin-right:3px;padding:3px;height:30px}.action-panel-container .button-container .img{padding:3px;margin-right:0}.action-panel-container .button-container:hover{background-color:#eaeaea}.action-panel-container .action-title{display:flex}.action-panel-container .action-title h1{display:block;font-size:14px;background:#fff;border-bottom:none;padding:2px 0 2px 10px;margin:0;line-height:24px;font-weight:700}.action-panel-container .action-title span{display:flex;margin:0 8px;padding:0;font-size:15px;flex-wrap:nowrap}.action-label{display:flex;flex-wrap:nowrap}.action-icon{margin:0 2px;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.search-bar-action{height:26px;min-height:26px;border-radius:5px}.input-img{position:relative;margin:0 5px 0 0;min-width:250px}.input-img .search-pin{position:absolute;top:5px;left:5px;height:16px;width:16px}.action-panel.narrow{background:#4465c9;border-bottom:none;padding:6px 0}.action-panel.narrow .action-panel-container{width:auto;min-height:30px;padding:0 8px;gap:8px}.action-panel.narrow .action-panel-container>div{padding:0}.action-panel.narrow .action-panel-container .button-container,.action-panel.narrow .action-panel-container ::ng-deep [actions-content]{display:none!important}.action-panel.narrow .action-panel-container .action-title{flex:0 1 auto;min-width:0}.action-panel.narrow .action-panel-container .action-title h1{overflow:hidden;height:30px;padding:0 12px;border-radius:5px;background:#6684e0;color:#fff;font-size:12.5px;font-weight:600;line-height:30px;white-space:nowrap;text-overflow:ellipsis}.action-panel.narrow .action-panel-container .action-title span{display:none}.action-panel.narrow .action-panel-container .input-img{flex:1 1 auto;min-width:0;margin:0}.action-panel.narrow .action-panel-container .action-mobile-menu{flex:none;margin-left:auto}.action-panel.narrow .action-panel-container .search-bar-action{width:100%;height:30px;border:none}\n"]
+			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.propertyGridform{height:100%;width:100%}.property-grid-tabset{height:100%}.property-grid-tab{height:100%;width:100%;padding:5px}.property-row-center{padding-top:21px}.property-section-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(225px,1fr));align-items:flex-start;align-content:flex-start;gap:10px;margin:0 10px}.property-section-container{display:flex;flex-direction:column;background:#f7faff;border-radius:5px;border:1px solid #C1D0FD;padding-bottom:10px}.property-section-title{display:block;font-size:14px;background:#f7faff;border-bottom:none;padding:2px 0;margin:10px;line-height:24px;font-weight:700;border-bottom:solid 1px #C1D0FD;color:#4d5a81}.property-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:10px;padding:5px;height:100%;overflow:auto}.property-row{display:flex;flex-wrap:wrap;align-items:center;flex:25%;gap:10px}.property-label{color:#4465c9}.property-label span{padding-top:5px;display:inline-block;margin-right:5px}.property-label.invalid{color:red}.property-input{flex:2;min-width:200px}.checkbox-container{display:flex;align-items:center;gap:5px}.validation-error{color:red;font-size:.9rem}\n", ".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}.action-panel{display:block;height:auto;border-bottom:solid 1px #3C5DC4;width:auto;overflow:hidden;padding:3px 0}.action-panel-container{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;justify-items:center;justify-content:flex-start;width:30000px;padding:2px 5px;min-height:34px}.action-panel-container .input-img{margin-right:5px;min-width:150px}.action-panel-container>div{padding:2px;margin-right:0}.action-panel-container>button{padding:2px;margin-right:0}.action-panel-container .button-container{margin-right:3px;padding:3px;height:30px}.action-panel-container .button-container .img{padding:3px;margin-right:0}.action-panel-container .button-container:hover{background-color:#eaeaea}.action-panel-container .action-title{display:flex}.action-panel-container .action-title h1{display:block;font-size:14px;background:#fff;border-bottom:none;padding:2px 0 2px 10px;margin:0;line-height:24px;font-weight:700}.action-panel-container .action-title span{display:flex;margin:0 8px;padding:0;font-size:15px;flex-wrap:nowrap}.action-label{display:flex;flex-wrap:nowrap}.action-icon{margin:0 2px;filter:brightness(0) saturate(100%) invert(36%) sepia(91%) saturate(628%) hue-rotate(191deg) brightness(89%) contrast(85%) brightness(75%)}.search-bar-action{height:26px;min-height:26px;border-radius:5px}.input-img{position:relative;margin:0 5px 0 0;min-width:250px}.input-img .search-icon{position:absolute;top:50%;left:9px;transform:translateY(-50%);font-size:12px;color:#9fa9c7;pointer-events:none;z-index:1}.input-img .search-bar-action{padding-left:27px}.input-img .search-pin{position:absolute;top:5px;left:5px;height:16px;width:16px}.action-panel.narrow{background:#4465c9;border-bottom:none;padding:6px 0}.action-panel.narrow .action-panel-container{width:auto;min-height:30px;padding:0 8px;gap:8px}.action-panel.narrow .action-panel-container>div{padding:0}.action-panel.narrow .action-panel-container .button-container,.action-panel.narrow .action-panel-container ::ng-deep [actions-content]{display:none!important}.action-panel.narrow .action-panel-container .action-title{flex:0 1 auto;min-width:0}.action-panel.narrow .action-panel-container .action-title h1{overflow:hidden;height:30px;padding:0 12px;border-radius:5px;background:#6684e0;color:#fff;font-size:12.5px;font-weight:600;line-height:30px;white-space:nowrap;text-overflow:ellipsis}.action-panel.narrow .action-panel-container .action-title span{display:none}.action-panel.narrow .action-panel-container .input-img{flex:1 1 auto;min-width:0;margin:0}.action-panel.narrow .action-panel-container .action-mobile-menu{flex:none;margin-left:auto}.action-panel.narrow .action-panel-container .search-bar-action{width:100%;height:30px;border:none}.action-btn.save-active{color:#d1353a}.action-btn.save-active .action-icon{filter:brightness(0) saturate(100%) invert(25%) sepia(61%) saturate(2196%) hue-rotate(334deg) brightness(100%) contrast(94%)}\n"]
 		}]
 	}],
 	ctorParameters: () => [
@@ -22165,7 +22584,7 @@ var GridFieldComponent = class GridFieldComponent {
 			}],
 			ngImport: i0,
 			template: "<div [formGroup]=\"form\" class=\"field-container\">\r\n    <ng-container *ngIf=\"field\">\r\n        <div [hidden]=\"!!field.IsHidden\" [ngSwitch]=\"field.FilterType\">\r\n            <div class=\"label-group\" *ngIf=\"showLabel\">\r\n                <label *ngIf=\"field.FilterType != filterType.CheckBox && field.FilterType != filterType.HorizComboBox\"\r\n                    [htmlFor]=\"field.PropertyName\">\r\n                    {{ field.Label }}\r\n                </label>\r\n                <img\r\n                    *ngIf=\"field.Required\"\r\n                    class=\"required-icon\"\r\n                    [src]=\"this.getRequiredIcon()\"\r\n                    alt=\"obligatoire\"\r\n                />\r\n            </div>\r\n\r\n            <!--String Input-->\r\n            <div *ngSwitchCase=\"filterType.String\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        [class]=\"this.inputClass\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [readonly]=\"field.ReadOnly\"\r\n                        [type]=\"field.InputType\"\r\n                        (change)=\"this.onValueChanged($event)\"\r\n                        (input)=\"onValueInput($event)\"\r\n                        focusable\r\n                    />\r\n                    <!-- [(ngModel)]=\"this.entity[field.PropertyName]\" -->\r\n                </div>\r\n            </div>\r\n\r\n            <!--Number Input-->\r\n            <div *ngSwitchCase=\"filterType.Integer\" class=\"form-group\">\r\n                <div>\r\n                    <!-- [readonly]=\"field.ReadOnly\" -->\r\n                    <input\r\n                        [class]=\"this.inputClass\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        (input)=\"onValueInput($event)\"\r\n                        type=\"number\"\r\n                        focusable ng-pattern=\"/^[0-9]+$/\" tabindex=\"0\"\r\n                    />\r\n                </div>\r\n            </div>\r\n\r\n            <!--ComboBox Input-->\r\n            <div *ngSwitchCase=\"filterType.ComboBox\" class=\"form-group\">\r\n                <div>\r\n                    <ng-select\r\n                        appendTo=\"body\"\r\n                        placeholder=\"Sélectionner {{ field.Label }}\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [items]=\"field.Data\"\r\n                        [multiple]=\"field.MultipleSelection\"\r\n                        [hideSelected]=\"field.HideSelected\"\r\n                        bindValue=\"{{ field.ValueMember }}\"\r\n                        [clearable]=\"field.IsClearable\"\r\n                        bindLabel=\"{{ field.DisplayMember }}\"\r\n                        [selectOnTab]=\"true\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [readonly]=\"field.ReadOnly\"\r\n                    >\r\n                    </ng-select>\r\n                </div>\r\n            </div>\r\n\r\n            <!-- InputSelect -->\r\n            <!-- <div *ngSwitchCase=\"this.filterType.Custom\" class=\"form-group input\">\r\n        <alg-input-selector #inputSelector\r\n            type=\"text\"\r\n            (change)=\"onValueChanged($event)\"\r\n            [id]=\"this.field.PropertyName\"\r\n            [formControlName]=\"field.PropertyName\"\r\n            [modalPropertyValue]=\"this.field.ModalPropertyValue\"\r\n            [modalPropertyName]=\"this.field.ModalPropertyName\"\r\n            [modalEntityKey]=\"this.field.ModalEntityKey\"\r\n            [modalTitle]=\"this.field.ModalTitle\"\r\n            [readonly]=\"this.field.ReadOnly\">\r\n        </alg-input-selector>\r\n    </div> -->\r\n\r\n            <!-- InputSelector with button -->\r\n            <ng-container *ngSwitchCase=\"this.filterType.Custom\">\r\n                <!-- <alg-selector\r\n                    #inputSelector\r\n                    type=\"text\"\r\n                    (change)=\"this.inputSelectorChanged($event)\"\r\n                    [id]=\"field.PropertyName\"\r\n                    [formControlName]=\"field.PropertyName\"\r\n                    [modalPropertyValue]=\"field.ModalPropertyValue\"\r\n                    [modalPropertyName]=\"field.ModalPropertyName\"\r\n                    [modalEntityKey]=\"field.ModalEntityKey\"\r\n                    [modalTitle]=\"field.ModalTitle\">\r\n                </alg-selector> -->\r\n\r\n                <!-- *ngSwitchCase=\"filterType.Custom\" -->\r\n                 <ng-container *ngIf=\"field.ModalOnly\">\r\n                    <div class=\"pull-left input-select-default with-button\">\r\n                        <input\r\n                            class=\"form-control\"\r\n                            [readonly]=\"true\"\r\n                            [name]=\"this.field.PropertyName\"\r\n                            [id]=\"this.field.PropertyName\"\r\n                            [formControlName]=\"field.PropertyName\"\r\n                            />\r\n                 </div>    \r\n                </ng-container>\r\n\r\n                <alg-selector\r\n                    [field]=\"field\"\r\n                    [control]=\"this.control\"\r\n                    (change)=\"this.inputSelectorChanged($event)\"\r\n                    \r\n                    >\r\n                    <!-- [control]=\"this.form.controls[field.PropertyName]\" -->\r\n                </alg-selector>\r\n\r\n            </ng-container>\r\n\r\n            <!-- TreeSelector -->\r\n            <ng-container *ngSwitchCase=\"this.filterType.TreeSelector\">\r\n                <alg-input-tree-selector\r\n                    [items]=\"field.Data\"\r\n                    [id]=\"field.PropertyName\"\r\n                    [bindValue]=\"field.ValueMember\"\r\n                    [bindLabel]=\"field.DisplayMember\"\r\n                    childrenKey=\"children\"\r\n                    countKey=\"childrenCount\"\r\n                    [formControlName]=\"field.PropertyName\"\r\n                    placeholder=\"{{ field.Label }}\"\r\n                    (change)=\"onValueChanged($event)\"\r\n                >\r\n                </alg-input-tree-selector>\r\n            </ng-container>\r\n\r\n            <!-- TextWithbutton -->\r\n            <ng-container\r\n                *ngSwitchCase=\"this.filterType.TextWithButton\"\r\n                class=\"form-group\"\r\n            >\r\n                <div class=\"input-with-button\">\r\n\r\n                    <input\r\n                        type=\"text\"\r\n                        class=\"form-control\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [name]=\"this.field.PropertyName\"\r\n                        [id]=\"this.field.PropertyName\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [readonly]=\"this.field.ReadOnly\"\r\n                    />\r\n\r\n                    <button\r\n                        class=\"btn btn-secondary btn-32 btn-input-select\"\r\n                        (click)=\"onClick(field)\"\r\n                    >\r\n                        <span class=\"fa fa-ellipsis-h\"></span>\r\n                    </button>\r\n                </div>\r\n            </ng-container>\r\n\r\n            <!--HorizComboBox Input-->\r\n            <div *ngSwitchCase=\"filterType.HorizComboBox\" class=\"form-group\">\r\n                <div>\r\n                    <ng-select\r\n                        appendTo=\"body\"\r\n                        class=\"horiz-combox-box\"\r\n                        placeholder=\"{{ field.Label }}\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [items]=\"field.Data\"\r\n                        [multiple]=\"field.MultipleSelection\"\r\n                        [hideSelected]=\"field.HideSelected\"\r\n                        bindValue=\"{{ field.ValueMember }}\"\r\n                        bindLabel=\"{{ field.DisplayMember }}\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                    >\r\n                    </ng-select>\r\n                </div>\r\n            </div>\r\n\r\n            <!--Boolean Input-->\r\n            <div *ngSwitchCase=\"filterType.CheckBox\" class=\"form-group\">\r\n                <div class=\"checkbox-container\">\r\n                    <label class=\"switch\" [htmlFor]=\"field.PropertyName\">\r\n                        <input\r\n                            [formControlName]=\"field.PropertyName\"\r\n                            [id]=\"field.PropertyName\"\r\n                            [readonly]=\"field.ReadOnly\"\r\n                            type=\"checkbox\"\r\n                            (change)=\"onValueChanged($event)\"\r\n                        />\r\n                        <span class=\"slider round\"></span>\r\n                    </label>\r\n                    <span class=\"checkbox-label\">{{ field.Label }}</span>\r\n                </div>\r\n            </div>\r\n\r\n            <!--Enum Input-->\r\n            <div *ngSwitchCase=\"filterType.RadioButton\" class=\"form-group\">\r\n                <div class=\"radio-button-container\">\r\n                    <form [formGroup]=\"form\" class=\"radio-buttons\">\r\n                        <div\r\n                            *ngFor=\"let data of field.Data;let indexOfData = index\" class=\"radio-button\">\r\n                            <input\r\n                                type=\"radio\"\r\n                                [formControlName]=\"field.PropertyName\"\r\n                                [id]=\"getRadioButtonId(field.PropertyName,indexOfData)\"\r\n                                [value]=\"indexOfData\"\r\n                                (change)=\"onValueChanged($event)\"\r\n                                />\r\n                                <!-- [formControl]=\"this.formControl\" -->\r\n                            <label class=\"radio-button-label\">{{ data }}</label>\r\n                        </div>\r\n                    </form>\r\n                </div>\r\n            </div>\r\n\r\n            <!-- Text zone with button -->\r\n            <div *ngSwitchCase=\"filterType.TextZoneWithButton\"\r\n                class=\"form-group\">\r\n                <div class=\"text-zone-and-button\">\r\n                    <div class=\"text-zone-container\">\r\n                        <textarea\r\n                            #textarea\r\n                            type=\"text\"\r\n                            class=\"text-area\"\r\n                            spellcheck=\"false\"\r\n                            [formControlName]=\"field.ValueMember\"\r\n                            [id]=\"field.PropertyName\"\r\n                            [readonly]=\"field.ReadOnly\"\r\n                            (change)=\"onValueChanged($event)\"\r\n                        >\r\n                        </textarea>\r\n                    </div>\r\n                    <div class=\"feedback-and-button\">\r\n                        <div class=\"feedback\">\r\n                            <div\r\n                                class=\"feedback-green\"\r\n                                *ngIf=\"field.TextWithStyle.GreenText.length > 0\"\r\n                            >\r\n                                {{ field.TextWithStyle.GreenText }}\r\n                            </div>\r\n                            <div\r\n                                class=\"feedback-yellow\"\r\n                                *ngIf=\"\r\n                                    field.TextWithStyle.YellowText.length > 0\r\n                                \"\r\n                            >\r\n                                {{ field.TextWithStyle.YellowText }}\r\n                            </div>\r\n                            <div\r\n                                class=\"feedback-red\"\r\n                                *ngIf=\"field.TextWithStyle.RedText.length > 0\"\r\n                            >\r\n                                {{ field.TextWithStyle.RedText }}\r\n                            </div>\r\n                        </div>\r\n                        <button\r\n                            type=\"button\"\r\n                            id=\"botton-compile\"\r\n                            class=\"btn btn-primary btn-flat pull-right button\"\r\n                            (click)=\"onClick(field)\"\r\n                        >\r\n                            {{ field.ButtonLabel }}\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <!--Date -->\r\n            <div *ngSwitchCase=\"filterType.Date\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        type=\"text\"\r\n                        [class]=\"this.inputClass\"\r\n                        placeholder=\"Sélectionner une date\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [bsConfig]=\"bsConfig\"\r\n                        (bsValueChange)=\"onBsValueChanged($event)\"\r\n                        algDatepicker\r\n                    />\r\n                    <!-- (change)=\"onBsValueChanged($event)\" -->\r\n                </div>\r\n            </div>\r\n            <!-- Text input -->\r\n            <div *ngSwitchCase=\"filterType.DateTime\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        [class]=\"this.inputClass\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [readonly]=\"field.ReadOnly\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [type]=\"field.InputType\"\r\n                    />\r\n                </div>\r\n            </div>\r\n\r\n            <!-- Text input -->\r\n            <div *ngSwitchCase=\"filterType.Text\" class=\"form-group\">\r\n                <div>\r\n                    <textarea\r\n                        type=\"text\"\r\n                        rows=\"5\"\r\n                        [class]=\"this.inputClass\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [readonly]=\"field.ReadOnly\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [id]=\"field.PropertyName\"\r\n                    >\r\n                    </textarea>\r\n                </div>\r\n            </div>\r\n\r\n            <!-- DropFileZone -->\r\n            <div\r\n                *ngSwitchCase=\"filterType.DropFileZone\"\r\n                class=\"form-group ml-4\"\r\n            >\r\n                <fieldset>\r\n                    <input\r\n                        [id]=\"field.PropertyName\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        type=\"file\"\r\n                        class=\"ml--3\"\r\n                        (change)=\"fileEvent($event)\"\r\n                    />\r\n                </fieldset>\r\n            </div>\r\n\r\n            <!-- Password -->\r\n            <div *ngSwitchCase=\"filterType.Password\" class=\"form-group\">\r\n                <div class=\"d-flex\">\r\n                    <div class=\"w-100 ml-15px\">\r\n                        <input\r\n                            [type]=\"hidePassword ? 'password' : 'text'\"\r\n                            [formControl]=\"control\"\r\n                            (change)=\"onValueChanged($event)\"\r\n                            [id]=\"field.PropertyName\"\r\n                            [name]=\"field.PropertyName\"\r\n                            [readonly]=\"field.ReadOnly\"\r\n                            autocomplete=\"new-password\"\r\n                        />\r\n                    </div>\r\n                    <!-- btn-32 pull-right button -->\r\n                    <button class=\"btn btn-secondary\" (click)=\"showPassword()\">\r\n                        <i class=\"fa fa-eye\" aria-hidden=\"true\"></i>\r\n                    </button>\r\n                </div>\r\n            </div>\r\n\r\n            <ng-container *ngIf=\"this.hasValidationErrors()\">\r\n                <div class=\"validation-message\">\r\n                    {{ this.getValidationErrors() }}\r\n                </div>\r\n                <!-- <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('required')\">\r\n            Ce champ est obligatoire\r\n        </ng-container>\r\n        <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('min')\">\r\n            Minimum: {{field.FieldValidators.MinValue}}\r\n        </ng-container>\r\n        <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('max')\">\r\n            Maximum: {{field.FieldValidators.MaxValue}}\r\n        </ng-container>\r\n        <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('maxLength')\">\r\n            Longueur maximale: {{field.FieldValidators.MaxLength}} caractères\r\n        </ng-container> -->\r\n            </ng-container>\r\n        </div>\r\n    </ng-container>\r\n</div>\r\n",
-			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}:host{width:100%}.input-select-default{width:100%}.input-select-default.with-button{padding-right:35px;margin-right:-32px}.btn-input-select{padding:6px 10px 8px 8px;border-top-right-radius:0;border-bottom-right-radius:0;width:32px;border-color:#adb5bd}.form-group{display:flex;flex-direction:column}.field-container{margin-bottom:5px}.comboBox-icon-and-text{display:inline-block}.comboBox-icon{margin-right:5px;margin-bottom:5px}.comboBox-text{padding-right:10px}.checkbox-label{margin-left:5px;margin-top:5px;flex:1}.checkbox-input{width:17px;height:17px}.radio-button-container{border:1px solid #cbc8d0;border-radius:5px;width:100%;margin-top:5px;padding-top:12px;display:flex;flex-direction:row;flex-wrap:wrap}.under-line{margin:3px 10px 5px}.radio-buttons{margin:0;display:flex;flex-direction:column}.radio-button{margin-right:20px}.radio-buttons input{margin-right:0;margin-left:10px;margin-top:0;height:18px;width:18px;min-height:18px;flex-grow:0}.radio-button-label{margin-right:10px;margin-bottom:12px;margin-left:5px;vertical-align:middle}.text-zone-and-button{width:100%;display:flex;flex-direction:column}.text-area{background-color:#343a40;border-radius:5px;color:#e6e65f;caret-color:#ff0;font-family:monospace;font-weight:700;font-size:large;width:100%;height:200px;padding:10px;cursor:text}.feedback-and-button,.input-with-button{display:flex;flex-direction:row;width:100%}.input-with-button input{margin-right:3px}.button{margin-right:0;margin-top:5px;float:right}.feedback{width:100%;float:left;padding-left:10px}.feedback-green{float:left;width:90%;color:green;font-weight:700}.feedback-yellow{float:left;width:90%;color:orange;font-weight:700}.feedback-red{float:left;width:90%;color:var(--red-error);font-weight:700}.errorMessage{display:block;color:var(--red-error);width:100%}.validation-message{color:#a94442!important;display:inline-block;font-size:small;margin:3px}::ng-deep .ng-select.horiz-combox-box{height:30px;width:230px}::ng-deep .ng-select.horiz-combox-box .ng-select-container{height:30px;width:230px}.ng-select.horiz-combox-box ::ng-deep .ng-select-container .ng-placeholder{color:#3e4152}.input alg-input-selector{width:73.6%;margin:.75rem 0 .75rem .95rem}.ml-15px{margin-left:15px;margin-top:.4em}.textButton{margin-top:.4em;padding-bottom:.4em;margin-right:.8rem}fieldset input.ml--3{margin-left:-3%!important}.label-group{color:var(--main-bg-color)}.label-group span{padding-top:5px;display:inline-block;margin-right:5px}.label-group .required-icon{height:8px;margin:-6px 0 5px 5px;filter:invert(25%) sepia(61%) saturate(2196%) hue-rotate(334deg) brightness(100%) contrast(94%)}.checkbox-container{display:flex;flex-direction:row;align-items:center}.switch{position:relative;display:inline-block;width:48px;height:26px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s}.slider:before{position:absolute;content:\"\";height:18px;width:18px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}input:checked+.slider{background-color:#2196f3}input:focus+.slider{box-shadow:0 0 1px #2196f3}input:checked+.slider:before{-webkit-transform:translateX(22px);-ms-transform:translateX(22px);transform:translate(22px)}.slider.round{border-radius:25px}.slider.round:before{border-radius:50%}\n"],
+			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}:host{width:100%}.input-select-default{width:100%}.input-select-default.with-button{padding-right:35px;margin-right:-32px}.btn-input-select{padding:6px 10px 8px 8px;border-top-right-radius:0;border-bottom-right-radius:0;width:32px;border-color:#adb5bd}.form-group{display:flex;flex-direction:column}.field-container{margin-bottom:5px}.comboBox-icon-and-text{display:inline-block}.comboBox-icon{margin-right:5px;margin-bottom:5px}.comboBox-text{padding-right:10px}.checkbox-label{margin-left:5px;margin-top:5px;flex:1}.checkbox-input{width:17px;height:17px}.radio-button-container{border:1px solid #cbc8d0;border-radius:5px;width:100%;margin-top:5px;padding-top:12px;display:flex;flex-direction:row;flex-wrap:wrap}.under-line{margin:3px 10px 5px}.radio-buttons{margin:0;display:flex;flex-direction:column}.radio-button{margin-right:20px}.radio-buttons input{margin-right:0;margin-left:10px;margin-top:0;height:18px;width:18px;min-height:18px;flex-grow:0}.radio-button-label{margin-right:10px;margin-bottom:12px;margin-left:5px;vertical-align:middle}.text-zone-and-button{width:100%;display:flex;flex-direction:column}.text-area{background-color:#343a40;border-radius:5px;color:#e6e65f;caret-color:#ff0;font-family:monospace;font-weight:700;font-size:large;width:100%;height:200px;padding:10px;cursor:text}.feedback-and-button,.input-with-button{display:flex;flex-direction:row;width:100%}.input-with-button input{margin-right:3px}.button{margin-right:0;margin-top:5px;float:right}.feedback{width:100%;float:left;padding-left:10px}.feedback-green{float:left;width:90%;color:green;font-weight:700}.feedback-yellow{float:left;width:90%;color:orange;font-weight:700}.feedback-red{float:left;width:90%;color:var(--red-error);font-weight:700}.errorMessage{display:block;color:var(--red-error);width:100%}.validation-message{color:#a94442!important;display:inline-block;font-size:small;margin:3px}::ng-deep .ng-select.horiz-combox-box{height:30px;width:230px}::ng-deep .ng-select.horiz-combox-box .ng-select-container{height:30px;width:230px}.ng-select.horiz-combox-box ::ng-deep .ng-select-container .ng-placeholder{color:#3e4152}.input alg-input-selector{width:73.6%;margin:.75rem 0 .75rem .95rem}.ml-15px{margin-left:15px;margin-top:.4em}.textButton{margin-top:.4em;padding-bottom:.4em;margin-right:.8rem}fieldset input.ml--3{margin-left:-3%!important}.label-group{color:var(--main-bg-color)}.label-group span{padding-top:5px;display:inline-block;margin-right:5px}.label-group .required-icon{height:8px;margin:-6px 0 5px 5px;filter:invert(25%) sepia(61%) saturate(2196%) hue-rotate(334deg) brightness(100%) contrast(94%)}.checkbox-container{display:flex;flex-direction:row;align-items:center}.switch{position:relative;display:inline-block;width:48px;height:26px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s}.slider:before{position:absolute;content:\"\";height:18px;width:18px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}input:checked+.slider{background-color:#4465c9}input:focus+.slider{box-shadow:0 0 1px #4465c9}input:checked+.slider:before{-webkit-transform:translateX(22px);-ms-transform:translateX(22px);transform:translate(22px)}.slider.round{border-radius:25px}.slider.round:before{border-radius:50%}\n"],
 			dependencies: [
 				{
 					kind: "directive",
@@ -22415,7 +22834,7 @@ i0.ɵɵngDeclareClassMetadata({
 			changeDetection: ChangeDetectionStrategy.Eager,
 			standalone: false,
 			template: "<div [formGroup]=\"form\" class=\"field-container\">\r\n    <ng-container *ngIf=\"field\">\r\n        <div [hidden]=\"!!field.IsHidden\" [ngSwitch]=\"field.FilterType\">\r\n            <div class=\"label-group\" *ngIf=\"showLabel\">\r\n                <label *ngIf=\"field.FilterType != filterType.CheckBox && field.FilterType != filterType.HorizComboBox\"\r\n                    [htmlFor]=\"field.PropertyName\">\r\n                    {{ field.Label }}\r\n                </label>\r\n                <img\r\n                    *ngIf=\"field.Required\"\r\n                    class=\"required-icon\"\r\n                    [src]=\"this.getRequiredIcon()\"\r\n                    alt=\"obligatoire\"\r\n                />\r\n            </div>\r\n\r\n            <!--String Input-->\r\n            <div *ngSwitchCase=\"filterType.String\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        [class]=\"this.inputClass\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [readonly]=\"field.ReadOnly\"\r\n                        [type]=\"field.InputType\"\r\n                        (change)=\"this.onValueChanged($event)\"\r\n                        (input)=\"onValueInput($event)\"\r\n                        focusable\r\n                    />\r\n                    <!-- [(ngModel)]=\"this.entity[field.PropertyName]\" -->\r\n                </div>\r\n            </div>\r\n\r\n            <!--Number Input-->\r\n            <div *ngSwitchCase=\"filterType.Integer\" class=\"form-group\">\r\n                <div>\r\n                    <!-- [readonly]=\"field.ReadOnly\" -->\r\n                    <input\r\n                        [class]=\"this.inputClass\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        (input)=\"onValueInput($event)\"\r\n                        type=\"number\"\r\n                        focusable ng-pattern=\"/^[0-9]+$/\" tabindex=\"0\"\r\n                    />\r\n                </div>\r\n            </div>\r\n\r\n            <!--ComboBox Input-->\r\n            <div *ngSwitchCase=\"filterType.ComboBox\" class=\"form-group\">\r\n                <div>\r\n                    <ng-select\r\n                        appendTo=\"body\"\r\n                        placeholder=\"Sélectionner {{ field.Label }}\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [items]=\"field.Data\"\r\n                        [multiple]=\"field.MultipleSelection\"\r\n                        [hideSelected]=\"field.HideSelected\"\r\n                        bindValue=\"{{ field.ValueMember }}\"\r\n                        [clearable]=\"field.IsClearable\"\r\n                        bindLabel=\"{{ field.DisplayMember }}\"\r\n                        [selectOnTab]=\"true\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [readonly]=\"field.ReadOnly\"\r\n                    >\r\n                    </ng-select>\r\n                </div>\r\n            </div>\r\n\r\n            <!-- InputSelect -->\r\n            <!-- <div *ngSwitchCase=\"this.filterType.Custom\" class=\"form-group input\">\r\n        <alg-input-selector #inputSelector\r\n            type=\"text\"\r\n            (change)=\"onValueChanged($event)\"\r\n            [id]=\"this.field.PropertyName\"\r\n            [formControlName]=\"field.PropertyName\"\r\n            [modalPropertyValue]=\"this.field.ModalPropertyValue\"\r\n            [modalPropertyName]=\"this.field.ModalPropertyName\"\r\n            [modalEntityKey]=\"this.field.ModalEntityKey\"\r\n            [modalTitle]=\"this.field.ModalTitle\"\r\n            [readonly]=\"this.field.ReadOnly\">\r\n        </alg-input-selector>\r\n    </div> -->\r\n\r\n            <!-- InputSelector with button -->\r\n            <ng-container *ngSwitchCase=\"this.filterType.Custom\">\r\n                <!-- <alg-selector\r\n                    #inputSelector\r\n                    type=\"text\"\r\n                    (change)=\"this.inputSelectorChanged($event)\"\r\n                    [id]=\"field.PropertyName\"\r\n                    [formControlName]=\"field.PropertyName\"\r\n                    [modalPropertyValue]=\"field.ModalPropertyValue\"\r\n                    [modalPropertyName]=\"field.ModalPropertyName\"\r\n                    [modalEntityKey]=\"field.ModalEntityKey\"\r\n                    [modalTitle]=\"field.ModalTitle\">\r\n                </alg-selector> -->\r\n\r\n                <!-- *ngSwitchCase=\"filterType.Custom\" -->\r\n                 <ng-container *ngIf=\"field.ModalOnly\">\r\n                    <div class=\"pull-left input-select-default with-button\">\r\n                        <input\r\n                            class=\"form-control\"\r\n                            [readonly]=\"true\"\r\n                            [name]=\"this.field.PropertyName\"\r\n                            [id]=\"this.field.PropertyName\"\r\n                            [formControlName]=\"field.PropertyName\"\r\n                            />\r\n                 </div>    \r\n                </ng-container>\r\n\r\n                <alg-selector\r\n                    [field]=\"field\"\r\n                    [control]=\"this.control\"\r\n                    (change)=\"this.inputSelectorChanged($event)\"\r\n                    \r\n                    >\r\n                    <!-- [control]=\"this.form.controls[field.PropertyName]\" -->\r\n                </alg-selector>\r\n\r\n            </ng-container>\r\n\r\n            <!-- TreeSelector -->\r\n            <ng-container *ngSwitchCase=\"this.filterType.TreeSelector\">\r\n                <alg-input-tree-selector\r\n                    [items]=\"field.Data\"\r\n                    [id]=\"field.PropertyName\"\r\n                    [bindValue]=\"field.ValueMember\"\r\n                    [bindLabel]=\"field.DisplayMember\"\r\n                    childrenKey=\"children\"\r\n                    countKey=\"childrenCount\"\r\n                    [formControlName]=\"field.PropertyName\"\r\n                    placeholder=\"{{ field.Label }}\"\r\n                    (change)=\"onValueChanged($event)\"\r\n                >\r\n                </alg-input-tree-selector>\r\n            </ng-container>\r\n\r\n            <!-- TextWithbutton -->\r\n            <ng-container\r\n                *ngSwitchCase=\"this.filterType.TextWithButton\"\r\n                class=\"form-group\"\r\n            >\r\n                <div class=\"input-with-button\">\r\n\r\n                    <input\r\n                        type=\"text\"\r\n                        class=\"form-control\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [name]=\"this.field.PropertyName\"\r\n                        [id]=\"this.field.PropertyName\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [readonly]=\"this.field.ReadOnly\"\r\n                    />\r\n\r\n                    <button\r\n                        class=\"btn btn-secondary btn-32 btn-input-select\"\r\n                        (click)=\"onClick(field)\"\r\n                    >\r\n                        <span class=\"fa fa-ellipsis-h\"></span>\r\n                    </button>\r\n                </div>\r\n            </ng-container>\r\n\r\n            <!--HorizComboBox Input-->\r\n            <div *ngSwitchCase=\"filterType.HorizComboBox\" class=\"form-group\">\r\n                <div>\r\n                    <ng-select\r\n                        appendTo=\"body\"\r\n                        class=\"horiz-combox-box\"\r\n                        placeholder=\"{{ field.Label }}\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [items]=\"field.Data\"\r\n                        [multiple]=\"field.MultipleSelection\"\r\n                        [hideSelected]=\"field.HideSelected\"\r\n                        bindValue=\"{{ field.ValueMember }}\"\r\n                        bindLabel=\"{{ field.DisplayMember }}\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                    >\r\n                    </ng-select>\r\n                </div>\r\n            </div>\r\n\r\n            <!--Boolean Input-->\r\n            <div *ngSwitchCase=\"filterType.CheckBox\" class=\"form-group\">\r\n                <div class=\"checkbox-container\">\r\n                    <label class=\"switch\" [htmlFor]=\"field.PropertyName\">\r\n                        <input\r\n                            [formControlName]=\"field.PropertyName\"\r\n                            [id]=\"field.PropertyName\"\r\n                            [readonly]=\"field.ReadOnly\"\r\n                            type=\"checkbox\"\r\n                            (change)=\"onValueChanged($event)\"\r\n                        />\r\n                        <span class=\"slider round\"></span>\r\n                    </label>\r\n                    <span class=\"checkbox-label\">{{ field.Label }}</span>\r\n                </div>\r\n            </div>\r\n\r\n            <!--Enum Input-->\r\n            <div *ngSwitchCase=\"filterType.RadioButton\" class=\"form-group\">\r\n                <div class=\"radio-button-container\">\r\n                    <form [formGroup]=\"form\" class=\"radio-buttons\">\r\n                        <div\r\n                            *ngFor=\"let data of field.Data;let indexOfData = index\" class=\"radio-button\">\r\n                            <input\r\n                                type=\"radio\"\r\n                                [formControlName]=\"field.PropertyName\"\r\n                                [id]=\"getRadioButtonId(field.PropertyName,indexOfData)\"\r\n                                [value]=\"indexOfData\"\r\n                                (change)=\"onValueChanged($event)\"\r\n                                />\r\n                                <!-- [formControl]=\"this.formControl\" -->\r\n                            <label class=\"radio-button-label\">{{ data }}</label>\r\n                        </div>\r\n                    </form>\r\n                </div>\r\n            </div>\r\n\r\n            <!-- Text zone with button -->\r\n            <div *ngSwitchCase=\"filterType.TextZoneWithButton\"\r\n                class=\"form-group\">\r\n                <div class=\"text-zone-and-button\">\r\n                    <div class=\"text-zone-container\">\r\n                        <textarea\r\n                            #textarea\r\n                            type=\"text\"\r\n                            class=\"text-area\"\r\n                            spellcheck=\"false\"\r\n                            [formControlName]=\"field.ValueMember\"\r\n                            [id]=\"field.PropertyName\"\r\n                            [readonly]=\"field.ReadOnly\"\r\n                            (change)=\"onValueChanged($event)\"\r\n                        >\r\n                        </textarea>\r\n                    </div>\r\n                    <div class=\"feedback-and-button\">\r\n                        <div class=\"feedback\">\r\n                            <div\r\n                                class=\"feedback-green\"\r\n                                *ngIf=\"field.TextWithStyle.GreenText.length > 0\"\r\n                            >\r\n                                {{ field.TextWithStyle.GreenText }}\r\n                            </div>\r\n                            <div\r\n                                class=\"feedback-yellow\"\r\n                                *ngIf=\"\r\n                                    field.TextWithStyle.YellowText.length > 0\r\n                                \"\r\n                            >\r\n                                {{ field.TextWithStyle.YellowText }}\r\n                            </div>\r\n                            <div\r\n                                class=\"feedback-red\"\r\n                                *ngIf=\"field.TextWithStyle.RedText.length > 0\"\r\n                            >\r\n                                {{ field.TextWithStyle.RedText }}\r\n                            </div>\r\n                        </div>\r\n                        <button\r\n                            type=\"button\"\r\n                            id=\"botton-compile\"\r\n                            class=\"btn btn-primary btn-flat pull-right button\"\r\n                            (click)=\"onClick(field)\"\r\n                        >\r\n                            {{ field.ButtonLabel }}\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n            <!--Date -->\r\n            <div *ngSwitchCase=\"filterType.Date\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        type=\"text\"\r\n                        [class]=\"this.inputClass\"\r\n                        placeholder=\"Sélectionner une date\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [bsConfig]=\"bsConfig\"\r\n                        (bsValueChange)=\"onBsValueChanged($event)\"\r\n                        algDatepicker\r\n                    />\r\n                    <!-- (change)=\"onBsValueChanged($event)\" -->\r\n                </div>\r\n            </div>\r\n            <!-- Text input -->\r\n            <div *ngSwitchCase=\"filterType.DateTime\" class=\"form-group\">\r\n                <div>\r\n                    <input\r\n                        [class]=\"this.inputClass\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [id]=\"field.PropertyName\"\r\n                        [readonly]=\"field.ReadOnly\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [type]=\"field.InputType\"\r\n                    />\r\n                </div>\r\n            </div>\r\n\r\n            <!-- Text input -->\r\n            <div *ngSwitchCase=\"filterType.Text\" class=\"form-group\">\r\n                <div>\r\n                    <textarea\r\n                        type=\"text\"\r\n                        rows=\"5\"\r\n                        [class]=\"this.inputClass\"\r\n                        [formControlName]=\"field.PropertyName\"\r\n                        [readonly]=\"field.ReadOnly\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        [id]=\"field.PropertyName\"\r\n                    >\r\n                    </textarea>\r\n                </div>\r\n            </div>\r\n\r\n            <!-- DropFileZone -->\r\n            <div\r\n                *ngSwitchCase=\"filterType.DropFileZone\"\r\n                class=\"form-group ml-4\"\r\n            >\r\n                <fieldset>\r\n                    <input\r\n                        [id]=\"field.PropertyName\"\r\n                        (change)=\"onValueChanged($event)\"\r\n                        type=\"file\"\r\n                        class=\"ml--3\"\r\n                        (change)=\"fileEvent($event)\"\r\n                    />\r\n                </fieldset>\r\n            </div>\r\n\r\n            <!-- Password -->\r\n            <div *ngSwitchCase=\"filterType.Password\" class=\"form-group\">\r\n                <div class=\"d-flex\">\r\n                    <div class=\"w-100 ml-15px\">\r\n                        <input\r\n                            [type]=\"hidePassword ? 'password' : 'text'\"\r\n                            [formControl]=\"control\"\r\n                            (change)=\"onValueChanged($event)\"\r\n                            [id]=\"field.PropertyName\"\r\n                            [name]=\"field.PropertyName\"\r\n                            [readonly]=\"field.ReadOnly\"\r\n                            autocomplete=\"new-password\"\r\n                        />\r\n                    </div>\r\n                    <!-- btn-32 pull-right button -->\r\n                    <button class=\"btn btn-secondary\" (click)=\"showPassword()\">\r\n                        <i class=\"fa fa-eye\" aria-hidden=\"true\"></i>\r\n                    </button>\r\n                </div>\r\n            </div>\r\n\r\n            <ng-container *ngIf=\"this.hasValidationErrors()\">\r\n                <div class=\"validation-message\">\r\n                    {{ this.getValidationErrors() }}\r\n                </div>\r\n                <!-- <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('required')\">\r\n            Ce champ est obligatoire\r\n        </ng-container>\r\n        <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('min')\">\r\n            Minimum: {{field.FieldValidators.MinValue}}\r\n        </ng-container>\r\n        <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('max')\">\r\n            Maximum: {{field.FieldValidators.MaxValue}}\r\n        </ng-container>\r\n        <ng-container *ngIf=\"this.form.controls[field.PropertyName]?.hasError('maxLength')\">\r\n            Longueur maximale: {{field.FieldValidators.MaxLength}} caractères\r\n        </ng-container> -->\r\n            </ng-container>\r\n        </div>\r\n    </ng-container>\r\n</div>\r\n",
-			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}:host{width:100%}.input-select-default{width:100%}.input-select-default.with-button{padding-right:35px;margin-right:-32px}.btn-input-select{padding:6px 10px 8px 8px;border-top-right-radius:0;border-bottom-right-radius:0;width:32px;border-color:#adb5bd}.form-group{display:flex;flex-direction:column}.field-container{margin-bottom:5px}.comboBox-icon-and-text{display:inline-block}.comboBox-icon{margin-right:5px;margin-bottom:5px}.comboBox-text{padding-right:10px}.checkbox-label{margin-left:5px;margin-top:5px;flex:1}.checkbox-input{width:17px;height:17px}.radio-button-container{border:1px solid #cbc8d0;border-radius:5px;width:100%;margin-top:5px;padding-top:12px;display:flex;flex-direction:row;flex-wrap:wrap}.under-line{margin:3px 10px 5px}.radio-buttons{margin:0;display:flex;flex-direction:column}.radio-button{margin-right:20px}.radio-buttons input{margin-right:0;margin-left:10px;margin-top:0;height:18px;width:18px;min-height:18px;flex-grow:0}.radio-button-label{margin-right:10px;margin-bottom:12px;margin-left:5px;vertical-align:middle}.text-zone-and-button{width:100%;display:flex;flex-direction:column}.text-area{background-color:#343a40;border-radius:5px;color:#e6e65f;caret-color:#ff0;font-family:monospace;font-weight:700;font-size:large;width:100%;height:200px;padding:10px;cursor:text}.feedback-and-button,.input-with-button{display:flex;flex-direction:row;width:100%}.input-with-button input{margin-right:3px}.button{margin-right:0;margin-top:5px;float:right}.feedback{width:100%;float:left;padding-left:10px}.feedback-green{float:left;width:90%;color:green;font-weight:700}.feedback-yellow{float:left;width:90%;color:orange;font-weight:700}.feedback-red{float:left;width:90%;color:var(--red-error);font-weight:700}.errorMessage{display:block;color:var(--red-error);width:100%}.validation-message{color:#a94442!important;display:inline-block;font-size:small;margin:3px}::ng-deep .ng-select.horiz-combox-box{height:30px;width:230px}::ng-deep .ng-select.horiz-combox-box .ng-select-container{height:30px;width:230px}.ng-select.horiz-combox-box ::ng-deep .ng-select-container .ng-placeholder{color:#3e4152}.input alg-input-selector{width:73.6%;margin:.75rem 0 .75rem .95rem}.ml-15px{margin-left:15px;margin-top:.4em}.textButton{margin-top:.4em;padding-bottom:.4em;margin-right:.8rem}fieldset input.ml--3{margin-left:-3%!important}.label-group{color:var(--main-bg-color)}.label-group span{padding-top:5px;display:inline-block;margin-right:5px}.label-group .required-icon{height:8px;margin:-6px 0 5px 5px;filter:invert(25%) sepia(61%) saturate(2196%) hue-rotate(334deg) brightness(100%) contrast(94%)}.checkbox-container{display:flex;flex-direction:row;align-items:center}.switch{position:relative;display:inline-block;width:48px;height:26px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s}.slider:before{position:absolute;content:\"\";height:18px;width:18px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}input:checked+.slider{background-color:#2196f3}input:focus+.slider{box-shadow:0 0 1px #2196f3}input:checked+.slider:before{-webkit-transform:translateX(22px);-ms-transform:translateX(22px);transform:translate(22px)}.slider.round{border-radius:25px}.slider.round:before{border-radius:50%}\n"]
+			styles: [".home-page{font-family:Open sans,sans-serif;background:#fff;-webkit-font-smoothing:antialiased;height:100%;width:100%;padding:16px}.main-container{margin:0 50px}.main-container-modal{width:calc(100% - 50px);margin:10px 25px 0}.moyen-titre{font-weight:700;font-size:24px;color:#4d5a81;margin:8px 0;border-bottom:solid 1px #DBE4FF}.grand-titre{font-weight:700;font-size:28px;color:#4d5a81;margin:0 0 8px}.petit-titre{font-weight:700;font-size:16px;color:#4d5a81;margin:0 0 8px}.petit-titre.underlined{border-bottom:solid 1px #4D5A81}.paragraph{padding:0 15px}.paragraph-highlight{padding:5px 15px 0 12px;border-left:5px solid #8EA7F8;border-bottom:1px solid #DBE4FF;border-top:1px solid #DBE4FF;border-right:1px solid #DBE4FF;background-color:#f7faff}.highlight{background-color:#f7faff;border:1px solid #DBE4FF;border-radius:5px;padding:15px;color:#3c5dc4;margin:0 0 16px}.highlight p{margin-bottom:0}.highlight:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"53.294\" height=\"50.629\" viewBox=\"0 0 53.294 50.629\">%0D%0A  <path id=\"allerg\\e8ne\" d=\"M830.494,25.793l-5.814,6.783.727,8.963-8.721,1.938-4.6,7.752L803.847,47.6l-8.236,3.634-4.6-7.51-8.721-1.938.727-8.963L777.2,26.035l5.814-6.783-.727-8.963,8.721-1.938L795.61.6l8.236,3.634L812.083.6l4.6,7.752,8.721,1.938-.727,8.963Zm-24.467,2.422V13.681h-4.845V28.216Zm0,9.69V33.06h-4.845v4.845Z\" transform=\"translate(-777.2 -0.6)\"/>%0D%0A</svg>%0D%0A');background-repeat:no-repeat;margin:0 8px 24px 0;filter:invert(31%) sepia(51%) saturate(1323%) hue-rotate(199deg) brightness(99%) contrast(94%)}.notification{background-color:#dbe4ff;border:1px solid #C4D0F9;border-radius:5px;color:#4d5a81;margin:16px;padding:5px 15px;text-align:justify}.notification:before{position:relative;display:block;float:left;width:24px;height:24px;content:\" \";background-size:24px 24px;-webkit-background-size:24px 24px;background-image:url('data:image/svg+xml,<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"info-circle\" class=\"svg-inline--fa fa-info-circle fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"></path></svg>');background-repeat:no-repeat;margin:0 8px 0 0;filter:invert(31%) sepia(8%) saturate(2329%) hue-rotate(188deg) brightness(103%) contrast(85%)}.notification-text{padding:0 15px 0 30px;font-size:16px}:host{width:100%}.input-select-default{width:100%}.input-select-default.with-button{padding-right:35px;margin-right:-32px}.btn-input-select{padding:6px 10px 8px 8px;border-top-right-radius:0;border-bottom-right-radius:0;width:32px;border-color:#adb5bd}.form-group{display:flex;flex-direction:column}.field-container{margin-bottom:5px}.comboBox-icon-and-text{display:inline-block}.comboBox-icon{margin-right:5px;margin-bottom:5px}.comboBox-text{padding-right:10px}.checkbox-label{margin-left:5px;margin-top:5px;flex:1}.checkbox-input{width:17px;height:17px}.radio-button-container{border:1px solid #cbc8d0;border-radius:5px;width:100%;margin-top:5px;padding-top:12px;display:flex;flex-direction:row;flex-wrap:wrap}.under-line{margin:3px 10px 5px}.radio-buttons{margin:0;display:flex;flex-direction:column}.radio-button{margin-right:20px}.radio-buttons input{margin-right:0;margin-left:10px;margin-top:0;height:18px;width:18px;min-height:18px;flex-grow:0}.radio-button-label{margin-right:10px;margin-bottom:12px;margin-left:5px;vertical-align:middle}.text-zone-and-button{width:100%;display:flex;flex-direction:column}.text-area{background-color:#343a40;border-radius:5px;color:#e6e65f;caret-color:#ff0;font-family:monospace;font-weight:700;font-size:large;width:100%;height:200px;padding:10px;cursor:text}.feedback-and-button,.input-with-button{display:flex;flex-direction:row;width:100%}.input-with-button input{margin-right:3px}.button{margin-right:0;margin-top:5px;float:right}.feedback{width:100%;float:left;padding-left:10px}.feedback-green{float:left;width:90%;color:green;font-weight:700}.feedback-yellow{float:left;width:90%;color:orange;font-weight:700}.feedback-red{float:left;width:90%;color:var(--red-error);font-weight:700}.errorMessage{display:block;color:var(--red-error);width:100%}.validation-message{color:#a94442!important;display:inline-block;font-size:small;margin:3px}::ng-deep .ng-select.horiz-combox-box{height:30px;width:230px}::ng-deep .ng-select.horiz-combox-box .ng-select-container{height:30px;width:230px}.ng-select.horiz-combox-box ::ng-deep .ng-select-container .ng-placeholder{color:#3e4152}.input alg-input-selector{width:73.6%;margin:.75rem 0 .75rem .95rem}.ml-15px{margin-left:15px;margin-top:.4em}.textButton{margin-top:.4em;padding-bottom:.4em;margin-right:.8rem}fieldset input.ml--3{margin-left:-3%!important}.label-group{color:var(--main-bg-color)}.label-group span{padding-top:5px;display:inline-block;margin-right:5px}.label-group .required-icon{height:8px;margin:-6px 0 5px 5px;filter:invert(25%) sepia(61%) saturate(2196%) hue-rotate(334deg) brightness(100%) contrast(94%)}.checkbox-container{display:flex;flex-direction:row;align-items:center}.switch{position:relative;display:inline-block;width:48px;height:26px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s}.slider:before{position:absolute;content:\"\";height:18px;width:18px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}input:checked+.slider{background-color:#4465c9}input:focus+.slider{box-shadow:0 0 1px #4465c9}input:checked+.slider:before{-webkit-transform:translateX(22px);-ms-transform:translateX(22px);transform:translate(22px)}.slider.round{border-radius:25px}.slider.round:before{border-radius:50%}\n"]
 		}]
 	}],
 	ctorParameters: () => [{ type: ValidationService }],
@@ -22975,7 +23394,8 @@ var CoreUxModule = class CoreUxModule {
 				DatePickerDirective,
 				GridStylePipe,
 				RowRefDirective,
-				GridViewMenuComponent
+				GridViewMenuComponent,
+				GridDistinctFilterComponent
 			],
 			exports: [
 				ActionsComponent,
@@ -23171,7 +23591,8 @@ var CoreUxModule = class CoreUxModule {
 				FormsModule,
 				ReactiveFormsModule,
 				NgSelectModule,
-				GridViewMenuComponent
+				GridViewMenuComponent,
+				GridDistinctFilterComponent
 			]
 		});
 	}
@@ -23194,7 +23615,8 @@ i0.ɵɵngDeclareClassMetadata({
 				DatePickerDirective,
 				GridStylePipe,
 				RowRefDirective,
-				GridViewMenuComponent
+				GridViewMenuComponent,
+				GridDistinctFilterComponent
 			],
 			declarations: [...components],
 			exports: [...components, DatePickerDirective],