@dsivd/prestations-ng 15.4.8 → 15.4.9-beta2

package/fesm2020/dsivd-prestations-ng.mjs

@@ -1,8 +1,8 @@
 import * as i0 from '@angular/core';
 import { Injectable, NgModule, Optional, Inject, EventEmitter, Directive, Input, ViewChildren, ViewChild, Output, HostBinding, Pipe, Component, ContentChildren, HostListener, forwardRef, TemplateRef, ContentChild } from '@angular/core';
 import * as i1 from '@angular/common/http';
-import { HttpResponse, HttpErrorResponse, HTTP_INTERCEPTORS, HttpClientModule, HttpParams, HttpClient } from '@angular/common/http';
-import { Subject, throwError, BehaviorSubject, combineLatest, of, EMPTY, merge } from 'rxjs';
+import { HttpResponse, HttpErrorResponse, HTTP_INTERCEPTORS, HttpClientModule, HttpParams, HttpEventType, HttpClient } from '@angular/common/http';
+import { Subject, throwError, BehaviorSubject, combineLatest, of, EMPTY, merge, map as map$1 } from 'rxjs';
 import { map, catchError, filter, shareReplay, mergeMap, tap, switchMap, debounceTime, throttleTime, share, first, finalize, distinctUntilChanged } from 'rxjs/operators';
 import * as i1$1 from '@angular/router';
 import { RouterModule, ActivatedRoute, NavigationStart, NavigationEnd } from '@angular/router';
@@ -1442,6 +1442,14 @@ const DEFAULT_DICTIONARY = {
     'gesdem-confirmation.exit-button': 'Terminer',
     'gesdem-confirmation.logout-button': 'Se déconnecter',
     'gesdem-confirmation.extra-content': ' ',
+    'gesdem-confirmation.transmission-information.label': 'Information suite à la transmission de votre demande',
+    'gesdem-confirmation.demand-detail-link.label': 'Vous pouvez consulter votre demande en cliquant sur :',
+    'gesdem-confirmation.demand-processing-progress-link.label': "Vous pouvez suivre l'avancement du traitement de votre demande " +
+        'en cliquant sur :',
+    'gesdem-confirmation.demand-in-progress.title': 'Demande en cours',
+    'gesdem-confirmation.resume-my-demand.label': 'Vous pouvez reprendre votre demande en cliquant sur le lien ci-dessous',
+    'gesdem-confirmation.resume-my-demand.button': 'Reprendre ma demande',
+    'gesdem.download-pdf.button.title': 'Télécharger le PDF',
     'foehn-date-picker-button.icon-title': 'Afficher le calendrier',
     'foehn-date-picker-button.screen-reader.selected-date': 'Date sélectionnée : {selectedDate}',
     'foehn-date-picker.container.aria-label': 'Calendrier',
@@ -1525,6 +1533,7 @@ const DEFAULT_DICTIONARY = {
     'foehn-agenda-navigation.next-week-sr-only': 'Semaine suivante : {nextWeek}',
     'foehn-agenda-navigation.nav.aria-label': 'Changer de semaine',
     'foehn-agenda-navigation.date-picker-button.screen-reader.selected-date': 'Semaine du {selectedDate} sélectionnée',
+    'gesdem-demand-detail': 'Détail de la demande {reference}',
     'gesdem-error.text.has-reference': 'Vous pouvez essayer de reprendre votre demande en cliquant sur le lien ci-dessous',
     'gesdem-error.link.has-reference': 'Reprendre ma demande',
     'gesdem-error.text.has-no-reference': 'Vous pouvez recommencer une demande en cliquant sur le lien ci-dessous',
@@ -1538,7 +1547,10 @@ const DEFAULT_DICTIONARY = {
     'foehn-textarea.chars-remaining.plural': '{charCountLeft} caractères restants',
     'foehn-textarea.chars-remaining.singular': '{charCountLeft} caractère restant',
     'foehn-textarea.chars-remaining.zero': 'Vous avez atteint le nombre de caractères autorisés',
-    'foehn-textarea.chars-remaining.exceeded': 'Vous avez dépassé le nombre de caractères autorisés de {charCountLeft}'
+    'foehn-textarea.chars-remaining.exceeded': 'Vous avez dépassé le nombre de caractères autorisés de {charCountLeft}',
+    'foehn-upload-progress-bar.title': 'Traitement de votre envoi',
+    'foehn-upload-progress-bar.upload': 'Enregistrement en cours...',
+    'foehn-upload-progress-bar.analysis': 'Analyse en cours... Merci de patienter.'
 };
 
 const DICTIONARY_BASE_URL = 'api/dictionary';
@@ -2454,14 +2466,73 @@ class UploaderHelper {
     }
 }
 
+class UploadProgressService {
+    constructor() {
+        this._uploadProgressSubject = new BehaviorSubject(null);
+        this._analysisProgressSubject = new BehaviorSubject(false);
+        this._showProgress = new BehaviorSubject(false);
+    }
+    get uploadProgress() {
+        return this._uploadProgressSubject;
+    }
+    get uploadProgressSubject() {
+        return this.uploadProgress.asObservable();
+    }
+    get analysisProgress() {
+        return this._analysisProgressSubject;
+    }
+    get analysisProgressSubject() {
+        return this.analysisProgress.asObservable();
+    }
+    get showProgress() {
+        return this._showProgress;
+    }
+    get showProgressSubject() {
+        return this.showProgress.asObservable();
+    }
+    manageUploadEventFilter(event) {
+        switch (event.type) {
+            case HttpEventType.Sent:
+                this.showProgress.next(true);
+                return false;
+            case HttpEventType.UploadProgress:
+                const progress = {
+                    loaded: event.loaded,
+                    total: event.total
+                };
+                this.uploadProgress.next(progress);
+                return false;
+            case HttpEventType.DownloadProgress:
+            case HttpEventType.ResponseHeader:
+                // Possibility to do something here if we have to
+                return false;
+            case HttpEventType.Response:
+            case HttpEventType.User:
+            default:
+                this.analysisProgress.next(false);
+                this.showProgress.next(false);
+                return true;
+        }
+    }
+}
+UploadProgressService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: UploadProgressService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+UploadProgressService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: UploadProgressService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: UploadProgressService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
 class MultiUploadService {
-    constructor(httpClient, growlService, gesdemEventService, gesdemHandlerService, applicationInfoService, dictionaryService) {
+    constructor(httpClient, growlService, gesdemEventService, gesdemHandlerService, applicationInfoService, dictionaryService, uploadProgressService) {
         this.httpClient = httpClient;
         this.growlService = growlService;
         this.gesdemEventService = gesdemEventService;
         this.gesdemHandlerService = gesdemHandlerService;
         this.applicationInfoService = applicationInfoService;
         this.dictionaryService = dictionaryService;
+        this.uploadProgressService = uploadProgressService;
         // A way to have a unique Id per file
         this.globalSequence = 0;
         this.uniqPrefix = new Date().getTime();
@@ -2476,8 +2547,12 @@ class MultiUploadService {
             const formData = this.uploaderHelper.mapToFormData(documents, formKey, language);
             const url = `${baseUrl}/upload/${this.reference}`;
             return this.httpClient
-                .post(url, formData)
-                .pipe(tap(result => {
+                .post(url, formData, {
+                reportProgress: true,
+                observe: 'events',
+                responseType: 'json'
+            })
+                .pipe(filter((e) => this.uploadProgressService.manageUploadEventFilter(e)), map((e) => e.body), tap(result => {
                 const successfulDocumentsCount = result.documents && result.documents.length;
                 if (successfulDocumentsCount &&
                     shouldDisplayFileSavedConfirmation) {
@@ -2510,14 +2585,14 @@ class MultiUploadService {
         return `${baseUrl}/download/${this.reference}/doc/${document.reference}`;
     }
 }
-MultiUploadService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: MultiUploadService, deps: [{ token: i1.HttpClient }, { token: GrowlBrokerService }, { token: GesdemEventService }, { token: GesdemHandlerService }, { token: ApplicationInfoService }, { token: SdkDictionaryService }], target: i0.ɵɵFactoryTarget.Injectable });
+MultiUploadService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: MultiUploadService, deps: [{ token: i1.HttpClient }, { token: GrowlBrokerService }, { token: GesdemEventService }, { token: GesdemHandlerService }, { token: ApplicationInfoService }, { token: SdkDictionaryService }, { token: UploadProgressService }], target: i0.ɵɵFactoryTarget.Injectable });
 MultiUploadService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: MultiUploadService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: MultiUploadService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: GrowlBrokerService }, { type: GesdemEventService }, { type: GesdemHandlerService }, { type: ApplicationInfoService }, { type: SdkDictionaryService }]; } });
+        }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: GrowlBrokerService }, { type: GesdemEventService }, { type: GesdemHandlerService }, { type: ApplicationInfoService }, { type: SdkDictionaryService }, { type: UploadProgressService }]; } });
 
 class PendingUploadService {
     constructor(multiUploadService, gesdemService, gesdemEventService) {
@@ -3862,10 +3937,10 @@ class GesdemConfirmationComponent {
     }
 }
 GesdemConfirmationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GesdemConfirmationComponent, deps: [{ token: GesdemHandlerService }, { token: FoehnPageService }, { token: i1$1.ActivatedRoute }, { token: SdkDictionaryService }, { token: i3.Location }], target: i0.ɵɵFactoryTarget.Component });
-GesdemConfirmationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GesdemConfirmationComponent, selector: "gesdem-confirmation", inputs: { reference: "reference", setPageTitle: "setPageTitle", hasEmailSent: "hasEmailSent", closeHref: "closeHref", showDownloadPdfRecapButton: "showDownloadPdfRecapButton", showLinkToMyDemandes: "showLinkToMyDemandes", demandeIsClosedOnTransmit: "demandeIsClosedOnTransmit", actionStatut: "actionStatut", connectedConfirmationMessage: "connectedConfirmationMessage", connectedConfirmationMessageIfAbandoned: "connectedConfirmationMessageIfAbandoned", downloadPdfRecapButtonText: "downloadPdfRecapButtonText", closeButtonText: "closeButtonText", baseUrlPdf: "baseUrlPdf", hideReference: "hideReference" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"container mt-5\" *ngIf=\"reference && !isInProgress\">\n    <div\n        class=\"alert text-center mb-2\"\n        [ngClass]=\"isTransferred ? 'alert-success' : 'alert-danger'\"\n    >\n        <p class=\"h2\">\n            {{\n                isTransferred\n                    ? (successLabelDicoKey | fromDictionary)\n                    : ('gesdem-confirmation.abort-label' | fromDictionary)\n            }}\n        </p>\n        <dl *ngIf=\"!hideReference\">\n            <dt class=\"font-weight-light\">\n                {{\n                    'gesdem-confirmation.reference-title.label' | fromDictionary\n                }}\n            </dt>\n            <dd id=\"numDemande\" class=\"h4 d-block mt-3\">{{ reference }}</dd>\n        </dl>\n        <p *ngIf=\"hasEmailSent && !(isConnectedCyber | async)\">\n            {{ 'gesdem-confirmation.mail-sent.label' | fromDictionary }}\n        </p>\n    </div>\n\n    <span\n        [innerHTML]=\"'gesdem-confirmation.extra-content' | fromDictionary\"\n    ></span>\n\n    <ng-content></ng-content>\n\n    <div\n        class=\"col-md-12 vd-highlight\"\n        *ngIf=\"(isConnectedCyber | async) && hasConnectedContent()\"\n    >\n        <span class=\"sr-only\">\n            Information suite \u00E0 la transmission de votre demande\n        </span>\n        <div class=\"row\">\n            <div class=\"col-md-1\">\n                <foehn-icon-info-circle class=\"h3\"></foehn-icon-info-circle>\n            </div>\n            <div class=\"col-md-11\">\n                <p\n                    [innerHTML]=\"\n                        isTransferred\n                            ? connectedConfirmationMessage\n                            : connectedConfirmationMessageIfAbandoned\n                    \"\n                ></p>\n                <p\n                    id=\"linkToTreatedDemandes\"\n                    *ngIf=\"\n                        showLinkToMyDemandes &&\n                        (demandeIsClosedOnTransmit || isAbandoned)\n                    \"\n                >\n                    Vous pouvez consulter votre demande en cliquant sur :\n                    <a href=\"/100002/demandes/search/MINE/TREATED\">\n                        Mes nouvelles demandes trait\u00E9es\n                    </a>\n                    .\n                </p>\n                <p\n                    id=\"linkToInProgressDemandes\"\n                    *ngIf=\"\n                        showLinkToMyDemandes &&\n                        !demandeIsClosedOnTransmit &&\n                        !isAbandoned\n                    \"\n                >\n                    Vous pouvez suivre l'avancement du traitement de votre\n                    demande en cliquant sur :\n                    <a href=\"/100002/demandes/search/MINE/IN_PROGRESS\">\n                        Mes demandes en cours de traitement\n                    </a>\n                    .\n                </p>\n            </div>\n        </div>\n    </div>\n\n    <div class=\"col-md-12 list-unstyled d-md-flex p-0 mt-4\">\n        <div class=\"ml-0 mr-md-auto mr-md-2 mb-2 mt-2\">\n            <a\n                *ngIf=\"showDownloadPdfRecapButton\"\n                [href]=\"urlPdf\"\n                id=\"telechargerBtn\"\n                class=\"btn btn-secondary w-100\"\n                title=\"T\u00E9l\u00E9charger le PDF\"\n            >\n                {{ downloadPdfRecapButtonText | fromDictionary }}\n            </a>\n        </div>\n\n        <div\n            class=\"mr-0 ml-md-auto mb-2 mt-2\"\n            *ngIf=\"!(isConnectedCyber | async) && closeLink | async as link\"\n        >\n            <a [href]=\"link\" id=\"terminerBtn\" class=\"btn btn-primary w-100\">\n                {{ closeButtonText | fromDictionary }}\n            </a>\n        </div>\n\n        <div\n            class=\"mr-0 ml-md-auto mb-2 mt-2\"\n            *ngIf=\"!!(isConnectedCyber | async)\"\n        >\n            <a\n                href=\"/100018/logout\"\n                id=\"logoutBtn\"\n                class=\"btn btn-primary w-100\"\n            >\n                {{ 'gesdem-confirmation.logout-button' | fromDictionary }}\n            </a>\n        </div>\n    </div>\n</div>\n\n<div class=\"container mt-5\" *ngIf=\"!hideReference && reference && isInProgress\">\n    <div class=\"alert alert-info text-center mb-2\">\n        <p class=\"h2\">Demande en cours</p>\n        <dl>\n            <dt class=\"font-weight-light\">\n                {{\n                    'gesdem-confirmation.reference-title.label' | fromDictionary\n                }}\n            </dt>\n            <dd id=\"numDemandeEnCours\" class=\"h4 d-block mt-3\">\n                {{ reference }}\n            </dd>\n        </dl>\n    </div>\n\n    <div class=\"col-md-12 vd-highlight\">\n        <div class=\"row\">\n            <div class=\"col-md-1\">\n                <foehn-icon-info-circle class=\"h3\"></foehn-icon-info-circle>\n            </div>\n            <div class=\"col-md-11\">\n                <p>\n                    Vous pouvez reprendre votre demande en cliquant sur le lien\n                    ci-dessous\n                </p>\n                <p>\n                    <a [routerLink]=\"firstPageLink\">Reprendre ma demande</a>\n                </p>\n            </div>\n        </div>\n    </div>\n</div>\n", components: [{ type: FoehnIconInfoCircleComponent, selector: "foehn-icon-info-circle" }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }], pipes: { "fromDictionary": SdkDictionaryPipe, "async": i3.AsyncPipe } });
+GesdemConfirmationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: GesdemConfirmationComponent, selector: "gesdem-confirmation", inputs: { reference: "reference", setPageTitle: "setPageTitle", hasEmailSent: "hasEmailSent", closeHref: "closeHref", showDownloadPdfRecapButton: "showDownloadPdfRecapButton", showLinkToMyDemandes: "showLinkToMyDemandes", demandeIsClosedOnTransmit: "demandeIsClosedOnTransmit", actionStatut: "actionStatut", connectedConfirmationMessage: "connectedConfirmationMessage", connectedConfirmationMessageIfAbandoned: "connectedConfirmationMessageIfAbandoned", downloadPdfRecapButtonText: "downloadPdfRecapButtonText", closeButtonText: "closeButtonText", baseUrlPdf: "baseUrlPdf", hideReference: "hideReference" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"container mt-5\" *ngIf=\"reference && !isInProgress\">\n    <div\n        class=\"alert text-center mb-2\"\n        [ngClass]=\"isTransferred ? 'alert-success' : 'alert-danger'\"\n    >\n        <p class=\"h2\">\n            {{\n                isTransferred\n                    ? (successLabelDicoKey | fromDictionary)\n                    : ('gesdem-confirmation.abort-label' | fromDictionary)\n            }}\n        </p>\n        <dl *ngIf=\"!hideReference\">\n            <dt class=\"font-weight-light\">\n                {{\n                    'gesdem-confirmation.reference-title.label' | fromDictionary\n                }}\n            </dt>\n            <dd id=\"numDemande\" class=\"h4 d-block mt-3\">{{ reference }}</dd>\n        </dl>\n        <p *ngIf=\"hasEmailSent && !(isConnectedCyber | async)\">\n            {{ 'gesdem-confirmation.mail-sent.label' | fromDictionary }}\n        </p>\n    </div>\n\n    <span\n        [innerHTML]=\"'gesdem-confirmation.extra-content' | fromDictionary\"\n    ></span>\n\n    <ng-content></ng-content>\n\n    <div\n        class=\"col-md-12 vd-highlight\"\n        *ngIf=\"(isConnectedCyber | async) && hasConnectedContent()\"\n    >\n        <span\n            class=\"sr-only\"\n            [innerHTML]=\"\n                'gesdem-confirmation.transmission-information.label'\n                    | fromDictionary\n            \"\n        ></span>\n        <div class=\"row\">\n            <div class=\"col-md-1\">\n                <foehn-icon-info-circle class=\"h3\"></foehn-icon-info-circle>\n            </div>\n            <div class=\"col-md-11\">\n                <p\n                    [innerHTML]=\"\n                        isTransferred\n                            ? connectedConfirmationMessage\n                            : connectedConfirmationMessageIfAbandoned\n                    \"\n                ></p>\n                <p\n                    id=\"linkToTreatedDemandes\"\n                    *ngIf=\"\n                        showLinkToMyDemandes &&\n                        (demandeIsClosedOnTransmit || isAbandoned)\n                    \"\n                >\n                    {{\n                        'gesdem-confirmation.demand-detail-link.label'\n                            | fromDictionary\n                    }}\n                    <a\n                        href=\"/100002/demandes/{{ reference }}\"\n                        [attr.aria-label]=\"\n                            'gesdem-demand-detail'\n                                | fromDictionary: { reference: reference }\n                        \"\n                    >\n                        {{ reference }}\n                    </a>\n                    .\n                </p>\n                <p\n                    id=\"linkToInProgressDemandes\"\n                    *ngIf=\"\n                        showLinkToMyDemandes &&\n                        !demandeIsClosedOnTransmit &&\n                        !isAbandoned\n                    \"\n                >\n                    {{\n                        'gesdem-confirmation.demand-processing-progress-link.label'\n                            | fromDictionary\n                    }}\n                    <a\n                        href=\"/100002/demandes/{{ reference }}\"\n                        [attr.aria-label]=\"\n                            'gesdem-demand-detail'\n                                | fromDictionary: { reference: reference }\n                        \"\n                    >\n                        {{ reference }}\n                    </a>\n                    .\n                </p>\n            </div>\n        </div>\n    </div>\n\n    <div class=\"col-md-12 list-unstyled d-md-flex p-0 mt-4\">\n        <div class=\"ml-0 mr-md-auto mr-md-2 mb-2 mt-2\">\n            <a\n                *ngIf=\"showDownloadPdfRecapButton\"\n                [href]=\"urlPdf\"\n                id=\"telechargerBtn\"\n                class=\"btn btn-secondary w-100\"\n                [attr.aria-label]=\"\n                    'gesdem.download-pdf.button.title' | fromDictionary\n                \"\n            >\n                {{ downloadPdfRecapButtonText | fromDictionary }}\n            </a>\n        </div>\n\n        <div\n            class=\"mr-0 ml-md-auto mb-2 mt-2\"\n            *ngIf=\"!(isConnectedCyber | async) && closeLink | async as link\"\n        >\n            <a [href]=\"link\" id=\"terminerBtn\" class=\"btn btn-primary w-100\">\n                {{ closeButtonText | fromDictionary }}\n            </a>\n        </div>\n\n        <div\n            class=\"mr-0 ml-md-auto mb-2 mt-2\"\n            *ngIf=\"!!(isConnectedCyber | async)\"\n        >\n            <a\n                href=\"/100018/logout\"\n                id=\"logoutBtn\"\n                class=\"btn btn-primary w-100\"\n            >\n                {{ 'gesdem-confirmation.logout-button' | fromDictionary }}\n            </a>\n        </div>\n    </div>\n</div>\n\n<div class=\"container mt-5\" *ngIf=\"!hideReference && reference && isInProgress\">\n    <div class=\"alert alert-info text-center mb-2\">\n        <p\n            class=\"h2\"\n            [innerHTML]=\"\n                'gesdem-confirmation.demand-in-progress.title' | fromDictionary\n            \"\n        ></p>\n        <dl>\n            <dt class=\"font-weight-light\">\n                {{\n                    'gesdem-confirmation.reference-title.label' | fromDictionary\n                }}\n            </dt>\n            <dd id=\"numDemandeEnCours\" class=\"h4 d-block mt-3\">\n                {{ reference }}\n            </dd>\n        </dl>\n    </div>\n\n    <div class=\"col-md-12 vd-highlight\">\n        <div class=\"row\">\n            <div class=\"col-md-1\">\n                <foehn-icon-info-circle class=\"h3\"></foehn-icon-info-circle>\n            </div>\n            <div class=\"col-md-11\">\n                <p>\n                    {{\n                        'gesdem-confirmation.resume-my-demand.label'\n                            | fromDictionary\n                    }}\n                </p>\n                <p>\n                    <a [routerLink]=\"firstPageLink\">\n                        {{\n                            'gesdem-confirmation.resume-my-demand.button'\n                                | fromDictionary\n                        }}\n                    </a>\n                </p>\n            </div>\n        </div>\n    </div>\n</div>\n", components: [{ type: FoehnIconInfoCircleComponent, selector: "foehn-icon-info-circle" }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }], pipes: { "fromDictionary": SdkDictionaryPipe, "async": i3.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: GesdemConfirmationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gesdem-confirmation', template: "<div class=\"container mt-5\" *ngIf=\"reference && !isInProgress\">\n    <div\n        class=\"alert text-center mb-2\"\n        [ngClass]=\"isTransferred ? 'alert-success' : 'alert-danger'\"\n    >\n        <p class=\"h2\">\n            {{\n                isTransferred\n                    ? (successLabelDicoKey | fromDictionary)\n                    : ('gesdem-confirmation.abort-label' | fromDictionary)\n            }}\n        </p>\n        <dl *ngIf=\"!hideReference\">\n            <dt class=\"font-weight-light\">\n                {{\n                    'gesdem-confirmation.reference-title.label' | fromDictionary\n                }}\n            </dt>\n            <dd id=\"numDemande\" class=\"h4 d-block mt-3\">{{ reference }}</dd>\n        </dl>\n        <p *ngIf=\"hasEmailSent && !(isConnectedCyber | async)\">\n            {{ 'gesdem-confirmation.mail-sent.label' | fromDictionary }}\n        </p>\n    </div>\n\n    <span\n        [innerHTML]=\"'gesdem-confirmation.extra-content' | fromDictionary\"\n    ></span>\n\n    <ng-content></ng-content>\n\n    <div\n        class=\"col-md-12 vd-highlight\"\n        *ngIf=\"(isConnectedCyber | async) && hasConnectedContent()\"\n    >\n        <span class=\"sr-only\">\n            Information suite \u00E0 la transmission de votre demande\n        </span>\n        <div class=\"row\">\n            <div class=\"col-md-1\">\n                <foehn-icon-info-circle class=\"h3\"></foehn-icon-info-circle>\n            </div>\n            <div class=\"col-md-11\">\n                <p\n                    [innerHTML]=\"\n                        isTransferred\n                            ? connectedConfirmationMessage\n                            : connectedConfirmationMessageIfAbandoned\n                    \"\n                ></p>\n                <p\n                    id=\"linkToTreatedDemandes\"\n                    *ngIf=\"\n                        showLinkToMyDemandes &&\n                        (demandeIsClosedOnTransmit || isAbandoned)\n                    \"\n                >\n                    Vous pouvez consulter votre demande en cliquant sur :\n                    <a href=\"/100002/demandes/search/MINE/TREATED\">\n                        Mes nouvelles demandes trait\u00E9es\n                    </a>\n                    .\n                </p>\n                <p\n                    id=\"linkToInProgressDemandes\"\n                    *ngIf=\"\n                        showLinkToMyDemandes &&\n                        !demandeIsClosedOnTransmit &&\n                        !isAbandoned\n                    \"\n                >\n                    Vous pouvez suivre l'avancement du traitement de votre\n                    demande en cliquant sur :\n                    <a href=\"/100002/demandes/search/MINE/IN_PROGRESS\">\n                        Mes demandes en cours de traitement\n                    </a>\n                    .\n                </p>\n            </div>\n        </div>\n    </div>\n\n    <div class=\"col-md-12 list-unstyled d-md-flex p-0 mt-4\">\n        <div class=\"ml-0 mr-md-auto mr-md-2 mb-2 mt-2\">\n            <a\n                *ngIf=\"showDownloadPdfRecapButton\"\n                [href]=\"urlPdf\"\n                id=\"telechargerBtn\"\n                class=\"btn btn-secondary w-100\"\n                title=\"T\u00E9l\u00E9charger le PDF\"\n            >\n                {{ downloadPdfRecapButtonText | fromDictionary }}\n            </a>\n        </div>\n\n        <div\n            class=\"mr-0 ml-md-auto mb-2 mt-2\"\n            *ngIf=\"!(isConnectedCyber | async) && closeLink | async as link\"\n        >\n            <a [href]=\"link\" id=\"terminerBtn\" class=\"btn btn-primary w-100\">\n                {{ closeButtonText | fromDictionary }}\n            </a>\n        </div>\n\n        <div\n            class=\"mr-0 ml-md-auto mb-2 mt-2\"\n            *ngIf=\"!!(isConnectedCyber | async)\"\n        >\n            <a\n                href=\"/100018/logout\"\n                id=\"logoutBtn\"\n                class=\"btn btn-primary w-100\"\n            >\n                {{ 'gesdem-confirmation.logout-button' | fromDictionary }}\n            </a>\n        </div>\n    </div>\n</div>\n\n<div class=\"container mt-5\" *ngIf=\"!hideReference && reference && isInProgress\">\n    <div class=\"alert alert-info text-center mb-2\">\n        <p class=\"h2\">Demande en cours</p>\n        <dl>\n            <dt class=\"font-weight-light\">\n                {{\n                    'gesdem-confirmation.reference-title.label' | fromDictionary\n                }}\n            </dt>\n            <dd id=\"numDemandeEnCours\" class=\"h4 d-block mt-3\">\n                {{ reference }}\n            </dd>\n        </dl>\n    </div>\n\n    <div class=\"col-md-12 vd-highlight\">\n        <div class=\"row\">\n            <div class=\"col-md-1\">\n                <foehn-icon-info-circle class=\"h3\"></foehn-icon-info-circle>\n            </div>\n            <div class=\"col-md-11\">\n                <p>\n                    Vous pouvez reprendre votre demande en cliquant sur le lien\n                    ci-dessous\n                </p>\n                <p>\n                    <a [routerLink]=\"firstPageLink\">Reprendre ma demande</a>\n                </p>\n            </div>\n        </div>\n    </div>\n</div>\n" }]
+            args: [{ selector: 'gesdem-confirmation', template: "<div class=\"container mt-5\" *ngIf=\"reference && !isInProgress\">\n    <div\n        class=\"alert text-center mb-2\"\n        [ngClass]=\"isTransferred ? 'alert-success' : 'alert-danger'\"\n    >\n        <p class=\"h2\">\n            {{\n                isTransferred\n                    ? (successLabelDicoKey | fromDictionary)\n                    : ('gesdem-confirmation.abort-label' | fromDictionary)\n            }}\n        </p>\n        <dl *ngIf=\"!hideReference\">\n            <dt class=\"font-weight-light\">\n                {{\n                    'gesdem-confirmation.reference-title.label' | fromDictionary\n                }}\n            </dt>\n            <dd id=\"numDemande\" class=\"h4 d-block mt-3\">{{ reference }}</dd>\n        </dl>\n        <p *ngIf=\"hasEmailSent && !(isConnectedCyber | async)\">\n            {{ 'gesdem-confirmation.mail-sent.label' | fromDictionary }}\n        </p>\n    </div>\n\n    <span\n        [innerHTML]=\"'gesdem-confirmation.extra-content' | fromDictionary\"\n    ></span>\n\n    <ng-content></ng-content>\n\n    <div\n        class=\"col-md-12 vd-highlight\"\n        *ngIf=\"(isConnectedCyber | async) && hasConnectedContent()\"\n    >\n        <span\n            class=\"sr-only\"\n            [innerHTML]=\"\n                'gesdem-confirmation.transmission-information.label'\n                    | fromDictionary\n            \"\n        ></span>\n        <div class=\"row\">\n            <div class=\"col-md-1\">\n                <foehn-icon-info-circle class=\"h3\"></foehn-icon-info-circle>\n            </div>\n            <div class=\"col-md-11\">\n                <p\n                    [innerHTML]=\"\n                        isTransferred\n                            ? connectedConfirmationMessage\n                            : connectedConfirmationMessageIfAbandoned\n                    \"\n                ></p>\n                <p\n                    id=\"linkToTreatedDemandes\"\n                    *ngIf=\"\n                        showLinkToMyDemandes &&\n                        (demandeIsClosedOnTransmit || isAbandoned)\n                    \"\n                >\n                    {{\n                        'gesdem-confirmation.demand-detail-link.label'\n                            | fromDictionary\n                    }}\n                    <a\n                        href=\"/100002/demandes/{{ reference }}\"\n                        [attr.aria-label]=\"\n                            'gesdem-demand-detail'\n                                | fromDictionary: { reference: reference }\n                        \"\n                    >\n                        {{ reference }}\n                    </a>\n                    .\n                </p>\n                <p\n                    id=\"linkToInProgressDemandes\"\n                    *ngIf=\"\n                        showLinkToMyDemandes &&\n                        !demandeIsClosedOnTransmit &&\n                        !isAbandoned\n                    \"\n                >\n                    {{\n                        'gesdem-confirmation.demand-processing-progress-link.label'\n                            | fromDictionary\n                    }}\n                    <a\n                        href=\"/100002/demandes/{{ reference }}\"\n                        [attr.aria-label]=\"\n                            'gesdem-demand-detail'\n                                | fromDictionary: { reference: reference }\n                        \"\n                    >\n                        {{ reference }}\n                    </a>\n                    .\n                </p>\n            </div>\n        </div>\n    </div>\n\n    <div class=\"col-md-12 list-unstyled d-md-flex p-0 mt-4\">\n        <div class=\"ml-0 mr-md-auto mr-md-2 mb-2 mt-2\">\n            <a\n                *ngIf=\"showDownloadPdfRecapButton\"\n                [href]=\"urlPdf\"\n                id=\"telechargerBtn\"\n                class=\"btn btn-secondary w-100\"\n                [attr.aria-label]=\"\n                    'gesdem.download-pdf.button.title' | fromDictionary\n                \"\n            >\n                {{ downloadPdfRecapButtonText | fromDictionary }}\n            </a>\n        </div>\n\n        <div\n            class=\"mr-0 ml-md-auto mb-2 mt-2\"\n            *ngIf=\"!(isConnectedCyber | async) && closeLink | async as link\"\n        >\n            <a [href]=\"link\" id=\"terminerBtn\" class=\"btn btn-primary w-100\">\n                {{ closeButtonText | fromDictionary }}\n            </a>\n        </div>\n\n        <div\n            class=\"mr-0 ml-md-auto mb-2 mt-2\"\n            *ngIf=\"!!(isConnectedCyber | async)\"\n        >\n            <a\n                href=\"/100018/logout\"\n                id=\"logoutBtn\"\n                class=\"btn btn-primary w-100\"\n            >\n                {{ 'gesdem-confirmation.logout-button' | fromDictionary }}\n            </a>\n        </div>\n    </div>\n</div>\n\n<div class=\"container mt-5\" *ngIf=\"!hideReference && reference && isInProgress\">\n    <div class=\"alert alert-info text-center mb-2\">\n        <p\n            class=\"h2\"\n            [innerHTML]=\"\n                'gesdem-confirmation.demand-in-progress.title' | fromDictionary\n            \"\n        ></p>\n        <dl>\n            <dt class=\"font-weight-light\">\n                {{\n                    'gesdem-confirmation.reference-title.label' | fromDictionary\n                }}\n            </dt>\n            <dd id=\"numDemandeEnCours\" class=\"h4 d-block mt-3\">\n                {{ reference }}\n            </dd>\n        </dl>\n    </div>\n\n    <div class=\"col-md-12 vd-highlight\">\n        <div class=\"row\">\n            <div class=\"col-md-1\">\n                <foehn-icon-info-circle class=\"h3\"></foehn-icon-info-circle>\n            </div>\n            <div class=\"col-md-11\">\n                <p>\n                    {{\n                        'gesdem-confirmation.resume-my-demand.label'\n                            | fromDictionary\n                    }}\n                </p>\n                <p>\n                    <a [routerLink]=\"firstPageLink\">\n                        {{\n                            'gesdem-confirmation.resume-my-demand.button'\n                                | fromDictionary\n                        }}\n                    </a>\n                </p>\n            </div>\n        </div>\n    </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: GesdemHandlerService }, { type: FoehnPageService }, { type: i1$1.ActivatedRoute }, { type: SdkDictionaryService }, { type: i3.Location }]; }, propDecorators: { reference: [{
                 type: Input
             }], setPageTitle: [{
@@ -10815,6 +10890,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 }]
         }] });
 
+const HTTP_LOADER_FILTERED_URL = [
+    'api/support-alert',
+    '(api\\/document(\\/([a-zA-Z0-9])+)*\\/upload)'
+];
+
 class AbstractFoehnUploaderComponent extends FoehnInputComponent {
     constructor(applicationInfoService, confirmModalService, dictionaryService) {
         super();
@@ -10998,6 +11078,72 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 args: ['window:drop', ['$event']]
             }] } });
 
+class FoehnUploadProgressBarComponent {
+    constructor(uploadProgressService) {
+        this.uploadProgressService = uploadProgressService;
+        this.showProgress = this.uploadProgressService.showProgressSubject.pipe(tap(showProgress => {
+            if (showProgress) {
+                this.focusOnContainer();
+            }
+        }), shareReplay(1));
+        this.analysisProgress = this.uploadProgressService.analysisProgressSubject.pipe(shareReplay(1));
+        this.currentUploadPercentage = this.uploadProgressService.uploadProgressSubject.pipe(map$1((progress) => this.calculateProgressPercentage(progress)), shareReplay(1));
+        this.progressBarTriggerSubscription = combineLatest([
+            this.showProgress,
+            this.analysisProgress,
+            this.currentUploadPercentage
+        ])
+            .pipe(tap(([showProgress, analysisProgress, currentUploadPercentage]) => {
+            if (!showProgress &&
+                !analysisProgress &&
+                currentUploadPercentage === 100) {
+                // Reset progress for next upload
+                this.uploadProgressService.uploadProgress.next(null);
+                // Focus back on the trigger. No need for a setTimeout as the trigger should still be in the DOM.
+                // Only does it when progress bar is hidden, analysis is finished and upload is a 100%
+                if (this.progressBarTriggerHtmlElement) {
+                    this.progressBarTriggerHtmlElement.focus();
+                }
+            }
+        }))
+            .subscribe();
+    }
+    ngOnDestroy() {
+        if (this.progressBarTriggerSubscription) {
+            this.progressBarTriggerSubscription.unsubscribe();
+        }
+    }
+    calculateProgressPercentage(progress) {
+        if (!progress) {
+            return 0;
+        }
+        const percent = Math.round((progress.loaded * 100) / progress.total);
+        if (percent === 100) {
+            this.uploadProgressService.analysisProgress.next(true);
+        }
+        return percent;
+    }
+    focusOnContainer() {
+        // Has to be a setTimeout as we're affecting the DOM outside of the Angular lifecycle.
+        setTimeout(() => {
+            if (this.progressBarPanel) {
+                this.progressBarPanel.nativeElement.focus();
+            }
+        });
+    }
+}
+FoehnUploadProgressBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FoehnUploadProgressBarComponent, deps: [{ token: UploadProgressService }], target: i0.ɵɵFactoryTarget.Component });
+FoehnUploadProgressBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: FoehnUploadProgressBarComponent, selector: "foehn-upload-progress-bar", inputs: { progressBarTriggerHtmlElement: "progressBarTriggerHtmlElement" }, viewQueries: [{ propertyName: "progressBarPanel", first: true, predicate: ["progressBarPanel"], descendants: true }], ngImport: i0, template: "<div\n    *ngIf=\"(showProgress | async) === true\"\n    role=\"dialog\"\n    class=\"progress-bar-container d-flex justify-content-center\"\n    tabindex=\"-1\"\n    cdkTrapFocus\n>\n    <div\n        class=\"progress-bar-panel d-flex flex-column align-self-center\"\n        tabindex=\"-1\"\n        #progressBarPanel\n    >\n        <div class=\"progress-bar-panel-title py-2 px-3\">\n            <h2\n                class=\"h5\"\n                [innerHTML]=\"'foehn-upload-progress-bar.title' | fromDictionary\"\n            ></h2>\n        </div>\n        <div class=\"progress-bar-panel-body p-3\">\n            <p\n                *ngIf=\"(analysisProgress | async) === false\"\n                [innerHTML]=\"\n                    'foehn-upload-progress-bar.upload' | fromDictionary\n                \"\n            ></p>\n            <p\n                *ngIf=\"(analysisProgress | async) === true\"\n                [innerHTML]=\"\n                    'foehn-upload-progress-bar.analysis' | fromDictionary\n                \"\n            ></p>\n            <!-- Need to add a tabindex=\"0\" (here on progress) otherwise cdkTrapFocus will not work -->\n            <div class=\"progress\" tabindex=\"0\">\n                <div\n                    *ngIf=\"currentUploadPercentage | async as progress\"\n                    role=\"progressbar\"\n                    class=\"progress-bar bg-success\"\n                    [class.progress-bar-animated]=\"\n                        (analysisProgress | async) === true\n                    \"\n                    [class.progress-bar-striped]=\"\n                        (analysisProgress | async) === true\n                    \"\n                    [style.width]=\"progress + '%'\"\n                    [attr.aria-valuenow]=\"progress\"\n                    aria-valuemin=\"0\"\n                    aria-valuemax=\"100\"\n                >\n                    <ng-container *ngIf=\"(analysisProgress | async) === false\">\n                        {{ progress + '%' }}\n                    </ng-container>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [".progress-bar-container{top:0;left:0;height:100%;width:100%;position:fixed;z-index:10000;overflow:auto;background-color:#000;background-color:#0006}.progress-bar-panel{width:30%;background-color:#fff}.progress-bar-panel-title{background-color:var(--vd-neutral-lighter)}.progress-bar-panel-title h2{margin-top:.5rem}.progress{width:100%;background-color:var(--vd-neutral-lighter);box-shadow:none}.progress:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}\n"], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], pipes: { "async": i3.AsyncPipe, "fromDictionary": SdkDictionaryPipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FoehnUploadProgressBarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'foehn-upload-progress-bar', template: "<div\n    *ngIf=\"(showProgress | async) === true\"\n    role=\"dialog\"\n    class=\"progress-bar-container d-flex justify-content-center\"\n    tabindex=\"-1\"\n    cdkTrapFocus\n>\n    <div\n        class=\"progress-bar-panel d-flex flex-column align-self-center\"\n        tabindex=\"-1\"\n        #progressBarPanel\n    >\n        <div class=\"progress-bar-panel-title py-2 px-3\">\n            <h2\n                class=\"h5\"\n                [innerHTML]=\"'foehn-upload-progress-bar.title' | fromDictionary\"\n            ></h2>\n        </div>\n        <div class=\"progress-bar-panel-body p-3\">\n            <p\n                *ngIf=\"(analysisProgress | async) === false\"\n                [innerHTML]=\"\n                    'foehn-upload-progress-bar.upload' | fromDictionary\n                \"\n            ></p>\n            <p\n                *ngIf=\"(analysisProgress | async) === true\"\n                [innerHTML]=\"\n                    'foehn-upload-progress-bar.analysis' | fromDictionary\n                \"\n            ></p>\n            <!-- Need to add a tabindex=\"0\" (here on progress) otherwise cdkTrapFocus will not work -->\n            <div class=\"progress\" tabindex=\"0\">\n                <div\n                    *ngIf=\"currentUploadPercentage | async as progress\"\n                    role=\"progressbar\"\n                    class=\"progress-bar bg-success\"\n                    [class.progress-bar-animated]=\"\n                        (analysisProgress | async) === true\n                    \"\n                    [class.progress-bar-striped]=\"\n                        (analysisProgress | async) === true\n                    \"\n                    [style.width]=\"progress + '%'\"\n                    [attr.aria-valuenow]=\"progress\"\n                    aria-valuemin=\"0\"\n                    aria-valuemax=\"100\"\n                >\n                    <ng-container *ngIf=\"(analysisProgress | async) === false\">\n                        {{ progress + '%' }}\n                    </ng-container>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [".progress-bar-container{top:0;left:0;height:100%;width:100%;position:fixed;z-index:10000;overflow:auto;background-color:#000;background-color:#0006}.progress-bar-panel{width:30%;background-color:#fff}.progress-bar-panel-title{background-color:var(--vd-neutral-lighter)}.progress-bar-panel-title h2{margin-top:.5rem}.progress{width:100%;background-color:var(--vd-neutral-lighter);box-shadow:none}.progress:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}\n"] }]
+        }], ctorParameters: function () { return [{ type: UploadProgressService }]; }, propDecorators: { progressBarTriggerHtmlElement: [{
+                type: Input
+            }], progressBarPanel: [{
+                type: ViewChild,
+                args: ['progressBarPanel', { static: false }]
+            }] } });
+
 class FoehnMultiUploadComponent extends AbstractFoehnUploaderComponent {
     constructor(multiUploadService, pendingUploadService, applicationInfoService, confirmModalService, dictionaryService) {
         super(applicationInfoService, confirmModalService, dictionaryService);
@@ -11179,7 +11325,7 @@ FoehnMultiUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             useExisting: forwardRef(() => FoehnMultiUploadComponent),
             multi: true
         }
-    ], usesInheritance: true, ngImport: i0, template: "<div\n    class=\"form-group\"\n    [class.has-danger]=\"hasErrorsToDisplay()\"\n    [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n    [class.drop-zone-highlight]=\"showDropZone\"\n    [attr.id]=\"buildId('Container')\"\n    tabindex=\"-1\"\n    (drop)=\"onDrop($event)\"\n    (dragenter)=\"onDragenter($event)\"\n    (dragleave)=\"onDragleave($event)\"\n    (dragover)=\"onDragover($event)\"\n>\n    <label\n        [attr.for]=\"buildChildId()\"\n        *ngIf=\"!!label\"\n        [ngClass]=\"isLabelSrOnly ? 'sr-only' : labelStyleModifier\"\n    >\n        <span [innerHTML]=\"label\"></span>\n        <span\n            *ngIf=\"!required && !hideNotRequiredExtraLabel\"\n            aria-hidden=\"true\"\n        >\n            {{ 'foehn-input.optional' | fromDictionary }}\n        </span>\n    </label>\n\n    <foehn-validation-alerts\n        [component]=\"this\"\n        [shouldErrorsBeLive]=\"hasLiveUploadErrors()\"\n    ></foehn-validation-alerts>\n\n    <small\n        *ngIf=\"helpText\"\n        [attr.id]=\"buildChildId() + 'Help'\"\n        class=\"form-text text-secondary\"\n        [innerHTML]=\"helpText\"\n    ></small>\n\n    <!-- PRESTAKIT-309: Fake input with NgModel to be registered into Form controls -->\n    <input type=\"hidden\" [name]=\"name || label\" [ngModel]=\"model\" />\n\n    <ng-content></ng-content>\n\n    <ng-container *ngIf=\"reference\">\n        <div\n            *ngFor=\"let document of model; trackBy: trackByDocument\"\n            class=\"file file-uploaded\"\n        >\n            <!-- prettier-ignore -->\n            <a [href]=\"multiUploadService.getDownloadUrl(url, document)\">{{ document.filename }}</a>\n            <span class=\"ml-1 mr-1\">\n                ({{ toMegaOctets(document.fileSize) }}\n                <abbr\n                    [title]=\"\n                        'foehn-uploader.abbr-megaoctet-title' | fromDictionary\n                    \"\n                >\n                    {{ 'foehn-uploader.abbr-megaoctet' | fromDictionary }}\n                </abbr>\n                )\n            </span>\n            <button\n                *ngIf=\"!readonly\"\n                type=\"button\"\n                class=\"btn icon-button delete-uploaded\"\n                (click)=\"removeFile(document)\"\n            >\n                <foehn-icon-times\n                    [title]=\"\n                        'foehn-uploader.delete-icon-title'\n                            | fromDictionary: { docName: document.filename }\n                    \"\n                ></foehn-icon-times>\n            </button>\n        </div>\n\n        <small\n            class=\"form-text text-secondary uploaded-global-info\"\n            *ngIf=\"showGlobalInfos(model)\"\n            [innerHTML]=\"getGlobalInfos(model)\"\n        ></small>\n    </ng-container>\n\n    <ng-container *ngIf=\"!reference\">\n        <div\n            *ngFor=\"let pending of pendingFiles; trackBy: trackByPending\"\n            class=\"file file-pending\"\n        >\n            <span>{{ pending.name }}</span>\n            <span class=\"ml-1 mr-1\">\n                ({{ toMegaOctets(pending.size) }}\n                <abbr\n                    [title]=\"\n                        'foehn-uploader.abbr-megaoctet-title' | fromDictionary\n                    \"\n                >\n                    {{ 'foehn-uploader.abbr-megaoctet' | fromDictionary }}\n                </abbr>\n                )\n            </span>\n            <button\n                *ngIf=\"!readonly\"\n                type=\"button\"\n                class=\"btn icon-button delete-pending\"\n                (click)=\"removeFile(pending)\"\n            >\n                <foehn-icon-times\n                    [title]=\"\n                        'foehn-uploader.delete-icon-title'\n                            | fromDictionary: { docName: pending.name }\n                    \"\n                ></foehn-icon-times>\n            </button>\n        </div>\n\n        <small\n            class=\"form-text text-secondary pending-global-info\"\n            *ngIf=\"showGlobalInfos(pendingFiles)\"\n            [innerHTML]=\"getGlobalInfos(pendingFiles)\"\n        ></small>\n    </ng-container>\n\n    <ng-container *ngIf=\"canAddMoreFiles()\">\n        <input\n            class=\"form-control-file actual-input\"\n            type=\"file\"\n            [name]=\"name || label\"\n            [multiple]=\"multiple\"\n            [attr.accept]=\"\n                overrideAcceptedExtensions\n                    ? overrideAcceptedExtensions\n                    : uploaderHelper.accept\n                    ? uploaderHelper.accept\n                    : null\n            \"\n            (change)=\"onFileChange($event)\"\n            #inputFile\n        />\n\n        <button\n            type=\"button\"\n            class=\"btn btn-primary\"\n            [ngClass]=\"{ 'sr-only': !showUploadButton }\"\n            [attr.id]=\"buildChildId()\"\n            [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n            [attr.aria-describedby]=\"buildId('ErrorsContainer')\"\n            (click)=\"inputFile.click()\"\n            #entryComponent\n        >\n            {{ multiple ? chooseButtonLabelMultiple : chooseButtonLabel }}\n        </button>\n\n        <div\n            *ngIf=\"dragAndDrop\"\n            aria-hidden=\"true\"\n            class=\"dropfile\"\n            [class.dropfile-border-transparent]=\"showDropZone\"\n            (click)=\"inputFile.click()\"\n        >\n            {{ multiple ? dropZoneLabelMultiple : dropZoneLabel }}\n        </div>\n    </ng-container>\n</div>\n", styles: [".dropfile{width:300px;border:3px dashed #bbb;text-align:center;margin-top:10px;cursor:pointer;padding:15px 3px}.dropfile-border-transparent{border-color:var(--white)}.actual-input{display:none}.file-list{margin-top:20px}.icon-button{border:0;background-color:transparent}.icon-button:hover{cursor:pointer}:host ::ng-deep .svg-inline--fa{color:#000!important}.drop-zone-highlight{outline:3px dashed #bbb}\n"], components: [{ type: FoehnValidationAlertsComponent, selector: "foehn-validation-alerts", inputs: ["component", "shouldErrorsBeLive"] }, { type: FoehnIconTimesComponent, selector: "foehn-icon-times" }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "fromDictionary": SdkDictionaryPipe } });
+    ], usesInheritance: true, ngImport: i0, template: "<div\n    class=\"form-group\"\n    [class.has-danger]=\"hasErrorsToDisplay()\"\n    [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n    [class.drop-zone-highlight]=\"showDropZone\"\n    [attr.id]=\"buildId('Container')\"\n    tabindex=\"-1\"\n    (drop)=\"onDrop($event)\"\n    (dragenter)=\"onDragenter($event)\"\n    (dragleave)=\"onDragleave($event)\"\n    (dragover)=\"onDragover($event)\"\n    #fallBackTrigger\n>\n    <label\n        [attr.for]=\"buildChildId()\"\n        *ngIf=\"!!label\"\n        [ngClass]=\"isLabelSrOnly ? 'sr-only' : labelStyleModifier\"\n    >\n        <span [innerHTML]=\"label\"></span>\n        <span\n            *ngIf=\"!required && !hideNotRequiredExtraLabel\"\n            aria-hidden=\"true\"\n        >\n            {{ 'foehn-input.optional' | fromDictionary }}\n        </span>\n    </label>\n\n    <foehn-validation-alerts\n        [component]=\"this\"\n        [shouldErrorsBeLive]=\"hasLiveUploadErrors()\"\n    ></foehn-validation-alerts>\n\n    <small\n        *ngIf=\"helpText\"\n        [attr.id]=\"buildChildId() + 'Help'\"\n        class=\"form-text text-secondary\"\n        [innerHTML]=\"helpText\"\n    ></small>\n\n    <!-- PRESTAKIT-309: Fake input with NgModel to be registered into Form controls -->\n    <input type=\"hidden\" [name]=\"name || label\" [ngModel]=\"model\" />\n\n    <ng-content></ng-content>\n\n    <ng-container *ngIf=\"reference\">\n        <div\n            *ngFor=\"let document of model; trackBy: trackByDocument\"\n            class=\"file file-uploaded\"\n        >\n            <!-- prettier-ignore -->\n            <a [href]=\"multiUploadService.getDownloadUrl(url, document)\">{{ document.filename }}</a>\n            <span class=\"ml-1 mr-1\">\n                ({{ toMegaOctets(document.fileSize) }}\n                <abbr\n                    [title]=\"\n                        'foehn-uploader.abbr-megaoctet-title' | fromDictionary\n                    \"\n                >\n                    {{ 'foehn-uploader.abbr-megaoctet' | fromDictionary }}\n                </abbr>\n                )\n            </span>\n            <button\n                *ngIf=\"!readonly\"\n                type=\"button\"\n                class=\"btn icon-button delete-uploaded\"\n                (click)=\"removeFile(document)\"\n            >\n                <foehn-icon-times\n                    [title]=\"\n                        'foehn-uploader.delete-icon-title'\n                            | fromDictionary: { docName: document.filename }\n                    \"\n                ></foehn-icon-times>\n            </button>\n        </div>\n\n        <small\n            class=\"form-text text-secondary uploaded-global-info\"\n            *ngIf=\"showGlobalInfos(model)\"\n            [innerHTML]=\"getGlobalInfos(model)\"\n        ></small>\n    </ng-container>\n\n    <ng-container *ngIf=\"!reference\">\n        <div\n            *ngFor=\"let pending of pendingFiles; trackBy: trackByPending\"\n            class=\"file file-pending\"\n        >\n            <span>{{ pending.name }}</span>\n            <span class=\"ml-1 mr-1\">\n                ({{ toMegaOctets(pending.size) }}\n                <abbr\n                    [title]=\"\n                        'foehn-uploader.abbr-megaoctet-title' | fromDictionary\n                    \"\n                >\n                    {{ 'foehn-uploader.abbr-megaoctet' | fromDictionary }}\n                </abbr>\n                )\n            </span>\n            <button\n                *ngIf=\"!readonly\"\n                type=\"button\"\n                class=\"btn icon-button delete-pending\"\n                (click)=\"removeFile(pending)\"\n            >\n                <foehn-icon-times\n                    [title]=\"\n                        'foehn-uploader.delete-icon-title'\n                            | fromDictionary: { docName: pending.name }\n                    \"\n                ></foehn-icon-times>\n            </button>\n        </div>\n\n        <small\n            class=\"form-text text-secondary pending-global-info\"\n            *ngIf=\"showGlobalInfos(pendingFiles)\"\n            [innerHTML]=\"getGlobalInfos(pendingFiles)\"\n        ></small>\n    </ng-container>\n\n    <ng-container *ngIf=\"canAddMoreFiles()\">\n        <input\n            class=\"form-control-file actual-input\"\n            type=\"file\"\n            [name]=\"name || label\"\n            [multiple]=\"multiple\"\n            [attr.accept]=\"\n                overrideAcceptedExtensions\n                    ? overrideAcceptedExtensions\n                    : uploaderHelper.accept\n                    ? uploaderHelper.accept\n                    : null\n            \"\n            (change)=\"onFileChange($event)\"\n            #inputFile\n        />\n\n        <button\n            type=\"button\"\n            class=\"btn btn-primary\"\n            [ngClass]=\"{ 'sr-only': !showUploadButton }\"\n            [attr.id]=\"buildChildId()\"\n            [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n            [attr.aria-describedby]=\"buildId('ErrorsContainer')\"\n            (click)=\"inputFile.click()\"\n            #entryComponent\n        >\n            {{ multiple ? chooseButtonLabelMultiple : chooseButtonLabel }}\n        </button>\n\n        <div\n            *ngIf=\"dragAndDrop\"\n            aria-hidden=\"true\"\n            class=\"dropfile\"\n            [class.dropfile-border-transparent]=\"showDropZone\"\n            (click)=\"inputFile.click()\"\n        >\n            {{ multiple ? dropZoneLabelMultiple : dropZoneLabel }}\n        </div>\n    </ng-container>\n\n    <foehn-upload-progress-bar\n        *ngIf=\"reference\"\n        [progressBarTriggerHtmlElement]=\"\n            inputElement?.nativeElement || fallBackTrigger\n        \"\n    ></foehn-upload-progress-bar>\n</div>\n", styles: [".dropfile{width:300px;border:3px dashed #bbb;text-align:center;margin-top:10px;cursor:pointer;padding:15px 3px}.dropfile-border-transparent{border-color:var(--white)}.actual-input{display:none}.file-list{margin-top:20px}.icon-button{border:0;background-color:transparent}.icon-button:hover{cursor:pointer}:host ::ng-deep .svg-inline--fa{color:#000!important}.drop-zone-highlight{outline:3px dashed #bbb}\n"], components: [{ type: FoehnValidationAlertsComponent, selector: "foehn-validation-alerts", inputs: ["component", "shouldErrorsBeLive"] }, { type: FoehnIconTimesComponent, selector: "foehn-icon-times" }, { type: FoehnUploadProgressBarComponent, selector: "foehn-upload-progress-bar", inputs: ["progressBarTriggerHtmlElement"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "fromDictionary": SdkDictionaryPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FoehnMultiUploadComponent, decorators: [{
             type: Component,
             args: [{ selector: 'foehn-multi-upload', providers: [
@@ -11188,7 +11334,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                             useExisting: forwardRef(() => FoehnMultiUploadComponent),
                             multi: true
                         }
-                    ], template: "<div\n    class=\"form-group\"\n    [class.has-danger]=\"hasErrorsToDisplay()\"\n    [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n    [class.drop-zone-highlight]=\"showDropZone\"\n    [attr.id]=\"buildId('Container')\"\n    tabindex=\"-1\"\n    (drop)=\"onDrop($event)\"\n    (dragenter)=\"onDragenter($event)\"\n    (dragleave)=\"onDragleave($event)\"\n    (dragover)=\"onDragover($event)\"\n>\n    <label\n        [attr.for]=\"buildChildId()\"\n        *ngIf=\"!!label\"\n        [ngClass]=\"isLabelSrOnly ? 'sr-only' : labelStyleModifier\"\n    >\n        <span [innerHTML]=\"label\"></span>\n        <span\n            *ngIf=\"!required && !hideNotRequiredExtraLabel\"\n            aria-hidden=\"true\"\n        >\n            {{ 'foehn-input.optional' | fromDictionary }}\n        </span>\n    </label>\n\n    <foehn-validation-alerts\n        [component]=\"this\"\n        [shouldErrorsBeLive]=\"hasLiveUploadErrors()\"\n    ></foehn-validation-alerts>\n\n    <small\n        *ngIf=\"helpText\"\n        [attr.id]=\"buildChildId() + 'Help'\"\n        class=\"form-text text-secondary\"\n        [innerHTML]=\"helpText\"\n    ></small>\n\n    <!-- PRESTAKIT-309: Fake input with NgModel to be registered into Form controls -->\n    <input type=\"hidden\" [name]=\"name || label\" [ngModel]=\"model\" />\n\n    <ng-content></ng-content>\n\n    <ng-container *ngIf=\"reference\">\n        <div\n            *ngFor=\"let document of model; trackBy: trackByDocument\"\n            class=\"file file-uploaded\"\n        >\n            <!-- prettier-ignore -->\n            <a [href]=\"multiUploadService.getDownloadUrl(url, document)\">{{ document.filename }}</a>\n            <span class=\"ml-1 mr-1\">\n                ({{ toMegaOctets(document.fileSize) }}\n                <abbr\n                    [title]=\"\n                        'foehn-uploader.abbr-megaoctet-title' | fromDictionary\n                    \"\n                >\n                    {{ 'foehn-uploader.abbr-megaoctet' | fromDictionary }}\n                </abbr>\n                )\n            </span>\n            <button\n                *ngIf=\"!readonly\"\n                type=\"button\"\n                class=\"btn icon-button delete-uploaded\"\n                (click)=\"removeFile(document)\"\n            >\n                <foehn-icon-times\n                    [title]=\"\n                        'foehn-uploader.delete-icon-title'\n                            | fromDictionary: { docName: document.filename }\n                    \"\n                ></foehn-icon-times>\n            </button>\n        </div>\n\n        <small\n            class=\"form-text text-secondary uploaded-global-info\"\n            *ngIf=\"showGlobalInfos(model)\"\n            [innerHTML]=\"getGlobalInfos(model)\"\n        ></small>\n    </ng-container>\n\n    <ng-container *ngIf=\"!reference\">\n        <div\n            *ngFor=\"let pending of pendingFiles; trackBy: trackByPending\"\n            class=\"file file-pending\"\n        >\n            <span>{{ pending.name }}</span>\n            <span class=\"ml-1 mr-1\">\n                ({{ toMegaOctets(pending.size) }}\n                <abbr\n                    [title]=\"\n                        'foehn-uploader.abbr-megaoctet-title' | fromDictionary\n                    \"\n                >\n                    {{ 'foehn-uploader.abbr-megaoctet' | fromDictionary }}\n                </abbr>\n                )\n            </span>\n            <button\n                *ngIf=\"!readonly\"\n                type=\"button\"\n                class=\"btn icon-button delete-pending\"\n                (click)=\"removeFile(pending)\"\n            >\n                <foehn-icon-times\n                    [title]=\"\n                        'foehn-uploader.delete-icon-title'\n                            | fromDictionary: { docName: pending.name }\n                    \"\n                ></foehn-icon-times>\n            </button>\n        </div>\n\n        <small\n            class=\"form-text text-secondary pending-global-info\"\n            *ngIf=\"showGlobalInfos(pendingFiles)\"\n            [innerHTML]=\"getGlobalInfos(pendingFiles)\"\n        ></small>\n    </ng-container>\n\n    <ng-container *ngIf=\"canAddMoreFiles()\">\n        <input\n            class=\"form-control-file actual-input\"\n            type=\"file\"\n            [name]=\"name || label\"\n            [multiple]=\"multiple\"\n            [attr.accept]=\"\n                overrideAcceptedExtensions\n                    ? overrideAcceptedExtensions\n                    : uploaderHelper.accept\n                    ? uploaderHelper.accept\n                    : null\n            \"\n            (change)=\"onFileChange($event)\"\n            #inputFile\n        />\n\n        <button\n            type=\"button\"\n            class=\"btn btn-primary\"\n            [ngClass]=\"{ 'sr-only': !showUploadButton }\"\n            [attr.id]=\"buildChildId()\"\n            [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n            [attr.aria-describedby]=\"buildId('ErrorsContainer')\"\n            (click)=\"inputFile.click()\"\n            #entryComponent\n        >\n            {{ multiple ? chooseButtonLabelMultiple : chooseButtonLabel }}\n        </button>\n\n        <div\n            *ngIf=\"dragAndDrop\"\n            aria-hidden=\"true\"\n            class=\"dropfile\"\n            [class.dropfile-border-transparent]=\"showDropZone\"\n            (click)=\"inputFile.click()\"\n        >\n            {{ multiple ? dropZoneLabelMultiple : dropZoneLabel }}\n        </div>\n    </ng-container>\n</div>\n", styles: [".dropfile{width:300px;border:3px dashed #bbb;text-align:center;margin-top:10px;cursor:pointer;padding:15px 3px}.dropfile-border-transparent{border-color:var(--white)}.actual-input{display:none}.file-list{margin-top:20px}.icon-button{border:0;background-color:transparent}.icon-button:hover{cursor:pointer}:host ::ng-deep .svg-inline--fa{color:#000!important}.drop-zone-highlight{outline:3px dashed #bbb}\n"] }]
+                    ], template: "<div\n    class=\"form-group\"\n    [class.has-danger]=\"hasErrorsToDisplay()\"\n    [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n    [class.drop-zone-highlight]=\"showDropZone\"\n    [attr.id]=\"buildId('Container')\"\n    tabindex=\"-1\"\n    (drop)=\"onDrop($event)\"\n    (dragenter)=\"onDragenter($event)\"\n    (dragleave)=\"onDragleave($event)\"\n    (dragover)=\"onDragover($event)\"\n    #fallBackTrigger\n>\n    <label\n        [attr.for]=\"buildChildId()\"\n        *ngIf=\"!!label\"\n        [ngClass]=\"isLabelSrOnly ? 'sr-only' : labelStyleModifier\"\n    >\n        <span [innerHTML]=\"label\"></span>\n        <span\n            *ngIf=\"!required && !hideNotRequiredExtraLabel\"\n            aria-hidden=\"true\"\n        >\n            {{ 'foehn-input.optional' | fromDictionary }}\n        </span>\n    </label>\n\n    <foehn-validation-alerts\n        [component]=\"this\"\n        [shouldErrorsBeLive]=\"hasLiveUploadErrors()\"\n    ></foehn-validation-alerts>\n\n    <small\n        *ngIf=\"helpText\"\n        [attr.id]=\"buildChildId() + 'Help'\"\n        class=\"form-text text-secondary\"\n        [innerHTML]=\"helpText\"\n    ></small>\n\n    <!-- PRESTAKIT-309: Fake input with NgModel to be registered into Form controls -->\n    <input type=\"hidden\" [name]=\"name || label\" [ngModel]=\"model\" />\n\n    <ng-content></ng-content>\n\n    <ng-container *ngIf=\"reference\">\n        <div\n            *ngFor=\"let document of model; trackBy: trackByDocument\"\n            class=\"file file-uploaded\"\n        >\n            <!-- prettier-ignore -->\n            <a [href]=\"multiUploadService.getDownloadUrl(url, document)\">{{ document.filename }}</a>\n            <span class=\"ml-1 mr-1\">\n                ({{ toMegaOctets(document.fileSize) }}\n                <abbr\n                    [title]=\"\n                        'foehn-uploader.abbr-megaoctet-title' | fromDictionary\n                    \"\n                >\n                    {{ 'foehn-uploader.abbr-megaoctet' | fromDictionary }}\n                </abbr>\n                )\n            </span>\n            <button\n                *ngIf=\"!readonly\"\n                type=\"button\"\n                class=\"btn icon-button delete-uploaded\"\n                (click)=\"removeFile(document)\"\n            >\n                <foehn-icon-times\n                    [title]=\"\n                        'foehn-uploader.delete-icon-title'\n                            | fromDictionary: { docName: document.filename }\n                    \"\n                ></foehn-icon-times>\n            </button>\n        </div>\n\n        <small\n            class=\"form-text text-secondary uploaded-global-info\"\n            *ngIf=\"showGlobalInfos(model)\"\n            [innerHTML]=\"getGlobalInfos(model)\"\n        ></small>\n    </ng-container>\n\n    <ng-container *ngIf=\"!reference\">\n        <div\n            *ngFor=\"let pending of pendingFiles; trackBy: trackByPending\"\n            class=\"file file-pending\"\n        >\n            <span>{{ pending.name }}</span>\n            <span class=\"ml-1 mr-1\">\n                ({{ toMegaOctets(pending.size) }}\n                <abbr\n                    [title]=\"\n                        'foehn-uploader.abbr-megaoctet-title' | fromDictionary\n                    \"\n                >\n                    {{ 'foehn-uploader.abbr-megaoctet' | fromDictionary }}\n                </abbr>\n                )\n            </span>\n            <button\n                *ngIf=\"!readonly\"\n                type=\"button\"\n                class=\"btn icon-button delete-pending\"\n                (click)=\"removeFile(pending)\"\n            >\n                <foehn-icon-times\n                    [title]=\"\n                        'foehn-uploader.delete-icon-title'\n                            | fromDictionary: { docName: pending.name }\n                    \"\n                ></foehn-icon-times>\n            </button>\n        </div>\n\n        <small\n            class=\"form-text text-secondary pending-global-info\"\n            *ngIf=\"showGlobalInfos(pendingFiles)\"\n            [innerHTML]=\"getGlobalInfos(pendingFiles)\"\n        ></small>\n    </ng-container>\n\n    <ng-container *ngIf=\"canAddMoreFiles()\">\n        <input\n            class=\"form-control-file actual-input\"\n            type=\"file\"\n            [name]=\"name || label\"\n            [multiple]=\"multiple\"\n            [attr.accept]=\"\n                overrideAcceptedExtensions\n                    ? overrideAcceptedExtensions\n                    : uploaderHelper.accept\n                    ? uploaderHelper.accept\n                    : null\n            \"\n            (change)=\"onFileChange($event)\"\n            #inputFile\n        />\n\n        <button\n            type=\"button\"\n            class=\"btn btn-primary\"\n            [ngClass]=\"{ 'sr-only': !showUploadButton }\"\n            [attr.id]=\"buildChildId()\"\n            [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n            [attr.aria-describedby]=\"buildId('ErrorsContainer')\"\n            (click)=\"inputFile.click()\"\n            #entryComponent\n        >\n            {{ multiple ? chooseButtonLabelMultiple : chooseButtonLabel }}\n        </button>\n\n        <div\n            *ngIf=\"dragAndDrop\"\n            aria-hidden=\"true\"\n            class=\"dropfile\"\n            [class.dropfile-border-transparent]=\"showDropZone\"\n            (click)=\"inputFile.click()\"\n        >\n            {{ multiple ? dropZoneLabelMultiple : dropZoneLabel }}\n        </div>\n    </ng-container>\n\n    <foehn-upload-progress-bar\n        *ngIf=\"reference\"\n        [progressBarTriggerHtmlElement]=\"\n            inputElement?.nativeElement || fallBackTrigger\n        \"\n    ></foehn-upload-progress-bar>\n</div>\n", styles: [".dropfile{width:300px;border:3px dashed #bbb;text-align:center;margin-top:10px;cursor:pointer;padding:15px 3px}.dropfile-border-transparent{border-color:var(--white)}.actual-input{display:none}.file-list{margin-top:20px}.icon-button{border:0;background-color:transparent}.icon-button:hover{cursor:pointer}:host ::ng-deep .svg-inline--fa{color:#000!important}.drop-zone-highlight{outline:3px dashed #bbb}\n"] }]
         }], ctorParameters: function () { return [{ type: MultiUploadService }, { type: PendingUploadService }, { type: ApplicationInfoService }, { type: FoehnConfirmModalService }, { type: SdkDictionaryService }]; }, propDecorators: { url: [{
                 type: Input
             }], reference: [{
@@ -11197,6 +11343,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 type: Input
             }] } });
 
+class FoehnUploadProgressBarModule {
+}
+FoehnUploadProgressBarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FoehnUploadProgressBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+FoehnUploadProgressBarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FoehnUploadProgressBarModule, declarations: [FoehnUploadProgressBarComponent], imports: [CommonModule, A11yModule, PipeModule, SdkDictionaryModule], exports: [FoehnUploadProgressBarComponent] });
+FoehnUploadProgressBarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FoehnUploadProgressBarModule, imports: [[CommonModule, A11yModule, PipeModule, SdkDictionaryModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FoehnUploadProgressBarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, A11yModule, PipeModule, SdkDictionaryModule],
+                    declarations: [FoehnUploadProgressBarComponent],
+                    exports: [FoehnUploadProgressBarComponent]
+                }]
+        }] });
+
 class FoehnMultiUploadModule {
 }
 FoehnMultiUploadModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FoehnMultiUploadModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
@@ -11204,13 +11364,15 @@ FoehnMultiUploadModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0",
         FoehnIconsModule,
         FoehnValidationAlertsModule,
         SdkDictionaryModule,
-        FormsModule], exports: [FoehnMultiUploadComponent] });
+        FormsModule,
+        FoehnUploadProgressBarModule], exports: [FoehnMultiUploadComponent] });
 FoehnMultiUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FoehnMultiUploadModule, imports: [[
             CommonModule,
             FoehnIconsModule,
             FoehnValidationAlertsModule,
             SdkDictionaryModule,
-            FormsModule
+            FormsModule,
+            FoehnUploadProgressBarModule
         ]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FoehnMultiUploadModule, decorators: [{
             type: NgModule,
@@ -11220,7 +11382,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                         FoehnIconsModule,
                         FoehnValidationAlertsModule,
                         SdkDictionaryModule,
-                        FormsModule
+                        FormsModule,
+                        FoehnUploadProgressBarModule
                     ],
                     declarations: [FoehnMultiUploadComponent],
                     exports: [FoehnMultiUploadComponent]
@@ -11680,6 +11843,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 }]
         }] });
 
+class UploadProgress {
+}
+
 class EPaymentService {
     constructor(http, growlService) {
         this.http = http;
@@ -12947,5 +13113,5 @@ class SelectedSlot {
  * Generated bundle index. Do not edit.
  */
 
-export { APP_INFO_API_URL, AbstractFoehnUploaderComponent, AbstractListDetailPageComponent, AbstractMenuPageComponent, AbstractPageComponent, AbstractPageFromMenuComponent, ActionStatut, Address, AddressTypeLight, ApplicationInfo, ApplicationInfoService, BAD_PARAMS_HELP_TEXT, BoDocumentError, BoDocumentsWithErrors, BoMultiUploadService, Breadcrumb, BreadcrumbEventService, BreadcrumbItem, CAPTCHA_ERROR_NAME, CURRENCY_REGEXP, Calendar, Canton, Captcha, ComponentError, Configuration, Country, CurrencyHelper, CurrentWeek, DECIMALS_SEPARATOR, DEFAULT_INTERNATIONAL_AND_NO_SWISS, DEFAULT_INTERNATIONAL_AND_NO_SWISS_MOBILE, DEFAULT_INTERNATIONAL_AND_NO_SWISS_PHONE, DEFAULT_INTERNATIONAL_HELP_TEXT, DEFAULT_SWISS_HELP_TEXT, DEFAULT_SWISS_MOBILE_PHONE_HELP_TEXT, DEFAULT_SWISS_PHONE_HELP_TEXT, DICTIONARY_BASE_URL, DateHelper, DatePickerHelper, DatePickerNavigationHelper, DayMonth, DaySlots, DisplayCurrencyPipe, DisplayDatePipe, DisplayLoginMessagesData, District, Document, DocumentError, DocumentReference, DocumentReferenceWithFile, DocumentsWithErrors, EPaymentService, EtapeInfo, FORM_SUPPORT_CYBER_TITLE_FALLBACK, FocusedDay, FoehnAbbrComponent, FoehnAddressModule, FoehnAgendaComponent, FoehnAgendaModule, FoehnAgendaNavigationComponent, FoehnAgendaTimeslotPanelComponent, FoehnAutocompleteComponent, FoehnAutocompleteModule, FoehnBoMultiUploadComponent, FoehnBoMultiUploadModule, FoehnBooleanCheckboxComponent, FoehnBooleanModule, FoehnBooleanRadioComponent, FoehnBreadcrumbComponent, FoehnBreadcrumbModule, FoehnCheckableGroupComponent, FoehnCheckablesModule, FoehnCheckboxComponent, FoehnConfirmModalComponent, FoehnConfirmModalContent, FoehnConfirmModalModule, FoehnConfirmModalService, FoehnDateComponent, FoehnDatePickerButtonComponent, FoehnDatePickerButtonModule, FoehnDatePickerComponent, FoehnDatePickerModule, FoehnDecisionElectroniqueComponent, FoehnDecisionElectroniqueModule, FoehnDisplayAddressComponent, FoehnErrorPillComponent, FoehnFormComponent, FoehnFormModule, FoehnHeaderComponent, FoehnHeaderModule, FoehnHelpModalComponent, FoehnHelpModalModule, FoehnIconCalendarComponent, FoehnIconCheckComponent, FoehnIconCheckSquareOComponent, FoehnIconChevronDownComponent, FoehnIconChevronLeftComponent, FoehnIconChevronRightComponent, FoehnIconChevronUpComponent, FoehnIconClockComponent, FoehnIconCommentDotsComponent, FoehnIconEditComponent, FoehnIconExternalLinkAltComponent, FoehnIconFilePdfComponent, FoehnIconInfoCircleComponent, FoehnIconLockComponent, FoehnIconMapMarkerComponent, FoehnIconMinusCircleComponent, FoehnIconPlusCircleComponent, FoehnIconPlusSquareComponent, FoehnIconSearchComponent, FoehnIconTimesComponent, FoehnIconTrashAltComponent, FoehnIconUnlockAltComponent, FoehnIconsModule, FoehnInputAddressComponent, FoehnInputComponent, FoehnInputEmailComponent, FoehnInputForeignLocalityComponent, FoehnInputForeignStreetComponent, FoehnInputHiddenComponent, FoehnInputModule, FoehnInputNav13Component, FoehnInputNav13Module, FoehnInputNumberComponent, FoehnInputPasswordComponent, FoehnInputPhoneComponent, FoehnInputStringComponent, FoehnInputTextComponent, FoehnInputTextareaComponent, FoehnListComponent, FoehnListItem, FoehnListModule, FoehnListSummaryComponent, FoehnMenuItemComponent, FoehnMenuItemTransmitComponent, FoehnMenuPrestationModule, FoehnMiscModule, FoehnModalComponent, FoehnModalModule, FoehnMultiUploadComponent, FoehnMultiUploadModule, FoehnMultiselectAutocompleteComponent, FoehnMultiselectAutocompleteModule, FoehnNavigationComponent, FoehnNavigationModule, FoehnNavigationService, FoehnNotFoundModule, FoehnNotfoundComponent, FoehnPageComponent, FoehnPageCounterComponent, FoehnPageModalComponent, FoehnPageModule, FoehnPageService, FoehnPictureUploadComponent, FoehnPictureUploadModule, FoehnRadioComponent, FoehnRecapSectionComponent, FoehnRecapSectionModule, FoehnRemainingAlertsSummaryComponent, FoehnRemainingAlertsSummaryModule, FoehnSelectComponent, FoehnSkipLinkComponent, FoehnStatusProgressBarComponent, FoehnStatusProgressBarModule, FoehnTableColumnConfiguration, FoehnTableComponent, FoehnTableModule, FoehnTablePageChangeEvent, FoehnTimeComponent, FoehnUserConnectedAsComponent, FoehnUserConnectedAsModule, FoehnValidationAlertSummaryComponent, FoehnValidationAlertSummaryModule, FoehnValidationAlertsComponent, FoehnValidationAlertsModule, FooterLink, FormMetadata, FormPostResponse, FormSelectOption, FormatIdePipe, FormatterModule, GESDEM_MAX_DATA_LENGTH, GesdemActionRecoveryLoginComponent, GesdemActionRecoveryModule, GesdemActionRecoveryRegistrationComponent, GesdemConfirmationComponent, GesdemConfirmationModule, GesdemErrorComponent, GesdemErrorModule, GesdemEventService, GesdemHandlerService, GesdemLoaderGuard, GesdemStatutUtils, GrowlBrokerService, GrowlMessage, GrowlType, I18nForm, IbanFormatterDirective, IdeFormatterDirective, Locality, MonthYear, MultiUploadService, Municipality, NDCFormatterDirective, NavigationDirection, NumberCurrencyFormatterDirective, ObjectHelper, PORTAIL_BASE_URL_INT, PageChangeEvent, PaginationWeek, PendingFiles, PendingUploadService, PipeModule, PlaceOfOrigin, Portail, PostalLocality, Preferences, PrestationsNgCoreModule, RECAPTCHA_API_URL, RecaptchaService, RedirectComponent, SESSION_INFO_API_URL, SWISS_ISO_ID, SdkDictionaryModule, SdkDictionaryPipe, SdkDictionaryService, SdkEpaymentComponent, SdkEpaymentModule, SdkRecaptchaComponent, SdkRecaptchaModule, SdkRedirectModule, SdkStatisticsService, SelectedSlot, ServiceLocator, SessionInfo, SessionInfoData, SessionInfoWithApplicationService, Street, StreetNumber, THOUSANDS_SEPARATOR, TableSort, UploaderHelper, ValidationHandlerService, formatDecimalCurrency, formatNonDecimalCurrency, formatNumberAsGiven, replaceAll };
+export { APP_INFO_API_URL, AbstractFoehnUploaderComponent, AbstractListDetailPageComponent, AbstractMenuPageComponent, AbstractPageComponent, AbstractPageFromMenuComponent, ActionStatut, Address, AddressTypeLight, ApplicationInfo, ApplicationInfoService, BAD_PARAMS_HELP_TEXT, BoDocumentError, BoDocumentsWithErrors, BoMultiUploadService, Breadcrumb, BreadcrumbEventService, BreadcrumbItem, CAPTCHA_ERROR_NAME, CURRENCY_REGEXP, Calendar, Canton, Captcha, ComponentError, Configuration, Country, CurrencyHelper, CurrentWeek, DECIMALS_SEPARATOR, DEFAULT_INTERNATIONAL_AND_NO_SWISS, DEFAULT_INTERNATIONAL_AND_NO_SWISS_MOBILE, DEFAULT_INTERNATIONAL_AND_NO_SWISS_PHONE, DEFAULT_INTERNATIONAL_HELP_TEXT, DEFAULT_SWISS_HELP_TEXT, DEFAULT_SWISS_MOBILE_PHONE_HELP_TEXT, DEFAULT_SWISS_PHONE_HELP_TEXT, DICTIONARY_BASE_URL, DateHelper, DatePickerHelper, DatePickerNavigationHelper, DayMonth, DaySlots, DisplayCurrencyPipe, DisplayDatePipe, DisplayLoginMessagesData, District, Document, DocumentError, DocumentReference, DocumentReferenceWithFile, DocumentsWithErrors, EPaymentService, EtapeInfo, FORM_SUPPORT_CYBER_TITLE_FALLBACK, FocusedDay, FoehnAbbrComponent, FoehnAddressModule, FoehnAgendaComponent, FoehnAgendaModule, FoehnAgendaNavigationComponent, FoehnAgendaTimeslotPanelComponent, FoehnAutocompleteComponent, FoehnAutocompleteModule, FoehnBoMultiUploadComponent, FoehnBoMultiUploadModule, FoehnBooleanCheckboxComponent, FoehnBooleanModule, FoehnBooleanRadioComponent, FoehnBreadcrumbComponent, FoehnBreadcrumbModule, FoehnCheckableGroupComponent, FoehnCheckablesModule, FoehnCheckboxComponent, FoehnConfirmModalComponent, FoehnConfirmModalContent, FoehnConfirmModalModule, FoehnConfirmModalService, FoehnDateComponent, FoehnDatePickerButtonComponent, FoehnDatePickerButtonModule, FoehnDatePickerComponent, FoehnDatePickerModule, FoehnDecisionElectroniqueComponent, FoehnDecisionElectroniqueModule, FoehnDisplayAddressComponent, FoehnErrorPillComponent, FoehnFormComponent, FoehnFormModule, FoehnHeaderComponent, FoehnHeaderModule, FoehnHelpModalComponent, FoehnHelpModalModule, FoehnIconCalendarComponent, FoehnIconCheckComponent, FoehnIconCheckSquareOComponent, FoehnIconChevronDownComponent, FoehnIconChevronLeftComponent, FoehnIconChevronRightComponent, FoehnIconChevronUpComponent, FoehnIconClockComponent, FoehnIconCommentDotsComponent, FoehnIconEditComponent, FoehnIconExternalLinkAltComponent, FoehnIconFilePdfComponent, FoehnIconInfoCircleComponent, FoehnIconLockComponent, FoehnIconMapMarkerComponent, FoehnIconMinusCircleComponent, FoehnIconPlusCircleComponent, FoehnIconPlusSquareComponent, FoehnIconSearchComponent, FoehnIconTimesComponent, FoehnIconTrashAltComponent, FoehnIconUnlockAltComponent, FoehnIconsModule, FoehnInputAddressComponent, FoehnInputComponent, FoehnInputEmailComponent, FoehnInputForeignLocalityComponent, FoehnInputForeignStreetComponent, FoehnInputHiddenComponent, FoehnInputModule, FoehnInputNav13Component, FoehnInputNav13Module, FoehnInputNumberComponent, FoehnInputPasswordComponent, FoehnInputPhoneComponent, FoehnInputStringComponent, FoehnInputTextComponent, FoehnInputTextareaComponent, FoehnListComponent, FoehnListItem, FoehnListModule, FoehnListSummaryComponent, FoehnMenuItemComponent, FoehnMenuItemTransmitComponent, FoehnMenuPrestationModule, FoehnMiscModule, FoehnModalComponent, FoehnModalModule, FoehnMultiUploadComponent, FoehnMultiUploadModule, FoehnMultiselectAutocompleteComponent, FoehnMultiselectAutocompleteModule, FoehnNavigationComponent, FoehnNavigationModule, FoehnNavigationService, FoehnNotFoundModule, FoehnNotfoundComponent, FoehnPageComponent, FoehnPageCounterComponent, FoehnPageModalComponent, FoehnPageModule, FoehnPageService, FoehnPictureUploadComponent, FoehnPictureUploadModule, FoehnRadioComponent, FoehnRecapSectionComponent, FoehnRecapSectionModule, FoehnRemainingAlertsSummaryComponent, FoehnRemainingAlertsSummaryModule, FoehnSelectComponent, FoehnSkipLinkComponent, FoehnStatusProgressBarComponent, FoehnStatusProgressBarModule, FoehnTableColumnConfiguration, FoehnTableComponent, FoehnTableModule, FoehnTablePageChangeEvent, FoehnTimeComponent, FoehnUploadProgressBarComponent, FoehnUploadProgressBarModule, FoehnUserConnectedAsComponent, FoehnUserConnectedAsModule, FoehnValidationAlertSummaryComponent, FoehnValidationAlertSummaryModule, FoehnValidationAlertsComponent, FoehnValidationAlertsModule, FooterLink, FormMetadata, FormPostResponse, FormSelectOption, FormatIdePipe, FormatterModule, GESDEM_MAX_DATA_LENGTH, GesdemActionRecoveryLoginComponent, GesdemActionRecoveryModule, GesdemActionRecoveryRegistrationComponent, GesdemConfirmationComponent, GesdemConfirmationModule, GesdemErrorComponent, GesdemErrorModule, GesdemEventService, GesdemHandlerService, GesdemLoaderGuard, GesdemStatutUtils, GrowlBrokerService, GrowlMessage, GrowlType, HTTP_LOADER_FILTERED_URL, I18nForm, IbanFormatterDirective, IdeFormatterDirective, Locality, MonthYear, MultiUploadService, Municipality, NDCFormatterDirective, NavigationDirection, NumberCurrencyFormatterDirective, ObjectHelper, PORTAIL_BASE_URL_INT, PageChangeEvent, PaginationWeek, PendingFiles, PendingUploadService, PipeModule, PlaceOfOrigin, Portail, PostalLocality, Preferences, PrestationsNgCoreModule, RECAPTCHA_API_URL, RecaptchaService, RedirectComponent, SESSION_INFO_API_URL, SWISS_ISO_ID, SdkDictionaryModule, SdkDictionaryPipe, SdkDictionaryService, SdkEpaymentComponent, SdkEpaymentModule, SdkRecaptchaComponent, SdkRecaptchaModule, SdkRedirectModule, SdkStatisticsService, SelectedSlot, ServiceLocator, SessionInfo, SessionInfoData, SessionInfoWithApplicationService, Street, StreetNumber, THOUSANDS_SEPARATOR, TableSort, UploadProgress, UploadProgressService, UploaderHelper, ValidationHandlerService, formatDecimalCurrency, formatNonDecimalCurrency, formatNumberAsGiven, replaceAll };
 //# sourceMappingURL=dsivd-prestations-ng.mjs.map