@dsivd/prestations-ng 16.4.8-beta.1 → 16.4.8-beta.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -4760,8 +4760,10 @@ class FoehnTableComponent {
4760
4760
  this.sortChange = new EventEmitter();
4761
4761
  this.currentPage = 1;
4762
4762
  this.filteredList = [];
4763
+ this.trackByFn = (index,
4763
4764
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
4764
- this.trackByFn = (index, item) => index;
4765
+ item) => index;
4766
+ this.trackFoehnTableColumnConfiguration = (index, item) => item.id || item.columnLabelKey || index;
4765
4767
  }
4766
4768
  set list(list) {
4767
4769
  this._list = list;
@@ -4854,10 +4856,10 @@ class FoehnTableComponent {
4854
4856
  }
4855
4857
  }
4856
4858
  FoehnTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FoehnTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4857
- FoehnTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: FoehnTableComponent, selector: "foehn-table", inputs: { itemsPerPage: "itemsPerPage", id: "id", previousLabel: "previousLabel", nextLabel: "nextLabel", totalElements: "totalElements", fixedPageCount: "fixedPageCount", columnsConfiguration: "columnsConfiguration", sort: "sort", list: "list", trackByFn: "trackByFn" }, outputs: { pageChange: "pageChange", sortChange: "sortChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"row\" [id]=\"id\">\n <div class=\"col-12\">\n <h4 *ngIf=\"!!totalElements && totalElements === 1\">\n {{ 'foehn-table.totalElements.1' | fromDictionary }}\n </h4>\n <h4 *ngIf=\"!!totalElements && totalElements !== 1\">\n {{\n 'foehn-table.totalElements'\n | fromDictionary: { total: totalElements.toString() }\n }}\n </h4>\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\n *ngIf=\"!filteredList.length || !col.sortAttribute\"\n >\n <span\n [innerHTML]=\"\n col.columnLabelKey | fromDictionary\n \"\n ></span>\n </ng-container>\n\n <ng-container\n *ngIf=\"!!filteredList.length && !!col.sortAttribute\"\n >\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.iconGetter\">\n <span\n *ngIf=\"col.iconGetter(item) as iconDef\"\n class=\"cell-vertical-align-middle mr-2\"\n >\n <fa-icon\n aria-hidden=\"true\"\n [icon]=\"iconDef.icon\"\n [title]=\"iconDef.label\"\n ></fa-icon>\n <span class=\"sr-only\">{{ iconDef.label }}</span>\n </span>\n </ng-container>\n\n <ng-container *ngIf=\"!!col.template\">\n <ng-template\n [ngTemplateOutlet]=\"col.template\"\n [ngTemplateOutletContext]=\"{\n item: item,\n index: index\n }\"\n ></ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"!col.template\">\n <span\n [innerHTML]=\"col.valueGetter(item)\"\n class=\"cell-vertical-align-middle\"\n ></span>\n </ng-container>\n </td>\n </tr>\n <tr *ngIf=\"!!columnsConfiguration && !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;text-decoration-line:none}.vd-pagination__link-reset{background:none;border:none;font-weight:inherit;text-decoration-line:none;text-align:inherit;cursor:pointer}.vd-pagination__link-reset:focus{background-color:var(--vd-focus)}.cell-vertical-align-middle{vertical-align:middle}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: FoehnIconChevronDownComponent, selector: "foehn-icon-chevron-down" }, { kind: "component", type: FoehnIconChevronUpComponent, selector: "foehn-icon-chevron-up" }, { kind: "component", type: i1$2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "component", type: FoehnIconChevronLeftComponent, selector: "foehn-icon-chevron-left" }, { kind: "component", type: FoehnIconChevronRightComponent, selector: "foehn-icon-chevron-right" }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] });
4859
+ FoehnTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: FoehnTableComponent, selector: "foehn-table", inputs: { itemsPerPage: "itemsPerPage", id: "id", previousLabel: "previousLabel", nextLabel: "nextLabel", totalElements: "totalElements", fixedPageCount: "fixedPageCount", columnsConfiguration: "columnsConfiguration", sort: "sort", list: "list", trackByFn: "trackByFn" }, outputs: { pageChange: "pageChange", sortChange: "sortChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"row\" [id]=\"id\">\n <div class=\"col-12\">\n <h4 *ngIf=\"!!totalElements && totalElements === 1\">\n {{ 'foehn-table.totalElements.1' | fromDictionary }}\n </h4>\n <h4 *ngIf=\"!!totalElements && totalElements !== 1\">\n {{\n 'foehn-table.totalElements'\n | fromDictionary: { total: totalElements.toString() }\n }}\n </h4>\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\n *ngIf=\"!filteredList.length || !col.sortAttribute\"\n >\n <span\n [innerHTML]=\"\n col.columnLabelKey | fromDictionary\n \"\n ></span>\n </ng-container>\n\n <ng-container\n *ngIf=\"!!filteredList.length && !!col.sortAttribute\"\n >\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=\"\n let col of columnsConfiguration;\n trackBy: trackFoehnTableColumnConfiguration\n \"\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.iconGetter\">\n <span\n *ngIf=\"col.iconGetter(item) as iconDef\"\n class=\"cell-vertical-align-middle mr-2\"\n >\n <fa-icon\n aria-hidden=\"true\"\n [icon]=\"iconDef.icon\"\n [title]=\"iconDef.label\"\n ></fa-icon>\n <span class=\"sr-only\">{{ iconDef.label }}</span>\n </span>\n </ng-container>\n\n <ng-container *ngIf=\"!!col.template\">\n <ng-template\n [ngTemplateOutlet]=\"col.template\"\n [ngTemplateOutletContext]=\"{\n item: item,\n index: index\n }\"\n ></ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"!col.template\">\n <span\n [innerHTML]=\"col.valueGetter(item)\"\n class=\"cell-vertical-align-middle\"\n ></span>\n </ng-container>\n </td>\n </tr>\n <tr *ngIf=\"!!columnsConfiguration && !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;text-decoration-line:none}.vd-pagination__link-reset{background:none;border:none;font-weight:inherit;text-decoration-line:none;text-align:inherit;cursor:pointer}.vd-pagination__link-reset:focus{background-color:var(--vd-focus)}.cell-vertical-align-middle{vertical-align:middle}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: FoehnIconChevronDownComponent, selector: "foehn-icon-chevron-down" }, { kind: "component", type: FoehnIconChevronUpComponent, selector: "foehn-icon-chevron-up" }, { kind: "component", type: i1$2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "component", type: FoehnIconChevronLeftComponent, selector: "foehn-icon-chevron-left" }, { kind: "component", type: FoehnIconChevronRightComponent, selector: "foehn-icon-chevron-right" }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] });
4858
4860
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FoehnTableComponent, decorators: [{
4859
4861
  type: Component,
4860
- args: [{ selector: 'foehn-table', template: "<div class=\"row\" [id]=\"id\">\n <div class=\"col-12\">\n <h4 *ngIf=\"!!totalElements && totalElements === 1\">\n {{ 'foehn-table.totalElements.1' | fromDictionary }}\n </h4>\n <h4 *ngIf=\"!!totalElements && totalElements !== 1\">\n {{\n 'foehn-table.totalElements'\n | fromDictionary: { total: totalElements.toString() }\n }}\n </h4>\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\n *ngIf=\"!filteredList.length || !col.sortAttribute\"\n >\n <span\n [innerHTML]=\"\n col.columnLabelKey | fromDictionary\n \"\n ></span>\n </ng-container>\n\n <ng-container\n *ngIf=\"!!filteredList.length && !!col.sortAttribute\"\n >\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.iconGetter\">\n <span\n *ngIf=\"col.iconGetter(item) as iconDef\"\n class=\"cell-vertical-align-middle mr-2\"\n >\n <fa-icon\n aria-hidden=\"true\"\n [icon]=\"iconDef.icon\"\n [title]=\"iconDef.label\"\n ></fa-icon>\n <span class=\"sr-only\">{{ iconDef.label }}</span>\n </span>\n </ng-container>\n\n <ng-container *ngIf=\"!!col.template\">\n <ng-template\n [ngTemplateOutlet]=\"col.template\"\n [ngTemplateOutletContext]=\"{\n item: item,\n index: index\n }\"\n ></ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"!col.template\">\n <span\n [innerHTML]=\"col.valueGetter(item)\"\n class=\"cell-vertical-align-middle\"\n ></span>\n </ng-container>\n </td>\n </tr>\n <tr *ngIf=\"!!columnsConfiguration && !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;text-decoration-line:none}.vd-pagination__link-reset{background:none;border:none;font-weight:inherit;text-decoration-line:none;text-align:inherit;cursor:pointer}.vd-pagination__link-reset:focus{background-color:var(--vd-focus)}.cell-vertical-align-middle{vertical-align:middle}\n"] }]
4862
+ args: [{ selector: 'foehn-table', template: "<div class=\"row\" [id]=\"id\">\n <div class=\"col-12\">\n <h4 *ngIf=\"!!totalElements && totalElements === 1\">\n {{ 'foehn-table.totalElements.1' | fromDictionary }}\n </h4>\n <h4 *ngIf=\"!!totalElements && totalElements !== 1\">\n {{\n 'foehn-table.totalElements'\n | fromDictionary: { total: totalElements.toString() }\n }}\n </h4>\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\n *ngIf=\"!filteredList.length || !col.sortAttribute\"\n >\n <span\n [innerHTML]=\"\n col.columnLabelKey | fromDictionary\n \"\n ></span>\n </ng-container>\n\n <ng-container\n *ngIf=\"!!filteredList.length && !!col.sortAttribute\"\n >\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=\"\n let col of columnsConfiguration;\n trackBy: trackFoehnTableColumnConfiguration\n \"\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.iconGetter\">\n <span\n *ngIf=\"col.iconGetter(item) as iconDef\"\n class=\"cell-vertical-align-middle mr-2\"\n >\n <fa-icon\n aria-hidden=\"true\"\n [icon]=\"iconDef.icon\"\n [title]=\"iconDef.label\"\n ></fa-icon>\n <span class=\"sr-only\">{{ iconDef.label }}</span>\n </span>\n </ng-container>\n\n <ng-container *ngIf=\"!!col.template\">\n <ng-template\n [ngTemplateOutlet]=\"col.template\"\n [ngTemplateOutletContext]=\"{\n item: item,\n index: index\n }\"\n ></ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"!col.template\">\n <span\n [innerHTML]=\"col.valueGetter(item)\"\n class=\"cell-vertical-align-middle\"\n ></span>\n </ng-container>\n </td>\n </tr>\n <tr *ngIf=\"!!columnsConfiguration && !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;text-decoration-line:none}.vd-pagination__link-reset{background:none;border:none;font-weight:inherit;text-decoration-line:none;text-align:inherit;cursor:pointer}.vd-pagination__link-reset:focus{background-color:var(--vd-focus)}.cell-vertical-align-middle{vertical-align:middle}\n"] }]
4861
4863
  }], propDecorators: { itemsPerPage: [{
4862
4864
  type: Input
4863
4865
  }], id: [{
@@ -4882,9 +4884,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
4882
4884
  type: Output
4883
4885
  }], list: [{
4884
4886
  type: Input
4885
- }],
4886
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
4887
- trackByFn: [{
4887
+ }], trackByFn: [{
4888
4888
  type: Input
4889
4889
  }] } });
4890
4890
 
@@ -7142,6 +7142,8 @@ class FoehnAutocompleteComponent extends FoehnCheckableGroupComponent {
7142
7142
  this.SUGGESTION_SELECTED_CLASS = 'suggestion-selected';
7143
7143
  this.EXCLUDE_HTML_TAGS_REGEX = '((?=[^>]*<)|(?![^<]*>))';
7144
7144
  this.SUGGESTION_CUSTOM_ATTRIBUTE_LABEL_VALUE = 'label-value';
7145
+ // Inspired from https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions#escaping
7146
+ this.REGEX_TO_ESCAPE_REGEX = /[.*+?^${}()|[\]\\]/g;
7145
7147
  this.userSearchInputSubject = new Subject();
7146
7148
  this.filterSubcription = this.filterSubject
7147
7149
  .pipe(debounceTime(200))
@@ -7366,7 +7368,11 @@ class FoehnAutocompleteComponent extends FoehnCheckableGroupComponent {
7366
7368
  getLabelWithEmphasis(elem) {
7367
7369
  let label = this.getSuggestionLabel(elem);
7368
7370
  if (!this.isEmpty(this.searchValue)) {
7369
- const regexStr = `${normalizeSearch(this.searchValue, this.caseSensitiveSearch)}${this.EXCLUDE_HTML_TAGS_REGEX}`;
7371
+ const hasRegexpCharsToEscape = RegExp(this.REGEX_TO_ESCAPE_REGEX.source).test(this.searchValue);
7372
+ const regexSearchValue = hasRegexpCharsToEscape
7373
+ ? this.escapeRegexp(normalizeSearch(this.searchValue, this.caseSensitiveSearch))
7374
+ : normalizeSearch(this.searchValue, this.caseSensitiveSearch);
7375
+ const regexStr = `${regexSearchValue}${this.EXCLUDE_HTML_TAGS_REGEX}`;
7370
7376
  const startIndex = normalizeSearch(label, this.caseSensitiveSearch).search(regexStr);
7371
7377
  if (startIndex !== -1) {
7372
7378
  label = `${startIndex > 0 ? label.substring(0, startIndex) : ''}<b>${label.substring(startIndex, startIndex + this.searchValue.length)}</b>${label.length > startIndex + this.searchValue.length
@@ -7694,6 +7700,9 @@ class FoehnAutocompleteComponent extends FoehnCheckableGroupComponent {
7694
7700
  });
7695
7701
  });
7696
7702
  }
7703
+ escapeRegexp(value) {
7704
+ return value.replace(this.REGEX_TO_ESCAPE_REGEX, '\\$&');
7705
+ }
7697
7706
  }
7698
7707
  FoehnAutocompleteComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FoehnAutocompleteComponent, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
7699
7708
  FoehnAutocompleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: FoehnAutocompleteComponent, selector: "foehn-autocomplete", inputs: { searchValueMinCharsCount: "searchValueMinCharsCount", allowCustomValue: "allowCustomValue", isSuggestionListDynamic: "isSuggestionListDynamic", customValueModelGenerator: "customValueModelGenerator", itemHeightInSuggestionListInPx: "itemHeightInSuggestionListInPx", elementSuggestionLabel: "elementSuggestionLabel", caseSensitiveSearch: "caseSensitiveSearch", disabled: "disabled" }, outputs: { userSearchInput: "userSearchInput" }, providers: [
@@ -7857,7 +7866,7 @@ FoehnRadioComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
7857
7866
  useExisting: forwardRef(() => FoehnRadioComponent),
7858
7867
  multi: true
7859
7868
  }
7860
- ], usesInheritance: true, ngImport: i0, template: "<div\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n [attr.id]=\"buildId('Container')\"\n tabindex=\"-1\"\n>\n <fieldset class=\"form-group\" [attr.aria-describedby]=\"getDescribedBy()\">\n <div class=\"d-flex justify-content-between\">\n <legend\n *ngIf=\"!!label\"\n [ngClass]=\"isLabelSrOnly ? 'sr-only' : 'vd-p'\"\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 </legend>\n <foehn-help-modal\n class=\"removePaddingButton\"\n *ngIf=\"!!helpModal\"\n [modalContent]=\"helpModal\"\n ></foehn-help-modal>\n </div>\n\n <foehn-validation-alerts [component]=\"this\"></foehn-validation-alerts>\n\n <div *ngIf=\"!elements\">Chargement...</div>\n\n <small\n *ngIf=\"helpText\"\n [attr.id]=\"buildChildId() + 'Help'\"\n class=\"form-text text-secondary\"\n [innerHTML]=\"helpText\"\n ></small>\n\n <ng-content></ng-content>\n <div\n *ngFor=\"\n let elementsGroup of groupedElements;\n let groupIndex = index\n \"\n >\n <!-- TODO remove aria-hidden and make this accessible -->\n <div\n *ngIf=\"!!elementsGroup.groupTitle\"\n class=\"pt-2 font-weight-bold\"\n [attr.id]=\"'checkGroup_' + groupIndex\"\n aria-hidden=\"true\"\n >\n {{ elementsGroup.groupTitle | fromDictionary }}\n </div>\n <div\n *ngFor=\"let element of elementsGroup.elements; let i = index\"\n [class.disabled]=\"getDisabled(element)\"\n class=\"form-check\"\n >\n <input\n class=\"form-check-input\"\n type=\"radio\"\n [value]=\"getValueOrObject(element)\"\n [ngModel]=\"inputValue\"\n (ngModelChange)=\"onCheck(element, $event)\"\n [name]=\"buildChildName('' + groupIndex + '_' + i)\"\n [attr.name]=\"buildChildName('' + groupIndex + '_' + i)\"\n [attr.id]=\"buildChildId() + groupIndex + '_' + i\"\n [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n [attr.disabled]=\"getDisabled(element) ? 'disabled' : null\"\n [attr.autocomplete]=\"getAutoComplete()\"\n (change)=\"handleChange(getValue(element))\"\n />\n <label\n class=\"form-check-label\"\n [for]=\"buildChildId() + groupIndex + '_' + i\"\n [innerHTML]=\"getLabel(element)\"\n ></label>\n </div>\n </div>\n </fieldset>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FoehnValidationAlertsComponent, selector: "foehn-validation-alerts", inputs: ["component", "shouldErrorsBeLive"] }, { kind: "component", type: FoehnHelpModalComponent, selector: "foehn-help-modal", inputs: ["modalContent"] }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] });
7869
+ ], usesInheritance: true, ngImport: i0, template: "<div\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n [attr.id]=\"buildId('Container')\"\n tabindex=\"-1\"\n>\n <fieldset class=\"form-group\" [attr.aria-describedby]=\"getDescribedBy()\">\n <div class=\"d-flex justify-content-between\">\n <legend\n *ngIf=\"!!label\"\n [ngClass]=\"isLabelSrOnly ? 'sr-only' : 'vd-p'\"\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 </legend>\n <foehn-help-modal\n class=\"removePaddingButton\"\n *ngIf=\"!!helpModal\"\n [modalContent]=\"helpModal\"\n ></foehn-help-modal>\n </div>\n\n <foehn-validation-alerts [component]=\"this\"></foehn-validation-alerts>\n\n <div *ngIf=\"!elements\">Chargement...</div>\n\n <small\n *ngIf=\"helpText\"\n [attr.id]=\"buildChildId() + 'Help'\"\n class=\"form-text text-secondary\"\n [innerHTML]=\"helpText\"\n ></small>\n\n <ng-content></ng-content>\n <div\n *ngFor=\"\n let elementsGroup of groupedElements;\n let groupIndex = index\n \"\n >\n <!-- TODO remove aria-hidden and make this accessible -->\n <div\n *ngIf=\"!!elementsGroup.groupTitle\"\n class=\"pt-2 font-weight-bold\"\n [attr.id]=\"'checkGroup_' + groupIndex\"\n aria-hidden=\"true\"\n >\n {{ elementsGroup.groupTitle | fromDictionary }}\n </div>\n <div\n *ngFor=\"let element of elementsGroup.elements; let i = index\"\n [class.disabled]=\"getDisabled(element)\"\n class=\"form-check\"\n >\n <input\n class=\"form-check-input\"\n type=\"radio\"\n [value]=\"getValueOrObject(element)\"\n [ngModel]=\"inputValue\"\n (ngModelChange)=\"onCheck(element, $event)\"\n [name]=\"buildChildName()\"\n [attr.name]=\"buildChildName()\"\n [attr.id]=\"buildChildId() + groupIndex + '_' + i\"\n [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n [attr.disabled]=\"getDisabled(element) ? 'disabled' : null\"\n [attr.autocomplete]=\"getAutoComplete()\"\n (change)=\"handleChange(getValue(element))\"\n />\n <label\n class=\"form-check-label\"\n [for]=\"buildChildId() + groupIndex + '_' + i\"\n [innerHTML]=\"getLabel(element)\"\n ></label>\n </div>\n </div>\n </fieldset>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FoehnValidationAlertsComponent, selector: "foehn-validation-alerts", inputs: ["component", "shouldErrorsBeLive"] }, { kind: "component", type: FoehnHelpModalComponent, selector: "foehn-help-modal", inputs: ["modalContent"] }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] });
7861
7870
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FoehnRadioComponent, decorators: [{
7862
7871
  type: Component,
7863
7872
  args: [{ selector: 'foehn-radio', providers: [
@@ -7866,7 +7875,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
7866
7875
  useExisting: forwardRef(() => FoehnRadioComponent),
7867
7876
  multi: true
7868
7877
  }
7869
- ], template: "<div\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n [attr.id]=\"buildId('Container')\"\n tabindex=\"-1\"\n>\n <fieldset class=\"form-group\" [attr.aria-describedby]=\"getDescribedBy()\">\n <div class=\"d-flex justify-content-between\">\n <legend\n *ngIf=\"!!label\"\n [ngClass]=\"isLabelSrOnly ? 'sr-only' : 'vd-p'\"\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 </legend>\n <foehn-help-modal\n class=\"removePaddingButton\"\n *ngIf=\"!!helpModal\"\n [modalContent]=\"helpModal\"\n ></foehn-help-modal>\n </div>\n\n <foehn-validation-alerts [component]=\"this\"></foehn-validation-alerts>\n\n <div *ngIf=\"!elements\">Chargement...</div>\n\n <small\n *ngIf=\"helpText\"\n [attr.id]=\"buildChildId() + 'Help'\"\n class=\"form-text text-secondary\"\n [innerHTML]=\"helpText\"\n ></small>\n\n <ng-content></ng-content>\n <div\n *ngFor=\"\n let elementsGroup of groupedElements;\n let groupIndex = index\n \"\n >\n <!-- TODO remove aria-hidden and make this accessible -->\n <div\n *ngIf=\"!!elementsGroup.groupTitle\"\n class=\"pt-2 font-weight-bold\"\n [attr.id]=\"'checkGroup_' + groupIndex\"\n aria-hidden=\"true\"\n >\n {{ elementsGroup.groupTitle | fromDictionary }}\n </div>\n <div\n *ngFor=\"let element of elementsGroup.elements; let i = index\"\n [class.disabled]=\"getDisabled(element)\"\n class=\"form-check\"\n >\n <input\n class=\"form-check-input\"\n type=\"radio\"\n [value]=\"getValueOrObject(element)\"\n [ngModel]=\"inputValue\"\n (ngModelChange)=\"onCheck(element, $event)\"\n [name]=\"buildChildName('' + groupIndex + '_' + i)\"\n [attr.name]=\"buildChildName('' + groupIndex + '_' + i)\"\n [attr.id]=\"buildChildId() + groupIndex + '_' + i\"\n [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n [attr.disabled]=\"getDisabled(element) ? 'disabled' : null\"\n [attr.autocomplete]=\"getAutoComplete()\"\n (change)=\"handleChange(getValue(element))\"\n />\n <label\n class=\"form-check-label\"\n [for]=\"buildChildId() + groupIndex + '_' + i\"\n [innerHTML]=\"getLabel(element)\"\n ></label>\n </div>\n </div>\n </fieldset>\n</div>\n" }]
7878
+ ], template: "<div\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n [attr.id]=\"buildId('Container')\"\n tabindex=\"-1\"\n>\n <fieldset class=\"form-group\" [attr.aria-describedby]=\"getDescribedBy()\">\n <div class=\"d-flex justify-content-between\">\n <legend\n *ngIf=\"!!label\"\n [ngClass]=\"isLabelSrOnly ? 'sr-only' : 'vd-p'\"\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 </legend>\n <foehn-help-modal\n class=\"removePaddingButton\"\n *ngIf=\"!!helpModal\"\n [modalContent]=\"helpModal\"\n ></foehn-help-modal>\n </div>\n\n <foehn-validation-alerts [component]=\"this\"></foehn-validation-alerts>\n\n <div *ngIf=\"!elements\">Chargement...</div>\n\n <small\n *ngIf=\"helpText\"\n [attr.id]=\"buildChildId() + 'Help'\"\n class=\"form-text text-secondary\"\n [innerHTML]=\"helpText\"\n ></small>\n\n <ng-content></ng-content>\n <div\n *ngFor=\"\n let elementsGroup of groupedElements;\n let groupIndex = index\n \"\n >\n <!-- TODO remove aria-hidden and make this accessible -->\n <div\n *ngIf=\"!!elementsGroup.groupTitle\"\n class=\"pt-2 font-weight-bold\"\n [attr.id]=\"'checkGroup_' + groupIndex\"\n aria-hidden=\"true\"\n >\n {{ elementsGroup.groupTitle | fromDictionary }}\n </div>\n <div\n *ngFor=\"let element of elementsGroup.elements; let i = index\"\n [class.disabled]=\"getDisabled(element)\"\n class=\"form-check\"\n >\n <input\n class=\"form-check-input\"\n type=\"radio\"\n [value]=\"getValueOrObject(element)\"\n [ngModel]=\"inputValue\"\n (ngModelChange)=\"onCheck(element, $event)\"\n [name]=\"buildChildName()\"\n [attr.name]=\"buildChildName()\"\n [attr.id]=\"buildChildId() + groupIndex + '_' + i\"\n [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n [attr.disabled]=\"getDisabled(element) ? 'disabled' : null\"\n [attr.autocomplete]=\"getAutoComplete()\"\n (change)=\"handleChange(getValue(element))\"\n />\n <label\n class=\"form-check-label\"\n [for]=\"buildChildId() + groupIndex + '_' + i\"\n [innerHTML]=\"getLabel(element)\"\n ></label>\n </div>\n </div>\n </fieldset>\n</div>\n" }]
7870
7879
  }], ctorParameters: function () { return [{ type: i0.NgZone }]; } });
7871
7880
 
7872
7881
  class FoehnCheckablesModule {
@@ -10559,10 +10568,9 @@ class StreetNumber {
10559
10568
  const isDefined = (value) => value === true || value === false;
10560
10569
  const hasInputChanged$1 = (change) => change && !ObjectHelper.isEqual(change.previousValue, change.currentValue);
10561
10570
  class FoehnInputAddressComponent extends FoehnInputComponent {
10562
- constructor(httpClient, ngZone, dictionaryService) {
10571
+ constructor(httpClient, dictionaryService) {
10563
10572
  super();
10564
10573
  this.httpClient = httpClient;
10565
- this.ngZone = ngZone;
10566
10574
  this.dictionaryService = dictionaryService;
10567
10575
  this.countriesUrl = 'api/refinf/countries';
10568
10576
  this.isOnlySwiss = true;
@@ -10594,10 +10602,10 @@ class FoehnInputAddressComponent extends FoehnInputComponent {
10594
10602
  estrid: null,
10595
10603
  longName
10596
10604
  });
10597
- this.manageDefaultCountrySubscription = this.manageDefaultCountry();
10598
10605
  }
10599
10606
  ngOnInit() {
10600
10607
  super.ngOnInit();
10608
+ this.manageDefaultCountrySubscription = this.manageDefaultCountry();
10601
10609
  if (!this.showPostOfficeBoxText) {
10602
10610
  this.streetCustomErrors.AtLeastOneNotNull = this.dictionaryService.getKeySync('errors.NotNull');
10603
10611
  }
@@ -10936,7 +10944,7 @@ class FoehnInputAddressComponent extends FoehnInputComponent {
10936
10944
  .subscribe());
10937
10945
  }
10938
10946
  }
10939
- FoehnInputAddressComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FoehnInputAddressComponent, deps: [{ token: i1.HttpClient }, { token: i0.NgZone }, { token: SdkDictionaryService }], target: i0.ɵɵFactoryTarget.Component });
10947
+ FoehnInputAddressComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FoehnInputAddressComponent, deps: [{ token: i1.HttpClient }, { token: SdkDictionaryService }], target: i0.ɵɵFactoryTarget.Component });
10940
10948
  FoehnInputAddressComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: FoehnInputAddressComponent, selector: "foehn-input-address", inputs: { countriesUrl: "countriesUrl", isOnlySwiss: "isOnlySwiss", showPostOfficeBoxText: "showPostOfficeBoxText", showAdressLines: "showAdressLines", showAdressLine1: "showAdressLine1", showAdressLine2: "showAdressLine2", specifiedCanton: "specifiedCanton", countryRequired: "countryRequired", swissNpaLocalityRequired: "swissNpaLocalityRequired", streetRequired: "streetRequired", streetNumberRequired: "streetNumberRequired", hideNotRequiredExtraLabelStreetNumber: "hideNotRequiredExtraLabelStreetNumber", foreignZipCodeRequired: "foreignZipCodeRequired", foreignLocalityRequired: "foreignLocalityRequired", foreignStreetRequired: "foreignStreetRequired", foreignStreetNumberRequired: "foreignStreetNumberRequired", postOfficeBoxTextRequired: "postOfficeBoxTextRequired", addressLine1Required: "addressLine1Required", addressLine2Required: "addressLine2Required", withCompanyLocalities: "withCompanyLocalities" }, providers: [
10941
10949
  {
10942
10950
  provide: FoehnInputComponent,
@@ -10953,7 +10961,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
10953
10961
  multi: true
10954
10962
  }
10955
10963
  ], template: "<div\n [attr.id]=\"buildId() + 'Container'\"\n class=\"form-group\"\n [class.has-danger]=\"hasErrorsToDisplay()\"\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n [tabIndex]=\"-1\"\n>\n <fieldset\n class=\"mb-3\"\n [attr.aria-describedby]=\"getDescribedBy()\"\n [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n >\n <legend *ngIf=\"!!label\" [ngClass]=\"isLabelSrOnly ? 'sr-only' : 'vd-p'\">\n <span [innerHTML]=\"label\"></span>\n <span\n *ngIf=\"!required && !hideNotRequiredExtraLabel\"\n aria-hidden=\"true\"\n >\n {{ 'foehn-input.optional' | fromDictionary }}\n </span>\n </legend>\n\n <foehn-validation-alerts [component]=\"this\"></foehn-validation-alerts>\n\n <small\n *ngIf=\"helpText\"\n [attr.id]=\"buildId() + 'Help'\"\n class=\"text-secondary\"\n [innerHTML]=\"helpText\"\n ></small>\n\n <ng-content></ng-content>\n\n <foehn-autocomplete\n *ngIf=\"!isOnlySwiss\"\n [label]=\"'foehn-input-address.country.label' | fromDictionary\"\n [elements]=\"countries | async\"\n elementLabel=\"shortNameFr\"\n [elementValue]=\"identity\"\n [elementValueIdentity]=\"countryIdentity\"\n (modelChange)=\"countryUpdated($event)\"\n (userInput)=\"userInputCountry()\"\n [model]=\"country\"\n [name]=\"name + '.country'\"\n [required]=\"countryRequired\"\n [disabled]=\"disabled\"\n ></foehn-autocomplete>\n\n <ng-container *ngIf=\"isSwiss()\">\n <foehn-autocomplete\n [label]=\"'foehn-input-address.locality.label' | fromDictionary\"\n [elements]=\"localities | async\"\n [elementLabel]=\"getLocalityDisplayedName\"\n [elementValue]=\"identity\"\n [elementValueIdentity]=\"localityIdentity\"\n (modelChange)=\"localityUpdated($event)\"\n (userInput)=\"userInputLocality($event)\"\n [model]=\"locality\"\n [name]=\"name + '.locality'\"\n [allowCustomValue]=\"disabled\"\n [required]=\"swissNpaLocalityRequired\"\n [disabled]=\"!country || disabled\"\n ></foehn-autocomplete>\n\n <foehn-autocomplete\n [label]=\"'foehn-input-address.street.label' | fromDictionary\"\n [elements]=\"streets | async\"\n elementLabel=\"longName\"\n [elementValue]=\"identity\"\n [elementValueIdentity]=\"streetIdentity\"\n (modelChange)=\"streetUpdated($event)\"\n [model]=\"street\"\n [name]=\"name + '.street'\"\n [allowCustomValue]=\"true\"\n [customValueModelGenerator]=\"streetGenerator\"\n [required]=\"isStreetRequired()\"\n [helpText]=\"\n 'foehn-input-address.street.help-text' | fromDictionary\n \"\n [customErrors]=\"streetCustomErrors\"\n (userInput)=\"userInputStreet($event)\"\n [disabled]=\"!country || disabled\"\n ></foehn-autocomplete>\n\n <foehn-autocomplete\n [label]=\"\n 'foehn-input-address.houseNumber.label' | fromDictionary\n \"\n [elements]=\"streetNumbers | async\"\n elementLabel=\"name\"\n elementValue=\"name\"\n [(model)]=\"houseNumber\"\n [name]=\"name + '.houseNumber'\"\n [allowCustomValue]=\"true\"\n [helpText]=\"\n 'foehn-input-address.houseNumber.help-text' | fromDictionary\n \"\n (modelChange)=\"updateAddress()\"\n (userInput)=\"handleUserInput()\"\n [required]=\"streetNumberRequired\"\n [hideNotRequiredExtraLabel]=\"\n hideNotRequiredExtraLabelStreetNumber\n \"\n [disabled]=\"!country || disabled\"\n ></foehn-autocomplete>\n </ng-container>\n\n <ng-container *ngIf=\"!isSwiss()\">\n <!--\n Component <foehn-input-foreign-locality> is special because we use the same model when swiss or foreigner.\n To do so, we need:\n - Errors will be bind on 'locality' when NULL or on 'zipCode' and 'longName' model inside component when EMPTY\n - Hide label from component because we need label from children to be displayed (isLabelSrOnly: true)\n - required and disabled params are transmitted to children\n -->\n <foehn-input-foreign-locality\n [label]=\"'foehn-input-address.locality.label' | fromDictionary\"\n [name]=\"name + '.locality'\"\n [(model)]=\"locality\"\n [zipCodeRequired]=\"foreignZipCodeRequired\"\n [localityRequired]=\"foreignLocalityRequired\"\n [isLabelSrOnly]=\"true\"\n [disabled]=\"!country || disabled\"\n (modelChange)=\"updateAddress()\"\n (userInput)=\"handleUserInput()\"\n ></foehn-input-foreign-locality>\n <!--\n Component <foehn-input-foreign-street> is special because we use the same model when swiss or foreigner.\n To do so, we need:\n - Errors will be bind on 'street' when NULL or on 'longName' model inside component when EMPTY\n - required, helpText, isLabelSrOnly and disabled params are transmitted to children\n -->\n <foehn-input-foreign-street\n [label]=\"'foehn-input-address.street.label' | fromDictionary\"\n [name]=\"name + '.street'\"\n [(model)]=\"street\"\n [required]=\"isForeignStreetRequired()\"\n [helpText]=\"\n 'foehn-input-address.street.help-text' | fromDictionary\n \"\n [customErrors]=\"streetCustomErrors\"\n [disabled]=\"!country || disabled\"\n (modelChange)=\"updateAddress()\"\n (userInput)=\"handleUserInput()\"\n ></foehn-input-foreign-street>\n\n <foehn-input-text\n #foreignHouseNumber\n [label]=\"\n 'foehn-input-address.houseNumber.label' | fromDictionary\n \"\n [name]=\"name + '.houseNumber'\"\n [(model)]=\"houseNumber\"\n [helpText]=\"\n 'foehn-input-address.houseNumber.help-text' | fromDictionary\n \"\n [disabled]=\"!country || disabled\"\n (modelChange)=\"updateAddress()\"\n (userInput)=\"handleUserInput()\"\n [required]=\"foreignStreetNumberRequired\"\n ></foehn-input-text>\n </ng-container>\n\n <foehn-input-text\n *ngIf=\"showPostOfficeBoxText\"\n [(model)]=\"postOfficeBoxText\"\n [helpText]=\"\n 'foehn-input-address.postOfficeBoxText.help-text'\n | fromDictionary\n \"\n [label]=\"\n 'foehn-input-address.postOfficeBoxText.label' | fromDictionary\n \"\n [name]=\"name + '.postOfficeBoxText'\"\n (modelChange)=\"updateAddress()\"\n (userInput)=\"handleUserInput()\"\n [required]=\"isPostOfficeBoxTextRequired()\"\n [disabled]=\"disabled\"\n ></foehn-input-text>\n\n <foehn-input-text\n *ngIf=\"showAdressLines && showAdressLine1\"\n [(model)]=\"addressLine1\"\n [label]=\"'foehn-input-address.addressLine1.label' | fromDictionary\"\n [name]=\"name + '.addressLine1'\"\n (modelChange)=\"updateAddress()\"\n (userInput)=\"handleUserInput()\"\n [required]=\"addressLine1Required\"\n [autocomplete]=\"'address-line2'\"\n [disabled]=\"disabled\"\n ></foehn-input-text>\n\n <foehn-input-text\n *ngIf=\"showAdressLines && showAdressLine2\"\n [(model)]=\"addressLine2\"\n [label]=\"'foehn-input-address.addressLine2.label' | fromDictionary\"\n [name]=\"name + '.addressLine2'\"\n (modelChange)=\"updateAddress()\"\n (userInput)=\"handleUserInput()\"\n [required]=\"addressLine2Required\"\n [autocomplete]=\"'address-line3'\"\n [disabled]=\"disabled\"\n ></foehn-input-text>\n </fieldset>\n</div>\n" }]
10956
- }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: i0.NgZone }, { type: SdkDictionaryService }]; }, propDecorators: { foreignLocalityComponent: [{
10964
+ }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: SdkDictionaryService }]; }, propDecorators: { foreignLocalityComponent: [{
10957
10965
  type: ViewChild,
10958
10966
  args: [FoehnInputForeignLocalityComponent, { static: false }]
10959
10967
  }], foreignStreetComponent: [{
@@ -11512,7 +11520,7 @@ FoehnBooleanRadioComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0
11512
11520
  useExisting: forwardRef(() => FoehnBooleanRadioComponent),
11513
11521
  multi: true
11514
11522
  }
11515
- ], usesInheritance: true, ngImport: i0, template: "<div\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n class=\"form-group\"\n [attr.id]=\"buildId('Container')\"\n tabindex=\"-1\"\n>\n <fieldset [attr.aria-describedby]=\"getDescribedBy()\">\n <legend *ngIf=\"!!label\" [ngClass]=\"isLabelSrOnly ? 'sr-only' : 'vd-p'\">\n <span [innerHTML]=\"label\"></span>\n <span\n *ngIf=\"!required && !hideNotRequiredExtraLabel\"\n aria-hidden=\"true\"\n >\n {{ 'foehn-input.optional' | fromDictionary }}\n </span>\n </legend>\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 <ng-content></ng-content>\n\n <div\n class=\"d-flex\"\n [ngClass]=\"verticalDisplay ? 'flex-column' : 'flex-row'\"\n >\n <div class=\"form-check\">\n <input\n type=\"radio\"\n class=\"form-check-input\"\n [ngModel]=\"model\"\n (ngModelChange)=\"updateNgModel($event)\"\n [name]=\"buildChildName('True')\"\n [attr.name]=\"buildChildName('True')\"\n [value]=\"true\"\n [attr.id]=\"buildChildId('True')\"\n [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n [attr.disabled]=\"disabled ? 'disabled' : null\"\n (change)=\"handleChange(true)\"\n #entryComponent\n />\n <label\n class=\"form-check-label\"\n [for]=\"buildChildId('True')\"\n [innerHTML]=\"trueLabel\"\n ></label>\n </div>\n\n <div class=\"form-check\" [ngClass]=\"verticalDisplay ? '' : 'ml-2'\">\n <input\n type=\"radio\"\n class=\"form-check-input\"\n [ngModel]=\"model\"\n (ngModelChange)=\"updateNgModel($event)\"\n [name]=\"buildChildName('False')\"\n [attr.name]=\"buildChildName('False')\"\n [value]=\"false\"\n [attr.id]=\"buildChildId('False')\"\n [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n [attr.disabled]=\"disabled ? 'disabled' : null\"\n (change)=\"handleChange(false)\"\n />\n <label\n class=\"form-check-label\"\n [for]=\"buildChildId('False')\"\n [innerHTML]=\"falseLabel\"\n ></label>\n </div>\n </div>\n </fieldset>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FoehnValidationAlertsComponent, selector: "foehn-validation-alerts", inputs: ["component", "shouldErrorsBeLive"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] });
11523
+ ], usesInheritance: true, ngImport: i0, template: "<div\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n class=\"form-group\"\n [attr.id]=\"buildId('Container')\"\n tabindex=\"-1\"\n>\n <fieldset [attr.aria-describedby]=\"getDescribedBy()\">\n <legend *ngIf=\"!!label\" [ngClass]=\"isLabelSrOnly ? 'sr-only' : 'vd-p'\">\n <span [innerHTML]=\"label\"></span>\n <span\n *ngIf=\"!required && !hideNotRequiredExtraLabel\"\n aria-hidden=\"true\"\n >\n {{ 'foehn-input.optional' | fromDictionary }}\n </span>\n </legend>\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 <ng-content></ng-content>\n\n <div\n class=\"d-flex\"\n [ngClass]=\"verticalDisplay ? 'flex-column' : 'flex-row'\"\n >\n <div class=\"form-check\">\n <input\n type=\"radio\"\n class=\"form-check-input\"\n [ngModel]=\"model\"\n (ngModelChange)=\"updateNgModel($event)\"\n [name]=\"buildChildName()\"\n [attr.name]=\"buildChildName()\"\n [value]=\"true\"\n [attr.id]=\"buildChildId('True')\"\n [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n [attr.disabled]=\"disabled ? 'disabled' : null\"\n (change)=\"handleChange(true)\"\n #entryComponent\n />\n <label\n class=\"form-check-label\"\n [for]=\"buildChildId('True')\"\n [innerHTML]=\"trueLabel\"\n ></label>\n </div>\n\n <div class=\"form-check\" [ngClass]=\"verticalDisplay ? '' : 'ml-2'\">\n <input\n type=\"radio\"\n class=\"form-check-input\"\n [ngModel]=\"model\"\n (ngModelChange)=\"updateNgModel($event)\"\n [name]=\"buildChildName()\"\n [attr.name]=\"buildChildName()\"\n [value]=\"false\"\n [attr.id]=\"buildChildId('False')\"\n [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n [attr.disabled]=\"disabled ? 'disabled' : null\"\n (change)=\"handleChange(false)\"\n />\n <label\n class=\"form-check-label\"\n [for]=\"buildChildId('False')\"\n [innerHTML]=\"falseLabel\"\n ></label>\n </div>\n </div>\n </fieldset>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FoehnValidationAlertsComponent, selector: "foehn-validation-alerts", inputs: ["component", "shouldErrorsBeLive"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] });
11516
11524
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FoehnBooleanRadioComponent, decorators: [{
11517
11525
  type: Component,
11518
11526
  args: [{ selector: 'foehn-boolean-radio', providers: [
@@ -11521,7 +11529,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
11521
11529
  useExisting: forwardRef(() => FoehnBooleanRadioComponent),
11522
11530
  multi: true
11523
11531
  }
11524
- ], template: "<div\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n class=\"form-group\"\n [attr.id]=\"buildId('Container')\"\n tabindex=\"-1\"\n>\n <fieldset [attr.aria-describedby]=\"getDescribedBy()\">\n <legend *ngIf=\"!!label\" [ngClass]=\"isLabelSrOnly ? 'sr-only' : 'vd-p'\">\n <span [innerHTML]=\"label\"></span>\n <span\n *ngIf=\"!required && !hideNotRequiredExtraLabel\"\n aria-hidden=\"true\"\n >\n {{ 'foehn-input.optional' | fromDictionary }}\n </span>\n </legend>\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 <ng-content></ng-content>\n\n <div\n class=\"d-flex\"\n [ngClass]=\"verticalDisplay ? 'flex-column' : 'flex-row'\"\n >\n <div class=\"form-check\">\n <input\n type=\"radio\"\n class=\"form-check-input\"\n [ngModel]=\"model\"\n (ngModelChange)=\"updateNgModel($event)\"\n [name]=\"buildChildName('True')\"\n [attr.name]=\"buildChildName('True')\"\n [value]=\"true\"\n [attr.id]=\"buildChildId('True')\"\n [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n [attr.disabled]=\"disabled ? 'disabled' : null\"\n (change)=\"handleChange(true)\"\n #entryComponent\n />\n <label\n class=\"form-check-label\"\n [for]=\"buildChildId('True')\"\n [innerHTML]=\"trueLabel\"\n ></label>\n </div>\n\n <div class=\"form-check\" [ngClass]=\"verticalDisplay ? '' : 'ml-2'\">\n <input\n type=\"radio\"\n class=\"form-check-input\"\n [ngModel]=\"model\"\n (ngModelChange)=\"updateNgModel($event)\"\n [name]=\"buildChildName('False')\"\n [attr.name]=\"buildChildName('False')\"\n [value]=\"false\"\n [attr.id]=\"buildChildId('False')\"\n [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n [attr.disabled]=\"disabled ? 'disabled' : null\"\n (change)=\"handleChange(false)\"\n />\n <label\n class=\"form-check-label\"\n [for]=\"buildChildId('False')\"\n [innerHTML]=\"falseLabel\"\n ></label>\n </div>\n </div>\n </fieldset>\n</div>\n" }]
11532
+ ], template: "<div\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n class=\"form-group\"\n [attr.id]=\"buildId('Container')\"\n tabindex=\"-1\"\n>\n <fieldset [attr.aria-describedby]=\"getDescribedBy()\">\n <legend *ngIf=\"!!label\" [ngClass]=\"isLabelSrOnly ? 'sr-only' : 'vd-p'\">\n <span [innerHTML]=\"label\"></span>\n <span\n *ngIf=\"!required && !hideNotRequiredExtraLabel\"\n aria-hidden=\"true\"\n >\n {{ 'foehn-input.optional' | fromDictionary }}\n </span>\n </legend>\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 <ng-content></ng-content>\n\n <div\n class=\"d-flex\"\n [ngClass]=\"verticalDisplay ? 'flex-column' : 'flex-row'\"\n >\n <div class=\"form-check\">\n <input\n type=\"radio\"\n class=\"form-check-input\"\n [ngModel]=\"model\"\n (ngModelChange)=\"updateNgModel($event)\"\n [name]=\"buildChildName()\"\n [attr.name]=\"buildChildName()\"\n [value]=\"true\"\n [attr.id]=\"buildChildId('True')\"\n [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n [attr.disabled]=\"disabled ? 'disabled' : null\"\n (change)=\"handleChange(true)\"\n #entryComponent\n />\n <label\n class=\"form-check-label\"\n [for]=\"buildChildId('True')\"\n [innerHTML]=\"trueLabel\"\n ></label>\n </div>\n\n <div class=\"form-check\" [ngClass]=\"verticalDisplay ? '' : 'ml-2'\">\n <input\n type=\"radio\"\n class=\"form-check-input\"\n [ngModel]=\"model\"\n (ngModelChange)=\"updateNgModel($event)\"\n [name]=\"buildChildName()\"\n [attr.name]=\"buildChildName()\"\n [value]=\"false\"\n [attr.id]=\"buildChildId('False')\"\n [attr.aria-invalid]=\"hasErrorsToDisplay() || null\"\n [attr.disabled]=\"disabled ? 'disabled' : null\"\n (change)=\"handleChange(false)\"\n />\n <label\n class=\"form-check-label\"\n [for]=\"buildChildId('False')\"\n [innerHTML]=\"falseLabel\"\n ></label>\n </div>\n </div>\n </fieldset>\n</div>\n" }]
11525
11533
  }], propDecorators: { trueLabel: [{
11526
11534
  type: Input
11527
11535
  }], falseLabel: [{
@@ -14393,6 +14401,8 @@ class FoehnListSummaryComponent extends FoehnInputComponent {
14393
14401
  this.tableSort = {
14394
14402
  sortDirection: 'ASC'
14395
14403
  };
14404
+ this.trackFoehnListItem = (index, item) => item.trackingIndex || index;
14405
+ this.trackFoehnListItemDescription = (index, item) => item.label || index;
14396
14406
  }
14397
14407
  ngOnChanges(changes) {
14398
14408
  var _a, _b;
@@ -14417,9 +14427,6 @@ class FoehnListSummaryComponent extends FoehnInputComponent {
14417
14427
  });
14418
14428
  });
14419
14429
  }
14420
- trackByTrackingIndex() {
14421
- return (index, item) => item.trackingIndex;
14422
- }
14423
14430
  showLine(item, itemParam) {
14424
14431
  const value = itemParam.getFormattedValue(item);
14425
14432
  const hideIfEmptyExists = !!itemParam.hideIfEmpty;
@@ -14483,7 +14490,7 @@ FoehnListSummaryComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.
14483
14490
  useExisting: forwardRef(() => FoehnListSummaryComponent),
14484
14491
  multi: true
14485
14492
  }
14486
- ], viewQueries: [{ propertyName: "tableActionButtons", first: true, predicate: ["tableActionButtons"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<section\n class=\"form-group clearable-input-form-group\"\n [class.has-danger]=\"hasErrorsToDisplay()\"\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n [attr.id]=\"buildId('Container')\"\n tabindex=\"-1\"\n>\n <label\n [attr.for]=\"buildChildId()\"\n *ngIf=\"label && type !== 'hidden'\"\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 && type !== 'hidden'\"\n [attr.id]=\"buildChildId() + 'Help'\"\n class=\"form-text text-secondary\"\n [innerHTML]=\"helpText\"\n ></small>\n\n <section *ngIf=\"!showAsTable\">\n <ul class=\"list-unstyled\" aria-describedby=\"sommaire-help-alt\">\n <li\n [id]=\"'list-summary-' + item.trackingIndex\"\n class=\"mt-3 border-bottom\"\n *ngFor=\"\n let item of list;\n let itemIndex = index;\n trackBy: trackByTrackingIndex\n \"\n >\n <div class=\"d-flex align-items-baseline flex-wrap\">\n <h4 class=\"mt-0 mr-3\">{{ getListItemTitle(item) }}</h4>\n <span class=\"ml-auto\">\n <foehn-error-pill\n [incompleteIndicatorOnly]=\"true\"\n [errorPrefix]=\"name + '[' + itemIndex + ']'\"\n ></foehn-error-pill>\n </span>\n </div>\n <dl class=\"mb-0\">\n <ng-container\n *ngFor=\"let itemParam of listItemDescriptions\"\n >\n <div\n class=\"d-flex flex-wrap item-line\"\n *ngIf=\"showLine(item, itemParam)\"\n >\n <dt class=\"mr-1\">\n {{ itemParam.label }}\n </dt>\n <dd class=\"ml-auto text-right\">\n {{ itemParam.getFormattedValue(item) }}\n </dd>\n </div>\n </ng-container>\n </dl>\n <ul class=\"list-inline mb-3 mt-0\">\n <li class=\"list-inline-item\">\n <a\n [id]=\"buildChildId('-edit-link-' + itemIndex)\"\n href=\"#\"\n (click)=\"\n $event.preventDefault(); editItem(itemIndex)\n \"\n >\n Modifier\n </a>\n <span class=\"sr-only\">\n {{ getListItemTitle(item) }}\n </span>\n </li>\n <li class=\"list-inline-item\">\n &nbsp;\n <a\n [id]=\"buildChildId('-delete-link-' + itemIndex)\"\n href=\"#\"\n (click)=\"\n $event.preventDefault(); removeItem(itemIndex)\n \"\n >\n Supprimer\n <span class=\"sr-only\">\n {{ getListItemTitle(item) }}\n </span>\n </a>\n </li>\n </ul>\n </li>\n </ul>\n </section>\n\n <section *ngIf=\"showAsTable && !!tableConfiguration?.length\">\n <foehn-table\n [id]=\"buildChildName('table')\"\n *ngIf=\"!!listCopyForTable?.length\"\n [list]=\"listCopyForTable\"\n [itemsPerPage]=\"1000000\"\n [columnsConfiguration]=\"tableConfiguration\"\n [sort]=\"tableSort\"\n (sortChange)=\"changeSort($event)\"\n ></foehn-table>\n </section>\n\n <section [ngClass]=\"{ 'mt-5': !showAsTable }\">\n <h2 class=\"sr-only\">Action</h2>\n <ul class=\"list-inline mb-3\">\n <li class=\"list-inline-item\">\n <button\n [id]=\"buildChildId('-add-button')\"\n class=\"btn btn-primary\"\n (click)=\"editItem()\"\n >\n Ajouter\n </button>\n </li>\n </ul>\n </section>\n</section>\n\n<ng-template #tableActionButtons let-index=\"index\">\n <div class=\"d-inline-flex\">\n <button\n [id]=\"buildChildId('-edit-button-' + index)\"\n class=\"btn bg-transparent mr-3\"\n (click)=\"editItem(index)\"\n >\n <foehn-icon-edit [title]=\"'Modifier'\"></foehn-icon-edit>\n </button>\n <button\n [id]=\"buildChildId('-delete-button-' + index)\"\n class=\"btn bg-transparent\"\n (click)=\"removeItem(index)\"\n >\n <foehn-icon-trash-alt [title]=\"'Supprimer'\"></foehn-icon-trash-alt>\n </button>\n </div>\n</ng-template>\n", styles: [":host ::ng-deep .bg-transparent.btn .svg-inline--fa{color:var(--gray-dark)!important}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FoehnValidationAlertsComponent, selector: "foehn-validation-alerts", inputs: ["component", "shouldErrorsBeLive"] }, { kind: "component", type: FoehnTableComponent, selector: "foehn-table", inputs: ["itemsPerPage", "id", "previousLabel", "nextLabel", "totalElements", "fixedPageCount", "columnsConfiguration", "sort", "list", "trackByFn"], outputs: ["pageChange", "sortChange"] }, { kind: "component", type: FoehnIconEditComponent, selector: "foehn-icon-edit" }, { kind: "component", type: FoehnIconTrashAltComponent, selector: "foehn-icon-trash-alt" }, { kind: "component", type: FoehnErrorPillComponent, selector: "foehn-error-pill", inputs: ["errorPrefix", "incompleteIndicatorOnly"] }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] });
14493
+ ], viewQueries: [{ propertyName: "tableActionButtons", first: true, predicate: ["tableActionButtons"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<section\n class=\"form-group clearable-input-form-group\"\n [class.has-danger]=\"hasErrorsToDisplay()\"\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n [attr.id]=\"buildId('Container')\"\n tabindex=\"-1\"\n>\n <label\n [attr.for]=\"buildChildId()\"\n *ngIf=\"label && type !== 'hidden'\"\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 && type !== 'hidden'\"\n [attr.id]=\"buildChildId() + 'Help'\"\n class=\"form-text text-secondary\"\n [innerHTML]=\"helpText\"\n ></small>\n\n <section *ngIf=\"!showAsTable\">\n <ul class=\"list-unstyled\" aria-describedby=\"sommaire-help-alt\">\n <li\n [id]=\"'list-summary-' + item.trackingIndex\"\n class=\"mt-3 border-bottom\"\n *ngFor=\"\n let item of list;\n let itemIndex = index;\n trackBy: trackFoehnListItem\n \"\n >\n <div class=\"d-flex align-items-baseline flex-wrap\">\n <h4 class=\"mt-0 mr-3\">{{ getListItemTitle(item) }}</h4>\n <span class=\"ml-auto\">\n <foehn-error-pill\n [incompleteIndicatorOnly]=\"true\"\n [errorPrefix]=\"name + '[' + itemIndex + ']'\"\n ></foehn-error-pill>\n </span>\n </div>\n <dl class=\"mb-0\">\n <ng-container\n *ngFor=\"\n let itemParam of listItemDescriptions;\n trackBy: trackFoehnListItemDescription\n \"\n >\n <div\n class=\"d-flex flex-wrap item-line\"\n *ngIf=\"showLine(item, itemParam)\"\n >\n <dt class=\"mr-1\">\n {{ itemParam.label }}\n </dt>\n <dd class=\"ml-auto text-right\">\n {{ itemParam.getFormattedValue(item) }}\n </dd>\n </div>\n </ng-container>\n </dl>\n <ul class=\"list-inline mb-3 mt-0\">\n <li class=\"list-inline-item\">\n <a\n [id]=\"buildChildId('-edit-link-' + itemIndex)\"\n href=\"#\"\n (click)=\"\n $event.preventDefault(); editItem(itemIndex)\n \"\n >\n Modifier\n </a>\n <span class=\"sr-only\">\n {{ getListItemTitle(item) }}\n </span>\n </li>\n <li class=\"list-inline-item\">\n &nbsp;\n <a\n [id]=\"buildChildId('-delete-link-' + itemIndex)\"\n href=\"#\"\n (click)=\"\n $event.preventDefault(); removeItem(itemIndex)\n \"\n >\n Supprimer\n <span class=\"sr-only\">\n {{ getListItemTitle(item) }}\n </span>\n </a>\n </li>\n </ul>\n </li>\n </ul>\n </section>\n\n <section *ngIf=\"showAsTable && !!tableConfiguration?.length\">\n <foehn-table\n [id]=\"buildChildName('table')\"\n *ngIf=\"!!listCopyForTable?.length\"\n [list]=\"listCopyForTable\"\n [itemsPerPage]=\"1000000\"\n [columnsConfiguration]=\"tableConfiguration\"\n [sort]=\"tableSort\"\n (sortChange)=\"changeSort($event)\"\n [trackByFn]=\"trackFoehnListItem\"\n ></foehn-table>\n </section>\n\n <section [ngClass]=\"{ 'mt-5': !showAsTable }\">\n <h2 class=\"sr-only\">Action</h2>\n <ul class=\"list-inline mb-3\">\n <li class=\"list-inline-item\">\n <button\n [id]=\"buildChildId('-add-button')\"\n class=\"btn btn-primary\"\n (click)=\"editItem()\"\n >\n Ajouter\n </button>\n </li>\n </ul>\n </section>\n</section>\n\n<ng-template #tableActionButtons let-index=\"index\">\n <div class=\"d-inline-flex\">\n <button\n [id]=\"buildChildId('-edit-button-' + index)\"\n class=\"btn bg-transparent mr-3\"\n (click)=\"editItem(index)\"\n >\n <foehn-icon-edit [title]=\"'Modifier'\"></foehn-icon-edit>\n </button>\n <button\n [id]=\"buildChildId('-delete-button-' + index)\"\n class=\"btn bg-transparent\"\n (click)=\"removeItem(index)\"\n >\n <foehn-icon-trash-alt [title]=\"'Supprimer'\"></foehn-icon-trash-alt>\n </button>\n </div>\n</ng-template>\n", styles: [":host ::ng-deep .bg-transparent.btn .svg-inline--fa{color:var(--gray-dark)!important}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FoehnValidationAlertsComponent, selector: "foehn-validation-alerts", inputs: ["component", "shouldErrorsBeLive"] }, { kind: "component", type: FoehnTableComponent, selector: "foehn-table", inputs: ["itemsPerPage", "id", "previousLabel", "nextLabel", "totalElements", "fixedPageCount", "columnsConfiguration", "sort", "list", "trackByFn"], outputs: ["pageChange", "sortChange"] }, { kind: "component", type: FoehnIconEditComponent, selector: "foehn-icon-edit" }, { kind: "component", type: FoehnIconTrashAltComponent, selector: "foehn-icon-trash-alt" }, { kind: "component", type: FoehnErrorPillComponent, selector: "foehn-error-pill", inputs: ["errorPrefix", "incompleteIndicatorOnly"] }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] });
14487
14494
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FoehnListSummaryComponent, decorators: [{
14488
14495
  type: Component,
14489
14496
  args: [{ selector: 'foehn-list-summary', providers: [
@@ -14492,7 +14499,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
14492
14499
  useExisting: forwardRef(() => FoehnListSummaryComponent),
14493
14500
  multi: true
14494
14501
  }
14495
- ], template: "<section\n class=\"form-group clearable-input-form-group\"\n [class.has-danger]=\"hasErrorsToDisplay()\"\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n [attr.id]=\"buildId('Container')\"\n tabindex=\"-1\"\n>\n <label\n [attr.for]=\"buildChildId()\"\n *ngIf=\"label && type !== 'hidden'\"\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 && type !== 'hidden'\"\n [attr.id]=\"buildChildId() + 'Help'\"\n class=\"form-text text-secondary\"\n [innerHTML]=\"helpText\"\n ></small>\n\n <section *ngIf=\"!showAsTable\">\n <ul class=\"list-unstyled\" aria-describedby=\"sommaire-help-alt\">\n <li\n [id]=\"'list-summary-' + item.trackingIndex\"\n class=\"mt-3 border-bottom\"\n *ngFor=\"\n let item of list;\n let itemIndex = index;\n trackBy: trackByTrackingIndex\n \"\n >\n <div class=\"d-flex align-items-baseline flex-wrap\">\n <h4 class=\"mt-0 mr-3\">{{ getListItemTitle(item) }}</h4>\n <span class=\"ml-auto\">\n <foehn-error-pill\n [incompleteIndicatorOnly]=\"true\"\n [errorPrefix]=\"name + '[' + itemIndex + ']'\"\n ></foehn-error-pill>\n </span>\n </div>\n <dl class=\"mb-0\">\n <ng-container\n *ngFor=\"let itemParam of listItemDescriptions\"\n >\n <div\n class=\"d-flex flex-wrap item-line\"\n *ngIf=\"showLine(item, itemParam)\"\n >\n <dt class=\"mr-1\">\n {{ itemParam.label }}\n </dt>\n <dd class=\"ml-auto text-right\">\n {{ itemParam.getFormattedValue(item) }}\n </dd>\n </div>\n </ng-container>\n </dl>\n <ul class=\"list-inline mb-3 mt-0\">\n <li class=\"list-inline-item\">\n <a\n [id]=\"buildChildId('-edit-link-' + itemIndex)\"\n href=\"#\"\n (click)=\"\n $event.preventDefault(); editItem(itemIndex)\n \"\n >\n Modifier\n </a>\n <span class=\"sr-only\">\n {{ getListItemTitle(item) }}\n </span>\n </li>\n <li class=\"list-inline-item\">\n &nbsp;\n <a\n [id]=\"buildChildId('-delete-link-' + itemIndex)\"\n href=\"#\"\n (click)=\"\n $event.preventDefault(); removeItem(itemIndex)\n \"\n >\n Supprimer\n <span class=\"sr-only\">\n {{ getListItemTitle(item) }}\n </span>\n </a>\n </li>\n </ul>\n </li>\n </ul>\n </section>\n\n <section *ngIf=\"showAsTable && !!tableConfiguration?.length\">\n <foehn-table\n [id]=\"buildChildName('table')\"\n *ngIf=\"!!listCopyForTable?.length\"\n [list]=\"listCopyForTable\"\n [itemsPerPage]=\"1000000\"\n [columnsConfiguration]=\"tableConfiguration\"\n [sort]=\"tableSort\"\n (sortChange)=\"changeSort($event)\"\n ></foehn-table>\n </section>\n\n <section [ngClass]=\"{ 'mt-5': !showAsTable }\">\n <h2 class=\"sr-only\">Action</h2>\n <ul class=\"list-inline mb-3\">\n <li class=\"list-inline-item\">\n <button\n [id]=\"buildChildId('-add-button')\"\n class=\"btn btn-primary\"\n (click)=\"editItem()\"\n >\n Ajouter\n </button>\n </li>\n </ul>\n </section>\n</section>\n\n<ng-template #tableActionButtons let-index=\"index\">\n <div class=\"d-inline-flex\">\n <button\n [id]=\"buildChildId('-edit-button-' + index)\"\n class=\"btn bg-transparent mr-3\"\n (click)=\"editItem(index)\"\n >\n <foehn-icon-edit [title]=\"'Modifier'\"></foehn-icon-edit>\n </button>\n <button\n [id]=\"buildChildId('-delete-button-' + index)\"\n class=\"btn bg-transparent\"\n (click)=\"removeItem(index)\"\n >\n <foehn-icon-trash-alt [title]=\"'Supprimer'\"></foehn-icon-trash-alt>\n </button>\n </div>\n</ng-template>\n", styles: [":host ::ng-deep .bg-transparent.btn .svg-inline--fa{color:var(--gray-dark)!important}\n"] }]
14502
+ ], template: "<section\n class=\"form-group clearable-input-form-group\"\n [class.has-danger]=\"hasErrorsToDisplay()\"\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n [attr.id]=\"buildId('Container')\"\n tabindex=\"-1\"\n>\n <label\n [attr.for]=\"buildChildId()\"\n *ngIf=\"label && type !== 'hidden'\"\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 && type !== 'hidden'\"\n [attr.id]=\"buildChildId() + 'Help'\"\n class=\"form-text text-secondary\"\n [innerHTML]=\"helpText\"\n ></small>\n\n <section *ngIf=\"!showAsTable\">\n <ul class=\"list-unstyled\" aria-describedby=\"sommaire-help-alt\">\n <li\n [id]=\"'list-summary-' + item.trackingIndex\"\n class=\"mt-3 border-bottom\"\n *ngFor=\"\n let item of list;\n let itemIndex = index;\n trackBy: trackFoehnListItem\n \"\n >\n <div class=\"d-flex align-items-baseline flex-wrap\">\n <h4 class=\"mt-0 mr-3\">{{ getListItemTitle(item) }}</h4>\n <span class=\"ml-auto\">\n <foehn-error-pill\n [incompleteIndicatorOnly]=\"true\"\n [errorPrefix]=\"name + '[' + itemIndex + ']'\"\n ></foehn-error-pill>\n </span>\n </div>\n <dl class=\"mb-0\">\n <ng-container\n *ngFor=\"\n let itemParam of listItemDescriptions;\n trackBy: trackFoehnListItemDescription\n \"\n >\n <div\n class=\"d-flex flex-wrap item-line\"\n *ngIf=\"showLine(item, itemParam)\"\n >\n <dt class=\"mr-1\">\n {{ itemParam.label }}\n </dt>\n <dd class=\"ml-auto text-right\">\n {{ itemParam.getFormattedValue(item) }}\n </dd>\n </div>\n </ng-container>\n </dl>\n <ul class=\"list-inline mb-3 mt-0\">\n <li class=\"list-inline-item\">\n <a\n [id]=\"buildChildId('-edit-link-' + itemIndex)\"\n href=\"#\"\n (click)=\"\n $event.preventDefault(); editItem(itemIndex)\n \"\n >\n Modifier\n </a>\n <span class=\"sr-only\">\n {{ getListItemTitle(item) }}\n </span>\n </li>\n <li class=\"list-inline-item\">\n &nbsp;\n <a\n [id]=\"buildChildId('-delete-link-' + itemIndex)\"\n href=\"#\"\n (click)=\"\n $event.preventDefault(); removeItem(itemIndex)\n \"\n >\n Supprimer\n <span class=\"sr-only\">\n {{ getListItemTitle(item) }}\n </span>\n </a>\n </li>\n </ul>\n </li>\n </ul>\n </section>\n\n <section *ngIf=\"showAsTable && !!tableConfiguration?.length\">\n <foehn-table\n [id]=\"buildChildName('table')\"\n *ngIf=\"!!listCopyForTable?.length\"\n [list]=\"listCopyForTable\"\n [itemsPerPage]=\"1000000\"\n [columnsConfiguration]=\"tableConfiguration\"\n [sort]=\"tableSort\"\n (sortChange)=\"changeSort($event)\"\n [trackByFn]=\"trackFoehnListItem\"\n ></foehn-table>\n </section>\n\n <section [ngClass]=\"{ 'mt-5': !showAsTable }\">\n <h2 class=\"sr-only\">Action</h2>\n <ul class=\"list-inline mb-3\">\n <li class=\"list-inline-item\">\n <button\n [id]=\"buildChildId('-add-button')\"\n class=\"btn btn-primary\"\n (click)=\"editItem()\"\n >\n Ajouter\n </button>\n </li>\n </ul>\n </section>\n</section>\n\n<ng-template #tableActionButtons let-index=\"index\">\n <div class=\"d-inline-flex\">\n <button\n [id]=\"buildChildId('-edit-button-' + index)\"\n class=\"btn bg-transparent mr-3\"\n (click)=\"editItem(index)\"\n >\n <foehn-icon-edit [title]=\"'Modifier'\"></foehn-icon-edit>\n </button>\n <button\n [id]=\"buildChildId('-delete-button-' + index)\"\n class=\"btn bg-transparent\"\n (click)=\"removeItem(index)\"\n >\n <foehn-icon-trash-alt [title]=\"'Supprimer'\"></foehn-icon-trash-alt>\n </button>\n </div>\n</ng-template>\n", styles: [":host ::ng-deep .bg-transparent.btn .svg-inline--fa{color:var(--gray-dark)!important}\n"] }]
14496
14503
  }], ctorParameters: function () { return [{ type: FoehnConfirmModalService }, { type: i0.NgZone }]; }, propDecorators: { tableActionButtons: [{
14497
14504
  type: ViewChild,
14498
14505
  args: ['tableActionButtons']