@porscheinformatik/material-addons 17.4.5 → 18.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -5
- package/esm2022/lib/alert/alert-configuration.mjs +12 -0
- package/esm2022/lib/alert/alert.component.mjs +21 -16
- package/esm2022/lib/alert/alert.mjs +3 -0
- package/esm2022/lib/button/button.module.mjs +4 -4
- package/esm2022/lib/button/danger-button/danger-button.component.mjs +4 -6
- package/esm2022/lib/button/flat-button/link-button.component.mjs +4 -6
- package/esm2022/lib/button/icon-button/icon-button.component.mjs +4 -6
- package/esm2022/lib/button/mad-basic-button.mjs +4 -4
- package/esm2022/lib/button/mad-button/mad-button.directive.mjs +4 -4
- package/esm2022/lib/button/mad-button-group/mad-button-group.component.mjs +3 -3
- package/esm2022/lib/button/outline-button/outline-button.component.mjs +4 -6
- package/esm2022/lib/button/primary-button/primary-button.component.mjs +4 -6
- package/esm2022/lib/card/card.component.mjs +5 -5
- package/esm2022/lib/card/card.module.mjs +4 -4
- package/esm2022/lib/data-table/data-table-columns-modal/data-table-columns-modal.component.mjs +5 -5
- package/esm2022/lib/data-table/data-table-filter/data-table-filter-component/data-table-filter-dialog/data-table-filter-dialog.component.mjs +3 -3
- package/esm2022/lib/data-table/data-table-filter/data-table-filter-component/data-table-filter.component.mjs +4 -4
- package/esm2022/lib/data-table/data-table-filter/data-table-filter-header.directive.mjs +4 -4
- package/esm2022/lib/data-table/data-table-filter/data-table-filter.directive.mjs +4 -4
- package/esm2022/lib/data-table/data-table-persistence.service.mjs +4 -4
- package/esm2022/lib/data-table/data-table-template/data-table-template-cell-definition.directive.mjs +3 -3
- package/esm2022/lib/data-table/data-table-template/data-table-template-column-definition.directive.mjs +3 -3
- package/esm2022/lib/data-table/data-table-template/data-table-template-expandable-cell-definition.directive.mjs +3 -3
- package/esm2022/lib/data-table/data-table-template/data-table-template-expandable-column-definition.directive.mjs +3 -3
- package/esm2022/lib/data-table/data-table.component.mjs +5 -5
- package/esm2022/lib/data-table/util/data-table-action-util.mjs +1 -1
- package/esm2022/lib/data-table/util/data-table-data-util.mjs +1 -1
- package/esm2022/lib/data-table/util/data-table-sort-util.mjs +4 -3
- package/esm2022/lib/file-upload/drag-and-drop-directive.directive.mjs +4 -4
- package/esm2022/lib/file-upload/file-upload.component.mjs +4 -4
- package/esm2022/lib/layout/content-panel/content-header/content-header.component.mjs +3 -3
- package/esm2022/lib/layout/content-panel/content-panel-container/content-panel-container.component.mjs +4 -4
- package/esm2022/lib/layout/content-panel/content-panel-container-content/content-panel-container-content.component.mjs +3 -3
- package/esm2022/lib/layout/content-panel/content-panel-container-footer/content-panel-container-footer.component.mjs +4 -4
- package/esm2022/lib/layout/content-panel/content-panel-container-sidebar/content-panel-container-sidebar.component.mjs +3 -3
- package/esm2022/lib/layout/content-panel/content-panel.module.mjs +4 -4
- package/esm2022/lib/layout/content-panel/main-container/main-container.component.mjs +3 -3
- package/esm2022/lib/layout/flowbar/flowbar.component.mjs +4 -4
- package/esm2022/lib/layout/flowbar/flowbar.module.mjs +4 -4
- package/esm2022/lib/layout/sidebar/sidebar-item/sidebar-item.component.mjs +3 -3
- package/esm2022/lib/layout/sidebar/sidebar.component.mjs +3 -3
- package/esm2022/lib/layout/sidebar/sidebar.module.mjs +4 -4
- package/esm2022/lib/layout/sidebar-layout/sidebar-layout.component.mjs +5 -5
- package/esm2022/lib/layout/toolbar/toolbar.component.mjs +5 -5
- package/esm2022/lib/layout/toolbar/toolbar.module.mjs +4 -4
- package/esm2022/lib/layout/toolbar/toolbar.service.mjs +4 -4
- package/esm2022/lib/material-action-button/material-action-button.component.mjs +4 -4
- package/esm2022/lib/material-action-button/material-action-button.module.mjs +4 -4
- package/esm2022/lib/material-addons.module.mjs +4 -4
- package/esm2022/lib/numeric-field/number-format.service.mjs +4 -4
- package/esm2022/lib/numeric-field/numeric-field.directive.mjs +4 -4
- package/esm2022/lib/numeric-field/numeric-field.module.mjs +4 -4
- package/esm2022/lib/quick-list/base-quick-list.component.mjs +4 -4
- package/esm2022/lib/quick-list/quick-list-compact/quick-list-compact.component.mjs +5 -12
- package/esm2022/lib/quick-list/quick-list.component.mjs +3 -3
- package/esm2022/lib/quick-list/quick-list.module.mjs +4 -4
- package/esm2022/lib/quick-list/reactive-form-quick-list/reactive-form-quick-list.component.mjs +5 -12
- package/esm2022/lib/quick-list/reactive-form-quick-list-compact/reactive-form-quick-list-compact.component.mjs +5 -12
- package/esm2022/lib/readonly/readonly-form-field/readonly-form-field.component.mjs +5 -5
- package/esm2022/lib/readonly/readonly-form-field-wrapper/readonly-form-field-wrapper.component.mjs +6 -6
- package/esm2022/lib/readonly/readonly-form-field.module.mjs +4 -4
- package/esm2022/lib/stepper/step-header/step-header.component.mjs +5 -5
- package/esm2022/lib/stepper/stepper.component.mjs +8 -8
- package/esm2022/lib/stepper/stepper.module.mjs +4 -4
- package/esm2022/lib/table/table.component.mjs +4 -4
- package/esm2022/lib/table/table.module.mjs +4 -4
- package/esm2022/lib/throttle-click/throttle-click.directive.mjs +3 -3
- package/esm2022/lib/throttle-click/throttle-click.module.mjs +4 -4
- package/esm2022/public_api.mjs +2 -2
- package/fesm2022/porscheinformatik-material-addons.mjs +252 -267
- package/fesm2022/porscheinformatik-material-addons.mjs.map +1 -1
- package/lib/alert/alert-configuration.d.ts +9 -0
- package/lib/alert/alert-configuration.d.ts.map +1 -0
- package/lib/alert/alert.component.d.ts +3 -0
- package/lib/alert/alert.component.d.ts.map +1 -1
- package/lib/alert/alert.d.ts +3 -0
- package/lib/alert/alert.d.ts.map +1 -0
- package/lib/button/danger-button/danger-button.component.d.ts.map +1 -1
- package/lib/button/flat-button/link-button.component.d.ts.map +1 -1
- package/lib/button/icon-button/icon-button.component.d.ts.map +1 -1
- package/lib/button/outline-button/outline-button.component.d.ts.map +1 -1
- package/lib/button/primary-button/primary-button.component.d.ts.map +1 -1
- package/lib/data-table/util/data-table-sort-util.d.ts.map +1 -1
- package/lib/quick-list/quick-list-compact/quick-list-compact.component.d.ts.map +1 -1
- package/lib/quick-list/reactive-form-quick-list/reactive-form-quick-list.component.d.ts.map +1 -1
- package/lib/quick-list/reactive-form-quick-list-compact/reactive-form-quick-list-compact.component.d.ts.map +1 -1
- package/lib/readonly/readonly-form-field-wrapper/readonly-form-field-wrapper.component.d.ts.map +1 -1
- package/package.json +4 -3
- package/public_api.d.ts +1 -1
- package/public_api.d.ts.map +1 -1
- package/themes/carcat.scss +9 -0
- package/themes/common/styles.scss +4 -4
- package/themes/common/theme.scss +6 -6
|
@@ -20,9 +20,9 @@ import * as i2$2 from '@angular/material/form-field';
|
|
|
20
20
|
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
21
21
|
import * as i2$3 from '@angular/cdk/observers';
|
|
22
22
|
import { ObserversModule } from '@angular/cdk/observers';
|
|
23
|
-
import {
|
|
23
|
+
import { trigger, transition, style, animate, state } from '@angular/animations';
|
|
24
24
|
import { Subject, Subscription, of } from 'rxjs';
|
|
25
|
-
import { throttleTime, map, tap, startWith,
|
|
25
|
+
import { throttleTime, switchMap, map, tap, startWith, takeUntil, distinctUntilChanged } from 'rxjs/operators';
|
|
26
26
|
import * as i1$2 from '@angular/material/card';
|
|
27
27
|
import { MatCardModule } from '@angular/material/card';
|
|
28
28
|
import * as i9 from '@angular/material/table';
|
|
@@ -75,10 +75,10 @@ class MaterialActionButtonComponent {
|
|
|
75
75
|
this.liftHigher = true;
|
|
76
76
|
this.liftHigher2 = false;
|
|
77
77
|
}
|
|
78
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
79
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
78
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MaterialActionButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
79
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: MaterialActionButtonComponent, isStandalone: true, selector: "mad-material-action-button", inputs: { actionName: "actionName", id: "id", icon: "icon", routerLink: "routerLink", liftHigher: "liftHigher", liftHigher2: "liftHigher2" }, ngImport: i0, template: "<div class=\"material-action-button {{ liftHigher ? 'lift-higher' : '' }} {{ liftHigher2 ? 'lift-higher-2' : '' }}\">\n <a [routerLink]=\"routerLink\">\n <button [id]=\"id\" mat-fab [matTooltipPosition]=\"'left'\" [matTooltip]=\"actionName\" color=\"primary\" *ngIf=\"!liftHigher2\">\n <mat-icon>{{ icon }}</mat-icon>\n </button>\n <button [id]=\"id\" mat-mini-fab [matTooltipPosition]=\"'left'\" [matTooltip]=\"actionName\" color=\"accent\" *ngIf=\"liftHigher2\">\n <mat-icon>{{ icon }}</mat-icon>\n </button>\n </a>\n</div>\n", styles: [".material-action-button{position:fixed;bottom:20px;right:20px;z-index:100;display:flex;flex-direction:column-reverse;align-items:center}.lift-higher{bottom:61px}.lift-higher-2{right:28px;bottom:121px}\n"], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatMiniFabButton, selector: "button[mat-mini-fab]", exportAs: ["matButton"] }, { kind: "component", type: i1.MatFabButton, selector: "button[mat-fab]", inputs: ["extended"], exportAs: ["matButton"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
|
|
80
80
|
}
|
|
81
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
81
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MaterialActionButtonComponent, decorators: [{
|
|
82
82
|
type: Component,
|
|
83
83
|
args: [{ selector: 'mad-material-action-button', standalone: true, imports: [RouterLink, NgIf, MatButtonModule, MatTooltipModule, MatIconModule], template: "<div class=\"material-action-button {{ liftHigher ? 'lift-higher' : '' }} {{ liftHigher2 ? 'lift-higher-2' : '' }}\">\n <a [routerLink]=\"routerLink\">\n <button [id]=\"id\" mat-fab [matTooltipPosition]=\"'left'\" [matTooltip]=\"actionName\" color=\"primary\" *ngIf=\"!liftHigher2\">\n <mat-icon>{{ icon }}</mat-icon>\n </button>\n <button [id]=\"id\" mat-mini-fab [matTooltipPosition]=\"'left'\" [matTooltip]=\"actionName\" color=\"accent\" *ngIf=\"liftHigher2\">\n <mat-icon>{{ icon }}</mat-icon>\n </button>\n </a>\n</div>\n", styles: [".material-action-button{position:fixed;bottom:20px;right:20px;z-index:100;display:flex;flex-direction:column-reverse;align-items:center}.lift-higher{bottom:61px}.lift-higher-2{right:28px;bottom:121px}\n"] }]
|
|
84
84
|
}], propDecorators: { actionName: [{
|
|
@@ -96,11 +96,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
96
96
|
}] } });
|
|
97
97
|
|
|
98
98
|
class MaterialActionButtonModule {
|
|
99
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
100
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
101
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
99
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MaterialActionButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
100
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: MaterialActionButtonModule, imports: [CommonModule, RouterModule, MatButtonModule, MatIconModule, MatTooltipModule, MaterialActionButtonComponent], exports: [MaterialActionButtonComponent] }); }
|
|
101
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MaterialActionButtonModule, imports: [CommonModule, RouterModule, MatButtonModule, MatIconModule, MatTooltipModule, MaterialActionButtonComponent] }); }
|
|
102
102
|
}
|
|
103
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
103
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MaterialActionButtonModule, decorators: [{
|
|
104
104
|
type: NgModule,
|
|
105
105
|
args: [{
|
|
106
106
|
imports: [CommonModule, RouterModule, MatButtonModule, MatIconModule, MatTooltipModule, MaterialActionButtonComponent],
|
|
@@ -129,10 +129,10 @@ class MadBasicButton {
|
|
|
129
129
|
this.button.nativeElement.removeEventListener('click', this.disableClick);
|
|
130
130
|
}
|
|
131
131
|
}
|
|
132
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
133
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
132
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MadBasicButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
133
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: MadBasicButton, selector: "ng-component", host: { properties: { "style.pointer-events": "this.pointerEvent", "style.opacity": "this.opacity" } }, usesOnChanges: true, ngImport: i0, template: '', isInline: true }); }
|
|
134
134
|
}
|
|
135
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
135
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MadBasicButton, decorators: [{
|
|
136
136
|
type: Component,
|
|
137
137
|
args: [{
|
|
138
138
|
template: '',
|
|
@@ -149,13 +149,11 @@ class DangerButtonComponent extends MadBasicButton {
|
|
|
149
149
|
constructor() {
|
|
150
150
|
super();
|
|
151
151
|
this.title = '';
|
|
152
|
-
super.button = this.button;
|
|
153
|
-
super.disabled = this.disabled;
|
|
154
152
|
}
|
|
155
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
156
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
153
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DangerButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
154
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: DangerButtonComponent, isStandalone: true, selector: "mad-danger-button", inputs: { type: "type", disabled: "disabled", title: "title" }, viewQueries: [{ propertyName: "button", first: true, predicate: ["btn"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, ngImport: i0, template: "<button data-cy=\"button\" mat-raised-button color=\"warn\" [type]=\"type\" [title]=\"title\" #btn>\n <ng-content></ng-content>\n</button>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }] }); }
|
|
157
155
|
}
|
|
158
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
156
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DangerButtonComponent, decorators: [{
|
|
159
157
|
type: Component,
|
|
160
158
|
args: [{ selector: 'mad-danger-button', standalone: true, imports: [MatButtonModule], template: "<button data-cy=\"button\" mat-raised-button color=\"warn\" [type]=\"type\" [title]=\"title\" #btn>\n <ng-content></ng-content>\n</button>\n" }]
|
|
161
159
|
}], ctorParameters: () => [], propDecorators: { type: [{
|
|
@@ -173,13 +171,11 @@ class LinkButtonComponent extends MadBasicButton {
|
|
|
173
171
|
constructor() {
|
|
174
172
|
super();
|
|
175
173
|
this.title = '';
|
|
176
|
-
super.button = this.button;
|
|
177
|
-
super.disabled = this.disabled;
|
|
178
174
|
}
|
|
179
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
180
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
175
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: LinkButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
176
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: LinkButtonComponent, isStandalone: true, selector: "mad-link-button", inputs: { type: "type", disabled: "disabled", title: "title" }, viewQueries: [{ propertyName: "button", first: true, predicate: ["btn"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, ngImport: i0, template: "<button data-cy=\"button\" [title]=\"title\" [type]=\"type\" color=\"primary\" #btn mat-button>\n <ng-content></ng-content>\n</button>\n", dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }] }); }
|
|
181
177
|
}
|
|
182
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
178
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: LinkButtonComponent, decorators: [{
|
|
183
179
|
type: Component,
|
|
184
180
|
args: [{ selector: 'mad-link-button', standalone: true, imports: [MatButtonModule], template: "<button data-cy=\"button\" [title]=\"title\" [type]=\"type\" color=\"primary\" #btn mat-button>\n <ng-content></ng-content>\n</button>\n" }]
|
|
185
181
|
}], ctorParameters: () => [], propDecorators: { type: [{
|
|
@@ -197,13 +193,11 @@ class IconButtonComponent extends MadBasicButton {
|
|
|
197
193
|
constructor() {
|
|
198
194
|
super();
|
|
199
195
|
this.title = '';
|
|
200
|
-
super.button = this.button;
|
|
201
|
-
super.disabled = this.disabled;
|
|
202
196
|
}
|
|
203
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
204
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
197
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: IconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
198
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: IconButtonComponent, isStandalone: true, selector: "mad-icon-button", inputs: { type: "type", disabled: "disabled", title: "title" }, viewQueries: [{ propertyName: "button", first: true, predicate: ["btn"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, ngImport: i0, template: "<button data-cy=\"button\" mat-icon-button color=\"primary\" [type]=\"type\" [title]=\"title\" #btn>\n <ng-content></ng-content>\n</button>\n", dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }] }); }
|
|
205
199
|
}
|
|
206
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
200
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: IconButtonComponent, decorators: [{
|
|
207
201
|
type: Component,
|
|
208
202
|
args: [{ selector: 'mad-icon-button', standalone: true, imports: [MatButtonModule], template: "<button data-cy=\"button\" mat-icon-button color=\"primary\" [type]=\"type\" [title]=\"title\" #btn>\n <ng-content></ng-content>\n</button>\n" }]
|
|
209
203
|
}], ctorParameters: () => [], propDecorators: { type: [{
|
|
@@ -222,13 +216,11 @@ class OutlineButtonComponent extends MadBasicButton {
|
|
|
222
216
|
super();
|
|
223
217
|
this.title = '';
|
|
224
218
|
this.color = 'primary';
|
|
225
|
-
super.button = this.button;
|
|
226
|
-
super.disabled = this.disabled;
|
|
227
219
|
}
|
|
228
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
229
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
220
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: OutlineButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
221
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: OutlineButtonComponent, isStandalone: true, selector: "mad-outline-button", inputs: { type: "type", disabled: "disabled", title: "title", color: "color" }, viewQueries: [{ propertyName: "button", first: true, predicate: ["btn"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, ngImport: i0, template: "<button data-cy=\"button\" mat-stroked-button [color]=\"color\" [type]=\"type\" [title]=\"title\" #btn>\n <ng-content></ng-content>\n</button>\n", styles: [".mat-mdc-outlined-button:not(:disabled){--mdc-outlined-button-outline-color: var(--mdc-outlined-button-label-text-color)}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }] }); }
|
|
230
222
|
}
|
|
231
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
223
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: OutlineButtonComponent, decorators: [{
|
|
232
224
|
type: Component,
|
|
233
225
|
args: [{ selector: 'mad-outline-button', standalone: true, imports: [MatButtonModule], template: "<button data-cy=\"button\" mat-stroked-button [color]=\"color\" [type]=\"type\" [title]=\"title\" #btn>\n <ng-content></ng-content>\n</button>\n", styles: [".mat-mdc-outlined-button:not(:disabled){--mdc-outlined-button-outline-color: var(--mdc-outlined-button-label-text-color)}\n"] }]
|
|
234
226
|
}], ctorParameters: () => [], propDecorators: { type: [{
|
|
@@ -248,13 +240,11 @@ class PrimaryButtonComponent extends MadBasicButton {
|
|
|
248
240
|
constructor() {
|
|
249
241
|
super();
|
|
250
242
|
this.title = '';
|
|
251
|
-
super.button = this.button;
|
|
252
|
-
super.disabled = this.disabled;
|
|
253
243
|
}
|
|
254
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
255
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
244
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: PrimaryButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
245
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: PrimaryButtonComponent, isStandalone: true, selector: "mad-primary-button", inputs: { type: "type", disabled: "disabled", title: "title" }, viewQueries: [{ propertyName: "button", first: true, predicate: ["btn"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, ngImport: i0, template: "<button data-cy=\"button\" mat-raised-button color=\"primary\" [type]=\"type\" [title]=\"title\" #btn>\n <ng-content></ng-content>\n</button>\n", dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }] }); }
|
|
256
246
|
}
|
|
257
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
247
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: PrimaryButtonComponent, decorators: [{
|
|
258
248
|
type: Component,
|
|
259
249
|
args: [{ selector: 'mad-primary-button', standalone: true, imports: [MatButtonModule], template: "<button data-cy=\"button\" mat-raised-button color=\"primary\" [type]=\"type\" [title]=\"title\" #btn>\n <ng-content></ng-content>\n</button>\n" }]
|
|
260
250
|
}], ctorParameters: () => [], propDecorators: { type: [{
|
|
@@ -305,10 +295,10 @@ class MadButtonDirective {
|
|
|
305
295
|
this.renderer.removeClass(this.elementRef.nativeElement, className);
|
|
306
296
|
}
|
|
307
297
|
}
|
|
308
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
309
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
298
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MadButtonDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i1.MatAnchor, optional: true }, { token: i1.MatButton, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
299
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: MadButtonDirective, isStandalone: true, selector: "[madButton]", inputs: { color: "color", outline: "outline", uppercase: "uppercase" }, ngImport: i0 }); }
|
|
310
300
|
}
|
|
311
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
301
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MadButtonDirective, decorators: [{
|
|
312
302
|
type: Directive,
|
|
313
303
|
args: [{
|
|
314
304
|
selector: '[madButton]',
|
|
@@ -330,10 +320,10 @@ class MadButtonGroupComponent {
|
|
|
330
320
|
constructor() {
|
|
331
321
|
this.setClass = true;
|
|
332
322
|
}
|
|
333
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
334
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
323
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MadButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
324
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: MadButtonGroupComponent, isStandalone: true, selector: "mad-button-group", host: { properties: { "class.mad-button-group": "this.setClass" } }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
|
|
335
325
|
}
|
|
336
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
326
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MadButtonGroupComponent, decorators: [{
|
|
337
327
|
type: Component,
|
|
338
328
|
args: [{
|
|
339
329
|
selector: 'mad-button-group',
|
|
@@ -346,8 +336,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
346
336
|
}] } });
|
|
347
337
|
|
|
348
338
|
class ButtonModule {
|
|
349
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
350
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
339
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
340
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ButtonModule, imports: [CommonModule,
|
|
351
341
|
RouterModule,
|
|
352
342
|
MatButtonModule,
|
|
353
343
|
MatIconModule,
|
|
@@ -365,7 +355,7 @@ class ButtonModule {
|
|
|
365
355
|
IconButtonComponent,
|
|
366
356
|
MadButtonDirective,
|
|
367
357
|
MadButtonGroupComponent] }); }
|
|
368
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
358
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ButtonModule, imports: [CommonModule,
|
|
369
359
|
RouterModule,
|
|
370
360
|
MatButtonModule,
|
|
371
361
|
MatIconModule,
|
|
@@ -376,7 +366,7 @@ class ButtonModule {
|
|
|
376
366
|
DangerButtonComponent,
|
|
377
367
|
IconButtonComponent] }); }
|
|
378
368
|
}
|
|
379
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
369
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ButtonModule, decorators: [{
|
|
380
370
|
type: NgModule,
|
|
381
371
|
args: [{
|
|
382
372
|
imports: [
|
|
@@ -529,10 +519,10 @@ class NumberFormatService {
|
|
|
529
519
|
valueOrDefault(value, defaultValue) {
|
|
530
520
|
return NumberFormatService.valueIsSet(value) ? value : defaultValue;
|
|
531
521
|
}
|
|
532
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
533
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
522
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: NumberFormatService, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
523
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: NumberFormatService, providedIn: 'any' }); }
|
|
534
524
|
}
|
|
535
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
525
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: NumberFormatService, decorators: [{
|
|
536
526
|
type: Injectable,
|
|
537
527
|
args: [{
|
|
538
528
|
providedIn: 'any',
|
|
@@ -703,12 +693,12 @@ class ReadOnlyFormFieldComponent {
|
|
|
703
693
|
}
|
|
704
694
|
return this.unitPosition === 'left' ? this.unit + ' ' + this.value : this.value + ' ' + this.unit;
|
|
705
695
|
}
|
|
706
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
707
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
696
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ReadOnlyFormFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: NumberFormatService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
697
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: ReadOnlyFormFieldComponent, isStandalone: true, selector: "mad-readonly-form-field", inputs: { useProjectedContent: "useProjectedContent", value: "value", label: "label", textAlign: "textAlign", formatNumber: "formatNumber", decimalPlaces: "decimalPlaces", roundValue: ["roundDisplayValue", "roundValue"], autofillDecimals: "autofillDecimals", unit: "unit", unitPosition: "unitPosition", errorMessage: "errorMessage", multiline: "multiline", rows: "rows", id: "id", shrinkIfEmpty: "shrinkIfEmpty", suffix: "suffix", prefix: "prefix", multilineAutoSize: "multilineAutoSize" }, outputs: { suffixClickedEmitter: "suffixClickedEmitter", prefixClickedEmitter: "prefixClickedEmitter" }, viewQueries: [{ propertyName: "originalContent", first: true, predicate: ["contentWrapper"], descendants: true }, { propertyName: "inputEl", first: true, predicate: ["inputEl"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<mat-form-field class=\"form-group mad-read-only\">\n <mat-label>{{ label }}</mat-label>\n <input\n *ngIf=\"!multiline\"\n [ngStyle]=\"{ display: useProjectedContent ? 'none' : 'block' }\"\n [ngModel]=\"value\"\n [ngClass]=\"'text-' + textAlign + ' content'\"\n [errorStateMatcher]=\"errorMatcher\"\n [id]=\"id\"\n readonly\n [disabled]=\"!useProjectedContent\"\n matInput\n #inputEl\n matTooltip=\"{{ toolTipText }}\"\n matTooltipPosition=\"right\"\n matTooltipClass=\"custom-tooltip\"\n matTooltipDisabled=\"{{ !toolTipForInputEnabled }}\"\n />\n\n <textarea\n *ngIf=\"multiline\"\n [ngStyle]=\"{ display: useProjectedContent ? 'none' : 'block' }\"\n [rows]=\"rows\"\n [ngModel]=\"value\"\n class=\"multiline content\"\n [errorStateMatcher]=\"errorMatcher\"\n [id]=\"id\"\n readonly\n [disabled]=\"!useProjectedContent\"\n matInput\n [cdkTextareaAutosize]=\"multilineAutoSize\"\n ></textarea>\n <ng-content *ngIf=\"useProjectedContent\" />\n <mat-error>{{ errorMessage }}</mat-error>\n <mat-icon data-cy=\"suffix-icon\" *ngIf=\"suffix\" (click)=\"suffixClicked()\" class=\"pointer\" color=\"primary\" matSuffix>{{ suffix }}</mat-icon>\n <mat-icon data-cy=\"prefix-icon\" *ngIf=\"prefix\" (click)=\"prefixClicked()\" class=\"pointer\" color=\"primary\" matPrefix>{{ prefix }}</mat-icon>\n</mat-form-field>\n", styles: ["mat-form-field{width:100%;width:-moz-available;width:-webkit-fill-available;width:stretch}mat-label{line-height:1.4}span[matPrefix]{padding-right:5px}span[matSuffix]{padding-left:5px}.text-left{text-align:left}.text-right{text-align:right}.multiline{resize:none}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i4.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
|
|
708
698
|
}
|
|
709
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
699
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ReadOnlyFormFieldComponent, decorators: [{
|
|
710
700
|
type: Component,
|
|
711
|
-
args: [{ selector: 'mad-readonly-form-field', standalone: true, imports: [MatFormFieldModule, NgIf, MatInputModule, FormsModule, NgStyle, NgClass, MatTooltipModule, TextFieldModule, MatIconModule], template: "<mat-form-field class=\"form-group mad-read-only\">\n <mat-label>{{ label }}</mat-label>\n <input\n *ngIf=\"!multiline\"\n [ngStyle]=\"{ display: useProjectedContent ? 'none' : 'block' }\"\n [ngModel]=\"value\"\n [ngClass]=\"'text-' + textAlign + ' content'\"\n [errorStateMatcher]=\"errorMatcher\"\n [id]=\"id\"\n readonly\n [disabled]=\"!useProjectedContent\"\n matInput\n #inputEl\n matTooltip=\"{{ toolTipText }}\"\n matTooltipPosition=\"right\"\n matTooltipClass=\"custom-tooltip\"\n matTooltipDisabled=\"{{ !toolTipForInputEnabled }}\"\n />\n\n <textarea\n *ngIf=\"multiline\"\n [ngStyle]=\"{ display: useProjectedContent ? 'none' : 'block' }\"\n [rows]=\"rows\"\n [ngModel]=\"value\"\n class=\"multiline content\"\n [errorStateMatcher]=\"errorMatcher\"\n [id]=\"id\"\n readonly\n [disabled]=\"!useProjectedContent\"\n matInput\n [cdkTextareaAutosize]=\"multilineAutoSize\"\n ></textarea>\n <ng-content *ngIf=\"useProjectedContent\" />\n <mat-error>{{ errorMessage }}</mat-error>\n <mat-icon data-cy=\"suffix-icon\" *ngIf=\"suffix\" (click)=\"suffixClicked()\" class=\"pointer\" color=\"primary\" matSuffix>{{ suffix }}</mat-icon>\n <mat-icon data-cy=\"prefix-icon\" *ngIf=\"prefix\" (click)=\"prefixClicked()\" class=\"pointer\" color=\"primary\" matPrefix>{{ prefix }}</mat-icon>\n</mat-form-field>\n", styles: ["mat-form-field{width:100%;width:-
|
|
701
|
+
args: [{ selector: 'mad-readonly-form-field', standalone: true, imports: [MatFormFieldModule, NgIf, MatInputModule, FormsModule, NgStyle, NgClass, MatTooltipModule, TextFieldModule, MatIconModule], template: "<mat-form-field class=\"form-group mad-read-only\">\n <mat-label>{{ label }}</mat-label>\n <input\n *ngIf=\"!multiline\"\n [ngStyle]=\"{ display: useProjectedContent ? 'none' : 'block' }\"\n [ngModel]=\"value\"\n [ngClass]=\"'text-' + textAlign + ' content'\"\n [errorStateMatcher]=\"errorMatcher\"\n [id]=\"id\"\n readonly\n [disabled]=\"!useProjectedContent\"\n matInput\n #inputEl\n matTooltip=\"{{ toolTipText }}\"\n matTooltipPosition=\"right\"\n matTooltipClass=\"custom-tooltip\"\n matTooltipDisabled=\"{{ !toolTipForInputEnabled }}\"\n />\n\n <textarea\n *ngIf=\"multiline\"\n [ngStyle]=\"{ display: useProjectedContent ? 'none' : 'block' }\"\n [rows]=\"rows\"\n [ngModel]=\"value\"\n class=\"multiline content\"\n [errorStateMatcher]=\"errorMatcher\"\n [id]=\"id\"\n readonly\n [disabled]=\"!useProjectedContent\"\n matInput\n [cdkTextareaAutosize]=\"multilineAutoSize\"\n ></textarea>\n <ng-content *ngIf=\"useProjectedContent\" />\n <mat-error>{{ errorMessage }}</mat-error>\n <mat-icon data-cy=\"suffix-icon\" *ngIf=\"suffix\" (click)=\"suffixClicked()\" class=\"pointer\" color=\"primary\" matSuffix>{{ suffix }}</mat-icon>\n <mat-icon data-cy=\"prefix-icon\" *ngIf=\"prefix\" (click)=\"prefixClicked()\" class=\"pointer\" color=\"primary\" matPrefix>{{ prefix }}</mat-icon>\n</mat-form-field>\n", styles: ["mat-form-field{width:100%;width:-moz-available;width:-webkit-fill-available;width:stretch}mat-label{line-height:1.4}span[matPrefix]{padding-right:5px}span[matSuffix]{padding-left:5px}.text-left{text-align:left}.text-right{text-align:right}.multiline{resize:none}\n"] }]
|
|
712
702
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: NumberFormatService }, { type: i0.ElementRef }], propDecorators: { originalContent: [{
|
|
713
703
|
type: ViewChild,
|
|
714
704
|
args: ['contentWrapper', { static: false }]
|
|
@@ -880,12 +870,12 @@ class ReadOnlyFormFieldWrapperComponent {
|
|
|
880
870
|
formField.setAttribute('style', 'width:100%');
|
|
881
871
|
}
|
|
882
872
|
}
|
|
883
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
884
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
873
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ReadOnlyFormFieldWrapperComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.FormGroupDirective }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
874
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: ReadOnlyFormFieldWrapperComponent, isStandalone: true, selector: "mad-readonly-form-field-wrapper", inputs: { readonly: "readonly", value: "value", textAlign: "textAlign", formatNumber: "formatNumber", decimalPlaces: "decimalPlaces", roundValue: ["roundDisplayValue", "roundValue"], autofillDecimals: "autofillDecimals", unit: "unit", unitPosition: "unitPosition", errorMessage: "errorMessage", id: "id", multiline: "multiline", rows: "rows", shrinkIfEmpty: "shrinkIfEmpty", hideIconInReadOnlyMode: "hideIconInReadOnlyMode", suffix: "suffix", prefix: "prefix", multilineAutoSize: "multilineAutoSize" }, outputs: { suffixClickedEmitter: "suffixClickedEmitter", prefixClickedEmitter: "prefixClickedEmitter" }, viewQueries: [{ propertyName: "originalContent", first: true, predicate: ["contentWrapper"], descendants: true }, { propertyName: "readOnlyContentWrapper", first: true, predicate: ["readOnlyContentWrapper"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div #contentWrapper [hidden]=\"readonly\" (cdkObserveContent)=\"onContentChange()\">\n <ng-content></ng-content>\n</div>\n\n<div #readOnlyContentWrapper>\n <ng-container *ngIf=\"!!readonly\">\n <mad-readonly-form-field\n [label]=\"getLabel()\"\n [value]=\"value\"\n [textAlign]=\"textAlign\"\n [formatNumber]=\"formatNumber\"\n [decimalPlaces]=\"decimalPlaces\"\n [roundDisplayValue]=\"roundValue\"\n [autofillDecimals]=\"autofillDecimals\"\n [unit]=\"unit\"\n [unitPosition]=\"unitPosition\"\n [errorMessage]=\"errorMessage\"\n [multiline]=\"multiline\"\n [rows]=\"rows\"\n [shrinkIfEmpty]=\"shrinkIfEmpty\"\n [id]=\"id\"\n [suffix]=\"suffix\"\n [prefix]=\"prefix\"\n [multilineAutoSize]=\"multilineAutoSize\"\n (suffixClickedEmitter)=\"suffixClicked()\"\n (prefixClickedEmitter)=\"prefixClicked()\"\n >\n </mad-readonly-form-field>\n </ng-container>\n</div>\n", styles: ["mat-form-field{width:inherit}div{width:inherit}::ng-deep .custom-tooltip{font-size:14px!important;word-break:break-all!important;white-space:normal!important}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ReadOnlyFormFieldComponent, selector: "mad-readonly-form-field", inputs: ["useProjectedContent", "value", "label", "textAlign", "formatNumber", "decimalPlaces", "roundDisplayValue", "autofillDecimals", "unit", "unitPosition", "errorMessage", "multiline", "rows", "id", "shrinkIfEmpty", "suffix", "prefix", "multilineAutoSize"], outputs: ["suffixClickedEmitter", "prefixClickedEmitter"] }, { kind: "ngmodule", type: ObserversModule }, { kind: "directive", type: i2$3.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] }); }
|
|
885
875
|
}
|
|
886
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
876
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ReadOnlyFormFieldWrapperComponent, decorators: [{
|
|
887
877
|
type: Component,
|
|
888
|
-
args: [{ selector: 'mad-readonly-form-field-wrapper', viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }], standalone: true, imports: [NgIf, ReadOnlyFormFieldComponent, ObserversModule], template: "<div #contentWrapper [hidden]=\"readonly\"
|
|
878
|
+
args: [{ selector: 'mad-readonly-form-field-wrapper', viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }], standalone: true, imports: [NgIf, ReadOnlyFormFieldComponent, ObserversModule], template: "<div #contentWrapper [hidden]=\"readonly\" (cdkObserveContent)=\"onContentChange()\">\n <ng-content></ng-content>\n</div>\n\n<div #readOnlyContentWrapper>\n <ng-container *ngIf=\"!!readonly\">\n <mad-readonly-form-field\n [label]=\"getLabel()\"\n [value]=\"value\"\n [textAlign]=\"textAlign\"\n [formatNumber]=\"formatNumber\"\n [decimalPlaces]=\"decimalPlaces\"\n [roundDisplayValue]=\"roundValue\"\n [autofillDecimals]=\"autofillDecimals\"\n [unit]=\"unit\"\n [unitPosition]=\"unitPosition\"\n [errorMessage]=\"errorMessage\"\n [multiline]=\"multiline\"\n [rows]=\"rows\"\n [shrinkIfEmpty]=\"shrinkIfEmpty\"\n [id]=\"id\"\n [suffix]=\"suffix\"\n [prefix]=\"prefix\"\n [multilineAutoSize]=\"multilineAutoSize\"\n (suffixClickedEmitter)=\"suffixClicked()\"\n (prefixClickedEmitter)=\"prefixClicked()\"\n >\n </mad-readonly-form-field>\n </ng-container>\n</div>\n", styles: ["mat-form-field{width:inherit}div{width:inherit}::ng-deep .custom-tooltip{font-size:14px!important;word-break:break-all!important;white-space:normal!important}\n"] }]
|
|
889
879
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.FormGroupDirective }], propDecorators: { originalContent: [{
|
|
890
880
|
type: ViewChild,
|
|
891
881
|
args: ['contentWrapper', { static: false }]
|
|
@@ -944,8 +934,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
944
934
|
}] } });
|
|
945
935
|
|
|
946
936
|
class ReadOnlyFormFieldModule {
|
|
947
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
948
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
937
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ReadOnlyFormFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
938
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ReadOnlyFormFieldModule, imports: [CommonModule,
|
|
949
939
|
RouterModule,
|
|
950
940
|
MatFormFieldModule,
|
|
951
941
|
MatInputModule,
|
|
@@ -954,7 +944,7 @@ class ReadOnlyFormFieldModule {
|
|
|
954
944
|
MatIconModule,
|
|
955
945
|
ReadOnlyFormFieldComponent,
|
|
956
946
|
ReadOnlyFormFieldWrapperComponent], exports: [ReadOnlyFormFieldComponent, ReadOnlyFormFieldWrapperComponent] }); }
|
|
957
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
947
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ReadOnlyFormFieldModule, providers: [FormGroupDirective], imports: [CommonModule,
|
|
958
948
|
RouterModule,
|
|
959
949
|
MatFormFieldModule,
|
|
960
950
|
MatInputModule,
|
|
@@ -964,7 +954,7 @@ class ReadOnlyFormFieldModule {
|
|
|
964
954
|
ReadOnlyFormFieldComponent,
|
|
965
955
|
ReadOnlyFormFieldWrapperComponent] }); }
|
|
966
956
|
}
|
|
967
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
957
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ReadOnlyFormFieldModule, decorators: [{
|
|
968
958
|
type: NgModule,
|
|
969
959
|
args: [{
|
|
970
960
|
imports: [
|
|
@@ -1220,8 +1210,8 @@ class NumericFieldDirective {
|
|
|
1220
1210
|
const method = this.roundValue ? 'round' : value < 0 ? 'ceil' : 'floor';
|
|
1221
1211
|
return Math[method](value * Math.pow(10, this.decimalPlaces)) / Math.pow(10, this.decimalPlaces);
|
|
1222
1212
|
}
|
|
1223
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1224
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1213
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: NumericFieldDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: NumberFormatService }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1214
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: NumericFieldDirective, isStandalone: true, selector: "[madNumericField]", inputs: { textAlign: "textAlign", decimalPlaces: "decimalPlaces", roundValue: ["roundDisplayValue", "roundValue"], autofillDecimals: "autofillDecimals", unit: "unit", unitPosition: "unitPosition", numericValue: "numericValue" }, outputs: { numericValueChanged: "numericValueChange" }, host: { listeners: { "change": "onChange(getValueForFormControl())", "input": "onChange(getValueForFormControl())", "blur": "onTouched()" }, properties: { "class.text-right": "textAlign === \"right\"" } }, providers: [
|
|
1225
1215
|
{
|
|
1226
1216
|
provide: NG_VALUE_ACCESSOR,
|
|
1227
1217
|
useExisting: forwardRef(() => NumericFieldDirective),
|
|
@@ -1229,7 +1219,7 @@ class NumericFieldDirective {
|
|
|
1229
1219
|
},
|
|
1230
1220
|
], ngImport: i0 }); }
|
|
1231
1221
|
}
|
|
1232
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1222
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: NumericFieldDirective, decorators: [{
|
|
1233
1223
|
type: Directive,
|
|
1234
1224
|
args: [{
|
|
1235
1225
|
selector: '[madNumericField]',
|
|
@@ -1281,11 +1271,11 @@ class NumericFieldModule {
|
|
|
1281
1271
|
providers: [NumberFormatService],
|
|
1282
1272
|
};
|
|
1283
1273
|
}
|
|
1284
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1285
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
1286
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
1274
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: NumericFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1275
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: NumericFieldModule, imports: [NumericFieldDirective], exports: [NumericFieldDirective] }); }
|
|
1276
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: NumericFieldModule, providers: [NumberFormatService] }); }
|
|
1287
1277
|
}
|
|
1288
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1278
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: NumericFieldModule, decorators: [{
|
|
1289
1279
|
type: NgModule,
|
|
1290
1280
|
args: [{
|
|
1291
1281
|
imports: [NumericFieldDirective],
|
|
@@ -1311,10 +1301,10 @@ class ThrottleClickDirective {
|
|
|
1311
1301
|
ngOnDestroy() {
|
|
1312
1302
|
this.subscription.unsubscribe();
|
|
1313
1303
|
}
|
|
1314
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1315
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1304
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ThrottleClickDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1305
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: ThrottleClickDirective, isStandalone: true, selector: "[madThrottleClick]", inputs: { throttleTime: "throttleTime" }, outputs: { throttleClick: "throttleClick" }, host: { listeners: { "click": "clickEvent($event)" } }, ngImport: i0 }); }
|
|
1316
1306
|
}
|
|
1317
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1307
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ThrottleClickDirective, decorators: [{
|
|
1318
1308
|
type: Directive,
|
|
1319
1309
|
args: [{
|
|
1320
1310
|
selector: '[madThrottleClick]',
|
|
@@ -1362,8 +1352,8 @@ class CardComponent {
|
|
|
1362
1352
|
additionalActionClicked() {
|
|
1363
1353
|
this.additionalAction.emit(undefined);
|
|
1364
1354
|
}
|
|
1365
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1366
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1355
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1356
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: CardComponent, isStandalone: true, selector: "mad-card", inputs: { cancelDisabled: "cancelDisabled", cancelText: "cancelText", readonly: "readonly", editText: "editText", expandable: "expandable", expanded: "expanded", saveDisabled: "saveDisabled", saveText: "saveText", title: "title", editMode: "editMode", additionalActionIcon: "additionalActionIcon", additionalActionText: "additionalActionText" }, outputs: { edit: "edit", cancel: "cancel", save: "save", additionalAction: "additionalAction" }, ngImport: i0, template: "<mat-card>\n <mat-card-header class=\"header\" *ngIf=\"title || expandable\">\n <mat-card-title-group class=\"center\">\n <mat-card-title data-cy=\"card-title\" class=\"small-title-container\">{{ title }}</mat-card-title>\n <div data-cy=\"title-buttons-block\" class=\"top-right-icons\">\n <mad-icon-button data-testid=\"collapse-btn\" (click)=\"toggleCollapse()\" *ngIf=\"expandable && !editMode\">\n <mat-icon [@rotateIcon]=\"!expanded\">keyboard_arrow_down</mat-icon>\n </mad-icon-button>\n <mad-icon-button\n data-testid=\"additional-btn\"\n (click)=\"additionalActionClicked()\"\n *ngIf=\"additionalActionIcon\"\n [title]=\"additionalActionText\"\n type=\"button\"\n >\n <mat-icon>{{ additionalActionIcon }}</mat-icon>\n </mad-icon-button>\n <mad-icon-button data-testid=\"edit-btn\" [title]=\"editText\" (click)=\"onEdit()\" *ngIf=\"!readonly && !editMode\">\n <mat-icon>create</mat-icon>\n </mad-icon-button>\n </div>\n </mat-card-title-group>\n </mat-card-header>\n <mat-card-content [@collapseExpandAnimation] *ngIf=\"expanded\">\n <ng-content></ng-content>\n </mat-card-content>\n <mat-card-actions *ngIf=\"!readonly && editMode\">\n <mad-primary-button data-testid=\"save-btn\" [title]=\"saveText\" [disabled]=\"saveDisabled\" (throttleClick)=\"onSave()\" madThrottleClick>\n {{ saveText }}\n </mad-primary-button>\n <mad-outline-button data-testid=\"cancel-btn\" [title]=\"cancelText\" [disabled]=\"cancelDisabled\" (click)=\"onCancel()\">\n {{ cancelText }}\n </mad-outline-button>\n </mat-card-actions>\n</mat-card>\n", styles: [".top-right-icons{text-align:end;width:fit-content}.center{display:flex;align-items:center}.header{height:48px}\n"], dependencies: [{ kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i1$2.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i1$2.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i1$2.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i1$2.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i1$2.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "component", type: i1$2.MatCardTitleGroup, selector: "mat-card-title-group" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconButtonComponent, selector: "mad-icon-button", inputs: ["type", "disabled", "title"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: PrimaryButtonComponent, selector: "mad-primary-button", inputs: ["type", "disabled", "title"] }, { kind: "directive", type: ThrottleClickDirective, selector: "[madThrottleClick]", inputs: ["throttleTime"], outputs: ["throttleClick"] }, { kind: "component", type: OutlineButtonComponent, selector: "mad-outline-button", inputs: ["type", "disabled", "title", "color"] }], animations: [
|
|
1367
1357
|
trigger('collapseExpandAnimation', [
|
|
1368
1358
|
transition(':enter', [
|
|
1369
1359
|
style({ opacity: 0, height: 0, overflow: 'hidden' }),
|
|
@@ -1388,7 +1378,7 @@ class CardComponent {
|
|
|
1388
1378
|
]),
|
|
1389
1379
|
] }); }
|
|
1390
1380
|
}
|
|
1391
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1381
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: CardComponent, decorators: [{
|
|
1392
1382
|
type: Component,
|
|
1393
1383
|
args: [{ selector: 'mad-card', animations: [
|
|
1394
1384
|
trigger('collapseExpandAnimation', [
|
|
@@ -1421,7 +1411,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
1421
1411
|
PrimaryButtonComponent,
|
|
1422
1412
|
ThrottleClickDirective,
|
|
1423
1413
|
OutlineButtonComponent,
|
|
1424
|
-
], template: "<mat-card>\n <mat-card-header class=\"header\" *ngIf=\"title || expandable\">\n <mat-card-title-group class=\"center\">\n <mat-card-title data-cy=\"card-title\" class=\"small-title-container\">{{ title }}</mat-card-title>\n <div data-cy=\"title-buttons-block\" class=\"top-right-icons\">\n <mad-icon-button data-testid=\"collapse-btn\" (click)=\"toggleCollapse()\" *ngIf=\"expandable && !editMode\">\n <mat-icon [@rotateIcon]=\"!expanded\">keyboard_arrow_down</mat-icon>\n </mad-icon-button>\n <mad-icon-button\n data-testid=\"additional-btn\"\n (click)=\"additionalActionClicked()\"\n *ngIf=\"additionalActionIcon\"\n [title]=\"additionalActionText\"\n type=\"button\"\n >\n <mat-icon>{{ additionalActionIcon }}</mat-icon>\n </mad-icon-button>\n <mad-icon-button data-testid=\"edit-btn\" [title]=\"editText\" (click)=\"onEdit()\" *ngIf=\"!readonly && !editMode\">\n <mat-icon>create</mat-icon>\n </mad-icon-button>\n </div>\n </mat-card-title-group>\n </mat-card-header>\n <mat-card-content [@collapseExpandAnimation] *ngIf=\"expanded\">\n <ng-content></ng-content>\n </mat-card-content>\n <mat-card-actions *ngIf=\"!readonly && editMode\">\n <mad-primary-button data-testid=\"save-btn\" [title]=\"saveText\" [disabled]=\"saveDisabled\" (throttleClick)=\"onSave()\" madThrottleClick>\n {{ saveText }}\n </mad-primary-button>\n <mad-outline-button data-testid=\"cancel-btn\" [title]=\"cancelText\" [disabled]=\"cancelDisabled\" (click)=\"onCancel()\">\n {{ cancelText }}\n </mad-outline-button>\n </mat-card-actions>\n</mat-card>\n", styles: [".top-right-icons{text-align:end;width
|
|
1414
|
+
], template: "<mat-card>\n <mat-card-header class=\"header\" *ngIf=\"title || expandable\">\n <mat-card-title-group class=\"center\">\n <mat-card-title data-cy=\"card-title\" class=\"small-title-container\">{{ title }}</mat-card-title>\n <div data-cy=\"title-buttons-block\" class=\"top-right-icons\">\n <mad-icon-button data-testid=\"collapse-btn\" (click)=\"toggleCollapse()\" *ngIf=\"expandable && !editMode\">\n <mat-icon [@rotateIcon]=\"!expanded\">keyboard_arrow_down</mat-icon>\n </mad-icon-button>\n <mad-icon-button\n data-testid=\"additional-btn\"\n (click)=\"additionalActionClicked()\"\n *ngIf=\"additionalActionIcon\"\n [title]=\"additionalActionText\"\n type=\"button\"\n >\n <mat-icon>{{ additionalActionIcon }}</mat-icon>\n </mad-icon-button>\n <mad-icon-button data-testid=\"edit-btn\" [title]=\"editText\" (click)=\"onEdit()\" *ngIf=\"!readonly && !editMode\">\n <mat-icon>create</mat-icon>\n </mad-icon-button>\n </div>\n </mat-card-title-group>\n </mat-card-header>\n <mat-card-content [@collapseExpandAnimation] *ngIf=\"expanded\">\n <ng-content></ng-content>\n </mat-card-content>\n <mat-card-actions *ngIf=\"!readonly && editMode\">\n <mad-primary-button data-testid=\"save-btn\" [title]=\"saveText\" [disabled]=\"saveDisabled\" (throttleClick)=\"onSave()\" madThrottleClick>\n {{ saveText }}\n </mad-primary-button>\n <mad-outline-button data-testid=\"cancel-btn\" [title]=\"cancelText\" [disabled]=\"cancelDisabled\" (click)=\"onCancel()\">\n {{ cancelText }}\n </mad-outline-button>\n </mat-card-actions>\n</mat-card>\n", styles: [".top-right-icons{text-align:end;width:fit-content}.center{display:flex;align-items:center}.header{height:48px}\n"] }]
|
|
1425
1415
|
}], propDecorators: { cancelDisabled: [{
|
|
1426
1416
|
type: Input
|
|
1427
1417
|
}], cancelText: [{
|
|
@@ -1457,11 +1447,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
1457
1447
|
}] } });
|
|
1458
1448
|
|
|
1459
1449
|
class ThrottleClickModule {
|
|
1460
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1461
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
1462
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
1450
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ThrottleClickModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1451
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ThrottleClickModule, imports: [CommonModule, ThrottleClickDirective], exports: [ThrottleClickDirective] }); }
|
|
1452
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ThrottleClickModule, imports: [CommonModule] }); }
|
|
1463
1453
|
}
|
|
1464
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1454
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ThrottleClickModule, decorators: [{
|
|
1465
1455
|
type: NgModule,
|
|
1466
1456
|
args: [{
|
|
1467
1457
|
imports: [CommonModule, ThrottleClickDirective],
|
|
@@ -1470,11 +1460,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
1470
1460
|
}] });
|
|
1471
1461
|
|
|
1472
1462
|
class CardModule {
|
|
1473
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1474
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
1475
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
1463
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: CardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1464
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: CardModule, imports: [CommonModule, MatCardModule, MatIconModule, ButtonModule, MatButtonModule, ThrottleClickModule, CardComponent], exports: [CardComponent] }); }
|
|
1465
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: CardModule, imports: [CommonModule, MatCardModule, MatIconModule, ButtonModule, MatButtonModule, ThrottleClickModule, CardComponent] }); }
|
|
1476
1466
|
}
|
|
1477
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1467
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: CardModule, decorators: [{
|
|
1478
1468
|
type: NgModule,
|
|
1479
1469
|
args: [{
|
|
1480
1470
|
imports: [CommonModule, MatCardModule, MatIconModule, ButtonModule, MatButtonModule, ThrottleClickModule, CardComponent],
|
|
@@ -1567,10 +1557,10 @@ class BaseQuickListComponent {
|
|
|
1567
1557
|
}
|
|
1568
1558
|
return null;
|
|
1569
1559
|
}
|
|
1570
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1571
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1560
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: BaseQuickListComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1561
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: BaseQuickListComponent, isStandalone: true, selector: "mad-base-quick-list", inputs: { allItems: "allItems", addLabel: "addLabel", addPossible: "addPossible", removePossible: "removePossible", blankItem: "blankItem", readonly: "readonly", maxItems: "maxItems", minItems: "minItems", formArray: "formArray" }, outputs: { added: "added", removed: "removed" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: TemplateRef, descendants: true }], viewQueries: [{ propertyName: "itemRows", predicate: ["row"], descendants: true }], ngImport: i0, template: '', isInline: true }); }
|
|
1572
1562
|
}
|
|
1573
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1563
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: BaseQuickListComponent, decorators: [{
|
|
1574
1564
|
type: Component,
|
|
1575
1565
|
args: [{ selector: 'mad-base-quick-list', template: '', standalone: true }]
|
|
1576
1566
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.FormBuilder }], propDecorators: { allItems: [{
|
|
@@ -1609,19 +1599,12 @@ class QuickListCompactComponent extends BaseQuickListComponent {
|
|
|
1609
1599
|
this.changeDetectorRef = changeDetectorRef;
|
|
1610
1600
|
this.formBuilder = formBuilder;
|
|
1611
1601
|
}
|
|
1612
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1613
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1602
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: QuickListCompactComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1603
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: QuickListCompactComponent, isStandalone: true, selector: "mad-quick-list-compact", usesInheritance: true, ngImport: i0, template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n<ng-container *ngFor=\"let item of allItems; let isLast = last\">\n <div class=\"flex-container\" *ngIf=\"itemTemplate\" #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n <mad-icon-button data-cy=\"delete-item-button\" *ngIf=\"!readonly && isDeleteAllowed()\" (click)=\"removeItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n <mad-icon-button data-cy=\"add-item-button\" *ngIf=\"!readonly && isLast\" [disabled]=\"!isAddAllowed()\" (click)=\"addItem()\">\n <mat-icon>add_circle_outline</mat-icon>\n </mad-icon-button>\n </div>\n</ng-container>\n<mad-link-button\n data-cy=\"add-first-item-button\"\n *ngIf=\"!readonly && !this.allItems.length\"\n (click)=\"addItem()\"\n [disabled]=\"!isAddAllowed()\"\n>\n {{ addLabel }}\n</mad-link-button>\n", dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconButtonComponent, selector: "mad-icon-button", inputs: ["type", "disabled", "title"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: LinkButtonComponent, selector: "mad-link-button", inputs: ["type", "disabled", "title"] }] }); }
|
|
1614
1604
|
}
|
|
1615
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1605
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: QuickListCompactComponent, decorators: [{
|
|
1616
1606
|
type: Component,
|
|
1617
|
-
args: [{ selector: 'mad-quick-list-compact', standalone: true, imports: [
|
|
1618
|
-
NgFor,
|
|
1619
|
-
NgIf,
|
|
1620
|
-
NgTemplateOutlet,
|
|
1621
|
-
IconButtonComponent,
|
|
1622
|
-
MatIconModule,
|
|
1623
|
-
LinkButtonComponent,
|
|
1624
|
-
], template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n<ng-container *ngFor=\"let item of allItems; let isLast = last\">\n <div class=\"flex-container\" *ngIf=\"itemTemplate\" #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n <mad-icon-button data-cy=\"delete-item-button\" *ngIf=\"!readonly && isDeleteAllowed()\" (click)=\"removeItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n <mad-icon-button data-cy=\"add-item-button\" *ngIf=\"!readonly && isLast\" [disabled]=\"!isAddAllowed()\" (click)=\"addItem()\">\n <mat-icon>add_circle_outline</mat-icon>\n </mad-icon-button>\n </div>\n</ng-container>\n<mad-link-button data-cy=\"add-first-item-button\" *ngIf=\"!readonly && !this.allItems.length\" (click)=\"addItem()\" [disabled]=\"!isAddAllowed()\">\n {{ addLabel }}\n</mad-link-button>\n" }]
|
|
1607
|
+
args: [{ selector: 'mad-quick-list-compact', standalone: true, imports: [NgFor, NgIf, NgTemplateOutlet, IconButtonComponent, MatIconModule, LinkButtonComponent], template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n<ng-container *ngFor=\"let item of allItems; let isLast = last\">\n <div class=\"flex-container\" *ngIf=\"itemTemplate\" #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n <mad-icon-button data-cy=\"delete-item-button\" *ngIf=\"!readonly && isDeleteAllowed()\" (click)=\"removeItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n <mad-icon-button data-cy=\"add-item-button\" *ngIf=\"!readonly && isLast\" [disabled]=\"!isAddAllowed()\" (click)=\"addItem()\">\n <mat-icon>add_circle_outline</mat-icon>\n </mad-icon-button>\n </div>\n</ng-container>\n<mad-link-button\n data-cy=\"add-first-item-button\"\n *ngIf=\"!readonly && !this.allItems.length\"\n (click)=\"addItem()\"\n [disabled]=\"!isAddAllowed()\"\n>\n {{ addLabel }}\n</mad-link-button>\n" }]
|
|
1625
1608
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.FormBuilder }] });
|
|
1626
1609
|
|
|
1627
1610
|
// Based on https://github.com/porscheinformatik/clarity-addons/blob/master/src/clr-addons/generic-quick-list/generic-quick-list.ts
|
|
@@ -1631,10 +1614,10 @@ class QuickListComponent extends BaseQuickListComponent {
|
|
|
1631
1614
|
this.changeDetectorRef = changeDetectorRef;
|
|
1632
1615
|
this.formBuilder = formBuilder;
|
|
1633
1616
|
}
|
|
1634
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1635
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1617
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: QuickListComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1618
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: QuickListComponent, isStandalone: true, selector: "mad-quick-list", usesInheritance: true, ngImport: i0, template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n<ng-container *ngFor=\"let item of allItems\">\n <div *ngIf=\"itemTemplate\" #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n <mad-icon-button data-cy=\"delete-item-button\" *ngIf=\"!readonly && isDeleteAllowed()\" (click)=\"removeItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n </div>\n</ng-container>\n<mad-outline-button data-cy=\"add-item-button\" *ngIf=\"!readonly\" (click)=\"addItem()\" [disabled]=\"!addPossible || !isAddAllowed()\">\n {{ addLabel }}\n</mad-outline-button>\n", dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconButtonComponent, selector: "mad-icon-button", inputs: ["type", "disabled", "title"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: OutlineButtonComponent, selector: "mad-outline-button", inputs: ["type", "disabled", "title", "color"] }] }); }
|
|
1636
1619
|
}
|
|
1637
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1620
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: QuickListComponent, decorators: [{
|
|
1638
1621
|
type: Component,
|
|
1639
1622
|
args: [{ selector: 'mad-quick-list', standalone: true, imports: [NgFor, NgIf, NgTemplateOutlet, IconButtonComponent, MatIconModule, OutlineButtonComponent], template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n<ng-container *ngFor=\"let item of allItems\">\n <div *ngIf=\"itemTemplate\" #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n <mad-icon-button data-cy=\"delete-item-button\" *ngIf=\"!readonly && isDeleteAllowed()\" (click)=\"removeItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n </div>\n</ng-container>\n<mad-outline-button data-cy=\"add-item-button\" *ngIf=\"!readonly\" (click)=\"addItem()\" [disabled]=\"!addPossible || !isAddAllowed()\">\n {{ addLabel }}\n</mad-outline-button>\n" }]
|
|
1640
1623
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.FormBuilder }] });
|
|
@@ -1645,19 +1628,12 @@ class ReactiveFormQuickListComponent extends BaseQuickListComponent {
|
|
|
1645
1628
|
this.changeDetectorRef = changeDetectorRef;
|
|
1646
1629
|
this.formBuilder = formBuilder;
|
|
1647
1630
|
}
|
|
1648
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1649
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1631
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ReactiveFormQuickListComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1632
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: ReactiveFormQuickListComponent, isStandalone: true, selector: "mad-reactive-form-quick-list", usesInheritance: true, ngImport: i0, template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n<ng-container *ngFor=\"let item of formArray.controls\">\n <div *ngIf=\"itemTemplate\" #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n <mad-icon-button data-cy=\"delete-item-button\" *ngIf=\"!readonly && isDeleteReactiveAllowed()\" (click)=\"removeReactiveItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n </div>\n</ng-container>\n\n<mad-outline-button data-cy=\"add-item-button\" *ngIf=\"!readonly\" (click)=\"addReactiveItem()\" [disabled]=\"!isAddReactiveAllowed()\">\n {{ addLabel }}\n</mad-outline-button>\n", dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconButtonComponent, selector: "mad-icon-button", inputs: ["type", "disabled", "title"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: OutlineButtonComponent, selector: "mad-outline-button", inputs: ["type", "disabled", "title", "color"] }] }); }
|
|
1650
1633
|
}
|
|
1651
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1634
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ReactiveFormQuickListComponent, decorators: [{
|
|
1652
1635
|
type: Component,
|
|
1653
|
-
args: [{ selector: 'mad-reactive-form-quick-list', standalone: true, imports: [
|
|
1654
|
-
NgFor,
|
|
1655
|
-
NgIf,
|
|
1656
|
-
NgTemplateOutlet,
|
|
1657
|
-
IconButtonComponent,
|
|
1658
|
-
MatIconModule,
|
|
1659
|
-
OutlineButtonComponent,
|
|
1660
|
-
], template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n<ng-container *ngFor=\"let item of formArray.controls\">\n <div *ngIf=\"itemTemplate\" #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n <mad-icon-button data-cy=\"delete-item-button\" *ngIf=\"!readonly && isDeleteReactiveAllowed()\" (click)=\"removeReactiveItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n </div>\n</ng-container>\n\n<mad-outline-button data-cy=\"add-item-button\" *ngIf=\"!readonly\" (click)=\"addReactiveItem()\" [disabled]=\"!isAddReactiveAllowed()\">\n {{ addLabel }}\n</mad-outline-button>\n" }]
|
|
1636
|
+
args: [{ selector: 'mad-reactive-form-quick-list', standalone: true, imports: [NgFor, NgIf, NgTemplateOutlet, IconButtonComponent, MatIconModule, OutlineButtonComponent], template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n<ng-container *ngFor=\"let item of formArray.controls\">\n <div *ngIf=\"itemTemplate\" #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n <mad-icon-button data-cy=\"delete-item-button\" *ngIf=\"!readonly && isDeleteReactiveAllowed()\" (click)=\"removeReactiveItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n </div>\n</ng-container>\n\n<mad-outline-button data-cy=\"add-item-button\" *ngIf=\"!readonly\" (click)=\"addReactiveItem()\" [disabled]=\"!isAddReactiveAllowed()\">\n {{ addLabel }}\n</mad-outline-button>\n" }]
|
|
1661
1637
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.FormBuilder }] });
|
|
1662
1638
|
|
|
1663
1639
|
class ReactiveFormQuickListCompactComponent extends BaseQuickListComponent {
|
|
@@ -1666,24 +1642,17 @@ class ReactiveFormQuickListCompactComponent extends BaseQuickListComponent {
|
|
|
1666
1642
|
this.changeDetectorRef = changeDetectorRef;
|
|
1667
1643
|
this.formBuilder = formBuilder;
|
|
1668
1644
|
}
|
|
1669
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1670
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1645
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ReactiveFormQuickListCompactComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1646
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: ReactiveFormQuickListCompactComponent, isStandalone: true, selector: "mad-reactive-form-quick-list-compact", usesInheritance: true, ngImport: i0, template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n<ng-container *ngFor=\"let item of formArray.controls; let isLast = last\">\n <div *ngIf=\"itemTemplate\" #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n <mad-icon-button data-cy=\"delete-item-button\" *ngIf=\"!readonly && isDeleteReactiveAllowed()\" (click)=\"removeReactiveItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n <mad-icon-button data-cy=\"add-item-button\" *ngIf=\"!readonly && isLast\" [disabled]=\"!isAddReactiveAllowed()\" (click)=\"addReactiveItem()\">\n <mat-icon>add_circle_outline</mat-icon>\n </mad-icon-button>\n </div>\n</ng-container>\n<mad-link-button\n data-cy=\"add-first-item-button\"\n *ngIf=\"!readonly && !this.formArray?.controls.length\"\n (click)=\"addReactiveItem()\"\n [disabled]=\"!isAddReactiveAllowed()\"\n>\n {{ addLabel }}\n</mad-link-button>\n", dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconButtonComponent, selector: "mad-icon-button", inputs: ["type", "disabled", "title"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: LinkButtonComponent, selector: "mad-link-button", inputs: ["type", "disabled", "title"] }] }); }
|
|
1671
1647
|
}
|
|
1672
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1648
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ReactiveFormQuickListCompactComponent, decorators: [{
|
|
1673
1649
|
type: Component,
|
|
1674
|
-
args: [{ selector: 'mad-reactive-form-quick-list-compact', standalone: true, imports: [
|
|
1675
|
-
NgFor,
|
|
1676
|
-
NgIf,
|
|
1677
|
-
NgTemplateOutlet,
|
|
1678
|
-
IconButtonComponent,
|
|
1679
|
-
MatIconModule,
|
|
1680
|
-
LinkButtonComponent,
|
|
1681
|
-
], template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n<ng-container *ngFor=\"let item of formArray.controls; let isLast = last\">\n <div *ngIf=\"itemTemplate\" #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n <mad-icon-button data-cy=\"delete-item-button\" *ngIf=\"!readonly && isDeleteReactiveAllowed()\" (click)=\"removeReactiveItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n <mad-icon-button data-cy=\"add-item-button\" *ngIf=\"!readonly && isLast\" [disabled]=\"!isAddReactiveAllowed()\" (click)=\"addReactiveItem()\">\n <mat-icon>add_circle_outline</mat-icon>\n </mad-icon-button>\n </div>\n</ng-container>\n<mad-link-button data-cy=\"add-first-item-button\" *ngIf=\"!readonly && !this.formArray?.controls.length\" (click)=\"addReactiveItem()\" [disabled]=\"!isAddReactiveAllowed()\">\n {{ addLabel }}\n</mad-link-button>\n" }]
|
|
1650
|
+
args: [{ selector: 'mad-reactive-form-quick-list-compact', standalone: true, imports: [NgFor, NgIf, NgTemplateOutlet, IconButtonComponent, MatIconModule, LinkButtonComponent], template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n<ng-container *ngFor=\"let item of formArray.controls; let isLast = last\">\n <div *ngIf=\"itemTemplate\" #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n <mad-icon-button data-cy=\"delete-item-button\" *ngIf=\"!readonly && isDeleteReactiveAllowed()\" (click)=\"removeReactiveItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n <mad-icon-button data-cy=\"add-item-button\" *ngIf=\"!readonly && isLast\" [disabled]=\"!isAddReactiveAllowed()\" (click)=\"addReactiveItem()\">\n <mat-icon>add_circle_outline</mat-icon>\n </mad-icon-button>\n </div>\n</ng-container>\n<mad-link-button\n data-cy=\"add-first-item-button\"\n *ngIf=\"!readonly && !this.formArray?.controls.length\"\n (click)=\"addReactiveItem()\"\n [disabled]=\"!isAddReactiveAllowed()\"\n>\n {{ addLabel }}\n</mad-link-button>\n" }]
|
|
1682
1651
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.FormBuilder }] });
|
|
1683
1652
|
|
|
1684
1653
|
class QuickListModule {
|
|
1685
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1686
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
1654
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: QuickListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1655
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: QuickListModule, imports: [CommonModule,
|
|
1687
1656
|
MatButtonModule,
|
|
1688
1657
|
MatIconModule,
|
|
1689
1658
|
ButtonModule,
|
|
@@ -1697,7 +1666,7 @@ class QuickListModule {
|
|
|
1697
1666
|
BaseQuickListComponent,
|
|
1698
1667
|
ReactiveFormQuickListComponent,
|
|
1699
1668
|
ReactiveFormQuickListCompactComponent] }); }
|
|
1700
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
1669
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: QuickListModule, imports: [CommonModule,
|
|
1701
1670
|
MatButtonModule,
|
|
1702
1671
|
MatIconModule,
|
|
1703
1672
|
ButtonModule,
|
|
@@ -1707,7 +1676,7 @@ class QuickListModule {
|
|
|
1707
1676
|
ReactiveFormQuickListComponent,
|
|
1708
1677
|
ReactiveFormQuickListCompactComponent] }); }
|
|
1709
1678
|
}
|
|
1710
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1679
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: QuickListModule, decorators: [{
|
|
1711
1680
|
type: NgModule,
|
|
1712
1681
|
args: [{
|
|
1713
1682
|
imports: [
|
|
@@ -1805,10 +1774,10 @@ class TableComponent {
|
|
|
1805
1774
|
isClickOnRowMenuIcon(event) {
|
|
1806
1775
|
return event?.target?.classList.contains('mat-icon');
|
|
1807
1776
|
}
|
|
1808
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1809
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1777
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1778
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: TableComponent, isStandalone: true, selector: "mad-table", inputs: { columns: "columns", filterLabel: "filterLabel", filterPlaceholder: "filterPlaceholder", noDataText: "noDataText", pageSizeOptions: "pageSizeOptions", defaultPageSize: "defaultPageSize", rowActions: "rowActions", tableActions: "tableActions", displayedData: "displayedData", paginationEnabled: "paginationEnabled", filterEnabled: "filterEnabled" }, outputs: { tableAction: "tableAction", rowAction: "rowAction", sortEvent: "sortEvent" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }], ngImport: i0, template: "<!-- Table actions -->\n<div *ngIf=\"tableActions?.length\">\n <mad-primary-button class=\"table-action\" *ngFor=\"let tableAction of tableActions\" (click)=\"onTableAction(tableAction)\">\n {{ tableAction.label }}\n </mad-primary-button>\n</div>\n\n<!-- Row action buttons -->\n<mat-menu #menu=\"matMenu\">\n <ng-template matMenuContent let-element=\"element\">\n <button *ngFor=\"let rowAction of rowActions\" mat-menu-item class=\"row-action\" (click)=\"onRowEvent($event, element, rowAction)\">\n {{ rowAction.label }}\n </button>\n </ng-template>\n</mat-menu>\n\n<!-- Table filter -->\n<mat-form-field *ngIf=\"isFilterEnabled\">\n <mat-label>{{ filterLabel }}</mat-label>\n <input matInput (keyup)=\"onFilter($event?.target?.value)\" placeholder=\"{{ filterPlaceholder }}\" />\n</mat-form-field>\n\n<!-- Table -->\n<div *ngIf=\"dataSource?.data?.length > 0; else noData\" class=\"mad-table\">\n <table mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"onSortingEvent($event)\">\n <!-- Row actions column -->\n <ng-container [matColumnDef]=\"ACTION_COLUMN_NAME\" *ngIf=\"rowActions?.length\" sticky>\n <th mat-header-cell *matHeaderCellDef class=\"row-action-button\"></th>\n <td mat-cell *matCellDef=\"let element\" class=\"row-action-button\">\n <mad-icon-button [matMenuTriggerData]=\"{ element: element }\" [matMenuTriggerFor]=\"menu\">\n <mat-icon>more_vert</mat-icon>\n </mad-icon-button>\n </td>\n </ng-container>\n <!-- Columns with data -->\n <ng-container *ngFor=\"let column of columns\" [matColumnDef]=\"column.label\" [sticky]=\"column.isSticky\">\n <ng-container *ngIf=\"column.isSortable; else noSort\">\n <th\n mat-header-cell\n *matHeaderCellDef\n mat-sort-header=\"{{ column.label }}\"\n [arrowPosition]=\"column.isRightAligned ? 'before' : 'after'\"\n [class.text-right]=\"column.isRightAligned\"\n >\n {{ column.label }}\n </th>\n </ng-container>\n <ng-template #noSort>\n <th mat-header-cell *matHeaderCellDef [class.text-right]=\"column.isRightAligned\">\n {{ column.label }}\n </th>\n </ng-template>\n <td mat-cell *matCellDef=\"let element\" [class.text-right]=\"column.isRightAligned\">\n {{ element[column.dataPropertyName] }}\n </td>\n </ng-container>\n <tr mat-header-row *matHeaderRowDef=\"columnNames\"></tr>\n <tr\n mat-row\n [class.clickable-table-row]=\"isRowClickable\"\n (click)=\"onRowEvent($event, row)\"\n *matRowDef=\"let row; columns: columnNames\"\n ></tr>\n </table>\n</div>\n<!-- Pagination -->\n<mat-paginator\n [style.display]=\"isPaginationEnabled ? 'block' : 'none'\"\n [pageSize]=\"defaultPageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n showFirstLastButtons\n>\n</mat-paginator>\n\n<!-- No data alert -->\n<ng-template #noData>\n <div class=\"noDataText\">\n {{ noDataText }}\n </div>\n</ng-template>\n", styles: [".text-right{text-align:right!important}.table-action{margin-right:.5em;margin-bottom:.5em}.row-action-button{width:10px}.noDataText{width:100%;text-align:center}.mad-table{width:100%;overflow-x:auto}\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: PrimaryButtonComponent, selector: "mad-primary-button", inputs: ["type", "disabled", "title"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i1$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$3.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i1$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i9.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i9.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i9.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i9.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i9.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i9.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i9.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i9.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i9.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i9.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i5.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i5.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: IconButtonComponent, selector: "mad-icon-button", inputs: ["type", "disabled", "title"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i7.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }] }); }
|
|
1810
1779
|
}
|
|
1811
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1780
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: TableComponent, decorators: [{
|
|
1812
1781
|
type: Component,
|
|
1813
1782
|
args: [{ selector: 'mad-table', standalone: true, imports: [
|
|
1814
1783
|
NgIf,
|
|
@@ -1860,8 +1829,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
1860
1829
|
}] } });
|
|
1861
1830
|
|
|
1862
1831
|
class TableModule {
|
|
1863
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1864
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
1832
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: TableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1833
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: TableModule, imports: [CommonModule,
|
|
1865
1834
|
MatButtonModule,
|
|
1866
1835
|
MatIconModule,
|
|
1867
1836
|
MatFormFieldModule,
|
|
@@ -1872,7 +1841,7 @@ class TableModule {
|
|
|
1872
1841
|
MatTableModule,
|
|
1873
1842
|
ButtonModule,
|
|
1874
1843
|
TableComponent], exports: [TableComponent] }); }
|
|
1875
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
1844
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: TableModule, imports: [CommonModule,
|
|
1876
1845
|
MatButtonModule,
|
|
1877
1846
|
MatIconModule,
|
|
1878
1847
|
MatFormFieldModule,
|
|
@@ -1884,7 +1853,7 @@ class TableModule {
|
|
|
1884
1853
|
ButtonModule,
|
|
1885
1854
|
TableComponent] }); }
|
|
1886
1855
|
}
|
|
1887
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1856
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: TableModule, decorators: [{
|
|
1888
1857
|
type: NgModule,
|
|
1889
1858
|
args: [{
|
|
1890
1859
|
imports: [
|
|
@@ -1980,12 +1949,12 @@ class DataTableColumnsModalComponent {
|
|
|
1980
1949
|
this.searchFilter = '';
|
|
1981
1950
|
this.filteredAvailableColumns = [...this.availableColumns];
|
|
1982
1951
|
}
|
|
1983
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1984
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1952
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableColumnsModalComponent, deps: [{ token: i1$4.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1953
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: DataTableColumnsModalComponent, isStandalone: true, selector: "mad-data-table-columns-modal.component", ngImport: i0, template: "<h1 mat-dialog-title>{{ data.titleLabel | translate }}</h1>\n<div mat-dialog-content>\n <div class=\"column-drag-main-content\">\n <div class=\"column-drag-container\">\n <div class=\"column-drag-info-area\">{{ data.infoTextLabel | translate }}</div>\n <div class=\"column-drag-container-header\">{{ data.selectedLabel | translate }}</div>\n <div\n cdkDropList\n #selectedList=\"cdkDropList\"\n [cdkDropListData]=\"selectedColumns\"\n [cdkDropListConnectedTo]=\"[availableList]\"\n class=\"column-drag-list selected-drag-list\"\n (cdkDropListDropped)=\"onDrop($event)\"\n >\n <div class=\"column-drag-box\" *ngFor=\"let selectedColumn of selectedColumns; let i = index\" cdkDrag [id]=\"selectedColumn.id\">\n {{ i + 1 }}. {{ selectedColumn.label | translate }}\n </div>\n </div>\n </div>\n\n <div class=\"column-drag-container\">\n <div class=\"column-drag-info-area\">\n <!-- Table filter -->\n <mat-form-field>\n <mat-label>{{ data.filterColumnsLabel | translate }}</mat-label>\n <input\n matInput\n autocomplete=\"off\"\n (keyup)=\"updateFilterValue()\"\n placeholder=\"{{ data.filterColumnsPlaceHolder | translate }}\"\n [(ngModel)]=\"searchFilter\"\n />\n <button *ngIf=\"searchFilter\" matSuffix mat-icon-button aria-label=\"Clear\" (click)=\"clearFilterValue()\">\n <mat-icon>close</mat-icon>\n </button>\n </mat-form-field>\n </div>\n <div class=\"column-drag-container-header\">{{ data.availableLabel | translate }}</div>\n <div\n cdkDropList\n cdkDropListSortingDisabled\n #availableList=\"cdkDropList\"\n [cdkDropListData]=\"availableColumns\"\n [cdkDropListConnectedTo]=\"[selectedList]\"\n class=\"column-drag-list\"\n (cdkDropListDropped)=\"onDrop($event)\"\n >\n <div *ngFor=\"let availableColumn of filteredAvailableColumns\" class=\"column-drag-box\" cdkDrag [id]=\"availableColumn.id\">\n {{ availableColumn.label }}\n </div>\n </div>\n </div>\n </div>\n</div>\n<div mat-dialog-actions [align]=\"'end'\">\n <mad-outline-button (click)=\"onCancel()\">\n {{ data.cancelLabel | translate }}\n </mad-outline-button>\n <mad-danger-button *ngIf=\"data.deleteDefinitionAllowed\" (click)=\"onDelete()\">\n {{ data.deleteLabel | translate }}\n </mad-danger-button>\n <mad-primary-button (click)=\"onSave()\" [disabled]=\"!((this.selectedColumns.length || 0) > 0)\">\n {{ data.saveLabel | translate }}\n </mad-primary-button>\n</div>\n", styles: [".column-drag-main-content{display:flex;flex-direction:row;width:544px;justify-content:space-between;padding:8px 8px 16px;margin-bottom:16px;border-bottom:1px solid whitesmoke}.column-drag-container{width:256px;max-width:100%;display:inline-block;vertical-align:top;font-size:small}.info-box{width:100%;font-size:small;margin-bottom:16px;color:#000000a8}.column-drag-info-area{width:100%;height:36px;margin-bottom:32px;color:#000000a8;font-size:small;display:flex;justify-content:right;align-items:stretch;flex-direction:column}.column-drag-list{border:solid 1px #ccc;height:200px;box-sizing:border-box;background:#fff;border-radius:4px;overflow:auto;display:block}.column-drag-container-header{font-weight:700;margin-bottom:4px}.column-drag-box{padding:12px 10px;border-bottom:solid 1px #ccc;color:#000000de;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;height:40px;cursor:move;background:#fff;font-size:14px}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.column-drag-box:last-child{border:none}.column-drag-list.cdk-drop-list-dragging .column-drag-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i3$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i3$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: PrimaryButtonComponent, selector: "mad-primary-button", inputs: ["type", "disabled", "title"] }, { kind: "component", type: OutlineButtonComponent, selector: "mad-outline-button", inputs: ["type", "disabled", "title", "color"] }, { kind: "component", type: DangerButtonComponent, selector: "mad-danger-button", inputs: ["type", "disabled", "title"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$5.TranslatePipe, name: "translate" }] }); }
|
|
1985
1954
|
}
|
|
1986
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1955
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableColumnsModalComponent, decorators: [{
|
|
1987
1956
|
type: Component,
|
|
1988
|
-
args: [{ selector: 'mad-data-table-columns-modal.component', standalone: true, imports: [CommonModule, DragDropModule, MatFormFieldModule, MatIconModule, FormsModule, ButtonModule, TranslateModule], template: "<h1 mat-dialog-title>{{ data.titleLabel | translate }}</h1>\n<div mat-dialog-content>\n <div class=\"column-drag-main-content\">\n <div class=\"column-drag-container\">\n <div class=\"column-drag-info-area\">{{ data.infoTextLabel | translate }}</div>\n <div class=\"column-drag-container-header\">{{ data.selectedLabel | translate }}</div>\n <div\n cdkDropList\n #selectedList=\"cdkDropList\"\n [cdkDropListData]=\"selectedColumns\"\n [cdkDropListConnectedTo]=\"[availableList]\"\n class=\"column-drag-list selected-drag-list\"\n (cdkDropListDropped)=\"onDrop($event)\"\n >\n <div class=\"column-drag-box\" *ngFor=\"let selectedColumn of selectedColumns; let i = index\" cdkDrag [id]=\"selectedColumn.id\">\n {{ i + 1 }}. {{ selectedColumn.label | translate }}\n </div>\n </div>\n </div>\n\n <div class=\"column-drag-container\">\n <div class=\"column-drag-info-area\">\n <!-- Table filter -->\n <mat-form-field>\n <mat-label>{{ data.filterColumnsLabel | translate }}</mat-label>\n <input\n matInput\n autocomplete=\"off\"\n (keyup)=\"updateFilterValue()\"\n placeholder=\"{{ data.filterColumnsPlaceHolder | translate }}\"\n [(ngModel)]=\"searchFilter\"\n />\n <button *ngIf=\"searchFilter\" matSuffix mat-icon-button aria-label=\"Clear\" (click)=\"clearFilterValue()\">\n <mat-icon>close</mat-icon>\n </button>\n </mat-form-field>\n </div>\n <div class=\"column-drag-container-header\">{{ data.availableLabel | translate }}</div>\n <div\n cdkDropList\n cdkDropListSortingDisabled\n #availableList=\"cdkDropList\"\n [cdkDropListData]=\"availableColumns\"\n [cdkDropListConnectedTo]=\"[selectedList]\"\n class=\"column-drag-list\"\n (cdkDropListDropped)=\"onDrop($event)\"\n >\n <div *ngFor=\"let availableColumn of filteredAvailableColumns\" class=\"column-drag-box\" cdkDrag [id]=\"availableColumn.id\">\n {{ availableColumn.label }}\n </div>\n </div>\n </div>\n </div>\n</div>\n<div mat-dialog-actions [align]=\"'end'\">\n <mad-outline-button (click)=\"onCancel()\">\n {{ data.cancelLabel | translate }}\n </mad-outline-button>\n <mad-danger-button *ngIf=\"data.deleteDefinitionAllowed\" (click)=\"onDelete()\">\n {{ data.deleteLabel | translate }}\n </mad-danger-button>\n <mad-primary-button (click)=\"onSave()\" [disabled]=\"!((this.selectedColumns.length || 0) > 0)\">\n {{ data.saveLabel | translate }}\n </mad-primary-button>\n</div>\n", styles: [".column-drag-main-content{display:flex;flex-direction:row;width:544px;justify-content:space-between;padding:8px 8px 16px;margin-bottom:16px;border-bottom:1px solid whitesmoke}.column-drag-container{width:256px;max-width:100%;display:inline-block;vertical-align:top;font-size:small}.info-box{width:100%;font-size:small;margin-bottom:16px;color:#000000a8}.column-drag-info-area{width:100%;height:36px;margin-bottom:32px;color:#000000a8;font-size:small;display:flex;justify-content:right;align-items:stretch;flex-direction:column}.column-drag-list{border:solid 1px #ccc;height:200px;box-sizing:border-box;background
|
|
1957
|
+
args: [{ selector: 'mad-data-table-columns-modal.component', standalone: true, imports: [CommonModule, DragDropModule, MatFormFieldModule, MatIconModule, FormsModule, ButtonModule, TranslateModule], template: "<h1 mat-dialog-title>{{ data.titleLabel | translate }}</h1>\n<div mat-dialog-content>\n <div class=\"column-drag-main-content\">\n <div class=\"column-drag-container\">\n <div class=\"column-drag-info-area\">{{ data.infoTextLabel | translate }}</div>\n <div class=\"column-drag-container-header\">{{ data.selectedLabel | translate }}</div>\n <div\n cdkDropList\n #selectedList=\"cdkDropList\"\n [cdkDropListData]=\"selectedColumns\"\n [cdkDropListConnectedTo]=\"[availableList]\"\n class=\"column-drag-list selected-drag-list\"\n (cdkDropListDropped)=\"onDrop($event)\"\n >\n <div class=\"column-drag-box\" *ngFor=\"let selectedColumn of selectedColumns; let i = index\" cdkDrag [id]=\"selectedColumn.id\">\n {{ i + 1 }}. {{ selectedColumn.label | translate }}\n </div>\n </div>\n </div>\n\n <div class=\"column-drag-container\">\n <div class=\"column-drag-info-area\">\n <!-- Table filter -->\n <mat-form-field>\n <mat-label>{{ data.filterColumnsLabel | translate }}</mat-label>\n <input\n matInput\n autocomplete=\"off\"\n (keyup)=\"updateFilterValue()\"\n placeholder=\"{{ data.filterColumnsPlaceHolder | translate }}\"\n [(ngModel)]=\"searchFilter\"\n />\n <button *ngIf=\"searchFilter\" matSuffix mat-icon-button aria-label=\"Clear\" (click)=\"clearFilterValue()\">\n <mat-icon>close</mat-icon>\n </button>\n </mat-form-field>\n </div>\n <div class=\"column-drag-container-header\">{{ data.availableLabel | translate }}</div>\n <div\n cdkDropList\n cdkDropListSortingDisabled\n #availableList=\"cdkDropList\"\n [cdkDropListData]=\"availableColumns\"\n [cdkDropListConnectedTo]=\"[selectedList]\"\n class=\"column-drag-list\"\n (cdkDropListDropped)=\"onDrop($event)\"\n >\n <div *ngFor=\"let availableColumn of filteredAvailableColumns\" class=\"column-drag-box\" cdkDrag [id]=\"availableColumn.id\">\n {{ availableColumn.label }}\n </div>\n </div>\n </div>\n </div>\n</div>\n<div mat-dialog-actions [align]=\"'end'\">\n <mad-outline-button (click)=\"onCancel()\">\n {{ data.cancelLabel | translate }}\n </mad-outline-button>\n <mad-danger-button *ngIf=\"data.deleteDefinitionAllowed\" (click)=\"onDelete()\">\n {{ data.deleteLabel | translate }}\n </mad-danger-button>\n <mad-primary-button (click)=\"onSave()\" [disabled]=\"!((this.selectedColumns.length || 0) > 0)\">\n {{ data.saveLabel | translate }}\n </mad-primary-button>\n</div>\n", styles: [".column-drag-main-content{display:flex;flex-direction:row;width:544px;justify-content:space-between;padding:8px 8px 16px;margin-bottom:16px;border-bottom:1px solid whitesmoke}.column-drag-container{width:256px;max-width:100%;display:inline-block;vertical-align:top;font-size:small}.info-box{width:100%;font-size:small;margin-bottom:16px;color:#000000a8}.column-drag-info-area{width:100%;height:36px;margin-bottom:32px;color:#000000a8;font-size:small;display:flex;justify-content:right;align-items:stretch;flex-direction:column}.column-drag-list{border:solid 1px #ccc;height:200px;box-sizing:border-box;background:#fff;border-radius:4px;overflow:auto;display:block}.column-drag-container-header{font-weight:700;margin-bottom:4px}.column-drag-box{padding:12px 10px;border-bottom:solid 1px #ccc;color:#000000de;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;height:40px;cursor:move;background:#fff;font-size:14px}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.column-drag-box:last-child{border:none}.column-drag-list.cdk-drop-list-dragging .column-drag-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"] }]
|
|
1989
1958
|
}], ctorParameters: () => [{ type: i1$4.MatDialogRef }, { type: undefined, decorators: [{
|
|
1990
1959
|
type: Inject,
|
|
1991
1960
|
args: [MAT_DIALOG_DATA]
|
|
@@ -2027,10 +1996,10 @@ class DataTableFilter {
|
|
|
2027
1996
|
createFilter() {
|
|
2028
1997
|
return Array.from(this.filterables.values()).reduce((result, current) => ({ ...result, [current.id]: current.filterValue }), {});
|
|
2029
1998
|
}
|
|
2030
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2031
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1999
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableFilter, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2000
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: DataTableFilter, isStandalone: true, selector: "[madFilter]", outputs: { filterChange: "madFilterChange" }, ngImport: i0 }); }
|
|
2032
2001
|
}
|
|
2033
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2002
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableFilter, decorators: [{
|
|
2034
2003
|
type: Directive,
|
|
2035
2004
|
args: [{
|
|
2036
2005
|
selector: '[madFilter]',
|
|
@@ -2063,9 +2032,10 @@ class DataTableSortUtil {
|
|
|
2063
2032
|
const stringY = String(y ?? '');
|
|
2064
2033
|
// a string could be a date
|
|
2065
2034
|
if (!!dateTimeFormat.length) {
|
|
2066
|
-
const dates = dateTimeFormat
|
|
2035
|
+
const dates = dateTimeFormat
|
|
2036
|
+
.map((it) => ({
|
|
2067
2037
|
x: DateTime.fromFormat(stringX, it),
|
|
2068
|
-
y: DateTime.fromFormat(stringY, it)
|
|
2038
|
+
y: DateTime.fromFormat(stringY, it),
|
|
2069
2039
|
}))
|
|
2070
2040
|
.find(({ x, y }) => x.isValid && y.isValid);
|
|
2071
2041
|
if (!!dates) {
|
|
@@ -2270,10 +2240,10 @@ class DataTablePersistenceService {
|
|
|
2270
2240
|
getId(tableId, key) {
|
|
2271
2241
|
return `${tableId}.${key}`;
|
|
2272
2242
|
}
|
|
2273
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2274
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
2243
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTablePersistenceService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
2244
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTablePersistenceService, providedIn: 'root' }); }
|
|
2275
2245
|
}
|
|
2276
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2246
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTablePersistenceService, decorators: [{
|
|
2277
2247
|
type: Injectable,
|
|
2278
2248
|
args: [{
|
|
2279
2249
|
providedIn: 'root',
|
|
@@ -2318,10 +2288,10 @@ class DataTableFilterDialogComponent {
|
|
|
2318
2288
|
ngOnDestroy() {
|
|
2319
2289
|
this._subscription.unsubscribe();
|
|
2320
2290
|
}
|
|
2321
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2322
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
2291
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableFilterDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2292
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: DataTableFilterDialogComponent, isStandalone: true, selector: "mad-data-table-filter-dialog", inputs: { filterOptions: "filterOptions", filterValue: "filterValue" }, outputs: { filterChanged: "filterChanged" }, ngImport: i0, template: "<div class=\"filter-dialog-box\">\n <ng-container *ngIf=\"!filterOptions?.length; else selectInput\">\n <mat-form-field class=\"filter-dialog-input\">\n <mat-label>{{ 'common.filter.term' | translate }}</mat-label>\n <input matInput type=\"text\" required=\"false\" [formControl]=\"control\" />\n </mat-form-field>\n </ng-container>\n</div>\n\n<ng-template #selectInput>\n <mat-form-field class=\"filter-dialog-input\">\n <mat-label>{{ 'common.filter.term' | translate }}</mat-label>\n <mat-select [formControl]=\"control\">\n <mat-option></mat-option>\n <mat-option *ngFor=\"let entry of filterOptions\" [value]=\"entry.key\">{{ entry.label }}</mat-option>\n </mat-select>\n </mat-form-field>\n</ng-template>\n", styles: [".container{position:relative;width:12px;height:12px;margin:5px 0 5px 5px}.overlay{position:absolute;width:12px;height:12px;background-color:#fff;display:flex;align-items:center}.mat-icon{position:relative;display:flex;align-items:center;font-size:1em;color:#757575}.filter-dialog-box{display:flex;align-items:center;width:auto;height:80px;padding:12px 12px 0;margin-top:22px;background-color:#fff;box-shadow:0 1px 3px #0000000d}.filter-dialog-input{width:auto;max-width:180px;margin:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$5.TranslatePipe, name: "translate" }] }); }
|
|
2323
2293
|
}
|
|
2324
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2294
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableFilterDialogComponent, decorators: [{
|
|
2325
2295
|
type: Component,
|
|
2326
2296
|
args: [{ selector: 'mad-data-table-filter-dialog', standalone: true, imports: [CommonModule, MatFormFieldModule, MatInputModule, MatSelectModule, FormsModule, ReactiveFormsModule, TranslateModule], template: "<div class=\"filter-dialog-box\">\n <ng-container *ngIf=\"!filterOptions?.length; else selectInput\">\n <mat-form-field class=\"filter-dialog-input\">\n <mat-label>{{ 'common.filter.term' | translate }}</mat-label>\n <input matInput type=\"text\" required=\"false\" [formControl]=\"control\" />\n </mat-form-field>\n </ng-container>\n</div>\n\n<ng-template #selectInput>\n <mat-form-field class=\"filter-dialog-input\">\n <mat-label>{{ 'common.filter.term' | translate }}</mat-label>\n <mat-select [formControl]=\"control\">\n <mat-option></mat-option>\n <mat-option *ngFor=\"let entry of filterOptions\" [value]=\"entry.key\">{{ entry.label }}</mat-option>\n </mat-select>\n </mat-form-field>\n</ng-template>\n", styles: [".container{position:relative;width:12px;height:12px;margin:5px 0 5px 5px}.overlay{position:absolute;width:12px;height:12px;background-color:#fff;display:flex;align-items:center}.mat-icon{position:relative;display:flex;align-items:center;font-size:1em;color:#757575}.filter-dialog-box{display:flex;align-items:center;width:auto;height:80px;padding:12px 12px 0;margin-top:22px;background-color:#fff;box-shadow:0 1px 3px #0000000d}.filter-dialog-input{width:auto;max-width:180px;margin:auto}\n"] }]
|
|
2327
2297
|
}], ctorParameters: () => [], propDecorators: { filterOptions: [{
|
|
@@ -2354,10 +2324,10 @@ class FilterComponent {
|
|
|
2354
2324
|
get opacity() {
|
|
2355
2325
|
return this.isActive ? '1' : this.isHovered || this.showFilterDialog ? '0.54' : '0';
|
|
2356
2326
|
}
|
|
2357
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2358
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
2327
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: FilterComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2328
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: FilterComponent, isStandalone: true, selector: "mad-data-table-filter", outputs: { filterValueChange: "filterValueChange" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"container\">\n <div class=\"overlay\" [style.opacity]=\"opacity\">\n <mat-icon fontSet=\"material-icons-outlined\" (click)=\"toggleFilter($event)\">filter_alt</mat-icon>\n </div>\n <mad-data-table-filter-dialog\n class=\"filter-dialog\"\n [filterOptions]=\"filterOptions\"\n [hidden]=\"!showFilterDialog\"\n [filterValue]=\"filterValue\"\n (filterChanged)=\"onFilterChanged($event)\"\n />\n</div>\n", styles: [".container{position:relative;width:12px;height:12px}.overlay{position:absolute;width:12px;height:12px;background-color:#fff;display:flex;align-items:center}.mat-icon{position:relative;display:flex;align-items:center;font-size:1em;color:#757575}.filter-dialog{position:absolute;margin-top:12px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: DataTableFilterDialogComponent, selector: "mad-data-table-filter-dialog", inputs: ["filterOptions", "filterValue"], outputs: ["filterChanged"] }] }); }
|
|
2359
2329
|
}
|
|
2360
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2330
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: FilterComponent, decorators: [{
|
|
2361
2331
|
type: Component,
|
|
2362
2332
|
args: [{ selector: 'mad-data-table-filter', standalone: true, imports: [CommonModule, MatIconModule, DataTableFilterDialogComponent], template: "<div class=\"container\">\n <div class=\"overlay\" [style.opacity]=\"opacity\">\n <mat-icon fontSet=\"material-icons-outlined\" (click)=\"toggleFilter($event)\">filter_alt</mat-icon>\n </div>\n <mad-data-table-filter-dialog\n class=\"filter-dialog\"\n [filterOptions]=\"filterOptions\"\n [hidden]=\"!showFilterDialog\"\n [filterValue]=\"filterValue\"\n (filterChanged)=\"onFilterChanged($event)\"\n />\n</div>\n", styles: [".container{position:relative;width:12px;height:12px}.overlay{position:absolute;width:12px;height:12px;background-color:#fff;display:flex;align-items:center}.mat-icon{position:relative;display:flex;align-items:center;font-size:1em;color:#757575}.filter-dialog{position:absolute;margin-top:12px}\n"] }]
|
|
2363
2333
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { filterValueChange: [{
|
|
@@ -2461,10 +2431,10 @@ class DataTableFilterHeader {
|
|
|
2461
2431
|
isArrowElement(nativeElement) {
|
|
2462
2432
|
return nativeElement.classList.contains('mat-sort-header-arrow');
|
|
2463
2433
|
}
|
|
2464
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2465
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
2434
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableFilterHeader, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i0.Renderer2 }, { token: DataTableFilter, optional: true }, { token: i5.MatSortHeader, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2435
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: DataTableFilterHeader, isStandalone: true, selector: "th[mad-filter-header]", inputs: { id: ["mad-filter-header", "id"], madFilterColumnRightAligned: "madFilterColumnRightAligned", madFilterOptions: "madFilterOptions" }, host: { listeners: { "mouseenter": "onMouseenter()", "mouseleave": "onMouseleave()" } }, ngImport: i0 }); }
|
|
2466
2436
|
}
|
|
2467
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2437
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableFilterHeader, decorators: [{
|
|
2468
2438
|
type: Directive,
|
|
2469
2439
|
args: [{
|
|
2470
2440
|
selector: 'th[mad-filter-header]',
|
|
@@ -2496,10 +2466,10 @@ class DataTableTemplateColumnDefinition {
|
|
|
2496
2466
|
unregister() {
|
|
2497
2467
|
this.cellDef = null;
|
|
2498
2468
|
}
|
|
2499
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2500
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
2469
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableTemplateColumnDefinition, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2470
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: DataTableTemplateColumnDefinition, isStandalone: true, selector: "[madColumnDef]", inputs: { madColumnDef: "madColumnDef" }, ngImport: i0 }); }
|
|
2501
2471
|
}
|
|
2502
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2472
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableTemplateColumnDefinition, decorators: [{
|
|
2503
2473
|
type: Directive,
|
|
2504
2474
|
args: [{
|
|
2505
2475
|
selector: '[madColumnDef]',
|
|
@@ -2523,10 +2493,10 @@ class DataTableTemplateCellDefinition {
|
|
|
2523
2493
|
getCellTemplate() {
|
|
2524
2494
|
return this.templateRef;
|
|
2525
2495
|
}
|
|
2526
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2527
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
2496
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableTemplateCellDefinition, deps: [{ token: i0.TemplateRef }, { token: DataTableTemplateColumnDefinition }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2497
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: DataTableTemplateCellDefinition, isStandalone: true, selector: "[madCellDef]", ngImport: i0 }); }
|
|
2528
2498
|
}
|
|
2529
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2499
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableTemplateCellDefinition, decorators: [{
|
|
2530
2500
|
type: Directive,
|
|
2531
2501
|
args: [{
|
|
2532
2502
|
selector: '[madCellDef]',
|
|
@@ -2541,10 +2511,10 @@ class DataTableTemplateExpandableColumnDefinition {
|
|
|
2541
2511
|
unregister() {
|
|
2542
2512
|
this.cellDef = null;
|
|
2543
2513
|
}
|
|
2544
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2545
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
2514
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableTemplateExpandableColumnDefinition, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2515
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: DataTableTemplateExpandableColumnDefinition, isStandalone: true, selector: "[madExpandableColumnDef]", inputs: { madExpandableColumnDef: "madExpandableColumnDef" }, ngImport: i0 }); }
|
|
2546
2516
|
}
|
|
2547
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2517
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableTemplateExpandableColumnDefinition, decorators: [{
|
|
2548
2518
|
type: Directive,
|
|
2549
2519
|
args: [{
|
|
2550
2520
|
selector: '[madExpandableColumnDef]',
|
|
@@ -2568,10 +2538,10 @@ class DataTableTemplateExpandableCellDefinition {
|
|
|
2568
2538
|
getCellTemplate() {
|
|
2569
2539
|
return this.templateRef;
|
|
2570
2540
|
}
|
|
2571
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2572
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
2541
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableTemplateExpandableCellDefinition, deps: [{ token: i0.TemplateRef }, { token: DataTableTemplateExpandableColumnDefinition }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2542
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: DataTableTemplateExpandableCellDefinition, isStandalone: true, selector: "[madExpandableCellDef]", ngImport: i0 }); }
|
|
2573
2543
|
}
|
|
2574
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2544
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableTemplateExpandableCellDefinition, decorators: [{
|
|
2575
2545
|
type: Directive,
|
|
2576
2546
|
args: [{
|
|
2577
2547
|
selector: '[madExpandableCellDef]',
|
|
@@ -3120,8 +3090,8 @@ class DataTableComponent {
|
|
|
3120
3090
|
}
|
|
3121
3091
|
});
|
|
3122
3092
|
}
|
|
3123
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3124
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: DataTableComponent, isStandalone: true, selector: "mad-data-table", inputs: { id: "id", filterLabel: "filterLabel", filterPlaceholder: "filterPlaceholder", filterColumnsLabel: "filterColumnsLabel", filterColumnsPlaceHolder: "filterColumnsPlaceHolder", showEmptyTable: "showEmptyTable", noDataText: "noDataText", columnSettingsModalTitleLabel: "columnSettingsModalTitleLabel", selectedLabel: "selectedLabel", availableLabel: "availableLabel", saveLabel: "saveLabel", deleteLabel: "deleteLabel", cancelLabel: "cancelLabel", infoTextLabel: "infoTextLabel", tableClass: "tableClass", translateLabels: "translateLabels", useAsync: "useAsync", stateful: "stateful", persistenceConfig: "persistenceConfig", loading: "loading", tableData: "tableData", idGenerator: "idGenerator", parentIdGenerator: "parentIdGenerator", defaultSort: "defaultSort", externalFilter: "externalFilter", paginationEnabled: "paginationEnabled", page: "page", pageSizeOptions: "pageSizeOptions", actions: "actions", selectionEmitType: "selectionEmitType", showDeleteFilterAction: "showDeleteFilterAction", disableRowClick: "disableRowClick", deleteDefinitionAllowed: "deleteDefinitionAllowed", selection: "selection", filterEnabled: "filterEnabled", filterMode: "filterMode", filterValue: "filterValue", externalPaginator: "externalPaginator", defaultPageSize: "defaultPageSize", selectionEmitMode: "selectionEmitMode", forceMode: "forceMode", forceSelectionMode: "forceSelectionMode", displayedColumns: "displayedColumns", displayedColumnDefinition: "displayedColumnDefinition", columnDefinitions: "columnDefinitions", allColumns: "allColumns" }, outputs: { actionEvent: "actionEvent", selectionEvent: "selectionEvent", sortEvent: "sortEvent", filterEvent: "filterEvent", pageEvent: "pageEvent", allColumnsEvent: "allColumnsEvent", columnDefinitionChangeEvent: "columnDefinitionChangeEvent", viewDefinitionChangeEvent: "viewDefinitionChangeEvent" }, providers: [DATA_TABLE_PERSISTENCE_SERVICE_PROVIDER, MAD_DATA_TABL_GLOBAL_CONFIGURATION_PROVIDER], queries: [{ propertyName: "expandableDef", first: true, predicate: DataTableTemplateExpandableCellDefinition, descendants: true }, { propertyName: "columnDefs", predicate: DataTableTemplateColumnDefinition }], viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "matSort", first: true, predicate: MatSort, descendants: true }, { propertyName: "filter", first: true, predicate: DataTableFilter, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div data-cy=\"table-action-bar\" class=\"mad-datatable-action-bar\">\n <!-- Table actions: displayed before the table -->\n <div *ngIf=\"tableActions?.length || (filterMode === 'COLUMN_BASED' && showDeleteFilterAction)\">\n <mad-button-group *ngFor=\"let actionGroup of tableActions\" class=\"table-action-group\">\n <mad-outline-button\n [hidden]=\"isHidden(tableAction)\"\n [disabled]=\"isDisabled(tableAction)\"\n *ngFor=\"let tableAction of actionGroup\"\n (click)=\"onActionEvent(tableAction)\"\n >\n {{ translateLabels ? (tableAction.label | translate) : tableAction.label }}\n {{ getSelectedCount(tableAction.type) }}\n </mad-outline-button>\n </mad-button-group>\n </div>\n <ng-container *ngIf=\"filterMode === 'COLUMN_BASED' && showDeleteFilterAction\">\n <mat-icon fontSet=\"material-icons-outlined\" class=\"delete-filter-action\" color=\"primary\" (click)=\"onDeleteFilter()\"\n >filter_alt_off</mat-icon\n >\n </ng-container>\n <mat-form-field data-cy=\"filter-input\" *ngIf=\"filterMode === 'TABLE_BASED'\">\n <mat-label>{{ translateLabels ? (filterLabel | translate) : filterLabel }}</mat-label>\n <input matInput autocomplete=\"off\" (keyup)=\"onTableBasedFilterEvent($event)\" placeholder=\"{{ filterPlaceholder }}\" />\n </mat-form-field>\n</div>\n\n<!-- Row action menu -->\n<mat-menu #rowActionMenu=\"matMenu\">\n <ng-template matMenuContent let-element=\"element\">\n <ng-container *ngFor=\"let rowAction of rowActions\">\n <button\n data-cy=\"row-action-menu-button\"\n *ngIf=\"!isHidden(rowAction)\"\n mat-menu-item\n class=\"row-action\"\n (click)=\"onRowEvent($event, element, rowAction)\"\n [disabled]=\"isDisabled(rowAction)\"\n >\n {{ translateLabels ? (rowAction.label | translate) : rowAction.label }}\n </button>\n </ng-container>\n </ng-template>\n</mat-menu>\n\n<!-- editable definition menu -->\n<mat-menu #editableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n <button\n *ngFor=\"let definition of editableColumnDefinitions\"\n mat-menu-item\n class=\"row-action\"\n (click)=\"onColumnSettings(definition)\"\n [ngClass]=\"{ 'active-column-definition': isCurrentDefinition(definition) }\"\n >\n {{ translateLabels ? (definition.label | translate) : definition.label }}\n </button>\n </ng-template>\n</mat-menu>\n\n<!-- viewable definition menu -->\n<mat-menu #viewableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n <button\n *ngFor=\"let definition of viewableColumnDefinitions\"\n mat-menu-item\n class=\"row-action\"\n (click)=\"onViewDefinition(definition)\"\n [ngClass]=\"{ 'active-column-definition': isCurrentDefinition(definition) }\"\n >\n {{ translateLabels ? (definition.label | translate) : definition.label }}\n </button>\n </ng-template>\n</mat-menu>\n\n<!-- Table -->\n<div\n *ngIf=\"filterMode === 'COLUMN_BASED' || showEmptyTable || !!dataSource.filteredData?.length; else noData\"\n class=\"datatable\"\n [class]=\"tableClass\"\n>\n <div class=\"mad-datatable-spinner-wrapper\" *ngIf=\"loading\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n <table\n [id]=\"id\"\n mat-table\n [dataSource]=\"dataSource\"\n matSort\n (matSortChange)=\"onSortingEvent($event)\"\n madFilter\n (madFilterChange)=\"onColumnBasedFilterEvent($event)\"\n [multiTemplateDataRows]=\"!!expandableDef\"\n >\n <!-- Row actions column-->\n <ng-container [matColumnDef]=\"ACTION_COLUMN_NAME\">\n <th scope=\"col\" mat-header-cell *matHeaderCellDef [ngClass]=\"showActionColumn ? 'row-action-cell' : 'no-action-cell'\">\n <!-- BATCH: master checkbox -->\n <div *ngIf=\"selectionEmitMode !== 'NONE' && selectionMode === 'BATCH'\" class=\"mad-datatable-checkbox-container\">\n <mat-checkbox (change)=\"onToggleSelectAll()\" [checked]=\"allSelected\"> </mat-checkbox>\n </div>\n <!-- SINGLE / NONE: nothing in header row -->\n </th>\n <td mat-cell *matCellDef=\"let element\" [ngClass]=\"showActionColumn ? 'row-action-cell' : 'no-action-cell'\">\n <!-- BATCH: row checkbox -->\n <div *ngIf=\"showCheckbox(element)\" class=\"mad-datatable-checkbox-container\" (click)=\"onRowEvent($event, element)\">\n <mat-checkbox class=\"no-pointer-events\" [checked]=\"isSelected(element.rowId)\"> </mat-checkbox>\n </div>\n <!-- SINGLE: row action menu icon -->\n <mad-icon-button data-cy=\"row-action-button\"\n *ngIf=\"showRowActionIcon(element) && hasVisibleRowActions(element)\"\n [matMenuTriggerData]=\"{ element: element }\"\n [matMenuTriggerFor]=\"rowActionMenu\"\n (click)=\"onSelectionEvent(element.rowId)\"\n >\n <mat-icon>more_vert</mat-icon>\n </mad-icon-button>\n <!-- SINGLE: row radio button -->\n <div *ngIf=\"showRadioButton(element)\" class=\"mad-datatable-checkbox-container\" (click)=\"onRowEvent($event, element)\">\n <mat-radio-button class=\"no-pointer-events\" [checked]=\"isSelected(element.rowId)\"> </mat-radio-button>\n </div>\n <!-- EXPANDABLE: row is expandable/collapsable -->\n <mad-icon-button *ngIf=\"showExpandableButton(element)\" (click)=\"onExpand($event, element)\">\n <mat-icon *ngIf=\"expandedElement !== element\">keyboard_arrow_down</mat-icon>\n <mat-icon *ngIf=\"expandedElement === element\">keyboard_arrow_up</mat-icon>\n </mad-icon-button>\n <!-- NONE: nothing -->\n </td>\n </ng-container>\n <!-- Cell definitions and rows with injected cells -->\n <ng-container *ngFor=\"let column of columns\" [matColumnDef]=\"column.id\">\n <!-- header cell to be injected -->\n <ng-container [ngSwitch]=\"getDataTableHeaderType(column)\">\n <ng-container *ngSwitchCase=\"'SORT'\">\n <th\n scope=\"col\"\n mat-header-cell\n *matHeaderCellDef\n [class.text-right]=\"column.isRightAligned\"\n mat-sort-header=\"{{ column.orderByName ? column.orderByName : column.dataPropertyName }}\"\n [arrowPosition]=\"column.isRightAligned ? 'before' : 'after'\"\n >\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n <ng-container *ngSwitchCase=\"'FILTER'\">\n <th\n scope=\"col\"\n mat-header-cell\n *matHeaderCellDef\n [class.text-right]=\"column.isRightAligned\"\n mad-filter-header=\"{{ column.dataPropertyName }}\"\n [madFilterColumnRightAligned]=\"column.isRightAligned\"\n [madFilterOptions]=\"column.filterParams?.filterOptions\"\n >\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n <ng-container *ngSwitchCase=\"'SORT_AND_FILTER'\">\n <th\n scope=\"col\"\n mat-header-cell\n *matHeaderCellDef\n [class.text-right]=\"column.isRightAligned\"\n mat-sort-header=\"{{ column.orderByName ? column.orderByName : column.dataPropertyName }}\"\n [arrowPosition]=\"column.isRightAligned ? 'before' : 'after'\"\n mad-filter-header=\"{{ column.dataPropertyName }}\"\n [madFilterColumnRightAligned]=\"column.isRightAligned\"\n [madFilterOptions]=\"column.filterParams?.filterOptions\"\n >\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <th scope=\"col\" mat-header-cell *matHeaderCellDef [class.text-right]=\"column.isRightAligned\">\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n </ng-container>\n\n <!-- data cell to be injected -->\n <td\n mat-cell\n *matCellDef=\"let element\"\n [class.text-right]=\"column.isRightAligned\"\n [class.mad-dt-child-cell]=\"element.parentId\"\n [ngSwitch]=\"column.transformer\"\n (click)=\"!disableRowClick && onRowEvent($event, element)\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n getCustomCellTemplate(column.id) || defaultCellTemplate;\n context: { column: column, element: element, $implicit: element }\n \"\n ></ng-container>\n </td>\n </ng-container>\n\n <!-- Expanded Content Column - The row is made up of this one column that spans across all columns -->\n <ng-container *ngIf=\"!!expandableDef\" [matColumnDef]=\"expandableColumnDef\">\n <td mat-cell *matCellDef=\"let element\" [attr.colspan]=\"columns.length + 1\">\n <div class=\"mad-data-table-expandable-area\" [@detailExpand]=\"element === expandedElement ? 'expanded' : 'collapsed'\">\n <ng-container\n *ngTemplateOutlet=\"\n getCustomExpandableTemplate() || defaultCellTemplate;\n context: { column: element, element: element, $implicit: element }\n \"\n ></ng-container>\n </div>\n </td>\n </ng-container>\n\n <!-- header row where cells will be injected -->\n <tr mat-header-row *matHeaderRowDef=\"columnIds\"></tr>\n <!-- data row where cells will be injected -->\n <tr\n mat-row\n [class.clickable-table-row]=\"!row.parentId && selectionEmitMode !== 'NONE'\"\n *matRowDef=\"let row; columns: columnIds\"\n (click)=\"onExpand($event, row)\"\n ></tr>\n <ng-container *ngIf=\"!!expandableDef\">\n <tr mat-row *matRowDef=\"let element; columns: [expandableColumnDef]\" class=\"mad-data-table-expandable-row\"></tr>\n </ng-container>\n <tr class=\"mat-row\" *matNoDataRow>\n <td class=\"mat-cell noDataText columnBasedFilter\" [attr.colspan]=\"columnIds.length\">\n {{ translateLabels ? (noDataText | translate) : noDataText }}\n </td>\n </tr>\n </table>\n</div>\n<div data-cy=\"table-bottom-area\" class=\"mad-data-table-bottom-area\">\n <div data-cy=\"definition-button-block\" class=\"mad-data-table-bottom-info-area\">\n <!-- column settings: 1 definition -->\n <mad-icon-button *ngIf=\"editableColumnDefinitions?.length === 1\" (click)=\"onColumnSettings()\">\n <mat-icon class=\"material-icons-outlined\">view_column</mat-icon>\n </mad-icon-button>\n <!-- column settings: multiple definitions -->\n <mad-icon-button *ngIf=\"(editableColumnDefinitions?.length || 0) > 0\" [matMenuTriggerFor]=\"editableDefinitionMenu\">\n <mat-icon>view_column</mat-icon>\n </mad-icon-button>\n <!-- column view: multiple definitions -->\n <mad-icon-button *ngIf=\"(viewableColumnDefinitions?.length || 0) > 0\" [matMenuTriggerFor]=\"viewableDefinitionMenu\">\n <mat-icon>preview</mat-icon>\n </mad-icon-button>\n </div>\n\n <!-- Pagination -->\n <mat-paginator\n [style.display]=\"paginationEnabled ? 'block' : 'none'\"\n [length]=\"pageLength\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"onPageEvent($event)\"\n showFirstLastButtons\n >\n </mat-paginator>\n</div>\n\n<!-- No data alert -->\n<ng-template #noData>\n <div data-cy=\"no-data-block\" class=\"noDataText\">\n <div class=\"mad-datatable-spinner-wrapper\" *ngIf=\"loading\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n {{ translateLabels ? (noDataText | translate) : noDataText }}\n </div>\n</ng-template>\n\n<!-- default cell template -->\n<ng-template #defaultCellTemplate let-element=\"element\" let-column=\"column\">\n <span>\n {{ element[column.dataPropertyName] }}\n </span>\n</ng-template>\n\n<!-- custom cell templates injected from parent -->\n<ng-content></ng-content>\n", styles: [":host{display:flex;flex-direction:column;min-height:112px;flex:1 1 auto;background-color:#fff}.datatable-vertical-stretch-to-parent{flex:1;max-height:100%;width:100%;display:flex;flex-direction:column}.datatable-max-height-500{max-height:500px}.datatable-max-height-300{max-height:300px}.datatable-max-height,.datatable-max-height-500,.datatable-max-height-300{flex:1;width:100%;display:flex;flex-direction:column}.datatable{overflow:auto;flex:1 1 auto;height:100%;position:relative;width:100%}.datatable table{width:100%;min-height:140px;max-height:100%}.datatable table th,.datatable table td{width:auto;text-overflow:ellipsis;white-space:nowrap}.datatable table th{overflow:visible}.datatable table td{overflow:hidden}.layout-fixed table{table-layout:fixed}.layout-fixed table th{font-weight:700}.layout-fixed table td{white-space:normal;word-wrap:break-word}.text-right{text-align:right!important;padding-right:24px!important}.table-action-group{margin-right:.5em;margin-bottom:.5em}.row-action-cell{width:48px!important;padding-left:8px!important}.no-action-cell{width:8px!important;padding:0}.noDataText{width:100%;text-align:center;position:relative}.noDataText.columnBasedFilter{padding-top:10px}.mad-datatable-action-bar{display:flex;justify-content:space-between;align-items:baseline}.mad-datatable-checkbox-container{margin-right:8px;margin-left:8px}.mad-datatable-spinner-wrapper{background-color:#fff;opacity:.8;position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:99999;pointer-events:unset}.mad-data-table-expandable-row{height:0;display:contents;padding:0}.mad-data-table-expandable-row td{border-top-color:transparent;border-bottom-color:transparent}.mad-data-table-expandable-area{overflow:hidden;display:flex;width:100%}.mad-data-table-bottom-area{display:flex;flex-direction:row}.mad-data-table-bottom-area .mad-data-table-bottom-info-area{display:flex;flex:1}.mat-mdc-header-row th{position:sticky;top:0;background-color:#fff;z-index:1}.no-pointer-events{pointer-events:none}.active-column-definition{color:#000;background-color:#f5f5f5}.mad-dt-child-cell{color:#0009}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$4.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2$4.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2$4.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i1$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$3.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i1$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i7.MatPaginator, selector: "mat-paginator", inputs: ["disabled", "color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i5.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i5.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i9.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i9.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i9.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i9.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i9.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i9.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i9.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i9.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i9.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i9.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i9.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i10.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: OutlineButtonComponent, selector: "mad-outline-button", inputs: ["type", "disabled", "title", "color"] }, { kind: "component", type: IconButtonComponent, selector: "mad-icon-button", inputs: ["type", "disabled", "title"] }, { kind: "component", type: MadButtonGroupComponent, selector: "mad-button-group" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$5.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i15.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "component", type: i16.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex", "id", "name", "aria-label", "aria-labelledby", "aria-describedby", "checked", "value", "labelPosition", "disabled", "required", "color"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "ngmodule", type: DragDropModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: DataTableFilterHeader, selector: "th[mad-filter-header]", inputs: ["mad-filter-header", "madFilterColumnRightAligned", "madFilterOptions"] }, { kind: "directive", type: DataTableFilter, selector: "[madFilter]", outputs: ["madFilterChange"] }], animations: [
|
|
3093
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$4.MatDialog }, { token: MAD_DATA_TABLE_PERSISTENCE_SERVICE }, { token: MAD_DATA_TABLE_GLOBAL_CONFIGURATION }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3094
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: DataTableComponent, isStandalone: true, selector: "mad-data-table", inputs: { id: "id", filterLabel: "filterLabel", filterPlaceholder: "filterPlaceholder", filterColumnsLabel: "filterColumnsLabel", filterColumnsPlaceHolder: "filterColumnsPlaceHolder", showEmptyTable: "showEmptyTable", noDataText: "noDataText", columnSettingsModalTitleLabel: "columnSettingsModalTitleLabel", selectedLabel: "selectedLabel", availableLabel: "availableLabel", saveLabel: "saveLabel", deleteLabel: "deleteLabel", cancelLabel: "cancelLabel", infoTextLabel: "infoTextLabel", tableClass: "tableClass", translateLabels: "translateLabels", useAsync: "useAsync", stateful: "stateful", persistenceConfig: "persistenceConfig", loading: "loading", tableData: "tableData", idGenerator: "idGenerator", parentIdGenerator: "parentIdGenerator", defaultSort: "defaultSort", externalFilter: "externalFilter", paginationEnabled: "paginationEnabled", page: "page", pageSizeOptions: "pageSizeOptions", actions: "actions", selectionEmitType: "selectionEmitType", showDeleteFilterAction: "showDeleteFilterAction", disableRowClick: "disableRowClick", deleteDefinitionAllowed: "deleteDefinitionAllowed", selection: "selection", filterEnabled: "filterEnabled", filterMode: "filterMode", filterValue: "filterValue", externalPaginator: "externalPaginator", defaultPageSize: "defaultPageSize", selectionEmitMode: "selectionEmitMode", forceMode: "forceMode", forceSelectionMode: "forceSelectionMode", displayedColumns: "displayedColumns", displayedColumnDefinition: "displayedColumnDefinition", columnDefinitions: "columnDefinitions", allColumns: "allColumns" }, outputs: { actionEvent: "actionEvent", selectionEvent: "selectionEvent", sortEvent: "sortEvent", filterEvent: "filterEvent", pageEvent: "pageEvent", allColumnsEvent: "allColumnsEvent", columnDefinitionChangeEvent: "columnDefinitionChangeEvent", viewDefinitionChangeEvent: "viewDefinitionChangeEvent" }, providers: [DATA_TABLE_PERSISTENCE_SERVICE_PROVIDER, MAD_DATA_TABL_GLOBAL_CONFIGURATION_PROVIDER], queries: [{ propertyName: "expandableDef", first: true, predicate: DataTableTemplateExpandableCellDefinition, descendants: true }, { propertyName: "columnDefs", predicate: DataTableTemplateColumnDefinition }], viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "matSort", first: true, predicate: MatSort, descendants: true }, { propertyName: "filter", first: true, predicate: DataTableFilter, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div data-cy=\"table-action-bar\" class=\"mad-datatable-action-bar\">\n <!-- Table actions: displayed before the table -->\n <div *ngIf=\"tableActions?.length || (filterMode === 'COLUMN_BASED' && showDeleteFilterAction)\">\n <mad-button-group *ngFor=\"let actionGroup of tableActions\" class=\"table-action-group\">\n <mad-outline-button\n [hidden]=\"isHidden(tableAction)\"\n [disabled]=\"isDisabled(tableAction)\"\n *ngFor=\"let tableAction of actionGroup\"\n (click)=\"onActionEvent(tableAction)\"\n >\n {{ translateLabels ? (tableAction.label | translate) : tableAction.label }}\n {{ getSelectedCount(tableAction.type) }}\n </mad-outline-button>\n </mad-button-group>\n </div>\n <ng-container *ngIf=\"filterMode === 'COLUMN_BASED' && showDeleteFilterAction\">\n <mat-icon fontSet=\"material-icons-outlined\" class=\"delete-filter-action\" color=\"primary\" (click)=\"onDeleteFilter()\"\n >filter_alt_off</mat-icon\n >\n </ng-container>\n <mat-form-field data-cy=\"filter-input\" *ngIf=\"filterMode === 'TABLE_BASED'\">\n <mat-label>{{ translateLabels ? (filterLabel | translate) : filterLabel }}</mat-label>\n <input matInput autocomplete=\"off\" (keyup)=\"onTableBasedFilterEvent($event)\" placeholder=\"{{ filterPlaceholder }}\" />\n </mat-form-field>\n</div>\n\n<!-- Row action menu -->\n<mat-menu #rowActionMenu=\"matMenu\">\n <ng-template matMenuContent let-element=\"element\">\n <ng-container *ngFor=\"let rowAction of rowActions\">\n <button\n data-cy=\"row-action-menu-button\"\n *ngIf=\"!isHidden(rowAction)\"\n mat-menu-item\n class=\"row-action\"\n (click)=\"onRowEvent($event, element, rowAction)\"\n [disabled]=\"isDisabled(rowAction)\"\n >\n {{ translateLabels ? (rowAction.label | translate) : rowAction.label }}\n </button>\n </ng-container>\n </ng-template>\n</mat-menu>\n\n<!-- editable definition menu -->\n<mat-menu #editableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n <button\n *ngFor=\"let definition of editableColumnDefinitions\"\n mat-menu-item\n class=\"row-action\"\n (click)=\"onColumnSettings(definition)\"\n [ngClass]=\"{ 'active-column-definition': isCurrentDefinition(definition) }\"\n >\n {{ translateLabels ? (definition.label | translate) : definition.label }}\n </button>\n </ng-template>\n</mat-menu>\n\n<!-- viewable definition menu -->\n<mat-menu #viewableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n <button\n *ngFor=\"let definition of viewableColumnDefinitions\"\n mat-menu-item\n class=\"row-action\"\n (click)=\"onViewDefinition(definition)\"\n [ngClass]=\"{ 'active-column-definition': isCurrentDefinition(definition) }\"\n >\n {{ translateLabels ? (definition.label | translate) : definition.label }}\n </button>\n </ng-template>\n</mat-menu>\n\n<!-- Table -->\n<div\n *ngIf=\"filterMode === 'COLUMN_BASED' || showEmptyTable || !!dataSource.filteredData?.length; else noData\"\n class=\"datatable\"\n [class]=\"tableClass\"\n>\n <div class=\"mad-datatable-spinner-wrapper\" *ngIf=\"loading\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n <table\n [id]=\"id\"\n mat-table\n [dataSource]=\"dataSource\"\n matSort\n (matSortChange)=\"onSortingEvent($event)\"\n madFilter\n (madFilterChange)=\"onColumnBasedFilterEvent($event)\"\n [multiTemplateDataRows]=\"!!expandableDef\"\n >\n <!-- Row actions column-->\n <ng-container [matColumnDef]=\"ACTION_COLUMN_NAME\">\n <th scope=\"col\" mat-header-cell *matHeaderCellDef [ngClass]=\"showActionColumn ? 'row-action-cell' : 'no-action-cell'\">\n <!-- BATCH: master checkbox -->\n <div *ngIf=\"selectionEmitMode !== 'NONE' && selectionMode === 'BATCH'\" class=\"mad-datatable-checkbox-container\">\n <mat-checkbox (change)=\"onToggleSelectAll()\" [checked]=\"allSelected\"> </mat-checkbox>\n </div>\n <!-- SINGLE / NONE: nothing in header row -->\n </th>\n <td mat-cell *matCellDef=\"let element\" [ngClass]=\"showActionColumn ? 'row-action-cell' : 'no-action-cell'\">\n <!-- BATCH: row checkbox -->\n <div *ngIf=\"showCheckbox(element)\" class=\"mad-datatable-checkbox-container\" (click)=\"onRowEvent($event, element)\">\n <mat-checkbox class=\"no-pointer-events\" [checked]=\"isSelected(element.rowId)\"> </mat-checkbox>\n </div>\n <!-- SINGLE: row action menu icon -->\n <mad-icon-button\n data-cy=\"row-action-button\"\n *ngIf=\"showRowActionIcon(element) && hasVisibleRowActions(element)\"\n [matMenuTriggerData]=\"{ element: element }\"\n [matMenuTriggerFor]=\"rowActionMenu\"\n (click)=\"onSelectionEvent(element.rowId)\"\n >\n <mat-icon>more_vert</mat-icon>\n </mad-icon-button>\n <!-- SINGLE: row radio button -->\n <div *ngIf=\"showRadioButton(element)\" class=\"mad-datatable-checkbox-container\" (click)=\"onRowEvent($event, element)\">\n <mat-radio-button class=\"no-pointer-events\" [checked]=\"isSelected(element.rowId)\"> </mat-radio-button>\n </div>\n <!-- EXPANDABLE: row is expandable/collapsable -->\n <mad-icon-button *ngIf=\"showExpandableButton(element)\" (click)=\"onExpand($event, element)\">\n <mat-icon *ngIf=\"expandedElement !== element\">keyboard_arrow_down</mat-icon>\n <mat-icon *ngIf=\"expandedElement === element\">keyboard_arrow_up</mat-icon>\n </mad-icon-button>\n <!-- NONE: nothing -->\n </td>\n </ng-container>\n <!-- Cell definitions and rows with injected cells -->\n <ng-container *ngFor=\"let column of columns\" [matColumnDef]=\"column.id\">\n <!-- header cell to be injected -->\n <ng-container [ngSwitch]=\"getDataTableHeaderType(column)\">\n <ng-container *ngSwitchCase=\"'SORT'\">\n <th\n scope=\"col\"\n mat-header-cell\n *matHeaderCellDef\n [class.text-right]=\"column.isRightAligned\"\n mat-sort-header=\"{{ column.orderByName ? column.orderByName : column.dataPropertyName }}\"\n [arrowPosition]=\"column.isRightAligned ? 'before' : 'after'\"\n >\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n <ng-container *ngSwitchCase=\"'FILTER'\">\n <th\n scope=\"col\"\n mat-header-cell\n *matHeaderCellDef\n [class.text-right]=\"column.isRightAligned\"\n mad-filter-header=\"{{ column.dataPropertyName }}\"\n [madFilterColumnRightAligned]=\"column.isRightAligned\"\n [madFilterOptions]=\"column.filterParams?.filterOptions\"\n >\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n <ng-container *ngSwitchCase=\"'SORT_AND_FILTER'\">\n <th\n scope=\"col\"\n mat-header-cell\n *matHeaderCellDef\n [class.text-right]=\"column.isRightAligned\"\n mat-sort-header=\"{{ column.orderByName ? column.orderByName : column.dataPropertyName }}\"\n [arrowPosition]=\"column.isRightAligned ? 'before' : 'after'\"\n mad-filter-header=\"{{ column.dataPropertyName }}\"\n [madFilterColumnRightAligned]=\"column.isRightAligned\"\n [madFilterOptions]=\"column.filterParams?.filterOptions\"\n >\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <th scope=\"col\" mat-header-cell *matHeaderCellDef [class.text-right]=\"column.isRightAligned\">\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n </ng-container>\n\n <!-- data cell to be injected -->\n <td\n mat-cell\n *matCellDef=\"let element\"\n [class.text-right]=\"column.isRightAligned\"\n [class.mad-dt-child-cell]=\"element.parentId\"\n [ngSwitch]=\"column.transformer\"\n (click)=\"!disableRowClick && onRowEvent($event, element)\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n getCustomCellTemplate(column.id) || defaultCellTemplate;\n context: { column: column, element: element, $implicit: element }\n \"\n ></ng-container>\n </td>\n </ng-container>\n\n <!-- Expanded Content Column - The row is made up of this one column that spans across all columns -->\n <ng-container *ngIf=\"!!expandableDef\" [matColumnDef]=\"expandableColumnDef\">\n <td mat-cell *matCellDef=\"let element\" [attr.colspan]=\"columns.length + 1\">\n <div class=\"mad-data-table-expandable-area\" [@detailExpand]=\"element === expandedElement ? 'expanded' : 'collapsed'\">\n <ng-container\n *ngTemplateOutlet=\"\n getCustomExpandableTemplate() || defaultCellTemplate;\n context: { column: element, element: element, $implicit: element }\n \"\n ></ng-container>\n </div>\n </td>\n </ng-container>\n\n <!-- header row where cells will be injected -->\n <tr mat-header-row *matHeaderRowDef=\"columnIds\"></tr>\n <!-- data row where cells will be injected -->\n <tr\n mat-row\n [class.clickable-table-row]=\"!row.parentId && selectionEmitMode !== 'NONE'\"\n *matRowDef=\"let row; columns: columnIds\"\n (click)=\"onExpand($event, row)\"\n ></tr>\n <ng-container *ngIf=\"!!expandableDef\">\n <tr mat-row *matRowDef=\"let element; columns: [expandableColumnDef]\" class=\"mad-data-table-expandable-row\"></tr>\n </ng-container>\n <tr class=\"mat-row\" *matNoDataRow>\n <td class=\"mat-cell noDataText columnBasedFilter\" [attr.colspan]=\"columnIds.length\">\n {{ translateLabels ? (noDataText | translate) : noDataText }}\n </td>\n </tr>\n </table>\n</div>\n<div data-cy=\"table-bottom-area\" class=\"mad-data-table-bottom-area\">\n <div data-cy=\"definition-button-block\" class=\"mad-data-table-bottom-info-area\">\n <!-- column settings: 1 definition -->\n <mad-icon-button *ngIf=\"editableColumnDefinitions?.length === 1\" (click)=\"onColumnSettings()\">\n <mat-icon class=\"material-icons-outlined\">view_column</mat-icon>\n </mad-icon-button>\n <!-- column settings: multiple definitions -->\n <mad-icon-button *ngIf=\"(editableColumnDefinitions?.length || 0) > 0\" [matMenuTriggerFor]=\"editableDefinitionMenu\">\n <mat-icon>view_column</mat-icon>\n </mad-icon-button>\n <!-- column view: multiple definitions -->\n <mad-icon-button *ngIf=\"(viewableColumnDefinitions?.length || 0) > 0\" [matMenuTriggerFor]=\"viewableDefinitionMenu\">\n <mat-icon>preview</mat-icon>\n </mad-icon-button>\n </div>\n\n <!-- Pagination -->\n <mat-paginator\n [style.display]=\"paginationEnabled ? 'block' : 'none'\"\n [length]=\"pageLength\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"onPageEvent($event)\"\n showFirstLastButtons\n >\n </mat-paginator>\n</div>\n\n<!-- No data alert -->\n<ng-template #noData>\n <div data-cy=\"no-data-block\" class=\"noDataText\">\n <div class=\"mad-datatable-spinner-wrapper\" *ngIf=\"loading\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n {{ translateLabels ? (noDataText | translate) : noDataText }}\n </div>\n</ng-template>\n\n<!-- default cell template -->\n<ng-template #defaultCellTemplate let-element=\"element\" let-column=\"column\">\n <span>\n {{ element[column.dataPropertyName] }}\n </span>\n</ng-template>\n\n<!-- custom cell templates injected from parent -->\n<ng-content></ng-content>\n", styles: [":host{display:flex;flex-direction:column;min-height:112px;flex:1 1 auto;background-color:#fff}.datatable-vertical-stretch-to-parent{flex:1;max-height:100%;width:100%;display:flex;flex-direction:column}.datatable-max-height-500{max-height:500px}.datatable-max-height-300{max-height:300px}.datatable-max-height,.datatable-max-height-500,.datatable-max-height-300{flex:1;width:100%;display:flex;flex-direction:column}.datatable{overflow:auto;flex:1 1 auto;height:100%;position:relative;width:100%}.datatable table{width:100%;min-height:140px;max-height:100%}.datatable table th,.datatable table td{width:auto;text-overflow:ellipsis;white-space:nowrap}.datatable table th{overflow:visible}.datatable table td{overflow:hidden}.layout-fixed table{table-layout:fixed}.layout-fixed table th{font-weight:700}.layout-fixed table td{white-space:normal;word-wrap:break-word}.text-right{text-align:right!important;padding-right:24px!important}.table-action-group{margin-right:.5em;margin-bottom:.5em}.row-action-cell{width:48px!important;padding-left:8px!important}.no-action-cell{width:8px!important;padding:0}.noDataText{width:100%;text-align:center;position:relative}.noDataText.columnBasedFilter{padding-top:10px}.mad-datatable-action-bar{display:flex;justify-content:space-between;align-items:baseline}.mad-datatable-checkbox-container{margin-right:8px;margin-left:8px}.mad-datatable-spinner-wrapper{background-color:#fff;opacity:.8;position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:99999;pointer-events:unset}.mad-data-table-expandable-row{height:0;display:contents;padding:0}.mad-data-table-expandable-row td{border-top-color:transparent;border-bottom-color:transparent}.mad-data-table-expandable-area{overflow:hidden;display:flex;width:100%}.mad-data-table-bottom-area{display:flex;flex-direction:row}.mad-data-table-bottom-area .mad-data-table-bottom-info-area{display:flex;flex:1}.mat-mdc-header-row th{position:sticky;top:0;background-color:#fff;z-index:1}.no-pointer-events{pointer-events:none}.active-column-definition{color:#000;background-color:#f5f5f5}.mad-dt-child-cell{color:#0009}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$4.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2$4.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2$4.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i1$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$3.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i1$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i7.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i5.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i5.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i9.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i9.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i9.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i9.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i9.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i9.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i9.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i9.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i9.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i9.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i9.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i10.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: OutlineButtonComponent, selector: "mad-outline-button", inputs: ["type", "disabled", "title", "color"] }, { kind: "component", type: IconButtonComponent, selector: "mad-icon-button", inputs: ["type", "disabled", "title"] }, { kind: "component", type: MadButtonGroupComponent, selector: "mad-button-group" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$5.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i15.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "component", type: i16.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "ngmodule", type: DragDropModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: DataTableFilterHeader, selector: "th[mad-filter-header]", inputs: ["mad-filter-header", "madFilterColumnRightAligned", "madFilterOptions"] }, { kind: "directive", type: DataTableFilter, selector: "[madFilter]", outputs: ["madFilterChange"] }], animations: [
|
|
3125
3095
|
trigger('detailExpand', [
|
|
3126
3096
|
state('collapsed,void', style({ height: '0px', minHeight: '0' })),
|
|
3127
3097
|
state('expanded', style({ height: '*' })),
|
|
@@ -3129,7 +3099,7 @@ class DataTableComponent {
|
|
|
3129
3099
|
]),
|
|
3130
3100
|
] }); }
|
|
3131
3101
|
}
|
|
3132
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3102
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DataTableComponent, decorators: [{
|
|
3133
3103
|
type: Component,
|
|
3134
3104
|
args: [{ selector: 'mad-data-table', animations: [
|
|
3135
3105
|
trigger('detailExpand', [
|
|
@@ -3161,7 +3131,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
3161
3131
|
DataTableTemplateCellDefinition,
|
|
3162
3132
|
DataTableTemplateExpandableColumnDefinition,
|
|
3163
3133
|
DataTableTemplateExpandableCellDefinition,
|
|
3164
|
-
], providers: [DATA_TABLE_PERSISTENCE_SERVICE_PROVIDER, MAD_DATA_TABL_GLOBAL_CONFIGURATION_PROVIDER], template: "<div data-cy=\"table-action-bar\" class=\"mad-datatable-action-bar\">\n <!-- Table actions: displayed before the table -->\n <div *ngIf=\"tableActions?.length || (filterMode === 'COLUMN_BASED' && showDeleteFilterAction)\">\n <mad-button-group *ngFor=\"let actionGroup of tableActions\" class=\"table-action-group\">\n <mad-outline-button\n [hidden]=\"isHidden(tableAction)\"\n [disabled]=\"isDisabled(tableAction)\"\n *ngFor=\"let tableAction of actionGroup\"\n (click)=\"onActionEvent(tableAction)\"\n >\n {{ translateLabels ? (tableAction.label | translate) : tableAction.label }}\n {{ getSelectedCount(tableAction.type) }}\n </mad-outline-button>\n </mad-button-group>\n </div>\n <ng-container *ngIf=\"filterMode === 'COLUMN_BASED' && showDeleteFilterAction\">\n <mat-icon fontSet=\"material-icons-outlined\" class=\"delete-filter-action\" color=\"primary\" (click)=\"onDeleteFilter()\"\n >filter_alt_off</mat-icon\n >\n </ng-container>\n <mat-form-field data-cy=\"filter-input\" *ngIf=\"filterMode === 'TABLE_BASED'\">\n <mat-label>{{ translateLabels ? (filterLabel | translate) : filterLabel }}</mat-label>\n <input matInput autocomplete=\"off\" (keyup)=\"onTableBasedFilterEvent($event)\" placeholder=\"{{ filterPlaceholder }}\" />\n </mat-form-field>\n</div>\n\n<!-- Row action menu -->\n<mat-menu #rowActionMenu=\"matMenu\">\n <ng-template matMenuContent let-element=\"element\">\n <ng-container *ngFor=\"let rowAction of rowActions\">\n <button\n data-cy=\"row-action-menu-button\"\n *ngIf=\"!isHidden(rowAction)\"\n mat-menu-item\n class=\"row-action\"\n (click)=\"onRowEvent($event, element, rowAction)\"\n [disabled]=\"isDisabled(rowAction)\"\n >\n {{ translateLabels ? (rowAction.label | translate) : rowAction.label }}\n </button>\n </ng-container>\n </ng-template>\n</mat-menu>\n\n<!-- editable definition menu -->\n<mat-menu #editableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n <button\n *ngFor=\"let definition of editableColumnDefinitions\"\n mat-menu-item\n class=\"row-action\"\n (click)=\"onColumnSettings(definition)\"\n [ngClass]=\"{ 'active-column-definition': isCurrentDefinition(definition) }\"\n >\n {{ translateLabels ? (definition.label | translate) : definition.label }}\n </button>\n </ng-template>\n</mat-menu>\n\n<!-- viewable definition menu -->\n<mat-menu #viewableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n <button\n *ngFor=\"let definition of viewableColumnDefinitions\"\n mat-menu-item\n class=\"row-action\"\n (click)=\"onViewDefinition(definition)\"\n [ngClass]=\"{ 'active-column-definition': isCurrentDefinition(definition) }\"\n >\n {{ translateLabels ? (definition.label | translate) : definition.label }}\n </button>\n </ng-template>\n</mat-menu>\n\n<!-- Table -->\n<div\n *ngIf=\"filterMode === 'COLUMN_BASED' || showEmptyTable || !!dataSource.filteredData?.length; else noData\"\n class=\"datatable\"\n [class]=\"tableClass\"\n>\n <div class=\"mad-datatable-spinner-wrapper\" *ngIf=\"loading\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n <table\n [id]=\"id\"\n mat-table\n [dataSource]=\"dataSource\"\n matSort\n (matSortChange)=\"onSortingEvent($event)\"\n madFilter\n (madFilterChange)=\"onColumnBasedFilterEvent($event)\"\n [multiTemplateDataRows]=\"!!expandableDef\"\n >\n <!-- Row actions column-->\n <ng-container [matColumnDef]=\"ACTION_COLUMN_NAME\">\n <th scope=\"col\" mat-header-cell *matHeaderCellDef [ngClass]=\"showActionColumn ? 'row-action-cell' : 'no-action-cell'\">\n <!-- BATCH: master checkbox -->\n <div *ngIf=\"selectionEmitMode !== 'NONE' && selectionMode === 'BATCH'\" class=\"mad-datatable-checkbox-container\">\n <mat-checkbox (change)=\"onToggleSelectAll()\" [checked]=\"allSelected\"> </mat-checkbox>\n </div>\n <!-- SINGLE / NONE: nothing in header row -->\n </th>\n <td mat-cell *matCellDef=\"let element\" [ngClass]=\"showActionColumn ? 'row-action-cell' : 'no-action-cell'\">\n <!-- BATCH: row checkbox -->\n <div *ngIf=\"showCheckbox(element)\" class=\"mad-datatable-checkbox-container\" (click)=\"onRowEvent($event, element)\">\n <mat-checkbox class=\"no-pointer-events\" [checked]=\"isSelected(element.rowId)\"> </mat-checkbox>\n </div>\n <!-- SINGLE: row action menu icon -->\n <mad-icon-button data-cy=\"row-action-button\"\n *ngIf=\"showRowActionIcon(element) && hasVisibleRowActions(element)\"\n [matMenuTriggerData]=\"{ element: element }\"\n [matMenuTriggerFor]=\"rowActionMenu\"\n (click)=\"onSelectionEvent(element.rowId)\"\n >\n <mat-icon>more_vert</mat-icon>\n </mad-icon-button>\n <!-- SINGLE: row radio button -->\n <div *ngIf=\"showRadioButton(element)\" class=\"mad-datatable-checkbox-container\" (click)=\"onRowEvent($event, element)\">\n <mat-radio-button class=\"no-pointer-events\" [checked]=\"isSelected(element.rowId)\"> </mat-radio-button>\n </div>\n <!-- EXPANDABLE: row is expandable/collapsable -->\n <mad-icon-button *ngIf=\"showExpandableButton(element)\" (click)=\"onExpand($event, element)\">\n <mat-icon *ngIf=\"expandedElement !== element\">keyboard_arrow_down</mat-icon>\n <mat-icon *ngIf=\"expandedElement === element\">keyboard_arrow_up</mat-icon>\n </mad-icon-button>\n <!-- NONE: nothing -->\n </td>\n </ng-container>\n <!-- Cell definitions and rows with injected cells -->\n <ng-container *ngFor=\"let column of columns\" [matColumnDef]=\"column.id\">\n <!-- header cell to be injected -->\n <ng-container [ngSwitch]=\"getDataTableHeaderType(column)\">\n <ng-container *ngSwitchCase=\"'SORT'\">\n <th\n scope=\"col\"\n mat-header-cell\n *matHeaderCellDef\n [class.text-right]=\"column.isRightAligned\"\n mat-sort-header=\"{{ column.orderByName ? column.orderByName : column.dataPropertyName }}\"\n [arrowPosition]=\"column.isRightAligned ? 'before' : 'after'\"\n >\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n <ng-container *ngSwitchCase=\"'FILTER'\">\n <th\n scope=\"col\"\n mat-header-cell\n *matHeaderCellDef\n [class.text-right]=\"column.isRightAligned\"\n mad-filter-header=\"{{ column.dataPropertyName }}\"\n [madFilterColumnRightAligned]=\"column.isRightAligned\"\n [madFilterOptions]=\"column.filterParams?.filterOptions\"\n >\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n <ng-container *ngSwitchCase=\"'SORT_AND_FILTER'\">\n <th\n scope=\"col\"\n mat-header-cell\n *matHeaderCellDef\n [class.text-right]=\"column.isRightAligned\"\n mat-sort-header=\"{{ column.orderByName ? column.orderByName : column.dataPropertyName }}\"\n [arrowPosition]=\"column.isRightAligned ? 'before' : 'after'\"\n mad-filter-header=\"{{ column.dataPropertyName }}\"\n [madFilterColumnRightAligned]=\"column.isRightAligned\"\n [madFilterOptions]=\"column.filterParams?.filterOptions\"\n >\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <th scope=\"col\" mat-header-cell *matHeaderCellDef [class.text-right]=\"column.isRightAligned\">\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n </ng-container>\n\n <!-- data cell to be injected -->\n <td\n mat-cell\n *matCellDef=\"let element\"\n [class.text-right]=\"column.isRightAligned\"\n [class.mad-dt-child-cell]=\"element.parentId\"\n [ngSwitch]=\"column.transformer\"\n (click)=\"!disableRowClick && onRowEvent($event, element)\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n getCustomCellTemplate(column.id) || defaultCellTemplate;\n context: { column: column, element: element, $implicit: element }\n \"\n ></ng-container>\n </td>\n </ng-container>\n\n <!-- Expanded Content Column - The row is made up of this one column that spans across all columns -->\n <ng-container *ngIf=\"!!expandableDef\" [matColumnDef]=\"expandableColumnDef\">\n <td mat-cell *matCellDef=\"let element\" [attr.colspan]=\"columns.length + 1\">\n <div class=\"mad-data-table-expandable-area\" [@detailExpand]=\"element === expandedElement ? 'expanded' : 'collapsed'\">\n <ng-container\n *ngTemplateOutlet=\"\n getCustomExpandableTemplate() || defaultCellTemplate;\n context: { column: element, element: element, $implicit: element }\n \"\n ></ng-container>\n </div>\n </td>\n </ng-container>\n\n <!-- header row where cells will be injected -->\n <tr mat-header-row *matHeaderRowDef=\"columnIds\"></tr>\n <!-- data row where cells will be injected -->\n <tr\n mat-row\n [class.clickable-table-row]=\"!row.parentId && selectionEmitMode !== 'NONE'\"\n *matRowDef=\"let row; columns: columnIds\"\n (click)=\"onExpand($event, row)\"\n ></tr>\n <ng-container *ngIf=\"!!expandableDef\">\n <tr mat-row *matRowDef=\"let element; columns: [expandableColumnDef]\" class=\"mad-data-table-expandable-row\"></tr>\n </ng-container>\n <tr class=\"mat-row\" *matNoDataRow>\n <td class=\"mat-cell noDataText columnBasedFilter\" [attr.colspan]=\"columnIds.length\">\n {{ translateLabels ? (noDataText | translate) : noDataText }}\n </td>\n </tr>\n </table>\n</div>\n<div data-cy=\"table-bottom-area\" class=\"mad-data-table-bottom-area\">\n <div data-cy=\"definition-button-block\" class=\"mad-data-table-bottom-info-area\">\n <!-- column settings: 1 definition -->\n <mad-icon-button *ngIf=\"editableColumnDefinitions?.length === 1\" (click)=\"onColumnSettings()\">\n <mat-icon class=\"material-icons-outlined\">view_column</mat-icon>\n </mad-icon-button>\n <!-- column settings: multiple definitions -->\n <mad-icon-button *ngIf=\"(editableColumnDefinitions?.length || 0) > 0\" [matMenuTriggerFor]=\"editableDefinitionMenu\">\n <mat-icon>view_column</mat-icon>\n </mad-icon-button>\n <!-- column view: multiple definitions -->\n <mad-icon-button *ngIf=\"(viewableColumnDefinitions?.length || 0) > 0\" [matMenuTriggerFor]=\"viewableDefinitionMenu\">\n <mat-icon>preview</mat-icon>\n </mad-icon-button>\n </div>\n\n <!-- Pagination -->\n <mat-paginator\n [style.display]=\"paginationEnabled ? 'block' : 'none'\"\n [length]=\"pageLength\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"onPageEvent($event)\"\n showFirstLastButtons\n >\n </mat-paginator>\n</div>\n\n<!-- No data alert -->\n<ng-template #noData>\n <div data-cy=\"no-data-block\" class=\"noDataText\">\n <div class=\"mad-datatable-spinner-wrapper\" *ngIf=\"loading\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n {{ translateLabels ? (noDataText | translate) : noDataText }}\n </div>\n</ng-template>\n\n<!-- default cell template -->\n<ng-template #defaultCellTemplate let-element=\"element\" let-column=\"column\">\n <span>\n {{ element[column.dataPropertyName] }}\n </span>\n</ng-template>\n\n<!-- custom cell templates injected from parent -->\n<ng-content></ng-content>\n", styles: [":host{display:flex;flex-direction:column;min-height:112px;flex:1 1 auto;background-color:#fff}.datatable-vertical-stretch-to-parent{flex:1;max-height:100%;width:100%;display:flex;flex-direction:column}.datatable-max-height-500{max-height:500px}.datatable-max-height-300{max-height:300px}.datatable-max-height,.datatable-max-height-500,.datatable-max-height-300{flex:1;width:100%;display:flex;flex-direction:column}.datatable{overflow:auto;flex:1 1 auto;height:100%;position:relative;width:100%}.datatable table{width:100%;min-height:140px;max-height:100%}.datatable table th,.datatable table td{width:auto;text-overflow:ellipsis;white-space:nowrap}.datatable table th{overflow:visible}.datatable table td{overflow:hidden}.layout-fixed table{table-layout:fixed}.layout-fixed table th{font-weight:700}.layout-fixed table td{white-space:normal;word-wrap:break-word}.text-right{text-align:right!important;padding-right:24px!important}.table-action-group{margin-right:.5em;margin-bottom:.5em}.row-action-cell{width:48px!important;padding-left:8px!important}.no-action-cell{width:8px!important;padding:0}.noDataText{width:100%;text-align:center;position:relative}.noDataText.columnBasedFilter{padding-top:10px}.mad-datatable-action-bar{display:flex;justify-content:space-between;align-items:baseline}.mad-datatable-checkbox-container{margin-right:8px;margin-left:8px}.mad-datatable-spinner-wrapper{background-color:#fff;opacity:.8;position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:99999;pointer-events:unset}.mad-data-table-expandable-row{height:0;display:contents;padding:0}.mad-data-table-expandable-row td{border-top-color:transparent;border-bottom-color:transparent}.mad-data-table-expandable-area{overflow:hidden;display:flex;width:100%}.mad-data-table-bottom-area{display:flex;flex-direction:row}.mad-data-table-bottom-area .mad-data-table-bottom-info-area{display:flex;flex:1}.mat-mdc-header-row th{position:sticky;top:0;background-color:#fff;z-index:1}.no-pointer-events{pointer-events:none}.active-column-definition{color:#000;background-color:#f5f5f5}.mad-dt-child-cell{color:#0009}\n"] }]
|
|
3134
|
+
], providers: [DATA_TABLE_PERSISTENCE_SERVICE_PROVIDER, MAD_DATA_TABL_GLOBAL_CONFIGURATION_PROVIDER], template: "<div data-cy=\"table-action-bar\" class=\"mad-datatable-action-bar\">\n <!-- Table actions: displayed before the table -->\n <div *ngIf=\"tableActions?.length || (filterMode === 'COLUMN_BASED' && showDeleteFilterAction)\">\n <mad-button-group *ngFor=\"let actionGroup of tableActions\" class=\"table-action-group\">\n <mad-outline-button\n [hidden]=\"isHidden(tableAction)\"\n [disabled]=\"isDisabled(tableAction)\"\n *ngFor=\"let tableAction of actionGroup\"\n (click)=\"onActionEvent(tableAction)\"\n >\n {{ translateLabels ? (tableAction.label | translate) : tableAction.label }}\n {{ getSelectedCount(tableAction.type) }}\n </mad-outline-button>\n </mad-button-group>\n </div>\n <ng-container *ngIf=\"filterMode === 'COLUMN_BASED' && showDeleteFilterAction\">\n <mat-icon fontSet=\"material-icons-outlined\" class=\"delete-filter-action\" color=\"primary\" (click)=\"onDeleteFilter()\"\n >filter_alt_off</mat-icon\n >\n </ng-container>\n <mat-form-field data-cy=\"filter-input\" *ngIf=\"filterMode === 'TABLE_BASED'\">\n <mat-label>{{ translateLabels ? (filterLabel | translate) : filterLabel }}</mat-label>\n <input matInput autocomplete=\"off\" (keyup)=\"onTableBasedFilterEvent($event)\" placeholder=\"{{ filterPlaceholder }}\" />\n </mat-form-field>\n</div>\n\n<!-- Row action menu -->\n<mat-menu #rowActionMenu=\"matMenu\">\n <ng-template matMenuContent let-element=\"element\">\n <ng-container *ngFor=\"let rowAction of rowActions\">\n <button\n data-cy=\"row-action-menu-button\"\n *ngIf=\"!isHidden(rowAction)\"\n mat-menu-item\n class=\"row-action\"\n (click)=\"onRowEvent($event, element, rowAction)\"\n [disabled]=\"isDisabled(rowAction)\"\n >\n {{ translateLabels ? (rowAction.label | translate) : rowAction.label }}\n </button>\n </ng-container>\n </ng-template>\n</mat-menu>\n\n<!-- editable definition menu -->\n<mat-menu #editableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n <button\n *ngFor=\"let definition of editableColumnDefinitions\"\n mat-menu-item\n class=\"row-action\"\n (click)=\"onColumnSettings(definition)\"\n [ngClass]=\"{ 'active-column-definition': isCurrentDefinition(definition) }\"\n >\n {{ translateLabels ? (definition.label | translate) : definition.label }}\n </button>\n </ng-template>\n</mat-menu>\n\n<!-- viewable definition menu -->\n<mat-menu #viewableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n <button\n *ngFor=\"let definition of viewableColumnDefinitions\"\n mat-menu-item\n class=\"row-action\"\n (click)=\"onViewDefinition(definition)\"\n [ngClass]=\"{ 'active-column-definition': isCurrentDefinition(definition) }\"\n >\n {{ translateLabels ? (definition.label | translate) : definition.label }}\n </button>\n </ng-template>\n</mat-menu>\n\n<!-- Table -->\n<div\n *ngIf=\"filterMode === 'COLUMN_BASED' || showEmptyTable || !!dataSource.filteredData?.length; else noData\"\n class=\"datatable\"\n [class]=\"tableClass\"\n>\n <div class=\"mad-datatable-spinner-wrapper\" *ngIf=\"loading\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n <table\n [id]=\"id\"\n mat-table\n [dataSource]=\"dataSource\"\n matSort\n (matSortChange)=\"onSortingEvent($event)\"\n madFilter\n (madFilterChange)=\"onColumnBasedFilterEvent($event)\"\n [multiTemplateDataRows]=\"!!expandableDef\"\n >\n <!-- Row actions column-->\n <ng-container [matColumnDef]=\"ACTION_COLUMN_NAME\">\n <th scope=\"col\" mat-header-cell *matHeaderCellDef [ngClass]=\"showActionColumn ? 'row-action-cell' : 'no-action-cell'\">\n <!-- BATCH: master checkbox -->\n <div *ngIf=\"selectionEmitMode !== 'NONE' && selectionMode === 'BATCH'\" class=\"mad-datatable-checkbox-container\">\n <mat-checkbox (change)=\"onToggleSelectAll()\" [checked]=\"allSelected\"> </mat-checkbox>\n </div>\n <!-- SINGLE / NONE: nothing in header row -->\n </th>\n <td mat-cell *matCellDef=\"let element\" [ngClass]=\"showActionColumn ? 'row-action-cell' : 'no-action-cell'\">\n <!-- BATCH: row checkbox -->\n <div *ngIf=\"showCheckbox(element)\" class=\"mad-datatable-checkbox-container\" (click)=\"onRowEvent($event, element)\">\n <mat-checkbox class=\"no-pointer-events\" [checked]=\"isSelected(element.rowId)\"> </mat-checkbox>\n </div>\n <!-- SINGLE: row action menu icon -->\n <mad-icon-button\n data-cy=\"row-action-button\"\n *ngIf=\"showRowActionIcon(element) && hasVisibleRowActions(element)\"\n [matMenuTriggerData]=\"{ element: element }\"\n [matMenuTriggerFor]=\"rowActionMenu\"\n (click)=\"onSelectionEvent(element.rowId)\"\n >\n <mat-icon>more_vert</mat-icon>\n </mad-icon-button>\n <!-- SINGLE: row radio button -->\n <div *ngIf=\"showRadioButton(element)\" class=\"mad-datatable-checkbox-container\" (click)=\"onRowEvent($event, element)\">\n <mat-radio-button class=\"no-pointer-events\" [checked]=\"isSelected(element.rowId)\"> </mat-radio-button>\n </div>\n <!-- EXPANDABLE: row is expandable/collapsable -->\n <mad-icon-button *ngIf=\"showExpandableButton(element)\" (click)=\"onExpand($event, element)\">\n <mat-icon *ngIf=\"expandedElement !== element\">keyboard_arrow_down</mat-icon>\n <mat-icon *ngIf=\"expandedElement === element\">keyboard_arrow_up</mat-icon>\n </mad-icon-button>\n <!-- NONE: nothing -->\n </td>\n </ng-container>\n <!-- Cell definitions and rows with injected cells -->\n <ng-container *ngFor=\"let column of columns\" [matColumnDef]=\"column.id\">\n <!-- header cell to be injected -->\n <ng-container [ngSwitch]=\"getDataTableHeaderType(column)\">\n <ng-container *ngSwitchCase=\"'SORT'\">\n <th\n scope=\"col\"\n mat-header-cell\n *matHeaderCellDef\n [class.text-right]=\"column.isRightAligned\"\n mat-sort-header=\"{{ column.orderByName ? column.orderByName : column.dataPropertyName }}\"\n [arrowPosition]=\"column.isRightAligned ? 'before' : 'after'\"\n >\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n <ng-container *ngSwitchCase=\"'FILTER'\">\n <th\n scope=\"col\"\n mat-header-cell\n *matHeaderCellDef\n [class.text-right]=\"column.isRightAligned\"\n mad-filter-header=\"{{ column.dataPropertyName }}\"\n [madFilterColumnRightAligned]=\"column.isRightAligned\"\n [madFilterOptions]=\"column.filterParams?.filterOptions\"\n >\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n <ng-container *ngSwitchCase=\"'SORT_AND_FILTER'\">\n <th\n scope=\"col\"\n mat-header-cell\n *matHeaderCellDef\n [class.text-right]=\"column.isRightAligned\"\n mat-sort-header=\"{{ column.orderByName ? column.orderByName : column.dataPropertyName }}\"\n [arrowPosition]=\"column.isRightAligned ? 'before' : 'after'\"\n mad-filter-header=\"{{ column.dataPropertyName }}\"\n [madFilterColumnRightAligned]=\"column.isRightAligned\"\n [madFilterOptions]=\"column.filterParams?.filterOptions\"\n >\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <th scope=\"col\" mat-header-cell *matHeaderCellDef [class.text-right]=\"column.isRightAligned\">\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n </ng-container>\n </ng-container>\n\n <!-- data cell to be injected -->\n <td\n mat-cell\n *matCellDef=\"let element\"\n [class.text-right]=\"column.isRightAligned\"\n [class.mad-dt-child-cell]=\"element.parentId\"\n [ngSwitch]=\"column.transformer\"\n (click)=\"!disableRowClick && onRowEvent($event, element)\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n getCustomCellTemplate(column.id) || defaultCellTemplate;\n context: { column: column, element: element, $implicit: element }\n \"\n ></ng-container>\n </td>\n </ng-container>\n\n <!-- Expanded Content Column - The row is made up of this one column that spans across all columns -->\n <ng-container *ngIf=\"!!expandableDef\" [matColumnDef]=\"expandableColumnDef\">\n <td mat-cell *matCellDef=\"let element\" [attr.colspan]=\"columns.length + 1\">\n <div class=\"mad-data-table-expandable-area\" [@detailExpand]=\"element === expandedElement ? 'expanded' : 'collapsed'\">\n <ng-container\n *ngTemplateOutlet=\"\n getCustomExpandableTemplate() || defaultCellTemplate;\n context: { column: element, element: element, $implicit: element }\n \"\n ></ng-container>\n </div>\n </td>\n </ng-container>\n\n <!-- header row where cells will be injected -->\n <tr mat-header-row *matHeaderRowDef=\"columnIds\"></tr>\n <!-- data row where cells will be injected -->\n <tr\n mat-row\n [class.clickable-table-row]=\"!row.parentId && selectionEmitMode !== 'NONE'\"\n *matRowDef=\"let row; columns: columnIds\"\n (click)=\"onExpand($event, row)\"\n ></tr>\n <ng-container *ngIf=\"!!expandableDef\">\n <tr mat-row *matRowDef=\"let element; columns: [expandableColumnDef]\" class=\"mad-data-table-expandable-row\"></tr>\n </ng-container>\n <tr class=\"mat-row\" *matNoDataRow>\n <td class=\"mat-cell noDataText columnBasedFilter\" [attr.colspan]=\"columnIds.length\">\n {{ translateLabels ? (noDataText | translate) : noDataText }}\n </td>\n </tr>\n </table>\n</div>\n<div data-cy=\"table-bottom-area\" class=\"mad-data-table-bottom-area\">\n <div data-cy=\"definition-button-block\" class=\"mad-data-table-bottom-info-area\">\n <!-- column settings: 1 definition -->\n <mad-icon-button *ngIf=\"editableColumnDefinitions?.length === 1\" (click)=\"onColumnSettings()\">\n <mat-icon class=\"material-icons-outlined\">view_column</mat-icon>\n </mad-icon-button>\n <!-- column settings: multiple definitions -->\n <mad-icon-button *ngIf=\"(editableColumnDefinitions?.length || 0) > 0\" [matMenuTriggerFor]=\"editableDefinitionMenu\">\n <mat-icon>view_column</mat-icon>\n </mad-icon-button>\n <!-- column view: multiple definitions -->\n <mad-icon-button *ngIf=\"(viewableColumnDefinitions?.length || 0) > 0\" [matMenuTriggerFor]=\"viewableDefinitionMenu\">\n <mat-icon>preview</mat-icon>\n </mad-icon-button>\n </div>\n\n <!-- Pagination -->\n <mat-paginator\n [style.display]=\"paginationEnabled ? 'block' : 'none'\"\n [length]=\"pageLength\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"onPageEvent($event)\"\n showFirstLastButtons\n >\n </mat-paginator>\n</div>\n\n<!-- No data alert -->\n<ng-template #noData>\n <div data-cy=\"no-data-block\" class=\"noDataText\">\n <div class=\"mad-datatable-spinner-wrapper\" *ngIf=\"loading\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n {{ translateLabels ? (noDataText | translate) : noDataText }}\n </div>\n</ng-template>\n\n<!-- default cell template -->\n<ng-template #defaultCellTemplate let-element=\"element\" let-column=\"column\">\n <span>\n {{ element[column.dataPropertyName] }}\n </span>\n</ng-template>\n\n<!-- custom cell templates injected from parent -->\n<ng-content></ng-content>\n", styles: [":host{display:flex;flex-direction:column;min-height:112px;flex:1 1 auto;background-color:#fff}.datatable-vertical-stretch-to-parent{flex:1;max-height:100%;width:100%;display:flex;flex-direction:column}.datatable-max-height-500{max-height:500px}.datatable-max-height-300{max-height:300px}.datatable-max-height,.datatable-max-height-500,.datatable-max-height-300{flex:1;width:100%;display:flex;flex-direction:column}.datatable{overflow:auto;flex:1 1 auto;height:100%;position:relative;width:100%}.datatable table{width:100%;min-height:140px;max-height:100%}.datatable table th,.datatable table td{width:auto;text-overflow:ellipsis;white-space:nowrap}.datatable table th{overflow:visible}.datatable table td{overflow:hidden}.layout-fixed table{table-layout:fixed}.layout-fixed table th{font-weight:700}.layout-fixed table td{white-space:normal;word-wrap:break-word}.text-right{text-align:right!important;padding-right:24px!important}.table-action-group{margin-right:.5em;margin-bottom:.5em}.row-action-cell{width:48px!important;padding-left:8px!important}.no-action-cell{width:8px!important;padding:0}.noDataText{width:100%;text-align:center;position:relative}.noDataText.columnBasedFilter{padding-top:10px}.mad-datatable-action-bar{display:flex;justify-content:space-between;align-items:baseline}.mad-datatable-checkbox-container{margin-right:8px;margin-left:8px}.mad-datatable-spinner-wrapper{background-color:#fff;opacity:.8;position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:99999;pointer-events:unset}.mad-data-table-expandable-row{height:0;display:contents;padding:0}.mad-data-table-expandable-row td{border-top-color:transparent;border-bottom-color:transparent}.mad-data-table-expandable-area{overflow:hidden;display:flex;width:100%}.mad-data-table-bottom-area{display:flex;flex-direction:row}.mad-data-table-bottom-area .mad-data-table-bottom-info-area{display:flex;flex:1}.mat-mdc-header-row th{position:sticky;top:0;background-color:#fff;z-index:1}.no-pointer-events{pointer-events:none}.active-column-definition{color:#000;background-color:#f5f5f5}.mad-dt-child-cell{color:#0009}\n"] }]
|
|
3165
3135
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$4.MatDialog }, { type: DataTablePersistenceService, decorators: [{
|
|
3166
3136
|
type: Inject,
|
|
3167
3137
|
args: [MAD_DATA_TABLE_PERSISTENCE_SERVICE]
|
|
@@ -3333,15 +3303,15 @@ class StepHeaderComponent extends CdkStepHeader {
|
|
|
3333
3303
|
}
|
|
3334
3304
|
return '';
|
|
3335
3305
|
}
|
|
3336
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3337
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3306
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: StepHeaderComponent, deps: [{ token: i1$5.FocusMonitor }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3307
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: StepHeaderComponent, isStandalone: true, selector: "mad-step-header", inputs: { color: "color", index: "index", label: "label", state: "state", errorMessage: "errorMessage", selected: "selected", active: "active", optional: "optional", hasError: "hasError", completed: "completed", closed: "closed" }, host: { attributes: { "role": "tab" }, classAttribute: "mad-step-header" }, usesInheritance: true, ngImport: i0, template: "<div\n class=\"header\"\n [style.background]=\"this.selected && !this.closed ? '#d8e2e9' : '#ffffff'\"\n [ngClass]=\"this.hasError ? 'error-border' : 'check-border'\"\n>\n <div [ngClass]=\"this.getCssForState()\"></div>\n <div class=\"header-label\">\n <mat-icon class=\"material-icons-outlined\">\n {{ this.selected && !this.closed ? 'keyboard_arrow_down' : 'keyboard_arrow_right' }}\n </mat-icon>\n </div>\n <div *ngIf=\"this.completed || this.hasError\" class=\"header-label\">\n <mat-icon [ngClass]=\"this.completed ? 'green-check' : 'red-error'\">\n {{ getIcon() }}\n </mat-icon>\n </div>\n <span data-testid=\"step-number\" *ngIf=\"!this.hasError && !this.completed\" class=\"header-label\">{{ this.index + 1 + '.' }}</span>\n <div data-testid=\"step-label\" class=\"header-label\">{{ this.label }}</div>\n</div>\n", styles: [".header{overflow:hidden;outline:var(--warn-color);cursor:pointer;box-sizing:content-box;-webkit-tap-highlight-color:transparent;border:1px solid lightgrey;width:100%;height:62px;flex-direction:row;box-sizing:border-box;display:flex;gap:1em}.header-label{align-items:center;display:flex}.step-state-complete{width:5px;background:green}.step-state-error{width:5px;background:var(--warn-color)}.step-state-neutral{width:5px;background:#d3d3d3}.green-check{color:green}.red-error{color:var(--warn-color)}.check-border{border-color:#d3d3d3}.error-border{border-color:var(--warn-color)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
3338
3308
|
}
|
|
3339
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3309
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: StepHeaderComponent, decorators: [{
|
|
3340
3310
|
type: Component,
|
|
3341
3311
|
args: [{ selector: 'mad-step-header', inputs: ['color'], host: {
|
|
3342
3312
|
class: 'mad-step-header',
|
|
3343
3313
|
role: 'tab',
|
|
3344
|
-
}, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgClass, MatIconModule, NgIf], template: "<div\n class=\"header\"\n [style.background]=\"this.selected && !this.closed ? '#d8e2e9' : '#ffffff'\"\n [ngClass]=\"this.hasError ? 'error-border' : 'check-border'\"\n>\n <div [ngClass]=\"this.getCssForState()\"></div>\n <div class=\"header-label\">\n <mat-icon class=\"material-icons-outlined\">\n {{ this.selected && !this.closed ? 'keyboard_arrow_down' : 'keyboard_arrow_right' }}\n </mat-icon>\n </div>\n <div *ngIf=\"this.completed || this.hasError\" class=\"header-label\">\n <mat-icon [ngClass]=\"this.completed ? 'green-check' : 'red-error'\">\n {{ getIcon() }}\n </mat-icon>\n </div>\n <span data-testid=\"step-number\" *ngIf=\"!this.hasError && !this.completed\" class=\"header-label\">{{ this.index + 1 + '.' }}</span>\n <div data-testid=\"step-label\" class=\"header-label\">{{ this.label }}</div>\n</div>\n", styles: [".header{overflow:hidden;outline:var(--warn-color);cursor:pointer;box-sizing:content-box;-webkit-tap-highlight-color:transparent;border:1px solid lightgrey;width:100%;height:62px;flex-direction:row;box-sizing:border-box;display:flex;gap:1em}.header-label{align-items:center;display:flex}.step-state-complete{width:5px;background:green}.step-state-error{width:5px;background:var(--warn-color)}.step-state-neutral{width:5px;background
|
|
3314
|
+
}, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgClass, MatIconModule, NgIf], template: "<div\n class=\"header\"\n [style.background]=\"this.selected && !this.closed ? '#d8e2e9' : '#ffffff'\"\n [ngClass]=\"this.hasError ? 'error-border' : 'check-border'\"\n>\n <div [ngClass]=\"this.getCssForState()\"></div>\n <div class=\"header-label\">\n <mat-icon class=\"material-icons-outlined\">\n {{ this.selected && !this.closed ? 'keyboard_arrow_down' : 'keyboard_arrow_right' }}\n </mat-icon>\n </div>\n <div *ngIf=\"this.completed || this.hasError\" class=\"header-label\">\n <mat-icon [ngClass]=\"this.completed ? 'green-check' : 'red-error'\">\n {{ getIcon() }}\n </mat-icon>\n </div>\n <span data-testid=\"step-number\" *ngIf=\"!this.hasError && !this.completed\" class=\"header-label\">{{ this.index + 1 + '.' }}</span>\n <div data-testid=\"step-label\" class=\"header-label\">{{ this.label }}</div>\n</div>\n", styles: [".header{overflow:hidden;outline:var(--warn-color);cursor:pointer;box-sizing:content-box;-webkit-tap-highlight-color:transparent;border:1px solid lightgrey;width:100%;height:62px;flex-direction:row;box-sizing:border-box;display:flex;gap:1em}.header-label{align-items:center;display:flex}.step-state-complete{width:5px;background:green}.step-state-error{width:5px;background:var(--warn-color)}.step-state-neutral{width:5px;background:#d3d3d3}.green-check{color:green}.red-error{color:var(--warn-color)}.check-border{border-color:#d3d3d3}.error-border{border-color:var(--warn-color)}\n"] }]
|
|
3345
3315
|
}], ctorParameters: () => [{ type: i1$5.FocusMonitor }, { type: i0.ElementRef }], propDecorators: { index: [{
|
|
3346
3316
|
type: Input
|
|
3347
3317
|
}], label: [{
|
|
@@ -3442,10 +3412,10 @@ class StepComponent extends CdkStep {
|
|
|
3442
3412
|
this.state = STEP_STATE.ERROR;
|
|
3443
3413
|
}
|
|
3444
3414
|
}
|
|
3445
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3446
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3415
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: StepComponent, deps: [{ token: forwardRef(() => StepperComponent) }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3416
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: StepComponent, isStandalone: true, selector: "mad-step", outputs: { onNext: "onNext", onDone: "onDone", onHeaderClick: "onHeaderClick" }, providers: [{ provide: CdkStep, useExisting: StepComponent }], usesInheritance: true, ngImport: i0, template: "<ng-template let-last=\"last\" let-nextBtnLbl=\"nextBtnLbl\" let-doneBtnLbl=\"doneBtnLbl\">\n <div class=\"step-container\">\n <div class=\"step-content\">\n <ng-content></ng-content>\n </div>\n <div class=\"step-buttons\">\n <div *ngIf=\"!last\">\n <mad-primary-button data-cy=\"next-step-button\" (click)=\"next()\">{{ nextBtnLbl }}</mad-primary-button>\n </div>\n <div *ngIf=\"last\">\n <mad-primary-button data-cy=\"complete-step-button\" (click)=\"completeLast()\">{{ doneBtnLbl }}</mad-primary-button>\n </div>\n </div>\n </div>\n</ng-template>\n", styles: [".stepper-vertical{display:block}.mat-vertical-stepper-header{display:flex;align-items:center;border:none!important}.mat-vertical-stepper-header .mat-step-icon{margin-right:12px}.vertical-content-container{border:none}[dir=rtl] .vertical-content-container{margin-left:0;margin-right:36px}.vertical-stepper-content{overflow:hidden;outline:0}.vertical-content{padding:0 24px}.step-container{border-left:1px solid lightgrey;border-right:1px solid lightgrey;border-bottom:1px solid lightgrey;flex-direction:column;box-sizing:border-box;display:flex}.step-content,.step-buttons{padding:2em}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PrimaryButtonComponent, selector: "mad-primary-button", inputs: ["type", "disabled", "title"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
3447
3417
|
}
|
|
3448
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3418
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: StepComponent, decorators: [{
|
|
3449
3419
|
type: Component,
|
|
3450
3420
|
args: [{ selector: 'mad-step', providers: [{ provide: CdkStep, useExisting: StepComponent }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgIf, PrimaryButtonComponent], template: "<ng-template let-last=\"last\" let-nextBtnLbl=\"nextBtnLbl\" let-doneBtnLbl=\"doneBtnLbl\">\n <div class=\"step-container\">\n <div class=\"step-content\">\n <ng-content></ng-content>\n </div>\n <div class=\"step-buttons\">\n <div *ngIf=\"!last\">\n <mad-primary-button data-cy=\"next-step-button\" (click)=\"next()\">{{ nextBtnLbl }}</mad-primary-button>\n </div>\n <div *ngIf=\"last\">\n <mad-primary-button data-cy=\"complete-step-button\" (click)=\"completeLast()\">{{ doneBtnLbl }}</mad-primary-button>\n </div>\n </div>\n </div>\n</ng-template>\n", styles: [".stepper-vertical{display:block}.mat-vertical-stepper-header{display:flex;align-items:center;border:none!important}.mat-vertical-stepper-header .mat-step-icon{margin-right:12px}.vertical-content-container{border:none}[dir=rtl] .vertical-content-container{margin-left:0;margin-right:36px}.vertical-stepper-content{overflow:hidden;outline:0}.vertical-content{padding:0 24px}.step-container{border-left:1px solid lightgrey;border-right:1px solid lightgrey;border-bottom:1px solid lightgrey;flex-direction:column;box-sizing:border-box;display:flex}.step-content,.step-buttons{padding:2em}\n"] }]
|
|
3451
3421
|
}], ctorParameters: () => [{ type: StepperComponent, decorators: [{
|
|
@@ -3470,7 +3440,7 @@ class StepperComponent extends CdkStepper {
|
|
|
3470
3440
|
}
|
|
3471
3441
|
ngOnInit() {
|
|
3472
3442
|
// Only linear stepper implementation is supported
|
|
3473
|
-
|
|
3443
|
+
this.linear = true;
|
|
3474
3444
|
}
|
|
3475
3445
|
ngAfterContentInit() {
|
|
3476
3446
|
super.ngAfterContentInit();
|
|
@@ -3498,10 +3468,10 @@ class StepperComponent extends CdkStepper {
|
|
|
3498
3468
|
_stepIsNavigable(index, step) {
|
|
3499
3469
|
return step.completed || this.selectedIndex === index || !this.linear;
|
|
3500
3470
|
}
|
|
3501
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3502
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3471
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: StepperComponent, deps: [{ token: i1$6.Directionality, optional: true }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3472
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: StepperComponent, isStandalone: true, selector: "mad-stepper", inputs: { nextButtonLabel: "nextButtonLabel", doneButtonLabel: "doneButtonLabel" }, outputs: { animationDone: "animationDone" }, host: { attributes: { "role": "tablist" }, properties: { "class.stepper-vertical": "true", "attr.aria-orientation": "\"vertical\"" } }, providers: [{ provide: CdkStepper, useExisting: StepperComponent }], queries: [{ propertyName: "_steps", predicate: StepComponent, descendants: true }], viewQueries: [{ propertyName: "_stepHeader", predicate: StepHeaderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- Vertical stepper -->\n<ng-container>\n <div data-cy=\"step-container\" *ngFor=\"let step of steps; let i = index; let isLast = last; let isFirst = first\">\n <ng-container [ngTemplateOutlet]=\"stepTemplate\" [ngTemplateOutletContext]=\"{ step: step, i: i }\"></ng-container>\n <div class=\"vertical-content-container\" [class.mat-stepper-vertical-line]=\"!isLast\">\n <div\n class=\"vertical-stepper-content\"\n role=\"tabpanel\"\n [@stepTransition]=\"_getAnimationDirection(i)\"\n (@stepTransition.done)=\"_animationDone.next($event)\"\n [id]=\"_getStepContentId(i)\"\n [attr.aria-labelledby]=\"_getStepLabelId(i)\"\n [attr.aria-expanded]=\"selectedIndex === i\"\n >\n <div data-cy=\"stepper-content\" class=\"vertical-content\">\n <ng-container\n [ngTemplateOutlet]=\"step.content\"\n [ngTemplateOutletContext]=\"{\n step: step,\n i: i,\n last: isLast,\n first: isFirst,\n nextBtnLbl: this.nextButtonLabel,\n doneBtnLbl: this.doneButtonLabel\n }\"\n ></ng-container>\n </div>\n </div>\n </div>\n </div>\n</ng-container>\n\n<ng-template let-step=\"step\" let-i=\"i\" #stepTemplate>\n <mad-step-header\n class=\"mat-vertical-stepper-header\"\n (click)=\"step.selectAndMarkAsTouched(i)\"\n (keydown)=\"_onKeydown($event)\"\n [tabIndex]=\"_getFocusIndex() === i ? 0 : -1\"\n [id]=\"_getStepLabelId(i)\"\n [attr.aria-posinset]=\"i + 1\"\n [attr.aria-setsize]=\"steps.length\"\n [attr.aria-controls]=\"_getStepContentId(i)\"\n [attr.aria-selected]=\"selectedIndex == i\"\n [attr.aria-label]=\"step.ariaLabel || null\"\n [attr.aria-labelledby]=\"!step.ariaLabel && step.ariaLabelledby ? step.ariaLabelledby : null\"\n [attr.aria-disabled]=\"_stepIsNavigable(i, step) ? null : true\"\n [index]=\"i\"\n [completed]=\"step.completed\"\n [hasError]=\"step.hasError\"\n [state]=\"_getIndicatorType(i, step.state)\"\n [label]=\"step.stepLabel || step.label\"\n [selected]=\"selectedIndex === i\"\n [active]=\"_stepIsNavigable(i, step)\"\n [optional]=\"step.optional\"\n [closed]=\"step.stepClosed\"\n [errorMessage]=\"step.errorMessage\"\n ></mad-step-header>\n</ng-template>\n", styles: [".stepper-vertical{display:block}.mat-vertical-stepper-header{display:flex;align-items:center;border:none!important}.mat-vertical-stepper-header .mat-step-icon{margin-right:12px}.vertical-content-container{border:none}[dir=rtl] .vertical-content-container{margin-left:0;margin-right:36px}.vertical-stepper-content{overflow:hidden;outline:0}.vertical-content{padding:0 24px}.step-container{border-left:1px solid lightgrey;border-right:1px solid lightgrey;border-bottom:1px solid lightgrey;flex-direction:column;box-sizing:border-box;display:flex}.step-content,.step-buttons{padding:2em}\n"], dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: StepHeaderComponent, selector: "mad-step-header", inputs: ["color", "index", "label", "state", "errorMessage", "selected", "active", "optional", "hasError", "completed", "closed"] }], animations: [madStepperAnimations.verticalStepTransition], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
3503
3473
|
}
|
|
3504
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3474
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: StepperComponent, decorators: [{
|
|
3505
3475
|
type: Component,
|
|
3506
3476
|
args: [{ selector: 'mad-stepper', host: {
|
|
3507
3477
|
'[class.stepper-vertical]': 'true',
|
|
@@ -3525,8 +3495,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
3525
3495
|
}] } });
|
|
3526
3496
|
|
|
3527
3497
|
class StepperModule {
|
|
3528
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3529
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
3498
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: StepperModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
3499
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: StepperModule, imports: [CommonModule,
|
|
3530
3500
|
MatButtonModule,
|
|
3531
3501
|
MatIconModule,
|
|
3532
3502
|
CdkStepperModule,
|
|
@@ -3534,7 +3504,7 @@ class StepperModule {
|
|
|
3534
3504
|
StepperComponent,
|
|
3535
3505
|
StepHeaderComponent,
|
|
3536
3506
|
StepComponent], exports: [StepperComponent, StepHeaderComponent, StepComponent] }); }
|
|
3537
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
3507
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: StepperModule, imports: [CommonModule,
|
|
3538
3508
|
MatButtonModule,
|
|
3539
3509
|
MatIconModule,
|
|
3540
3510
|
CdkStepperModule,
|
|
@@ -3543,7 +3513,7 @@ class StepperModule {
|
|
|
3543
3513
|
StepHeaderComponent,
|
|
3544
3514
|
StepComponent] }); }
|
|
3545
3515
|
}
|
|
3546
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3516
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: StepperModule, decorators: [{
|
|
3547
3517
|
type: NgModule,
|
|
3548
3518
|
args: [{
|
|
3549
3519
|
imports: [
|
|
@@ -3561,62 +3531,62 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
3561
3531
|
}] });
|
|
3562
3532
|
|
|
3563
3533
|
class ContentHeaderComponent {
|
|
3564
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3565
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3534
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ContentHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3535
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: ContentHeaderComponent, isStandalone: true, selector: "mad-content-header", ngImport: i0, template: "<div class=\"content-header\">\n <ng-content></ng-content>\n</div>\n", styles: [".content-header{padding-right:.5rem;background-color:var(--background-color)}\n"] }); }
|
|
3566
3536
|
}
|
|
3567
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3537
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ContentHeaderComponent, decorators: [{
|
|
3568
3538
|
type: Component,
|
|
3569
3539
|
args: [{ selector: 'mad-content-header', standalone: true, template: "<div class=\"content-header\">\n <ng-content></ng-content>\n</div>\n", styles: [".content-header{padding-right:.5rem;background-color:var(--background-color)}\n"] }]
|
|
3570
3540
|
}] });
|
|
3571
3541
|
|
|
3572
3542
|
class ContentPanelContainerComponent {
|
|
3573
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3574
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3543
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ContentPanelContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3544
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: ContentPanelContainerComponent, isStandalone: true, selector: "mad-content-panel-container", ngImport: i0, template: "<div class=\"content-panel-sidebar-wrapper\">\n <ng-content select=\"mad-content-panel-container-sidebar\"></ng-content>\n <div class=\"content-panel-outer-wrapper\">\n <ng-content select=\"mad-content-panel-container-content\"></ng-content>\n <ng-content select=\"mad-content-panel-container-footer\"></ng-content>\n </div>\n</div>\n", styles: [":host{position:relative;overflow:hidden;display:flex;flex:1 1 auto;min-height:.05rem;background-color:var(--background-color)}.content-panel-outer-wrapper{display:flex;flex:1 1 auto;flex-direction:column;text-overflow:ellipsis}.content-panel-sidebar-wrapper{width:100%;display:flex;flex:1 1 auto;flex-direction:row}\n"] }); }
|
|
3575
3545
|
}
|
|
3576
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3546
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ContentPanelContainerComponent, decorators: [{
|
|
3577
3547
|
type: Component,
|
|
3578
|
-
args: [{ selector: 'mad-content-panel-container', standalone: true, template: "<div class=\"content-panel-sidebar-wrapper\">\n <ng-content select=\"mad-content-panel-container-sidebar\"></ng-content>\n <div class=\"content-panel-outer-wrapper\">\n <ng-content select=\"mad-content-panel-container-content\"></ng-content>\n <ng-content select=\"mad-content-panel-container-footer\"></ng-content>\n </div>\n</div>\n", styles: [":host{position:relative;overflow:hidden;display:flex;flex:1 1 auto;min-height:.05rem;background-color:var(--background-color)}.content-panel-outer-wrapper{display:flex;flex:1 1 auto;flex-direction:column;text-overflow:ellipsis
|
|
3548
|
+
args: [{ selector: 'mad-content-panel-container', standalone: true, template: "<div class=\"content-panel-sidebar-wrapper\">\n <ng-content select=\"mad-content-panel-container-sidebar\"></ng-content>\n <div class=\"content-panel-outer-wrapper\">\n <ng-content select=\"mad-content-panel-container-content\"></ng-content>\n <ng-content select=\"mad-content-panel-container-footer\"></ng-content>\n </div>\n</div>\n", styles: [":host{position:relative;overflow:hidden;display:flex;flex:1 1 auto;min-height:.05rem;background-color:var(--background-color)}.content-panel-outer-wrapper{display:flex;flex:1 1 auto;flex-direction:column;text-overflow:ellipsis}.content-panel-sidebar-wrapper{width:100%;display:flex;flex:1 1 auto;flex-direction:row}\n"] }]
|
|
3579
3549
|
}] });
|
|
3580
3550
|
|
|
3581
3551
|
class ContentPanelContainerContentComponent {
|
|
3582
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3583
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3552
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ContentPanelContainerContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3553
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: ContentPanelContainerContentComponent, isStandalone: true, selector: "mad-content-panel-container-content", ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{flex:1 1 auto;overflow-y:auto;border-top:.05rem solid #cccccc;padding:1rem}\n"] }); }
|
|
3584
3554
|
}
|
|
3585
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3555
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ContentPanelContainerContentComponent, decorators: [{
|
|
3586
3556
|
type: Component,
|
|
3587
3557
|
args: [{ selector: 'mad-content-panel-container-content', standalone: true, template: "<ng-content></ng-content>\n", styles: [":host{flex:1 1 auto;overflow-y:auto;border-top:.05rem solid #cccccc;padding:1rem}\n"] }]
|
|
3588
3558
|
}] });
|
|
3589
3559
|
|
|
3590
3560
|
class ContentPanelContainerFooterComponent {
|
|
3591
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3592
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3561
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ContentPanelContainerFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3562
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: ContentPanelContainerFooterComponent, isStandalone: true, selector: "mad-content-panel-container-footer", ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{border-top:.05rem solid #cccccc;padding:.25rem 1rem;display:flex;flex:0 0 auto;align-items:center;min-height:2rem;width:auto}\n"] }); }
|
|
3593
3563
|
}
|
|
3594
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3564
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ContentPanelContainerFooterComponent, decorators: [{
|
|
3595
3565
|
type: Component,
|
|
3596
|
-
args: [{ selector: 'mad-content-panel-container-footer', standalone: true, template: "<ng-content></ng-content>\n", styles: [":host{border-top:.05rem solid #cccccc;padding:.25rem 1rem;display:flex;flex:0 0 auto;align-items:center;min-height:2rem}\n"] }]
|
|
3566
|
+
args: [{ selector: 'mad-content-panel-container-footer', standalone: true, template: "<ng-content></ng-content>\n", styles: [":host{border-top:.05rem solid #cccccc;padding:.25rem 1rem;display:flex;flex:0 0 auto;align-items:center;min-height:2rem;width:auto}\n"] }]
|
|
3597
3567
|
}] });
|
|
3598
3568
|
|
|
3599
3569
|
class ContentPanelContainerSidebarComponent {
|
|
3600
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3601
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3570
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ContentPanelContainerSidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3571
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: ContentPanelContainerSidebarComponent, isStandalone: true, selector: "mad-content-panel-container-sidebar", ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{border-top:.05rem solid #cccccc;min-height:2rem;display:flex;flex:0 0 auto}\n"] }); }
|
|
3602
3572
|
}
|
|
3603
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3573
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ContentPanelContainerSidebarComponent, decorators: [{
|
|
3604
3574
|
type: Component,
|
|
3605
3575
|
args: [{ selector: 'mad-content-panel-container-sidebar', standalone: true, template: "<ng-content></ng-content>\n", styles: [":host{border-top:.05rem solid #cccccc;min-height:2rem;display:flex;flex:0 0 auto}\n"] }]
|
|
3606
3576
|
}] });
|
|
3607
3577
|
|
|
3608
3578
|
class MainContainerComponent {
|
|
3609
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3610
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3579
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MainContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3580
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: MainContainerComponent, isStandalone: true, selector: "mad-main-container", ngImport: i0, template: "<div class=\"main-container\">\n <ng-content select=\"mad-content-header\"></ng-content>\n <ng-content select=\"mad-flowbar\"></ng-content>\n <ng-content select=\"mad-content-panel-container\"></ng-content>\n</div>\n", styles: [".main-container{height:100%;display:flex;flex-direction:column}\n"] }); }
|
|
3611
3581
|
}
|
|
3612
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3582
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MainContainerComponent, decorators: [{
|
|
3613
3583
|
type: Component,
|
|
3614
3584
|
args: [{ selector: 'mad-main-container', standalone: true, template: "<div class=\"main-container\">\n <ng-content select=\"mad-content-header\"></ng-content>\n <ng-content select=\"mad-flowbar\"></ng-content>\n <ng-content select=\"mad-content-panel-container\"></ng-content>\n</div>\n", styles: [".main-container{height:100%;display:flex;flex-direction:column}\n"] }]
|
|
3615
3585
|
}] });
|
|
3616
3586
|
|
|
3617
3587
|
class ContentPanelModule {
|
|
3618
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3619
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
3588
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ContentPanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
3589
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ContentPanelModule, imports: [CommonModule,
|
|
3620
3590
|
ContentHeaderComponent,
|
|
3621
3591
|
ContentPanelContainerComponent,
|
|
3622
3592
|
ContentPanelContainerContentComponent,
|
|
@@ -3628,9 +3598,9 @@ class ContentPanelModule {
|
|
|
3628
3598
|
ContentPanelContainerFooterComponent,
|
|
3629
3599
|
ContentPanelContainerSidebarComponent,
|
|
3630
3600
|
MainContainerComponent] }); }
|
|
3631
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
3601
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ContentPanelModule, imports: [CommonModule] }); }
|
|
3632
3602
|
}
|
|
3633
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3603
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ContentPanelModule, decorators: [{
|
|
3634
3604
|
type: NgModule,
|
|
3635
3605
|
args: [{
|
|
3636
3606
|
imports: [
|
|
@@ -3816,10 +3786,10 @@ class FlowbarComponent {
|
|
|
3816
3786
|
const index = this.getCurrentIndex();
|
|
3817
3787
|
return this._steps.slice(index + 1, this._steps.length).find((step) => step.enabled);
|
|
3818
3788
|
}
|
|
3819
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3820
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3789
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: FlowbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3790
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: FlowbarComponent, isStandalone: true, selector: "mad-flowbar", inputs: { _steps: ["steps", "_steps"], _activeStep: ["activeStep", "_activeStep"] }, outputs: { _activeStepChange: "activeStepChange", _headerClick: "headerClick" }, viewQueries: [{ propertyName: "stepper", first: true, predicate: ["stepper"], descendants: true }], ngImport: i0, template: "<div class=\"stepper-container\">\n <mat-horizontal-stepper #stepper [selectedIndex]=\"this.getIndexForActiveStep()\" (click)=\"triggerClick()\">\n <mat-step *ngFor=\"let step of _steps\" [aria-labelledby]=\"!step.enabled ? 'disabled' : null\">\n <ng-template matStepLabel>\n <div class=\"step-header-overlay\" *ngIf=\"this._headerClick.observers.length > 0\" (click)=\"headerClick($event, step)\"></div>\n <span>{{ step.label }}</span>\n </ng-template>\n </mat-step>\n </mat-horizontal-stepper>\n</div>\n", styles: [".stepper-container{display:flex;padding:0 1rem}::ng-deep .mat-stepper-horizontal .mat-horizontal-stepper-header{padding:0;height:auto}::ng-deep .mat-step-header[aria-labelledby=disabled]{pointer-events:none!important;cursor:not-allowed}::ng-deep .mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 10px}::ng-deep .mat-stepper-horizontal .mat-stepper-horizontal-line{margin:0 5px;border-top-width:4px}.step-header-overlay{position:absolute;width:100%;height:100%;right:0;top:0}\n"], dependencies: [{ kind: "ngmodule", type: MatStepperModule }, { kind: "component", type: i1$7.MatStep, selector: "mat-step", inputs: ["color"], exportAs: ["matStep"] }, { kind: "directive", type: i1$7.MatStepLabel, selector: "[matStepLabel]" }, { kind: "component", type: i1$7.MatStepper, selector: "mat-stepper, mat-vertical-stepper, mat-horizontal-stepper, [matStepper]", inputs: ["disableRipple", "color", "labelPosition", "headerPosition", "animationDuration"], outputs: ["animationDone"], exportAs: ["matStepper", "matVerticalStepper", "matHorizontalStepper"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
3821
3791
|
}
|
|
3822
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3792
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: FlowbarComponent, decorators: [{
|
|
3823
3793
|
type: Component,
|
|
3824
3794
|
args: [{ selector: 'mad-flowbar', standalone: true, imports: [MatStepperModule, NgFor, NgIf], template: "<div class=\"stepper-container\">\n <mat-horizontal-stepper #stepper [selectedIndex]=\"this.getIndexForActiveStep()\" (click)=\"triggerClick()\">\n <mat-step *ngFor=\"let step of _steps\" [aria-labelledby]=\"!step.enabled ? 'disabled' : null\">\n <ng-template matStepLabel>\n <div class=\"step-header-overlay\" *ngIf=\"this._headerClick.observers.length > 0\" (click)=\"headerClick($event, step)\"></div>\n <span>{{ step.label }}</span>\n </ng-template>\n </mat-step>\n </mat-horizontal-stepper>\n</div>\n", styles: [".stepper-container{display:flex;padding:0 1rem}::ng-deep .mat-stepper-horizontal .mat-horizontal-stepper-header{padding:0;height:auto}::ng-deep .mat-step-header[aria-labelledby=disabled]{pointer-events:none!important;cursor:not-allowed}::ng-deep .mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 10px}::ng-deep .mat-stepper-horizontal .mat-stepper-horizontal-line{margin:0 5px;border-top-width:4px}.step-header-overlay{position:absolute;width:100%;height:100%;right:0;top:0}\n"] }]
|
|
3825
3795
|
}], propDecorators: { _steps: [{
|
|
@@ -3840,11 +3810,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
3840
3810
|
}] } });
|
|
3841
3811
|
|
|
3842
3812
|
class FlowbarModule {
|
|
3843
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3844
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
3845
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
3813
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: FlowbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
3814
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: FlowbarModule, imports: [CommonModule, MatStepperModule, FlowbarComponent], exports: [FlowbarComponent] }); }
|
|
3815
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: FlowbarModule, imports: [CommonModule, MatStepperModule, FlowbarComponent] }); }
|
|
3846
3816
|
}
|
|
3847
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3817
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: FlowbarModule, decorators: [{
|
|
3848
3818
|
type: NgModule,
|
|
3849
3819
|
args: [{
|
|
3850
3820
|
imports: [CommonModule, MatStepperModule, FlowbarComponent],
|
|
@@ -3859,10 +3829,10 @@ class SidebarComponent {
|
|
|
3859
3829
|
toggleCollapse() {
|
|
3860
3830
|
this.collapsed = !this.collapsed;
|
|
3861
3831
|
}
|
|
3862
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3863
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3832
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: SidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3833
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: SidebarComponent, isStandalone: true, selector: "mad-sidebar", inputs: { collapsed: "collapsed" }, ngImport: i0, template: "<div [class.collapsed]=\"collapsed\" class=\"sidebar-wrapper\">\n <div class=\"sidebar-header\">\n <button (click)=\"toggleCollapse()\" color=\"basic\" mat-button>\n <mat-icon>{{ collapsed ? 'keyboard_double_arrow_right' : 'keyboard_double_arrow_left' }}</mat-icon>\n </button>\n </div>\n <div class=\"item-list\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [".sidebar-wrapper{background:var(--panel-background-color);min-height:100%;display:flex;flex-direction:column;border-right:1px solid var(--panel-border-color);transition:width .1s ease-in}.sidebar-wrapper:not(.collapsed){min-width:239px}.sidebar-wrapper.collapsed{width:64px}.sidebar-wrapper .sidebar-header{display:flex;flex-direction:row-reverse;border-bottom:1px solid var(--panel-border-color)}.sidebar-wrapper .sidebar-header button{color:#707070}.sidebar-wrapper.collapsed .item-list{display:none}.sidebar-wrapper .item-list{display:flex;flex-direction:column;margin-top:16px}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
|
|
3864
3834
|
}
|
|
3865
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3835
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: SidebarComponent, decorators: [{
|
|
3866
3836
|
type: Component,
|
|
3867
3837
|
args: [{ selector: 'mad-sidebar', standalone: true, imports: [MatButtonModule, MatIconModule], template: "<div [class.collapsed]=\"collapsed\" class=\"sidebar-wrapper\">\n <div class=\"sidebar-header\">\n <button (click)=\"toggleCollapse()\" color=\"basic\" mat-button>\n <mat-icon>{{ collapsed ? 'keyboard_double_arrow_right' : 'keyboard_double_arrow_left' }}</mat-icon>\n </button>\n </div>\n <div class=\"item-list\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [".sidebar-wrapper{background:var(--panel-background-color);min-height:100%;display:flex;flex-direction:column;border-right:1px solid var(--panel-border-color);transition:width .1s ease-in}.sidebar-wrapper:not(.collapsed){min-width:239px}.sidebar-wrapper.collapsed{width:64px}.sidebar-wrapper .sidebar-header{display:flex;flex-direction:row-reverse;border-bottom:1px solid var(--panel-border-color)}.sidebar-wrapper .sidebar-header button{color:#707070}.sidebar-wrapper.collapsed .item-list{display:none}.sidebar-wrapper .item-list{display:flex;flex-direction:column;margin-top:16px}\n"] }]
|
|
3868
3838
|
}], propDecorators: { collapsed: [{
|
|
@@ -3870,20 +3840,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
3870
3840
|
}] } });
|
|
3871
3841
|
|
|
3872
3842
|
class SidebarItemComponent {
|
|
3873
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3874
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3843
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: SidebarItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3844
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: SidebarItemComponent, isStandalone: true, selector: "[mad-sidebar-item]", ngImport: i0, template: "<span class=\"content-wrapper\">\n <ng-content></ng-content>\n</span>\n<span class=\"focus-overlay\"></span>\n", styles: ["[mad-sidebar-item]{padding:9px 24px 8px;color:var(--panel-color);position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:300;letter-spacing:.5px}[mad-sidebar-item] .focus-overlay{inset:0;position:absolute;pointer-events:none;border-radius:inherit}[mad-sidebar-item] .content-wrapper{width:100%}[mad-sidebar-item].active-sidebar-item{background-color:var(--panel-select-background)}[mad-sidebar-item]:hover .focus-overlay{background-color:#000;opacity:.04}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
3875
3845
|
}
|
|
3876
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3846
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: SidebarItemComponent, decorators: [{
|
|
3877
3847
|
type: Component,
|
|
3878
3848
|
args: [{ selector: '[mad-sidebar-item]', encapsulation: ViewEncapsulation.None, standalone: true, template: "<span class=\"content-wrapper\">\n <ng-content></ng-content>\n</span>\n<span class=\"focus-overlay\"></span>\n", styles: ["[mad-sidebar-item]{padding:9px 24px 8px;color:var(--panel-color);position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:300;letter-spacing:.5px}[mad-sidebar-item] .focus-overlay{inset:0;position:absolute;pointer-events:none;border-radius:inherit}[mad-sidebar-item] .content-wrapper{width:100%}[mad-sidebar-item].active-sidebar-item{background-color:var(--panel-select-background)}[mad-sidebar-item]:hover .focus-overlay{background-color:#000;opacity:.04}\n"] }]
|
|
3879
3849
|
}] });
|
|
3880
3850
|
|
|
3881
3851
|
class SidebarModule {
|
|
3882
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3883
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
3884
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
3852
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: SidebarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
3853
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: SidebarModule, imports: [CommonModule, MatIconModule, MatButtonModule, SidebarComponent, SidebarItemComponent], exports: [SidebarComponent, SidebarItemComponent] }); }
|
|
3854
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: SidebarModule, imports: [CommonModule, MatIconModule, MatButtonModule, SidebarComponent] }); }
|
|
3885
3855
|
}
|
|
3886
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3856
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: SidebarModule, decorators: [{
|
|
3887
3857
|
type: NgModule,
|
|
3888
3858
|
args: [{
|
|
3889
3859
|
exports: [SidebarComponent, SidebarItemComponent],
|
|
@@ -3917,12 +3887,12 @@ class SidebarLayoutComponent {
|
|
|
3917
3887
|
goToPreviousPage() {
|
|
3918
3888
|
this.location.back();
|
|
3919
3889
|
}
|
|
3920
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3921
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3890
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: SidebarLayoutComponent, deps: [{ token: i0.ViewContainerRef }, { token: i1$8.Router }, { token: i2$4.Location }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3891
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: SidebarLayoutComponent, isStandalone: true, selector: "mad-sidebar-layout", inputs: { title: "title", hasBackButton: "hasBackButton", sideBarItems: "sideBarItems", headerContent: "headerContent", actionGroup: "actionGroup", content: "content", footer: "footer" }, ngImport: i0, template: "<mad-main-container class=\"w-full\">\n <mad-content-header>\n <ng-container *ngIf=\"headerContentPortal; else defaultActionHeader\">\n <ng-template [cdkPortalOutlet]=\"headerContentPortal\"></ng-template>\n </ng-container>\n <ng-template #defaultActionHeader>\n <div class=\"sidebar-wrapper default-header-wrapper\">\n <div class=\"back-and-title\">\n <button class=\"back-button\" *ngIf=\"hasBackButton\">\n <mat-icon (click)=\"goToPreviousPage()\" color=\"primary\"> arrow_back</mat-icon>\n </button>\n <h2 class=\"title\">\n {{ title }}\n </h2>\n </div>\n <ng-template [cdkPortalOutlet]=\"actionGroupPortal\"></ng-template>\n </div>\n </ng-template>\n </mad-content-header>\n <mad-content-panel-container>\n <mad-content-panel-container-sidebar *ngIf=\"sideBarItemsPortal\">\n <ng-template [cdkPortalOutlet]=\"sideBarItemsPortal\"></ng-template>\n </mad-content-panel-container-sidebar>\n <mad-content-panel-container-content *ngIf=\"contentPortal\">\n <ng-template [cdkPortalOutlet]=\"contentPortal\"></ng-template>\n </mad-content-panel-container-content>\n <mad-content-panel-container-footer *ngIf=\"footerPortal\">\n <ng-template [cdkPortalOutlet]=\"footerPortal\"></ng-template>\n </mad-content-panel-container-footer>\n </mad-content-panel-container>\n</mad-main-container>\n", styles: [".w-full{width:100%}.back-button{background-color:transparent;border:0;cursor:pointer}.back-button:hover{background-color:var(--background-color)}.sidebar-wrapper{height:64px;background-color:var(--background-color)}.default-header-wrapper{display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;white-space:nowrap}.back-and-title{display:flex;align-items:center;gap:1em;overflow:hidden}.back-and-title .title{margin:0;text-overflow:ellipsis;white-space:nowrap;overflow:inherit}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ContentPanelModule }, { kind: "component", type: ContentHeaderComponent, selector: "mad-content-header" }, { kind: "component", type: ContentPanelContainerComponent, selector: "mad-content-panel-container" }, { kind: "component", type: ContentPanelContainerContentComponent, selector: "mad-content-panel-container-content" }, { kind: "component", type: ContentPanelContainerFooterComponent, selector: "mad-content-panel-container-footer" }, { kind: "component", type: ContentPanelContainerSidebarComponent, selector: "mad-content-panel-container-sidebar" }, { kind: "component", type: MainContainerComponent, selector: "mad-main-container" }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i9$1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: RouterModule }] }); }
|
|
3922
3892
|
}
|
|
3923
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3893
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: SidebarLayoutComponent, decorators: [{
|
|
3924
3894
|
type: Component,
|
|
3925
|
-
args: [{ selector: 'mad-sidebar-layout', standalone: true, imports: [CommonModule, ContentPanelModule, PortalModule, MatIconModule, RouterModule], template: "<mad-main-container class=\"w-full\">\n <mad-content-header>\n <ng-container *ngIf=\"headerContentPortal; else defaultActionHeader\">\n <ng-template [cdkPortalOutlet]=\"headerContentPortal\"></ng-template>\n </ng-container>\n <ng-template #defaultActionHeader>\n
|
|
3895
|
+
args: [{ selector: 'mad-sidebar-layout', standalone: true, imports: [CommonModule, ContentPanelModule, PortalModule, MatIconModule, RouterModule], template: "<mad-main-container class=\"w-full\">\n <mad-content-header>\n <ng-container *ngIf=\"headerContentPortal; else defaultActionHeader\">\n <ng-template [cdkPortalOutlet]=\"headerContentPortal\"></ng-template>\n </ng-container>\n <ng-template #defaultActionHeader>\n <div class=\"sidebar-wrapper default-header-wrapper\">\n <div class=\"back-and-title\">\n <button class=\"back-button\" *ngIf=\"hasBackButton\">\n <mat-icon (click)=\"goToPreviousPage()\" color=\"primary\"> arrow_back</mat-icon>\n </button>\n <h2 class=\"title\">\n {{ title }}\n </h2>\n </div>\n <ng-template [cdkPortalOutlet]=\"actionGroupPortal\"></ng-template>\n </div>\n </ng-template>\n </mad-content-header>\n <mad-content-panel-container>\n <mad-content-panel-container-sidebar *ngIf=\"sideBarItemsPortal\">\n <ng-template [cdkPortalOutlet]=\"sideBarItemsPortal\"></ng-template>\n </mad-content-panel-container-sidebar>\n <mad-content-panel-container-content *ngIf=\"contentPortal\">\n <ng-template [cdkPortalOutlet]=\"contentPortal\"></ng-template>\n </mad-content-panel-container-content>\n <mad-content-panel-container-footer *ngIf=\"footerPortal\">\n <ng-template [cdkPortalOutlet]=\"footerPortal\"></ng-template>\n </mad-content-panel-container-footer>\n </mad-content-panel-container>\n</mad-main-container>\n", styles: [".w-full{width:100%}.back-button{background-color:transparent;border:0;cursor:pointer}.back-button:hover{background-color:var(--background-color)}.sidebar-wrapper{height:64px;background-color:var(--background-color)}.default-header-wrapper{display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;white-space:nowrap}.back-and-title{display:flex;align-items:center;gap:1em;overflow:hidden}.back-and-title .title{margin:0;text-overflow:ellipsis;white-space:nowrap;overflow:inherit}\n"] }]
|
|
3926
3896
|
}], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i1$8.Router }, { type: i2$4.Location }], propDecorators: { title: [{
|
|
3927
3897
|
type: Input
|
|
3928
3898
|
}], hasBackButton: [{
|
|
@@ -4050,10 +4020,10 @@ class ToolbarService {
|
|
|
4050
4020
|
clearMainActions() {
|
|
4051
4021
|
this.mainActions = [];
|
|
4052
4022
|
}
|
|
4053
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4054
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
4023
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ToolbarService, deps: [{ token: i1$8.Router }, { token: i2$5.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
4024
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ToolbarService, providedIn: 'root' }); }
|
|
4055
4025
|
}
|
|
4056
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4026
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ToolbarService, decorators: [{
|
|
4057
4027
|
type: Injectable,
|
|
4058
4028
|
args: [{
|
|
4059
4029
|
providedIn: 'root',
|
|
@@ -4111,10 +4081,10 @@ class ToolbarComponent {
|
|
|
4111
4081
|
hasImportantToolbarActions() {
|
|
4112
4082
|
return this.getToolbarActions().filter((value) => !!value.importantAction).length > 0;
|
|
4113
4083
|
}
|
|
4114
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4115
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
4084
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ToolbarComponent, deps: [{ token: i1$9.BreakpointObserver }, { token: i2$6.Title }, { token: ToolbarService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4085
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: ToolbarComponent, isStandalone: true, selector: "mad-toolbar", ngImport: i0, template: "<mat-toolbar class=\"content-toolbar\">\n <a data-cy=\"back-link-button\" [routerLink]=\"getBackAction().routerLink\" *ngIf=\"isRouterLink(getBackAction())\">\n <button [id]=\"'go-back'\" color=\"primary\" mat-icon-button class=\"go-back-button\">\n <mat-icon>{{ getBackAction().matIcon }}</mat-icon>\n </button>\n </a>\n <a data-cy=\"back-href-button\" [href]=\"getBackAction().href\" *ngIf=\"isAbsoluteLink(getBackAction())\">\n <button [id]=\"'go-back'\" class=\"go-back-button\" color=\"primary\" mat-icon-button>\n <mat-icon>{{ getBackAction().matIcon }}</mat-icon>\n </button>\n </a>\n <a data-cy=\"back-action-button\" (click)=\"getBackAction().action()\" *ngIf=\"isAction(getBackAction())\">\n <button [id]=\"'go-back'\" color=\"primary\" mat-icon-button class=\"go-back-button\">\n <mat-icon>{{ getBackAction().matIcon }}</mat-icon>\n </button>\n </a>\n\n <span class=\"toolbar-title\">{{ getTitle() }}</span>\n\n <ng-container *ngFor=\"let mainAction of getMainActions(); let i = index\">\n <ng-container *ngIf=\"hasPermission(mainAction) | async\">\n <div *ngIf=\"!(isHandset$ | async)\">\n <a data-cy=\"main-action-link-button\" [routerLink]=\"mainAction.routerLink\" *ngIf=\"isRouterLink(mainAction)\">\n <mad-primary-button [id]=\"mainAction.matIcon\" style=\"margin-left: 56px\" [matTooltip]=\"mainAction.tooltip\">\n <div class=\"action-button-content-container\">\n <mat-icon>{{ mainAction.matIcon }}</mat-icon>\n {{ mainAction.actionName }}\n </div>\n </mad-primary-button>\n </a>\n <a data-cy=\"main-action-button\" (click)=\"mainAction.action()\" *ngIf=\"isAction(mainAction)\">\n <mad-primary-button [id]=\"mainAction.matIcon\" style=\"margin-left: 56px\" [matTooltip]=\"mainAction.tooltip\">\n <div class=\"action-button-content-container\">\n <mat-icon>{{ mainAction.matIcon }}</mat-icon>\n {{ mainAction.actionName }}\n </div>\n </mad-primary-button>\n </a>\n </div>\n <div *ngIf=\"isHandset$ | async\">\n <mad-material-action-button\n data-cy=\"material-main-link-button\"\n *ngIf=\"isRouterLink(getBackAction())\"\n [actionName]=\"mainAction.actionName\"\n [icon]=\"mainAction.matIcon\"\n [liftHigher]=\"mainAction.liftHigherOnMobile\"\n [liftHigher2]=\"i > 0\"\n [routerLink]=\"mainAction.routerLink\"\n [id]=\"mainAction.matIcon\"\n />\n <mad-material-action-button\n data-cy=\"material-main-action-button\"\n *ngIf=\"isAction(getBackAction())\"\n [actionName]=\"mainAction.actionName\"\n [icon]=\"mainAction.matIcon\"\n [liftHigher]=\"mainAction.liftHigherOnMobile\"\n [liftHigher2]=\"i > 0\"\n (click)=\"mainAction.action()\"\n [id]=\"mainAction.matIcon\"\n />\n </div>\n </ng-container>\n </ng-container>\n\n <div class=\"right-aligned no-print\">\n <ng-container *ngFor=\"let action of getToolbarActions(); let i = index\">\n <ng-container *ngIf=\"hasPermission(action) | async\">\n <mad-icon-button\n data-cy=\"action-icon-button\"\n (click)=\"action.action()\"\n *ngIf=\"\n (!(isHandset$ | async) && !getToolbarActionsAlwaysAsMenu()) ||\n i < (getToolbarActions().length > 2 ? (hasImportantToolbarActions() ? 0 : 1) : 2) ||\n !!action.importantAction\n \"\n [id]=\"action.matIcon\"\n [matTooltip]=\"action.actionName\"\n type=\"button\"\n >\n <mat-icon\n [matBadgeColor]=\"action.badge ? action.badge.color : 'primary'\"\n matBadgePosition=\"below after\"\n [matBadge]=\"action.badge ? action.badge.value : null\"\n >{{ action.matIcon }}</mat-icon\n >\n </mad-icon-button>\n </ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"(isHandset$ | async) || getToolbarActionsAlwaysAsMenu()\">\n <ng-container *ngIf=\"getToolbarActions().length > 2\">\n <mad-icon-button data-cy=\"burger-button\" type=\"button\" [matMenuTriggerFor]=\"burgerMenu\" [matTooltip]=\"getToolbarActionsMenuTitle()\">\n <mat-icon\n matBadgeColor=\"warn\"\n [matBadge]=\"showBadgeForMenu() ? '⁠' : null\"\n matBadgeSize=\"small\"\n matBadgePosition=\"above after\"\n >more_vert\n </mat-icon>\n </mad-icon-button>\n <mat-menu #burgerMenu=\"matMenu\" class=\"no-print toolbar-menu\">\n <ng-container *ngFor=\"let action of getToolbarActions(); let i = index\">\n <ng-container *ngIf=\"!action.importantAction\">\n <ng-container *ngIf=\"hasPermission(action) | async\">\n <button\n data-cy=\"burger-menu-button\"\n *ngIf=\"i >= (hasImportantToolbarActions() ? 0 : 1)\"\n mat-menu-item\n (click)=\"action.action()\"\n [title]=\"action.actionName\"\n >\n <mat-icon\n color=\"primary\"\n [matBadgeColor]=\"action.badge ? action.badge.color : 'primary'\"\n [matBadge]=\"action.badge ? action.badge.value : null\"\n matBadgePosition=\"below after\"\n >{{ action.matIcon }}</mat-icon\n >\n {{ action.actionName }}\n </button>\n </ng-container>\n </ng-container>\n </ng-container>\n </mat-menu>\n </ng-container>\n </ng-container>\n </div>\n</mat-toolbar>\n", styles: ["mat-toolbar{background:#fff}.content-toolbar{height:57px;border-bottom:1px solid #dcdcdc}.right-aligned{overflow:hidden;margin-left:auto;margin-right:0}.go-back-button{padding-left:0;padding-right:0}.toolbar-title{margin-right:72px}::ng-deep .mat-badge-content{bottom:-7px!important;right:-7px!important}.action-button-content-container{display:flex;align-items:center;gap:5px}\n"], dependencies: [{ kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i4$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: PrimaryButtonComponent, selector: "mad-primary-button", inputs: ["type", "disabled", "title"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: MaterialActionButtonComponent, selector: "mad-material-action-button", inputs: ["actionName", "id", "icon", "routerLink", "liftHigher", "liftHigher2"] }, { kind: "component", type: IconButtonComponent, selector: "mad-icon-button", inputs: ["type", "disabled", "title"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i8.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i1$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
|
|
4116
4086
|
}
|
|
4117
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4087
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ToolbarComponent, decorators: [{
|
|
4118
4088
|
type: Component,
|
|
4119
4089
|
args: [{ selector: 'mad-toolbar', standalone: true, imports: [
|
|
4120
4090
|
MatToolbarModule,
|
|
@@ -4130,12 +4100,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
4130
4100
|
MatBadgeModule,
|
|
4131
4101
|
MatMenuModule,
|
|
4132
4102
|
AsyncPipe,
|
|
4133
|
-
], template: "<mat-toolbar class=\"content-toolbar\">\n <a data-cy=\"back-link-button\" [routerLink]=\"getBackAction().routerLink\" *ngIf=\"isRouterLink(getBackAction())\">\n <button [id]=\"'go-back'\" color=\"primary\" mat-icon-button class=\"go-back-button\">\n <mat-icon>{{ getBackAction().matIcon }}</mat-icon>\n </button>\n </a>\n <a data-cy=\"back-href-button\" [href]=\"getBackAction().href\" *ngIf=\"isAbsoluteLink(getBackAction())\">\n <button [id]=\"'go-back'\" class=\"go-back-button\" color=\"primary\" mat-icon-button>\n <mat-icon>{{ getBackAction().matIcon }}</mat-icon>\n </button>\n </a>\n <a data-cy=\"back-action-button\" (click)=\"getBackAction().action()\" *ngIf=\"isAction(getBackAction())\">\n <button [id]=\"'go-back'\" color=\"primary\" mat-icon-button class=\"go-back-button\">\n <mat-icon>{{ getBackAction().matIcon }}</mat-icon>\n </button>\n </a>\n\n <span class=\"toolbar-title\">{{ getTitle() }}</span>\n\n <ng-container *ngFor=\"let mainAction of getMainActions(); let i = index\">\n <ng-container *ngIf=\"hasPermission(mainAction) | async\">\n <div *ngIf=\"!(isHandset$ | async)\">\n <a data-cy=\"main-action-link-button\" [routerLink]=\"mainAction.routerLink\" *ngIf=\"isRouterLink(mainAction)\">\n <mad-primary-button [id]=\"mainAction.matIcon\" style=\"margin-left: 56px\" [matTooltip]=\"mainAction.tooltip\">\n <div class=\"action-button-content-container\">\n <mat-icon>{{ mainAction.matIcon }}</mat-icon>\n {{ mainAction.actionName }}\n </div>\n </mad-primary-button>\n </a>\n <a data-cy=\"main-action-button\" (click)=\"mainAction.action()\" *ngIf=\"isAction(mainAction)\">\n <mad-primary-button [id]=\"mainAction.matIcon\" style=\"margin-left: 56px\" [matTooltip]=\"mainAction.tooltip\">\n <div class=\"action-button-content-container\">\n <mat-icon>{{ mainAction.matIcon }}</mat-icon>\n {{ mainAction.actionName }}\n </div>\n </mad-primary-button>\n </a>\n </div>\n <div *ngIf=\"isHandset$ | async\">\n <mad-material-action-button\n data-cy=\"material-main-link-button\"\n *ngIf=\"isRouterLink(getBackAction())\"\n [actionName]=\"mainAction.actionName\"\n [icon]=\"mainAction.matIcon\"\n [liftHigher]=\"mainAction.liftHigherOnMobile\"\n [liftHigher2]=\"i > 0\"\n [routerLink]=\"mainAction.routerLink\"\n [id]=\"mainAction.matIcon\"\n />\n <mad-material-action-button\n data-cy=\"material-main-action-button\"\n *ngIf=\"isAction(getBackAction())\"\n [actionName]=\"mainAction.actionName\"\n [icon]=\"mainAction.matIcon\"\n [liftHigher]=\"mainAction.liftHigherOnMobile\"\n [liftHigher2]=\"i > 0\"\n (click)=\"mainAction.action()\"\n [id]=\"mainAction.matIcon\"\n />\n </div>\n </ng-container>\n </ng-container>\n\n <div class=\"right-aligned no-print\">\n <ng-container *ngFor=\"let action of getToolbarActions(); let i = index\">\n <ng-container *ngIf=\"hasPermission(action) | async\">\n <mad-icon-button
|
|
4103
|
+
], template: "<mat-toolbar class=\"content-toolbar\">\n <a data-cy=\"back-link-button\" [routerLink]=\"getBackAction().routerLink\" *ngIf=\"isRouterLink(getBackAction())\">\n <button [id]=\"'go-back'\" color=\"primary\" mat-icon-button class=\"go-back-button\">\n <mat-icon>{{ getBackAction().matIcon }}</mat-icon>\n </button>\n </a>\n <a data-cy=\"back-href-button\" [href]=\"getBackAction().href\" *ngIf=\"isAbsoluteLink(getBackAction())\">\n <button [id]=\"'go-back'\" class=\"go-back-button\" color=\"primary\" mat-icon-button>\n <mat-icon>{{ getBackAction().matIcon }}</mat-icon>\n </button>\n </a>\n <a data-cy=\"back-action-button\" (click)=\"getBackAction().action()\" *ngIf=\"isAction(getBackAction())\">\n <button [id]=\"'go-back'\" color=\"primary\" mat-icon-button class=\"go-back-button\">\n <mat-icon>{{ getBackAction().matIcon }}</mat-icon>\n </button>\n </a>\n\n <span class=\"toolbar-title\">{{ getTitle() }}</span>\n\n <ng-container *ngFor=\"let mainAction of getMainActions(); let i = index\">\n <ng-container *ngIf=\"hasPermission(mainAction) | async\">\n <div *ngIf=\"!(isHandset$ | async)\">\n <a data-cy=\"main-action-link-button\" [routerLink]=\"mainAction.routerLink\" *ngIf=\"isRouterLink(mainAction)\">\n <mad-primary-button [id]=\"mainAction.matIcon\" style=\"margin-left: 56px\" [matTooltip]=\"mainAction.tooltip\">\n <div class=\"action-button-content-container\">\n <mat-icon>{{ mainAction.matIcon }}</mat-icon>\n {{ mainAction.actionName }}\n </div>\n </mad-primary-button>\n </a>\n <a data-cy=\"main-action-button\" (click)=\"mainAction.action()\" *ngIf=\"isAction(mainAction)\">\n <mad-primary-button [id]=\"mainAction.matIcon\" style=\"margin-left: 56px\" [matTooltip]=\"mainAction.tooltip\">\n <div class=\"action-button-content-container\">\n <mat-icon>{{ mainAction.matIcon }}</mat-icon>\n {{ mainAction.actionName }}\n </div>\n </mad-primary-button>\n </a>\n </div>\n <div *ngIf=\"isHandset$ | async\">\n <mad-material-action-button\n data-cy=\"material-main-link-button\"\n *ngIf=\"isRouterLink(getBackAction())\"\n [actionName]=\"mainAction.actionName\"\n [icon]=\"mainAction.matIcon\"\n [liftHigher]=\"mainAction.liftHigherOnMobile\"\n [liftHigher2]=\"i > 0\"\n [routerLink]=\"mainAction.routerLink\"\n [id]=\"mainAction.matIcon\"\n />\n <mad-material-action-button\n data-cy=\"material-main-action-button\"\n *ngIf=\"isAction(getBackAction())\"\n [actionName]=\"mainAction.actionName\"\n [icon]=\"mainAction.matIcon\"\n [liftHigher]=\"mainAction.liftHigherOnMobile\"\n [liftHigher2]=\"i > 0\"\n (click)=\"mainAction.action()\"\n [id]=\"mainAction.matIcon\"\n />\n </div>\n </ng-container>\n </ng-container>\n\n <div class=\"right-aligned no-print\">\n <ng-container *ngFor=\"let action of getToolbarActions(); let i = index\">\n <ng-container *ngIf=\"hasPermission(action) | async\">\n <mad-icon-button\n data-cy=\"action-icon-button\"\n (click)=\"action.action()\"\n *ngIf=\"\n (!(isHandset$ | async) && !getToolbarActionsAlwaysAsMenu()) ||\n i < (getToolbarActions().length > 2 ? (hasImportantToolbarActions() ? 0 : 1) : 2) ||\n !!action.importantAction\n \"\n [id]=\"action.matIcon\"\n [matTooltip]=\"action.actionName\"\n type=\"button\"\n >\n <mat-icon\n [matBadgeColor]=\"action.badge ? action.badge.color : 'primary'\"\n matBadgePosition=\"below after\"\n [matBadge]=\"action.badge ? action.badge.value : null\"\n >{{ action.matIcon }}</mat-icon\n >\n </mad-icon-button>\n </ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"(isHandset$ | async) || getToolbarActionsAlwaysAsMenu()\">\n <ng-container *ngIf=\"getToolbarActions().length > 2\">\n <mad-icon-button data-cy=\"burger-button\" type=\"button\" [matMenuTriggerFor]=\"burgerMenu\" [matTooltip]=\"getToolbarActionsMenuTitle()\">\n <mat-icon\n matBadgeColor=\"warn\"\n [matBadge]=\"showBadgeForMenu() ? '⁠' : null\"\n matBadgeSize=\"small\"\n matBadgePosition=\"above after\"\n >more_vert\n </mat-icon>\n </mad-icon-button>\n <mat-menu #burgerMenu=\"matMenu\" class=\"no-print toolbar-menu\">\n <ng-container *ngFor=\"let action of getToolbarActions(); let i = index\">\n <ng-container *ngIf=\"!action.importantAction\">\n <ng-container *ngIf=\"hasPermission(action) | async\">\n <button\n data-cy=\"burger-menu-button\"\n *ngIf=\"i >= (hasImportantToolbarActions() ? 0 : 1)\"\n mat-menu-item\n (click)=\"action.action()\"\n [title]=\"action.actionName\"\n >\n <mat-icon\n color=\"primary\"\n [matBadgeColor]=\"action.badge ? action.badge.color : 'primary'\"\n [matBadge]=\"action.badge ? action.badge.value : null\"\n matBadgePosition=\"below after\"\n >{{ action.matIcon }}</mat-icon\n >\n {{ action.actionName }}\n </button>\n </ng-container>\n </ng-container>\n </ng-container>\n </mat-menu>\n </ng-container>\n </ng-container>\n </div>\n</mat-toolbar>\n", styles: ["mat-toolbar{background:#fff}.content-toolbar{height:57px;border-bottom:1px solid #dcdcdc}.right-aligned{overflow:hidden;margin-left:auto;margin-right:0}.go-back-button{padding-left:0;padding-right:0}.toolbar-title{margin-right:72px}::ng-deep .mat-badge-content{bottom:-7px!important;right:-7px!important}.action-button-content-container{display:flex;align-items:center;gap:5px}\n"] }]
|
|
4134
4104
|
}], ctorParameters: () => [{ type: i1$9.BreakpointObserver }, { type: i2$6.Title }, { type: ToolbarService }] });
|
|
4135
4105
|
|
|
4136
4106
|
class ToolbarModule {
|
|
4137
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4138
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
4107
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ToolbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
4108
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: ToolbarModule, imports: [CommonModule,
|
|
4139
4109
|
RouterModule,
|
|
4140
4110
|
MatMenuModule,
|
|
4141
4111
|
MatButtonModule,
|
|
@@ -4146,7 +4116,7 @@ class ToolbarModule {
|
|
|
4146
4116
|
ButtonModule,
|
|
4147
4117
|
MatBadgeModule,
|
|
4148
4118
|
ToolbarComponent], exports: [ToolbarComponent] }); }
|
|
4149
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
4119
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ToolbarModule, imports: [CommonModule,
|
|
4150
4120
|
RouterModule,
|
|
4151
4121
|
MatMenuModule,
|
|
4152
4122
|
MatButtonModule,
|
|
@@ -4158,7 +4128,7 @@ class ToolbarModule {
|
|
|
4158
4128
|
MatBadgeModule,
|
|
4159
4129
|
ToolbarComponent] }); }
|
|
4160
4130
|
}
|
|
4161
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4131
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: ToolbarModule, decorators: [{
|
|
4162
4132
|
type: NgModule,
|
|
4163
4133
|
args: [{
|
|
4164
4134
|
imports: [
|
|
@@ -4179,8 +4149,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
4179
4149
|
}] });
|
|
4180
4150
|
|
|
4181
4151
|
class MaterialAddonsModule {
|
|
4182
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4183
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
4152
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MaterialAddonsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
4153
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: MaterialAddonsModule, exports: [ReadOnlyFormFieldModule,
|
|
4184
4154
|
ButtonModule,
|
|
4185
4155
|
ToolbarModule,
|
|
4186
4156
|
MaterialActionButtonModule,
|
|
@@ -4189,7 +4159,7 @@ class MaterialAddonsModule {
|
|
|
4189
4159
|
QuickListModule,
|
|
4190
4160
|
ThrottleClickModule,
|
|
4191
4161
|
SidebarModule] }); }
|
|
4192
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
4162
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MaterialAddonsModule, imports: [ReadOnlyFormFieldModule,
|
|
4193
4163
|
ButtonModule,
|
|
4194
4164
|
ToolbarModule,
|
|
4195
4165
|
MaterialActionButtonModule,
|
|
@@ -4199,7 +4169,7 @@ class MaterialAddonsModule {
|
|
|
4199
4169
|
ThrottleClickModule,
|
|
4200
4170
|
SidebarModule] }); }
|
|
4201
4171
|
}
|
|
4202
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4172
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: MaterialAddonsModule, decorators: [{
|
|
4203
4173
|
type: NgModule,
|
|
4204
4174
|
args: [{
|
|
4205
4175
|
exports: [
|
|
@@ -4247,10 +4217,10 @@ class DragAndDropDirectiveDirective {
|
|
|
4247
4217
|
this.onFileDropped.emit(files);
|
|
4248
4218
|
}
|
|
4249
4219
|
}
|
|
4250
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4251
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
4220
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DragAndDropDirectiveDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
4221
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: DragAndDropDirectiveDirective, isStandalone: true, selector: "[madDragAndDrop]", outputs: { onFileDropped: "onFileDropped" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "ondrop($event)" }, properties: { "style.background-color": "this.background", "style.opacity": "this.opacity" } }, ngImport: i0 }); }
|
|
4252
4222
|
}
|
|
4253
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4223
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: DragAndDropDirectiveDirective, decorators: [{
|
|
4254
4224
|
type: Directive,
|
|
4255
4225
|
args: [{
|
|
4256
4226
|
selector: '[madDragAndDrop]',
|
|
@@ -4318,10 +4288,10 @@ class FileUploadComponent {
|
|
|
4318
4288
|
openFile(file) {
|
|
4319
4289
|
window.open(window.URL.createObjectURL(file));
|
|
4320
4290
|
}
|
|
4321
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4322
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
4291
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: FileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4292
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: FileUploadComponent, isStandalone: true, selector: "mad-file-upload", inputs: { id: "id", multiple: "multiple", accept: "accept", text: "text", showFileList: "showFileList" }, outputs: { fileEmitter: "fileEmitter", errorEmitter: "errorEmitter" }, ngImport: i0, template: "<mat-card\n (click)=\"fileInput.click()\"\n (onFileDropped)=\"uploadFile($event)\"\n class=\"uploadFileContainer\"\n madDragAndDrop\n id=\"uploadFileContainer\"\n>\n <input\n #fileInput\n (change)=\"uploadFile($event.target.files)\"\n (click)=\"fileInput.value = null\"\n [accept]=\"acceptForInput\"\n [id]=\"id\"\n [multiple]=\"multiple\"\n hidden\n type=\"file\"\n />\n <mat-card-content>\n <mat-icon>vertical_align_top</mat-icon>\n {{ text ? text : 'Upload' }}\n </mat-card-content>\n</mat-card>\n\n<ng-container *ngIf=\"showFileList\">\n <mat-chip-listbox>\n <mat-chip *ngFor=\"let file of fileList\" (click)=\"openFile(file)\" class=\"download\">{{ file.name }}</mat-chip>\n </mat-chip-listbox>\n</ng-container>\n", styles: [".uploadFileContainer{background-repeat:no-repeat;background-position:center;height:100px;margin:0;border:2px dashed var(--main-primary)}.uploadFileContainer:hover{cursor:pointer;background-color:var(--selection-background)!important;opacity:.8}.uploadFileContainer,.mat-mdc-card-content{display:flex;justify-content:center;align-items:center}.download{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i1$2.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i1$2.MatCardContent, selector: "mat-card-content" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: DragAndDropDirectiveDirective, selector: "[madDragAndDrop]", outputs: ["onFileDropped"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i4$3.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled", "tabIndex"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: i4$3.MatChipListbox, selector: "mat-chip-listbox", inputs: ["multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }] }); }
|
|
4323
4293
|
}
|
|
4324
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4294
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: FileUploadComponent, decorators: [{
|
|
4325
4295
|
type: Component,
|
|
4326
4296
|
args: [{ selector: 'mad-file-upload', standalone: true, imports: [CommonModule, MatCardModule, MatIconModule, ButtonModule, TranslateModule, DragAndDropDirectiveDirective, MatChipsModule], template: "<mat-card\n (click)=\"fileInput.click()\"\n (onFileDropped)=\"uploadFile($event)\"\n class=\"uploadFileContainer\"\n madDragAndDrop\n id=\"uploadFileContainer\"\n>\n <input\n #fileInput\n (change)=\"uploadFile($event.target.files)\"\n (click)=\"fileInput.value = null\"\n [accept]=\"acceptForInput\"\n [id]=\"id\"\n [multiple]=\"multiple\"\n hidden\n type=\"file\"\n />\n <mat-card-content>\n <mat-icon>vertical_align_top</mat-icon>\n {{ text ? text : 'Upload' }}\n </mat-card-content>\n</mat-card>\n\n<ng-container *ngIf=\"showFileList\">\n <mat-chip-listbox>\n <mat-chip *ngFor=\"let file of fileList\" (click)=\"openFile(file)\" class=\"download\">{{ file.name }}</mat-chip>\n </mat-chip-listbox>\n</ng-container>\n", styles: [".uploadFileContainer{background-repeat:no-repeat;background-position:center;height:100px;margin:0;border:2px dashed var(--main-primary)}.uploadFileContainer:hover{cursor:pointer;background-color:var(--selection-background)!important;opacity:.8}.uploadFileContainer,.mat-mdc-card-content{display:flex;justify-content:center;align-items:center}.download{width:100%}\n"] }]
|
|
4327
4297
|
}], propDecorators: { id: [{
|
|
@@ -4342,16 +4312,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
4342
4312
|
|
|
4343
4313
|
const VERSION = '17.3.4';
|
|
4344
4314
|
|
|
4315
|
+
const MAD_ALERT_DEFAULT_CONFIGURATION = new InjectionToken('mad-alert-configuration', {
|
|
4316
|
+
providedIn: 'root',
|
|
4317
|
+
factory: MAD_ALERT_DEFAULT_CONFIGURATION_FACTORY,
|
|
4318
|
+
});
|
|
4319
|
+
function MAD_ALERT_DEFAULT_CONFIGURATION_FACTORY() {
|
|
4320
|
+
return {
|
|
4321
|
+
size: 'medium',
|
|
4322
|
+
type: 'info',
|
|
4323
|
+
};
|
|
4324
|
+
}
|
|
4325
|
+
|
|
4345
4326
|
class AlertComponent {
|
|
4346
|
-
constructor() {
|
|
4347
|
-
this.type = 'info';
|
|
4348
|
-
this.message = '';
|
|
4349
|
-
this.size = 'medium';
|
|
4350
|
-
this.actionText = '';
|
|
4351
|
-
this.closeable = true;
|
|
4352
|
-
this.close = new EventEmitter();
|
|
4353
|
-
this.action = new EventEmitter();
|
|
4354
|
-
}
|
|
4355
4327
|
get icon() {
|
|
4356
4328
|
switch (this.type) {
|
|
4357
4329
|
case 'success':
|
|
@@ -4366,19 +4338,32 @@ class AlertComponent {
|
|
|
4366
4338
|
return '';
|
|
4367
4339
|
}
|
|
4368
4340
|
}
|
|
4341
|
+
constructor(alertConfig) {
|
|
4342
|
+
this.alertConfig = alertConfig;
|
|
4343
|
+
this.type = this.alertConfig.type;
|
|
4344
|
+
this.message = '';
|
|
4345
|
+
this.size = this.alertConfig.size;
|
|
4346
|
+
this.actionText = '';
|
|
4347
|
+
this.closeable = true;
|
|
4348
|
+
this.close = new EventEmitter();
|
|
4349
|
+
this.action = new EventEmitter();
|
|
4350
|
+
}
|
|
4369
4351
|
closeAlert() {
|
|
4370
4352
|
this.close.emit();
|
|
4371
4353
|
}
|
|
4372
4354
|
onAction() {
|
|
4373
4355
|
this.action.emit();
|
|
4374
4356
|
}
|
|
4375
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4376
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
4357
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AlertComponent, deps: [{ token: MAD_ALERT_DEFAULT_CONFIGURATION }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4358
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: AlertComponent, isStandalone: true, selector: "mad-alert", inputs: { type: "type", message: "message", size: "size", actionText: "actionText", closeable: "closeable" }, outputs: { close: "close", action: "action" }, ngImport: i0, template: "<div data-cy=\"alert\" class=\"alert\" [ngClass]=\"[type, size]\">\n <span data-cy=\"alert-icon\" class=\"icon\"\n ><mat-icon>{{ icon }}</mat-icon></span\n >\n <span data-cy=\"alert-message\" class=\"message\">{{ message }}</span>\n <ng-container *ngIf=\"actionText\">\n <span data-cy=\"alert-action-btn\" class=\"action-btn\" (click)=\"onAction()\">{{ actionText }}</span>\n </ng-container>\n <ng-container *ngIf=\"closeable\">\n <button mat-icon-button data-cy=\"alert-close-btn\" class=\"close-btn\" (click)=\"closeAlert()\">\n <mat-icon>close</mat-icon>\n </button>\n </ng-container>\n</div>\n", styles: [".alert{display:flex;align-items:center;padding:16px;border-radius:4px;margin:8px 0;font-size:14px;position:relative;border:1px solid transparent}.alert.small{padding:0 8px;font-size:14px}.alert.medium{padding:8px;font-size:16px}.alert.large{padding:12px 8px;font-size:18px}.alert .icon{margin-right:8px}.alert .message{flex:1}.alert .action-btn,.alert .close-btn{color:inherit;margin-left:auto;padding:0}.alert .action-btn{text-decoration:underline;cursor:pointer}.alert.success{background-color:var(--alert-success-background-color);border-color:var(--alert-success-border-color);color:var(--alert-success-text-color)}.alert.info{background-color:var(--alert-info-background-color);border-color:var(--alert-info-border-color);color:var(--alert-info-text-color)}.alert.warning{background-color:var(--alert-warning-background-color);border-color:var(--alert-warning-border-color);color:var(--alert-warning-text-color)}.alert.error{background-color:var(--alert-error-background-color);border-color:var(--alert-error-border-color);color:var(--alert-error-text-color)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }] }); }
|
|
4377
4359
|
}
|
|
4378
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4360
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AlertComponent, decorators: [{
|
|
4379
4361
|
type: Component,
|
|
4380
|
-
args: [{ selector: 'mad-alert', standalone: true, imports: [CommonModule, MatIconModule, MatButtonModule], template: "<div data-cy=\"alert\" class=\"alert\" [ngClass]=\"[type, size]\">\n <span data-cy=\"alert-icon\" class=\"icon\"><mat-icon>{{ icon }}</mat-icon></span>\n <span data-cy=\"alert-message\" class=\"message\">{{ message }}</span>\n <ng-container *ngIf=\"actionText\">\n <span data-cy=\"alert-action-btn\" class=\"action-btn\" (click)=\"onAction()\">{{ actionText }}</span>\n </ng-container>\n <ng-container *ngIf=\"closeable\">\n <button mat-icon-button data-cy=\"alert-close-btn\" class=\"close-btn\" (click)=\"closeAlert()\">\n <mat-icon>close</mat-icon>\n </button>\n </ng-container>\n</div>\n", styles: [".alert{display:flex;align-items:center;padding:16px;border-radius:4px;margin:8px 0;font-size:14px;position:relative;border:1px solid transparent}.alert.small{padding:0 8px;font-size:14px}.alert.medium{padding:8px;font-size:16px}.alert.large{padding:12px 8px;font-size:18px}.alert .icon{margin-right:8px}.alert .message{flex:1}.alert .action-btn,.alert .close-btn{color:inherit;margin-left:auto;padding:0}.alert .action-btn{text-decoration:underline;cursor:pointer}.alert.success{background-color:var(--alert-success-background-color);border-color:var(--alert-success-border-color);color:var(--alert-success-text-color)}.alert.info{background-color:var(--alert-info-background-color);border-color:var(--alert-info-border-color);color:var(--alert-info-text-color)}.alert.warning{background-color:var(--alert-warning-background-color);border-color:var(--alert-warning-border-color);color:var(--alert-warning-text-color)}.alert.error{background-color:var(--alert-error-background-color);border-color:var(--alert-error-border-color);color:var(--alert-error-text-color)}\n"] }]
|
|
4381
|
-
}],
|
|
4362
|
+
args: [{ selector: 'mad-alert', standalone: true, imports: [CommonModule, MatIconModule, MatButtonModule], template: "<div data-cy=\"alert\" class=\"alert\" [ngClass]=\"[type, size]\">\n <span data-cy=\"alert-icon\" class=\"icon\"\n ><mat-icon>{{ icon }}</mat-icon></span\n >\n <span data-cy=\"alert-message\" class=\"message\">{{ message }}</span>\n <ng-container *ngIf=\"actionText\">\n <span data-cy=\"alert-action-btn\" class=\"action-btn\" (click)=\"onAction()\">{{ actionText }}</span>\n </ng-container>\n <ng-container *ngIf=\"closeable\">\n <button mat-icon-button data-cy=\"alert-close-btn\" class=\"close-btn\" (click)=\"closeAlert()\">\n <mat-icon>close</mat-icon>\n </button>\n </ng-container>\n</div>\n", styles: [".alert{display:flex;align-items:center;padding:16px;border-radius:4px;margin:8px 0;font-size:14px;position:relative;border:1px solid transparent}.alert.small{padding:0 8px;font-size:14px}.alert.medium{padding:8px;font-size:16px}.alert.large{padding:12px 8px;font-size:18px}.alert .icon{margin-right:8px}.alert .message{flex:1}.alert .action-btn,.alert .close-btn{color:inherit;margin-left:auto;padding:0}.alert .action-btn{text-decoration:underline;cursor:pointer}.alert.success{background-color:var(--alert-success-background-color);border-color:var(--alert-success-border-color);color:var(--alert-success-text-color)}.alert.info{background-color:var(--alert-info-background-color);border-color:var(--alert-info-border-color);color:var(--alert-info-text-color)}.alert.warning{background-color:var(--alert-warning-background-color);border-color:var(--alert-warning-border-color);color:var(--alert-warning-text-color)}.alert.error{background-color:var(--alert-error-background-color);border-color:var(--alert-error-border-color);color:var(--alert-error-text-color)}\n"] }]
|
|
4363
|
+
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
4364
|
+
type: Inject,
|
|
4365
|
+
args: [MAD_ALERT_DEFAULT_CONFIGURATION]
|
|
4366
|
+
}] }], propDecorators: { type: [{
|
|
4382
4367
|
type: Input
|
|
4383
4368
|
}], message: [{
|
|
4384
4369
|
type: Input
|
|
@@ -4402,5 +4387,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImpor
|
|
|
4402
4387
|
* Generated bundle index. Do not edit.
|
|
4403
4388
|
*/
|
|
4404
4389
|
|
|
4405
|
-
export { AlertComponent, BaseQuickListComponent, ButtonModule, CardComponent, CardModule, ContentHeaderComponent, ContentPanelContainerComponent, ContentPanelContainerContentComponent, ContentPanelContainerFooterComponent, ContentPanelContainerSidebarComponent, ContentPanelModule, DangerButtonComponent, DataTableActionType, DataTableColumnsModalComponent, DataTableComponent, DataTablePersistenceService, DataTableTemplateCellDefinition, DataTableTemplateColumnDefinition, DataTableTemplateExpandableCellDefinition, DataTableTemplateExpandableColumnDefinition, FileUploadComponent, FlowbarComponent, FlowbarModule, IconButtonComponent, LinkButtonComponent, MAD_DATA_TABLE_GLOBAL_CONFIGURATION, MAD_DATA_TABLE_PERSISTENCE_SERVICE, MadBasicButton, MadButtonDirective, MadButtonGroupComponent, MainContainerComponent, MaterialActionButtonComponent, MaterialActionButtonModule, MaterialAddonsModule, NumberFormatService, NumericFieldDirective, NumericFieldModule, OutlineButtonComponent, PrimaryButtonComponent, QuickListCompactComponent, QuickListComponent, QuickListModule, ReactiveFormQuickListCompactComponent, ReactiveFormQuickListComponent, ReadOnlyFormFieldComponent, ReadOnlyFormFieldModule, ReadOnlyFormFieldWrapperComponent, SidebarComponent, SidebarItemComponent, SidebarLayoutComponent, SidebarModule, StepComponent, StepHeaderComponent, StepperComponent, StepperModule, TableComponent, TableModule, ThrottleClickDirective, ThrottleClickModule, ToolbarComponent, ToolbarModule, ToolbarService, VERSION, madStepperAnimations };
|
|
4390
|
+
export { AlertComponent, BaseQuickListComponent, ButtonModule, CardComponent, CardModule, ContentHeaderComponent, ContentPanelContainerComponent, ContentPanelContainerContentComponent, ContentPanelContainerFooterComponent, ContentPanelContainerSidebarComponent, ContentPanelModule, DangerButtonComponent, DataTableActionType, DataTableColumnsModalComponent, DataTableComponent, DataTablePersistenceService, DataTableTemplateCellDefinition, DataTableTemplateColumnDefinition, DataTableTemplateExpandableCellDefinition, DataTableTemplateExpandableColumnDefinition, FileUploadComponent, FlowbarComponent, FlowbarModule, IconButtonComponent, LinkButtonComponent, MAD_ALERT_DEFAULT_CONFIGURATION, MAD_ALERT_DEFAULT_CONFIGURATION_FACTORY, MAD_DATA_TABLE_GLOBAL_CONFIGURATION, MAD_DATA_TABLE_PERSISTENCE_SERVICE, MadBasicButton, MadButtonDirective, MadButtonGroupComponent, MainContainerComponent, MaterialActionButtonComponent, MaterialActionButtonModule, MaterialAddonsModule, NumberFormatService, NumericFieldDirective, NumericFieldModule, OutlineButtonComponent, PrimaryButtonComponent, QuickListCompactComponent, QuickListComponent, QuickListModule, ReactiveFormQuickListCompactComponent, ReactiveFormQuickListComponent, ReadOnlyFormFieldComponent, ReadOnlyFormFieldModule, ReadOnlyFormFieldWrapperComponent, SidebarComponent, SidebarItemComponent, SidebarLayoutComponent, SidebarModule, StepComponent, StepHeaderComponent, StepperComponent, StepperModule, TableComponent, TableModule, ThrottleClickDirective, ThrottleClickModule, ToolbarComponent, ToolbarModule, ToolbarService, VERSION, madStepperAnimations };
|
|
4406
4391
|
//# sourceMappingURL=porscheinformatik-material-addons.mjs.map
|