@dsivd/prestations-ng 17.0.0-beta.13 → 17.0.0-beta.15
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.
- package/dsivd-prestations-ng-17.0.0-beta.15.tgz +0 -0
- package/esm2022/foehn-agenda/foehn-agenda-navigation/foehn-agenda-navigation.component.mjs +3 -3
- package/esm2022/foehn-agenda/foehn-agenda-timeslot-panel/foehn-agenda-timeslot-panel.component.mjs +2 -2
- package/esm2022/foehn-date-picker/foehn-date-picker.component.mjs +2 -2
- package/esm2022/foehn-dropdown-menu/foehn-dropdown-menu.component.mjs +2 -2
- package/esm2022/foehn-help-modal/foehn-help-modal.component.mjs +3 -3
- package/esm2022/foehn-list/foehn-list.component.mjs +3 -3
- package/esm2022/foehn-multiselect-autocomplete/foehn-multiselect-autocomplete.component.mjs +2 -2
- package/esm2022/foehn-navigation/foehn-navigation/foehn-navigation.component.mjs +3 -3
- package/esm2022/foehn-navigation/foehn-simple-navigation/foehn-simple-navigation.component.mjs +3 -3
- package/esm2022/foehn-table/foehn-table.component.mjs +3 -3
- package/fesm2022/dsivd-prestations-ng.mjs +20 -20
- package/fesm2022/dsivd-prestations-ng.mjs.map +1 -1
- package/package.json +1 -1
- package/schematics/utility/foehn2-bootstrap5-migration.js +19 -2
- package/dsivd-prestations-ng-17.0.0-beta.13.tgz +0 -0
|
@@ -4141,11 +4141,11 @@ class FoehnHelpModalComponent {
|
|
|
4141
4141
|
return this.content && !!this.content.nativeElement.innerHTML.trim();
|
|
4142
4142
|
}
|
|
4143
4143
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnHelpModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4144
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnHelpModalComponent, selector: "foehn-help-modal", inputs: { modalContent: "modalContent" }, viewQueries: [{ propertyName: "modalTrigger", first: true, predicate: ["modalTrigger"], descendants: true, static: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, static: true }], ngImport: i0, template: "<button\n type=\"button\"\n class=\"
|
|
4144
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnHelpModalComponent, selector: "foehn-help-modal", inputs: { modalContent: "modalContent" }, viewQueries: [{ propertyName: "modalTrigger", first: true, predicate: ["modalTrigger"], descendants: true, static: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, static: true }], ngImport: i0, template: "<button\n type=\"button\"\n class=\"btn btn-link d-flex\"\n (click)=\"open()\"\n #modalTrigger\n>\n <foehn-icon-info-circle\n [class.me-1]=\"hasContent()\"\n [title]=\"modalContent.buttonTitle || ' '\"\n ></foehn-icon-info-circle>\n\n <span class=\"visually-hidden button-help-text\" *ngIf=\"!hasContent()\">\n Aide: {{ modalContent.title }}\n </span>\n\n <span #content>\n <ng-content></ng-content>\n </span>\n</button>\n<foehn-modal\n id=\"help-modal\"\n [modalSize]=\"modalContent.modalSize || 'modal-lg'\"\n [modalHeaderText]=\"currentModalTitle\"\n [isModalVisible]=\"isModalVisible\"\n (isModalVisibleChange)=\"updateVisibilityStatus($event)\"\n (click)=\"close()\"\n [modalTriggerHtmlElement]=\"modalTrigger\"\n>\n <ng-container *ngIf=\"modalContent\">\n <div *ngIf=\"!!modalContent.body\" [innerHtml]=\"modalContent.body\"></div>\n <img\n *ngFor=\"let image of modalContent.images\"\n [src]=\"image.src\"\n [alt]=\"image.alt\"\n class=\"mt-2\"\n [style]=\"\n 'width:' +\n (image.width || '100%') +\n '; ' +\n 'height: ' +\n (image.height || 'auto') +\n ';'\n \"\n />\n </ng-container>\n</foehn-modal>\n", styles: [":host ::ng-deep .modal-body{height:100%}:host ::ng-deep .btn.btn-link .svg-inline--fa{color:var(--vd-neutral-darker)}.btn.btn-link{text-decoration:none;padding-left:0;color:var(--vd-neutral-darker)}\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: "component", type: FoehnModalComponent, selector: "foehn-modal", inputs: ["id", "name", "modalSize", "modalBodyText", "modalHeaderText", "closeable", "modalTriggerHtmlElement", "isModalVisible"], outputs: ["isModalVisibleChange"] }, { kind: "component", type: FoehnIconInfoCircleComponent, selector: "foehn-icon-info-circle" }] }); }
|
|
4145
4145
|
}
|
|
4146
4146
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnHelpModalComponent, decorators: [{
|
|
4147
4147
|
type: Component,
|
|
4148
|
-
args: [{ selector: 'foehn-help-modal', template: "<button\n type=\"button\"\n class=\"
|
|
4148
|
+
args: [{ selector: 'foehn-help-modal', template: "<button\n type=\"button\"\n class=\"btn btn-link d-flex\"\n (click)=\"open()\"\n #modalTrigger\n>\n <foehn-icon-info-circle\n [class.me-1]=\"hasContent()\"\n [title]=\"modalContent.buttonTitle || ' '\"\n ></foehn-icon-info-circle>\n\n <span class=\"visually-hidden button-help-text\" *ngIf=\"!hasContent()\">\n Aide: {{ modalContent.title }}\n </span>\n\n <span #content>\n <ng-content></ng-content>\n </span>\n</button>\n<foehn-modal\n id=\"help-modal\"\n [modalSize]=\"modalContent.modalSize || 'modal-lg'\"\n [modalHeaderText]=\"currentModalTitle\"\n [isModalVisible]=\"isModalVisible\"\n (isModalVisibleChange)=\"updateVisibilityStatus($event)\"\n (click)=\"close()\"\n [modalTriggerHtmlElement]=\"modalTrigger\"\n>\n <ng-container *ngIf=\"modalContent\">\n <div *ngIf=\"!!modalContent.body\" [innerHtml]=\"modalContent.body\"></div>\n <img\n *ngFor=\"let image of modalContent.images\"\n [src]=\"image.src\"\n [alt]=\"image.alt\"\n class=\"mt-2\"\n [style]=\"\n 'width:' +\n (image.width || '100%') +\n '; ' +\n 'height: ' +\n (image.height || 'auto') +\n ';'\n \"\n />\n </ng-container>\n</foehn-modal>\n", styles: [":host ::ng-deep .modal-body{height:100%}:host ::ng-deep .btn.btn-link .svg-inline--fa{color:var(--vd-neutral-darker)}.btn.btn-link{text-decoration:none;padding-left:0;color:var(--vd-neutral-darker)}\n"] }]
|
|
4149
4149
|
}], propDecorators: { modalContent: [{
|
|
4150
4150
|
type: Input
|
|
4151
4151
|
}], modalTrigger: [{
|
|
@@ -5105,11 +5105,11 @@ class FoehnTableComponent {
|
|
|
5105
5105
|
this.filteredList = this._list.slice(start, start + this.itemsPerPage);
|
|
5106
5106
|
}
|
|
5107
5107
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5108
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnTableComponent, selector: "foehn-table", inputs: { itemsPerPage: "itemsPerPage", id: "id", title: "title", titleSrOnly: "titleSrOnly", 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 <caption\n *ngIf=\"title?.length\"\n [class.visually-hidden]=\"titleSrOnly\"\n >\n {{ title }}\n </caption>\n <thead class=\"vd-bg-pattern-bars-gray\">\n <tr>\n <th\n scope=\"col\"\n *ngFor=\"\n let col of columnsConfiguration;\n trackBy: trackFoehnTableColumnConfiguration\n \"\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=\"ms-3\"\n *ngIf=\"sort.sortDirection === 'ASC'\"\n >\n <foehn-icon-chevron-up></foehn-icon-chevron-up>\n </span>\n <span\n class=\"ms-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: 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 me-2\"\n >\n <fa-icon\n aria-hidden=\"true\"\n [icon]=\"iconDef.icon\"\n [title]=\"iconDef.label\"\n ></fa-icon>\n <span class=\"visually-hidden\">\n {{ iconDef.label }}\n </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 type=\"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=\"visually-hidden\">:</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 type=\"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=\"visually-hidden\">:</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", "animation", "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" }] }); }
|
|
5108
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnTableComponent, selector: "foehn-table", inputs: { itemsPerPage: "itemsPerPage", id: "id", title: "title", titleSrOnly: "titleSrOnly", 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 <caption\n *ngIf=\"title?.length\"\n [class.visually-hidden]=\"titleSrOnly\"\n >\n {{ title }}\n </caption>\n <thead class=\"vd-bg-pattern-bars-gray\">\n <tr>\n <th\n scope=\"col\"\n *ngFor=\"\n let col of columnsConfiguration;\n trackBy: trackFoehnTableColumnConfiguration\n \"\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=\"ms-3\"\n *ngIf=\"sort.sortDirection === 'ASC'\"\n >\n <foehn-icon-chevron-up></foehn-icon-chevron-up>\n </span>\n <span\n class=\"ms-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: 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 me-2\"\n >\n <fa-icon\n aria-hidden=\"true\"\n [icon]=\"iconDef.icon\"\n [title]=\"iconDef.label\"\n ></fa-icon>\n <span class=\"visually-hidden\">\n {{ iconDef.label }}\n </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 type=\"button\"\n class=\"btn 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=\"visually-hidden\">:</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 type=\"button\"\n class=\"btn 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=\"visually-hidden\">:</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)}:host ::ng-deep .btn.btn-link .svg-inline--fa{color:var(--vd-primary-dark)}:host ::ng-deep .btn.btn-link:hover .svg-inline--fa{color:var(--vd-neutral-dark)}.btn.btn-link{text-transform:none}.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", "animation", "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" }] }); }
|
|
5109
5109
|
}
|
|
5110
5110
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnTableComponent, decorators: [{
|
|
5111
5111
|
type: Component,
|
|
5112
|
-
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 <caption\n *ngIf=\"title?.length\"\n [class.visually-hidden]=\"titleSrOnly\"\n >\n {{ title }}\n </caption>\n <thead class=\"vd-bg-pattern-bars-gray\">\n <tr>\n <th\n scope=\"col\"\n *ngFor=\"\n let col of columnsConfiguration;\n trackBy: trackFoehnTableColumnConfiguration\n \"\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=\"ms-3\"\n *ngIf=\"sort.sortDirection === 'ASC'\"\n >\n <foehn-icon-chevron-up></foehn-icon-chevron-up>\n </span>\n <span\n class=\"ms-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: 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 me-2\"\n >\n <fa-icon\n aria-hidden=\"true\"\n [icon]=\"iconDef.icon\"\n [title]=\"iconDef.label\"\n ></fa-icon>\n <span class=\"visually-hidden\">\n {{ iconDef.label }}\n </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 type=\"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=\"visually-hidden\">:</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 type=\"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=\"visually-hidden\">:</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"] }]
|
|
5112
|
+
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 <caption\n *ngIf=\"title?.length\"\n [class.visually-hidden]=\"titleSrOnly\"\n >\n {{ title }}\n </caption>\n <thead class=\"vd-bg-pattern-bars-gray\">\n <tr>\n <th\n scope=\"col\"\n *ngFor=\"\n let col of columnsConfiguration;\n trackBy: trackFoehnTableColumnConfiguration\n \"\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=\"ms-3\"\n *ngIf=\"sort.sortDirection === 'ASC'\"\n >\n <foehn-icon-chevron-up></foehn-icon-chevron-up>\n </span>\n <span\n class=\"ms-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: 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 me-2\"\n >\n <fa-icon\n aria-hidden=\"true\"\n [icon]=\"iconDef.icon\"\n [title]=\"iconDef.label\"\n ></fa-icon>\n <span class=\"visually-hidden\">\n {{ iconDef.label }}\n </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 type=\"button\"\n class=\"btn 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=\"visually-hidden\">:</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 type=\"button\"\n class=\"btn 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=\"visually-hidden\">:</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)}:host ::ng-deep .btn.btn-link .svg-inline--fa{color:var(--vd-primary-dark)}:host ::ng-deep .btn.btn-link:hover .svg-inline--fa{color:var(--vd-neutral-dark)}.btn.btn-link{text-transform:none}.cell-vertical-align-middle{vertical-align:middle}\n"] }]
|
|
5113
5113
|
}], propDecorators: { itemsPerPage: [{
|
|
5114
5114
|
type: Input
|
|
5115
5115
|
}], id: [{
|
|
@@ -5918,11 +5918,11 @@ class FoehnDropdownMenuComponent {
|
|
|
5918
5918
|
}
|
|
5919
5919
|
}
|
|
5920
5920
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnDropdownMenuComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5921
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnDropdownMenuComponent, selector: "foehn-dropdown-menu", inputs: { id: "id", label: "label", model: "model", btnCssClass: "btnCssClass" }, host: { listeners: { "keyup": "handleKeyboardUpEvent($event)", "keydown": "handleKeyboardDownEvent($event)" }, properties: { "attr.id": "this.hostId" } }, viewQueries: [{ propertyName: "buttonTrigger", first: true, predicate: ["buttonTrigger"], descendants: true, static: true }, { propertyName: "entryPoint", first: true, predicate: ["entryPoint"], descendants: true }, { propertyName: "selectedFocusList", predicate: ["selectedFocusList"], descendants: true }], ngImport: i0, template: "<nav\n [attr.id]=\"buildId('NavContainer')\"\n tabindex=\"-1\"\n [attr.aria-label]=\"'foehn-dropdown-menu.aria-label' | fromDictionary\"\n>\n <button\n [attr.id]=\"buildId('TriggerButton')\"\n type=\"button\"\n class=\"d-flex align-items-center btn\"\n [ngClass]=\"btnCssClass\"\n (click)=\"toggleDropdownVisibility()\"\n (focusin)=\"handleFocusIn()\"\n (focusout)=\"handleFocusOut()\"\n [attr.aria-haspopup]=\"true\"\n [attr.aria-expanded]=\"isDropdownVisible\"\n [attr.aria-controls]=\"'dropdown-menu-list'\"\n [attr.aria-label]=\"label || null\"\n #buttonTrigger\n >\n <ng-content></ng-content>\n </button>\n\n <div class=\"dropdown-menu-container\" *ngIf=\"!!model && isDropdownVisible\">\n <ul\n id=\"dropdown-menu-list\"\n class=\"parent-list list-group\"\n (focusin)=\"handleFocusIn()\"\n (focusout)=\"handleFocusOut()\"\n [style.left.px]=\"popupPosition.left\"\n [style.top.px]=\"popupPosition.top\"\n tabindex=\"-1\"\n #entryPoint\n >\n <ng-container *ngFor=\"let group of model; let i = index\">\n <ng-container *ngIf=\"!!group.title\">\n <li\n *ngIf=\"i > 0\"\n class=\"list-group-item item-divider\"\n [attr.role]=\"'separator'\"\n ></li>\n <li\n class=\"list-group-item list-group-title\"\n tabindex=\"0\"\n #selectedFocusList\n >\n <strong *ngIf=\"!!group.title\">{{ group.title }}</strong>\n <ul class=\"child-list list-group\">\n <li\n *ngFor=\"let item of group.items\"\n class=\"list-group-item\"\n #selectedFocusList\n >\n <ng-container\n [ngTemplateOutlet]=\"itemLink\"\n [ngTemplateOutletContext]=\"{ item: item }\"\n ></ng-container>\n </li>\n </ul>\n </li>\n </ng-container>\n <ng-container *ngIf=\"!group.title\">\n <li\n *ngIf=\"i > 0\"\n class=\"list-group-item item-divider\"\n [attr.role]=\"'separator'\"\n ></li>\n <li\n *ngFor=\"let item of group.items; let j = index\"\n class=\"list-group-item\"\n #selectedFocusList\n >\n <ng-container\n [ngTemplateOutlet]=\"itemLink\"\n [ngTemplateOutletContext]=\"{ item: item }\"\n ></ng-container>\n </li>\n </ng-container>\n </ng-container>\n </ul>\n </div>\n</nav>\n\n<ng-template #itemLink let-item=\"item\">\n <a\n *ngIf=\"!!item.routerLink\"\n [attr.title]=\"item.title\"\n [routerLink]=\"item.routerLink\"\n [innerHTML]=\"item.label\"\n [attr.use-router]=\"true\"\n ></a>\n <a\n *ngIf=\"!item.routerLink\"\n [attr.title]=\"item.title\"\n [attr.href]=\"item.href\"\n [attr.target]=\"item.target\"\n [innerHTML]=\"item.label\"\n [attr.use-router]=\"false\"\n ></a>\n</ng-template>\n", styles: [":host ::ng-deep .btn .svg-inline--fa{color:#000!important}nav button:after{display:inline-block;width:0;height:0;margin-left:.3em;content:\"\";border-top:.4em solid;border-right:.4em solid transparent;border-bottom:0;border-left:.4em solid transparent}nav button.btn-link:after{color:#000}.dropdown-menu-container{position:relative;width:100%}.dropdown-menu-container .parent-list{position:absolute;top:0;left:0;z-index:9999;box-shadow:0 4px 8px #0003,0 6px 20px #00000030;background-color:#fff;width:max-content;max-width:350px}.dropdown-menu-container .list-group-item{border:0;padding:0}.dropdown-menu-container li.item-divider{border-top:1px solid #ddd!important}.dropdown-menu-container li a{width:100%;color:inherit;display:block;padding:.75rem;word-break:break-word}.dropdown-menu-container li.list-group-title strong{padding-left:.75rem}.dropdown-menu-container ul.child-list a{padding-left:1.5rem}.dropdown-menu-container li a:focus{box-shadow:none}.dropdown-menu-container li.list-group-item:hover,.dropdown-menu-container li.list-group-item a:focus{background-color:var(--vd-primary-dark);outline:none;color:#fff}.dropdown-menu-container .list-group-title{padding-top:.5rem}.dropdown-menu-container li.list-group-title:hover{background:none;color:inherit}.dropdown-menu-container li.list-group-title:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}\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: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] }); }
|
|
5921
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnDropdownMenuComponent, selector: "foehn-dropdown-menu", inputs: { id: "id", label: "label", model: "model", btnCssClass: "btnCssClass" }, host: { listeners: { "keyup": "handleKeyboardUpEvent($event)", "keydown": "handleKeyboardDownEvent($event)" }, properties: { "attr.id": "this.hostId" } }, viewQueries: [{ propertyName: "buttonTrigger", first: true, predicate: ["buttonTrigger"], descendants: true, static: true }, { propertyName: "entryPoint", first: true, predicate: ["entryPoint"], descendants: true }, { propertyName: "selectedFocusList", predicate: ["selectedFocusList"], descendants: true }], ngImport: i0, template: "<nav\n [attr.id]=\"buildId('NavContainer')\"\n tabindex=\"-1\"\n [attr.aria-label]=\"'foehn-dropdown-menu.aria-label' | fromDictionary\"\n>\n <button\n [attr.id]=\"buildId('TriggerButton')\"\n type=\"button\"\n class=\"d-flex align-items-center btn\"\n [ngClass]=\"btnCssClass\"\n (click)=\"toggleDropdownVisibility()\"\n (focusin)=\"handleFocusIn()\"\n (focusout)=\"handleFocusOut()\"\n [attr.aria-haspopup]=\"true\"\n [attr.aria-expanded]=\"isDropdownVisible\"\n [attr.aria-controls]=\"'dropdown-menu-list'\"\n [attr.aria-label]=\"label || null\"\n #buttonTrigger\n >\n <ng-content></ng-content>\n </button>\n\n <div class=\"dropdown-menu-container\" *ngIf=\"!!model && isDropdownVisible\">\n <ul\n id=\"dropdown-menu-list\"\n class=\"parent-list list-group\"\n (focusin)=\"handleFocusIn()\"\n (focusout)=\"handleFocusOut()\"\n [style.left.px]=\"popupPosition.left\"\n [style.top.px]=\"popupPosition.top\"\n tabindex=\"-1\"\n #entryPoint\n >\n <ng-container *ngFor=\"let group of model; let i = index\">\n <ng-container *ngIf=\"!!group.title\">\n <li\n *ngIf=\"i > 0\"\n class=\"list-group-item item-divider\"\n [attr.role]=\"'separator'\"\n ></li>\n <li\n class=\"list-group-item list-group-title\"\n tabindex=\"0\"\n #selectedFocusList\n >\n <strong *ngIf=\"!!group.title\">{{ group.title }}</strong>\n <ul class=\"child-list list-group\">\n <li\n *ngFor=\"let item of group.items\"\n class=\"list-group-item\"\n #selectedFocusList\n >\n <ng-container\n [ngTemplateOutlet]=\"itemLink\"\n [ngTemplateOutletContext]=\"{ item: item }\"\n ></ng-container>\n </li>\n </ul>\n </li>\n </ng-container>\n <ng-container *ngIf=\"!group.title\">\n <li\n *ngIf=\"i > 0\"\n class=\"list-group-item item-divider\"\n [attr.role]=\"'separator'\"\n ></li>\n <li\n *ngFor=\"let item of group.items; let j = index\"\n class=\"list-group-item\"\n #selectedFocusList\n >\n <ng-container\n [ngTemplateOutlet]=\"itemLink\"\n [ngTemplateOutletContext]=\"{ item: item }\"\n ></ng-container>\n </li>\n </ng-container>\n </ng-container>\n </ul>\n </div>\n</nav>\n\n<ng-template #itemLink let-item=\"item\">\n <a\n *ngIf=\"!!item.routerLink\"\n [attr.title]=\"item.title\"\n [routerLink]=\"item.routerLink\"\n [innerHTML]=\"item.label\"\n [attr.use-router]=\"true\"\n ></a>\n <a\n *ngIf=\"!item.routerLink\"\n [attr.title]=\"item.title\"\n [attr.href]=\"item.href\"\n [attr.target]=\"item.target\"\n [innerHTML]=\"item.label\"\n [attr.use-router]=\"false\"\n ></a>\n</ng-template>\n", styles: [":host ::ng-deep .btn .svg-inline--fa{color:#000!important}nav button:after{display:inline-block;width:0;height:0;margin-left:.3em;content:\"\";border-top:.4em solid;border-right:.4em solid transparent;border-bottom:0;border-left:.4em solid transparent}nav button.btn.btn-link:after{color:#000}.dropdown-menu-container{position:relative;width:100%}.dropdown-menu-container .parent-list{position:absolute;top:0;left:0;z-index:9999;box-shadow:0 4px 8px #0003,0 6px 20px #00000030;background-color:#fff;width:max-content;max-width:350px}.dropdown-menu-container .list-group-item{border:0;padding:0}.dropdown-menu-container li.item-divider{border-top:1px solid #ddd!important}.dropdown-menu-container li a{width:100%;color:inherit;display:block;padding:.75rem;word-break:break-word}.dropdown-menu-container li.list-group-title strong{padding-left:.75rem}.dropdown-menu-container ul.child-list a{padding-left:1.5rem}.dropdown-menu-container li a:focus{box-shadow:none}.dropdown-menu-container li.list-group-item:hover,.dropdown-menu-container li.list-group-item a:focus{background-color:var(--vd-primary-dark);outline:none;color:#fff}.dropdown-menu-container .list-group-title{padding-top:.5rem}.dropdown-menu-container li.list-group-title:hover{background:none;color:inherit}.dropdown-menu-container li.list-group-title:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}\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: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] }); }
|
|
5922
5922
|
}
|
|
5923
5923
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnDropdownMenuComponent, decorators: [{
|
|
5924
5924
|
type: Component,
|
|
5925
|
-
args: [{ selector: 'foehn-dropdown-menu', template: "<nav\n [attr.id]=\"buildId('NavContainer')\"\n tabindex=\"-1\"\n [attr.aria-label]=\"'foehn-dropdown-menu.aria-label' | fromDictionary\"\n>\n <button\n [attr.id]=\"buildId('TriggerButton')\"\n type=\"button\"\n class=\"d-flex align-items-center btn\"\n [ngClass]=\"btnCssClass\"\n (click)=\"toggleDropdownVisibility()\"\n (focusin)=\"handleFocusIn()\"\n (focusout)=\"handleFocusOut()\"\n [attr.aria-haspopup]=\"true\"\n [attr.aria-expanded]=\"isDropdownVisible\"\n [attr.aria-controls]=\"'dropdown-menu-list'\"\n [attr.aria-label]=\"label || null\"\n #buttonTrigger\n >\n <ng-content></ng-content>\n </button>\n\n <div class=\"dropdown-menu-container\" *ngIf=\"!!model && isDropdownVisible\">\n <ul\n id=\"dropdown-menu-list\"\n class=\"parent-list list-group\"\n (focusin)=\"handleFocusIn()\"\n (focusout)=\"handleFocusOut()\"\n [style.left.px]=\"popupPosition.left\"\n [style.top.px]=\"popupPosition.top\"\n tabindex=\"-1\"\n #entryPoint\n >\n <ng-container *ngFor=\"let group of model; let i = index\">\n <ng-container *ngIf=\"!!group.title\">\n <li\n *ngIf=\"i > 0\"\n class=\"list-group-item item-divider\"\n [attr.role]=\"'separator'\"\n ></li>\n <li\n class=\"list-group-item list-group-title\"\n tabindex=\"0\"\n #selectedFocusList\n >\n <strong *ngIf=\"!!group.title\">{{ group.title }}</strong>\n <ul class=\"child-list list-group\">\n <li\n *ngFor=\"let item of group.items\"\n class=\"list-group-item\"\n #selectedFocusList\n >\n <ng-container\n [ngTemplateOutlet]=\"itemLink\"\n [ngTemplateOutletContext]=\"{ item: item }\"\n ></ng-container>\n </li>\n </ul>\n </li>\n </ng-container>\n <ng-container *ngIf=\"!group.title\">\n <li\n *ngIf=\"i > 0\"\n class=\"list-group-item item-divider\"\n [attr.role]=\"'separator'\"\n ></li>\n <li\n *ngFor=\"let item of group.items; let j = index\"\n class=\"list-group-item\"\n #selectedFocusList\n >\n <ng-container\n [ngTemplateOutlet]=\"itemLink\"\n [ngTemplateOutletContext]=\"{ item: item }\"\n ></ng-container>\n </li>\n </ng-container>\n </ng-container>\n </ul>\n </div>\n</nav>\n\n<ng-template #itemLink let-item=\"item\">\n <a\n *ngIf=\"!!item.routerLink\"\n [attr.title]=\"item.title\"\n [routerLink]=\"item.routerLink\"\n [innerHTML]=\"item.label\"\n [attr.use-router]=\"true\"\n ></a>\n <a\n *ngIf=\"!item.routerLink\"\n [attr.title]=\"item.title\"\n [attr.href]=\"item.href\"\n [attr.target]=\"item.target\"\n [innerHTML]=\"item.label\"\n [attr.use-router]=\"false\"\n ></a>\n</ng-template>\n", styles: [":host ::ng-deep .btn .svg-inline--fa{color:#000!important}nav button:after{display:inline-block;width:0;height:0;margin-left:.3em;content:\"\";border-top:.4em solid;border-right:.4em solid transparent;border-bottom:0;border-left:.4em solid transparent}nav button.btn-link:after{color:#000}.dropdown-menu-container{position:relative;width:100%}.dropdown-menu-container .parent-list{position:absolute;top:0;left:0;z-index:9999;box-shadow:0 4px 8px #0003,0 6px 20px #00000030;background-color:#fff;width:max-content;max-width:350px}.dropdown-menu-container .list-group-item{border:0;padding:0}.dropdown-menu-container li.item-divider{border-top:1px solid #ddd!important}.dropdown-menu-container li a{width:100%;color:inherit;display:block;padding:.75rem;word-break:break-word}.dropdown-menu-container li.list-group-title strong{padding-left:.75rem}.dropdown-menu-container ul.child-list a{padding-left:1.5rem}.dropdown-menu-container li a:focus{box-shadow:none}.dropdown-menu-container li.list-group-item:hover,.dropdown-menu-container li.list-group-item a:focus{background-color:var(--vd-primary-dark);outline:none;color:#fff}.dropdown-menu-container .list-group-title{padding-top:.5rem}.dropdown-menu-container li.list-group-title:hover{background:none;color:inherit}.dropdown-menu-container li.list-group-title:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}\n"] }]
|
|
5925
|
+
args: [{ selector: 'foehn-dropdown-menu', template: "<nav\n [attr.id]=\"buildId('NavContainer')\"\n tabindex=\"-1\"\n [attr.aria-label]=\"'foehn-dropdown-menu.aria-label' | fromDictionary\"\n>\n <button\n [attr.id]=\"buildId('TriggerButton')\"\n type=\"button\"\n class=\"d-flex align-items-center btn\"\n [ngClass]=\"btnCssClass\"\n (click)=\"toggleDropdownVisibility()\"\n (focusin)=\"handleFocusIn()\"\n (focusout)=\"handleFocusOut()\"\n [attr.aria-haspopup]=\"true\"\n [attr.aria-expanded]=\"isDropdownVisible\"\n [attr.aria-controls]=\"'dropdown-menu-list'\"\n [attr.aria-label]=\"label || null\"\n #buttonTrigger\n >\n <ng-content></ng-content>\n </button>\n\n <div class=\"dropdown-menu-container\" *ngIf=\"!!model && isDropdownVisible\">\n <ul\n id=\"dropdown-menu-list\"\n class=\"parent-list list-group\"\n (focusin)=\"handleFocusIn()\"\n (focusout)=\"handleFocusOut()\"\n [style.left.px]=\"popupPosition.left\"\n [style.top.px]=\"popupPosition.top\"\n tabindex=\"-1\"\n #entryPoint\n >\n <ng-container *ngFor=\"let group of model; let i = index\">\n <ng-container *ngIf=\"!!group.title\">\n <li\n *ngIf=\"i > 0\"\n class=\"list-group-item item-divider\"\n [attr.role]=\"'separator'\"\n ></li>\n <li\n class=\"list-group-item list-group-title\"\n tabindex=\"0\"\n #selectedFocusList\n >\n <strong *ngIf=\"!!group.title\">{{ group.title }}</strong>\n <ul class=\"child-list list-group\">\n <li\n *ngFor=\"let item of group.items\"\n class=\"list-group-item\"\n #selectedFocusList\n >\n <ng-container\n [ngTemplateOutlet]=\"itemLink\"\n [ngTemplateOutletContext]=\"{ item: item }\"\n ></ng-container>\n </li>\n </ul>\n </li>\n </ng-container>\n <ng-container *ngIf=\"!group.title\">\n <li\n *ngIf=\"i > 0\"\n class=\"list-group-item item-divider\"\n [attr.role]=\"'separator'\"\n ></li>\n <li\n *ngFor=\"let item of group.items; let j = index\"\n class=\"list-group-item\"\n #selectedFocusList\n >\n <ng-container\n [ngTemplateOutlet]=\"itemLink\"\n [ngTemplateOutletContext]=\"{ item: item }\"\n ></ng-container>\n </li>\n </ng-container>\n </ng-container>\n </ul>\n </div>\n</nav>\n\n<ng-template #itemLink let-item=\"item\">\n <a\n *ngIf=\"!!item.routerLink\"\n [attr.title]=\"item.title\"\n [routerLink]=\"item.routerLink\"\n [innerHTML]=\"item.label\"\n [attr.use-router]=\"true\"\n ></a>\n <a\n *ngIf=\"!item.routerLink\"\n [attr.title]=\"item.title\"\n [attr.href]=\"item.href\"\n [attr.target]=\"item.target\"\n [innerHTML]=\"item.label\"\n [attr.use-router]=\"false\"\n ></a>\n</ng-template>\n", styles: [":host ::ng-deep .btn .svg-inline--fa{color:#000!important}nav button:after{display:inline-block;width:0;height:0;margin-left:.3em;content:\"\";border-top:.4em solid;border-right:.4em solid transparent;border-bottom:0;border-left:.4em solid transparent}nav button.btn.btn-link:after{color:#000}.dropdown-menu-container{position:relative;width:100%}.dropdown-menu-container .parent-list{position:absolute;top:0;left:0;z-index:9999;box-shadow:0 4px 8px #0003,0 6px 20px #00000030;background-color:#fff;width:max-content;max-width:350px}.dropdown-menu-container .list-group-item{border:0;padding:0}.dropdown-menu-container li.item-divider{border-top:1px solid #ddd!important}.dropdown-menu-container li a{width:100%;color:inherit;display:block;padding:.75rem;word-break:break-word}.dropdown-menu-container li.list-group-title strong{padding-left:.75rem}.dropdown-menu-container ul.child-list a{padding-left:1.5rem}.dropdown-menu-container li a:focus{box-shadow:none}.dropdown-menu-container li.list-group-item:hover,.dropdown-menu-container li.list-group-item a:focus{background-color:var(--vd-primary-dark);outline:none;color:#fff}.dropdown-menu-container .list-group-title{padding-top:.5rem}.dropdown-menu-container li.list-group-title:hover{background:none;color:inherit}.dropdown-menu-container li.list-group-title:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}\n"] }]
|
|
5926
5926
|
}], ctorParameters: () => [{ type: i1$1.Router }], propDecorators: { selectedFocusList: [{
|
|
5927
5927
|
type: ViewChildren,
|
|
5928
5928
|
args: ['selectedFocusList']
|
|
@@ -9196,11 +9196,11 @@ class FoehnDatePickerComponent {
|
|
|
9196
9196
|
return false;
|
|
9197
9197
|
}
|
|
9198
9198
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnDatePickerComponent, deps: [{ token: SdkDictionaryService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9199
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnDatePickerComponent, selector: "foehn-date-picker", inputs: { id: "id", name: "name", minYear: "minYear", maxYear: "maxYear", minDate: "minDate", maxDate: "maxDate", datepickerTriggerHtmlElement: "datepickerTriggerHtmlElement", closeable: "closeable", isDatepickerVisible: "isDatepickerVisible", model: "model" }, outputs: { modelChange: "modelChange", userInput: "userInput", isDatepickerVisibleChange: "isDatepickerVisibleChange" }, host: { listeners: { "keyup": "handleKeyboardUpEvent($event)", "keydown": "handleKeyboardDownEvent($event)" }, properties: { "attr.id": "this.hostId" } }, viewQueries: [{ propertyName: "daysButtonsElemRef", predicate: ["dayButtonElemRef"], descendants: true }], ngImport: i0, template: "<div\n [id]=\"buildId('datepicker_wrapper')\"\n class=\"datepicker_wrapper\"\n *ngIf=\"isDatepickerVisible\"\n [cdkTrapFocus]=\"!!datepickerTriggerHtmlElement\"\n tabindex=\"-1\"\n role=\"application\"\n [attr.aria-label]=\"\n 'foehn-date-picker.container.aria-label' | fromDictionary\n \"\n>\n <button\n *ngIf=\"closeable\"\n (click)=\"isDatepickerVisible = false\"\n type=\"button\"\n class=\"btn btn-close\"\n [attr.aria-label]=\"\n 'foehn-date-picker.close-button.aria-label' | fromDictionary\n \"\n [id]=\"buildId('closeButton')\"\n ></button>\n <div\n [id]=\"buildId('datepicker_header')\"\n class=\"d-flex justify-content-between datepicker_header\"\n >\n <ng-container *ngIf=\"currentMonthYear | async as monthYear\">\n <button\n [id]=\"buildId('previous-month')\"\n type=\"button\"\n class=\"btn btn-link datepicker-nav-month-btn\"\n (click)=\"previousMonth()\"\n [attr.disabled]=\"isPreviousMonthDisabled(monthYear)\"\n >\n <foehn-icon-chevron-left\n [title]=\"\n 'foehn-date-picker.previous-month-button.title'\n | fromDictionary\n \"\n ></foehn-icon-chevron-left>\n </button>\n <span\n [id]=\"buildId('month-year-label')\"\n aria-live=\"polite\"\n class=\"visually-hidden\"\n >\n {{\n 'foehn-date-picker.screen-reader.actual-month-displayed'\n | fromDictionary\n }}\n {{ getMonthAsReadable(monthYear.month) }} {{ monthYear.year }}\n </span>\n <foehn-select\n [id]=\"buildId('month-input')\"\n class=\"align-self-center month-input\"\n [label]=\"\n 'foehn-date-picker.screen-reader.month-input.label'\n | fromDictionary\n \"\n [isLabelSrOnly]=\"true\"\n [elements]=\"monthListItem\"\n [model]=\"monthYear.month\"\n [required]=\"true\"\n (userInput)=\"userInputMonth($event)\"\n ></foehn-select>\n <foehn-select\n [id]=\"buildId('year-input')\"\n class=\"align-self-center\"\n [label]=\"\n 'foehn-date-picker.screen-reader.year-input.label'\n | fromDictionary\n \"\n [isLabelSrOnly]=\"true\"\n [elements]=\"yearListItem\"\n [model]=\"monthYear.year\"\n [required]=\"true\"\n (userInput)=\"userInputYear($event)\"\n ></foehn-select>\n <button\n [id]=\"buildId('next-month')\"\n type=\"button\"\n class=\"btn btn-link datepicker-nav-month-btn\"\n (click)=\"nextMonth()\"\n [attr.disabled]=\"isNextMonthDisabled(monthYear)\"\n >\n <foehn-icon-chevron-right\n [title]=\"\n 'foehn-date-picker.next-month-button.title'\n | fromDictionary\n \"\n ></foehn-icon-chevron-right>\n </button>\n </ng-container>\n </div>\n <table\n [id]=\"buildId('datepicker_table')\"\n role=\"grid\"\n (focusin)=\"onDaysFocusin()\"\n (focusout)=\"onDaysFocusout()\"\n >\n <caption class=\"visually-hidden\">\n {{ 'foehn-date-picker.screen-reader.grid.title' | fromDictionary }}\n </caption>\n <thead role=\"presentation\" aria-hidden=\"true\">\n <tr role=\"row\">\n <th\n scope=\"col\"\n role=\"columnheader\"\n *ngFor=\"let weekday of weekDays\"\n >\n <foehn-abbr\n [text]=\"weekday.substring(0, 2)\"\n [title]=\"weekday\"\n ></foehn-abbr>\n </th>\n </tr>\n </thead>\n <tbody role=\"presentation\">\n <tr role=\"row\" *ngFor=\"let week of weeks; let indexRow = index\">\n <td\n role=\"gridcell\"\n *ngFor=\"let dayOfWeek of week; let indexColumn = index\"\n >\n <button\n type=\"button\"\n class=\"btn w-100\"\n #dayButtonElemRef\n [hidden]=\"!dayOfWeek.isCurrentMonth\"\n [id]=\"buildId('day_' + indexRow + '_' + indexColumn)\"\n [tabindex]=\"getDayTabIndex(dayOfWeek)\"\n [class.btn-info]=\"\n !isToday(dayOfWeek.date) &&\n !isSelected(dayOfWeek.date)\n \"\n [class.btn-secondary]=\"\n isToday(dayOfWeek.date) &&\n !isSelected(dayOfWeek.date)\n \"\n [class.btn-primary]=\"isSelected(dayOfWeek.date)\"\n [attr.aria-label]=\"\n weekDays[indexColumn] +\n ' ' +\n dayOfWeek.dateAsReadable\n \"\n [attr.data-is-today]=\"isToday(dayOfWeek.date)\"\n [attr.data-is-selected]=\"isSelected(dayOfWeek.date)\"\n [attr.data-row-index]=\"indexRow\"\n [attr.data-column-index]=\"indexColumn\"\n [attr.day-number]=\"dayOfWeek.dayOfMonth\"\n [attr.disabled]=\"getDayDisabledAttribute(dayOfWeek)\"\n (click)=\"handleUserInput(dayOfWeek.date)\"\n >\n {{ dayOfWeek.dayOfMonth }}\n </button>\n </td>\n </tr>\n </tbody>\n </table>\n</div>\n", styles: [":host ::ng-deep .btn-link .svg-inline--fa{color
|
|
9199
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnDatePickerComponent, selector: "foehn-date-picker", inputs: { id: "id", name: "name", minYear: "minYear", maxYear: "maxYear", minDate: "minDate", maxDate: "maxDate", datepickerTriggerHtmlElement: "datepickerTriggerHtmlElement", closeable: "closeable", isDatepickerVisible: "isDatepickerVisible", model: "model" }, outputs: { modelChange: "modelChange", userInput: "userInput", isDatepickerVisibleChange: "isDatepickerVisibleChange" }, host: { listeners: { "keyup": "handleKeyboardUpEvent($event)", "keydown": "handleKeyboardDownEvent($event)" }, properties: { "attr.id": "this.hostId" } }, viewQueries: [{ propertyName: "daysButtonsElemRef", predicate: ["dayButtonElemRef"], descendants: true }], ngImport: i0, template: "<div\n [id]=\"buildId('datepicker_wrapper')\"\n class=\"datepicker_wrapper\"\n *ngIf=\"isDatepickerVisible\"\n [cdkTrapFocus]=\"!!datepickerTriggerHtmlElement\"\n tabindex=\"-1\"\n role=\"application\"\n [attr.aria-label]=\"\n 'foehn-date-picker.container.aria-label' | fromDictionary\n \"\n>\n <button\n *ngIf=\"closeable\"\n (click)=\"isDatepickerVisible = false\"\n type=\"button\"\n class=\"btn btn-close\"\n [attr.aria-label]=\"\n 'foehn-date-picker.close-button.aria-label' | fromDictionary\n \"\n [id]=\"buildId('closeButton')\"\n ></button>\n <div\n [id]=\"buildId('datepicker_header')\"\n class=\"d-flex justify-content-between datepicker_header\"\n >\n <ng-container *ngIf=\"currentMonthYear | async as monthYear\">\n <button\n [id]=\"buildId('previous-month')\"\n type=\"button\"\n class=\"btn btn-link datepicker-nav-month-btn\"\n (click)=\"previousMonth()\"\n [attr.disabled]=\"isPreviousMonthDisabled(monthYear)\"\n >\n <foehn-icon-chevron-left\n [title]=\"\n 'foehn-date-picker.previous-month-button.title'\n | fromDictionary\n \"\n ></foehn-icon-chevron-left>\n </button>\n <span\n [id]=\"buildId('month-year-label')\"\n aria-live=\"polite\"\n class=\"visually-hidden\"\n >\n {{\n 'foehn-date-picker.screen-reader.actual-month-displayed'\n | fromDictionary\n }}\n {{ getMonthAsReadable(monthYear.month) }} {{ monthYear.year }}\n </span>\n <foehn-select\n [id]=\"buildId('month-input')\"\n class=\"align-self-center month-input\"\n [label]=\"\n 'foehn-date-picker.screen-reader.month-input.label'\n | fromDictionary\n \"\n [isLabelSrOnly]=\"true\"\n [elements]=\"monthListItem\"\n [model]=\"monthYear.month\"\n [required]=\"true\"\n (userInput)=\"userInputMonth($event)\"\n ></foehn-select>\n <foehn-select\n [id]=\"buildId('year-input')\"\n class=\"align-self-center\"\n [label]=\"\n 'foehn-date-picker.screen-reader.year-input.label'\n | fromDictionary\n \"\n [isLabelSrOnly]=\"true\"\n [elements]=\"yearListItem\"\n [model]=\"monthYear.year\"\n [required]=\"true\"\n (userInput)=\"userInputYear($event)\"\n ></foehn-select>\n <button\n [id]=\"buildId('next-month')\"\n type=\"button\"\n class=\"btn btn-link datepicker-nav-month-btn\"\n (click)=\"nextMonth()\"\n [attr.disabled]=\"isNextMonthDisabled(monthYear)\"\n >\n <foehn-icon-chevron-right\n [title]=\"\n 'foehn-date-picker.next-month-button.title'\n | fromDictionary\n \"\n ></foehn-icon-chevron-right>\n </button>\n </ng-container>\n </div>\n <table\n [id]=\"buildId('datepicker_table')\"\n role=\"grid\"\n (focusin)=\"onDaysFocusin()\"\n (focusout)=\"onDaysFocusout()\"\n >\n <caption class=\"visually-hidden\">\n {{ 'foehn-date-picker.screen-reader.grid.title' | fromDictionary }}\n </caption>\n <thead role=\"presentation\" aria-hidden=\"true\">\n <tr role=\"row\">\n <th\n scope=\"col\"\n role=\"columnheader\"\n *ngFor=\"let weekday of weekDays\"\n >\n <foehn-abbr\n [text]=\"weekday.substring(0, 2)\"\n [title]=\"weekday\"\n ></foehn-abbr>\n </th>\n </tr>\n </thead>\n <tbody role=\"presentation\">\n <tr role=\"row\" *ngFor=\"let week of weeks; let indexRow = index\">\n <td\n role=\"gridcell\"\n *ngFor=\"let dayOfWeek of week; let indexColumn = index\"\n >\n <button\n type=\"button\"\n class=\"btn w-100\"\n #dayButtonElemRef\n [hidden]=\"!dayOfWeek.isCurrentMonth\"\n [id]=\"buildId('day_' + indexRow + '_' + indexColumn)\"\n [tabindex]=\"getDayTabIndex(dayOfWeek)\"\n [class.btn-info]=\"\n !isToday(dayOfWeek.date) &&\n !isSelected(dayOfWeek.date)\n \"\n [class.btn-secondary]=\"\n isToday(dayOfWeek.date) &&\n !isSelected(dayOfWeek.date)\n \"\n [class.btn-primary]=\"isSelected(dayOfWeek.date)\"\n [attr.aria-label]=\"\n weekDays[indexColumn] +\n ' ' +\n dayOfWeek.dateAsReadable\n \"\n [attr.data-is-today]=\"isToday(dayOfWeek.date)\"\n [attr.data-is-selected]=\"isSelected(dayOfWeek.date)\"\n [attr.data-row-index]=\"indexRow\"\n [attr.data-column-index]=\"indexColumn\"\n [attr.day-number]=\"dayOfWeek.dayOfMonth\"\n [attr.disabled]=\"getDayDisabledAttribute(dayOfWeek)\"\n (click)=\"handleUserInput(dayOfWeek.date)\"\n >\n {{ dayOfWeek.dayOfMonth }}\n </button>\n </td>\n </tr>\n </tbody>\n </table>\n</div>\n", styles: [":host ::ng-deep .btn.btn-link .svg-inline--fa{color:var(--vd-primary-dark)}:host ::ng-deep .btn.btn-link:hover .svg-inline--fa{color:var(--vd-neutral-dark)}:host ::ng-deep thead th abbr[title]{text-decoration:underline dotted 1px!important}:host ::ng-deep foehn-select select.form-select{padding:0 0 0 3px;margin:0;height:30px;border-color:#aaa;background-image:none;appearance:auto!important;box-shadow:none}:host ::ng-deep foehn-select select.form-select:hover{border-color:#000;cursor:pointer}:host ::ng-deep foehn-select select.form-select:focus,:host ::ng-deep .btn:focus{box-shadow:0 0 0 2px var(--vd-focus)}:host ::ng-deep foehn-select .form-group{margin-bottom:0!important}.datepicker_header{margin:4px 0}.datepicker_wrapper{max-width:245px;min-width:224px;padding:4px;outline:1px solid #dfdfdf;background-color:#fff}.datepicker_wrapper .h4{margin-bottom:0}.datepicker_wrapper table{width:100%}.datepicker_wrapper thead th{text-align:center;font-weight:400}.datepicker_wrapper .btn{padding:2px 4px}:host ::ng-deep .datepicker_wrapper button.btn-close{position:absolute;right:-24px;top:-24px;background-color:#fff;border:1px solid #dfdfdf;border-radius:50%;width:31px;height:35px;opacity:1;scale:.7}.datepicker_wrapper .month-input{width:50%;margin-right:5px}.btn-info:disabled{cursor:not-allowed}.datepicker-nav-month-btn:disabled{opacity:.2}table tr td>button.btn-info:hover,table tr td>button.btn-secondary:hover,table tr td>button.btn-primary:hover{box-shadow:0 0 0 2px var(--vd-focus)}table tr td>button.btn-info:disabled{box-shadow:none;opacity:.3}table tr td>button.btn-info{background-color:var(--vd-neutral-light);border-color:var(--vd-neutral-light)}table tr td>button.btn-info:hover{background-color:var(--vd-neutral-lighter);border-color:var(--vd-neutral-lighter)}\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: "component", type: FoehnIconChevronLeftComponent, selector: "foehn-icon-chevron-left" }, { kind: "component", type: FoehnIconChevronRightComponent, selector: "foehn-icon-chevron-right" }, { kind: "directive", type: i2$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: FoehnSelectComponent, selector: "foehn-select", inputs: ["multiple", "noSelectionLabel"] }, { kind: "component", type: FoehnAbbrComponent, selector: "foehn-abbr", inputs: ["title", "text"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] }); }
|
|
9200
9200
|
}
|
|
9201
9201
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnDatePickerComponent, decorators: [{
|
|
9202
9202
|
type: Component,
|
|
9203
|
-
args: [{ selector: 'foehn-date-picker', template: "<div\n [id]=\"buildId('datepicker_wrapper')\"\n class=\"datepicker_wrapper\"\n *ngIf=\"isDatepickerVisible\"\n [cdkTrapFocus]=\"!!datepickerTriggerHtmlElement\"\n tabindex=\"-1\"\n role=\"application\"\n [attr.aria-label]=\"\n 'foehn-date-picker.container.aria-label' | fromDictionary\n \"\n>\n <button\n *ngIf=\"closeable\"\n (click)=\"isDatepickerVisible = false\"\n type=\"button\"\n class=\"btn btn-close\"\n [attr.aria-label]=\"\n 'foehn-date-picker.close-button.aria-label' | fromDictionary\n \"\n [id]=\"buildId('closeButton')\"\n ></button>\n <div\n [id]=\"buildId('datepicker_header')\"\n class=\"d-flex justify-content-between datepicker_header\"\n >\n <ng-container *ngIf=\"currentMonthYear | async as monthYear\">\n <button\n [id]=\"buildId('previous-month')\"\n type=\"button\"\n class=\"btn btn-link datepicker-nav-month-btn\"\n (click)=\"previousMonth()\"\n [attr.disabled]=\"isPreviousMonthDisabled(monthYear)\"\n >\n <foehn-icon-chevron-left\n [title]=\"\n 'foehn-date-picker.previous-month-button.title'\n | fromDictionary\n \"\n ></foehn-icon-chevron-left>\n </button>\n <span\n [id]=\"buildId('month-year-label')\"\n aria-live=\"polite\"\n class=\"visually-hidden\"\n >\n {{\n 'foehn-date-picker.screen-reader.actual-month-displayed'\n | fromDictionary\n }}\n {{ getMonthAsReadable(monthYear.month) }} {{ monthYear.year }}\n </span>\n <foehn-select\n [id]=\"buildId('month-input')\"\n class=\"align-self-center month-input\"\n [label]=\"\n 'foehn-date-picker.screen-reader.month-input.label'\n | fromDictionary\n \"\n [isLabelSrOnly]=\"true\"\n [elements]=\"monthListItem\"\n [model]=\"monthYear.month\"\n [required]=\"true\"\n (userInput)=\"userInputMonth($event)\"\n ></foehn-select>\n <foehn-select\n [id]=\"buildId('year-input')\"\n class=\"align-self-center\"\n [label]=\"\n 'foehn-date-picker.screen-reader.year-input.label'\n | fromDictionary\n \"\n [isLabelSrOnly]=\"true\"\n [elements]=\"yearListItem\"\n [model]=\"monthYear.year\"\n [required]=\"true\"\n (userInput)=\"userInputYear($event)\"\n ></foehn-select>\n <button\n [id]=\"buildId('next-month')\"\n type=\"button\"\n class=\"btn btn-link datepicker-nav-month-btn\"\n (click)=\"nextMonth()\"\n [attr.disabled]=\"isNextMonthDisabled(monthYear)\"\n >\n <foehn-icon-chevron-right\n [title]=\"\n 'foehn-date-picker.next-month-button.title'\n | fromDictionary\n \"\n ></foehn-icon-chevron-right>\n </button>\n </ng-container>\n </div>\n <table\n [id]=\"buildId('datepicker_table')\"\n role=\"grid\"\n (focusin)=\"onDaysFocusin()\"\n (focusout)=\"onDaysFocusout()\"\n >\n <caption class=\"visually-hidden\">\n {{ 'foehn-date-picker.screen-reader.grid.title' | fromDictionary }}\n </caption>\n <thead role=\"presentation\" aria-hidden=\"true\">\n <tr role=\"row\">\n <th\n scope=\"col\"\n role=\"columnheader\"\n *ngFor=\"let weekday of weekDays\"\n >\n <foehn-abbr\n [text]=\"weekday.substring(0, 2)\"\n [title]=\"weekday\"\n ></foehn-abbr>\n </th>\n </tr>\n </thead>\n <tbody role=\"presentation\">\n <tr role=\"row\" *ngFor=\"let week of weeks; let indexRow = index\">\n <td\n role=\"gridcell\"\n *ngFor=\"let dayOfWeek of week; let indexColumn = index\"\n >\n <button\n type=\"button\"\n class=\"btn w-100\"\n #dayButtonElemRef\n [hidden]=\"!dayOfWeek.isCurrentMonth\"\n [id]=\"buildId('day_' + indexRow + '_' + indexColumn)\"\n [tabindex]=\"getDayTabIndex(dayOfWeek)\"\n [class.btn-info]=\"\n !isToday(dayOfWeek.date) &&\n !isSelected(dayOfWeek.date)\n \"\n [class.btn-secondary]=\"\n isToday(dayOfWeek.date) &&\n !isSelected(dayOfWeek.date)\n \"\n [class.btn-primary]=\"isSelected(dayOfWeek.date)\"\n [attr.aria-label]=\"\n weekDays[indexColumn] +\n ' ' +\n dayOfWeek.dateAsReadable\n \"\n [attr.data-is-today]=\"isToday(dayOfWeek.date)\"\n [attr.data-is-selected]=\"isSelected(dayOfWeek.date)\"\n [attr.data-row-index]=\"indexRow\"\n [attr.data-column-index]=\"indexColumn\"\n [attr.day-number]=\"dayOfWeek.dayOfMonth\"\n [attr.disabled]=\"getDayDisabledAttribute(dayOfWeek)\"\n (click)=\"handleUserInput(dayOfWeek.date)\"\n >\n {{ dayOfWeek.dayOfMonth }}\n </button>\n </td>\n </tr>\n </tbody>\n </table>\n</div>\n", styles: [":host ::ng-deep .btn-link .svg-inline--fa{color
|
|
9203
|
+
args: [{ selector: 'foehn-date-picker', template: "<div\n [id]=\"buildId('datepicker_wrapper')\"\n class=\"datepicker_wrapper\"\n *ngIf=\"isDatepickerVisible\"\n [cdkTrapFocus]=\"!!datepickerTriggerHtmlElement\"\n tabindex=\"-1\"\n role=\"application\"\n [attr.aria-label]=\"\n 'foehn-date-picker.container.aria-label' | fromDictionary\n \"\n>\n <button\n *ngIf=\"closeable\"\n (click)=\"isDatepickerVisible = false\"\n type=\"button\"\n class=\"btn btn-close\"\n [attr.aria-label]=\"\n 'foehn-date-picker.close-button.aria-label' | fromDictionary\n \"\n [id]=\"buildId('closeButton')\"\n ></button>\n <div\n [id]=\"buildId('datepicker_header')\"\n class=\"d-flex justify-content-between datepicker_header\"\n >\n <ng-container *ngIf=\"currentMonthYear | async as monthYear\">\n <button\n [id]=\"buildId('previous-month')\"\n type=\"button\"\n class=\"btn btn-link datepicker-nav-month-btn\"\n (click)=\"previousMonth()\"\n [attr.disabled]=\"isPreviousMonthDisabled(monthYear)\"\n >\n <foehn-icon-chevron-left\n [title]=\"\n 'foehn-date-picker.previous-month-button.title'\n | fromDictionary\n \"\n ></foehn-icon-chevron-left>\n </button>\n <span\n [id]=\"buildId('month-year-label')\"\n aria-live=\"polite\"\n class=\"visually-hidden\"\n >\n {{\n 'foehn-date-picker.screen-reader.actual-month-displayed'\n | fromDictionary\n }}\n {{ getMonthAsReadable(monthYear.month) }} {{ monthYear.year }}\n </span>\n <foehn-select\n [id]=\"buildId('month-input')\"\n class=\"align-self-center month-input\"\n [label]=\"\n 'foehn-date-picker.screen-reader.month-input.label'\n | fromDictionary\n \"\n [isLabelSrOnly]=\"true\"\n [elements]=\"monthListItem\"\n [model]=\"monthYear.month\"\n [required]=\"true\"\n (userInput)=\"userInputMonth($event)\"\n ></foehn-select>\n <foehn-select\n [id]=\"buildId('year-input')\"\n class=\"align-self-center\"\n [label]=\"\n 'foehn-date-picker.screen-reader.year-input.label'\n | fromDictionary\n \"\n [isLabelSrOnly]=\"true\"\n [elements]=\"yearListItem\"\n [model]=\"monthYear.year\"\n [required]=\"true\"\n (userInput)=\"userInputYear($event)\"\n ></foehn-select>\n <button\n [id]=\"buildId('next-month')\"\n type=\"button\"\n class=\"btn btn-link datepicker-nav-month-btn\"\n (click)=\"nextMonth()\"\n [attr.disabled]=\"isNextMonthDisabled(monthYear)\"\n >\n <foehn-icon-chevron-right\n [title]=\"\n 'foehn-date-picker.next-month-button.title'\n | fromDictionary\n \"\n ></foehn-icon-chevron-right>\n </button>\n </ng-container>\n </div>\n <table\n [id]=\"buildId('datepicker_table')\"\n role=\"grid\"\n (focusin)=\"onDaysFocusin()\"\n (focusout)=\"onDaysFocusout()\"\n >\n <caption class=\"visually-hidden\">\n {{ 'foehn-date-picker.screen-reader.grid.title' | fromDictionary }}\n </caption>\n <thead role=\"presentation\" aria-hidden=\"true\">\n <tr role=\"row\">\n <th\n scope=\"col\"\n role=\"columnheader\"\n *ngFor=\"let weekday of weekDays\"\n >\n <foehn-abbr\n [text]=\"weekday.substring(0, 2)\"\n [title]=\"weekday\"\n ></foehn-abbr>\n </th>\n </tr>\n </thead>\n <tbody role=\"presentation\">\n <tr role=\"row\" *ngFor=\"let week of weeks; let indexRow = index\">\n <td\n role=\"gridcell\"\n *ngFor=\"let dayOfWeek of week; let indexColumn = index\"\n >\n <button\n type=\"button\"\n class=\"btn w-100\"\n #dayButtonElemRef\n [hidden]=\"!dayOfWeek.isCurrentMonth\"\n [id]=\"buildId('day_' + indexRow + '_' + indexColumn)\"\n [tabindex]=\"getDayTabIndex(dayOfWeek)\"\n [class.btn-info]=\"\n !isToday(dayOfWeek.date) &&\n !isSelected(dayOfWeek.date)\n \"\n [class.btn-secondary]=\"\n isToday(dayOfWeek.date) &&\n !isSelected(dayOfWeek.date)\n \"\n [class.btn-primary]=\"isSelected(dayOfWeek.date)\"\n [attr.aria-label]=\"\n weekDays[indexColumn] +\n ' ' +\n dayOfWeek.dateAsReadable\n \"\n [attr.data-is-today]=\"isToday(dayOfWeek.date)\"\n [attr.data-is-selected]=\"isSelected(dayOfWeek.date)\"\n [attr.data-row-index]=\"indexRow\"\n [attr.data-column-index]=\"indexColumn\"\n [attr.day-number]=\"dayOfWeek.dayOfMonth\"\n [attr.disabled]=\"getDayDisabledAttribute(dayOfWeek)\"\n (click)=\"handleUserInput(dayOfWeek.date)\"\n >\n {{ dayOfWeek.dayOfMonth }}\n </button>\n </td>\n </tr>\n </tbody>\n </table>\n</div>\n", styles: [":host ::ng-deep .btn.btn-link .svg-inline--fa{color:var(--vd-primary-dark)}:host ::ng-deep .btn.btn-link:hover .svg-inline--fa{color:var(--vd-neutral-dark)}:host ::ng-deep thead th abbr[title]{text-decoration:underline dotted 1px!important}:host ::ng-deep foehn-select select.form-select{padding:0 0 0 3px;margin:0;height:30px;border-color:#aaa;background-image:none;appearance:auto!important;box-shadow:none}:host ::ng-deep foehn-select select.form-select:hover{border-color:#000;cursor:pointer}:host ::ng-deep foehn-select select.form-select:focus,:host ::ng-deep .btn:focus{box-shadow:0 0 0 2px var(--vd-focus)}:host ::ng-deep foehn-select .form-group{margin-bottom:0!important}.datepicker_header{margin:4px 0}.datepicker_wrapper{max-width:245px;min-width:224px;padding:4px;outline:1px solid #dfdfdf;background-color:#fff}.datepicker_wrapper .h4{margin-bottom:0}.datepicker_wrapper table{width:100%}.datepicker_wrapper thead th{text-align:center;font-weight:400}.datepicker_wrapper .btn{padding:2px 4px}:host ::ng-deep .datepicker_wrapper button.btn-close{position:absolute;right:-24px;top:-24px;background-color:#fff;border:1px solid #dfdfdf;border-radius:50%;width:31px;height:35px;opacity:1;scale:.7}.datepicker_wrapper .month-input{width:50%;margin-right:5px}.btn-info:disabled{cursor:not-allowed}.datepicker-nav-month-btn:disabled{opacity:.2}table tr td>button.btn-info:hover,table tr td>button.btn-secondary:hover,table tr td>button.btn-primary:hover{box-shadow:0 0 0 2px var(--vd-focus)}table tr td>button.btn-info:disabled{box-shadow:none;opacity:.3}table tr td>button.btn-info{background-color:var(--vd-neutral-light);border-color:var(--vd-neutral-light)}table tr td>button.btn-info:hover{background-color:var(--vd-neutral-lighter);border-color:var(--vd-neutral-lighter)}\n"] }]
|
|
9204
9204
|
}], ctorParameters: () => [{ type: SdkDictionaryService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }], propDecorators: { id: [{
|
|
9205
9205
|
type: Input
|
|
9206
9206
|
}], name: [{
|
|
@@ -11605,7 +11605,7 @@ class FoehnMultiselectAutocompleteComponent extends FoehnAutocompleteComponent {
|
|
|
11605
11605
|
useExisting: forwardRef(() => FoehnMultiselectAutocompleteComponent),
|
|
11606
11606
|
multi: true
|
|
11607
11607
|
}
|
|
11608
|
-
], viewQueries: [{ propertyName: "autocompleteComponent", first: true, predicate: ["autocompleteComponent"], descendants: true }, { propertyName: "alertMessageContainer", first: true, predicate: ["alertMessageContainer"], descendants: true }, { propertyName: "defaultDeleteFocusArea", first: true, predicate: ["defaultDeleteFocusArea"], descendants: true }, { propertyName: "selectedElemRef", predicate: ["selectedElemRef"], descendants: true }, { propertyName: "defaultElemRef", predicate: ["defaultElemRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n class=\"form-group container-box\"\n [class.has-danger]=\"hasErrorsToDisplay()\"\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n>\n <foehn-autocomplete\n #autocompleteComponent\n [name]=\"name\"\n [label]=\"label\"\n [elements]=\"elements\"\n [elementsUrl]=\"elementsUrl\"\n [elementValue]=\"elementValue\"\n [elementLabel]=\"elementLabel\"\n [elementSuggestionLabel]=\"elementSuggestionLabel\"\n [elementValueIdentity]=\"elementValueIdentity\"\n [elementDisabled]=\"elementDisabled\"\n [elementGroup]=\"elementGroup\"\n [allowCustomValue]=\"false\"\n [searchValueMinCharsCount]=\"searchValueMinCharsCount\"\n [customValueModelGenerator]=\"customValueModelGenerator\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n (userInput)=\"addItem($event)\"\n [(model)]=\"autocompleteInputValue\"\n (elementsLoaded)=\"onAutocompleteElementsLoaded($event)\"\n [showErrorWhenDisabled]=\"showErrorWhenDisabled\"\n [hideNotRequiredExtraLabel]=\"hideNotRequiredExtraLabel\"\n [itemHeightInSuggestionListInPx]=\"itemHeightInSuggestionListInPx\"\n [caseSensitiveSearch]=\"caseSensitiveSearch\"\n >\n <small\n *ngIf=\"!showEmptyListMessage\"\n [attr.id]=\"buildChildId('Help')\"\n class=\"form-text text-secondary\"\n [innerHTML]=\"\n helpText\n ? helpText\n : ('foehn-multiselect-autocomplete.autocomplete.screen-reader.label'\n | fromDictionary)\n \"\n ></small>\n\n <ng-content></ng-content>\n\n <div\n [id]=\"buildChildId('AlertMessageContainer')\"\n role=\"status\"\n #alertMessageContainer\n >\n <p\n *ngIf=\"showEmptyListMessage\"\n class=\"alert alert-info mb-0\"\n tabindex=\"0\"\n >\n {{\n 'foehn-multiselect-autocomplete.autocomplete.empty-message'\n | fromDictionary\n }}\n </p>\n </div>\n </foehn-autocomplete>\n\n <div class=\"selected-list-container pt-2\" tabindex=\"-1\">\n <small\n *ngIf=\"hasDefaultDeleteFocusArea()\"\n class=\"form-text text-secondary my-0\"\n [tabindex]=\"0\"\n [innerHTML]=\"noElementsSelectedLabel | fromDictionary\"\n #defaultDeleteFocusArea\n ></small>\n\n <p\n [id]=\"buildChildId('srOnlyAnnouncements')\"\n class=\"visually-hidden\"\n aria-live=\"polite\"\n aria-atomic=\"true\"\n >\n {{ srAnnouncements }}\n </p>\n\n <fieldset\n *ngIf=\"!!model?.length\"\n class=\"mb-0\"\n [attr.aria-describedby]=\"buildChildId('Label')\"\n >\n <legend\n [id]=\"buildChildId('Legend')\"\n class=\"form-text text-secondary small mb-0\"\n [innerHTML]=\"selectedItemsListLegend | fromDictionary\"\n ></legend>\n\n <div class=\"selected-list d-flex align-content-stretch flex-wrap\">\n <ng-container\n *ngFor=\"\n let element of model;\n let index = index;\n trackBy: trackByFn\n \"\n >\n <span\n *ngIf=\"!canBeDeleted(index)\"\n class=\"badge rounded-pill bg-secondary me-1 mb-1 py-2 px-3 d-flex align-items-center\"\n [tabindex]=\"disabled ? -1 : 0\"\n [attr.aria-describedby]=\"buildChildId('Legend')\"\n #defaultElemRef\n >\n {{ getBadgeLabel(element) }}\n <span class=\"visually-hidden\">\n {{\n 'foehn-multiselect-autocomplete.sr-default-selected-element'\n | fromDictionary\n }}\n </span>\n </span>\n <button\n *ngIf=\"canBeDeleted(index)\"\n type=\"button\"\n class=\"btn btn-primary badge rounded-pill me-1 mb-1 py-2 px-3 d-flex align-items-center\"\n [tabindex]=\"0\"\n [attr.aria-label]=\"getDeleteButtonAriaLabel(element)\"\n [attr.aria-describedby]=\"buildChildId('Legend')\"\n [title]=\"getDeleteButtonAriaLabel(element)\"\n (click)=\"removeItem(element, index)\"\n #selectedElemRef\n >\n {{ getBadgeLabel(element) }}\n <foehn-icon-times\n aria-hidden=\"true\"\n class=\"ms-2\"\n [title]=\"getDeleteButtonAriaLabel(element)\"\n ></foehn-icon-times>\n </button>\n </ng-container>\n </div>\n </fieldset>\n </div>\n</div>\n", styles: ["foehn-autocomplete p.alert:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}:host ::ng-deep foehn-autocomplete .form-group{margin-bottom:0!important}.selected-list-container
|
|
11608
|
+
], viewQueries: [{ propertyName: "autocompleteComponent", first: true, predicate: ["autocompleteComponent"], descendants: true }, { propertyName: "alertMessageContainer", first: true, predicate: ["alertMessageContainer"], descendants: true }, { propertyName: "defaultDeleteFocusArea", first: true, predicate: ["defaultDeleteFocusArea"], descendants: true }, { propertyName: "selectedElemRef", predicate: ["selectedElemRef"], descendants: true }, { propertyName: "defaultElemRef", predicate: ["defaultElemRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n class=\"form-group container-box\"\n [class.has-danger]=\"hasErrorsToDisplay()\"\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n>\n <foehn-autocomplete\n #autocompleteComponent\n [name]=\"name\"\n [label]=\"label\"\n [elements]=\"elements\"\n [elementsUrl]=\"elementsUrl\"\n [elementValue]=\"elementValue\"\n [elementLabel]=\"elementLabel\"\n [elementSuggestionLabel]=\"elementSuggestionLabel\"\n [elementValueIdentity]=\"elementValueIdentity\"\n [elementDisabled]=\"elementDisabled\"\n [elementGroup]=\"elementGroup\"\n [allowCustomValue]=\"false\"\n [searchValueMinCharsCount]=\"searchValueMinCharsCount\"\n [customValueModelGenerator]=\"customValueModelGenerator\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n (userInput)=\"addItem($event)\"\n [(model)]=\"autocompleteInputValue\"\n (elementsLoaded)=\"onAutocompleteElementsLoaded($event)\"\n [showErrorWhenDisabled]=\"showErrorWhenDisabled\"\n [hideNotRequiredExtraLabel]=\"hideNotRequiredExtraLabel\"\n [itemHeightInSuggestionListInPx]=\"itemHeightInSuggestionListInPx\"\n [caseSensitiveSearch]=\"caseSensitiveSearch\"\n >\n <small\n *ngIf=\"!showEmptyListMessage\"\n [attr.id]=\"buildChildId('Help')\"\n class=\"form-text text-secondary\"\n [innerHTML]=\"\n helpText\n ? helpText\n : ('foehn-multiselect-autocomplete.autocomplete.screen-reader.label'\n | fromDictionary)\n \"\n ></small>\n\n <ng-content></ng-content>\n\n <div\n [id]=\"buildChildId('AlertMessageContainer')\"\n role=\"status\"\n #alertMessageContainer\n >\n <p\n *ngIf=\"showEmptyListMessage\"\n class=\"alert alert-info mb-0\"\n tabindex=\"0\"\n >\n {{\n 'foehn-multiselect-autocomplete.autocomplete.empty-message'\n | fromDictionary\n }}\n </p>\n </div>\n </foehn-autocomplete>\n\n <div class=\"selected-list-container pt-2\" tabindex=\"-1\">\n <small\n *ngIf=\"hasDefaultDeleteFocusArea()\"\n class=\"form-text text-secondary my-0\"\n [tabindex]=\"0\"\n [innerHTML]=\"noElementsSelectedLabel | fromDictionary\"\n #defaultDeleteFocusArea\n ></small>\n\n <p\n [id]=\"buildChildId('srOnlyAnnouncements')\"\n class=\"visually-hidden\"\n aria-live=\"polite\"\n aria-atomic=\"true\"\n >\n {{ srAnnouncements }}\n </p>\n\n <fieldset\n *ngIf=\"!!model?.length\"\n class=\"mb-0\"\n [attr.aria-describedby]=\"buildChildId('Label')\"\n >\n <legend\n [id]=\"buildChildId('Legend')\"\n class=\"form-text text-secondary small mb-0\"\n [innerHTML]=\"selectedItemsListLegend | fromDictionary\"\n ></legend>\n\n <div class=\"selected-list d-flex align-content-stretch flex-wrap\">\n <ng-container\n *ngFor=\"\n let element of model;\n let index = index;\n trackBy: trackByFn\n \"\n >\n <span\n *ngIf=\"!canBeDeleted(index)\"\n class=\"badge rounded-pill bg-secondary me-1 mb-1 py-2 px-3 d-flex align-items-center\"\n [tabindex]=\"disabled ? -1 : 0\"\n [attr.aria-describedby]=\"buildChildId('Legend')\"\n #defaultElemRef\n >\n {{ getBadgeLabel(element) }}\n <span class=\"visually-hidden\">\n {{\n 'foehn-multiselect-autocomplete.sr-default-selected-element'\n | fromDictionary\n }}\n </span>\n </span>\n <button\n *ngIf=\"canBeDeleted(index)\"\n type=\"button\"\n class=\"btn btn-primary badge rounded-pill me-1 mb-1 py-2 px-3 d-flex align-items-center\"\n [tabindex]=\"0\"\n [attr.aria-label]=\"getDeleteButtonAriaLabel(element)\"\n [attr.aria-describedby]=\"buildChildId('Legend')\"\n [title]=\"getDeleteButtonAriaLabel(element)\"\n (click)=\"removeItem(element, index)\"\n #selectedElemRef\n >\n {{ getBadgeLabel(element) }}\n <foehn-icon-times\n aria-hidden=\"true\"\n class=\"ms-2\"\n [title]=\"getDeleteButtonAriaLabel(element)\"\n ></foehn-icon-times>\n </button>\n </ng-container>\n </div>\n </fieldset>\n </div>\n</div>\n", styles: ["foehn-autocomplete p.alert:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}:host ::ng-deep foehn-autocomplete .form-group{margin-bottom:0!important}.selected-list-container .btn{text-transform:none}:host ::ng-deep .btn .svg-inline--fa{color:#fff!important}.selected-list-container span.rounded-pill:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}.container-box{border:1px solid #ededed;background-color:#fbfbfb;padding:.5rem}.container-box.vd-form-group-danger{border-left:5px solid var(--vd-danger);padding-left:1rem}:host ::ng-deep foehn-autocomplete div.vd-form-group-danger{border-left:0;padding-left:0}\n"], dependencies: [{ kind: "component", type: FoehnAutocompleteComponent, selector: "foehn-autocomplete", inputs: ["searchValueMinCharsCount", "allowCustomValue", "isSuggestionListDynamic", "customValueModelGenerator", "itemHeightInSuggestionListInPx", "elementSuggestionLabel", "caseSensitiveSearch", "disabled"], outputs: ["userSearchInput"] }, { 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: FoehnIconTimesComponent, selector: "foehn-icon-times" }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] }); }
|
|
11609
11609
|
}
|
|
11610
11610
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnMultiselectAutocompleteComponent, decorators: [{
|
|
11611
11611
|
type: Component,
|
|
@@ -11615,7 +11615,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImpor
|
|
|
11615
11615
|
useExisting: forwardRef(() => FoehnMultiselectAutocompleteComponent),
|
|
11616
11616
|
multi: true
|
|
11617
11617
|
}
|
|
11618
|
-
], template: "<div\n class=\"form-group container-box\"\n [class.has-danger]=\"hasErrorsToDisplay()\"\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n>\n <foehn-autocomplete\n #autocompleteComponent\n [name]=\"name\"\n [label]=\"label\"\n [elements]=\"elements\"\n [elementsUrl]=\"elementsUrl\"\n [elementValue]=\"elementValue\"\n [elementLabel]=\"elementLabel\"\n [elementSuggestionLabel]=\"elementSuggestionLabel\"\n [elementValueIdentity]=\"elementValueIdentity\"\n [elementDisabled]=\"elementDisabled\"\n [elementGroup]=\"elementGroup\"\n [allowCustomValue]=\"false\"\n [searchValueMinCharsCount]=\"searchValueMinCharsCount\"\n [customValueModelGenerator]=\"customValueModelGenerator\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n (userInput)=\"addItem($event)\"\n [(model)]=\"autocompleteInputValue\"\n (elementsLoaded)=\"onAutocompleteElementsLoaded($event)\"\n [showErrorWhenDisabled]=\"showErrorWhenDisabled\"\n [hideNotRequiredExtraLabel]=\"hideNotRequiredExtraLabel\"\n [itemHeightInSuggestionListInPx]=\"itemHeightInSuggestionListInPx\"\n [caseSensitiveSearch]=\"caseSensitiveSearch\"\n >\n <small\n *ngIf=\"!showEmptyListMessage\"\n [attr.id]=\"buildChildId('Help')\"\n class=\"form-text text-secondary\"\n [innerHTML]=\"\n helpText\n ? helpText\n : ('foehn-multiselect-autocomplete.autocomplete.screen-reader.label'\n | fromDictionary)\n \"\n ></small>\n\n <ng-content></ng-content>\n\n <div\n [id]=\"buildChildId('AlertMessageContainer')\"\n role=\"status\"\n #alertMessageContainer\n >\n <p\n *ngIf=\"showEmptyListMessage\"\n class=\"alert alert-info mb-0\"\n tabindex=\"0\"\n >\n {{\n 'foehn-multiselect-autocomplete.autocomplete.empty-message'\n | fromDictionary\n }}\n </p>\n </div>\n </foehn-autocomplete>\n\n <div class=\"selected-list-container pt-2\" tabindex=\"-1\">\n <small\n *ngIf=\"hasDefaultDeleteFocusArea()\"\n class=\"form-text text-secondary my-0\"\n [tabindex]=\"0\"\n [innerHTML]=\"noElementsSelectedLabel | fromDictionary\"\n #defaultDeleteFocusArea\n ></small>\n\n <p\n [id]=\"buildChildId('srOnlyAnnouncements')\"\n class=\"visually-hidden\"\n aria-live=\"polite\"\n aria-atomic=\"true\"\n >\n {{ srAnnouncements }}\n </p>\n\n <fieldset\n *ngIf=\"!!model?.length\"\n class=\"mb-0\"\n [attr.aria-describedby]=\"buildChildId('Label')\"\n >\n <legend\n [id]=\"buildChildId('Legend')\"\n class=\"form-text text-secondary small mb-0\"\n [innerHTML]=\"selectedItemsListLegend | fromDictionary\"\n ></legend>\n\n <div class=\"selected-list d-flex align-content-stretch flex-wrap\">\n <ng-container\n *ngFor=\"\n let element of model;\n let index = index;\n trackBy: trackByFn\n \"\n >\n <span\n *ngIf=\"!canBeDeleted(index)\"\n class=\"badge rounded-pill bg-secondary me-1 mb-1 py-2 px-3 d-flex align-items-center\"\n [tabindex]=\"disabled ? -1 : 0\"\n [attr.aria-describedby]=\"buildChildId('Legend')\"\n #defaultElemRef\n >\n {{ getBadgeLabel(element) }}\n <span class=\"visually-hidden\">\n {{\n 'foehn-multiselect-autocomplete.sr-default-selected-element'\n | fromDictionary\n }}\n </span>\n </span>\n <button\n *ngIf=\"canBeDeleted(index)\"\n type=\"button\"\n class=\"btn btn-primary badge rounded-pill me-1 mb-1 py-2 px-3 d-flex align-items-center\"\n [tabindex]=\"0\"\n [attr.aria-label]=\"getDeleteButtonAriaLabel(element)\"\n [attr.aria-describedby]=\"buildChildId('Legend')\"\n [title]=\"getDeleteButtonAriaLabel(element)\"\n (click)=\"removeItem(element, index)\"\n #selectedElemRef\n >\n {{ getBadgeLabel(element) }}\n <foehn-icon-times\n aria-hidden=\"true\"\n class=\"ms-2\"\n [title]=\"getDeleteButtonAriaLabel(element)\"\n ></foehn-icon-times>\n </button>\n </ng-container>\n </div>\n </fieldset>\n </div>\n</div>\n", styles: ["foehn-autocomplete p.alert:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}:host ::ng-deep foehn-autocomplete .form-group{margin-bottom:0!important}.selected-list-container
|
|
11618
|
+
], template: "<div\n class=\"form-group container-box\"\n [class.has-danger]=\"hasErrorsToDisplay()\"\n [class.vd-form-group-danger]=\"hasErrorsToDisplay()\"\n>\n <foehn-autocomplete\n #autocompleteComponent\n [name]=\"name\"\n [label]=\"label\"\n [elements]=\"elements\"\n [elementsUrl]=\"elementsUrl\"\n [elementValue]=\"elementValue\"\n [elementLabel]=\"elementLabel\"\n [elementSuggestionLabel]=\"elementSuggestionLabel\"\n [elementValueIdentity]=\"elementValueIdentity\"\n [elementDisabled]=\"elementDisabled\"\n [elementGroup]=\"elementGroup\"\n [allowCustomValue]=\"false\"\n [searchValueMinCharsCount]=\"searchValueMinCharsCount\"\n [customValueModelGenerator]=\"customValueModelGenerator\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n (userInput)=\"addItem($event)\"\n [(model)]=\"autocompleteInputValue\"\n (elementsLoaded)=\"onAutocompleteElementsLoaded($event)\"\n [showErrorWhenDisabled]=\"showErrorWhenDisabled\"\n [hideNotRequiredExtraLabel]=\"hideNotRequiredExtraLabel\"\n [itemHeightInSuggestionListInPx]=\"itemHeightInSuggestionListInPx\"\n [caseSensitiveSearch]=\"caseSensitiveSearch\"\n >\n <small\n *ngIf=\"!showEmptyListMessage\"\n [attr.id]=\"buildChildId('Help')\"\n class=\"form-text text-secondary\"\n [innerHTML]=\"\n helpText\n ? helpText\n : ('foehn-multiselect-autocomplete.autocomplete.screen-reader.label'\n | fromDictionary)\n \"\n ></small>\n\n <ng-content></ng-content>\n\n <div\n [id]=\"buildChildId('AlertMessageContainer')\"\n role=\"status\"\n #alertMessageContainer\n >\n <p\n *ngIf=\"showEmptyListMessage\"\n class=\"alert alert-info mb-0\"\n tabindex=\"0\"\n >\n {{\n 'foehn-multiselect-autocomplete.autocomplete.empty-message'\n | fromDictionary\n }}\n </p>\n </div>\n </foehn-autocomplete>\n\n <div class=\"selected-list-container pt-2\" tabindex=\"-1\">\n <small\n *ngIf=\"hasDefaultDeleteFocusArea()\"\n class=\"form-text text-secondary my-0\"\n [tabindex]=\"0\"\n [innerHTML]=\"noElementsSelectedLabel | fromDictionary\"\n #defaultDeleteFocusArea\n ></small>\n\n <p\n [id]=\"buildChildId('srOnlyAnnouncements')\"\n class=\"visually-hidden\"\n aria-live=\"polite\"\n aria-atomic=\"true\"\n >\n {{ srAnnouncements }}\n </p>\n\n <fieldset\n *ngIf=\"!!model?.length\"\n class=\"mb-0\"\n [attr.aria-describedby]=\"buildChildId('Label')\"\n >\n <legend\n [id]=\"buildChildId('Legend')\"\n class=\"form-text text-secondary small mb-0\"\n [innerHTML]=\"selectedItemsListLegend | fromDictionary\"\n ></legend>\n\n <div class=\"selected-list d-flex align-content-stretch flex-wrap\">\n <ng-container\n *ngFor=\"\n let element of model;\n let index = index;\n trackBy: trackByFn\n \"\n >\n <span\n *ngIf=\"!canBeDeleted(index)\"\n class=\"badge rounded-pill bg-secondary me-1 mb-1 py-2 px-3 d-flex align-items-center\"\n [tabindex]=\"disabled ? -1 : 0\"\n [attr.aria-describedby]=\"buildChildId('Legend')\"\n #defaultElemRef\n >\n {{ getBadgeLabel(element) }}\n <span class=\"visually-hidden\">\n {{\n 'foehn-multiselect-autocomplete.sr-default-selected-element'\n | fromDictionary\n }}\n </span>\n </span>\n <button\n *ngIf=\"canBeDeleted(index)\"\n type=\"button\"\n class=\"btn btn-primary badge rounded-pill me-1 mb-1 py-2 px-3 d-flex align-items-center\"\n [tabindex]=\"0\"\n [attr.aria-label]=\"getDeleteButtonAriaLabel(element)\"\n [attr.aria-describedby]=\"buildChildId('Legend')\"\n [title]=\"getDeleteButtonAriaLabel(element)\"\n (click)=\"removeItem(element, index)\"\n #selectedElemRef\n >\n {{ getBadgeLabel(element) }}\n <foehn-icon-times\n aria-hidden=\"true\"\n class=\"ms-2\"\n [title]=\"getDeleteButtonAriaLabel(element)\"\n ></foehn-icon-times>\n </button>\n </ng-container>\n </div>\n </fieldset>\n </div>\n</div>\n", styles: ["foehn-autocomplete p.alert:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}:host ::ng-deep foehn-autocomplete .form-group{margin-bottom:0!important}.selected-list-container .btn{text-transform:none}:host ::ng-deep .btn .svg-inline--fa{color:#fff!important}.selected-list-container span.rounded-pill:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}.container-box{border:1px solid #ededed;background-color:#fbfbfb;padding:.5rem}.container-box.vd-form-group-danger{border-left:5px solid var(--vd-danger);padding-left:1rem}:host ::ng-deep foehn-autocomplete div.vd-form-group-danger{border-left:0;padding-left:0}\n"] }]
|
|
11619
11619
|
}], ctorParameters: () => [{ type: i0.NgZone }, { type: SdkDictionaryService }], propDecorators: { hostName: [{
|
|
11620
11620
|
type: HostBinding,
|
|
11621
11621
|
args: ['attr.name']
|
|
@@ -12247,11 +12247,11 @@ class FoehnNavigationComponent extends AbstractFoehnNavigationComponent {
|
|
|
12247
12247
|
return this.navigationService.isLinearRouting();
|
|
12248
12248
|
}
|
|
12249
12249
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnNavigationComponent, deps: [{ token: FoehnNavigationService }, { token: i1$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12250
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnNavigationComponent, selector: "foehn-navigation", inputs: { transmitLabel: "transmitLabel" }, usesInheritance: true, ngImport: i0, template: "<gesdem-action-recovery-registration\n *ngIf=\"showContinueLaterButton\"\n [continueLaterLabel]=\"continueLaterLabel | fromDictionary\"\n [continueLaterAlreadyRegisteredLabel]=\"\n continueLaterAlreadyRegisteredLabel | fromDictionary\n \"\n [continueLaterConnectedLabel]=\"continueLaterConnectedLabel | fromDictionary\"\n [triggerOnPageChange]=\"triggerRecoveryOnPageChange\"\n></gesdem-action-recovery-registration>\n\n<nav class=\"vd-pagination\" id=\"foehn_navContainer\" aria-label=\"Pagination\">\n <ul class=\"vd-pagination__list\">\n <li\n class=\"vd-pagination__item vd-pagination__item--previous\"\n *ngIf=\"canShowPreviousButton()\"\n >\n <button\n id=\"prevButton\"\n type=\"button\"\n class=\"btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToPrevious()\"\n >\n <span class=\"vd-pagination__title\">\n <foehn-icon-chevron-left\n class=\"me-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-left>\n {{ prevLabel | fromDictionary }}\n </span>\n <span class=\"visually-hidden\" *ngIf=\"isLinearRouting()\">:</span>\n <span class=\"vd-pagination__label\" *ngIf=\"isLinearRouting()\">\n {{ getPreviousRouteIndex() }}\n {{\n 'foehn-navigation.route.index.separator'\n | fromDictionary\n }}\n {{ getTotalRoutesSize() }}\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next\"\n *ngIf=\"!isLastFormPage() && canShowNextButton()\"\n >\n <button\n id=\"nextButton\"\n type=\"submit\"\n class=\"btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToNext()\"\n >\n <span class=\"vd-pagination__title\">\n {{ nextLabel | fromDictionary }}\n <foehn-icon-chevron-right\n class=\"ms-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-right>\n </span>\n <span class=\"visually-hidden\" *ngIf=\"isLinearRouting()\">:</span>\n <span class=\"vd-pagination__label\" *ngIf=\"isLinearRouting()\">\n {{ getNextRouteIndex() }}\n {{\n 'foehn-navigation.route.index.separator'\n | fromDictionary\n }}\n {{ getTotalRoutesSize() }}\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next\"\n *ngIf=\"isLastFormPage() && canShowNextButton()\"\n >\n <button\n *ngIf=\"isLastFormPage() && canShowNextButton()\"\n type=\"submit\"\n id=\"transmitButton\"\n (click)=\"goToNext()\"\n class=\"btn btn-success vd-btn-pagination-submit\"\n >\n {{ transmitLabel | fromDictionary }}\n </button>\n </li>\n </ul>\n</nav>\n", styles: [".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)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FoehnIconChevronLeftComponent, selector: "foehn-icon-chevron-left" }, { kind: "component", type: FoehnIconChevronRightComponent, selector: "foehn-icon-chevron-right" }, { kind: "component", type: GesdemActionRecoveryRegistrationComponent, selector: "gesdem-action-recovery-registration", inputs: ["continueLaterLabel", "continueLaterAlreadyRegisteredLabel", "continueLaterConnectedLabel", "triggerOnPageChange"] }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] }); }
|
|
12250
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnNavigationComponent, selector: "foehn-navigation", inputs: { transmitLabel: "transmitLabel" }, usesInheritance: true, ngImport: i0, template: "<gesdem-action-recovery-registration\n *ngIf=\"showContinueLaterButton\"\n [continueLaterLabel]=\"continueLaterLabel | fromDictionary\"\n [continueLaterAlreadyRegisteredLabel]=\"\n continueLaterAlreadyRegisteredLabel | fromDictionary\n \"\n [continueLaterConnectedLabel]=\"continueLaterConnectedLabel | fromDictionary\"\n [triggerOnPageChange]=\"triggerRecoveryOnPageChange\"\n></gesdem-action-recovery-registration>\n\n<nav class=\"vd-pagination\" id=\"foehn_navContainer\" aria-label=\"Pagination\">\n <ul class=\"vd-pagination__list\">\n <li\n class=\"vd-pagination__item vd-pagination__item--previous\"\n *ngIf=\"canShowPreviousButton()\"\n >\n <button\n id=\"prevButton\"\n type=\"button\"\n class=\"btn btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToPrevious()\"\n >\n <span class=\"vd-pagination__title\">\n <foehn-icon-chevron-left\n class=\"me-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-left>\n {{ prevLabel | fromDictionary }}\n </span>\n <span class=\"visually-hidden\" *ngIf=\"isLinearRouting()\">:</span>\n <span class=\"vd-pagination__label\" *ngIf=\"isLinearRouting()\">\n {{ getPreviousRouteIndex() }}\n {{\n 'foehn-navigation.route.index.separator'\n | fromDictionary\n }}\n {{ getTotalRoutesSize() }}\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next\"\n *ngIf=\"!isLastFormPage() && canShowNextButton()\"\n >\n <button\n id=\"nextButton\"\n type=\"submit\"\n class=\"btn btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToNext()\"\n >\n <span class=\"vd-pagination__title\">\n {{ nextLabel | fromDictionary }}\n <foehn-icon-chevron-right\n class=\"ms-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-right>\n </span>\n <span class=\"visually-hidden\" *ngIf=\"isLinearRouting()\">:</span>\n <span class=\"vd-pagination__label\" *ngIf=\"isLinearRouting()\">\n {{ getNextRouteIndex() }}\n {{\n 'foehn-navigation.route.index.separator'\n | fromDictionary\n }}\n {{ getTotalRoutesSize() }}\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next\"\n *ngIf=\"isLastFormPage() && canShowNextButton()\"\n >\n <button\n *ngIf=\"isLastFormPage() && canShowNextButton()\"\n type=\"submit\"\n id=\"transmitButton\"\n (click)=\"goToNext()\"\n class=\"btn btn-success vd-btn-pagination-submit\"\n >\n {{ transmitLabel | fromDictionary }}\n </button>\n </li>\n </ul>\n</nav>\n", styles: [".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)}:host ::ng-deep .btn.btn-link .svg-inline--fa{color:var(--vd-primary-dark)}:host ::ng-deep .btn.btn-link:hover .svg-inline--fa{color:var(--vd-neutral-dark)}.btn.btn-link{text-transform:none}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FoehnIconChevronLeftComponent, selector: "foehn-icon-chevron-left" }, { kind: "component", type: FoehnIconChevronRightComponent, selector: "foehn-icon-chevron-right" }, { kind: "component", type: GesdemActionRecoveryRegistrationComponent, selector: "gesdem-action-recovery-registration", inputs: ["continueLaterLabel", "continueLaterAlreadyRegisteredLabel", "continueLaterConnectedLabel", "triggerOnPageChange"] }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] }); }
|
|
12251
12251
|
}
|
|
12252
12252
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnNavigationComponent, decorators: [{
|
|
12253
12253
|
type: Component,
|
|
12254
|
-
args: [{ selector: 'foehn-navigation', template: "<gesdem-action-recovery-registration\n *ngIf=\"showContinueLaterButton\"\n [continueLaterLabel]=\"continueLaterLabel | fromDictionary\"\n [continueLaterAlreadyRegisteredLabel]=\"\n continueLaterAlreadyRegisteredLabel | fromDictionary\n \"\n [continueLaterConnectedLabel]=\"continueLaterConnectedLabel | fromDictionary\"\n [triggerOnPageChange]=\"triggerRecoveryOnPageChange\"\n></gesdem-action-recovery-registration>\n\n<nav class=\"vd-pagination\" id=\"foehn_navContainer\" aria-label=\"Pagination\">\n <ul class=\"vd-pagination__list\">\n <li\n class=\"vd-pagination__item vd-pagination__item--previous\"\n *ngIf=\"canShowPreviousButton()\"\n >\n <button\n id=\"prevButton\"\n type=\"button\"\n class=\"btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToPrevious()\"\n >\n <span class=\"vd-pagination__title\">\n <foehn-icon-chevron-left\n class=\"me-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-left>\n {{ prevLabel | fromDictionary }}\n </span>\n <span class=\"visually-hidden\" *ngIf=\"isLinearRouting()\">:</span>\n <span class=\"vd-pagination__label\" *ngIf=\"isLinearRouting()\">\n {{ getPreviousRouteIndex() }}\n {{\n 'foehn-navigation.route.index.separator'\n | fromDictionary\n }}\n {{ getTotalRoutesSize() }}\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next\"\n *ngIf=\"!isLastFormPage() && canShowNextButton()\"\n >\n <button\n id=\"nextButton\"\n type=\"submit\"\n class=\"btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToNext()\"\n >\n <span class=\"vd-pagination__title\">\n {{ nextLabel | fromDictionary }}\n <foehn-icon-chevron-right\n class=\"ms-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-right>\n </span>\n <span class=\"visually-hidden\" *ngIf=\"isLinearRouting()\">:</span>\n <span class=\"vd-pagination__label\" *ngIf=\"isLinearRouting()\">\n {{ getNextRouteIndex() }}\n {{\n 'foehn-navigation.route.index.separator'\n | fromDictionary\n }}\n {{ getTotalRoutesSize() }}\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next\"\n *ngIf=\"isLastFormPage() && canShowNextButton()\"\n >\n <button\n *ngIf=\"isLastFormPage() && canShowNextButton()\"\n type=\"submit\"\n id=\"transmitButton\"\n (click)=\"goToNext()\"\n class=\"btn btn-success vd-btn-pagination-submit\"\n >\n {{ transmitLabel | fromDictionary }}\n </button>\n </li>\n </ul>\n</nav>\n", styles: [".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)}\n"] }]
|
|
12254
|
+
args: [{ selector: 'foehn-navigation', template: "<gesdem-action-recovery-registration\n *ngIf=\"showContinueLaterButton\"\n [continueLaterLabel]=\"continueLaterLabel | fromDictionary\"\n [continueLaterAlreadyRegisteredLabel]=\"\n continueLaterAlreadyRegisteredLabel | fromDictionary\n \"\n [continueLaterConnectedLabel]=\"continueLaterConnectedLabel | fromDictionary\"\n [triggerOnPageChange]=\"triggerRecoveryOnPageChange\"\n></gesdem-action-recovery-registration>\n\n<nav class=\"vd-pagination\" id=\"foehn_navContainer\" aria-label=\"Pagination\">\n <ul class=\"vd-pagination__list\">\n <li\n class=\"vd-pagination__item vd-pagination__item--previous\"\n *ngIf=\"canShowPreviousButton()\"\n >\n <button\n id=\"prevButton\"\n type=\"button\"\n class=\"btn btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToPrevious()\"\n >\n <span class=\"vd-pagination__title\">\n <foehn-icon-chevron-left\n class=\"me-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-left>\n {{ prevLabel | fromDictionary }}\n </span>\n <span class=\"visually-hidden\" *ngIf=\"isLinearRouting()\">:</span>\n <span class=\"vd-pagination__label\" *ngIf=\"isLinearRouting()\">\n {{ getPreviousRouteIndex() }}\n {{\n 'foehn-navigation.route.index.separator'\n | fromDictionary\n }}\n {{ getTotalRoutesSize() }}\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next\"\n *ngIf=\"!isLastFormPage() && canShowNextButton()\"\n >\n <button\n id=\"nextButton\"\n type=\"submit\"\n class=\"btn btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToNext()\"\n >\n <span class=\"vd-pagination__title\">\n {{ nextLabel | fromDictionary }}\n <foehn-icon-chevron-right\n class=\"ms-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-right>\n </span>\n <span class=\"visually-hidden\" *ngIf=\"isLinearRouting()\">:</span>\n <span class=\"vd-pagination__label\" *ngIf=\"isLinearRouting()\">\n {{ getNextRouteIndex() }}\n {{\n 'foehn-navigation.route.index.separator'\n | fromDictionary\n }}\n {{ getTotalRoutesSize() }}\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next\"\n *ngIf=\"isLastFormPage() && canShowNextButton()\"\n >\n <button\n *ngIf=\"isLastFormPage() && canShowNextButton()\"\n type=\"submit\"\n id=\"transmitButton\"\n (click)=\"goToNext()\"\n class=\"btn btn-success vd-btn-pagination-submit\"\n >\n {{ transmitLabel | fromDictionary }}\n </button>\n </li>\n </ul>\n</nav>\n", styles: [".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)}:host ::ng-deep .btn.btn-link .svg-inline--fa{color:var(--vd-primary-dark)}:host ::ng-deep .btn.btn-link:hover .svg-inline--fa{color:var(--vd-neutral-dark)}.btn.btn-link{text-transform:none}\n"] }]
|
|
12255
12255
|
}], ctorParameters: () => [{ type: FoehnNavigationService }, { type: i1$1.ActivatedRoute }], propDecorators: { transmitLabel: [{
|
|
12256
12256
|
type: Input
|
|
12257
12257
|
}] } });
|
|
@@ -12265,11 +12265,11 @@ class FoehnSimpleNavigationComponent extends AbstractFoehnNavigationComponent {
|
|
|
12265
12265
|
return this.showPreviousButton;
|
|
12266
12266
|
}
|
|
12267
12267
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnSimpleNavigationComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
12268
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnSimpleNavigationComponent, selector: "foehn-simple-navigation", inputs: { showPreviousButton: "showPreviousButton" }, usesInheritance: true, ngImport: i0, template: "<gesdem-action-recovery-registration\n *ngIf=\"showContinueLaterButton\"\n [continueLaterLabel]=\"continueLaterLabel | fromDictionary\"\n [continueLaterAlreadyRegisteredLabel]=\"\n continueLaterAlreadyRegisteredLabel | fromDictionary\n \"\n [continueLaterConnectedLabel]=\"continueLaterConnectedLabel | fromDictionary\"\n [triggerOnPageChange]=\"triggerRecoveryOnPageChange\"\n></gesdem-action-recovery-registration>\n\n<nav class=\"vd-pagination\" id=\"foehn_navContainer\" aria-label=\"Pagination\">\n <ul class=\"vd-pagination__list\">\n <li\n class=\"vd-pagination__item vd-pagination__item--previous\"\n *ngIf=\"canShowPreviousButton()\"\n >\n <button\n id=\"prevButton\"\n type=\"button\"\n class=\"btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToPrevious()\"\n >\n <span class=\"vd-pagination__title\">\n <foehn-icon-chevron-left\n class=\"me-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-left>\n {{ prevLabel | fromDictionary }}\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next\"\n *ngIf=\"canShowNextButton()\"\n >\n <button\n id=\"nextButton\"\n type=\"submit\"\n class=\"btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToNext()\"\n >\n <span class=\"vd-pagination__title\">\n {{ nextLabel | fromDictionary }}\n <foehn-icon-chevron-right\n class=\"ms-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-right>\n </span>\n </button>\n </li>\n </ul>\n</nav>\n", styles: [".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)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FoehnIconChevronLeftComponent, selector: "foehn-icon-chevron-left" }, { kind: "component", type: FoehnIconChevronRightComponent, selector: "foehn-icon-chevron-right" }, { kind: "component", type: GesdemActionRecoveryRegistrationComponent, selector: "gesdem-action-recovery-registration", inputs: ["continueLaterLabel", "continueLaterAlreadyRegisteredLabel", "continueLaterConnectedLabel", "triggerOnPageChange"] }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] }); }
|
|
12268
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnSimpleNavigationComponent, selector: "foehn-simple-navigation", inputs: { showPreviousButton: "showPreviousButton" }, usesInheritance: true, ngImport: i0, template: "<gesdem-action-recovery-registration\n *ngIf=\"showContinueLaterButton\"\n [continueLaterLabel]=\"continueLaterLabel | fromDictionary\"\n [continueLaterAlreadyRegisteredLabel]=\"\n continueLaterAlreadyRegisteredLabel | fromDictionary\n \"\n [continueLaterConnectedLabel]=\"continueLaterConnectedLabel | fromDictionary\"\n [triggerOnPageChange]=\"triggerRecoveryOnPageChange\"\n></gesdem-action-recovery-registration>\n\n<nav class=\"vd-pagination\" id=\"foehn_navContainer\" aria-label=\"Pagination\">\n <ul class=\"vd-pagination__list\">\n <li\n class=\"vd-pagination__item vd-pagination__item--previous\"\n *ngIf=\"canShowPreviousButton()\"\n >\n <button\n id=\"prevButton\"\n type=\"button\"\n class=\"btn btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToPrevious()\"\n >\n <span class=\"vd-pagination__title\">\n <foehn-icon-chevron-left\n class=\"me-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-left>\n {{ prevLabel | fromDictionary }}\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next\"\n *ngIf=\"canShowNextButton()\"\n >\n <button\n id=\"nextButton\"\n type=\"submit\"\n class=\"btn btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToNext()\"\n >\n <span class=\"vd-pagination__title\">\n {{ nextLabel | fromDictionary }}\n <foehn-icon-chevron-right\n class=\"ms-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-right>\n </span>\n </button>\n </li>\n </ul>\n</nav>\n", styles: [".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)}:host ::ng-deep .btn.btn-link .svg-inline--fa{color:var(--vd-primary-dark)}:host ::ng-deep .btn.btn-link:hover .svg-inline--fa{color:var(--vd-neutral-dark)}.btn.btn-link{text-transform:none}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FoehnIconChevronLeftComponent, selector: "foehn-icon-chevron-left" }, { kind: "component", type: FoehnIconChevronRightComponent, selector: "foehn-icon-chevron-right" }, { kind: "component", type: GesdemActionRecoveryRegistrationComponent, selector: "gesdem-action-recovery-registration", inputs: ["continueLaterLabel", "continueLaterAlreadyRegisteredLabel", "continueLaterConnectedLabel", "triggerOnPageChange"] }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] }); }
|
|
12269
12269
|
}
|
|
12270
12270
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnSimpleNavigationComponent, decorators: [{
|
|
12271
12271
|
type: Component,
|
|
12272
|
-
args: [{ selector: 'foehn-simple-navigation', template: "<gesdem-action-recovery-registration\n *ngIf=\"showContinueLaterButton\"\n [continueLaterLabel]=\"continueLaterLabel | fromDictionary\"\n [continueLaterAlreadyRegisteredLabel]=\"\n continueLaterAlreadyRegisteredLabel | fromDictionary\n \"\n [continueLaterConnectedLabel]=\"continueLaterConnectedLabel | fromDictionary\"\n [triggerOnPageChange]=\"triggerRecoveryOnPageChange\"\n></gesdem-action-recovery-registration>\n\n<nav class=\"vd-pagination\" id=\"foehn_navContainer\" aria-label=\"Pagination\">\n <ul class=\"vd-pagination__list\">\n <li\n class=\"vd-pagination__item vd-pagination__item--previous\"\n *ngIf=\"canShowPreviousButton()\"\n >\n <button\n id=\"prevButton\"\n type=\"button\"\n class=\"btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToPrevious()\"\n >\n <span class=\"vd-pagination__title\">\n <foehn-icon-chevron-left\n class=\"me-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-left>\n {{ prevLabel | fromDictionary }}\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next\"\n *ngIf=\"canShowNextButton()\"\n >\n <button\n id=\"nextButton\"\n type=\"submit\"\n class=\"btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToNext()\"\n >\n <span class=\"vd-pagination__title\">\n {{ nextLabel | fromDictionary }}\n <foehn-icon-chevron-right\n class=\"ms-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-right>\n </span>\n </button>\n </li>\n </ul>\n</nav>\n", styles: [".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)}\n"] }]
|
|
12272
|
+
args: [{ selector: 'foehn-simple-navigation', template: "<gesdem-action-recovery-registration\n *ngIf=\"showContinueLaterButton\"\n [continueLaterLabel]=\"continueLaterLabel | fromDictionary\"\n [continueLaterAlreadyRegisteredLabel]=\"\n continueLaterAlreadyRegisteredLabel | fromDictionary\n \"\n [continueLaterConnectedLabel]=\"continueLaterConnectedLabel | fromDictionary\"\n [triggerOnPageChange]=\"triggerRecoveryOnPageChange\"\n></gesdem-action-recovery-registration>\n\n<nav class=\"vd-pagination\" id=\"foehn_navContainer\" aria-label=\"Pagination\">\n <ul class=\"vd-pagination__list\">\n <li\n class=\"vd-pagination__item vd-pagination__item--previous\"\n *ngIf=\"canShowPreviousButton()\"\n >\n <button\n id=\"prevButton\"\n type=\"button\"\n class=\"btn btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToPrevious()\"\n >\n <span class=\"vd-pagination__title\">\n <foehn-icon-chevron-left\n class=\"me-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-left>\n {{ prevLabel | fromDictionary }}\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next\"\n *ngIf=\"canShowNextButton()\"\n >\n <button\n id=\"nextButton\"\n type=\"submit\"\n class=\"btn btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"$event.preventDefault(); goToNext()\"\n >\n <span class=\"vd-pagination__title\">\n {{ nextLabel | fromDictionary }}\n <foehn-icon-chevron-right\n class=\"ms-1\"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-right>\n </span>\n </button>\n </li>\n </ul>\n</nav>\n", styles: [".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)}:host ::ng-deep .btn.btn-link .svg-inline--fa{color:var(--vd-primary-dark)}:host ::ng-deep .btn.btn-link:hover .svg-inline--fa{color:var(--vd-neutral-dark)}.btn.btn-link{text-transform:none}\n"] }]
|
|
12273
12273
|
}], propDecorators: { showPreviousButton: [{
|
|
12274
12274
|
type: Input
|
|
12275
12275
|
}] } });
|
|
@@ -12446,11 +12446,11 @@ class FoehnListComponent {
|
|
|
12446
12446
|
this.filteredList = this._list.slice(start, start + this.itemsPerPage);
|
|
12447
12447
|
}
|
|
12448
12448
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12449
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnListComponent, selector: "foehn-list", inputs: { itemsPerPage: "itemsPerPage", id: "id", previousLabel: "previousLabel", nextLabel: "nextLabel", fixedPageCount: "fixedPageCount", list: "list", trackByFn: "trackByFn" }, outputs: { pageChange: "pageChange" }, queries: [{ propertyName: "templateVariable", first: true, predicate: TemplateRef, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"row\" [id]=\"id\">\n <div class=\"col-lg-12 col-md-12 col-sm-12 col-xs-12\">\n <ul class=\"list-unstyled\">\n <li\n *ngFor=\"\n let item of filteredList;\n let index = index;\n trackBy: trackByFn\n \"\n >\n <ng-template\n [ngTemplateOutlet]=\"templateVariable\"\n [ngTemplateOutletContext]=\"{ item: item, index: index }\"\n ></ng-template>\n </li>\n </ul>\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 type=\"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=\"visually-hidden\">:</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 type=\"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=\"visually-hidden\">:</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)}\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: FoehnIconChevronLeftComponent, selector: "foehn-icon-chevron-left" }, { kind: "component", type: FoehnIconChevronRightComponent, selector: "foehn-icon-chevron-right" }] }); }
|
|
12449
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnListComponent, selector: "foehn-list", inputs: { itemsPerPage: "itemsPerPage", id: "id", previousLabel: "previousLabel", nextLabel: "nextLabel", fixedPageCount: "fixedPageCount", list: "list", trackByFn: "trackByFn" }, outputs: { pageChange: "pageChange" }, queries: [{ propertyName: "templateVariable", first: true, predicate: TemplateRef, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"row\" [id]=\"id\">\n <div class=\"col-lg-12 col-md-12 col-sm-12 col-xs-12\">\n <ul class=\"list-unstyled\">\n <li\n *ngFor=\"\n let item of filteredList;\n let index = index;\n trackBy: trackByFn\n \"\n >\n <ng-template\n [ngTemplateOutlet]=\"templateVariable\"\n [ngTemplateOutletContext]=\"{ item: item, index: index }\"\n ></ng-template>\n </li>\n </ul>\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 type=\"button\"\n class=\"btn 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=\"visually-hidden\">:</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 type=\"button\"\n class=\"btn 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=\"visually-hidden\">:</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)}:host ::ng-deep .btn.btn-link .svg-inline--fa{color:var(--vd-primary-dark)}:host ::ng-deep .btn.btn-link:hover .svg-inline--fa{color:var(--vd-neutral-dark)}.btn.btn-link{text-transform:none}\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: FoehnIconChevronLeftComponent, selector: "foehn-icon-chevron-left" }, { kind: "component", type: FoehnIconChevronRightComponent, selector: "foehn-icon-chevron-right" }] }); }
|
|
12450
12450
|
}
|
|
12451
12451
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnListComponent, decorators: [{
|
|
12452
12452
|
type: Component,
|
|
12453
|
-
args: [{ selector: 'foehn-list', template: "<div class=\"row\" [id]=\"id\">\n <div class=\"col-lg-12 col-md-12 col-sm-12 col-xs-12\">\n <ul class=\"list-unstyled\">\n <li\n *ngFor=\"\n let item of filteredList;\n let index = index;\n trackBy: trackByFn\n \"\n >\n <ng-template\n [ngTemplateOutlet]=\"templateVariable\"\n [ngTemplateOutletContext]=\"{ item: item, index: index }\"\n ></ng-template>\n </li>\n </ul>\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 type=\"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=\"visually-hidden\">:</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 type=\"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=\"visually-hidden\">:</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)}\n"] }]
|
|
12453
|
+
args: [{ selector: 'foehn-list', template: "<div class=\"row\" [id]=\"id\">\n <div class=\"col-lg-12 col-md-12 col-sm-12 col-xs-12\">\n <ul class=\"list-unstyled\">\n <li\n *ngFor=\"\n let item of filteredList;\n let index = index;\n trackBy: trackByFn\n \"\n >\n <ng-template\n [ngTemplateOutlet]=\"templateVariable\"\n [ngTemplateOutletContext]=\"{ item: item, index: index }\"\n ></ng-template>\n </li>\n </ul>\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 type=\"button\"\n class=\"btn 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=\"visually-hidden\">:</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 type=\"button\"\n class=\"btn 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=\"visually-hidden\">:</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)}:host ::ng-deep .btn.btn-link .svg-inline--fa{color:var(--vd-primary-dark)}:host ::ng-deep .btn.btn-link:hover .svg-inline--fa{color:var(--vd-neutral-dark)}.btn.btn-link{text-transform:none}\n"] }]
|
|
12454
12454
|
}], propDecorators: {
|
|
12455
12455
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
12456
12456
|
templateVariable: [{
|
|
@@ -15139,11 +15139,11 @@ class FoehnAgendaNavigationComponent {
|
|
|
15139
15139
|
}
|
|
15140
15140
|
}
|
|
15141
15141
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnAgendaNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15142
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnAgendaNavigationComponent, selector: "foehn-agenda-navigation", inputs: { id: "id", calendar: "calendar", isSrOnly: "isSrOnly", minDate: "minDate", maxDate: "maxDate" }, outputs: { paginationChange: "paginationChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"row mb-3\" *ngIf=\"!!calendar\">\n <div class=\"col-12\">\n <nav\n class=\"vd-pagination calendar-week-navigation\"\n [attr.id]=\"id\"\n [attr.aria-label]=\"\n 'foehn-agenda-navigation.nav.aria-label' | fromDictionary\n \"\n >\n <ul class=\"vd-pagination__list\">\n <li\n class=\"vd-pagination__item vd-pagination__item--previous col-4\"\n *ngIf=\"!!calendar.previousWeek\"\n >\n <button\n [id]=\"id + 'ButtonPreviousWeek'\"\n class=\"btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"paginate(calendar.previousWeek)\"\n type=\"button\"\n >\n <span class=\"d-flex align-items-center\">\n <foehn-icon-chevron-left\n class=\"vd-pagination__title\"\n [title]=\"\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n \"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-left>\n <span\n class=\"vd-pagination__title ms-2 d-xs-none d-sm-block\"\n aria-hidden=\"true\"\n >\n {{\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n }}\n </span>\n <span\n [id]=\"id + 'NavigationPreviousSrOnly'\"\n class=\"visually-hidden\"\n >\n {{\n 'foehn-agenda-navigation.previous-week-sr-only'\n | fromDictionary\n : {\n previousWeek:\n calendar.previousWeek\n .label\n }\n }}\n </span>\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--previous col-4\"\n *ngIf=\"!calendar.previousWeek && !isSrOnly\"\n >\n <div\n [id]=\"id + 'NavigationPreviousDisabled'\"\n class=\"d-flex align-items-center link-week-disabled px-1\"\n >\n <foehn-icon-chevron-left\n class=\"vd-pagination__title\"\n [title]=\"\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n \"\n ></foehn-icon-chevron-left>\n <span\n class=\"vd-pagination__title ms-2 d-xs-none d-sm-block\"\n >\n {{\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n }}\n </span>\n </div>\n </li>\n\n <li\n class=\"vd-pagination__item d-flex justify-content-center col-4\"\n *ngIf=\"!isSrOnly\"\n >\n <foehn-date-picker-button\n [model]=\"currentDay\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\"\n [selectedDateSrOnlyLabelKey]=\"\n 'foehn-agenda-navigation.date-picker-button.screen-reader.selected-date'\n \"\n (userInput)=\"datePickerUserInput($event)\"\n ></foehn-date-picker-button>\n </li>\n\n <li\n class=\"vd-pagination__item vd-pagination__item--next col-4 d-flex justify-content-end\"\n *ngIf=\"!!calendar.nextWeek\"\n >\n <button\n [id]=\"id + 'ButtonNextWeek'\"\n class=\"btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"paginate(calendar.nextWeek)\"\n type=\"button\"\n >\n <span class=\"d-flex align-items-center\">\n <span\n aria-hidden=\"true\"\n class=\"vd-pagination__title d-xs-none d-sm-block\"\n >\n {{\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n }}\n </span>\n <span\n [id]=\"id + 'NavigationNextSrOnly'\"\n class=\"visually-hidden\"\n >\n {{\n 'foehn-agenda-navigation.next-week-sr-only'\n | fromDictionary\n : {\n nextWeek:\n calendar.nextWeek.label\n }\n }}\n </span>\n <foehn-icon-chevron-right\n class=\"vd-pagination__title ms-2\"\n [title]=\"\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n \"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-right>\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next col-4 d-flex justify-content-end\"\n *ngIf=\"!calendar.nextWeek && !isSrOnly\"\n >\n <div\n [id]=\"id + 'NavigationNextDisabled'\"\n class=\"d-flex align-items-center link-week-disabled px-1\"\n >\n <span class=\"vd-pagination__title d-xs-none d-sm-block\">\n {{\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n }}\n </span>\n <foehn-icon-chevron-right\n class=\"vd-pagination__title ms-2\"\n [title]=\"\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n \"\n ></foehn-icon-chevron-right>\n </div>\n </li>\n </ul>\n </nav>\n </div>\n</div>\n", styles: [".calendar-week-navigation{margin-bottom:0}.calendar-week-navigation li.vd-pagination__item{margin-top:0}.calendar-week-navigation span.vd-pagination__title{font-size:1em;line-height:1.2em
|
|
15142
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FoehnAgendaNavigationComponent, selector: "foehn-agenda-navigation", inputs: { id: "id", calendar: "calendar", isSrOnly: "isSrOnly", minDate: "minDate", maxDate: "maxDate" }, outputs: { paginationChange: "paginationChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"row mb-3\" *ngIf=\"!!calendar\">\n <div class=\"col-12\">\n <nav\n class=\"vd-pagination calendar-week-navigation\"\n [attr.id]=\"id\"\n [attr.aria-label]=\"\n 'foehn-agenda-navigation.nav.aria-label' | fromDictionary\n \"\n >\n <ul class=\"vd-pagination__list\">\n <li\n class=\"vd-pagination__item vd-pagination__item--previous col-4\"\n *ngIf=\"!!calendar.previousWeek\"\n >\n <button\n [id]=\"id + 'ButtonPreviousWeek'\"\n class=\"btn btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"paginate(calendar.previousWeek)\"\n type=\"button\"\n >\n <span class=\"d-flex align-items-center\">\n <foehn-icon-chevron-left\n class=\"vd-pagination__title\"\n [title]=\"\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n \"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-left>\n <span\n class=\"vd-pagination__title ms-2 d-xs-none d-sm-block\"\n aria-hidden=\"true\"\n >\n {{\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n }}\n </span>\n <span\n [id]=\"id + 'NavigationPreviousSrOnly'\"\n class=\"visually-hidden\"\n >\n {{\n 'foehn-agenda-navigation.previous-week-sr-only'\n | fromDictionary\n : {\n previousWeek:\n calendar.previousWeek\n .label\n }\n }}\n </span>\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--previous col-4\"\n *ngIf=\"!calendar.previousWeek && !isSrOnly\"\n >\n <div\n [id]=\"id + 'NavigationPreviousDisabled'\"\n class=\"d-flex align-items-center link-week-disabled px-1\"\n >\n <foehn-icon-chevron-left\n class=\"vd-pagination__title\"\n [title]=\"\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n \"\n ></foehn-icon-chevron-left>\n <span\n class=\"vd-pagination__title ms-2 d-xs-none d-sm-block\"\n >\n {{\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n }}\n </span>\n </div>\n </li>\n\n <li\n class=\"vd-pagination__item d-flex justify-content-center col-4\"\n *ngIf=\"!isSrOnly\"\n >\n <foehn-date-picker-button\n [model]=\"currentDay\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\"\n [selectedDateSrOnlyLabelKey]=\"\n 'foehn-agenda-navigation.date-picker-button.screen-reader.selected-date'\n \"\n (userInput)=\"datePickerUserInput($event)\"\n ></foehn-date-picker-button>\n </li>\n\n <li\n class=\"vd-pagination__item vd-pagination__item--next col-4 d-flex justify-content-end\"\n *ngIf=\"!!calendar.nextWeek\"\n >\n <button\n [id]=\"id + 'ButtonNextWeek'\"\n class=\"btn btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"paginate(calendar.nextWeek)\"\n type=\"button\"\n >\n <span class=\"d-flex align-items-center\">\n <span\n aria-hidden=\"true\"\n class=\"vd-pagination__title d-xs-none d-sm-block\"\n >\n {{\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n }}\n </span>\n <span\n [id]=\"id + 'NavigationNextSrOnly'\"\n class=\"visually-hidden\"\n >\n {{\n 'foehn-agenda-navigation.next-week-sr-only'\n | fromDictionary\n : {\n nextWeek:\n calendar.nextWeek.label\n }\n }}\n </span>\n <foehn-icon-chevron-right\n class=\"vd-pagination__title ms-2\"\n [title]=\"\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n \"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-right>\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next col-4 d-flex justify-content-end\"\n *ngIf=\"!calendar.nextWeek && !isSrOnly\"\n >\n <div\n [id]=\"id + 'NavigationNextDisabled'\"\n class=\"d-flex align-items-center link-week-disabled px-1\"\n >\n <span class=\"vd-pagination__title d-xs-none d-sm-block\">\n {{\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n }}\n </span>\n <foehn-icon-chevron-right\n class=\"vd-pagination__title ms-2\"\n [title]=\"\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n \"\n ></foehn-icon-chevron-right>\n </div>\n </li>\n </ul>\n </nav>\n </div>\n</div>\n", styles: [".calendar-week-navigation{margin-bottom:0}.calendar-week-navigation li.vd-pagination__item{margin-top:0}.calendar-week-navigation span.vd-pagination__title{font-size:1em;line-height:1.2em}:host ::ng-deep .calendar-week-navigation .btn.btn-link .svg-inline--fa{color:var(--vd-primary-dark)}:host ::ng-deep .calendar-week-navigation .btn.btn-link:hover .svg-inline--fa{color:var(--vd-neutral-darker)}.calendar-week-navigation .btn.btn-link{text-transform:none}.calendar-week-navigation .link-week-disabled .vd-pagination__title{color:var(--vd-neutral-light);cursor:not-allowed}.calendar-week-navigation .vd-pagination__link-reset{background:none;border:none;font-weight:inherit;text-decoration-line:none;text-align:inherit;cursor:pointer}.calendar-week-navigation .vd-pagination__link-reset:focus{background-color:var(--vd-focus)}nav ul{margin-bottom:0}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FoehnIconChevronLeftComponent, selector: "foehn-icon-chevron-left" }, { kind: "component", type: FoehnIconChevronRightComponent, selector: "foehn-icon-chevron-right" }, { kind: "component", type: FoehnDatePickerButtonComponent, selector: "foehn-date-picker-button", inputs: ["id", "name", "minYear", "maxYear", "minDate", "maxDate", "displaySelectedDate", "selectedDateSrOnlyLabelKey", "model"], outputs: ["modelChange", "userInput"] }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] }); }
|
|
15143
15143
|
}
|
|
15144
15144
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnAgendaNavigationComponent, decorators: [{
|
|
15145
15145
|
type: Component,
|
|
15146
|
-
args: [{ selector: 'foehn-agenda-navigation', template: "<div class=\"row mb-3\" *ngIf=\"!!calendar\">\n <div class=\"col-12\">\n <nav\n class=\"vd-pagination calendar-week-navigation\"\n [attr.id]=\"id\"\n [attr.aria-label]=\"\n 'foehn-agenda-navigation.nav.aria-label' | fromDictionary\n \"\n >\n <ul class=\"vd-pagination__list\">\n <li\n class=\"vd-pagination__item vd-pagination__item--previous col-4\"\n *ngIf=\"!!calendar.previousWeek\"\n >\n <button\n [id]=\"id + 'ButtonPreviousWeek'\"\n class=\"btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"paginate(calendar.previousWeek)\"\n type=\"button\"\n >\n <span class=\"d-flex align-items-center\">\n <foehn-icon-chevron-left\n class=\"vd-pagination__title\"\n [title]=\"\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n \"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-left>\n <span\n class=\"vd-pagination__title ms-2 d-xs-none d-sm-block\"\n aria-hidden=\"true\"\n >\n {{\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n }}\n </span>\n <span\n [id]=\"id + 'NavigationPreviousSrOnly'\"\n class=\"visually-hidden\"\n >\n {{\n 'foehn-agenda-navigation.previous-week-sr-only'\n | fromDictionary\n : {\n previousWeek:\n calendar.previousWeek\n .label\n }\n }}\n </span>\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--previous col-4\"\n *ngIf=\"!calendar.previousWeek && !isSrOnly\"\n >\n <div\n [id]=\"id + 'NavigationPreviousDisabled'\"\n class=\"d-flex align-items-center link-week-disabled px-1\"\n >\n <foehn-icon-chevron-left\n class=\"vd-pagination__title\"\n [title]=\"\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n \"\n ></foehn-icon-chevron-left>\n <span\n class=\"vd-pagination__title ms-2 d-xs-none d-sm-block\"\n >\n {{\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n }}\n </span>\n </div>\n </li>\n\n <li\n class=\"vd-pagination__item d-flex justify-content-center col-4\"\n *ngIf=\"!isSrOnly\"\n >\n <foehn-date-picker-button\n [model]=\"currentDay\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\"\n [selectedDateSrOnlyLabelKey]=\"\n 'foehn-agenda-navigation.date-picker-button.screen-reader.selected-date'\n \"\n (userInput)=\"datePickerUserInput($event)\"\n ></foehn-date-picker-button>\n </li>\n\n <li\n class=\"vd-pagination__item vd-pagination__item--next col-4 d-flex justify-content-end\"\n *ngIf=\"!!calendar.nextWeek\"\n >\n <button\n [id]=\"id + 'ButtonNextWeek'\"\n class=\"btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"paginate(calendar.nextWeek)\"\n type=\"button\"\n >\n <span class=\"d-flex align-items-center\">\n <span\n aria-hidden=\"true\"\n class=\"vd-pagination__title d-xs-none d-sm-block\"\n >\n {{\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n }}\n </span>\n <span\n [id]=\"id + 'NavigationNextSrOnly'\"\n class=\"visually-hidden\"\n >\n {{\n 'foehn-agenda-navigation.next-week-sr-only'\n | fromDictionary\n : {\n nextWeek:\n calendar.nextWeek.label\n }\n }}\n </span>\n <foehn-icon-chevron-right\n class=\"vd-pagination__title ms-2\"\n [title]=\"\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n \"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-right>\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next col-4 d-flex justify-content-end\"\n *ngIf=\"!calendar.nextWeek && !isSrOnly\"\n >\n <div\n [id]=\"id + 'NavigationNextDisabled'\"\n class=\"d-flex align-items-center link-week-disabled px-1\"\n >\n <span class=\"vd-pagination__title d-xs-none d-sm-block\">\n {{\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n }}\n </span>\n <foehn-icon-chevron-right\n class=\"vd-pagination__title ms-2\"\n [title]=\"\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n \"\n ></foehn-icon-chevron-right>\n </div>\n </li>\n </ul>\n </nav>\n </div>\n</div>\n", styles: [".calendar-week-navigation{margin-bottom:0}.calendar-week-navigation li.vd-pagination__item{margin-top:0}.calendar-week-navigation span.vd-pagination__title{font-size:1em;line-height:1.2em
|
|
15146
|
+
args: [{ selector: 'foehn-agenda-navigation', template: "<div class=\"row mb-3\" *ngIf=\"!!calendar\">\n <div class=\"col-12\">\n <nav\n class=\"vd-pagination calendar-week-navigation\"\n [attr.id]=\"id\"\n [attr.aria-label]=\"\n 'foehn-agenda-navigation.nav.aria-label' | fromDictionary\n \"\n >\n <ul class=\"vd-pagination__list\">\n <li\n class=\"vd-pagination__item vd-pagination__item--previous col-4\"\n *ngIf=\"!!calendar.previousWeek\"\n >\n <button\n [id]=\"id + 'ButtonPreviousWeek'\"\n class=\"btn btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"paginate(calendar.previousWeek)\"\n type=\"button\"\n >\n <span class=\"d-flex align-items-center\">\n <foehn-icon-chevron-left\n class=\"vd-pagination__title\"\n [title]=\"\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n \"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-left>\n <span\n class=\"vd-pagination__title ms-2 d-xs-none d-sm-block\"\n aria-hidden=\"true\"\n >\n {{\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n }}\n </span>\n <span\n [id]=\"id + 'NavigationPreviousSrOnly'\"\n class=\"visually-hidden\"\n >\n {{\n 'foehn-agenda-navigation.previous-week-sr-only'\n | fromDictionary\n : {\n previousWeek:\n calendar.previousWeek\n .label\n }\n }}\n </span>\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--previous col-4\"\n *ngIf=\"!calendar.previousWeek && !isSrOnly\"\n >\n <div\n [id]=\"id + 'NavigationPreviousDisabled'\"\n class=\"d-flex align-items-center link-week-disabled px-1\"\n >\n <foehn-icon-chevron-left\n class=\"vd-pagination__title\"\n [title]=\"\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n \"\n ></foehn-icon-chevron-left>\n <span\n class=\"vd-pagination__title ms-2 d-xs-none d-sm-block\"\n >\n {{\n 'foehn-agenda-navigation.previous-week'\n | fromDictionary\n }}\n </span>\n </div>\n </li>\n\n <li\n class=\"vd-pagination__item d-flex justify-content-center col-4\"\n *ngIf=\"!isSrOnly\"\n >\n <foehn-date-picker-button\n [model]=\"currentDay\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\"\n [selectedDateSrOnlyLabelKey]=\"\n 'foehn-agenda-navigation.date-picker-button.screen-reader.selected-date'\n \"\n (userInput)=\"datePickerUserInput($event)\"\n ></foehn-date-picker-button>\n </li>\n\n <li\n class=\"vd-pagination__item vd-pagination__item--next col-4 d-flex justify-content-end\"\n *ngIf=\"!!calendar.nextWeek\"\n >\n <button\n [id]=\"id + 'ButtonNextWeek'\"\n class=\"btn btn-link vd-pagination__link vd-pagination__link-reset\"\n (click)=\"paginate(calendar.nextWeek)\"\n type=\"button\"\n >\n <span class=\"d-flex align-items-center\">\n <span\n aria-hidden=\"true\"\n class=\"vd-pagination__title d-xs-none d-sm-block\"\n >\n {{\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n }}\n </span>\n <span\n [id]=\"id + 'NavigationNextSrOnly'\"\n class=\"visually-hidden\"\n >\n {{\n 'foehn-agenda-navigation.next-week-sr-only'\n | fromDictionary\n : {\n nextWeek:\n calendar.nextWeek.label\n }\n }}\n </span>\n <foehn-icon-chevron-right\n class=\"vd-pagination__title ms-2\"\n [title]=\"\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n \"\n aria-hidden=\"true\"\n ></foehn-icon-chevron-right>\n </span>\n </button>\n </li>\n <li\n class=\"vd-pagination__item vd-pagination__item--next col-4 d-flex justify-content-end\"\n *ngIf=\"!calendar.nextWeek && !isSrOnly\"\n >\n <div\n [id]=\"id + 'NavigationNextDisabled'\"\n class=\"d-flex align-items-center link-week-disabled px-1\"\n >\n <span class=\"vd-pagination__title d-xs-none d-sm-block\">\n {{\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n }}\n </span>\n <foehn-icon-chevron-right\n class=\"vd-pagination__title ms-2\"\n [title]=\"\n 'foehn-agenda-navigation.next-week'\n | fromDictionary\n \"\n ></foehn-icon-chevron-right>\n </div>\n </li>\n </ul>\n </nav>\n </div>\n</div>\n", styles: [".calendar-week-navigation{margin-bottom:0}.calendar-week-navigation li.vd-pagination__item{margin-top:0}.calendar-week-navigation span.vd-pagination__title{font-size:1em;line-height:1.2em}:host ::ng-deep .calendar-week-navigation .btn.btn-link .svg-inline--fa{color:var(--vd-primary-dark)}:host ::ng-deep .calendar-week-navigation .btn.btn-link:hover .svg-inline--fa{color:var(--vd-neutral-darker)}.calendar-week-navigation .btn.btn-link{text-transform:none}.calendar-week-navigation .link-week-disabled .vd-pagination__title{color:var(--vd-neutral-light);cursor:not-allowed}.calendar-week-navigation .vd-pagination__link-reset{background:none;border:none;font-weight:inherit;text-decoration-line:none;text-align:inherit;cursor:pointer}.calendar-week-navigation .vd-pagination__link-reset:focus{background-color:var(--vd-focus)}nav ul{margin-bottom:0}\n"] }]
|
|
15147
15147
|
}], propDecorators: { id: [{
|
|
15148
15148
|
type: Input
|
|
15149
15149
|
}], calendar: [{
|
|
@@ -15369,7 +15369,7 @@ class FoehnAgendaTimeslotPanelComponent extends FoehnInputComponent {
|
|
|
15369
15369
|
useExisting: forwardRef(() => FoehnAgendaTimeslotPanelComponent),
|
|
15370
15370
|
multi: true
|
|
15371
15371
|
}
|
|
15372
|
-
], viewQueries: [{ propertyName: "timeSlotButtonsElemRef", predicate: ["timeSlotButtonsElemRef"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<section\n *ngIf=\"calendar | async as loadedCalendar\"\n class=\"panel panel-default mb-3\"\n>\n <div class=\"panel-heading mt-2 mb-2 py-2 d-flex align-items-baseline\">\n <h3 class=\"h5 ms-3 mt-0 mb-0\">\n {{ capitalCaseFirstLetter(currentWeek.day) }}\n <span class=\"visually-hidden\" *ngIf=\"!!isSelected(timeInputValue)\">\n {{\n 'foehn-agenda-timeslot-panel.selected-time'\n | fromDictionary: { timeSelectedValue: timeInputValue }\n }}\n </span>\n </h3>\n <small *ngIf=\"!!currentWeek.timeSlots.length\" class=\"visually-hidden\">\n {{\n 'foehn-agenda-timeslot-panel.nbr-dispo'\n | fromDictionary\n : {\n nbElements:\n currentWeek.timeSlots.length.toString()\n }\n }}\n </small>\n <small\n *ngIf=\"!currentWeek.timeSlots.length\"\n class=\"fst-italic align-self-end ms-2\"\n >\n {{ 'foehn-agenda-timeslot-panel.no-dispo' | fromDictionary }}\n </small>\n </div>\n\n <div\n *ngIf=\"!!currentWeek.timeSlots.length\"\n class=\"panel-body d-flex flex-wrap ms-auto me-auto ps-3 g-0\"\n (focusin)=\"onTimeFocusin()\"\n (focusout)=\"onTimeFocusout()\"\n role=\"application\"\n >\n <button\n *ngFor=\"let timeSlot of timeSlots; let index = index\"\n type=\"button\"\n class=\"btn me-2 mb-2\"\n #timeSlotButtonsElemRef\n [attr.id]=\"\n cleanIdForQuerySelector(currentWeek.day + '-' + timeSlot)\n \"\n [tabindex]=\"getTimeSlotTabIndex(timeSlot, index)\"\n [class.btn-info]=\"!isSelected(timeSlot)\"\n [class.btn-primary]=\"isSelected(timeSlot)\"\n (click)=\"\n handleUserInput(\n currentWeek.day,\n currentWeek.date,\n timeSlot,\n loadedCalendar\n )\n \"\n [attr.aria-label]=\"\n getButtonTimeSlotAriaLabel(currentWeek.day, timeSlot)\n \"\n >\n {{ timeSlot }}\n </button>\n <div\n class=\"col-12 d-flex justify-content-end mb-1\"\n *ngIf=\"currentWeek.timeSlots.length > nbVisibleElements && canClose\"\n >\n <button\n type=\"button\"\n class=\"btn btn-link show-more\"\n #timeSlotButtonsElemRef\n (click)=\"togglePanel()\"\n [attr.aria-label]=\"\n (isClosed\n ? 'foehn-agenda-timeslot-panel.show-more-sr-only'\n : 'foehn-agenda-timeslot-panel.show-less'\n )\n | fromDictionary\n : {\n nbrElementsHidden:\n timeslotRemaining.toString()\n }\n \"\n >\n {{\n (isClosed\n ? 'foehn.agenda-timeslot-panel.show-more'\n : 'foehn-agenda-timeslot-panel.show-less'\n )\n | fromDictionary\n : {\n nbrElementsHidden:\n timeslotRemaining.toString()\n }\n }}\n </button>\n </div>\n </div>\n</section>\n", styles: [".panel-default{border:1px solid #dfdfdf}.panel-heading{position:sticky;background-color:#fff;width:100%;top:0}.panel-heading small{font-size:.9rem}.panel-heading:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}.panel-body .btn-info{background-color:var(--vd-neutral-light);border-color:var(--vd-neutral-light)}.panel-body .btn-info:hover{background-color:var(--vd-neutral-lighter);border-color:var(--vd-neutral-lighter)}.panel-body .btn-info,.panel-body .btn-primary{padding-right:.4rem;padding-left:.4rem}.panel-body .btn-info:hover,.panel-body .btn-primary:hover{box-shadow:0 0 0 .2rem var(--vd-focus)}.panel-body .btn-link{padding:0}.show-more{cursor:pointer;font-size:.9rem}\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: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] }); }
|
|
15372
|
+
], viewQueries: [{ propertyName: "timeSlotButtonsElemRef", predicate: ["timeSlotButtonsElemRef"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<section\n *ngIf=\"calendar | async as loadedCalendar\"\n class=\"panel panel-default mb-3\"\n>\n <div class=\"panel-heading mt-2 mb-2 py-2 d-flex align-items-baseline\">\n <h3 class=\"h5 ms-3 mt-0 mb-0\">\n {{ capitalCaseFirstLetter(currentWeek.day) }}\n <span class=\"visually-hidden\" *ngIf=\"!!isSelected(timeInputValue)\">\n {{\n 'foehn-agenda-timeslot-panel.selected-time'\n | fromDictionary: { timeSelectedValue: timeInputValue }\n }}\n </span>\n </h3>\n <small *ngIf=\"!!currentWeek.timeSlots.length\" class=\"visually-hidden\">\n {{\n 'foehn-agenda-timeslot-panel.nbr-dispo'\n | fromDictionary\n : {\n nbElements:\n currentWeek.timeSlots.length.toString()\n }\n }}\n </small>\n <small\n *ngIf=\"!currentWeek.timeSlots.length\"\n class=\"fst-italic align-self-end ms-2\"\n >\n {{ 'foehn-agenda-timeslot-panel.no-dispo' | fromDictionary }}\n </small>\n </div>\n\n <div\n *ngIf=\"!!currentWeek.timeSlots.length\"\n class=\"panel-body d-flex flex-wrap ms-auto me-auto ps-3 g-0\"\n (focusin)=\"onTimeFocusin()\"\n (focusout)=\"onTimeFocusout()\"\n role=\"application\"\n >\n <button\n *ngFor=\"let timeSlot of timeSlots; let index = index\"\n type=\"button\"\n class=\"btn me-2 mb-2\"\n #timeSlotButtonsElemRef\n [attr.id]=\"\n cleanIdForQuerySelector(currentWeek.day + '-' + timeSlot)\n \"\n [tabindex]=\"getTimeSlotTabIndex(timeSlot, index)\"\n [class.btn-info]=\"!isSelected(timeSlot)\"\n [class.btn-primary]=\"isSelected(timeSlot)\"\n (click)=\"\n handleUserInput(\n currentWeek.day,\n currentWeek.date,\n timeSlot,\n loadedCalendar\n )\n \"\n [attr.aria-label]=\"\n getButtonTimeSlotAriaLabel(currentWeek.day, timeSlot)\n \"\n >\n {{ timeSlot }}\n </button>\n <div\n class=\"col-12 d-flex justify-content-end mb-1\"\n *ngIf=\"currentWeek.timeSlots.length > nbVisibleElements && canClose\"\n >\n <button\n type=\"button\"\n class=\"btn btn-link show-more\"\n #timeSlotButtonsElemRef\n (click)=\"togglePanel()\"\n [attr.aria-label]=\"\n (isClosed\n ? 'foehn-agenda-timeslot-panel.show-more-sr-only'\n : 'foehn-agenda-timeslot-panel.show-less'\n )\n | fromDictionary\n : {\n nbrElementsHidden:\n timeslotRemaining.toString()\n }\n \"\n >\n {{\n (isClosed\n ? 'foehn.agenda-timeslot-panel.show-more'\n : 'foehn-agenda-timeslot-panel.show-less'\n )\n | fromDictionary\n : {\n nbrElementsHidden:\n timeslotRemaining.toString()\n }\n }}\n </button>\n </div>\n </div>\n</section>\n", styles: [".panel-default{border:1px solid #dfdfdf}.panel-heading{position:sticky;background-color:#fff;width:100%;top:0}.panel-heading small{font-size:.9rem}.panel-heading:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}.panel-body .btn-info{background-color:var(--vd-neutral-light);border-color:var(--vd-neutral-light)}.panel-body .btn-info:hover{background-color:var(--vd-neutral-lighter);border-color:var(--vd-neutral-lighter)}.panel-body .btn-info,.panel-body .btn-primary{padding-right:.4rem;padding-left:.4rem}.panel-body .btn-info:hover,.panel-body .btn-primary:hover{box-shadow:0 0 0 .2rem var(--vd-focus)}.panel-body .btn.btn-link{padding:0;margin:0 .25rem 0 0}.show-more{cursor:pointer;font-size:.9rem}\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: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: SdkDictionaryPipe, name: "fromDictionary" }] }); }
|
|
15373
15373
|
}
|
|
15374
15374
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FoehnAgendaTimeslotPanelComponent, decorators: [{
|
|
15375
15375
|
type: Component,
|
|
@@ -15379,7 +15379,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImpor
|
|
|
15379
15379
|
useExisting: forwardRef(() => FoehnAgendaTimeslotPanelComponent),
|
|
15380
15380
|
multi: true
|
|
15381
15381
|
}
|
|
15382
|
-
], template: "<section\n *ngIf=\"calendar | async as loadedCalendar\"\n class=\"panel panel-default mb-3\"\n>\n <div class=\"panel-heading mt-2 mb-2 py-2 d-flex align-items-baseline\">\n <h3 class=\"h5 ms-3 mt-0 mb-0\">\n {{ capitalCaseFirstLetter(currentWeek.day) }}\n <span class=\"visually-hidden\" *ngIf=\"!!isSelected(timeInputValue)\">\n {{\n 'foehn-agenda-timeslot-panel.selected-time'\n | fromDictionary: { timeSelectedValue: timeInputValue }\n }}\n </span>\n </h3>\n <small *ngIf=\"!!currentWeek.timeSlots.length\" class=\"visually-hidden\">\n {{\n 'foehn-agenda-timeslot-panel.nbr-dispo'\n | fromDictionary\n : {\n nbElements:\n currentWeek.timeSlots.length.toString()\n }\n }}\n </small>\n <small\n *ngIf=\"!currentWeek.timeSlots.length\"\n class=\"fst-italic align-self-end ms-2\"\n >\n {{ 'foehn-agenda-timeslot-panel.no-dispo' | fromDictionary }}\n </small>\n </div>\n\n <div\n *ngIf=\"!!currentWeek.timeSlots.length\"\n class=\"panel-body d-flex flex-wrap ms-auto me-auto ps-3 g-0\"\n (focusin)=\"onTimeFocusin()\"\n (focusout)=\"onTimeFocusout()\"\n role=\"application\"\n >\n <button\n *ngFor=\"let timeSlot of timeSlots; let index = index\"\n type=\"button\"\n class=\"btn me-2 mb-2\"\n #timeSlotButtonsElemRef\n [attr.id]=\"\n cleanIdForQuerySelector(currentWeek.day + '-' + timeSlot)\n \"\n [tabindex]=\"getTimeSlotTabIndex(timeSlot, index)\"\n [class.btn-info]=\"!isSelected(timeSlot)\"\n [class.btn-primary]=\"isSelected(timeSlot)\"\n (click)=\"\n handleUserInput(\n currentWeek.day,\n currentWeek.date,\n timeSlot,\n loadedCalendar\n )\n \"\n [attr.aria-label]=\"\n getButtonTimeSlotAriaLabel(currentWeek.day, timeSlot)\n \"\n >\n {{ timeSlot }}\n </button>\n <div\n class=\"col-12 d-flex justify-content-end mb-1\"\n *ngIf=\"currentWeek.timeSlots.length > nbVisibleElements && canClose\"\n >\n <button\n type=\"button\"\n class=\"btn btn-link show-more\"\n #timeSlotButtonsElemRef\n (click)=\"togglePanel()\"\n [attr.aria-label]=\"\n (isClosed\n ? 'foehn-agenda-timeslot-panel.show-more-sr-only'\n : 'foehn-agenda-timeslot-panel.show-less'\n )\n | fromDictionary\n : {\n nbrElementsHidden:\n timeslotRemaining.toString()\n }\n \"\n >\n {{\n (isClosed\n ? 'foehn.agenda-timeslot-panel.show-more'\n : 'foehn-agenda-timeslot-panel.show-less'\n )\n | fromDictionary\n : {\n nbrElementsHidden:\n timeslotRemaining.toString()\n }\n }}\n </button>\n </div>\n </div>\n</section>\n", styles: [".panel-default{border:1px solid #dfdfdf}.panel-heading{position:sticky;background-color:#fff;width:100%;top:0}.panel-heading small{font-size:.9rem}.panel-heading:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}.panel-body .btn-info{background-color:var(--vd-neutral-light);border-color:var(--vd-neutral-light)}.panel-body .btn-info:hover{background-color:var(--vd-neutral-lighter);border-color:var(--vd-neutral-lighter)}.panel-body .btn-info,.panel-body .btn-primary{padding-right:.4rem;padding-left:.4rem}.panel-body .btn-info:hover,.panel-body .btn-primary:hover{box-shadow:0 0 0 .2rem var(--vd-focus)}.panel-body .btn-link{padding:0}.show-more{cursor:pointer;font-size:.9rem}\n"] }]
|
|
15382
|
+
], template: "<section\n *ngIf=\"calendar | async as loadedCalendar\"\n class=\"panel panel-default mb-3\"\n>\n <div class=\"panel-heading mt-2 mb-2 py-2 d-flex align-items-baseline\">\n <h3 class=\"h5 ms-3 mt-0 mb-0\">\n {{ capitalCaseFirstLetter(currentWeek.day) }}\n <span class=\"visually-hidden\" *ngIf=\"!!isSelected(timeInputValue)\">\n {{\n 'foehn-agenda-timeslot-panel.selected-time'\n | fromDictionary: { timeSelectedValue: timeInputValue }\n }}\n </span>\n </h3>\n <small *ngIf=\"!!currentWeek.timeSlots.length\" class=\"visually-hidden\">\n {{\n 'foehn-agenda-timeslot-panel.nbr-dispo'\n | fromDictionary\n : {\n nbElements:\n currentWeek.timeSlots.length.toString()\n }\n }}\n </small>\n <small\n *ngIf=\"!currentWeek.timeSlots.length\"\n class=\"fst-italic align-self-end ms-2\"\n >\n {{ 'foehn-agenda-timeslot-panel.no-dispo' | fromDictionary }}\n </small>\n </div>\n\n <div\n *ngIf=\"!!currentWeek.timeSlots.length\"\n class=\"panel-body d-flex flex-wrap ms-auto me-auto ps-3 g-0\"\n (focusin)=\"onTimeFocusin()\"\n (focusout)=\"onTimeFocusout()\"\n role=\"application\"\n >\n <button\n *ngFor=\"let timeSlot of timeSlots; let index = index\"\n type=\"button\"\n class=\"btn me-2 mb-2\"\n #timeSlotButtonsElemRef\n [attr.id]=\"\n cleanIdForQuerySelector(currentWeek.day + '-' + timeSlot)\n \"\n [tabindex]=\"getTimeSlotTabIndex(timeSlot, index)\"\n [class.btn-info]=\"!isSelected(timeSlot)\"\n [class.btn-primary]=\"isSelected(timeSlot)\"\n (click)=\"\n handleUserInput(\n currentWeek.day,\n currentWeek.date,\n timeSlot,\n loadedCalendar\n )\n \"\n [attr.aria-label]=\"\n getButtonTimeSlotAriaLabel(currentWeek.day, timeSlot)\n \"\n >\n {{ timeSlot }}\n </button>\n <div\n class=\"col-12 d-flex justify-content-end mb-1\"\n *ngIf=\"currentWeek.timeSlots.length > nbVisibleElements && canClose\"\n >\n <button\n type=\"button\"\n class=\"btn btn-link show-more\"\n #timeSlotButtonsElemRef\n (click)=\"togglePanel()\"\n [attr.aria-label]=\"\n (isClosed\n ? 'foehn-agenda-timeslot-panel.show-more-sr-only'\n : 'foehn-agenda-timeslot-panel.show-less'\n )\n | fromDictionary\n : {\n nbrElementsHidden:\n timeslotRemaining.toString()\n }\n \"\n >\n {{\n (isClosed\n ? 'foehn.agenda-timeslot-panel.show-more'\n : 'foehn-agenda-timeslot-panel.show-less'\n )\n | fromDictionary\n : {\n nbrElementsHidden:\n timeslotRemaining.toString()\n }\n }}\n </button>\n </div>\n </div>\n</section>\n", styles: [".panel-default{border:1px solid #dfdfdf}.panel-heading{position:sticky;background-color:#fff;width:100%;top:0}.panel-heading small{font-size:.9rem}.panel-heading:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem var(--vd-focus)}.panel-body .btn-info{background-color:var(--vd-neutral-light);border-color:var(--vd-neutral-light)}.panel-body .btn-info:hover{background-color:var(--vd-neutral-lighter);border-color:var(--vd-neutral-lighter)}.panel-body .btn-info,.panel-body .btn-primary{padding-right:.4rem;padding-left:.4rem}.panel-body .btn-info:hover,.panel-body .btn-primary:hover{box-shadow:0 0 0 .2rem var(--vd-focus)}.panel-body .btn.btn-link{padding:0;margin:0 .25rem 0 0}.show-more{cursor:pointer;font-size:.9rem}\n"] }]
|
|
15383
15383
|
}], ctorParameters: () => [{ type: SdkDictionaryService }], propDecorators: { timeSlotButtonsElemRef: [{
|
|
15384
15384
|
type: ViewChildren,
|
|
15385
15385
|
args: ['timeSlotButtonsElemRef']
|