@elderbyte/ngx-starter 19.1.0-beta.12 → 19.1.0-beta.13

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.
Files changed (24) hide show
  1. package/fesm2022/elderbyte-ngx-starter.mjs +16 -16
  2. package/fesm2022/elderbyte-ngx-starter.mjs.map +1 -1
  3. package/package.json +1 -1
  4. package/src/lib/components/card-organizer/card-stack/elder-card-stack.component.scss +0 -72
  5. package/src/lib/components/data-transfer/http-data-transfer-overview/http-data-transfer-overview.component.scss +5 -2
  6. package/src/lib/components/data-view/grid/elder-grid/elder-grid.component.scss +74 -83
  7. package/src/lib/components/data-view/table/elder-table/elder-table.component.scss +0 -216
  8. package/src/lib/components/navigation/nav/nav-group/elder-nav-group.component.scss +22 -3
  9. package/src/lib/components/navigation/nav/nav-link/elder-nav-link.component.scss +38 -4
  10. package/src/lib/components/select/filter/elder-filter-chip-template/elder-filter-chip-template.component.scss +0 -77
  11. package/src/lib/components/select/multi/elder-multi-select-chip-options/elder-multi-select-chip-options.component.scss +0 -48
  12. package/src/lib/components/select/multi/elder-multi-select-chips/elder-multi-select-chips.component.scss +0 -60
  13. package/src/lib/components/select/single/elder-select/elder-select.component.scss +0 -58
  14. package/theming/base/_elder-component-themes.scss +10 -11
  15. package/theming/base/_elder-fixes-base.scss +0 -21
  16. package/theming/components/_elder-card-stack-theme.scss +72 -0
  17. package/theming/components/_elder-nav-theme.scss +24 -0
  18. package/theming/components/_elder-table-theme.scss +213 -0
  19. package/theming/components/elder-filter-chip-template-theme.scss +79 -0
  20. package/theming/components/elder-multi-select-chip-options-theme.scss +48 -0
  21. package/theming/components/elder-multi-select-chips-theme.scss +60 -0
  22. package/theming/components/elder-select-theme.scss +58 -0
  23. package/src/lib/components/navigation/nav/_elder-nav-theme.scss +0 -66
  24. /package/{src/lib/components/select/_elder-select-base.scss → theming/components/_elder-select-base-mixin.scss} +0 -0
@@ -9650,11 +9650,11 @@ class ElderAccessDeniedComponent {
9650
9650
  constructor() { }
9651
9651
  ngOnInit() { }
9652
9652
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: ElderAccessDeniedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
9653
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: ElderAccessDeniedComponent, isStandalone: true, selector: "elder-access-denied", ngImport: i0, template: "<div class=\"layout-col flex p-md\">\n <div class=\"legacy-layout-card\" appearance=\"outlined\">\n <div class=\"layout-row place-start-center gap-md\">\n <mat-icon color=\"warn\">warning</mat-icon>\n <span>You do not have the permission to access this resource.</span>\n </div>\n </div>\n</div>\n", styles: [".padding{padding:10px}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
9653
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: ElderAccessDeniedComponent, isStandalone: true, selector: "elder-access-denied", ngImport: i0, template: "<div class=\"layout-col flex p-md\">\n <mat-card appearance=\"outlined\">\n <div class=\"layout-row place-start-center gap-md\">\n <mat-icon color=\"warn\">warning</mat-icon>\n <span>You do not have the permission to access this resource.</span>\n </div>\n </mat-card>\n</div>\n", styles: [".padding{padding:10px}\n"], dependencies: [{ kind: "component", type: MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
9654
9654
  }
9655
9655
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: ElderAccessDeniedComponent, decorators: [{
9656
9656
  type: Component,
9657
- args: [{ selector: 'elder-access-denied', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatCard, MatIcon], template: "<div class=\"layout-col flex p-md\">\n <div class=\"legacy-layout-card\" appearance=\"outlined\">\n <div class=\"layout-row place-start-center gap-md\">\n <mat-icon color=\"warn\">warning</mat-icon>\n <span>You do not have the permission to access this resource.</span>\n </div>\n </div>\n</div>\n", styles: [".padding{padding:10px}\n"] }]
9657
+ args: [{ selector: 'elder-access-denied', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatCard, MatIcon], template: "<div class=\"layout-col flex p-md\">\n <mat-card appearance=\"outlined\">\n <div class=\"layout-row place-start-center gap-md\">\n <mat-icon color=\"warn\">warning</mat-icon>\n <span>You do not have the permission to access this resource.</span>\n </div>\n </mat-card>\n</div>\n", styles: [".padding{padding:10px}\n"] }]
9658
9658
  }], ctorParameters: () => [] });
9659
9659
 
9660
9660
  class ElderAccessDeniedModule {
@@ -12312,7 +12312,7 @@ class ElderCardStackComponent {
12312
12312
  }
12313
12313
  }
12314
12314
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: ElderCardStackComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
12315
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: ElderCardStackComponent, isStandalone: true, selector: "elder-card-stack", inputs: { stackId: "stackId", headerEnabled: "headerEnabled", headerTitle: "headerTitle", canRemove: "canRemove", canAdd: "canAdd", canDrag: "canDrag", removeConfirmation: "removeConfirmation", canEnterPredicate: "canEnterPredicate", connectedTo: "connectedTo", autoMoveCards: "autoMoveCards", canCollapse: "canCollapse", copyOnDrag: "copyOnDrag", cardTemplate: "cardTemplate", stack: "stack" }, outputs: { requestNewCard: "requestNewCard", requestRemoveCard: "requestRemoveCard", cardClick: "cardClick", cardDropped: "cardDropped" }, queries: [{ propertyName: "cardTemplateQuery", first: true, predicate: ElderStackCardDirective, descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: "<div class=\"layout-col full card-stack hoverme\">\n <!-- Header -->\n <header\n *ngIf=\"headerEnabled\"\n class=\"layout-row place-start-center flex-none gap-md stack-header p-md\"\n >\n <h3 class=\"mat-subtitle-2 noselect\">{{ headerTitle | translate }}</h3>\n <small class=\"mat-caption noselect\">({{ (cards$ | async)?.length }})</small>\n\n <span class=\"flex\"></span>\n\n <button *ngIf=\"canAdd\" mat-icon-button type=\"button\" (click)=\"onRequestNewCard($event)\">\n <mat-icon>add</mat-icon>\n </button>\n </header>\n <mat-divider *ngIf=\"headerEnabled\"></mat-divider>\n\n <!-- card list -->\n <div class=\"layout-col flex card-container\">\n <div\n class=\"layout-col gap-sm scrollable p-sm card-list\"\n [id]=\"stackId\"\n cdkDropList\n [cdkDropListDisabled]=\"!canDrag\"\n [cdkDropListData]=\"stack\"\n [cdkDropListConnectedTo]=\"connectedTo\"\n [cdkDropListEnterPredicate]=\"enterPredicate\"\n (cdkDropListEntered)=\"cardEntered($event)\"\n (cdkDropListExited)=\"cardExited($event)\"\n (cdkDropListDropped)=\"cardDrop($event)\"\n >\n <!-- card -->\n <elder-card\n *ngFor=\"let card of cards$ | async; let i = index\"\n class=\"card flex-none\"\n [ngClass]=\"cardClick.observed ? 'clickable' : 'unclickable'\"\n cdkDrag\n [cdkDragData]=\"card\"\n (click)=\"onCardSelected($event, card)\"\n >\n <div class=\"layout-row place-between-center flex\">\n <ng-container\n *ngTemplateOutlet=\"\n cardTemplate || simpleCardTemplate;\n context: { $implicit: card, index: i }\n \"\n ></ng-container>\n\n <button\n mat-icon-button\n type=\"button\"\n *ngIf=\"canRemove\"\n class=\"hide\"\n (click)=\"onRequestRemoveCard($event, card)\"\n >\n <mat-icon>close</mat-icon>\n </button>\n </div>\n </elder-card>\n </div>\n </div>\n\n <ng-template #simpleCardTemplate let-card>\n <div class=\"layout-col flex\">\n <p class=\"noselect\">{{ card }}</p>\n </div>\n </ng-template>\n</div>\n", styles: [".stack-header{height:62px}.card-container{min-width:120px;min-height:0}.card-list{min-height:100%}.card{border-radius:var(--elder-border-radius-sm);box-shadow:var(--mat-app-elevation-shadow-level-1);cursor:move;overflow:hidden}.card.cdk-drag-disabled.clickable{cursor:pointer}.card.cdk-drag-disabled.unclickable{cursor:default}.hoverme .hide{visibility:hidden}.hoverme:hover .hide{visibility:visible}.rotate{transform:rotate(-90deg)}.scrollable{overflow-y:auto;-webkit-overflow-scrolling:touch}.noselect{-webkit-user-select:none;user-select:none}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.card-list.cdk-drop-list-dragging .card:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ElderCardComponent, selector: "elder-card", inputs: ["appearance", "float", "flat"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
12315
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: ElderCardStackComponent, isStandalone: true, selector: "elder-card-stack", inputs: { stackId: "stackId", headerEnabled: "headerEnabled", headerTitle: "headerTitle", canRemove: "canRemove", canAdd: "canAdd", canDrag: "canDrag", removeConfirmation: "removeConfirmation", canEnterPredicate: "canEnterPredicate", connectedTo: "connectedTo", autoMoveCards: "autoMoveCards", canCollapse: "canCollapse", copyOnDrag: "copyOnDrag", cardTemplate: "cardTemplate", stack: "stack" }, outputs: { requestNewCard: "requestNewCard", requestRemoveCard: "requestRemoveCard", cardClick: "cardClick", cardDropped: "cardDropped" }, queries: [{ propertyName: "cardTemplateQuery", first: true, predicate: ElderStackCardDirective, descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: "<div class=\"layout-col full card-stack hoverme\">\n <!-- Header -->\n <header\n *ngIf=\"headerEnabled\"\n class=\"layout-row place-start-center flex-none gap-md stack-header p-md\"\n >\n <h3 class=\"mat-subtitle-2 noselect\">{{ headerTitle | translate }}</h3>\n <small class=\"mat-caption noselect\">({{ (cards$ | async)?.length }})</small>\n\n <span class=\"flex\"></span>\n\n <button *ngIf=\"canAdd\" mat-icon-button type=\"button\" (click)=\"onRequestNewCard($event)\">\n <mat-icon>add</mat-icon>\n </button>\n </header>\n <mat-divider *ngIf=\"headerEnabled\"></mat-divider>\n\n <!-- card list -->\n <div class=\"layout-col flex card-container\">\n <div\n class=\"layout-col gap-sm scrollable p-sm card-list\"\n [id]=\"stackId\"\n cdkDropList\n [cdkDropListDisabled]=\"!canDrag\"\n [cdkDropListData]=\"stack\"\n [cdkDropListConnectedTo]=\"connectedTo\"\n [cdkDropListEnterPredicate]=\"enterPredicate\"\n (cdkDropListEntered)=\"cardEntered($event)\"\n (cdkDropListExited)=\"cardExited($event)\"\n (cdkDropListDropped)=\"cardDrop($event)\"\n >\n <!-- card -->\n <elder-card\n *ngFor=\"let card of cards$ | async; let i = index\"\n class=\"card flex-none\"\n [ngClass]=\"cardClick.observed ? 'clickable' : 'unclickable'\"\n cdkDrag\n [cdkDragData]=\"card\"\n (click)=\"onCardSelected($event, card)\"\n >\n <div class=\"layout-row place-between-center flex\">\n <ng-container\n *ngTemplateOutlet=\"\n cardTemplate || simpleCardTemplate;\n context: { $implicit: card, index: i }\n \"\n ></ng-container>\n\n <button\n mat-icon-button\n type=\"button\"\n *ngIf=\"canRemove\"\n class=\"hide\"\n (click)=\"onRequestRemoveCard($event, card)\"\n >\n <mat-icon>close</mat-icon>\n </button>\n </div>\n </elder-card>\n </div>\n </div>\n\n <ng-template #simpleCardTemplate let-card>\n <div class=\"layout-col flex\">\n <p class=\"noselect\">{{ card }}</p>\n </div>\n </ng-template>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ElderCardComponent, selector: "elder-card", inputs: ["appearance", "float", "flat"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
12316
12316
  }
12317
12317
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: ElderCardStackComponent, decorators: [{
12318
12318
  type: Component,
@@ -12329,7 +12329,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
12329
12329
  NgTemplateOutlet,
12330
12330
  AsyncPipe,
12331
12331
  TranslateModule,
12332
- ], template: "<div class=\"layout-col full card-stack hoverme\">\n <!-- Header -->\n <header\n *ngIf=\"headerEnabled\"\n class=\"layout-row place-start-center flex-none gap-md stack-header p-md\"\n >\n <h3 class=\"mat-subtitle-2 noselect\">{{ headerTitle | translate }}</h3>\n <small class=\"mat-caption noselect\">({{ (cards$ | async)?.length }})</small>\n\n <span class=\"flex\"></span>\n\n <button *ngIf=\"canAdd\" mat-icon-button type=\"button\" (click)=\"onRequestNewCard($event)\">\n <mat-icon>add</mat-icon>\n </button>\n </header>\n <mat-divider *ngIf=\"headerEnabled\"></mat-divider>\n\n <!-- card list -->\n <div class=\"layout-col flex card-container\">\n <div\n class=\"layout-col gap-sm scrollable p-sm card-list\"\n [id]=\"stackId\"\n cdkDropList\n [cdkDropListDisabled]=\"!canDrag\"\n [cdkDropListData]=\"stack\"\n [cdkDropListConnectedTo]=\"connectedTo\"\n [cdkDropListEnterPredicate]=\"enterPredicate\"\n (cdkDropListEntered)=\"cardEntered($event)\"\n (cdkDropListExited)=\"cardExited($event)\"\n (cdkDropListDropped)=\"cardDrop($event)\"\n >\n <!-- card -->\n <elder-card\n *ngFor=\"let card of cards$ | async; let i = index\"\n class=\"card flex-none\"\n [ngClass]=\"cardClick.observed ? 'clickable' : 'unclickable'\"\n cdkDrag\n [cdkDragData]=\"card\"\n (click)=\"onCardSelected($event, card)\"\n >\n <div class=\"layout-row place-between-center flex\">\n <ng-container\n *ngTemplateOutlet=\"\n cardTemplate || simpleCardTemplate;\n context: { $implicit: card, index: i }\n \"\n ></ng-container>\n\n <button\n mat-icon-button\n type=\"button\"\n *ngIf=\"canRemove\"\n class=\"hide\"\n (click)=\"onRequestRemoveCard($event, card)\"\n >\n <mat-icon>close</mat-icon>\n </button>\n </div>\n </elder-card>\n </div>\n </div>\n\n <ng-template #simpleCardTemplate let-card>\n <div class=\"layout-col flex\">\n <p class=\"noselect\">{{ card }}</p>\n </div>\n </ng-template>\n</div>\n", styles: [".stack-header{height:62px}.card-container{min-width:120px;min-height:0}.card-list{min-height:100%}.card{border-radius:var(--elder-border-radius-sm);box-shadow:var(--mat-app-elevation-shadow-level-1);cursor:move;overflow:hidden}.card.cdk-drag-disabled.clickable{cursor:pointer}.card.cdk-drag-disabled.unclickable{cursor:default}.hoverme .hide{visibility:hidden}.hoverme:hover .hide{visibility:visible}.rotate{transform:rotate(-90deg)}.scrollable{overflow-y:auto;-webkit-overflow-scrolling:touch}.noselect{-webkit-user-select:none;user-select:none}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.card-list.cdk-drop-list-dragging .card:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"] }]
12332
+ ], template: "<div class=\"layout-col full card-stack hoverme\">\n <!-- Header -->\n <header\n *ngIf=\"headerEnabled\"\n class=\"layout-row place-start-center flex-none gap-md stack-header p-md\"\n >\n <h3 class=\"mat-subtitle-2 noselect\">{{ headerTitle | translate }}</h3>\n <small class=\"mat-caption noselect\">({{ (cards$ | async)?.length }})</small>\n\n <span class=\"flex\"></span>\n\n <button *ngIf=\"canAdd\" mat-icon-button type=\"button\" (click)=\"onRequestNewCard($event)\">\n <mat-icon>add</mat-icon>\n </button>\n </header>\n <mat-divider *ngIf=\"headerEnabled\"></mat-divider>\n\n <!-- card list -->\n <div class=\"layout-col flex card-container\">\n <div\n class=\"layout-col gap-sm scrollable p-sm card-list\"\n [id]=\"stackId\"\n cdkDropList\n [cdkDropListDisabled]=\"!canDrag\"\n [cdkDropListData]=\"stack\"\n [cdkDropListConnectedTo]=\"connectedTo\"\n [cdkDropListEnterPredicate]=\"enterPredicate\"\n (cdkDropListEntered)=\"cardEntered($event)\"\n (cdkDropListExited)=\"cardExited($event)\"\n (cdkDropListDropped)=\"cardDrop($event)\"\n >\n <!-- card -->\n <elder-card\n *ngFor=\"let card of cards$ | async; let i = index\"\n class=\"card flex-none\"\n [ngClass]=\"cardClick.observed ? 'clickable' : 'unclickable'\"\n cdkDrag\n [cdkDragData]=\"card\"\n (click)=\"onCardSelected($event, card)\"\n >\n <div class=\"layout-row place-between-center flex\">\n <ng-container\n *ngTemplateOutlet=\"\n cardTemplate || simpleCardTemplate;\n context: { $implicit: card, index: i }\n \"\n ></ng-container>\n\n <button\n mat-icon-button\n type=\"button\"\n *ngIf=\"canRemove\"\n class=\"hide\"\n (click)=\"onRequestRemoveCard($event, card)\"\n >\n <mat-icon>close</mat-icon>\n </button>\n </div>\n </elder-card>\n </div>\n </div>\n\n <ng-template #simpleCardTemplate let-card>\n <div class=\"layout-col flex\">\n <p class=\"noselect\">{{ card }}</p>\n </div>\n </ng-template>\n</div>\n" }]
12333
12333
  }], ctorParameters: () => [], propDecorators: { stackId: [{
12334
12334
  type: Input
12335
12335
  }], headerEnabled: [{
@@ -18898,7 +18898,7 @@ class ElderGridComponent extends ElderDataViewBaseComponent {
18898
18898
  provide: ELDER_DATA_VIEW,
18899
18899
  useExisting: forwardRef(() => ElderGridComponent),
18900
18900
  },
18901
- ], queries: [{ propertyName: "tileTemplateQuery", first: true, predicate: ElderGridTileDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "toolbarTemplateQuery", first: true, predicate: ElderGridToolbarDirective, descendants: true, read: TemplateRef, static: true }], viewQueries: [{ propertyName: "virtualScrollViewPort", first: true, predicate: ["virtualScrollViewPort"], descendants: true, static: true }, { propertyName: "matPaginator", first: true, predicate: MatPaginator, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"full elder-grid-component\">\n @if (dataContext$ | async; as data) {\n <!-- Grid Browser -->\n <div\n class=\"layout-col full elder-grid-container\"\n [elderDataContextSelection]=\"data\"\n #dataSelection=\"elderDataContextSelection\"\n [elderDataContextSelectionModel]=\"selectionModel\"\n >\n <!-- Toolbar Row -->\n @if (toolbarVisible) {\n <div class=\"layout-row place-start-center flex-none elder-grid-toolbar\">\n @if (selectionVisible) {\n <div class=\"layout-col flex-none px-sm\">\n <elder-selection-master-checkbox\n class=\"flex-none\"\n style=\"padding-left: 12px\"\n ></elder-selection-master-checkbox>\n </div>\n }\n\n <!-- Toolbar -->\n @if (toolbarTemplate) {\n <ng-template\n *ngTemplateOutlet=\"toolbarTemplate; context: { $implicit: this }\"\n ></ng-template>\n }\n\n @if (availableCompositeSorts && availableCompositeSorts.length > 0) {\n <elder-composite-sort\n class=\"flex-none\"\n [availableSorts]=\"availableCompositeSorts\"\n [translationPrefix]=\"sortTranslationPrefix\"\n [elderCompositeSortDc]=\"data\"\n >\n </elder-composite-sort>\n }\n </div>\n\n <mat-divider></mat-divider>\n }\n\n <elder-data-context-state-indicator class=\"flex-none\" [dataContext]=\"data\">\n </elder-data-context-state-indicator>\n\n <!-- [cdkDropListSortingDisabled]=\"true\" -->\n <!-- cdkDropList -->\n <cdk-virtual-scroll-viewport\n class=\"layout-col flex elder-grid-browser\"\n id=\"{{ scrollContainerId }}\"\n [itemSize]=\"itemHeight\"\n [minBufferPx]=\"itemHeight * 2\"\n [maxBufferPx]=\"itemHeight * 3\"\n #virtualScrollViewPort\n elderInfiniteScroll\n [eventThrottle]=\"200\"\n [offsetFactor]=\"2\"\n [ignoreScrollEvent]=\"data.loading | async\"\n [containerId]=\"scrollContainerId\"\n [listenToHost]=\"false\"\n (closeToEnd)=\"requestMoreDataZoned($event)\"\n >\n <!-- (scrolling)=\"onScrolling($event)\" -->\n\n <div\n *cdkVirtualFor=\"\n let gridRow of dataRows$;\n trackBy: TrackGridRowByIdFn;\n templateCacheSize: 50\n \"\n class=\"elder-grid-tile-row\"\n [style.height]=\"itemHeight + 'px'\"\n >\n @for (tile of gridRow.cells; track getId(tile)) {\n <!-- Tile Cell -->\n @if (showTile(tile)) {\n <mat-card appearance=\"outlined\" class=\"elder-grid-tile\">\n <div\n class=\"elder-grid-tile-content\"\n (click)=\"onItemClick(tile)\"\n (dblclick)=\"onItemDoubleClick(tile)\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n tileTemplate || simpleTileTemplate;\n context: { $implicit: tile }\n \"\n ></ng-container>\n <!-- Overlay (Selection) -->\n @if (selectionVisible) {\n @if (selectionModel.selection | async; as selection) {\n <div\n class=\"elder-grid-tile-overlay elder-click-through\"\n [class.elder-grid-tile-overlay-hidden]=\"!inSelectionMode(selection)\"\n [class.elder-grid-tile-overlay-visible]=\"inSelectionMode(selection)\"\n >\n <button\n mat-icon-button\n type=\"button\"\n (click)=\"selectionModel.toggle(tile)\"\n elderStopEventPropagation\n class=\"elder-grid-tile-check\"\n >\n <mat-icon\n [class.elder-selected]=\"selectionModel.observeSelection(tile) | async\"\n >\n {{\n (selectionModel.observeSelection(tile) | async)\n ? 'check_circle'\n : 'radio_button_unchecked'\n }}\n </mat-icon>\n </button>\n </div>\n }\n }\n </div>\n </mat-card>\n } @else {\n <div class=\"elder-grid-tile-hidden\"></div>\n }\n }\n </div>\n </cdk-virtual-scroll-viewport>\n\n <mat-progress-bar\n class=\"flex-none\"\n [mode]=\"(data?.loading | async) ? 'indeterminate' : 'determinate'\"\n [color]=\"data && (data.status | async)?.hasError ? 'warn' : 'primary'\"\n >\n </mat-progress-bar>\n\n <!-- Footer -->\n @if (footerVisible) {\n <div\n class=\"layout-row place-end-center gap-md flex-none elder-grid-footer\"\n >\n <!-- Continuable -->\n @if (isContinuable) {\n <span class=\"mat-caption noselect\" style=\"color: gray\">\n {{ (dataSnapshot?.data | async)?.length }} / {{ total$ | async }}\n </span>\n\n <button\n mat-icon-button\n type=\"button\"\n color=\"primary\"\n [disabled]=\"!(canLoadMore$ | async)\"\n (click)=\"dataSnapshot.loadMore()\"\n >\n <mat-icon>keyboard_arrow_down</mat-icon>\n </button>\n }\n\n <!-- Paged -->\n @if (isActivePaged) {\n @if (dataActivePaged.page | async; as page) {\n <mat-paginator\n class=\"flex-none\"\n [length]=\"dataContext?.total | async\"\n [pageIndex]=\"page?.index\"\n [pageSize]=\"page?.size\"\n [pageSizeOptions]=\"pageSizeOptions\"\n >\n </mat-paginator>\n }\n }\n\n <!-- Local Source -->\n @if (!isActivePaged && !isContinuable) {\n <span class=\"mat-caption noselect\" style=\"color: gray\">\n {{ (dataSnapshot?.data | async)?.length }}\n </span>\n }\n </div>\n }\n </div>\n }\n</div>\n\n<ng-template #simpleTileTemplate let-tile>\n @if (tile) {\n <div class=\"layout-col place-center-center flex\" style=\"background-color: lightblue\">\n <p class=\"noselect\">Tile: {{ tile }}</p>\n </div>\n }\n</ng-template>\n", styles: [":host{min-width:0;min-height:0}.elder-grid-tile-row{display:flex;flex-direction:row;padding:8px}.elder-grid-tile-row:first-child{padding-top:16px}.elder-grid-tile-hidden{flex:0 1 100%;margin:8px;width:100%;height:100%}.elder-grid-tile-content{position:relative;width:100%;height:100%;overflow:hidden}.elder-grid-tile-overlay{position:absolute;inset:0;transition:background-color .1s ease-in,opacity .1s ease-in}.elder-click-through{pointer-events:none}.elder-grid-tile-overlay-visible{opacity:1}.elder-grid-tile-overlay-hidden{opacity:0}\n"], dependencies: [{ kind: "component", type: MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: DataContextSelectionDirective, selector: "[elderDataContextSelection]", inputs: ["elderDataContextSelectionModel", "elderDataContextSelection"], exportAs: ["elderDataContextSelection"] }, { kind: "component", type: ElderSelectionMasterCheckboxComponent, selector: "elder-selection-master-checkbox" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: DataContextStateIndicatorComponent, selector: "elder-data-context-state-indicator", inputs: ["dataContext"] }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: ElderInfiniteScrollDirective, selector: "[elderInfiniteScroll]", inputs: ["listenToHost", "eventThrottle", "offsetFactor", "ignoreScrollEvent", "containerId", "scrollContainer"], outputs: ["closeToEnd", "scrolling"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: ElderStopEventPropagationDirective, selector: "[elderStopEventPropagation]" }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: ElderCompositeSortComponent, selector: "elder-composite-sort", inputs: ["availableSorts", "sorts", "translationPrefix"], outputs: ["sortsChange"] }, { kind: "directive", type: ElderCompositeSortDcDirective, selector: "[elderCompositeSortDc]", inputs: ["elderCompositeSortDc"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
18901
+ ], queries: [{ propertyName: "tileTemplateQuery", first: true, predicate: ElderGridTileDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "toolbarTemplateQuery", first: true, predicate: ElderGridToolbarDirective, descendants: true, read: TemplateRef, static: true }], viewQueries: [{ propertyName: "virtualScrollViewPort", first: true, predicate: ["virtualScrollViewPort"], descendants: true, static: true }, { propertyName: "matPaginator", first: true, predicate: MatPaginator, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"full elder-grid-component\">\n @if (dataContext$ | async; as data) {\n <!-- Grid Browser -->\n <div\n class=\"layout-col full elder-grid-container\"\n [elderDataContextSelection]=\"data\"\n #dataSelection=\"elderDataContextSelection\"\n [elderDataContextSelectionModel]=\"selectionModel\"\n >\n <!-- Toolbar Row -->\n @if (toolbarVisible) {\n <div class=\"layout-row place-start-center flex-none elder-grid-toolbar\">\n @if (selectionVisible) {\n <div class=\"layout-col flex-none px-sm\">\n <elder-selection-master-checkbox\n class=\"flex-none\"\n style=\"padding-left: 12px\"\n ></elder-selection-master-checkbox>\n </div>\n }\n\n <!-- Toolbar -->\n @if (toolbarTemplate) {\n <ng-template\n *ngTemplateOutlet=\"toolbarTemplate; context: { $implicit: this }\"\n ></ng-template>\n }\n\n @if (availableCompositeSorts && availableCompositeSorts.length > 0) {\n <elder-composite-sort\n class=\"flex-none\"\n [availableSorts]=\"availableCompositeSorts\"\n [translationPrefix]=\"sortTranslationPrefix\"\n [elderCompositeSortDc]=\"data\"\n >\n </elder-composite-sort>\n }\n </div>\n\n <mat-divider></mat-divider>\n }\n\n <elder-data-context-state-indicator class=\"flex-none\" [dataContext]=\"data\">\n </elder-data-context-state-indicator>\n\n <!-- [cdkDropListSortingDisabled]=\"true\" -->\n <!-- cdkDropList -->\n <cdk-virtual-scroll-viewport\n class=\"layout-col flex elder-grid-browser\"\n id=\"{{ scrollContainerId }}\"\n [itemSize]=\"itemHeight\"\n [minBufferPx]=\"itemHeight * 2\"\n [maxBufferPx]=\"itemHeight * 3\"\n #virtualScrollViewPort\n elderInfiniteScroll\n [eventThrottle]=\"200\"\n [offsetFactor]=\"2\"\n [ignoreScrollEvent]=\"data.loading | async\"\n [containerId]=\"scrollContainerId\"\n [listenToHost]=\"false\"\n (closeToEnd)=\"requestMoreDataZoned($event)\"\n >\n <!-- (scrolling)=\"onScrolling($event)\" -->\n\n <div\n *cdkVirtualFor=\"\n let gridRow of dataRows$;\n trackBy: TrackGridRowByIdFn;\n templateCacheSize: 50\n \"\n class=\"elder-grid-tile-row\"\n [style.height]=\"itemHeight + 'px'\"\n >\n @for (tile of gridRow.cells; track getId(tile)) {\n <!-- Tile Cell -->\n @if (showTile(tile)) {\n <mat-card appearance=\"outlined\" class=\"elder-grid-tile\">\n <div\n class=\"elder-grid-tile-content\"\n (click)=\"onItemClick(tile)\"\n (dblclick)=\"onItemDoubleClick(tile)\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n tileTemplate || simpleTileTemplate;\n context: { $implicit: tile }\n \"\n ></ng-container>\n <!-- Overlay (Selection) -->\n @if (selectionVisible) {\n @if (selectionModel.selection | async; as selection) {\n <div\n class=\"elder-grid-tile-overlay elder-click-through\"\n [class.elder-grid-tile-overlay-hidden]=\"!inSelectionMode(selection)\"\n [class.elder-grid-tile-overlay-visible]=\"inSelectionMode(selection)\"\n >\n <button\n mat-icon-button\n type=\"button\"\n (click)=\"selectionModel.toggle(tile)\"\n elderStopEventPropagation\n class=\"elder-grid-tile-check\"\n >\n <mat-icon\n [class.elder-selected]=\"selectionModel.observeSelection(tile) | async\"\n >\n {{\n (selectionModel.observeSelection(tile) | async)\n ? 'check_circle'\n : 'radio_button_unchecked'\n }}\n </mat-icon>\n </button>\n </div>\n }\n }\n </div>\n </mat-card>\n } @else {\n <div class=\"elder-grid-tile-hidden\"></div>\n }\n }\n </div>\n </cdk-virtual-scroll-viewport>\n\n <mat-progress-bar\n class=\"flex-none\"\n [mode]=\"(data?.loading | async) ? 'indeterminate' : 'determinate'\"\n [color]=\"data && (data.status | async)?.hasError ? 'warn' : 'primary'\"\n >\n </mat-progress-bar>\n\n <!-- Footer -->\n @if (footerVisible) {\n <div\n class=\"layout-row place-end-center gap-md flex-none elder-grid-footer\"\n >\n <!-- Continuable -->\n @if (isContinuable) {\n <span class=\"mat-caption noselect\" style=\"color: gray\">\n {{ (dataSnapshot?.data | async)?.length }} / {{ total$ | async }}\n </span>\n\n <button\n mat-icon-button\n type=\"button\"\n color=\"primary\"\n [disabled]=\"!(canLoadMore$ | async)\"\n (click)=\"dataSnapshot.loadMore()\"\n >\n <mat-icon>keyboard_arrow_down</mat-icon>\n </button>\n }\n\n <!-- Paged -->\n @if (isActivePaged) {\n @if (dataActivePaged.page | async; as page) {\n <mat-paginator\n class=\"flex-none\"\n [length]=\"dataContext?.total | async\"\n [pageIndex]=\"page?.index\"\n [pageSize]=\"page?.size\"\n [pageSizeOptions]=\"pageSizeOptions\"\n >\n </mat-paginator>\n }\n }\n\n <!-- Local Source -->\n @if (!isActivePaged && !isContinuable) {\n <span class=\"mat-caption noselect\" style=\"color: gray\">\n {{ (dataSnapshot?.data | async)?.length }}\n </span>\n }\n </div>\n }\n </div>\n }\n</div>\n\n<ng-template #simpleTileTemplate let-tile>\n @if (tile) {\n <div class=\"layout-col place-center-center flex\" style=\"background-color: lightblue\">\n <p class=\"noselect\">Tile: {{ tile }}</p>\n </div>\n }\n</ng-template>\n", styles: [".elder-grid-tile-row{display:flex;flex-direction:row;padding:8px}.elder-grid-tile-row:first-child{padding-top:16px}.elder-grid-tile-hidden{flex:0 1 100%;margin:8px;width:100%;height:100%}.elder-grid-tile-content{position:relative;width:100%;height:100%;overflow:hidden}.elder-grid-tile-overlay{position:absolute;inset:0;transition:background-color .1s ease-in,opacity .1s ease-in}.elder-click-through{pointer-events:none}.elder-grid-tile-overlay-visible{opacity:1}.elder-grid-tile-overlay-hidden{opacity:0}.elder-grid-container{border-radius:var(--elder-border-radius-sm);background-color:var(--elder-grid-background-color)}.elder-grid-flat{border:var(--elder-border-light)}.elder-grid-toolbar{min-height:44px}.elder-grid-footer{min-height:var(--elder-data-element-footer-height)}.elder-grid-tile{overflow:hidden;flex:0 1 100%;flex-grow:1;margin:0 8px;width:100%;height:100%;cursor:pointer;background-color:var(--md-sys-color-surface-container-low);text-align:left;transition:box-shadow .2s cubic-bezier(0,0,.2,1),border .25s linear}.elder-grid-tile:hover{border-color:var(--md-sys-color-primary)}.elder-grid-tile-content:hover .elder-grid-tile-overlay{opacity:1;background-color:#ffffff14}.elder-grid-tile:active{z-index:100;box-shadow:var(--elder-box-shadow-default)}.elder-grid-tile-check{pointer-events:auto}.elder-grid-tile-check mat-icon{color:var(--md-sys-color-outline-variant);background-color:var(--md-sys-color-surface);border-radius:12px}.elder-grid-tile-check mat-icon.elder-selected{color:var(--md-sys-color-tertiary)}.elder-grid-tile-check:hover mat-icon{color:var(--md-sys-color-primary)}\n"], dependencies: [{ kind: "component", type: MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: DataContextSelectionDirective, selector: "[elderDataContextSelection]", inputs: ["elderDataContextSelectionModel", "elderDataContextSelection"], exportAs: ["elderDataContextSelection"] }, { kind: "component", type: ElderSelectionMasterCheckboxComponent, selector: "elder-selection-master-checkbox" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: DataContextStateIndicatorComponent, selector: "elder-data-context-state-indicator", inputs: ["dataContext"] }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: ElderInfiniteScrollDirective, selector: "[elderInfiniteScroll]", inputs: ["listenToHost", "eventThrottle", "offsetFactor", "ignoreScrollEvent", "containerId", "scrollContainer"], outputs: ["closeToEnd", "scrolling"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: ElderStopEventPropagationDirective, selector: "[elderStopEventPropagation]" }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: ElderCompositeSortComponent, selector: "elder-composite-sort", inputs: ["availableSorts", "sorts", "translationPrefix"], outputs: ["sortsChange"] }, { kind: "directive", type: ElderCompositeSortDcDirective, selector: "[elderCompositeSortDc]", inputs: ["elderCompositeSortDc"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
18902
18902
  }
18903
18903
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: ElderGridComponent, decorators: [{
18904
18904
  type: Component,
@@ -18929,7 +18929,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
18929
18929
  AsyncPipe,
18930
18930
  ElderCompositeSortComponent,
18931
18931
  ElderCompositeSortDcDirective,
18932
- ], template: "<div class=\"full elder-grid-component\">\n @if (dataContext$ | async; as data) {\n <!-- Grid Browser -->\n <div\n class=\"layout-col full elder-grid-container\"\n [elderDataContextSelection]=\"data\"\n #dataSelection=\"elderDataContextSelection\"\n [elderDataContextSelectionModel]=\"selectionModel\"\n >\n <!-- Toolbar Row -->\n @if (toolbarVisible) {\n <div class=\"layout-row place-start-center flex-none elder-grid-toolbar\">\n @if (selectionVisible) {\n <div class=\"layout-col flex-none px-sm\">\n <elder-selection-master-checkbox\n class=\"flex-none\"\n style=\"padding-left: 12px\"\n ></elder-selection-master-checkbox>\n </div>\n }\n\n <!-- Toolbar -->\n @if (toolbarTemplate) {\n <ng-template\n *ngTemplateOutlet=\"toolbarTemplate; context: { $implicit: this }\"\n ></ng-template>\n }\n\n @if (availableCompositeSorts && availableCompositeSorts.length > 0) {\n <elder-composite-sort\n class=\"flex-none\"\n [availableSorts]=\"availableCompositeSorts\"\n [translationPrefix]=\"sortTranslationPrefix\"\n [elderCompositeSortDc]=\"data\"\n >\n </elder-composite-sort>\n }\n </div>\n\n <mat-divider></mat-divider>\n }\n\n <elder-data-context-state-indicator class=\"flex-none\" [dataContext]=\"data\">\n </elder-data-context-state-indicator>\n\n <!-- [cdkDropListSortingDisabled]=\"true\" -->\n <!-- cdkDropList -->\n <cdk-virtual-scroll-viewport\n class=\"layout-col flex elder-grid-browser\"\n id=\"{{ scrollContainerId }}\"\n [itemSize]=\"itemHeight\"\n [minBufferPx]=\"itemHeight * 2\"\n [maxBufferPx]=\"itemHeight * 3\"\n #virtualScrollViewPort\n elderInfiniteScroll\n [eventThrottle]=\"200\"\n [offsetFactor]=\"2\"\n [ignoreScrollEvent]=\"data.loading | async\"\n [containerId]=\"scrollContainerId\"\n [listenToHost]=\"false\"\n (closeToEnd)=\"requestMoreDataZoned($event)\"\n >\n <!-- (scrolling)=\"onScrolling($event)\" -->\n\n <div\n *cdkVirtualFor=\"\n let gridRow of dataRows$;\n trackBy: TrackGridRowByIdFn;\n templateCacheSize: 50\n \"\n class=\"elder-grid-tile-row\"\n [style.height]=\"itemHeight + 'px'\"\n >\n @for (tile of gridRow.cells; track getId(tile)) {\n <!-- Tile Cell -->\n @if (showTile(tile)) {\n <mat-card appearance=\"outlined\" class=\"elder-grid-tile\">\n <div\n class=\"elder-grid-tile-content\"\n (click)=\"onItemClick(tile)\"\n (dblclick)=\"onItemDoubleClick(tile)\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n tileTemplate || simpleTileTemplate;\n context: { $implicit: tile }\n \"\n ></ng-container>\n <!-- Overlay (Selection) -->\n @if (selectionVisible) {\n @if (selectionModel.selection | async; as selection) {\n <div\n class=\"elder-grid-tile-overlay elder-click-through\"\n [class.elder-grid-tile-overlay-hidden]=\"!inSelectionMode(selection)\"\n [class.elder-grid-tile-overlay-visible]=\"inSelectionMode(selection)\"\n >\n <button\n mat-icon-button\n type=\"button\"\n (click)=\"selectionModel.toggle(tile)\"\n elderStopEventPropagation\n class=\"elder-grid-tile-check\"\n >\n <mat-icon\n [class.elder-selected]=\"selectionModel.observeSelection(tile) | async\"\n >\n {{\n (selectionModel.observeSelection(tile) | async)\n ? 'check_circle'\n : 'radio_button_unchecked'\n }}\n </mat-icon>\n </button>\n </div>\n }\n }\n </div>\n </mat-card>\n } @else {\n <div class=\"elder-grid-tile-hidden\"></div>\n }\n }\n </div>\n </cdk-virtual-scroll-viewport>\n\n <mat-progress-bar\n class=\"flex-none\"\n [mode]=\"(data?.loading | async) ? 'indeterminate' : 'determinate'\"\n [color]=\"data && (data.status | async)?.hasError ? 'warn' : 'primary'\"\n >\n </mat-progress-bar>\n\n <!-- Footer -->\n @if (footerVisible) {\n <div\n class=\"layout-row place-end-center gap-md flex-none elder-grid-footer\"\n >\n <!-- Continuable -->\n @if (isContinuable) {\n <span class=\"mat-caption noselect\" style=\"color: gray\">\n {{ (dataSnapshot?.data | async)?.length }} / {{ total$ | async }}\n </span>\n\n <button\n mat-icon-button\n type=\"button\"\n color=\"primary\"\n [disabled]=\"!(canLoadMore$ | async)\"\n (click)=\"dataSnapshot.loadMore()\"\n >\n <mat-icon>keyboard_arrow_down</mat-icon>\n </button>\n }\n\n <!-- Paged -->\n @if (isActivePaged) {\n @if (dataActivePaged.page | async; as page) {\n <mat-paginator\n class=\"flex-none\"\n [length]=\"dataContext?.total | async\"\n [pageIndex]=\"page?.index\"\n [pageSize]=\"page?.size\"\n [pageSizeOptions]=\"pageSizeOptions\"\n >\n </mat-paginator>\n }\n }\n\n <!-- Local Source -->\n @if (!isActivePaged && !isContinuable) {\n <span class=\"mat-caption noselect\" style=\"color: gray\">\n {{ (dataSnapshot?.data | async)?.length }}\n </span>\n }\n </div>\n }\n </div>\n }\n</div>\n\n<ng-template #simpleTileTemplate let-tile>\n @if (tile) {\n <div class=\"layout-col place-center-center flex\" style=\"background-color: lightblue\">\n <p class=\"noselect\">Tile: {{ tile }}</p>\n </div>\n }\n</ng-template>\n", styles: [":host{min-width:0;min-height:0}.elder-grid-tile-row{display:flex;flex-direction:row;padding:8px}.elder-grid-tile-row:first-child{padding-top:16px}.elder-grid-tile-hidden{flex:0 1 100%;margin:8px;width:100%;height:100%}.elder-grid-tile-content{position:relative;width:100%;height:100%;overflow:hidden}.elder-grid-tile-overlay{position:absolute;inset:0;transition:background-color .1s ease-in,opacity .1s ease-in}.elder-click-through{pointer-events:none}.elder-grid-tile-overlay-visible{opacity:1}.elder-grid-tile-overlay-hidden{opacity:0}\n"] }]
18932
+ ], template: "<div class=\"full elder-grid-component\">\n @if (dataContext$ | async; as data) {\n <!-- Grid Browser -->\n <div\n class=\"layout-col full elder-grid-container\"\n [elderDataContextSelection]=\"data\"\n #dataSelection=\"elderDataContextSelection\"\n [elderDataContextSelectionModel]=\"selectionModel\"\n >\n <!-- Toolbar Row -->\n @if (toolbarVisible) {\n <div class=\"layout-row place-start-center flex-none elder-grid-toolbar\">\n @if (selectionVisible) {\n <div class=\"layout-col flex-none px-sm\">\n <elder-selection-master-checkbox\n class=\"flex-none\"\n style=\"padding-left: 12px\"\n ></elder-selection-master-checkbox>\n </div>\n }\n\n <!-- Toolbar -->\n @if (toolbarTemplate) {\n <ng-template\n *ngTemplateOutlet=\"toolbarTemplate; context: { $implicit: this }\"\n ></ng-template>\n }\n\n @if (availableCompositeSorts && availableCompositeSorts.length > 0) {\n <elder-composite-sort\n class=\"flex-none\"\n [availableSorts]=\"availableCompositeSorts\"\n [translationPrefix]=\"sortTranslationPrefix\"\n [elderCompositeSortDc]=\"data\"\n >\n </elder-composite-sort>\n }\n </div>\n\n <mat-divider></mat-divider>\n }\n\n <elder-data-context-state-indicator class=\"flex-none\" [dataContext]=\"data\">\n </elder-data-context-state-indicator>\n\n <!-- [cdkDropListSortingDisabled]=\"true\" -->\n <!-- cdkDropList -->\n <cdk-virtual-scroll-viewport\n class=\"layout-col flex elder-grid-browser\"\n id=\"{{ scrollContainerId }}\"\n [itemSize]=\"itemHeight\"\n [minBufferPx]=\"itemHeight * 2\"\n [maxBufferPx]=\"itemHeight * 3\"\n #virtualScrollViewPort\n elderInfiniteScroll\n [eventThrottle]=\"200\"\n [offsetFactor]=\"2\"\n [ignoreScrollEvent]=\"data.loading | async\"\n [containerId]=\"scrollContainerId\"\n [listenToHost]=\"false\"\n (closeToEnd)=\"requestMoreDataZoned($event)\"\n >\n <!-- (scrolling)=\"onScrolling($event)\" -->\n\n <div\n *cdkVirtualFor=\"\n let gridRow of dataRows$;\n trackBy: TrackGridRowByIdFn;\n templateCacheSize: 50\n \"\n class=\"elder-grid-tile-row\"\n [style.height]=\"itemHeight + 'px'\"\n >\n @for (tile of gridRow.cells; track getId(tile)) {\n <!-- Tile Cell -->\n @if (showTile(tile)) {\n <mat-card appearance=\"outlined\" class=\"elder-grid-tile\">\n <div\n class=\"elder-grid-tile-content\"\n (click)=\"onItemClick(tile)\"\n (dblclick)=\"onItemDoubleClick(tile)\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n tileTemplate || simpleTileTemplate;\n context: { $implicit: tile }\n \"\n ></ng-container>\n <!-- Overlay (Selection) -->\n @if (selectionVisible) {\n @if (selectionModel.selection | async; as selection) {\n <div\n class=\"elder-grid-tile-overlay elder-click-through\"\n [class.elder-grid-tile-overlay-hidden]=\"!inSelectionMode(selection)\"\n [class.elder-grid-tile-overlay-visible]=\"inSelectionMode(selection)\"\n >\n <button\n mat-icon-button\n type=\"button\"\n (click)=\"selectionModel.toggle(tile)\"\n elderStopEventPropagation\n class=\"elder-grid-tile-check\"\n >\n <mat-icon\n [class.elder-selected]=\"selectionModel.observeSelection(tile) | async\"\n >\n {{\n (selectionModel.observeSelection(tile) | async)\n ? 'check_circle'\n : 'radio_button_unchecked'\n }}\n </mat-icon>\n </button>\n </div>\n }\n }\n </div>\n </mat-card>\n } @else {\n <div class=\"elder-grid-tile-hidden\"></div>\n }\n }\n </div>\n </cdk-virtual-scroll-viewport>\n\n <mat-progress-bar\n class=\"flex-none\"\n [mode]=\"(data?.loading | async) ? 'indeterminate' : 'determinate'\"\n [color]=\"data && (data.status | async)?.hasError ? 'warn' : 'primary'\"\n >\n </mat-progress-bar>\n\n <!-- Footer -->\n @if (footerVisible) {\n <div\n class=\"layout-row place-end-center gap-md flex-none elder-grid-footer\"\n >\n <!-- Continuable -->\n @if (isContinuable) {\n <span class=\"mat-caption noselect\" style=\"color: gray\">\n {{ (dataSnapshot?.data | async)?.length }} / {{ total$ | async }}\n </span>\n\n <button\n mat-icon-button\n type=\"button\"\n color=\"primary\"\n [disabled]=\"!(canLoadMore$ | async)\"\n (click)=\"dataSnapshot.loadMore()\"\n >\n <mat-icon>keyboard_arrow_down</mat-icon>\n </button>\n }\n\n <!-- Paged -->\n @if (isActivePaged) {\n @if (dataActivePaged.page | async; as page) {\n <mat-paginator\n class=\"flex-none\"\n [length]=\"dataContext?.total | async\"\n [pageIndex]=\"page?.index\"\n [pageSize]=\"page?.size\"\n [pageSizeOptions]=\"pageSizeOptions\"\n >\n </mat-paginator>\n }\n }\n\n <!-- Local Source -->\n @if (!isActivePaged && !isContinuable) {\n <span class=\"mat-caption noselect\" style=\"color: gray\">\n {{ (dataSnapshot?.data | async)?.length }}\n </span>\n }\n </div>\n }\n </div>\n }\n</div>\n\n<ng-template #simpleTileTemplate let-tile>\n @if (tile) {\n <div class=\"layout-col place-center-center flex\" style=\"background-color: lightblue\">\n <p class=\"noselect\">Tile: {{ tile }}</p>\n </div>\n }\n</ng-template>\n", styles: [".elder-grid-tile-row{display:flex;flex-direction:row;padding:8px}.elder-grid-tile-row:first-child{padding-top:16px}.elder-grid-tile-hidden{flex:0 1 100%;margin:8px;width:100%;height:100%}.elder-grid-tile-content{position:relative;width:100%;height:100%;overflow:hidden}.elder-grid-tile-overlay{position:absolute;inset:0;transition:background-color .1s ease-in,opacity .1s ease-in}.elder-click-through{pointer-events:none}.elder-grid-tile-overlay-visible{opacity:1}.elder-grid-tile-overlay-hidden{opacity:0}.elder-grid-container{border-radius:var(--elder-border-radius-sm);background-color:var(--elder-grid-background-color)}.elder-grid-flat{border:var(--elder-border-light)}.elder-grid-toolbar{min-height:44px}.elder-grid-footer{min-height:var(--elder-data-element-footer-height)}.elder-grid-tile{overflow:hidden;flex:0 1 100%;flex-grow:1;margin:0 8px;width:100%;height:100%;cursor:pointer;background-color:var(--md-sys-color-surface-container-low);text-align:left;transition:box-shadow .2s cubic-bezier(0,0,.2,1),border .25s linear}.elder-grid-tile:hover{border-color:var(--md-sys-color-primary)}.elder-grid-tile-content:hover .elder-grid-tile-overlay{opacity:1;background-color:#ffffff14}.elder-grid-tile:active{z-index:100;box-shadow:var(--elder-box-shadow-default)}.elder-grid-tile-check{pointer-events:auto}.elder-grid-tile-check mat-icon{color:var(--md-sys-color-outline-variant);background-color:var(--md-sys-color-surface);border-radius:12px}.elder-grid-tile-check mat-icon.elder-selected{color:var(--md-sys-color-tertiary)}.elder-grid-tile-check:hover mat-icon{color:var(--md-sys-color-primary)}\n"] }]
18933
18933
  }], ctorParameters: () => [{ type: SelectionModel, decorators: [{
18934
18934
  type: Optional
18935
18935
  }] }, { type: ElderDataViewOptionsProvider, decorators: [{
@@ -24945,11 +24945,11 @@ class ElderFilterChipTemplateComponent {
24945
24945
  }
24946
24946
  }
24947
24947
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: ElderFilterChipTemplateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
24948
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.0.3", type: ElderFilterChipTemplateComponent, isStandalone: true, selector: "elder-filter-chip-template", inputs: { avatarResolverFn: { classPropertyName: "avatarResolverFn", publicName: "avatarResolverFn", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "avatarRef", first: true, predicate: ElderSelectChipAvatarDirective, descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: "<mat-icon *elderSelectChipAvatar=\"let chipModel\" class=\"material-icons-outlined\">\n {{ currentIcon(chipModel?.value?.id) }}\n</mat-icon>\n", styles: [".elder-chip-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.elder-trailing-icon{color:var(--mdc-chip-with-trailing-icon-trailing-icon-color);opacity:.54}.cdk-drag-preview{box-shadow:var(--elder-box-shadow-default)}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: ElderSelectChipAvatarDirective, selector: "[elderSelectChipAvatar]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
24948
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.0.3", type: ElderFilterChipTemplateComponent, isStandalone: true, selector: "elder-filter-chip-template", inputs: { avatarResolverFn: { classPropertyName: "avatarResolverFn", publicName: "avatarResolverFn", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "avatarRef", first: true, predicate: ElderSelectChipAvatarDirective, descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: "<mat-icon *elderSelectChipAvatar=\"let chipModel\" class=\"material-icons-outlined\">\n {{ currentIcon(chipModel?.value?.id) }}\n</mat-icon>\n", styles: [""], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: ElderSelectChipAvatarDirective, selector: "[elderSelectChipAvatar]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
24949
24949
  }
24950
24950
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: ElderFilterChipTemplateComponent, decorators: [{
24951
24951
  type: Component,
24952
- args: [{ selector: 'elder-filter-chip-template', imports: [MatIcon, ElderSelectChipAvatarDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-icon *elderSelectChipAvatar=\"let chipModel\" class=\"material-icons-outlined\">\n {{ currentIcon(chipModel?.value?.id) }}\n</mat-icon>\n", styles: [".elder-chip-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.elder-trailing-icon{color:var(--mdc-chip-with-trailing-icon-trailing-icon-color);opacity:.54}.cdk-drag-preview{box-shadow:var(--elder-box-shadow-default)}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}\n"] }]
24952
+ args: [{ selector: 'elder-filter-chip-template', imports: [MatIcon, ElderSelectChipAvatarDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-icon *elderSelectChipAvatar=\"let chipModel\" class=\"material-icons-outlined\">\n {{ currentIcon(chipModel?.value?.id) }}\n</mat-icon>\n" }]
24953
24953
  }], propDecorators: { avatarRef: [{
24954
24954
  type: ViewChild,
24955
24955
  args: [ElderSelectChipAvatarDirective, { read: TemplateRef, static: true }]
@@ -26586,7 +26586,7 @@ class ElderNavLinkComponent {
26586
26586
  return this.navList.isActive(this.value);
26587
26587
  }
26588
26588
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: ElderNavLinkComponent, deps: [{ token: ElderNavListComponent }], target: i0.ɵɵFactoryTarget.Component }); }
26589
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: ElderNavLinkComponent, isStandalone: true, selector: "elder-nav-link", inputs: { title: "title", queryParamsHandling: "queryParamsHandling", queryParams: "queryParams", icon: "icon", fontIcon: "fontIcon", fontSet: "fontSet", svgIcon: "svgIcon", routerLink: "routerLink", href: "href", target: "target", value: "value", disabled: "disabled" }, outputs: { clicked: "clicked" }, host: { properties: { "attr.tabindex": "this.tabIndex" } }, viewQueries: [{ propertyName: "routerLinkActive", first: true, predicate: RouterLinkActive, descendants: true }], ngImport: i0, template: "<!-- Router Link -->\n<ng-container *ngIf=\"model$ | async as model\">\n <a\n *ngIf=\"model.routerLink as routerLink\"\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link mdc-list-item mdc-list-item--with-one-line\"\n [routerLink]=\"routerLink\"\n [queryParamsHandling]=\"queryParamsHandling\"\n [queryParams]=\"queryParams\"\n routerLinkActive=\"dummy\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n\n <!-- Href Link -->\n <a\n *ngIf=\"model.href as href\"\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link mdc-list-item mdc-list-item--with-one-line\"\n [href]=\"href\"\n [target]=\"model.hrefTarget\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n\n <!-- Simple Button -->\n <a\n *ngIf=\"!model.href && !model.routerLink\"\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link mdc-list-item mdc-list-item--with-one-line\"\n (click)=\"itemClick($event)\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n</ng-container>\n\n<ng-template #defaultLinkTemplate>\n <div class=\"layout-row place-start-center flex gap-md noselect\">\n <mat-icon *ngIf=\"!(!icon && !title)\" [fontIcon]=\"fontIcon\" [fontSet]=\"fontSet\">\n {{ icon }}\n </mat-icon>\n <mat-icon *ngIf=\"svgIcon\" [svgIcon]=\"svgIcon\"></mat-icon>\n <span *ngIf=\"title\" class=\"noselect\">\n {{ title | translate }}\n </span>\n <ng-content></ng-content>\n </div>\n</ng-template>\n", styles: [".nav-link{text-decoration:none;padding-left:16px;padding-right:16px;min-height:48px;border-radius:var(--elder-border-radius-sm);overflow:hidden;transition:background-color .5s}.nav-link .mat-icon{height:32px;width:32px;font-size:24px;padding:4px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
26589
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: ElderNavLinkComponent, isStandalone: true, selector: "elder-nav-link", inputs: { title: "title", queryParamsHandling: "queryParamsHandling", queryParams: "queryParams", icon: "icon", fontIcon: "fontIcon", fontSet: "fontSet", svgIcon: "svgIcon", routerLink: "routerLink", href: "href", target: "target", value: "value", disabled: "disabled" }, outputs: { clicked: "clicked" }, host: { properties: { "attr.tabindex": "this.tabIndex" } }, viewQueries: [{ propertyName: "routerLinkActive", first: true, predicate: RouterLinkActive, descendants: true }], ngImport: i0, template: "<!-- Router Link -->\n<ng-container *ngIf=\"model$ | async as model\">\n <a\n *ngIf=\"model.routerLink as routerLink\"\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link mdc-list-item mdc-list-item--with-one-line\"\n [routerLink]=\"routerLink\"\n [queryParamsHandling]=\"queryParamsHandling\"\n [queryParams]=\"queryParams\"\n routerLinkActive=\"dummy\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n\n <!-- Href Link -->\n <a\n *ngIf=\"model.href as href\"\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link mdc-list-item mdc-list-item--with-one-line\"\n [href]=\"href\"\n [target]=\"model.hrefTarget\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n\n <!-- Simple Button -->\n <a\n *ngIf=\"!model.href && !model.routerLink\"\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link mdc-list-item mdc-list-item--with-one-line\"\n (click)=\"itemClick($event)\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n</ng-container>\n\n<ng-template #defaultLinkTemplate>\n <div class=\"layout-row place-start-center flex gap-md noselect\">\n <mat-icon *ngIf=\"!(!icon && !title)\" [fontIcon]=\"fontIcon\" [fontSet]=\"fontSet\">\n {{ icon }}\n </mat-icon>\n <mat-icon *ngIf=\"svgIcon\" [svgIcon]=\"svgIcon\"></mat-icon>\n <span *ngIf=\"title\" class=\"noselect\">\n {{ title | translate }}\n </span>\n <ng-content></ng-content>\n </div>\n</ng-template>\n", styles: [".nav-link{text-decoration:none;padding-left:16px;padding-right:16px;min-height:48px;border-radius:var(--elder-border-radius-sm);overflow:hidden;transition:background-color .5s}.nav-link .mat-icon{height:32px;width:32px;font-size:24px;padding:4px}.nav-link.nav-link-clickable{cursor:pointer}.nav-link.nav-link-clickable:hover{background-color:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface)}.nav-link.nav-link-clickable:hover .mat-icon{color:var(--md-sys-color-on-surface)}.nav-link.nav-link-disabled{cursor:default}.nav-link:hover{background-color:var(--md-sys-color-surface-container-low)}.nav-link.nav-link-active{background-color:var(--md-sys-color-surface-container-highest);color:var(--md-sys-color-on-surface-container)}.nav-link.nav-link-active .mat-icon{color:var(--md-sys-color-on-teriary)}.nav-link.nav-link-inactive,.nav-link.nav-link-inactive .mat-icon{color:var(--md-sys-color-on-surface)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
26590
26590
  }
26591
26591
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: ElderNavLinkComponent, decorators: [{
26592
26592
  type: Component,
@@ -26599,7 +26599,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
26599
26599
  MatIcon,
26600
26600
  AsyncPipe,
26601
26601
  TranslateModule,
26602
- ], template: "<!-- Router Link -->\n<ng-container *ngIf=\"model$ | async as model\">\n <a\n *ngIf=\"model.routerLink as routerLink\"\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link mdc-list-item mdc-list-item--with-one-line\"\n [routerLink]=\"routerLink\"\n [queryParamsHandling]=\"queryParamsHandling\"\n [queryParams]=\"queryParams\"\n routerLinkActive=\"dummy\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n\n <!-- Href Link -->\n <a\n *ngIf=\"model.href as href\"\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link mdc-list-item mdc-list-item--with-one-line\"\n [href]=\"href\"\n [target]=\"model.hrefTarget\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n\n <!-- Simple Button -->\n <a\n *ngIf=\"!model.href && !model.routerLink\"\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link mdc-list-item mdc-list-item--with-one-line\"\n (click)=\"itemClick($event)\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n</ng-container>\n\n<ng-template #defaultLinkTemplate>\n <div class=\"layout-row place-start-center flex gap-md noselect\">\n <mat-icon *ngIf=\"!(!icon && !title)\" [fontIcon]=\"fontIcon\" [fontSet]=\"fontSet\">\n {{ icon }}\n </mat-icon>\n <mat-icon *ngIf=\"svgIcon\" [svgIcon]=\"svgIcon\"></mat-icon>\n <span *ngIf=\"title\" class=\"noselect\">\n {{ title | translate }}\n </span>\n <ng-content></ng-content>\n </div>\n</ng-template>\n", styles: [".nav-link{text-decoration:none;padding-left:16px;padding-right:16px;min-height:48px;border-radius:var(--elder-border-radius-sm);overflow:hidden;transition:background-color .5s}.nav-link .mat-icon{height:32px;width:32px;font-size:24px;padding:4px}\n"] }]
26602
+ ], template: "<!-- Router Link -->\n<ng-container *ngIf=\"model$ | async as model\">\n <a\n *ngIf=\"model.routerLink as routerLink\"\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link mdc-list-item mdc-list-item--with-one-line\"\n [routerLink]=\"routerLink\"\n [queryParamsHandling]=\"queryParamsHandling\"\n [queryParams]=\"queryParams\"\n routerLinkActive=\"dummy\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n\n <!-- Href Link -->\n <a\n *ngIf=\"model.href as href\"\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link mdc-list-item mdc-list-item--with-one-line\"\n [href]=\"href\"\n [target]=\"model.hrefTarget\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n\n <!-- Simple Button -->\n <a\n *ngIf=\"!model.href && !model.routerLink\"\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link mdc-list-item mdc-list-item--with-one-line\"\n (click)=\"itemClick($event)\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n</ng-container>\n\n<ng-template #defaultLinkTemplate>\n <div class=\"layout-row place-start-center flex gap-md noselect\">\n <mat-icon *ngIf=\"!(!icon && !title)\" [fontIcon]=\"fontIcon\" [fontSet]=\"fontSet\">\n {{ icon }}\n </mat-icon>\n <mat-icon *ngIf=\"svgIcon\" [svgIcon]=\"svgIcon\"></mat-icon>\n <span *ngIf=\"title\" class=\"noselect\">\n {{ title | translate }}\n </span>\n <ng-content></ng-content>\n </div>\n</ng-template>\n", styles: [".nav-link{text-decoration:none;padding-left:16px;padding-right:16px;min-height:48px;border-radius:var(--elder-border-radius-sm);overflow:hidden;transition:background-color .5s}.nav-link .mat-icon{height:32px;width:32px;font-size:24px;padding:4px}.nav-link.nav-link-clickable{cursor:pointer}.nav-link.nav-link-clickable:hover{background-color:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface)}.nav-link.nav-link-clickable:hover .mat-icon{color:var(--md-sys-color-on-surface)}.nav-link.nav-link-disabled{cursor:default}.nav-link:hover{background-color:var(--md-sys-color-surface-container-low)}.nav-link.nav-link-active{background-color:var(--md-sys-color-surface-container-highest);color:var(--md-sys-color-on-surface-container)}.nav-link.nav-link-active .mat-icon{color:var(--md-sys-color-on-teriary)}.nav-link.nav-link-inactive,.nav-link.nav-link-inactive .mat-icon{color:var(--md-sys-color-on-surface)}\n"] }]
26603
26603
  }], ctorParameters: () => [{ type: ElderNavListComponent }], propDecorators: { tabIndex: [{
26604
26604
  type: HostBinding,
26605
26605
  args: ['attr.tabindex']
@@ -26703,7 +26703,7 @@ class ElderNavGroupComponent {
26703
26703
  return this.navList.isActive(this.value);
26704
26704
  }
26705
26705
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: ElderNavGroupComponent, deps: [{ token: ElderNavListComponent }], target: i0.ɵɵFactoryTarget.Component }); }
26706
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: ElderNavGroupComponent, isStandalone: true, selector: "elder-nav-group", inputs: { value: "value" }, outputs: { clicked: "clicked" }, queries: [{ propertyName: "children", predicate: ElderNavLinkComponent }], ngImport: i0, template: "<ng-container *ngIf=\"state$ | async as state\">\n <div class=\"layout-col nav-group\">\n <a\n matRipple\n class=\"layout-row place-start-center nav-group-button mat-button-fill mdc-list-item mdc-list-item--with-one-line\"\n [class.nav-group-button-open]=\"state.isOpen\"\n [class.nav-group-button-closed]=\"!state.isOpen\"\n [class.nav-group-button-active]=\"active$ | async\"\n (click)=\"itemClick($event)\"\n >\n <div class=\"layout-row place-start-center gap-lg full noselect mdc-list-item__primary-text\">\n <ng-content></ng-content>\n <span class=\"flex\"></span>\n <mat-icon>{{ state.isOpen ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}</mat-icon>\n </div>\n </a>\n\n <!-- Nested Items projection -->\n <div\n class=\"layout-col nav-group-items-container p-sm gap-sm\"\n [@openClose]=\"state.isOpen ? 'open' : 'closed'\"\n >\n <ng-content select=\"elder-nav-link\"></ng-content>\n </div>\n </div>\n</ng-container>\n", styles: [".nav-group-button-closed{padding-left:16px}.nav-group{min-height:48px}.nav-group-button{padding-right:16px;min-height:48px;font-size:16px;font-weight:400;border-radius:var(--elder-border-radius-sm);cursor:pointer}.nav-group-button .mat-icon{height:24px;width:24px;font-size:24px;padding:4px}.nav-group-items-container{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], animations: [
26706
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: ElderNavGroupComponent, isStandalone: true, selector: "elder-nav-group", inputs: { value: "value" }, outputs: { clicked: "clicked" }, queries: [{ propertyName: "children", predicate: ElderNavLinkComponent }], ngImport: i0, template: "<ng-container *ngIf=\"state$ | async as state\">\n <div class=\"layout-col nav-group\">\n <a\n matRipple\n class=\"layout-row place-start-center nav-group-button mat-button-fill mdc-list-item mdc-list-item--with-one-line\"\n [class.nav-group-button-open]=\"state.isOpen\"\n [class.nav-group-button-closed]=\"!state.isOpen\"\n [class.nav-group-button-active]=\"active$ | async\"\n (click)=\"itemClick($event)\"\n >\n <div class=\"layout-row place-start-center gap-lg full noselect mdc-list-item__primary-text\">\n <ng-content></ng-content>\n <span class=\"flex\"></span>\n <mat-icon>{{ state.isOpen ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}</mat-icon>\n </div>\n </a>\n\n <!-- Nested Items projection -->\n <div\n class=\"layout-col nav-group-items-container p-sm gap-sm\"\n [@openClose]=\"state.isOpen ? 'open' : 'closed'\"\n >\n <ng-content select=\"elder-nav-link\"></ng-content>\n </div>\n </div>\n</ng-container>\n", styles: [".nav-group-button-closed{padding-left:16px}.nav-group{min-height:48px}.nav-group-button{padding-right:16px;min-height:48px;font-size:16px;font-weight:400;border-radius:var(--elder-border-radius-sm);cursor:pointer}.nav-group-button .mat-icon{height:24px;width:24px;font-size:24px;padding:4px}.nav-group-items-container{overflow:hidden}.nav-group-button:hover{background-color:var(--md-sys-color-surface-container-high);transition:background-color .5s}.nav-group-button:not(.nav-group-button-open) .mat-icon{color:var(--md-sys-color-on-surface)}.nav-group-button-active{background-color:var(--md-sys-color-primary-fixed)}.nav-group-button-open{padding-left:11px!important}.nav-group-button-open .mat-icon{color:var(--md-sys-color-primary)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], animations: [
26707
26707
  trigger('openClose', [
26708
26708
  state('open', style({
26709
26709
  height: '*',
@@ -26735,7 +26735,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
26735
26735
  transition('open => closed', [animate('200ms')]),
26736
26736
  transition('closed => open', [animate('200ms')]),
26737
26737
  ]),
26738
- ], changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgIf, MatRipple, MatIcon, AsyncPipe], template: "<ng-container *ngIf=\"state$ | async as state\">\n <div class=\"layout-col nav-group\">\n <a\n matRipple\n class=\"layout-row place-start-center nav-group-button mat-button-fill mdc-list-item mdc-list-item--with-one-line\"\n [class.nav-group-button-open]=\"state.isOpen\"\n [class.nav-group-button-closed]=\"!state.isOpen\"\n [class.nav-group-button-active]=\"active$ | async\"\n (click)=\"itemClick($event)\"\n >\n <div class=\"layout-row place-start-center gap-lg full noselect mdc-list-item__primary-text\">\n <ng-content></ng-content>\n <span class=\"flex\"></span>\n <mat-icon>{{ state.isOpen ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}</mat-icon>\n </div>\n </a>\n\n <!-- Nested Items projection -->\n <div\n class=\"layout-col nav-group-items-container p-sm gap-sm\"\n [@openClose]=\"state.isOpen ? 'open' : 'closed'\"\n >\n <ng-content select=\"elder-nav-link\"></ng-content>\n </div>\n </div>\n</ng-container>\n", styles: [".nav-group-button-closed{padding-left:16px}.nav-group{min-height:48px}.nav-group-button{padding-right:16px;min-height:48px;font-size:16px;font-weight:400;border-radius:var(--elder-border-radius-sm);cursor:pointer}.nav-group-button .mat-icon{height:24px;width:24px;font-size:24px;padding:4px}.nav-group-items-container{overflow:hidden}\n"] }]
26738
+ ], changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgIf, MatRipple, MatIcon, AsyncPipe], template: "<ng-container *ngIf=\"state$ | async as state\">\n <div class=\"layout-col nav-group\">\n <a\n matRipple\n class=\"layout-row place-start-center nav-group-button mat-button-fill mdc-list-item mdc-list-item--with-one-line\"\n [class.nav-group-button-open]=\"state.isOpen\"\n [class.nav-group-button-closed]=\"!state.isOpen\"\n [class.nav-group-button-active]=\"active$ | async\"\n (click)=\"itemClick($event)\"\n >\n <div class=\"layout-row place-start-center gap-lg full noselect mdc-list-item__primary-text\">\n <ng-content></ng-content>\n <span class=\"flex\"></span>\n <mat-icon>{{ state.isOpen ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}</mat-icon>\n </div>\n </a>\n\n <!-- Nested Items projection -->\n <div\n class=\"layout-col nav-group-items-container p-sm gap-sm\"\n [@openClose]=\"state.isOpen ? 'open' : 'closed'\"\n >\n <ng-content select=\"elder-nav-link\"></ng-content>\n </div>\n </div>\n</ng-container>\n", styles: [".nav-group-button-closed{padding-left:16px}.nav-group{min-height:48px}.nav-group-button{padding-right:16px;min-height:48px;font-size:16px;font-weight:400;border-radius:var(--elder-border-radius-sm);cursor:pointer}.nav-group-button .mat-icon{height:24px;width:24px;font-size:24px;padding:4px}.nav-group-items-container{overflow:hidden}.nav-group-button:hover{background-color:var(--md-sys-color-surface-container-high);transition:background-color .5s}.nav-group-button:not(.nav-group-button-open) .mat-icon{color:var(--md-sys-color-on-surface)}.nav-group-button-active{background-color:var(--md-sys-color-primary-fixed)}.nav-group-button-open{padding-left:11px!important}.nav-group-button-open .mat-icon{color:var(--md-sys-color-primary)}\n"] }]
26739
26739
  }], ctorParameters: () => [{ type: ElderNavListComponent }], propDecorators: { children: [{
26740
26740
  type: ContentChildren,
26741
26741
  args: [ElderNavLinkComponent]
@@ -32678,7 +32678,7 @@ class HttpDataTransferOverviewComponent {
32678
32678
  this.transfers$ = this.transferService.transfers;
32679
32679
  }
32680
32680
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: HttpDataTransferOverviewComponent, deps: [{ token: ElderDataTransferService }], target: i0.ɵɵFactoryTarget.Component }); }
32681
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: HttpDataTransferOverviewComponent, isStandalone: true, selector: "elder-data-transfer-overview", ngImport: i0, template: "<div class=\"legacy-layout-card layout-col full elevated-card\">\n <div class=\"layout-col flex\" *ngIf=\"transfers$ | async as transfers\">\n <div *ngIf=\"transfers.length > 0; else noData\" class=\"layout-col flex scroll-list\">\n <elder-data-transfer\n class=\"flex-none\"\n *ngFor=\"let transfer of transfers\"\n [transfer]=\"transfer\"\n >\n </elder-data-transfer>\n </div>\n\n <ng-template #noData>\n <div class=\"layout-col place-center-center flex\">\n <span class=\"mat-subtitle-2 noselect\" style=\"color: gray\">No data transfers.</span>\n </div>\n </ng-template>\n </div>\n\n <mat-toolbar class=\"flex-none toolbar-dark-bg\">\n <elder-data-transfer-aggregate\n class=\"flex\"\n [hiddenWhenInactive]=\"false\"\n ></elder-data-transfer-aggregate>\n </mat-toolbar>\n</div>\n", styles: [":host{min-width:0;min-height:0}.scroll-list{overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.scroll-fix{min-width:0;min-height:0}.elevated-card{box-shadow:var(--mat-app-elevation-shadow-level-5, none);background-color:var(--md-sys-color-surface-container-lowest)}.toolbar-dark-bg{background-color:var(--md-sys-color-surface-container);border-radius:10px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: HttpDataTransferComponent, selector: "elder-data-transfer", inputs: ["transfer"] }, { kind: "component", type: MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: HttpDataTransferAggregateComponent, selector: "elder-data-transfer-aggregate", inputs: ["hiddenWhenInactive"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
32681
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: HttpDataTransferOverviewComponent, isStandalone: true, selector: "elder-data-transfer-overview", ngImport: i0, template: "<div class=\"layout-col full elevated-card\">\n <div class=\"layout-col flex\" *ngIf=\"transfers$ | async as transfers\">\n <div *ngIf=\"transfers.length > 0; else noData\" class=\"layout-col flex scroll-list\">\n <elder-data-transfer\n class=\"flex-none\"\n *ngFor=\"let transfer of transfers\"\n [transfer]=\"transfer\"\n >\n </elder-data-transfer>\n </div>\n\n <ng-template #noData>\n <div class=\"layout-col place-center-center flex\">\n <span class=\"mat-subtitle-2 noselect\" style=\"color: gray\">No data transfers.</span>\n </div>\n </ng-template>\n </div>\n\n <mat-toolbar class=\"flex-none toolbar-dark-bg\">\n <elder-data-transfer-aggregate\n class=\"flex\"\n [hiddenWhenInactive]=\"false\"\n ></elder-data-transfer-aggregate>\n </mat-toolbar>\n</div>\n", styles: [":host{min-width:0;min-height:0}.scroll-list{overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.scroll-fix{min-width:0;min-height:0}.elevated-card{background-color:var(--mdc-elevated-card-container-color);border-radius:var(--elder-border-radius-sm);overflow:hidden}.toolbar-dark-bg{background-color:var(--md-sys-color-surface-container);border-radius:10px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: HttpDataTransferComponent, selector: "elder-data-transfer", inputs: ["transfer"] }, { kind: "component", type: MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: HttpDataTransferAggregateComponent, selector: "elder-data-transfer-aggregate", inputs: ["hiddenWhenInactive"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
32682
32682
  }
32683
32683
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: HttpDataTransferOverviewComponent, decorators: [{
32684
32684
  type: Component,
@@ -32690,7 +32690,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
32690
32690
  MatToolbar,
32691
32691
  HttpDataTransferAggregateComponent,
32692
32692
  AsyncPipe,
32693
- ], template: "<div class=\"legacy-layout-card layout-col full elevated-card\">\n <div class=\"layout-col flex\" *ngIf=\"transfers$ | async as transfers\">\n <div *ngIf=\"transfers.length > 0; else noData\" class=\"layout-col flex scroll-list\">\n <elder-data-transfer\n class=\"flex-none\"\n *ngFor=\"let transfer of transfers\"\n [transfer]=\"transfer\"\n >\n </elder-data-transfer>\n </div>\n\n <ng-template #noData>\n <div class=\"layout-col place-center-center flex\">\n <span class=\"mat-subtitle-2 noselect\" style=\"color: gray\">No data transfers.</span>\n </div>\n </ng-template>\n </div>\n\n <mat-toolbar class=\"flex-none toolbar-dark-bg\">\n <elder-data-transfer-aggregate\n class=\"flex\"\n [hiddenWhenInactive]=\"false\"\n ></elder-data-transfer-aggregate>\n </mat-toolbar>\n</div>\n", styles: [":host{min-width:0;min-height:0}.scroll-list{overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.scroll-fix{min-width:0;min-height:0}.elevated-card{box-shadow:var(--mat-app-elevation-shadow-level-5, none);background-color:var(--md-sys-color-surface-container-lowest)}.toolbar-dark-bg{background-color:var(--md-sys-color-surface-container);border-radius:10px}\n"] }]
32693
+ ], template: "<div class=\"layout-col full elevated-card\">\n <div class=\"layout-col flex\" *ngIf=\"transfers$ | async as transfers\">\n <div *ngIf=\"transfers.length > 0; else noData\" class=\"layout-col flex scroll-list\">\n <elder-data-transfer\n class=\"flex-none\"\n *ngFor=\"let transfer of transfers\"\n [transfer]=\"transfer\"\n >\n </elder-data-transfer>\n </div>\n\n <ng-template #noData>\n <div class=\"layout-col place-center-center flex\">\n <span class=\"mat-subtitle-2 noselect\" style=\"color: gray\">No data transfers.</span>\n </div>\n </ng-template>\n </div>\n\n <mat-toolbar class=\"flex-none toolbar-dark-bg\">\n <elder-data-transfer-aggregate\n class=\"flex\"\n [hiddenWhenInactive]=\"false\"\n ></elder-data-transfer-aggregate>\n </mat-toolbar>\n</div>\n", styles: [":host{min-width:0;min-height:0}.scroll-list{overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.scroll-fix{min-width:0;min-height:0}.elevated-card{background-color:var(--mdc-elevated-card-container-color);border-radius:var(--elder-border-radius-sm);overflow:hidden}.toolbar-dark-bg{background-color:var(--md-sys-color-surface-container);border-radius:10px}\n"] }]
32694
32694
  }], ctorParameters: () => [{ type: ElderDataTransferService }] });
32695
32695
 
32696
32696
  class HttpDataTransferIndicatorComponent {
@@ -35485,11 +35485,11 @@ class ElderPageExitLockOverviewComponent {
35485
35485
  this.locks = input.required();
35486
35486
  }
35487
35487
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: ElderPageExitLockOverviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
35488
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: ElderPageExitLockOverviewComponent, isStandalone: true, selector: "elder-page-exit-lock-overview", inputs: { locks: { classPropertyName: "locks", publicName: "locks", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div appearance=\"raised\" class=\"legacy-layout-card layout-col full scrollable\">\n <div>\n @for (lock of locks(); track lock.id) {\n <elder-page-exit-lock [lock]=\"lock\"> </elder-page-exit-lock>\n }\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: ElderPageExitLockComponent, selector: "elder-page-exit-lock", inputs: ["lock"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
35488
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: ElderPageExitLockOverviewComponent, isStandalone: true, selector: "elder-page-exit-lock-overview", inputs: { locks: { classPropertyName: "locks", publicName: "locks", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<mat-card appearance=\"raised\" class=\"layout-col full scrollable\">\n <mat-card-content>\n <div>\n @for (lock of locks(); track lock.id) {\n <elder-page-exit-lock [lock]=\"lock\"> </elder-page-exit-lock>\n }\n </div>\n </mat-card-content>\n</mat-card>\n", styles: [""], dependencies: [{ kind: "component", type: MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: MatCardContent, selector: "mat-card-content" }, { kind: "component", type: ElderPageExitLockComponent, selector: "elder-page-exit-lock", inputs: ["lock"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
35489
35489
  }
35490
35490
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: ElderPageExitLockOverviewComponent, decorators: [{
35491
35491
  type: Component,
35492
- args: [{ selector: 'elder-page-exit-lock-overview', imports: [MatCard, MatCardContent, ElderPageExitLockComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div appearance=\"raised\" class=\"legacy-layout-card layout-col full scrollable\">\n <div>\n @for (lock of locks(); track lock.id) {\n <elder-page-exit-lock [lock]=\"lock\"> </elder-page-exit-lock>\n }\n </div>\n</div>\n" }]
35492
+ args: [{ selector: 'elder-page-exit-lock-overview', imports: [MatCard, MatCardContent, ElderPageExitLockComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-card appearance=\"raised\" class=\"layout-col full scrollable\">\n <mat-card-content>\n <div>\n @for (lock of locks(); track lock.id) {\n <elder-page-exit-lock [lock]=\"lock\"> </elder-page-exit-lock>\n }\n </div>\n </mat-card-content>\n</mat-card>\n" }]
35493
35493
  }], ctorParameters: () => [] });
35494
35494
 
35495
35495
  class PageExitLock {