@dsivd/prestations-ng 14.5.11 → 14.5.14-beta2

package/fesm2015/dsivd-prestations-ng.js

@@ -23,6 +23,8 @@ import { CdkVirtualScrollViewport, ScrollingModule } from '@angular/cdk/scrollin
 import localeFr from '@angular/common/locales/fr';
 import dayjs from 'dayjs';
 import isToday from 'dayjs/plugin/isToday';
+import * as i5 from 'ngx-image-cropper';
+import { ImageCropperModule } from 'ngx-image-cropper';
 import * as iban from 'iban';
 import localeData from 'dayjs/plugin/localeData';
 
@@ -1424,7 +1426,17 @@ const DEFAULT_DICTIONARY = {
         '(fichier au format pdf), vous devez demander la prestation en étant connecté au portail sécurisé.',
     'use-login.text': "Cette prestation est aussi utilisable au travers de l'espace sécurisé qui vous " +
         "permet de pré-remplir le formulaire et de suivre l'avancement de traitement de la demande.",
-    'use-login.button.text': 'Connectez-vous'
+    'use-login.button.text': 'Connectez-vous',
+    'foehn-picture-upload.choose-button-label': 'Choisissez une photo',
+    'foehn-picture-upload.loading-label': 'Chargement...',
+    'foehn-picture-upload.loading-failure-label': 'Impossible de charger la photo sélectionnée',
+    'foehn-picture-upload.validate-selection-label': 'Valider la sélection',
+    'foehn-picture-upload.cancel-selection-label': 'Annuler',
+    'foehn-picture-upload.selection-not-validated-label': 'Merci de valider votre sélection',
+    'foehn-picture-upload.delete-picture-label': 'Supprimer',
+    'foehn-table.totalElements': '{total} éléments trouvées',
+    'foehn-table.totalElements.1': '1 élément trouvée',
+    'foehn-table.totalElements.0': 'Aucun résultat'
 };
 
 const DICTIONARY_BASE_URL = 'api/dictionary';
@@ -4592,7 +4604,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImpor
 
 const GUIDE_URL = 'https://www.vd.ch/index.php?id=67827';
 const TERM_OF_USE_URL = 'https://www.vd.ch/index.php?id=2015321';
-const SECURITY_BEST_PRACTICE_URL = 'https://www.vd.ch/securite-protection-donnees/';
+const SECURITY_BEST_PRACTICE_URL = 'https://www.vd.ch/index.php?id=2015320';
 class FoehnFooterComponent {
     constructor(applicationInfoService, gesdemEventService, gesdemService) {
         /**
@@ -8588,6 +8600,181 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImpor
 class PageChangeEvent {
 }
 
+const hasInputChanged = (change) => !(!change ||
+    !change.currentValue ||
+    change.previousValue === change.currentValue);
+class FoehnTableComponent {
+    constructor() {
+        this.itemsPerPage = 10;
+        this.id = 'foehn-table';
+        this.previousLabel = 'Précédent';
+        this.nextLabel = 'Suivant';
+        this.pageChange = new EventEmitter();
+        this.sortChange = new EventEmitter();
+        this.currentPage = 1;
+        this.filteredList = [];
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        this.trackByFn = (index, item) => index;
+    }
+    set list(list) {
+        this._list = list;
+    }
+    ngOnChanges(changes) {
+        const itemsPerPageChange = changes.itemsPerPage;
+        const listChange = changes.list;
+        const fixedPageCountChange = changes.fixedPageCount;
+        if (!hasInputChanged(itemsPerPageChange) &&
+            !hasInputChanged(listChange) &&
+            !hasInputChanged(fixedPageCountChange)) {
+            return;
+        }
+        this.buildFilteredList();
+    }
+    previousPage() {
+        this.currentPage = this.currentPage - 1;
+        this.buildFilteredList();
+        this.pageChange.next({
+            previousPage: this.currentPage + 1,
+            currentPage: this.currentPage,
+            pageCount: this.pagesCount()
+        });
+    }
+    hasPreviousPage() {
+        return this.currentPage > 1;
+    }
+    nextPage() {
+        this.currentPage = this.currentPage + 1;
+        this.buildFilteredList();
+        this.pageChange.next({
+            previousPage: this.currentPage - 1,
+            currentPage: this.currentPage,
+            pageCount: this.pagesCount()
+        });
+    }
+    hasNextPage() {
+        return this.currentPage < this.pagesCount();
+    }
+    showPage(page, emitPageChangeEvent = false) {
+        if (this.currentPage === page) {
+            return;
+        }
+        const previousPage = this.currentPage;
+        this.currentPage = page;
+        this.buildFilteredList();
+        if (emitPageChangeEvent) {
+            this.pageChange.next({
+                previousPage,
+                currentPage: this.currentPage,
+                pageCount: this.pagesCount()
+            });
+        }
+    }
+    pagesCount() {
+        if (!!this.fixedPageCount) {
+            return this.fixedPageCount;
+        }
+        return this._list
+            ? Math.ceil(this._list.length / this.itemsPerPage)
+            : 0;
+    }
+    triggerSort(sortAttribute) {
+        let sortDirection = 'DESC';
+        if (this.sort.sortAttribute === sortAttribute) {
+            sortDirection = this.sort.sortDirection === 'DESC' ? 'ASC' : 'DESC';
+        }
+        this.sortChange.next({
+            sortDirection,
+            sortAttribute
+        });
+    }
+    buildFilteredList() {
+        if (!!this.fixedPageCount) {
+            this.filteredList = this._list;
+            return;
+        }
+        const currentPageExists = (this.currentPage - 1) * this.itemsPerPage <= this._list.length;
+        if (!currentPageExists) {
+            this.currentPage = 1;
+        }
+        const start = (this.currentPage - 1) * this.itemsPerPage;
+        this.filteredList = this._list
+            ? this._list.slice(start, start + this.itemsPerPage)
+            : [];
+    }
+}
+FoehnTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0, type: FoehnTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+FoehnTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: FoehnTableComponent, selector: "foehn-table", inputs: { itemsPerPage: "itemsPerPage", id: "id", previousLabel: "previousLabel", nextLabel: "nextLabel", totalElements: "totalElements", fixedPageCount: "fixedPageCount", columnsConfiguration: "columnsConfiguration", sort: "sort", trackByFn: "trackByFn", list: "list" }, outputs: { pageChange: "pageChange", sortChange: "sortChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"row\" [id]=\"id\">\n    <div class=\"col-12\">\n        <h2 *ngIf=\"!!totalElements && totalElements === 1\">\n            {{ 'foehn-table.totalElements.1' | fromDictionary }}\n        </h2>\n        <h2 *ngIf=\"!!totalElements && totalElements !== 1\">\n            {{\n                'foehn-table.totalElements'\n                    | fromDictionary: { total: totalElements.toString() }\n            }}\n        </h2>\n    </div>\n\n    <div class=\"col-12 table-responsive\">\n        <table class=\"table table-hover\">\n            <thead class=\"vd-bg-pattern-bars-gray\">\n                <tr>\n                    <th\n                        scope=\"col\"\n                        *ngFor=\"let col of columnsConfiguration\"\n                        [id]=\"col.id\"\n                    >\n                        <ng-container *ngIf=\"!col.sortAttribute\">\n                            <span\n                                [innerHTML]=\"\n                                    col.columnLabelKey | fromDictionary\n                                \"\n                            ></span>\n                        </ng-container>\n\n                        <ng-container *ngIf=\"!!col.sortAttribute\">\n                            <a\n                                href=\"#\"\n                                class=\"vd-text-thin\"\n                                (click)=\"\n                                    $event.preventDefault();\n                                    triggerSort(col.sortAttribute)\n                                \"\n                                [title]=\"\n                                    'Trier par ' +\n                                    (col.columnLabelKey | fromDictionary)\n                                \"\n                            >\n                                <span\n                                    [innerHTML]=\"\n                                        col.columnLabelKey | fromDictionary\n                                    \"\n                                ></span>\n                                <ng-container\n                                    *ngIf=\"\n                                        sort.sortAttribute === col.sortAttribute\n                                    \"\n                                >\n                                    <span\n                                        class=\"ml-3\"\n                                        *ngIf=\"sort.sortDirection === 'ASC'\"\n                                    >\n                                        <foehn-icon-chevron-up></foehn-icon-chevron-up>\n                                    </span>\n                                    <span\n                                        class=\"ml-3\"\n                                        *ngIf=\"sort.sortDirection === 'DESC'\"\n                                    >\n                                        <foehn-icon-chevron-down></foehn-icon-chevron-down>\n                                    </span>\n                                </ng-container>\n                            </a>\n                        </ng-container>\n                    </th>\n                </tr>\n            </thead>\n            <tbody>\n                <tr\n                    *ngFor=\"\n                        let item of filteredList;\n                        let index = index;\n                        trackBy: trackByFn\n                    \"\n                >\n                    <td\n                        *ngFor=\"let col of columnsConfiguration\"\n                        [id]=\"col.id + '-' + index\"\n                    >\n                        <ng-container *ngIf=\"!!col.isImportant\">\n                            <span\n                                *ngIf=\"col.isImportant(item)\"\n                                class=\"cell-vertical-align-middle\"\n                            >\n                                <svg\n                                    xmlns=\"http://www.w3.org/2000/svg\"\n                                    width=\"30\"\n                                    height=\"30\"\n                                    style=\"color: var(--red)\"\n                                    fill=\"currentColor\"\n                                    class=\"bi bi-exclamation\"\n                                    viewBox=\"0 0 16 16\"\n                                >\n                                    <path\n                                        d=\"M7.002 11a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 4.995a.905.905 0 1 1 1.8 0l-.35 3.507a.553.553 0 0 1-1.1 0L7.1 4.995z\"\n                                    />\n                                </svg>\n                            </span>\n                        </ng-container>\n\n                        <ng-container *ngIf=\"!col.routerLinkGetter\">\n                            <span\n                                [innerHTML]=\"col.valueGetter(item)\"\n                                class=\"cell-vertical-align-middle\"\n                            ></span>\n                        </ng-container>\n\n                        <ng-container *ngIf=\"!!col.routerLinkGetter\">\n                            <a\n                                [routerLink]=\"col.routerLinkGetter(item)\"\n                                queryParamsHandling=\"merge\"\n                                class=\"cell-vertical-align-middle\"\n                            >\n                                <span\n                                    [innerHTML]=\"col.valueGetter(item)\"\n                                ></span>\n                            </a>\n                        </ng-container>\n                    </td>\n                </tr>\n                <tr *ngIf=\"!filteredList.length\">\n                    <td [colSpan]=\"columnsConfiguration.length\">\n                        <div class=\"w-100 text-center\">\n                            {{ 'foehn-table.totalElements.0' | fromDictionary }}\n                        </div>\n                    </td>\n                </tr>\n            </tbody>\n        </table>\n\n        <div class=\"row d-flex justify-content-between p-1\">\n            <div class=\"col-lg-3 col-md-3 col-sm-6 col-xs-6\">\n                <nav\n                    class=\"vd-pagination\"\n                    aria-label=\"Pagination\"\n                    *ngIf=\"hasPreviousPage()\"\n                >\n                    <ul class=\"vd-pagination__list\">\n                        <li\n                            class=\"vd-pagination__item vd-pagination__item--previous\"\n                        >\n                            <button\n                                class=\"btn-link vd-pagination__link btn-no-extra vd-pagination__link-reset\"\n                                (click)=\"previousPage()\"\n                            >\n                                <span class=\"vd-pagination__title\">\n                                    <foehn-icon-chevron-left></foehn-icon-chevron-left>\n                                    {{ previousLabel }}\n                                </span>\n                                <span class=\"sr-only\">:</span>\n                                <span class=\"vd-pagination__label\">\n                                    {{ currentPage - 1 }} sur {{ pagesCount() }}\n                                </span>\n                            </button>\n                        </li>\n                    </ul>\n                </nav>\n            </div>\n\n            <div class=\"col-lg-3 col-md-3 col-sm-6 col-xs-6\">\n                <nav\n                    class=\"vd-pagination\"\n                    aria-label=\"Pagination\"\n                    *ngIf=\"hasNextPage()\"\n                >\n                    <ul class=\"vd-pagination__list\">\n                        <li\n                            class=\"vd-pagination__item vd-pagination__item--next\"\n                        >\n                            <button\n                                class=\"btn-link vd-pagination__link btn-no-extra vd-pagination__link-reset\"\n                                (click)=\"nextPage()\"\n                            >\n                                <span class=\"vd-pagination__title\">\n                                    {{ nextLabel }}\n                                    <foehn-icon-chevron-right></foehn-icon-chevron-right>\n                                </span>\n                                <span class=\"sr-only\">:</span>\n                                <span class=\"vd-pagination__label\">\n                                    {{ currentPage + 1 }} sur {{ pagesCount() }}\n                                </span>\n                            </button>\n                        </li>\n                    </ul>\n                </nav>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [".btn-no-extra{padding:0;border:none;font-weight:400;-webkit-text-decoration-line:none;text-decoration-line:none}.vd-pagination__link-reset{background:none;border:none;font-weight:inherit;-webkit-text-decoration-line:none;text-decoration-line:none;text-align:inherit;cursor:pointer}.vd-pagination__link-reset:focus{background-color:#ffbf47}.cell-vertical-align-middle{vertical-align:middle}\n"], components: [{ type: FoehnIconChevronUpComponent, selector: "foehn-icon-chevron-up" }, { type: FoehnIconChevronDownComponent, selector: "foehn-icon-chevron-down" }, { type: FoehnIconChevronLeftComponent, selector: "foehn-icon-chevron-left" }, { type: FoehnIconChevronRightComponent, selector: "foehn-icon-chevron-right" }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }], pipes: { "fromDictionary": SdkDictionaryPipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0, type: FoehnTableComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'foehn-table',
+                    templateUrl: './foehn-table.component.html',
+                    styleUrls: ['./foehn-table.component.css']
+                }]
+        }], propDecorators: { itemsPerPage: [{
+                type: Input
+            }], id: [{
+                type: Input
+            }], previousLabel: [{
+                type: Input
+            }], nextLabel: [{
+                type: Input
+            }], totalElements: [{
+                type: Input
+            }], fixedPageCount: [{
+                type: Input
+            }], columnsConfiguration: [{
+                type: Input
+            }], pageChange: [{
+                type: Output
+            }], sort: [{
+                type: Input
+            }], sortChange: [{
+                type: Output
+            }], 
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        trackByFn: [{
+                type: Input
+            }], list: [{
+                type: Input
+            }] } });
+
+class FoehnTableModule {
+}
+FoehnTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0, type: FoehnTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+FoehnTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0, type: FoehnTableModule, declarations: [FoehnTableComponent], imports: [CommonModule,
+        FoehnIconsModule,
+        SdkDictionaryModule,
+        RouterModule], exports: [FoehnTableComponent] });
+FoehnTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0, type: FoehnTableModule, imports: [[
+            CommonModule,
+            FoehnIconsModule,
+            SdkDictionaryModule,
+            RouterModule
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0, type: FoehnTableModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        FoehnIconsModule,
+                        SdkDictionaryModule,
+                        RouterModule
+                    ],
+                    declarations: [FoehnTableComponent],
+                    exports: [FoehnTableComponent]
+                }]
+        }] });
+
+class FoehnTableColumnConfiguration {
+}
+
+class FoehnTablePageChangeEvent {
+}
+
+class TableSort {
+}
+
 class RedirectComponent {
     constructor(iamInterceptor) {
         this.iamInterceptor = iamInterceptor;
@@ -9738,6 +9925,191 @@ class BoDocumentError {
 class BoDocumentsWithErrors {
 }
 
+const blobToFile = (blobData, fileName) => {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const blob = blobData;
+    blob.name = fileName;
+    return blob;
+};
+const convertBase64UrlToFile = (croppedImageasBase64Url, filename) => {
+    const arr = croppedImageasBase64Url.split(',');
+    const mime = arr[0].match(/:(.*?);/)[1];
+    const bstr = atob(arr[1]);
+    let n = bstr.length;
+    const u8arr = new Uint8Array(n);
+    while (n--) {
+        u8arr[n] = bstr.charCodeAt(n);
+    }
+    if (!navigator.msSaveBlob) {
+        // detect if not Edge
+        return new File([u8arr], filename, { type: mime });
+    }
+    else {
+        // Edge support the FileAPI but not the File constructor.
+        return blobToFile(new Blob([u8arr], { type: mime }), filename);
+    }
+};
+class FoehnPictureUploadComponent extends FoehnInputComponent {
+    constructor(growlService, uploadService, dictionaryService) {
+        super();
+        this.growlService = growlService;
+        this.uploadService = uploadService;
+        this.dictionaryService = dictionaryService;
+        this.baseUrl = 'api/document';
+        this.croppedPictureFilename = 'photo.png';
+        this.resizeToWidth = 300;
+        this.resizeToHeight = 0;
+        this.loading = false;
+    }
+    ngOnInit() {
+        super.ngOnInit();
+        this.currentLanguageSubscription = this.dictionaryService
+            .getCurrentLanguageCode()
+            .pipe(distinctUntilChanged())
+            .subscribe(language => {
+            this.currentLanguage = language;
+        });
+    }
+    onPictureSelection(imgEvent) {
+        this.refreshErrors([[], true]);
+        this.pictureToCrop = imgEvent;
+        this.loading = true;
+    }
+    onPictureSelectionFailed() {
+        const errors = [
+            {
+                name: this.name,
+                code: 'LoadingFailure',
+                message: this.dictionaryService.getKeySync('foehn-picture-upload.loading-failure-label')
+            }
+        ];
+        this.refreshErrors([errors, true]);
+        this.resetPictureSelection();
+    }
+    onImageCropped(croppedEvent) {
+        this.croppedPictureAsBase64Url = croppedEvent.base64;
+    }
+    resetPictureSelection() {
+        this.croppedPictureAsBase64Url = null;
+        this.pictureToCrop = null;
+        this.loading = false;
+    }
+    savePicture() {
+        this.markAsPristine();
+        const photo = convertBase64UrlToFile(this.croppedPictureAsBase64Url, this.croppedPictureFilename);
+        this.uploadService
+            .uploadDocuments(this.baseUrl, this.name, this.label, [photo], this.key, false, this.currentLanguage)
+            .pipe(filter(result => !!result))
+            .subscribe(({ documents, errors }) => {
+            this.resetPictureSelection();
+            if (!!documents.length) {
+                this.markAsDirty();
+                this.model = documents;
+                this.refreshErrors([[], true]);
+            }
+            else {
+                this.model = [];
+                this.refreshErrors([errors, true]);
+            }
+        });
+    }
+    deleteFile() {
+        this.uploadService
+            .deleteDocument(this.baseUrl, this.model[0])
+            .subscribe(() => {
+            this.model = [];
+            this.resetPictureSelection();
+        });
+    }
+    getDownloadUrl() {
+        return this.uploadService.getDownloadUrl(this.baseUrl, this.model[0]);
+    }
+    get hasPicture() {
+        return this.model && this.model.length && !!this.model[0].reference;
+    }
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    refreshErrors(results) {
+        const errors = results[0];
+        const isInSelectionMode = !this.hasPicture && !!this.croppedPictureAsBase64Url;
+        if (isInSelectionMode) {
+            const notNullError = errors.find(e => e.name === this.name && e.code === 'NotEmpty');
+            if (notNullError) {
+                notNullError.message = this.dictionaryService.getKeySync('foehn-picture-upload.selection-not-validated-label');
+            }
+        }
+        super.refreshErrors(results);
+    }
+}
+FoehnPictureUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0, type: FoehnPictureUploadComponent, deps: [{ token: GrowlBrokerService }, { token: MultiUploadService }, { token: SdkDictionaryService }], target: i0.ɵɵFactoryTarget.Component });
+FoehnPictureUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: FoehnPictureUploadComponent, selector: "foehn-picture-upload", inputs: { name: "name", key: "key", label: "label", baseUrl: "baseUrl", croppedPictureFilename: "croppedPictureFilename", resizeToWidth: "resizeToWidth", resizeToHeight: "resizeToHeight" }, providers: [
+        {
+            provide: FoehnInputComponent,
+            useExisting: forwardRef(() => FoehnPictureUploadComponent),
+            multi: true
+        }
+    ], usesInheritance: true, ngImport: i0, template: "<div\n    [attr.id]=\"buildId('Container')\"\n    [class.has-danger]=\"hasErrors()\"\n    [class.vd-form-group-danger]=\"hasErrors()\"\n    class=\"form-group clearable-input-form-group\"\n    tabindex=\"-1\"\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 [component]=\"this\"></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    <input type=\"hidden\" [name]=\"name || label\" [ngModel]=\"model\" />\n\n    <ng-content></ng-content>\n\n    <div *ngIf=\"hasPicture\" class=\"row\">\n        <div class=\"col-md-6\">\n            <img\n                [id]=\"buildChildId('Picture')\"\n                [attr.alt]=\"label\"\n                [src]=\"getDownloadUrl()\"\n            />\n        </div>\n        <div class=\"col-md-4\">\n            <button\n                type=\"button\"\n                class=\"btn btn-danger w-100\"\n                [attr.id]=\"buildChildId('DeleteButton')\"\n                (click)=\"deleteFile()\"\n            >\n                {{\n                    'foehn-picture-upload.delete-picture-label' | fromDictionary\n                }}\n            </button>\n        </div>\n    </div>\n\n    <div *ngIf=\"!hasPicture && !croppedPictureAsBase64Url\">\n        <input\n            #inputFile\n            type=\"file\"\n            class=\"form-control-file d-none\"\n            [attr.id]=\"name\"\n            [attr.accept]=\"'.jpeg,.jpg,.png'\"\n            [multiple]=\"false\"\n            [name]=\"name\"\n            (change)=\"onPictureSelection($event)\"\n        />\n\n        <button\n            type=\"button\"\n            class=\"btn btn-primary my-2\"\n            [attr.id]=\"buildChildId('ChooseButton')\"\n            [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n            [attr.aria-describedby]=\"buildId('ErrorsContainer')\"\n            (click)=\"inputFile.click()\"\n            [disabled]=\"loading\"\n        >\n            {{ 'foehn-picture-upload.choose-button-label' | fromDictionary }}\n        </button>\n    </div>\n\n    <div *ngIf=\"loading\">\n        {{ 'foehn-picture-upload.loading-label' | fromDictionary }}\n    </div>\n\n    <div *ngIf=\"!hasPicture\" class=\"row\">\n        <div class=\"col-md-6\">\n            <image-cropper\n                [id]=\"buildChildId('Cropper')\"\n                (cropperReady)=\"loading = false\"\n                (imageCropped)=\"onImageCropped($event)\"\n                (loadImageFailed)=\"onPictureSelectionFailed()\"\n                [aspectRatio]=\"3 / 4\"\n                [imageChangedEvent]=\"pictureToCrop\"\n                [maintainAspectRatio]=\"true\"\n                [resizeToWidth]=\"resizeToWidth\"\n                [resizeToHeight]=\"resizeToHeight\"\n                [onlyScaleDown]=\"true\"\n                format=\"png\"\n            ></image-cropper>\n        </div>\n\n        <div *ngIf=\"!hasPicture\" class=\"col-md-4\">\n            <div class=\"row mb-3\">\n                <button\n                    *ngIf=\"croppedPictureAsBase64Url\"\n                    type=\"button\"\n                    class=\"btn btn-primary w-100\"\n                    [attr.id]=\"buildChildId('SaveButton')\"\n                    (click)=\"savePicture()\"\n                >\n                    {{\n                        'foehn-picture-upload.validate-selection-label'\n                            | fromDictionary\n                    }}\n                </button>\n            </div>\n            <div class=\"row\">\n                <button\n                    *ngIf=\"croppedPictureAsBase64Url\"\n                    type=\"button\"\n                    class=\"btn btn-secondary w-100\"\n                    [attr.id]=\"buildChildId('CancelButton')\"\n                    (click)=\"resetPictureSelection()\"\n                >\n                    {{\n                        'foehn-picture-upload.cancel-selection-label'\n                            | fromDictionary\n                    }}\n                </button>\n            </div>\n        </div>\n    </div>\n</div>\n", components: [{ type: FoehnValidationAlertsComponent, selector: "foehn-validation-alerts", inputs: ["component", "shouldErrorsBeLive"] }, { type: i5.ImageCropperComponent, selector: "image-cropper", inputs: ["format", "transform", "maintainAspectRatio", "aspectRatio", "resizeToWidth", "resizeToHeight", "cropperMinWidth", "cropperMinHeight", "cropperMaxHeight", "cropperMaxWidth", "cropperStaticWidth", "cropperStaticHeight", "canvasRotation", "initialStepSize", "roundCropper", "onlyScaleDown", "imageQuality", "autoCrop", "backgroundColor", "containWithinAspectRatio", "hideResizeSquares", "cropper", "alignImage", "disabled", "imageChangedEvent", "imageURL", "imageBase64", "imageFile"], outputs: ["imageCropped", "startCropImage", "imageLoaded", "cropperReady", "loadImageFailed"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "fromDictionary": SdkDictionaryPipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0, type: FoehnPictureUploadComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'foehn-picture-upload',
+                    templateUrl: './foehn-picture-upload.component.html',
+                    providers: [
+                        {
+                            provide: FoehnInputComponent,
+                            useExisting: forwardRef(() => FoehnPictureUploadComponent),
+                            multi: true
+                        }
+                    ]
+                }]
+        }], ctorParameters: function () { return [{ type: GrowlBrokerService }, { type: MultiUploadService }, { type: SdkDictionaryService }]; }, propDecorators: { name: [{
+                type: Input
+            }], key: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], baseUrl: [{
+                type: Input
+            }], croppedPictureFilename: [{
+                type: Input
+            }], resizeToWidth: [{
+                type: Input
+            }], resizeToHeight: [{
+                type: Input
+            }] } });
+
+class FoehnPictureUploadModule {
+}
+FoehnPictureUploadModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0, type: FoehnPictureUploadModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+FoehnPictureUploadModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0, type: FoehnPictureUploadModule, declarations: [FoehnPictureUploadComponent], imports: [CommonModule,
+        FoehnIconsModule,
+        FoehnValidationAlertsModule,
+        SdkDictionaryModule,
+        FormsModule,
+        ImageCropperModule], exports: [FoehnPictureUploadComponent] });
+FoehnPictureUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0, type: FoehnPictureUploadModule, imports: [[
+            CommonModule,
+            FoehnIconsModule,
+            FoehnValidationAlertsModule,
+            SdkDictionaryModule,
+            FormsModule,
+            ImageCropperModule
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0, type: FoehnPictureUploadModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        FoehnIconsModule,
+                        FoehnValidationAlertsModule,
+                        SdkDictionaryModule,
+                        FormsModule,
+                        ImageCropperModule
+                    ],
+                    declarations: [FoehnPictureUploadComponent],
+                    exports: [FoehnPictureUploadComponent]
+                }]
+        }] });
+
 class EPaymentRequest {
 }
 
@@ -11420,5 +11792,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { APP_INFO_API_URL, AbstractFoehnUploaderComponent, AbstractListDetailPageComponent, AbstractMenuPageComponent, AbstractPageComponent, AbstractPageFromMenuComponent, ActionStatut, Address, ApplicationInfo, ApplicationInfoService, BAD_PARAMS_HELP_TEXT, BackendResponse, BoDocumentError, BoDocumentsWithErrors, BoMultiUploadService, Breadcrumb, BreadcrumbEventService, BreadcrumbItem, CAPTCHA_ERROR_NAME, CURRENCY_REGEXP, Captcha, ComponentError, Configuration, Country, CurrencyHelper, 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, DisplayCurrencyPipe, DisplayDatePipe, DisplayLoginMessagesData, Document, DocumentError, DocumentReference, DocumentReferenceWithFile, DocumentsWithErrors, EPaymentService, EtapeInfo, FORM_SUPPORT_CYBER_TITLE_FALLBACK, FocusedDay, FoehnAbbrComponent, FoehnAddressModule, 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, FoehnNavigationComponent, FoehnNavigationModule, FoehnNavigationService, FoehnNotFoundModule, FoehnNotfoundComponent, FoehnPageComponent, FoehnPageCounterComponent, FoehnPageModalComponent, FoehnPageModule, FoehnPageService, FoehnRadioComponent, FoehnRecapSectionComponent, FoehnRecapSectionModule, FoehnRemainingAlertsSummaryComponent, FoehnRemainingAlertsSummaryModule, FoehnSelectComponent, FoehnSkipLinkComponent, FoehnTimeComponent, FoehnUserConnectedAsComponent, FoehnUserConnectedAsModule, FoehnValidationAlertSummaryComponent, FoehnValidationAlertSummaryModule, FoehnValidationAlertsComponent, FoehnValidationAlertsModule, FooterLink, FormSelectOption, FormatIdePipe, FormatterModule, GESDEM_MAX_DATA_LENGTH, GesdemActionRecoveryLoginComponent, GesdemActionRecoveryModule, GesdemActionRecoveryRegistrationComponent, GesdemConfirmationComponent, GesdemConfirmationModule, GesdemErrorComponent, GesdemErrorModule, GesdemEventService, GesdemHandlerService, GesdemLoaderGuard, GesdemMeta, GesdemStatutUtils, GrowlBrokerService, GrowlMessage, GrowlType, I18nForm, IbanFormatterDirective, IdeFormatterDirective, Locality, MonthYear, MultiUploadService, NDCFormatterDirective, NavigationDirection, NumberCurrencyFormatterDirective, ObjectHelper, PORTAIL_BASE_URL_INT, PageChangeEvent, PendingFiles, PendingUploadService, PipeModule, Portail, Preferences, PrestationsNgCoreModule, RECAPTCHA_API_URL, RecaptchaService, RedirectComponent, SESSION_INFO_API_URL, SWISS_ISO_ID, SdkDictionaryModule, SdkDictionaryPipe, SdkDictionaryService, SdkEpaymentComponent, SdkEpaymentModule, SdkRecaptchaComponent, SdkRecaptchaModule, SdkRedirectModule, ServiceLocator, SessionInfo, SessionInfoData, SessionInfoWithApplicationService, Street, StreetNumber, THOUSANDS_SEPARATOR, UploaderHelper, ValidationHandlerService };
+export { APP_INFO_API_URL, AbstractFoehnUploaderComponent, AbstractListDetailPageComponent, AbstractMenuPageComponent, AbstractPageComponent, AbstractPageFromMenuComponent, ActionStatut, Address, ApplicationInfo, ApplicationInfoService, BAD_PARAMS_HELP_TEXT, BackendResponse, BoDocumentError, BoDocumentsWithErrors, BoMultiUploadService, Breadcrumb, BreadcrumbEventService, BreadcrumbItem, CAPTCHA_ERROR_NAME, CURRENCY_REGEXP, Captcha, ComponentError, Configuration, Country, CurrencyHelper, 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, DisplayCurrencyPipe, DisplayDatePipe, DisplayLoginMessagesData, Document, DocumentError, DocumentReference, DocumentReferenceWithFile, DocumentsWithErrors, EPaymentService, EtapeInfo, FORM_SUPPORT_CYBER_TITLE_FALLBACK, FocusedDay, FoehnAbbrComponent, FoehnAddressModule, 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, FoehnNavigationComponent, FoehnNavigationModule, FoehnNavigationService, FoehnNotFoundModule, FoehnNotfoundComponent, FoehnPageComponent, FoehnPageCounterComponent, FoehnPageModalComponent, FoehnPageModule, FoehnPageService, FoehnPictureUploadComponent, FoehnPictureUploadModule, FoehnRadioComponent, FoehnRecapSectionComponent, FoehnRecapSectionModule, FoehnRemainingAlertsSummaryComponent, FoehnRemainingAlertsSummaryModule, FoehnSelectComponent, FoehnSkipLinkComponent, FoehnTableColumnConfiguration, FoehnTableComponent, FoehnTableModule, FoehnTablePageChangeEvent, FoehnTimeComponent, FoehnUserConnectedAsComponent, FoehnUserConnectedAsModule, FoehnValidationAlertSummaryComponent, FoehnValidationAlertSummaryModule, FoehnValidationAlertsComponent, FoehnValidationAlertsModule, FooterLink, FormSelectOption, FormatIdePipe, FormatterModule, GESDEM_MAX_DATA_LENGTH, GesdemActionRecoveryLoginComponent, GesdemActionRecoveryModule, GesdemActionRecoveryRegistrationComponent, GesdemConfirmationComponent, GesdemConfirmationModule, GesdemErrorComponent, GesdemErrorModule, GesdemEventService, GesdemHandlerService, GesdemLoaderGuard, GesdemMeta, GesdemStatutUtils, GrowlBrokerService, GrowlMessage, GrowlType, I18nForm, IbanFormatterDirective, IdeFormatterDirective, Locality, MonthYear, MultiUploadService, NDCFormatterDirective, NavigationDirection, NumberCurrencyFormatterDirective, ObjectHelper, PORTAIL_BASE_URL_INT, PageChangeEvent, PendingFiles, PendingUploadService, PipeModule, Portail, Preferences, PrestationsNgCoreModule, RECAPTCHA_API_URL, RecaptchaService, RedirectComponent, SESSION_INFO_API_URL, SWISS_ISO_ID, SdkDictionaryModule, SdkDictionaryPipe, SdkDictionaryService, SdkEpaymentComponent, SdkEpaymentModule, SdkRecaptchaComponent, SdkRecaptchaModule, SdkRedirectModule, ServiceLocator, SessionInfo, SessionInfoData, SessionInfoWithApplicationService, Street, StreetNumber, THOUSANDS_SEPARATOR, TableSort, UploaderHelper, ValidationHandlerService };
 //# sourceMappingURL=dsivd-prestations-ng.js.map