@porscheinformatik/material-addons 21.0.3 → 22.0.0
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 +46 -3
- package/fesm2022/porscheinformatik-material-addons.mjs +233 -231
- package/fesm2022/porscheinformatik-material-addons.mjs.map +1 -1
- package/package.json +2 -2
- package/themes/carcat-palettes.scss +137 -0
- package/themes/carcat.scss +26 -26
- package/themes/common/components/_button.scss +147 -0
- package/themes/common/components/_color-overrides.scss +33 -0
- package/themes/common/components/_flowbar.scss +27 -0
- package/themes/common/components/_material-overrides.scss +44 -0
- package/themes/common/components/_readonly.scss +7 -0
- package/themes/common/components/_toolbar.scss +6 -0
- package/themes/common/foundation/_base.scss +9 -0
- package/themes/common/foundation/_fonts.scss +16 -0
- package/themes/common/foundation/_typography.scss +6 -0
- package/themes/common/foundation/_utilities.scss +313 -0
- package/themes/common/styles.scss +21 -530
- package/themes/common/theme-entry.scss +52 -0
- package/themes/common/theme.scss +72 -34
- package/themes/common/tokens/_tokens.scss +89 -0
- package/themes/pbv-palettes.scss +137 -0
- package/themes/pbv.scss +34 -43
- package/themes/poa-palettes.scss +137 -0
- package/themes/poa.scss +23 -43
- package/types/porscheinformatik-material-addons.d.ts.map +1 -1
- package/themes/common/button.scss +0 -34
|
@@ -73,12 +73,12 @@ class MaterialActionButtonComponent {
|
|
|
73
73
|
this.liftHigher = true;
|
|
74
74
|
this.liftHigher2 = false;
|
|
75
75
|
}
|
|
76
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
77
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
76
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MaterialActionButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
77
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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 @if (liftHigher2) {\n <button [id]=\"id\" mat-mini-fab [matTooltipPosition]=\"'left'\" [matTooltip]=\"actionName\" class=\"mat-accent\">\n <mat-icon>{{ icon }}</mat-icon>\n </button>\n } @else {\n <button [id]=\"id\" mat-fab [matTooltipPosition]=\"'left'\" [matTooltip]=\"actionName\" class=\"mat-primary\">\n <mat-icon>{{ icon }}</mat-icon>\n </button>\n }\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: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatMiniFabButton, selector: "button[mat-mini-fab], a[mat-mini-fab], button[matMiniFab], a[matMiniFab]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1.MatFabButton, selector: "button[mat-fab], a[mat-fab], button[matFab], a[matFab]", inputs: ["extended"], exportAs: ["matButton", "matAnchor"] }, { 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"] }] }); }
|
|
78
78
|
}
|
|
79
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
79
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MaterialActionButtonComponent, decorators: [{
|
|
80
80
|
type: Component,
|
|
81
|
-
args: [{ selector: 'mad-material-action-button', imports: [RouterLink, MatButtonModule, MatTooltipModule, MatIconModule], template: "<div class=\"material-action-button {{ liftHigher ? 'lift-higher' : '' }} {{ liftHigher2 ? 'lift-higher-2' : '' }}\">\n <a [routerLink]=\"routerLink\">\n @if (liftHigher2) {\n <button [id]=\"id\" mat-mini-fab [matTooltipPosition]=\"'left'\" [matTooltip]=\"actionName\"
|
|
81
|
+
args: [{ selector: 'mad-material-action-button', imports: [RouterLink, MatButtonModule, MatTooltipModule, MatIconModule], template: "<div class=\"material-action-button {{ liftHigher ? 'lift-higher' : '' }} {{ liftHigher2 ? 'lift-higher-2' : '' }}\">\n <a [routerLink]=\"routerLink\">\n @if (liftHigher2) {\n <button [id]=\"id\" mat-mini-fab [matTooltipPosition]=\"'left'\" [matTooltip]=\"actionName\" class=\"mat-accent\">\n <mat-icon>{{ icon }}</mat-icon>\n </button>\n } @else {\n <button [id]=\"id\" mat-fab [matTooltipPosition]=\"'left'\" [matTooltip]=\"actionName\" class=\"mat-primary\">\n <mat-icon>{{ icon }}</mat-icon>\n </button>\n }\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"] }]
|
|
82
82
|
}], propDecorators: { actionName: [{
|
|
83
83
|
type: Input
|
|
84
84
|
}], id: [{
|
|
@@ -94,11 +94,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
94
94
|
}] } });
|
|
95
95
|
|
|
96
96
|
class MaterialActionButtonModule {
|
|
97
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
98
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
99
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
97
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MaterialActionButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
98
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: MaterialActionButtonModule, imports: [CommonModule, RouterModule, MatButtonModule, MatIconModule, MatTooltipModule, MaterialActionButtonComponent], exports: [MaterialActionButtonComponent] }); }
|
|
99
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MaterialActionButtonModule, imports: [CommonModule, RouterModule, MatButtonModule, MatIconModule, MatTooltipModule, MaterialActionButtonComponent] }); }
|
|
100
100
|
}
|
|
101
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
101
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MaterialActionButtonModule, decorators: [{
|
|
102
102
|
type: NgModule,
|
|
103
103
|
args: [{
|
|
104
104
|
imports: [CommonModule, RouterModule, MatButtonModule, MatIconModule, MatTooltipModule, MaterialActionButtonComponent],
|
|
@@ -127,10 +127,10 @@ class MadBasicButton {
|
|
|
127
127
|
this.button.nativeElement.removeEventListener('click', this.disableClick);
|
|
128
128
|
}
|
|
129
129
|
}
|
|
130
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
131
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
130
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MadBasicButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
131
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: MadBasicButton, isStandalone: false, selector: "ng-component", host: { properties: { "style.pointer-events": "this.pointerEvent", "style.opacity": "this.opacity" } }, usesOnChanges: true, ngImport: i0, template: '', isInline: true }); }
|
|
132
132
|
}
|
|
133
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
133
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MadBasicButton, decorators: [{
|
|
134
134
|
type: Component,
|
|
135
135
|
args: [{
|
|
136
136
|
template: '',
|
|
@@ -149,12 +149,12 @@ class DangerButtonComponent extends MadBasicButton {
|
|
|
149
149
|
super();
|
|
150
150
|
this.title = '';
|
|
151
151
|
}
|
|
152
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
153
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
152
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DangerButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
153
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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-flat-button class=\"mad-danger\" [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[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }] }); }
|
|
154
154
|
}
|
|
155
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
155
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DangerButtonComponent, decorators: [{
|
|
156
156
|
type: Component,
|
|
157
|
-
args: [{ selector: 'mad-danger-button', imports: [MatButtonModule], template: "<button data-cy=\"button\" mat-
|
|
157
|
+
args: [{ selector: 'mad-danger-button', imports: [MatButtonModule], template: "<button data-cy=\"button\" mat-flat-button class=\"mad-danger\" [type]=\"type\" [title]=\"title\" #btn>\n <ng-content></ng-content>\n</button>\n" }]
|
|
158
158
|
}], ctorParameters: () => [], propDecorators: { type: [{
|
|
159
159
|
type: Input
|
|
160
160
|
}], disabled: [{
|
|
@@ -171,12 +171,12 @@ class LinkButtonComponent extends MadBasicButton {
|
|
|
171
171
|
super();
|
|
172
172
|
this.title = '';
|
|
173
173
|
}
|
|
174
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
175
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
174
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: LinkButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
175
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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\" class=\"mad-primary\" #btn mat-button>\n <ng-content></ng-content>\n</button>\n", dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }] }); }
|
|
176
176
|
}
|
|
177
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
177
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: LinkButtonComponent, decorators: [{
|
|
178
178
|
type: Component,
|
|
179
|
-
args: [{ selector: 'mad-link-button', imports: [MatButtonModule], template: "<button data-cy=\"button\" [title]=\"title\" [type]=\"type\"
|
|
179
|
+
args: [{ selector: 'mad-link-button', imports: [MatButtonModule], template: "<button data-cy=\"button\" [title]=\"title\" [type]=\"type\" class=\"mad-primary\" #btn mat-button>\n <ng-content></ng-content>\n</button>\n" }]
|
|
180
180
|
}], ctorParameters: () => [], propDecorators: { type: [{
|
|
181
181
|
type: Input
|
|
182
182
|
}], disabled: [{
|
|
@@ -193,12 +193,12 @@ class IconButtonComponent extends MadBasicButton {
|
|
|
193
193
|
super();
|
|
194
194
|
this.title = '';
|
|
195
195
|
}
|
|
196
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
197
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
196
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: IconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
197
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 class=\"mat-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], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }] }); }
|
|
198
198
|
}
|
|
199
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
199
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: IconButtonComponent, decorators: [{
|
|
200
200
|
type: Component,
|
|
201
|
-
args: [{ selector: 'mad-icon-button', imports: [MatButtonModule], template: "<button data-cy=\"button\" mat-icon-button
|
|
201
|
+
args: [{ selector: 'mad-icon-button', imports: [MatButtonModule], template: "<button data-cy=\"button\" mat-icon-button class=\"mat-primary\" [type]=\"type\" [title]=\"title\" #btn>\n <ng-content></ng-content>\n</button>\n" }]
|
|
202
202
|
}], ctorParameters: () => [], propDecorators: { type: [{
|
|
203
203
|
type: Input
|
|
204
204
|
}], disabled: [{
|
|
@@ -216,12 +216,12 @@ class OutlineButtonComponent extends MadBasicButton {
|
|
|
216
216
|
this.title = '';
|
|
217
217
|
this.color = 'primary';
|
|
218
218
|
}
|
|
219
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
220
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
219
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: OutlineButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
220
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 [class]=\"'mad-' + color\" [type]=\"type\" [title]=\"title\" #btn>\n <ng-content></ng-content>\n</button>\n", styles: [".mat-mdc-outlined-button:not(:disabled){--mat-button-outlined-outline-color: var(--mat-button-outlined-label-text-color)}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }] }); }
|
|
221
221
|
}
|
|
222
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
222
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: OutlineButtonComponent, decorators: [{
|
|
223
223
|
type: Component,
|
|
224
|
-
args: [{ selector: 'mad-outline-button', imports: [MatButtonModule], template: "<button data-cy=\"button\" mat-stroked-button [
|
|
224
|
+
args: [{ selector: 'mad-outline-button', imports: [MatButtonModule], template: "<button data-cy=\"button\" mat-stroked-button [class]=\"'mad-' + color\" [type]=\"type\" [title]=\"title\" #btn>\n <ng-content></ng-content>\n</button>\n", styles: [".mat-mdc-outlined-button:not(:disabled){--mat-button-outlined-outline-color: var(--mat-button-outlined-label-text-color)}\n"] }]
|
|
225
225
|
}], ctorParameters: () => [], propDecorators: { type: [{
|
|
226
226
|
type: Input
|
|
227
227
|
}], disabled: [{
|
|
@@ -240,12 +240,12 @@ class PrimaryButtonComponent extends MadBasicButton {
|
|
|
240
240
|
super();
|
|
241
241
|
this.title = '';
|
|
242
242
|
}
|
|
243
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
244
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
243
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PrimaryButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
244
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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-flat-button [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[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }] }); }
|
|
245
245
|
}
|
|
246
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
246
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PrimaryButtonComponent, decorators: [{
|
|
247
247
|
type: Component,
|
|
248
|
-
args: [{ selector: 'mad-primary-button', imports: [MatButtonModule], template: "<button data-cy=\"button\" mat-
|
|
248
|
+
args: [{ selector: 'mad-primary-button', imports: [MatButtonModule], template: "<button data-cy=\"button\" mat-flat-button [type]=\"type\" [title]=\"title\" #btn>\n <ng-content></ng-content>\n</button>\n" }]
|
|
249
249
|
}], ctorParameters: () => [], propDecorators: { type: [{
|
|
250
250
|
type: Input
|
|
251
251
|
}], disabled: [{
|
|
@@ -294,10 +294,10 @@ class MadButtonDirective {
|
|
|
294
294
|
this.renderer.removeClass(this.elementRef.nativeElement, className);
|
|
295
295
|
}
|
|
296
296
|
}
|
|
297
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
298
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.
|
|
297
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", 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 }); }
|
|
298
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: MadButtonDirective, isStandalone: true, selector: "[madButton]", inputs: { color: "color", outline: "outline", uppercase: "uppercase" }, ngImport: i0 }); }
|
|
299
299
|
}
|
|
300
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
300
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MadButtonDirective, decorators: [{
|
|
301
301
|
type: Directive,
|
|
302
302
|
args: [{
|
|
303
303
|
selector: '[madButton]',
|
|
@@ -319,10 +319,10 @@ class MadButtonGroupComponent {
|
|
|
319
319
|
constructor() {
|
|
320
320
|
this.setClass = true;
|
|
321
321
|
}
|
|
322
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
323
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
322
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MadButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
323
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 }); }
|
|
324
324
|
}
|
|
325
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
325
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MadButtonGroupComponent, decorators: [{
|
|
326
326
|
type: Component,
|
|
327
327
|
args: [{
|
|
328
328
|
selector: 'mad-button-group',
|
|
@@ -335,8 +335,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
335
335
|
}] } });
|
|
336
336
|
|
|
337
337
|
class ButtonModule {
|
|
338
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
339
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
338
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
339
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: ButtonModule, imports: [CommonModule,
|
|
340
340
|
RouterModule,
|
|
341
341
|
MatButtonModule,
|
|
342
342
|
MatIconModule,
|
|
@@ -354,7 +354,7 @@ class ButtonModule {
|
|
|
354
354
|
IconButtonComponent,
|
|
355
355
|
MadButtonDirective,
|
|
356
356
|
MadButtonGroupComponent] }); }
|
|
357
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
357
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ButtonModule, imports: [CommonModule,
|
|
358
358
|
RouterModule,
|
|
359
359
|
MatButtonModule,
|
|
360
360
|
MatIconModule,
|
|
@@ -365,7 +365,7 @@ class ButtonModule {
|
|
|
365
365
|
DangerButtonComponent,
|
|
366
366
|
IconButtonComponent] }); }
|
|
367
367
|
}
|
|
368
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
368
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ButtonModule, decorators: [{
|
|
369
369
|
type: NgModule,
|
|
370
370
|
args: [{
|
|
371
371
|
imports: [
|
|
@@ -525,10 +525,10 @@ class NumberFormatService {
|
|
|
525
525
|
valueOrDefault(value, defaultValue) {
|
|
526
526
|
return NumberFormatService.valueIsSet(value) ? value : defaultValue;
|
|
527
527
|
}
|
|
528
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
529
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.
|
|
528
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: NumberFormatService, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
529
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: NumberFormatService, providedIn: 'root' }); }
|
|
530
530
|
}
|
|
531
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
531
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: NumberFormatService, decorators: [{
|
|
532
532
|
type: Injectable,
|
|
533
533
|
args: [{
|
|
534
534
|
providedIn: 'root',
|
|
@@ -550,10 +550,10 @@ class SizeChangeDirective {
|
|
|
550
550
|
ngOnDestroy() {
|
|
551
551
|
this.changes.disconnect();
|
|
552
552
|
}
|
|
553
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
554
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.
|
|
553
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SizeChangeDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
554
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: SizeChangeDirective, isStandalone: true, selector: "[madSizeChange]", outputs: { madSizeChange: "madSizeChange" }, ngImport: i0 }); }
|
|
555
555
|
}
|
|
556
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
556
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SizeChangeDirective, decorators: [{
|
|
557
557
|
type: Directive,
|
|
558
558
|
args: [{
|
|
559
559
|
selector: '[madSizeChange]',
|
|
@@ -672,10 +672,10 @@ class ReadOnlyFormFieldComponent {
|
|
|
672
672
|
prefixClicked() {
|
|
673
673
|
this.prefixClickedEmitter.emit();
|
|
674
674
|
}
|
|
675
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
676
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
675
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ReadOnlyFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
676
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: ReadOnlyFormFieldComponent, isStandalone: true, selector: "mad-readonly-form-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, useProjectedContent: { classPropertyName: "useProjectedContent", publicName: "useProjectedContent", isSignal: true, isRequired: false, transformFunction: null }, textAlign: { classPropertyName: "textAlign", publicName: "textAlign", isSignal: true, isRequired: false, transformFunction: null }, textOverflow: { classPropertyName: "textOverflow", publicName: "textOverflow", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null }, unitPosition: { classPropertyName: "unitPosition", publicName: "unitPosition", isSignal: true, isRequired: false, transformFunction: null }, formatNumber: { classPropertyName: "formatNumber", publicName: "formatNumber", isSignal: true, isRequired: false, transformFunction: null }, decimalPlaces: { classPropertyName: "decimalPlaces", publicName: "decimalPlaces", isSignal: true, isRequired: false, transformFunction: null }, roundDisplayValue: { classPropertyName: "roundDisplayValue", publicName: "roundDisplayValue", isSignal: true, isRequired: false, transformFunction: null }, autofillDecimals: { classPropertyName: "autofillDecimals", publicName: "autofillDecimals", isSignal: true, isRequired: false, transformFunction: null }, multiline: { classPropertyName: "multiline", publicName: "multiline", isSignal: true, isRequired: false, transformFunction: null }, multilineAutoSize: { classPropertyName: "multilineAutoSize", publicName: "multilineAutoSize", isSignal: true, isRequired: false, transformFunction: null }, shrinkIfEmpty: { classPropertyName: "shrinkIfEmpty", publicName: "shrinkIfEmpty", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { suffixClickedEmitter: "suffixClickedEmitter", prefixClickedEmitter: "prefixClickedEmitter" }, viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["inputEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<mat-form-field class=\"form-group mad-read-only\">\n <mat-label>{{ label() }}</mat-label>\n @if (!multiline()) {\n <input\n #inputEl\n (madSizeChange)=\"sizeChanges.set($event)\"\n [style.text-overflow]=\"textOverflow()\"\n [disabled]=\"!useProjectedContent()\"\n [errorStateMatcher]=\"errorMatcher()\"\n [id]=\"id()\"\n [matTooltipDisabled]=\"!toolTipForInputEnabled()\"\n [matTooltip]=\"toolTipText()\"\n [ngClass]=\"'text-' + textAlign() + ' content'\"\n [ngModel]=\"displayValueWithUnit()\"\n [ngStyle]=\"{ display: useProjectedContent() ? 'none' : 'block' }\"\n matInput\n matTooltipClass=\"custom-tooltip\"\n matTooltipPosition=\"right\"\n readonly\n />\n } @else {\n <textarea\n [ngStyle]=\"{ display: useProjectedContent() ? 'none' : 'block' }\"\n [rows]=\"actualAmountOfRows()\"\n [ngModel]=\"displayValueWithUnit()\"\n class=\"multiline content\"\n [errorStateMatcher]=\"errorMatcher()\"\n [id]=\"id()\"\n readonly\n [disabled]=\"!useProjectedContent()\"\n matInput\n [cdkTextareaAutosize]=\"multilineAutoSize()\"\n >\n </textarea>\n }\n\n @if (useProjectedContent()) {\n <ng-content />\n }\n <mat-error>{{ errorMessage() }}</mat-error>\n @if (suffix()) {\n <mat-icon data-cy=\"suffix-icon\" (click)=\"suffixClicked()\" class=\"pointer mat-primary\" matSuffix>{{ suffix() }} </mat-icon>\n }\n @if (prefix()) {\n <mat-icon data-cy=\"prefix-icon\" (click)=\"prefixClicked()\" class=\"pointer mat-primary\" matPrefix>{{ prefix() }} </mat-icon>\n }\n @if (unit() && unitPosition() === 'left') {\n <span [style.padding-right]=\"'5px'\" matTextPrefix>{{ unit() }}</span>\n } @else if (unit() && textAlign() === 'right') {\n <span [style.padding-left]=\"'25px'\" matTextSuffix>{{ unit() }}</span>\n }\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: i1$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i1$1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i1$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i3.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.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"] }, { kind: "directive", type: SizeChangeDirective, selector: "[madSizeChange]", outputs: ["madSizeChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
677
677
|
}
|
|
678
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
678
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ReadOnlyFormFieldComponent, decorators: [{
|
|
679
679
|
type: Component,
|
|
680
680
|
args: [{ selector: 'mad-readonly-form-field', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
681
681
|
MatFormFieldModule,
|
|
@@ -687,7 +687,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
687
687
|
TextFieldModule,
|
|
688
688
|
MatIconModule,
|
|
689
689
|
SizeChangeDirective,
|
|
690
|
-
], template: "<mat-form-field class=\"form-group mad-read-only\">\n <mat-label>{{ label() }}</mat-label>\n @if (!multiline()) {\n <input\n #inputEl\n (madSizeChange)=\"sizeChanges.set($event)\"\n [style.text-overflow]=\"textOverflow()\"\n [disabled]=\"!useProjectedContent()\"\n [errorStateMatcher]=\"errorMatcher()\"\n [id]=\"id()\"\n [matTooltipDisabled]=\"!toolTipForInputEnabled()\"\n [matTooltip]=\"toolTipText()\"\n [ngClass]=\"'text-' + textAlign() + ' content'\"\n [ngModel]=\"displayValueWithUnit()\"\n [ngStyle]=\"{ display: useProjectedContent() ? 'none' : 'block' }\"\n matInput\n matTooltipClass=\"custom-tooltip\"\n matTooltipPosition=\"right\"\n readonly\n />\n } @else {\n <textarea\n [ngStyle]=\"{ display: useProjectedContent() ? 'none' : 'block' }\"\n [rows]=\"actualAmountOfRows()\"\n [ngModel]=\"displayValueWithUnit()\"\n class=\"multiline content\"\n [errorStateMatcher]=\"errorMatcher()\"\n [id]=\"id()\"\n readonly\n [disabled]=\"!useProjectedContent()\"\n matInput\n [cdkTextareaAutosize]=\"multilineAutoSize()\"\n >\n </textarea>\n }\n\n @if (useProjectedContent()) {\n <ng-content />\n }\n <mat-error>{{ errorMessage() }}</mat-error>\n @if (suffix()) {\n <mat-icon data-cy=\"suffix-icon\" (click)=\"suffixClicked()\" class=\"pointer
|
|
690
|
+
], template: "<mat-form-field class=\"form-group mad-read-only\">\n <mat-label>{{ label() }}</mat-label>\n @if (!multiline()) {\n <input\n #inputEl\n (madSizeChange)=\"sizeChanges.set($event)\"\n [style.text-overflow]=\"textOverflow()\"\n [disabled]=\"!useProjectedContent()\"\n [errorStateMatcher]=\"errorMatcher()\"\n [id]=\"id()\"\n [matTooltipDisabled]=\"!toolTipForInputEnabled()\"\n [matTooltip]=\"toolTipText()\"\n [ngClass]=\"'text-' + textAlign() + ' content'\"\n [ngModel]=\"displayValueWithUnit()\"\n [ngStyle]=\"{ display: useProjectedContent() ? 'none' : 'block' }\"\n matInput\n matTooltipClass=\"custom-tooltip\"\n matTooltipPosition=\"right\"\n readonly\n />\n } @else {\n <textarea\n [ngStyle]=\"{ display: useProjectedContent() ? 'none' : 'block' }\"\n [rows]=\"actualAmountOfRows()\"\n [ngModel]=\"displayValueWithUnit()\"\n class=\"multiline content\"\n [errorStateMatcher]=\"errorMatcher()\"\n [id]=\"id()\"\n readonly\n [disabled]=\"!useProjectedContent()\"\n matInput\n [cdkTextareaAutosize]=\"multilineAutoSize()\"\n >\n </textarea>\n }\n\n @if (useProjectedContent()) {\n <ng-content />\n }\n <mat-error>{{ errorMessage() }}</mat-error>\n @if (suffix()) {\n <mat-icon data-cy=\"suffix-icon\" (click)=\"suffixClicked()\" class=\"pointer mat-primary\" matSuffix>{{ suffix() }} </mat-icon>\n }\n @if (prefix()) {\n <mat-icon data-cy=\"prefix-icon\" (click)=\"prefixClicked()\" class=\"pointer mat-primary\" matPrefix>{{ prefix() }} </mat-icon>\n }\n @if (unit() && unitPosition() === 'left') {\n <span [style.padding-right]=\"'5px'\" matTextPrefix>{{ unit() }}</span>\n } @else if (unit() && textAlign() === 'right') {\n <span [style.padding-left]=\"'25px'\" matTextSuffix>{{ unit() }}</span>\n }\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"] }]
|
|
691
691
|
}], propDecorators: { inputEl: [{ type: i0.ViewChild, args: ['inputEl', { isSignal: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], useProjectedContent: [{ type: i0.Input, args: [{ isSignal: true, alias: "useProjectedContent", required: false }] }], textAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "textAlign", required: false }] }], textOverflow: [{ type: i0.Input, args: [{ isSignal: true, alias: "textOverflow", required: false }] }], errorMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMessage", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], unit: [{ type: i0.Input, args: [{ isSignal: true, alias: "unit", required: false }] }], unitPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "unitPosition", required: false }] }], formatNumber: [{ type: i0.Input, args: [{ isSignal: true, alias: "formatNumber", required: false }] }], decimalPlaces: [{ type: i0.Input, args: [{ isSignal: true, alias: "decimalPlaces", required: false }] }], roundDisplayValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "roundDisplayValue", required: false }] }], autofillDecimals: [{ type: i0.Input, args: [{ isSignal: true, alias: "autofillDecimals", required: false }] }], multiline: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiline", required: false }] }], multilineAutoSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "multilineAutoSize", required: false }] }], shrinkIfEmpty: [{ type: i0.Input, args: [{ isSignal: true, alias: "shrinkIfEmpty", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], suffix: [{ type: i0.Input, args: [{ isSignal: true, alias: "suffix", required: false }] }], prefix: [{ type: i0.Input, args: [{ isSignal: true, alias: "prefix", required: false }] }], suffixClickedEmitter: [{ type: i0.Output, args: ["suffixClickedEmitter"] }], prefixClickedEmitter: [{ type: i0.Output, args: ["prefixClickedEmitter"] }] } });
|
|
692
692
|
|
|
693
693
|
/**
|
|
@@ -802,12 +802,12 @@ class ReadOnlyFormFieldWrapperComponent {
|
|
|
802
802
|
formField.setAttribute('style', 'width:100%');
|
|
803
803
|
}
|
|
804
804
|
}
|
|
805
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
806
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
805
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ReadOnlyFormFieldWrapperComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$2.FormGroupDirective }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
806
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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\">\n <ng-content></ng-content>\n</div>\n\n<div #readOnlyContentWrapper>\n @if (!!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 }\n</div>\n", styles: ["mat-form-field{width:inherit}div{width:inherit}\n"], dependencies: [{ kind: "component", type: ReadOnlyFormFieldComponent, selector: "mad-readonly-form-field", inputs: ["label", "value", "useProjectedContent", "textAlign", "textOverflow", "errorMessage", "id", "unit", "unitPosition", "formatNumber", "decimalPlaces", "roundDisplayValue", "autofillDecimals", "multiline", "multilineAutoSize", "shrinkIfEmpty", "rows", "suffix", "prefix"], outputs: ["suffixClickedEmitter", "prefixClickedEmitter"] }, { kind: "ngmodule", type: ObserversModule }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] }); }
|
|
807
807
|
}
|
|
808
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
808
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ReadOnlyFormFieldWrapperComponent, decorators: [{
|
|
809
809
|
type: Component,
|
|
810
|
-
args: [{ selector: 'mad-readonly-form-field-wrapper', viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }], imports: [ReadOnlyFormFieldComponent, ObserversModule], template: "<div #contentWrapper [hidden]=\"readonly\">\n <ng-content></ng-content>\n</div>\n\n<div #readOnlyContentWrapper>\n @if (!!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 }\n</div>\n", styles: ["mat-form-field{width:inherit}div{width:inherit}
|
|
810
|
+
args: [{ selector: 'mad-readonly-form-field-wrapper', viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }], imports: [ReadOnlyFormFieldComponent, ObserversModule], template: "<div #contentWrapper [hidden]=\"readonly\">\n <ng-content></ng-content>\n</div>\n\n<div #readOnlyContentWrapper>\n @if (!!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 }\n</div>\n", styles: ["mat-form-field{width:inherit}div{width:inherit}\n"] }]
|
|
811
811
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$2.FormGroupDirective }], propDecorators: { originalContent: [{
|
|
812
812
|
type: ViewChild,
|
|
813
813
|
args: ['contentWrapper', { static: false }]
|
|
@@ -866,8 +866,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
866
866
|
}] } });
|
|
867
867
|
|
|
868
868
|
class ReadOnlyFormFieldModule {
|
|
869
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
870
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
869
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ReadOnlyFormFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
870
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: ReadOnlyFormFieldModule, imports: [CommonModule,
|
|
871
871
|
RouterModule,
|
|
872
872
|
MatFormFieldModule,
|
|
873
873
|
MatInputModule,
|
|
@@ -876,7 +876,7 @@ class ReadOnlyFormFieldModule {
|
|
|
876
876
|
MatIconModule,
|
|
877
877
|
ReadOnlyFormFieldComponent,
|
|
878
878
|
ReadOnlyFormFieldWrapperComponent], exports: [ReadOnlyFormFieldComponent, ReadOnlyFormFieldWrapperComponent] }); }
|
|
879
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
879
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ReadOnlyFormFieldModule, providers: [FormGroupDirective], imports: [CommonModule,
|
|
880
880
|
RouterModule,
|
|
881
881
|
MatFormFieldModule,
|
|
882
882
|
MatInputModule,
|
|
@@ -886,7 +886,7 @@ class ReadOnlyFormFieldModule {
|
|
|
886
886
|
ReadOnlyFormFieldComponent,
|
|
887
887
|
ReadOnlyFormFieldWrapperComponent] }); }
|
|
888
888
|
}
|
|
889
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
889
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ReadOnlyFormFieldModule, decorators: [{
|
|
890
890
|
type: NgModule,
|
|
891
891
|
args: [{
|
|
892
892
|
imports: [
|
|
@@ -1145,8 +1145,8 @@ class NumericFieldDirective {
|
|
|
1145
1145
|
const method = value < 0 ? 'ceil' : 'floor';
|
|
1146
1146
|
return Math[method](+(value * Math.pow(10, this.decimalPlaces)).toFixed(this.decimalPlaces)) / Math.pow(10, this.decimalPlaces);
|
|
1147
1147
|
}
|
|
1148
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1149
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.
|
|
1148
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: NumericFieldDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: NumberFormatService }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1149
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", 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: [
|
|
1150
1150
|
{
|
|
1151
1151
|
provide: NG_VALUE_ACCESSOR,
|
|
1152
1152
|
useExisting: forwardRef(() => NumericFieldDirective),
|
|
@@ -1154,7 +1154,7 @@ class NumericFieldDirective {
|
|
|
1154
1154
|
},
|
|
1155
1155
|
], ngImport: i0 }); }
|
|
1156
1156
|
}
|
|
1157
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1157
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: NumericFieldDirective, decorators: [{
|
|
1158
1158
|
type: Directive,
|
|
1159
1159
|
args: [{
|
|
1160
1160
|
selector: '[madNumericField]',
|
|
@@ -1205,11 +1205,11 @@ class NumericFieldModule {
|
|
|
1205
1205
|
ngModule: NumericFieldModule,
|
|
1206
1206
|
};
|
|
1207
1207
|
}
|
|
1208
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1209
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
1210
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
1208
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: NumericFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1209
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: NumericFieldModule, imports: [NumericFieldDirective], exports: [NumericFieldDirective] }); }
|
|
1210
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: NumericFieldModule }); }
|
|
1211
1211
|
}
|
|
1212
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1212
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: NumericFieldModule, decorators: [{
|
|
1213
1213
|
type: NgModule,
|
|
1214
1214
|
args: [{
|
|
1215
1215
|
imports: [NumericFieldDirective],
|
|
@@ -1234,10 +1234,10 @@ class ThrottleClickDirective {
|
|
|
1234
1234
|
ngOnDestroy() {
|
|
1235
1235
|
this.subscription.unsubscribe();
|
|
1236
1236
|
}
|
|
1237
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1238
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.
|
|
1237
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ThrottleClickDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1238
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: ThrottleClickDirective, isStandalone: true, selector: "[madThrottleClick]", inputs: { throttleTime: "throttleTime" }, outputs: { throttleClick: "throttleClick" }, host: { listeners: { "click": "clickEvent($event)" } }, ngImport: i0 }); }
|
|
1239
1239
|
}
|
|
1240
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1240
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ThrottleClickDirective, decorators: [{
|
|
1241
1241
|
type: Directive,
|
|
1242
1242
|
args: [{
|
|
1243
1243
|
selector: '[madThrottleClick]',
|
|
@@ -1285,8 +1285,8 @@ class CardComponent {
|
|
|
1285
1285
|
additionalActionClicked() {
|
|
1286
1286
|
this.additionalAction.emit(undefined);
|
|
1287
1287
|
}
|
|
1288
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1289
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1288
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1289
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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 @if (title || expandable) {\n <mat-card-header class=\"header\">\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 @if (expandable && !editMode) {\n <mad-icon-button data-testid=\"collapse-btn\" (click)=\"toggleCollapse()\">\n <mat-icon [@rotateIcon]=\"!expanded\">keyboard_arrow_down</mat-icon>\n </mad-icon-button>\n }\n @if (additionalActionIcon) {\n <mad-icon-button data-testid=\"additional-btn\" (click)=\"additionalActionClicked()\" [title]=\"additionalActionText\" type=\"button\">\n <mat-icon>{{ additionalActionIcon }}</mat-icon>\n </mad-icon-button>\n }\n @if (!readonly && !editMode) {\n <mad-icon-button data-testid=\"edit-btn\" [title]=\"editText\" (click)=\"onEdit()\">\n <mat-icon>create</mat-icon>\n </mad-icon-button>\n }\n </div>\n </mat-card-title-group>\n </mat-card-header>\n }\n @if (expanded) {\n <mat-card-content [@collapseExpandAnimation]>\n <ng-content></ng-content>\n </mat-card-content>\n }\n @if (!readonly && editMode) {\n <mat-card-actions>\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 }\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$3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i1$3.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i1$3.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i1$3.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i1$3.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "component", type: i1$3.MatCardTitleGroup, selector: "mat-card-title-group" }, { 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: [
|
|
1290
1290
|
trigger('collapseExpandAnimation', [
|
|
1291
1291
|
transition(':enter', [
|
|
1292
1292
|
style({ opacity: 0, height: 0, overflow: 'hidden' }),
|
|
@@ -1311,7 +1311,7 @@ class CardComponent {
|
|
|
1311
1311
|
]),
|
|
1312
1312
|
] }); }
|
|
1313
1313
|
}
|
|
1314
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1314
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: CardComponent, decorators: [{
|
|
1315
1315
|
type: Component,
|
|
1316
1316
|
args: [{ selector: 'mad-card', animations: [
|
|
1317
1317
|
trigger('collapseExpandAnimation', [
|
|
@@ -1372,11 +1372,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
1372
1372
|
}] } });
|
|
1373
1373
|
|
|
1374
1374
|
class ThrottleClickModule {
|
|
1375
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1376
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
1377
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
1375
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ThrottleClickModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1376
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: ThrottleClickModule, imports: [CommonModule, ThrottleClickDirective], exports: [ThrottleClickDirective] }); }
|
|
1377
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ThrottleClickModule, imports: [CommonModule] }); }
|
|
1378
1378
|
}
|
|
1379
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1379
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ThrottleClickModule, decorators: [{
|
|
1380
1380
|
type: NgModule,
|
|
1381
1381
|
args: [{
|
|
1382
1382
|
imports: [CommonModule, ThrottleClickDirective],
|
|
@@ -1385,11 +1385,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
1385
1385
|
}] });
|
|
1386
1386
|
|
|
1387
1387
|
class CardModule {
|
|
1388
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1389
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
1390
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
1388
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: CardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1389
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: CardModule, imports: [CommonModule, MatCardModule, MatIconModule, ButtonModule, MatButtonModule, ThrottleClickModule, CardComponent], exports: [CardComponent] }); }
|
|
1390
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: CardModule, imports: [CommonModule, MatCardModule, MatIconModule, ButtonModule, MatButtonModule, ThrottleClickModule, CardComponent] }); }
|
|
1391
1391
|
}
|
|
1392
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1392
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: CardModule, decorators: [{
|
|
1393
1393
|
type: NgModule,
|
|
1394
1394
|
args: [{
|
|
1395
1395
|
imports: [CommonModule, MatCardModule, MatIconModule, ButtonModule, MatButtonModule, ThrottleClickModule, CardComponent],
|
|
@@ -1482,10 +1482,10 @@ class BaseQuickListComponent {
|
|
|
1482
1482
|
}
|
|
1483
1483
|
return null;
|
|
1484
1484
|
}
|
|
1485
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1486
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
1485
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: BaseQuickListComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1486
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 }); }
|
|
1487
1487
|
}
|
|
1488
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1488
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: BaseQuickListComponent, decorators: [{
|
|
1489
1489
|
type: Component,
|
|
1490
1490
|
args: [{ selector: 'mad-base-quick-list', template: '', standalone: true }]
|
|
1491
1491
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$2.FormBuilder }], propDecorators: { allItems: [{
|
|
@@ -1524,10 +1524,10 @@ class QuickListCompactComponent extends BaseQuickListComponent {
|
|
|
1524
1524
|
this.changeDetectorRef = changeDetectorRef;
|
|
1525
1525
|
this.formBuilder = formBuilder;
|
|
1526
1526
|
}
|
|
1527
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1528
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1527
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: QuickListCompactComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1528
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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@for (item of allItems; track item; let isLast = $last) {\n @if (itemTemplate) {\n <div class=\"flex-container\" #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n @if (!readonly && isDeleteAllowed()) {\n <mad-icon-button data-cy=\"delete-item-button\" (click)=\"removeItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n }\n @if (!readonly && isLast) {\n <mad-icon-button data-cy=\"add-item-button\" [disabled]=\"!isAddAllowed()\" (click)=\"addItem()\">\n <mat-icon>add_circle_outline</mat-icon>\n </mad-icon-button>\n }\n </div>\n }\n}\n@if (!readonly && !this.allItems.length) {\n <mad-link-button data-cy=\"add-first-item-button\" (click)=\"addItem()\" [disabled]=\"!isAddAllowed()\">\n {{ addLabel }}\n </mad-link-button>\n}\n", dependencies: [{ 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"] }] }); }
|
|
1529
1529
|
}
|
|
1530
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1530
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: QuickListCompactComponent, decorators: [{
|
|
1531
1531
|
type: Component,
|
|
1532
1532
|
args: [{ selector: 'mad-quick-list-compact', imports: [NgTemplateOutlet, IconButtonComponent, MatIconModule, LinkButtonComponent], template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n@for (item of allItems; track item; let isLast = $last) {\n @if (itemTemplate) {\n <div class=\"flex-container\" #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n @if (!readonly && isDeleteAllowed()) {\n <mad-icon-button data-cy=\"delete-item-button\" (click)=\"removeItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n }\n @if (!readonly && isLast) {\n <mad-icon-button data-cy=\"add-item-button\" [disabled]=\"!isAddAllowed()\" (click)=\"addItem()\">\n <mat-icon>add_circle_outline</mat-icon>\n </mad-icon-button>\n }\n </div>\n }\n}\n@if (!readonly && !this.allItems.length) {\n <mad-link-button data-cy=\"add-first-item-button\" (click)=\"addItem()\" [disabled]=\"!isAddAllowed()\">\n {{ addLabel }}\n </mad-link-button>\n}\n" }]
|
|
1533
1533
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$2.FormBuilder }] });
|
|
@@ -1539,10 +1539,10 @@ class QuickListComponent extends BaseQuickListComponent {
|
|
|
1539
1539
|
this.changeDetectorRef = changeDetectorRef;
|
|
1540
1540
|
this.formBuilder = formBuilder;
|
|
1541
1541
|
}
|
|
1542
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1543
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1542
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: QuickListComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1543
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: QuickListComponent, isStandalone: true, selector: "mad-quick-list", usesInheritance: true, ngImport: i0, template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n@for (item of allItems; track item) {\n @if (itemTemplate) {\n <div #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n @if (!readonly && isDeleteAllowed()) {\n <mad-icon-button data-cy=\"delete-item-button\" (click)=\"removeItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n }\n </div>\n }\n}\n@if (!readonly) {\n <mad-outline-button data-cy=\"add-item-button\" (click)=\"addItem()\" [disabled]=\"!addPossible || !isAddAllowed()\">\n {{ addLabel }}\n </mad-outline-button>\n}\n", dependencies: [{ 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"] }] }); }
|
|
1544
1544
|
}
|
|
1545
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1545
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: QuickListComponent, decorators: [{
|
|
1546
1546
|
type: Component,
|
|
1547
1547
|
args: [{ selector: 'mad-quick-list', imports: [NgTemplateOutlet, IconButtonComponent, MatIconModule, OutlineButtonComponent], template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n@for (item of allItems; track item) {\n @if (itemTemplate) {\n <div #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n @if (!readonly && isDeleteAllowed()) {\n <mad-icon-button data-cy=\"delete-item-button\" (click)=\"removeItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n }\n </div>\n }\n}\n@if (!readonly) {\n <mad-outline-button data-cy=\"add-item-button\" (click)=\"addItem()\" [disabled]=\"!addPossible || !isAddAllowed()\">\n {{ addLabel }}\n </mad-outline-button>\n}\n" }]
|
|
1548
1548
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$2.FormBuilder }] });
|
|
@@ -1553,10 +1553,10 @@ class ReactiveFormQuickListComponent extends BaseQuickListComponent {
|
|
|
1553
1553
|
this.changeDetectorRef = changeDetectorRef;
|
|
1554
1554
|
this.formBuilder = formBuilder;
|
|
1555
1555
|
}
|
|
1556
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1557
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1556
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ReactiveFormQuickListComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1557
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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@for (item of formArray.controls; track item) {\n @if (itemTemplate) {\n <div #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n @if (!readonly && isDeleteReactiveAllowed()) {\n <mad-icon-button data-cy=\"delete-item-button\" (click)=\"removeReactiveItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n }\n </div>\n }\n}\n\n@if (!readonly) {\n <mad-outline-button data-cy=\"add-item-button\" (click)=\"addReactiveItem()\" [disabled]=\"!isAddReactiveAllowed()\">\n {{ addLabel }}\n </mad-outline-button>\n}\n", dependencies: [{ 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"] }] }); }
|
|
1558
1558
|
}
|
|
1559
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1559
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ReactiveFormQuickListComponent, decorators: [{
|
|
1560
1560
|
type: Component,
|
|
1561
1561
|
args: [{ selector: 'mad-reactive-form-quick-list', imports: [NgTemplateOutlet, IconButtonComponent, MatIconModule, OutlineButtonComponent], template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n@for (item of formArray.controls; track item) {\n @if (itemTemplate) {\n <div #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n @if (!readonly && isDeleteReactiveAllowed()) {\n <mad-icon-button data-cy=\"delete-item-button\" (click)=\"removeReactiveItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n }\n </div>\n }\n}\n\n@if (!readonly) {\n <mad-outline-button data-cy=\"add-item-button\" (click)=\"addReactiveItem()\" [disabled]=\"!isAddReactiveAllowed()\">\n {{ addLabel }}\n </mad-outline-button>\n}\n" }]
|
|
1562
1562
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$2.FormBuilder }] });
|
|
@@ -1567,17 +1567,17 @@ class ReactiveFormQuickListCompactComponent extends BaseQuickListComponent {
|
|
|
1567
1567
|
this.changeDetectorRef = changeDetectorRef;
|
|
1568
1568
|
this.formBuilder = formBuilder;
|
|
1569
1569
|
}
|
|
1570
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1571
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1570
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ReactiveFormQuickListCompactComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1571
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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@for (item of formArray.controls; track item; let isLast = $last) {\n @if (itemTemplate) {\n <div #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n @if (!readonly && isDeleteReactiveAllowed()) {\n <mad-icon-button data-cy=\"delete-item-button\" (click)=\"removeReactiveItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n }\n @if (!readonly && isLast) {\n <mad-icon-button data-cy=\"add-item-button\" [disabled]=\"!isAddReactiveAllowed()\" (click)=\"addReactiveItem()\">\n <mat-icon>add_circle_outline</mat-icon>\n </mad-icon-button>\n }\n </div>\n }\n}\n@if (!readonly && !this.formArray?.controls.length) {\n <mad-link-button data-cy=\"add-first-item-button\" (click)=\"addReactiveItem()\" [disabled]=\"!isAddReactiveAllowed()\">\n {{ addLabel }}\n </mad-link-button>\n}\n", dependencies: [{ 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"] }] }); }
|
|
1572
1572
|
}
|
|
1573
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1573
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ReactiveFormQuickListCompactComponent, decorators: [{
|
|
1574
1574
|
type: Component,
|
|
1575
1575
|
args: [{ selector: 'mad-reactive-form-quick-list-compact', imports: [NgTemplateOutlet, IconButtonComponent, MatIconModule, LinkButtonComponent], template: "<h3>\n <ng-content select=\"label\"></ng-content>\n</h3>\n@for (item of formArray.controls; track item; let isLast = $last) {\n @if (itemTemplate) {\n <div #row class=\"quick-list-row\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n @if (!readonly && isDeleteReactiveAllowed()) {\n <mad-icon-button data-cy=\"delete-item-button\" (click)=\"removeReactiveItem(item)\">\n <mat-icon>delete</mat-icon>\n </mad-icon-button>\n }\n @if (!readonly && isLast) {\n <mad-icon-button data-cy=\"add-item-button\" [disabled]=\"!isAddReactiveAllowed()\" (click)=\"addReactiveItem()\">\n <mat-icon>add_circle_outline</mat-icon>\n </mad-icon-button>\n }\n </div>\n }\n}\n@if (!readonly && !this.formArray?.controls.length) {\n <mad-link-button data-cy=\"add-first-item-button\" (click)=\"addReactiveItem()\" [disabled]=\"!isAddReactiveAllowed()\">\n {{ addLabel }}\n </mad-link-button>\n}\n" }]
|
|
1576
1576
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$2.FormBuilder }] });
|
|
1577
1577
|
|
|
1578
1578
|
class QuickListModule {
|
|
1579
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1580
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
1579
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: QuickListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1580
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: QuickListModule, imports: [CommonModule,
|
|
1581
1581
|
MatButtonModule,
|
|
1582
1582
|
MatIconModule,
|
|
1583
1583
|
ButtonModule,
|
|
@@ -1591,7 +1591,7 @@ class QuickListModule {
|
|
|
1591
1591
|
BaseQuickListComponent,
|
|
1592
1592
|
ReactiveFormQuickListComponent,
|
|
1593
1593
|
ReactiveFormQuickListCompactComponent] }); }
|
|
1594
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
1594
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: QuickListModule, imports: [CommonModule,
|
|
1595
1595
|
MatButtonModule,
|
|
1596
1596
|
MatIconModule,
|
|
1597
1597
|
ButtonModule,
|
|
@@ -1601,7 +1601,7 @@ class QuickListModule {
|
|
|
1601
1601
|
ReactiveFormQuickListComponent,
|
|
1602
1602
|
ReactiveFormQuickListCompactComponent] }); }
|
|
1603
1603
|
}
|
|
1604
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1604
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: QuickListModule, decorators: [{
|
|
1605
1605
|
type: NgModule,
|
|
1606
1606
|
args: [{
|
|
1607
1607
|
imports: [
|
|
@@ -1699,10 +1699,10 @@ class TableComponent {
|
|
|
1699
1699
|
isClickOnRowMenuIcon(event) {
|
|
1700
1700
|
return event?.target?.classList.contains('mat-icon');
|
|
1701
1701
|
}
|
|
1702
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1703
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1702
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1703
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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@if (tableActions?.length) {\n <div>\n @for (tableAction of tableActions; track tableAction) {\n <mad-primary-button class=\"table-action\" (click)=\"onTableAction(tableAction)\">\n {{ tableAction.label }}\n </mad-primary-button>\n }\n </div>\n}\n\n<!-- Row action buttons -->\n<mat-menu #menu=\"matMenu\">\n <ng-template matMenuContent let-element=\"element\">\n @for (rowAction of rowActions; track rowAction) {\n <button mat-menu-item class=\"row-action\" (click)=\"onRowEvent($event, element, rowAction)\">\n {{ rowAction.label }}\n </button>\n }\n </ng-template>\n</mat-menu>\n\n<!-- Table filter -->\n@if (isFilterEnabled) {\n <mat-form-field>\n <mat-label>{{ filterLabel }}</mat-label>\n <input matInput (keyup)=\"onFilter($event?.target?.value)\" placeholder=\"{{ filterPlaceholder }}\" />\n </mat-form-field>\n}\n\n<!-- Table -->\n@if (dataSource?.data?.length > 0) {\n <div class=\"mad-table\">\n <table mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"onSortingEvent($event)\">\n <!-- Row actions column -->\n @if (rowActions?.length) {\n <ng-container [matColumnDef]=\"ACTION_COLUMN_NAME\" 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 }\n <!-- Columns with data -->\n @for (column of columns; track column) {\n <ng-container [matColumnDef]=\"column.label\" [sticky]=\"column.isSticky\">\n @if (column.isSortable) {\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 } @else {\n <th mat-header-cell *matHeaderCellDef [class.text-right]=\"column.isRightAligned\">\n {{ column.label }}\n </th>\n }\n <td mat-cell *matCellDef=\"let element\" [class.text-right]=\"column.isRightAligned\">\n {{ element[column.dataPropertyName] }}\n </td>\n </ng-container>\n }\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} @else {\n <div class=\"noDataText\">\n {{ noDataText }}\n </div>\n}\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", 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: "component", type: PrimaryButtonComponent, selector: "mad-primary-button", inputs: ["type", "disabled", "title"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$4.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$4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$4.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i1$4.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: i1$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i10.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i10.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i10.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i10.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i10.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i10.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i10.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i10.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i10.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i10.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"] }] }); }
|
|
1704
1704
|
}
|
|
1705
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1705
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableComponent, decorators: [{
|
|
1706
1706
|
type: Component,
|
|
1707
1707
|
args: [{ selector: 'mad-table', imports: [
|
|
1708
1708
|
PrimaryButtonComponent,
|
|
@@ -1752,8 +1752,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
1752
1752
|
}] } });
|
|
1753
1753
|
|
|
1754
1754
|
class TableModule {
|
|
1755
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1756
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
1755
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1756
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: TableModule, imports: [CommonModule,
|
|
1757
1757
|
MatButtonModule,
|
|
1758
1758
|
MatIconModule,
|
|
1759
1759
|
MatFormFieldModule,
|
|
@@ -1764,7 +1764,7 @@ class TableModule {
|
|
|
1764
1764
|
MatTableModule,
|
|
1765
1765
|
ButtonModule,
|
|
1766
1766
|
TableComponent], exports: [TableComponent] }); }
|
|
1767
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
1767
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableModule, imports: [CommonModule,
|
|
1768
1768
|
MatButtonModule,
|
|
1769
1769
|
MatIconModule,
|
|
1770
1770
|
MatFormFieldModule,
|
|
@@ -1776,7 +1776,7 @@ class TableModule {
|
|
|
1776
1776
|
ButtonModule,
|
|
1777
1777
|
TableComponent] }); }
|
|
1778
1778
|
}
|
|
1779
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1779
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableModule, decorators: [{
|
|
1780
1780
|
type: NgModule,
|
|
1781
1781
|
args: [{
|
|
1782
1782
|
imports: [
|
|
@@ -1872,12 +1872,12 @@ class DataTableColumnsModalComponent {
|
|
|
1872
1872
|
this.searchFilter = '';
|
|
1873
1873
|
this.filteredAvailableColumns = [...this.availableColumns];
|
|
1874
1874
|
}
|
|
1875
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1876
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
1875
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableColumnsModalComponent, deps: [{ token: i1$5.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1876
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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 @for (selectedColumn of selectedColumns; track selectedColumn; let i = $index) {\n <div class=\"column-drag-box\" cdkDrag [id]=\"selectedColumn.id\">{{ i + 1 }}. {{ selectedColumn.label | translate }}</div>\n }\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 @if (searchFilter) {\n <button matSuffix mat-icon-button aria-label=\"Clear\" (click)=\"clearFilterValue()\">\n <mat-icon>close</mat-icon>\n </button>\n }\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 @for (availableColumn of filteredAvailableColumns; track availableColumn) {\n <div class=\"column-drag-box\" cdkDrag [id]=\"availableColumn.id\">\n {{ availableColumn.label }}\n </div>\n }\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 @if (data.deleteDefinitionAllowed) {\n <mad-danger-button (click)=\"onDelete()\">\n {{ data.deleteLabel | translate }}\n </mad-danger-button>\n }\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 var(--mat-sys-outline-variant)}.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:var(--mat-sys-on-surface-variant)}.column-drag-info-area{width:100%;height:36px;margin-bottom:32px;color:var(--mat-sys-on-surface-variant);font-size:small;display:flex;justify-content:right;align-items:stretch;flex-direction:column}.column-drag-list{border:solid 1px var(--mat-sys-outline-variant);height:200px;box-sizing:border-box;background:var(--mat-sys-surface);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 var(--mat-sys-outline-variant);color:var(--mat-sys-on-surface);display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;height:40px;cursor:move;background:var(--mat-sys-surface);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: DragDropModule }, { kind: "directive", type: i2$3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$1.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$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.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$4.TranslatePipe, name: "translate" }] }); }
|
|
1877
1877
|
}
|
|
1878
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1878
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableColumnsModalComponent, decorators: [{
|
|
1879
1879
|
type: Component,
|
|
1880
|
-
args: [{ selector: 'mad-data-table-columns-modal.component', imports: [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 @for (selectedColumn of selectedColumns; track selectedColumn; let i = $index) {\n <div class=\"column-drag-box\" cdkDrag [id]=\"selectedColumn.id\">{{ i + 1 }}. {{ selectedColumn.label | translate }}</div>\n }\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 @if (searchFilter) {\n <button matSuffix mat-icon-button aria-label=\"Clear\" (click)=\"clearFilterValue()\">\n <mat-icon>close</mat-icon>\n </button>\n }\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 @for (availableColumn of filteredAvailableColumns; track availableColumn) {\n <div class=\"column-drag-box\" cdkDrag [id]=\"availableColumn.id\">\n {{ availableColumn.label }}\n </div>\n }\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 @if (data.deleteDefinitionAllowed) {\n <mad-danger-button (click)=\"onDelete()\">\n {{ data.deleteLabel | translate }}\n </mad-danger-button>\n }\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
|
|
1880
|
+
args: [{ selector: 'mad-data-table-columns-modal.component', imports: [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 @for (selectedColumn of selectedColumns; track selectedColumn; let i = $index) {\n <div class=\"column-drag-box\" cdkDrag [id]=\"selectedColumn.id\">{{ i + 1 }}. {{ selectedColumn.label | translate }}</div>\n }\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 @if (searchFilter) {\n <button matSuffix mat-icon-button aria-label=\"Clear\" (click)=\"clearFilterValue()\">\n <mat-icon>close</mat-icon>\n </button>\n }\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 @for (availableColumn of filteredAvailableColumns; track availableColumn) {\n <div class=\"column-drag-box\" cdkDrag [id]=\"availableColumn.id\">\n {{ availableColumn.label }}\n </div>\n }\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 @if (data.deleteDefinitionAllowed) {\n <mad-danger-button (click)=\"onDelete()\">\n {{ data.deleteLabel | translate }}\n </mad-danger-button>\n }\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 var(--mat-sys-outline-variant)}.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:var(--mat-sys-on-surface-variant)}.column-drag-info-area{width:100%;height:36px;margin-bottom:32px;color:var(--mat-sys-on-surface-variant);font-size:small;display:flex;justify-content:right;align-items:stretch;flex-direction:column}.column-drag-list{border:solid 1px var(--mat-sys-outline-variant);height:200px;box-sizing:border-box;background:var(--mat-sys-surface);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 var(--mat-sys-outline-variant);color:var(--mat-sys-on-surface);display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;height:40px;cursor:move;background:var(--mat-sys-surface);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"] }]
|
|
1881
1881
|
}], ctorParameters: () => [{ type: i1$5.MatDialogRef }, { type: undefined, decorators: [{
|
|
1882
1882
|
type: Inject,
|
|
1883
1883
|
args: [MAT_DIALOG_DATA]
|
|
@@ -1922,10 +1922,10 @@ class DataTableFilter {
|
|
|
1922
1922
|
createFilter() {
|
|
1923
1923
|
return Array.from(this.filterables.values()).reduce((result, current) => ({ ...result, [current.id]: current.filterValue }), {});
|
|
1924
1924
|
}
|
|
1925
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
1926
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.
|
|
1925
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableFilter, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1926
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: DataTableFilter, isStandalone: true, selector: "[madFilter]", outputs: { filterChange: "madFilterChange" }, ngImport: i0 }); }
|
|
1927
1927
|
}
|
|
1928
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
1928
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableFilter, decorators: [{
|
|
1929
1929
|
type: Directive,
|
|
1930
1930
|
args: [{
|
|
1931
1931
|
selector: '[madFilter]',
|
|
@@ -2166,10 +2166,10 @@ class DataTablePersistenceService {
|
|
|
2166
2166
|
getId(tableId, key) {
|
|
2167
2167
|
return `${tableId}.${key}`;
|
|
2168
2168
|
}
|
|
2169
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2170
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.
|
|
2169
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTablePersistenceService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
2170
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTablePersistenceService, providedIn: 'root' }); }
|
|
2171
2171
|
}
|
|
2172
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2172
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTablePersistenceService, decorators: [{
|
|
2173
2173
|
type: Injectable,
|
|
2174
2174
|
args: [{
|
|
2175
2175
|
providedIn: 'root',
|
|
@@ -2214,12 +2214,12 @@ class DataTableFilterDialogComponent {
|
|
|
2214
2214
|
ngOnDestroy() {
|
|
2215
2215
|
this._subscription.unsubscribe();
|
|
2216
2216
|
}
|
|
2217
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2218
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
2217
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableFilterDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2218
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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 @if (!filterOptions?.length) {\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 } @else {\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 @for (entry of filterOptions; track entry) {\n <mat-option [value]=\"entry.key\">{{ entry.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n }\n</div>\n", styles: [".container{position:relative;width:12px;height:12px;margin:5px 0 5px 5px}.overlay{position:absolute;width:12px;height:12px;background-color:var(--mat-sys-surface);display:flex;align-items:center}.mat-icon{position:relative;display:flex;align-items:center;font-size:1em;color:var(--mat-sys-on-surface-variant)}.filter-dialog-box{display:flex;align-items:center;width:auto;height:80px;padding:12px 12px 0;margin-top:22px;background-color:var(--mat-sys-surface);box-shadow:0 1px 3px #0000000d}.filter-dialog-input{width:auto;max-width:180px;margin:auto}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i3$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", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i3$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.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$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$4.TranslatePipe, name: "translate" }] }); }
|
|
2219
2219
|
}
|
|
2220
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2220
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableFilterDialogComponent, decorators: [{
|
|
2221
2221
|
type: Component,
|
|
2222
|
-
args: [{ selector: 'mad-data-table-filter-dialog', imports: [MatFormFieldModule, MatInputModule, MatSelectModule, FormsModule, ReactiveFormsModule, TranslateModule], template: "<div class=\"filter-dialog-box\">\n @if (!filterOptions?.length) {\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 } @else {\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 @for (entry of filterOptions; track entry) {\n <mat-option [value]=\"entry.key\">{{ entry.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n }\n</div>\n", styles: [".container{position:relative;width:12px;height:12px;margin:5px 0 5px 5px}.overlay{position:absolute;width:12px;height:12px;background-color
|
|
2222
|
+
args: [{ selector: 'mad-data-table-filter-dialog', imports: [MatFormFieldModule, MatInputModule, MatSelectModule, FormsModule, ReactiveFormsModule, TranslateModule], template: "<div class=\"filter-dialog-box\">\n @if (!filterOptions?.length) {\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 } @else {\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 @for (entry of filterOptions; track entry) {\n <mat-option [value]=\"entry.key\">{{ entry.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n }\n</div>\n", styles: [".container{position:relative;width:12px;height:12px;margin:5px 0 5px 5px}.overlay{position:absolute;width:12px;height:12px;background-color:var(--mat-sys-surface);display:flex;align-items:center}.mat-icon{position:relative;display:flex;align-items:center;font-size:1em;color:var(--mat-sys-on-surface-variant)}.filter-dialog-box{display:flex;align-items:center;width:auto;height:80px;padding:12px 12px 0;margin-top:22px;background-color:var(--mat-sys-surface);box-shadow:0 1px 3px #0000000d}.filter-dialog-input{width:auto;max-width:180px;margin:auto}\n"] }]
|
|
2223
2223
|
}], ctorParameters: () => [], propDecorators: { filterOptions: [{
|
|
2224
2224
|
type: Input
|
|
2225
2225
|
}], filterValue: [{
|
|
@@ -2250,12 +2250,12 @@ class FilterComponent {
|
|
|
2250
2250
|
get opacity() {
|
|
2251
2251
|
return this.isActive ? '1' : this.isHovered || this.showFilterDialog ? '0.54' : '0';
|
|
2252
2252
|
}
|
|
2253
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2254
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
2253
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FilterComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2254
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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 class=\"colored-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:16px;height:16px}.overlay{position:absolute;width:16px;height:16px;background-color:var(--mat-sys-surface);display:flex;align-items:center}.mat-icon{position:relative;display:flex;align-items:center;font-size:1em;color:var(--mat-sys-on-surface-variant)}.filter-dialog{position:absolute;margin-top:12px}.colored-icon{font-size:1.3em}.colored-icon:hover{color:var(--main-primary);cursor:pointer}\n"], dependencies: [{ 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"] }] }); }
|
|
2255
2255
|
}
|
|
2256
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2256
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FilterComponent, decorators: [{
|
|
2257
2257
|
type: Component,
|
|
2258
|
-
args: [{ selector: 'mad-data-table-filter', imports: [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:
|
|
2258
|
+
args: [{ selector: 'mad-data-table-filter', imports: [MatIconModule, DataTableFilterDialogComponent], template: "<div class=\"container\">\n <div class=\"overlay\" [style.opacity]=\"opacity\">\n <mat-icon class=\"colored-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:16px;height:16px}.overlay{position:absolute;width:16px;height:16px;background-color:var(--mat-sys-surface);display:flex;align-items:center}.mat-icon{position:relative;display:flex;align-items:center;font-size:1em;color:var(--mat-sys-on-surface-variant)}.filter-dialog{position:absolute;margin-top:12px}.colored-icon{font-size:1.3em}.colored-icon:hover{color:var(--main-primary);cursor:pointer}\n"] }]
|
|
2259
2259
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { filterValueChange: [{
|
|
2260
2260
|
type: Output
|
|
2261
2261
|
}], onClick: [{
|
|
@@ -2357,10 +2357,10 @@ class DataTableFilterHeader {
|
|
|
2357
2357
|
isArrowElement(nativeElement) {
|
|
2358
2358
|
return nativeElement.classList.contains('mat-sort-header-arrow');
|
|
2359
2359
|
}
|
|
2360
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2361
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.
|
|
2360
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", 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 }); }
|
|
2361
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", 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 }); }
|
|
2362
2362
|
}
|
|
2363
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2363
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableFilterHeader, decorators: [{
|
|
2364
2364
|
type: Directive,
|
|
2365
2365
|
args: [{
|
|
2366
2366
|
selector: 'th[mad-filter-header]',
|
|
@@ -2392,10 +2392,10 @@ class DataTableTemplateColumnDefinition {
|
|
|
2392
2392
|
unregister() {
|
|
2393
2393
|
this.cellDef = null;
|
|
2394
2394
|
}
|
|
2395
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2396
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.
|
|
2395
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableTemplateColumnDefinition, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2396
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: DataTableTemplateColumnDefinition, isStandalone: true, selector: "[madColumnDef]", inputs: { madColumnDef: "madColumnDef" }, ngImport: i0 }); }
|
|
2397
2397
|
}
|
|
2398
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2398
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableTemplateColumnDefinition, decorators: [{
|
|
2399
2399
|
type: Directive,
|
|
2400
2400
|
args: [{
|
|
2401
2401
|
selector: '[madColumnDef]',
|
|
@@ -2412,10 +2412,10 @@ class DataTableTemplateExpandableColumnDefinition {
|
|
|
2412
2412
|
unregister() {
|
|
2413
2413
|
this.cellDef = null;
|
|
2414
2414
|
}
|
|
2415
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2416
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.
|
|
2415
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableTemplateExpandableColumnDefinition, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2416
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: DataTableTemplateExpandableColumnDefinition, isStandalone: true, selector: "[madExpandableColumnDef]", inputs: { madExpandableColumnDef: "madExpandableColumnDef" }, ngImport: i0 }); }
|
|
2417
2417
|
}
|
|
2418
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2418
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableTemplateExpandableColumnDefinition, decorators: [{
|
|
2419
2419
|
type: Directive,
|
|
2420
2420
|
args: [{
|
|
2421
2421
|
selector: '[madExpandableColumnDef]',
|
|
@@ -2439,10 +2439,10 @@ class DataTableTemplateExpandableCellDefinition {
|
|
|
2439
2439
|
getCellTemplate() {
|
|
2440
2440
|
return this.templateRef;
|
|
2441
2441
|
}
|
|
2442
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
2443
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.
|
|
2442
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableTemplateExpandableCellDefinition, deps: [{ token: i0.TemplateRef }, { token: DataTableTemplateExpandableColumnDefinition }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2443
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: DataTableTemplateExpandableCellDefinition, isStandalone: true, selector: "[madExpandableCellDef]", ngImport: i0 }); }
|
|
2444
2444
|
}
|
|
2445
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
2445
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableTemplateExpandableCellDefinition, decorators: [{
|
|
2446
2446
|
type: Directive,
|
|
2447
2447
|
args: [{
|
|
2448
2448
|
selector: '[madExpandableCellDef]',
|
|
@@ -3007,8 +3007,8 @@ class DataTableComponent {
|
|
|
3007
3007
|
disableDeleteFilterButton() {
|
|
3008
3008
|
return this.filter?.getActiveFilterCount() === 0;
|
|
3009
3009
|
}
|
|
3010
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3011
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", 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", rowExpandable: "rowExpandable", 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 @if (tableActions?.length || (filterMode === 'COLUMN_BASED' && showDeleteFilterAction)) {\n <div>\n @for (actionGroup of tableActions; track actionGroup) {\n <mad-button-group class=\"table-action-group\">\n @for (tableAction of actionGroup; track tableAction.type) {\n <mad-outline-button [hidden]=\"isHidden(tableAction)\" [disabled]=\"isDisabled(tableAction)\" (click)=\"onActionEvent(tableAction)\">\n {{ translateLabels ? (tableAction.label | translate) : tableAction.label }}\n {{ getSelectedCount(tableAction.type) }}\n </mad-outline-button>\n }\n </mad-button-group>\n }\n @if (filterMode === 'COLUMN_BASED' && showDeleteFilterAction) {\n <mad-button-group class=\"table-action-group\">\n <button\n mat-icon-button\n [matTooltip]=\"'common.filter.delete.tooltip' | translate\"\n [disabled]=\"disableDeleteFilterButton()\"\n class=\"delete-filter-action\"\n color=\"primary\"\n (click)=\"onDeleteFilter()\"\n >\n <mat-icon fontSet=\"material-icons-outlined\" matBadgeColor=\"warn\" [matBadge]=\"getFilterBadgeContent()\">\n filter_alt_off\n </mat-icon>\n </button>\n </mad-button-group>\n }\n </div>\n }\n @if (filterMode === 'TABLE_BASED') {\n <mat-form-field data-cy=\"filter-input\">\n <mat-label>{{ translateLabels ? (filterLabel | translate) : filterLabel }}</mat-label>\n <input matInput autocomplete=\"off\" (keyup)=\"onTableBasedFilterEvent($event)\" placeholder=\"{{ filterPlaceholder }}\" />\n </mat-form-field>\n }\n</div>\n\n<!-- Row action menu -->\n<mat-menu #rowActionMenu=\"matMenu\">\n <ng-template matMenuContent let-element=\"element\">\n @for (rowAction of rowActions; track rowAction) {\n @if (!isHidden(rowAction)) {\n <button\n data-cy=\"row-action-menu-button\"\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 }\n }\n </ng-template>\n</mat-menu>\n\n<!-- editable definition menu -->\n<mat-menu #editableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n @for (definition of editableColumnDefinitions; track definition) {\n <button\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 }\n </ng-template>\n</mat-menu>\n\n<!-- viewable definition menu -->\n<mat-menu #viewableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n @for (definition of viewableColumnDefinitions; track definition) {\n <button\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 }\n </ng-template>\n</mat-menu>\n\n<!-- Table -->\n@if (filterMode === 'COLUMN_BASED' || showEmptyTable || !!dataSource.filteredData?.length) {\n <div class=\"datatable\" [class]=\"tableClass\">\n @if (loading) {\n <div class=\"mad-datatable-spinner-wrapper\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n }\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 @if (selectionEmitMode !== 'NONE' && selectionMode === 'BATCH') {\n <div class=\"mad-datatable-checkbox-container\">\n <mat-checkbox (change)=\"onToggleSelectAll()\" [checked]=\"allSelected\"></mat-checkbox>\n </div>\n }\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 @if (showCheckbox(element)) {\n <div 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 }\n <!-- SINGLE: row action menu icon -->\n @if (showRowActionIcon(element) && hasVisibleRowActions(element)) {\n <mad-icon-button\n data-cy=\"row-action-button\"\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 }\n <!-- SINGLE: row radio button -->\n @if (showRadioButton(element)) {\n <div 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 }\n <!-- EXPANDABLE: row is expandable/collapsable -->\n @if (showExpandableButton(element)) {\n <mad-icon-button (click)=\"onExpand($event, element)\">\n @if (expandedElement !== element) {\n <mat-icon>keyboard_arrow_down</mat-icon>\n } @else {\n <mat-icon>keyboard_arrow_up</mat-icon>\n }\n </mad-icon-button>\n }\n <!-- NONE: nothing -->\n </td>\n </ng-container>\n <!-- Cell definitions and rows with injected cells -->\n @for (column of columns; track column.id) {\n <ng-container [matColumnDef]=\"column.id\">\n <!-- header cell to be injected -->\n @switch (getDataTableHeaderType(column)) {\n @case ('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 }\n @case ('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 }\n @case ('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 }\n @default {\n <th scope=\"col\" mat-header-cell *matHeaderCellDef [class.text-right]=\"column.isRightAligned\">\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n }\n }\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 (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\n <!-- Expanded Content Column - The row is made up of this one column that spans across all columns -->\n @if (!!expandableDef) {\n <ng-container [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\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)=\"!!expandableColumnDef && onExpand($event, row)\"\n ></tr>\n @if (!!expandableDef) {\n <tr mat-row *matRowDef=\"let element; columns: [expandableColumnDef]\" class=\"mad-data-table-expandable-row\"></tr>\n }\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} @else {\n <!-- No data alert -->\n <div data-cy=\"no-data-block\" class=\"noDataText\">\n @if (loading) {\n <div class=\"mad-datatable-spinner-wrapper\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n }\n {{ translateLabels ? (noDataText | translate) : noDataText }}\n </div>\n}\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 @if (editableColumnDefinitions?.length === 1) {\n <mad-icon-button (click)=\"onColumnSettings()\">\n <mat-icon class=\"material-icons-outlined\">view_column</mat-icon>\n </mad-icon-button>\n }\n <!-- column settings: multiple definitions -->\n @if ((editableColumnDefinitions?.length || 0) > 0) {\n <mad-icon-button [matMenuTriggerFor]=\"editableDefinitionMenu\">\n <mat-icon>view_column</mat-icon>\n </mad-icon-button>\n }\n <!-- column view: multiple definitions -->\n @if ((viewableColumnDefinitions?.length || 0) > 0) {\n <mad-icon-button [matMenuTriggerFor]=\"viewableDefinitionMenu\">\n <mat-icon>preview</mat-icon>\n </mad-icon-button>\n }\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<!-- 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{display:inline-flex;vertical-align:middle;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}.delete-filter-action{vertical-align:middle}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { 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: i1$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$4.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$4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$4.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i1$4.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: i10.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i10.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i10.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i10.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i10.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i10.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i10.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i10.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i10.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i10.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i10.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i11.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: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i15.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "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", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i17.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { 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"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: i2$4.TranslatePipe, name: "translate" }], animations: [
|
|
3010
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$5.MatDialog }, { token: MAD_DATA_TABLE_PERSISTENCE_SERVICE }, { token: MAD_DATA_TABLE_GLOBAL_CONFIGURATION }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3011
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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", rowExpandable: "rowExpandable", 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 @if (tableActions?.length || (filterMode === 'COLUMN_BASED' && showDeleteFilterAction)) {\n <div>\n @for (actionGroup of tableActions; track actionGroup) {\n <mad-button-group class=\"table-action-group\">\n @for (tableAction of actionGroup; track tableAction.type) {\n <mad-outline-button [hidden]=\"isHidden(tableAction)\" [disabled]=\"isDisabled(tableAction)\" (click)=\"onActionEvent(tableAction)\">\n {{ translateLabels ? (tableAction.label | translate) : tableAction.label }}\n {{ getSelectedCount(tableAction.type) }}\n </mad-outline-button>\n }\n </mad-button-group>\n }\n @if (filterMode === 'COLUMN_BASED' && showDeleteFilterAction) {\n <mad-button-group class=\"table-action-group\">\n <button\n mat-icon-button\n [matTooltip]=\"'common.filter.delete.tooltip' | translate\"\n [disabled]=\"disableDeleteFilterButton()\"\n class=\"delete-filter-action mat-primary\"\n (click)=\"onDeleteFilter()\"\n >\n <mat-icon fontSet=\"material-icons-outlined\" matBadgeColor=\"warn\" [matBadge]=\"getFilterBadgeContent()\">\n filter_alt_off\n </mat-icon>\n </button>\n </mad-button-group>\n }\n </div>\n }\n @if (filterMode === 'TABLE_BASED') {\n <mat-form-field data-cy=\"filter-input\">\n <mat-label>{{ translateLabels ? (filterLabel | translate) : filterLabel }}</mat-label>\n <input matInput autocomplete=\"off\" (keyup)=\"onTableBasedFilterEvent($event)\" placeholder=\"{{ filterPlaceholder }}\" />\n </mat-form-field>\n }\n</div>\n\n<!-- Row action menu -->\n<mat-menu #rowActionMenu=\"matMenu\">\n <ng-template matMenuContent let-element=\"element\">\n @for (rowAction of rowActions; track rowAction) {\n @if (!isHidden(rowAction)) {\n <button\n data-cy=\"row-action-menu-button\"\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 }\n }\n </ng-template>\n</mat-menu>\n\n<!-- editable definition menu -->\n<mat-menu #editableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n @for (definition of editableColumnDefinitions; track definition) {\n <button\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 }\n </ng-template>\n</mat-menu>\n\n<!-- viewable definition menu -->\n<mat-menu #viewableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n @for (definition of viewableColumnDefinitions; track definition) {\n <button\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 }\n </ng-template>\n</mat-menu>\n\n<!-- Table -->\n@if (filterMode === 'COLUMN_BASED' || showEmptyTable || !!dataSource.filteredData?.length) {\n <div class=\"datatable\" [class]=\"tableClass\">\n @if (loading) {\n <div class=\"mad-datatable-spinner-wrapper\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n }\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 @if (selectionEmitMode !== 'NONE' && selectionMode === 'BATCH') {\n <div class=\"mad-datatable-checkbox-container\">\n <mat-checkbox (change)=\"onToggleSelectAll()\" [checked]=\"allSelected\"></mat-checkbox>\n </div>\n }\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 @if (showCheckbox(element)) {\n <div 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 }\n <!-- SINGLE: row action menu icon -->\n @if (showRowActionIcon(element) && hasVisibleRowActions(element)) {\n <mad-icon-button\n data-cy=\"row-action-button\"\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 }\n <!-- SINGLE: row radio button -->\n @if (showRadioButton(element)) {\n <div 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 }\n <!-- EXPANDABLE: row is expandable/collapsable -->\n @if (showExpandableButton(element)) {\n <mad-icon-button (click)=\"onExpand($event, element)\">\n @if (expandedElement !== element) {\n <mat-icon>keyboard_arrow_down</mat-icon>\n } @else {\n <mat-icon>keyboard_arrow_up</mat-icon>\n }\n </mad-icon-button>\n }\n <!-- NONE: nothing -->\n </td>\n </ng-container>\n <!-- Cell definitions and rows with injected cells -->\n @for (column of columns; track column.id) {\n <ng-container [matColumnDef]=\"column.id\">\n <!-- header cell to be injected -->\n @switch (getDataTableHeaderType(column)) {\n @case ('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 }\n @case ('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 }\n @case ('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 }\n @default {\n <th scope=\"col\" mat-header-cell *matHeaderCellDef [class.text-right]=\"column.isRightAligned\">\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n }\n }\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 (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\n <!-- Expanded Content Column - The row is made up of this one column that spans across all columns -->\n @if (!!expandableDef) {\n <ng-container [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\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)=\"!!expandableColumnDef && onExpand($event, row)\"\n ></tr>\n @if (!!expandableDef) {\n <tr mat-row *matRowDef=\"let element; columns: [expandableColumnDef]\" class=\"mad-data-table-expandable-row\"></tr>\n }\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} @else {\n <!-- No data alert -->\n <div data-cy=\"no-data-block\" class=\"noDataText\">\n @if (loading) {\n <div class=\"mad-datatable-spinner-wrapper\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n }\n {{ translateLabels ? (noDataText | translate) : noDataText }}\n </div>\n}\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 @if (editableColumnDefinitions?.length === 1) {\n <mad-icon-button (click)=\"onColumnSettings()\">\n <mat-icon class=\"material-icons-outlined\">view_column</mat-icon>\n </mad-icon-button>\n }\n <!-- column settings: multiple definitions -->\n @if ((editableColumnDefinitions?.length || 0) > 0) {\n <mad-icon-button [matMenuTriggerFor]=\"editableDefinitionMenu\">\n <mat-icon>view_column</mat-icon>\n </mad-icon-button>\n }\n <!-- column view: multiple definitions -->\n @if ((viewableColumnDefinitions?.length || 0) > 0) {\n <mad-icon-button [matMenuTriggerFor]=\"viewableDefinitionMenu\">\n <mat-icon>preview</mat-icon>\n </mad-icon-button>\n }\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<!-- 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:var(--datatable-background)}.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{display:inline-flex;vertical-align:middle;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:var(--datatable-background);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:var(--datatable-background);z-index:1}.no-pointer-events{pointer-events:none}.active-column-definition{color:var(--mat-sys-on-surface);background-color:var(--datatable-hover)}.mad-dt-child-cell{color:var(--mat-sys-on-surface-variant)}.delete-filter-action{vertical-align:middle}::ng-deep .mat-sort-header .mat-sort-header-arrow:hover{color:var(--main-primary);cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { 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: i1$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$4.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$4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$4.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i1$4.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: i10.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i10.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i10.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i10.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i10.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i10.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i10.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i10.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i10.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i10.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i10.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i11.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: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i15.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "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", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i17.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { 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"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: i2$4.TranslatePipe, name: "translate" }], animations: [
|
|
3012
3012
|
trigger('detailExpand', [
|
|
3013
3013
|
state('collapsed,void', style({ height: '0px', minHeight: '0' })),
|
|
3014
3014
|
state('expanded', style({ height: '*' })),
|
|
@@ -3016,7 +3016,7 @@ class DataTableComponent {
|
|
|
3016
3016
|
]),
|
|
3017
3017
|
] }); }
|
|
3018
3018
|
}
|
|
3019
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3019
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableComponent, decorators: [{
|
|
3020
3020
|
type: Component,
|
|
3021
3021
|
args: [{ selector: 'mad-data-table', animations: [
|
|
3022
3022
|
trigger('detailExpand', [
|
|
@@ -3045,7 +3045,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
3045
3045
|
DataTableFilterHeader,
|
|
3046
3046
|
DataTableFilter,
|
|
3047
3047
|
MatTooltip,
|
|
3048
|
-
], 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 @if (tableActions?.length || (filterMode === 'COLUMN_BASED' && showDeleteFilterAction)) {\n <div>\n @for (actionGroup of tableActions; track actionGroup) {\n <mad-button-group class=\"table-action-group\">\n @for (tableAction of actionGroup; track tableAction.type) {\n <mad-outline-button [hidden]=\"isHidden(tableAction)\" [disabled]=\"isDisabled(tableAction)\" (click)=\"onActionEvent(tableAction)\">\n {{ translateLabels ? (tableAction.label | translate) : tableAction.label }}\n {{ getSelectedCount(tableAction.type) }}\n </mad-outline-button>\n }\n </mad-button-group>\n }\n @if (filterMode === 'COLUMN_BASED' && showDeleteFilterAction) {\n <mad-button-group class=\"table-action-group\">\n <button\n mat-icon-button\n [matTooltip]=\"'common.filter.delete.tooltip' | translate\"\n [disabled]=\"disableDeleteFilterButton()\"\n class=\"delete-filter-action\"\n color=\"primary\"\n (click)=\"onDeleteFilter()\"\n >\n <mat-icon fontSet=\"material-icons-outlined\" matBadgeColor=\"warn\" [matBadge]=\"getFilterBadgeContent()\">\n filter_alt_off\n </mat-icon>\n </button>\n </mad-button-group>\n }\n </div>\n }\n @if (filterMode === 'TABLE_BASED') {\n <mat-form-field data-cy=\"filter-input\">\n <mat-label>{{ translateLabels ? (filterLabel | translate) : filterLabel }}</mat-label>\n <input matInput autocomplete=\"off\" (keyup)=\"onTableBasedFilterEvent($event)\" placeholder=\"{{ filterPlaceholder }}\" />\n </mat-form-field>\n }\n</div>\n\n<!-- Row action menu -->\n<mat-menu #rowActionMenu=\"matMenu\">\n <ng-template matMenuContent let-element=\"element\">\n @for (rowAction of rowActions; track rowAction) {\n @if (!isHidden(rowAction)) {\n <button\n data-cy=\"row-action-menu-button\"\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 }\n }\n </ng-template>\n</mat-menu>\n\n<!-- editable definition menu -->\n<mat-menu #editableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n @for (definition of editableColumnDefinitions; track definition) {\n <button\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 }\n </ng-template>\n</mat-menu>\n\n<!-- viewable definition menu -->\n<mat-menu #viewableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n @for (definition of viewableColumnDefinitions; track definition) {\n <button\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 }\n </ng-template>\n</mat-menu>\n\n<!-- Table -->\n@if (filterMode === 'COLUMN_BASED' || showEmptyTable || !!dataSource.filteredData?.length) {\n <div class=\"datatable\" [class]=\"tableClass\">\n @if (loading) {\n <div class=\"mad-datatable-spinner-wrapper\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n }\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 @if (selectionEmitMode !== 'NONE' && selectionMode === 'BATCH') {\n <div class=\"mad-datatable-checkbox-container\">\n <mat-checkbox (change)=\"onToggleSelectAll()\" [checked]=\"allSelected\"></mat-checkbox>\n </div>\n }\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 @if (showCheckbox(element)) {\n <div 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 }\n <!-- SINGLE: row action menu icon -->\n @if (showRowActionIcon(element) && hasVisibleRowActions(element)) {\n <mad-icon-button\n data-cy=\"row-action-button\"\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 }\n <!-- SINGLE: row radio button -->\n @if (showRadioButton(element)) {\n <div 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 }\n <!-- EXPANDABLE: row is expandable/collapsable -->\n @if (showExpandableButton(element)) {\n <mad-icon-button (click)=\"onExpand($event, element)\">\n @if (expandedElement !== element) {\n <mat-icon>keyboard_arrow_down</mat-icon>\n } @else {\n <mat-icon>keyboard_arrow_up</mat-icon>\n }\n </mad-icon-button>\n }\n <!-- NONE: nothing -->\n </td>\n </ng-container>\n <!-- Cell definitions and rows with injected cells -->\n @for (column of columns; track column.id) {\n <ng-container [matColumnDef]=\"column.id\">\n <!-- header cell to be injected -->\n @switch (getDataTableHeaderType(column)) {\n @case ('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 }\n @case ('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 }\n @case ('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 }\n @default {\n <th scope=\"col\" mat-header-cell *matHeaderCellDef [class.text-right]=\"column.isRightAligned\">\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n }\n }\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 (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\n <!-- Expanded Content Column - The row is made up of this one column that spans across all columns -->\n @if (!!expandableDef) {\n <ng-container [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\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)=\"!!expandableColumnDef && onExpand($event, row)\"\n ></tr>\n @if (!!expandableDef) {\n <tr mat-row *matRowDef=\"let element; columns: [expandableColumnDef]\" class=\"mad-data-table-expandable-row\"></tr>\n }\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} @else {\n <!-- No data alert -->\n <div data-cy=\"no-data-block\" class=\"noDataText\">\n @if (loading) {\n <div class=\"mad-datatable-spinner-wrapper\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n }\n {{ translateLabels ? (noDataText | translate) : noDataText }}\n </div>\n}\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 @if (editableColumnDefinitions?.length === 1) {\n <mad-icon-button (click)=\"onColumnSettings()\">\n <mat-icon class=\"material-icons-outlined\">view_column</mat-icon>\n </mad-icon-button>\n }\n <!-- column settings: multiple definitions -->\n @if ((editableColumnDefinitions?.length || 0) > 0) {\n <mad-icon-button [matMenuTriggerFor]=\"editableDefinitionMenu\">\n <mat-icon>view_column</mat-icon>\n </mad-icon-button>\n }\n <!-- column view: multiple definitions -->\n @if ((viewableColumnDefinitions?.length || 0) > 0) {\n <mad-icon-button [matMenuTriggerFor]=\"viewableDefinitionMenu\">\n <mat-icon>preview</mat-icon>\n </mad-icon-button>\n }\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<!-- 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{display:inline-flex;vertical-align:middle;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}.delete-filter-action{vertical-align:middle}\n"] }]
|
|
3048
|
+
], 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 @if (tableActions?.length || (filterMode === 'COLUMN_BASED' && showDeleteFilterAction)) {\n <div>\n @for (actionGroup of tableActions; track actionGroup) {\n <mad-button-group class=\"table-action-group\">\n @for (tableAction of actionGroup; track tableAction.type) {\n <mad-outline-button [hidden]=\"isHidden(tableAction)\" [disabled]=\"isDisabled(tableAction)\" (click)=\"onActionEvent(tableAction)\">\n {{ translateLabels ? (tableAction.label | translate) : tableAction.label }}\n {{ getSelectedCount(tableAction.type) }}\n </mad-outline-button>\n }\n </mad-button-group>\n }\n @if (filterMode === 'COLUMN_BASED' && showDeleteFilterAction) {\n <mad-button-group class=\"table-action-group\">\n <button\n mat-icon-button\n [matTooltip]=\"'common.filter.delete.tooltip' | translate\"\n [disabled]=\"disableDeleteFilterButton()\"\n class=\"delete-filter-action mat-primary\"\n (click)=\"onDeleteFilter()\"\n >\n <mat-icon fontSet=\"material-icons-outlined\" matBadgeColor=\"warn\" [matBadge]=\"getFilterBadgeContent()\">\n filter_alt_off\n </mat-icon>\n </button>\n </mad-button-group>\n }\n </div>\n }\n @if (filterMode === 'TABLE_BASED') {\n <mat-form-field data-cy=\"filter-input\">\n <mat-label>{{ translateLabels ? (filterLabel | translate) : filterLabel }}</mat-label>\n <input matInput autocomplete=\"off\" (keyup)=\"onTableBasedFilterEvent($event)\" placeholder=\"{{ filterPlaceholder }}\" />\n </mat-form-field>\n }\n</div>\n\n<!-- Row action menu -->\n<mat-menu #rowActionMenu=\"matMenu\">\n <ng-template matMenuContent let-element=\"element\">\n @for (rowAction of rowActions; track rowAction) {\n @if (!isHidden(rowAction)) {\n <button\n data-cy=\"row-action-menu-button\"\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 }\n }\n </ng-template>\n</mat-menu>\n\n<!-- editable definition menu -->\n<mat-menu #editableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n @for (definition of editableColumnDefinitions; track definition) {\n <button\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 }\n </ng-template>\n</mat-menu>\n\n<!-- viewable definition menu -->\n<mat-menu #viewableDefinitionMenu=\"matMenu\">\n <ng-template matMenuContent>\n @for (definition of viewableColumnDefinitions; track definition) {\n <button\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 }\n </ng-template>\n</mat-menu>\n\n<!-- Table -->\n@if (filterMode === 'COLUMN_BASED' || showEmptyTable || !!dataSource.filteredData?.length) {\n <div class=\"datatable\" [class]=\"tableClass\">\n @if (loading) {\n <div class=\"mad-datatable-spinner-wrapper\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n }\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 @if (selectionEmitMode !== 'NONE' && selectionMode === 'BATCH') {\n <div class=\"mad-datatable-checkbox-container\">\n <mat-checkbox (change)=\"onToggleSelectAll()\" [checked]=\"allSelected\"></mat-checkbox>\n </div>\n }\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 @if (showCheckbox(element)) {\n <div 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 }\n <!-- SINGLE: row action menu icon -->\n @if (showRowActionIcon(element) && hasVisibleRowActions(element)) {\n <mad-icon-button\n data-cy=\"row-action-button\"\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 }\n <!-- SINGLE: row radio button -->\n @if (showRadioButton(element)) {\n <div 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 }\n <!-- EXPANDABLE: row is expandable/collapsable -->\n @if (showExpandableButton(element)) {\n <mad-icon-button (click)=\"onExpand($event, element)\">\n @if (expandedElement !== element) {\n <mat-icon>keyboard_arrow_down</mat-icon>\n } @else {\n <mat-icon>keyboard_arrow_up</mat-icon>\n }\n </mad-icon-button>\n }\n <!-- NONE: nothing -->\n </td>\n </ng-container>\n <!-- Cell definitions and rows with injected cells -->\n @for (column of columns; track column.id) {\n <ng-container [matColumnDef]=\"column.id\">\n <!-- header cell to be injected -->\n @switch (getDataTableHeaderType(column)) {\n @case ('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 }\n @case ('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 }\n @case ('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 }\n @default {\n <th scope=\"col\" mat-header-cell *matHeaderCellDef [class.text-right]=\"column.isRightAligned\">\n {{ translateLabels ? (column.label | translate) : column.label }}\n </th>\n }\n }\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 (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\n <!-- Expanded Content Column - The row is made up of this one column that spans across all columns -->\n @if (!!expandableDef) {\n <ng-container [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\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)=\"!!expandableColumnDef && onExpand($event, row)\"\n ></tr>\n @if (!!expandableDef) {\n <tr mat-row *matRowDef=\"let element; columns: [expandableColumnDef]\" class=\"mad-data-table-expandable-row\"></tr>\n }\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} @else {\n <!-- No data alert -->\n <div data-cy=\"no-data-block\" class=\"noDataText\">\n @if (loading) {\n <div class=\"mad-datatable-spinner-wrapper\">\n <mat-spinner [diameter]=\"50\" [strokeWidth]=\"3\"></mat-spinner>\n </div>\n }\n {{ translateLabels ? (noDataText | translate) : noDataText }}\n </div>\n}\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 @if (editableColumnDefinitions?.length === 1) {\n <mad-icon-button (click)=\"onColumnSettings()\">\n <mat-icon class=\"material-icons-outlined\">view_column</mat-icon>\n </mad-icon-button>\n }\n <!-- column settings: multiple definitions -->\n @if ((editableColumnDefinitions?.length || 0) > 0) {\n <mad-icon-button [matMenuTriggerFor]=\"editableDefinitionMenu\">\n <mat-icon>view_column</mat-icon>\n </mad-icon-button>\n }\n <!-- column view: multiple definitions -->\n @if ((viewableColumnDefinitions?.length || 0) > 0) {\n <mad-icon-button [matMenuTriggerFor]=\"viewableDefinitionMenu\">\n <mat-icon>preview</mat-icon>\n </mad-icon-button>\n }\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<!-- 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:var(--datatable-background)}.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{display:inline-flex;vertical-align:middle;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:var(--datatable-background);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:var(--datatable-background);z-index:1}.no-pointer-events{pointer-events:none}.active-column-definition{color:var(--mat-sys-on-surface);background-color:var(--datatable-hover)}.mad-dt-child-cell{color:var(--mat-sys-on-surface-variant)}.delete-filter-action{vertical-align:middle}::ng-deep .mat-sort-header .mat-sort-header-arrow:hover{color:var(--main-primary);cursor:pointer}\n"] }]
|
|
3049
3049
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$5.MatDialog }, { type: DataTablePersistenceService, decorators: [{
|
|
3050
3050
|
type: Inject,
|
|
3051
3051
|
args: [MAD_DATA_TABLE_PERSISTENCE_SERVICE]
|
|
@@ -3193,10 +3193,10 @@ class DataTableTemplateCellDefinition {
|
|
|
3193
3193
|
getCellTemplate() {
|
|
3194
3194
|
return this.templateRef;
|
|
3195
3195
|
}
|
|
3196
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3197
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.
|
|
3196
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableTemplateCellDefinition, deps: [{ token: i0.TemplateRef }, { token: DataTableTemplateColumnDefinition }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
3197
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: DataTableTemplateCellDefinition, isStandalone: true, selector: "[madCellDef]", ngImport: i0 }); }
|
|
3198
3198
|
}
|
|
3199
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3199
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DataTableTemplateCellDefinition, decorators: [{
|
|
3200
3200
|
type: Directive,
|
|
3201
3201
|
args: [{
|
|
3202
3202
|
selector: '[madCellDef]',
|
|
@@ -3242,15 +3242,15 @@ class StepHeaderComponent extends CdkStepHeader {
|
|
|
3242
3242
|
}
|
|
3243
3243
|
return '';
|
|
3244
3244
|
}
|
|
3245
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3246
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
3245
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StepHeaderComponent, deps: [{ token: i1$6.FocusMonitor }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3246
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: StepHeaderComponent, isStandalone: true, selector: "mad-step-header", inputs: { color: "color", index: "index", label: "label", stepControl: "stepControl", 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 [ngClass]=\"{\n 'header-selected': this.selected && !this.closed,\n 'header-default': !this.selected || this.closed,\n 'error-border': this.hasError,\n 'check-border': !this.hasError,\n }\"\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 @if (this.completed || this.hasError) {\n <div class=\"header-label\">\n <mat-icon [ngClass]=\"this.completed ? 'green-check' : 'red-error'\">\n {{ getIcon() }}\n </mat-icon>\n </div>\n }\n @if (!this.hasError && !this.completed) {\n <span data-testid=\"step-number\" class=\"header-label\">{{ this.index + 1 + '.' }}</span>\n }\n <div data-testid=\"step-label\" class=\"header-label\">{{ this.label }}</div>\n</div>\n", styles: [".header{overflow:hidden;outline:var(--error-color);cursor:pointer;box-sizing:content-box;-webkit-tap-highlight-color:transparent;border:1px solid var(--step-border-color);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:var(--step-complete-color)}.step-state-error{width:5px;background:var(--error-color)}.step-state-neutral{width:5px;background:var(--step-neutral-color)}.green-check{color:var(--step-complete-color)}.red-error{color:var(--error-color)}.check-border{border-color:var(--step-border-color)}.error-border{border-color:var(--error-color)}.header-selected{background:var(--step-header-selected-background)}.header-default{background:var(--step-header-default-background)}\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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
3247
3247
|
}
|
|
3248
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3248
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StepHeaderComponent, decorators: [{
|
|
3249
3249
|
type: Component,
|
|
3250
3250
|
args: [{ selector: 'mad-step-header', inputs: ['color'], host: {
|
|
3251
3251
|
class: 'mad-step-header',
|
|
3252
3252
|
role: 'tab',
|
|
3253
|
-
}, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgClass, MatIconModule], template: "<div\n class=\"header\"\n [
|
|
3253
|
+
}, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgClass, MatIconModule], template: "<div\n class=\"header\"\n [ngClass]=\"{\n 'header-selected': this.selected && !this.closed,\n 'header-default': !this.selected || this.closed,\n 'error-border': this.hasError,\n 'check-border': !this.hasError,\n }\"\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 @if (this.completed || this.hasError) {\n <div class=\"header-label\">\n <mat-icon [ngClass]=\"this.completed ? 'green-check' : 'red-error'\">\n {{ getIcon() }}\n </mat-icon>\n </div>\n }\n @if (!this.hasError && !this.completed) {\n <span data-testid=\"step-number\" class=\"header-label\">{{ this.index + 1 + '.' }}</span>\n }\n <div data-testid=\"step-label\" class=\"header-label\">{{ this.label }}</div>\n</div>\n", styles: [".header{overflow:hidden;outline:var(--error-color);cursor:pointer;box-sizing:content-box;-webkit-tap-highlight-color:transparent;border:1px solid var(--step-border-color);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:var(--step-complete-color)}.step-state-error{width:5px;background:var(--error-color)}.step-state-neutral{width:5px;background:var(--step-neutral-color)}.green-check{color:var(--step-complete-color)}.red-error{color:var(--error-color)}.check-border{border-color:var(--step-border-color)}.error-border{border-color:var(--error-color)}.header-selected{background:var(--step-header-selected-background)}.header-default{background:var(--step-header-default-background)}\n"] }]
|
|
3254
3254
|
}], ctorParameters: () => [{ type: i1$6.FocusMonitor }, { type: i0.ElementRef }], propDecorators: { index: [{
|
|
3255
3255
|
type: Input
|
|
3256
3256
|
}], label: [{
|
|
@@ -3351,12 +3351,12 @@ class StepComponent extends CdkStep {
|
|
|
3351
3351
|
this.state = STEP_STATE.ERROR;
|
|
3352
3352
|
}
|
|
3353
3353
|
}
|
|
3354
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3355
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
3354
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StepComponent, deps: [{ token: forwardRef(() => StepperComponent) }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3355
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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 @if (last) {\n <div>\n <mad-primary-button data-cy=\"complete-step-button\" (click)=\"completeLast()\">{{ doneBtnLbl }}</mad-primary-button>\n </div>\n } @else {\n <div>\n <mad-primary-button data-cy=\"next-step-button\" (click)=\"next()\">{{ nextBtnLbl }}</mad-primary-button>\n </div>\n }\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}.step-container{border-left:1px solid var(--step-border-color);border-right:1px solid var(--step-border-color);border-bottom:1px solid var(--step-border-color);flex-direction:column;box-sizing:border-box;display:flex}.step-content,.step-buttons{padding:2em}\n"], dependencies: [{ kind: "component", type: PrimaryButtonComponent, selector: "mad-primary-button", inputs: ["type", "disabled", "title"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
3356
3356
|
}
|
|
3357
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3357
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StepComponent, decorators: [{
|
|
3358
3358
|
type: Component,
|
|
3359
|
-
args: [{ selector: 'mad-step', providers: [{ provide: CdkStep, useExisting: StepComponent }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [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 @if (last) {\n <div>\n <mad-primary-button data-cy=\"complete-step-button\" (click)=\"completeLast()\">{{ doneBtnLbl }}</mad-primary-button>\n </div>\n } @else {\n <div>\n <mad-primary-button data-cy=\"next-step-button\" (click)=\"next()\">{{ nextBtnLbl }}</mad-primary-button>\n </div>\n }\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}.step-container{border-left:1px solid
|
|
3359
|
+
args: [{ selector: 'mad-step', providers: [{ provide: CdkStep, useExisting: StepComponent }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [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 @if (last) {\n <div>\n <mad-primary-button data-cy=\"complete-step-button\" (click)=\"completeLast()\">{{ doneBtnLbl }}</mad-primary-button>\n </div>\n } @else {\n <div>\n <mad-primary-button data-cy=\"next-step-button\" (click)=\"next()\">{{ nextBtnLbl }}</mad-primary-button>\n </div>\n }\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}.step-container{border-left:1px solid var(--step-border-color);border-right:1px solid var(--step-border-color);border-bottom:1px solid var(--step-border-color);flex-direction:column;box-sizing:border-box;display:flex}.step-content,.step-buttons{padding:2em}\n"] }]
|
|
3360
3360
|
}], ctorParameters: () => [{ type: StepperComponent, decorators: [{
|
|
3361
3361
|
type: Inject,
|
|
3362
3362
|
args: [forwardRef(() => StepperComponent)]
|
|
@@ -3407,16 +3407,16 @@ class StepperComponent extends CdkStepper {
|
|
|
3407
3407
|
_stepIsNavigable(index, step) {
|
|
3408
3408
|
return step.completed || this.selectedIndex === index || !this.linear;
|
|
3409
3409
|
}
|
|
3410
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3411
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
3410
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StepperComponent, deps: [{ token: i1$7.Directionality, optional: true }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3411
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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 @for (step of steps; track step; let i = $index; let isLast = $last; let isFirst = $first) {\n <div data-cy=\"step-container\">\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\">\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 }\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 [stepControl]=\"step.stepControl\"\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 [hasError]=\"!!step.stepControl && step.stepControl.invalid && (step.stepControl.touched || step.stepControl.dirty)\"\n [completed]=\"!!step.stepControl && step.stepControl.valid && (step.stepControl.touched || step.stepControl.dirty)\"\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}.step-container{border-left:1px solid var(--step-border-color);border-right:1px solid var(--step-border-color);border-bottom:1px solid var(--step-border-color);flex-direction:column;box-sizing:border-box;display:flex}.step-content,.step-buttons{padding:2em}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: StepHeaderComponent, selector: "mad-step-header", inputs: ["color", "index", "label", "stepControl", "errorMessage", "selected", "active", "optional", "hasError", "completed", "closed"] }], animations: [madStepperAnimations.verticalStepTransition], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
3412
3412
|
}
|
|
3413
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3413
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StepperComponent, decorators: [{
|
|
3414
3414
|
type: Component,
|
|
3415
3415
|
args: [{ selector: 'mad-stepper', host: {
|
|
3416
3416
|
'[class.stepper-vertical]': 'true',
|
|
3417
3417
|
'[attr.aria-orientation]': '"vertical"',
|
|
3418
3418
|
role: 'tablist',
|
|
3419
|
-
}, animations: [madStepperAnimations.verticalStepTransition], providers: [{ provide: CdkStepper, useExisting: StepperComponent }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet, StepHeaderComponent], template: "<!-- Vertical stepper -->\n<ng-container>\n @for (step of steps; track step; let i = $index; let isLast = $last; let isFirst = $first) {\n <div data-cy=\"step-container\">\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\">\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 }\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 [stepControl]=\"step.stepControl\"\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 [hasError]=\"!!step.stepControl && step.stepControl.invalid && (step.stepControl.touched || step.stepControl.dirty)\"\n [completed]=\"!!step.stepControl && step.stepControl.valid && (step.stepControl.touched || step.stepControl.dirty)\"\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}.step-container{border-left:1px solid
|
|
3419
|
+
}, animations: [madStepperAnimations.verticalStepTransition], providers: [{ provide: CdkStepper, useExisting: StepperComponent }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet, StepHeaderComponent], template: "<!-- Vertical stepper -->\n<ng-container>\n @for (step of steps; track step; let i = $index; let isLast = $last; let isFirst = $first) {\n <div data-cy=\"step-container\">\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\">\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 }\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 [stepControl]=\"step.stepControl\"\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 [hasError]=\"!!step.stepControl && step.stepControl.invalid && (step.stepControl.touched || step.stepControl.dirty)\"\n [completed]=\"!!step.stepControl && step.stepControl.valid && (step.stepControl.touched || step.stepControl.dirty)\"\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}.step-container{border-left:1px solid var(--step-border-color);border-right:1px solid var(--step-border-color);border-bottom:1px solid var(--step-border-color);flex-direction:column;box-sizing:border-box;display:flex}.step-content,.step-buttons{padding:2em}\n"] }]
|
|
3420
3420
|
}], ctorParameters: () => [{ type: i1$7.Directionality, decorators: [{
|
|
3421
3421
|
type: Optional
|
|
3422
3422
|
}] }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }], propDecorators: { animationDone: [{
|
|
@@ -3434,8 +3434,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
3434
3434
|
}] } });
|
|
3435
3435
|
|
|
3436
3436
|
class StepperModule {
|
|
3437
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3438
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
3437
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StepperModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
3438
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: StepperModule, imports: [CommonModule,
|
|
3439
3439
|
MatButtonModule,
|
|
3440
3440
|
MatIconModule,
|
|
3441
3441
|
CdkStepperModule,
|
|
@@ -3443,7 +3443,7 @@ class StepperModule {
|
|
|
3443
3443
|
StepperComponent,
|
|
3444
3444
|
StepHeaderComponent,
|
|
3445
3445
|
StepComponent], exports: [StepperComponent, StepHeaderComponent, StepComponent] }); }
|
|
3446
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
3446
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StepperModule, imports: [CommonModule,
|
|
3447
3447
|
MatButtonModule,
|
|
3448
3448
|
MatIconModule,
|
|
3449
3449
|
CdkStepperModule,
|
|
@@ -3452,7 +3452,7 @@ class StepperModule {
|
|
|
3452
3452
|
StepHeaderComponent,
|
|
3453
3453
|
StepComponent] }); }
|
|
3454
3454
|
}
|
|
3455
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3455
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StepperModule, decorators: [{
|
|
3456
3456
|
type: NgModule,
|
|
3457
3457
|
args: [{
|
|
3458
3458
|
imports: [
|
|
@@ -3470,62 +3470,62 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
3470
3470
|
}] });
|
|
3471
3471
|
|
|
3472
3472
|
class ContentHeaderComponent {
|
|
3473
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3474
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
3473
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContentHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3474
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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"] }); }
|
|
3475
3475
|
}
|
|
3476
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3476
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContentHeaderComponent, decorators: [{
|
|
3477
3477
|
type: Component,
|
|
3478
3478
|
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"] }]
|
|
3479
3479
|
}] });
|
|
3480
3480
|
|
|
3481
3481
|
class ContentPanelContainerComponent {
|
|
3482
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3483
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
3482
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContentPanelContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3483
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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"] }); }
|
|
3484
3484
|
}
|
|
3485
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3485
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContentPanelContainerComponent, decorators: [{
|
|
3486
3486
|
type: Component,
|
|
3487
3487
|
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"] }]
|
|
3488
3488
|
}] });
|
|
3489
3489
|
|
|
3490
3490
|
class ContentPanelContainerContentComponent {
|
|
3491
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3492
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
3491
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContentPanelContainerContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3492
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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"] }); }
|
|
3493
3493
|
}
|
|
3494
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3494
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContentPanelContainerContentComponent, decorators: [{
|
|
3495
3495
|
type: Component,
|
|
3496
3496
|
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"] }]
|
|
3497
3497
|
}] });
|
|
3498
3498
|
|
|
3499
3499
|
class ContentPanelContainerFooterComponent {
|
|
3500
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3501
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
3500
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContentPanelContainerFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3501
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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"] }); }
|
|
3502
3502
|
}
|
|
3503
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3503
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContentPanelContainerFooterComponent, decorators: [{
|
|
3504
3504
|
type: Component,
|
|
3505
3505
|
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"] }]
|
|
3506
3506
|
}] });
|
|
3507
3507
|
|
|
3508
3508
|
class ContentPanelContainerSidebarComponent {
|
|
3509
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3510
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
3509
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContentPanelContainerSidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3510
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: ContentPanelContainerSidebarComponent, isStandalone: true, selector: "mad-content-panel-container-sidebar", ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{border-top:.05rem solid var(--mat-sys-outline-variant);min-height:2rem;display:flex;flex:0 0 auto}\n"] }); }
|
|
3511
3511
|
}
|
|
3512
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3512
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContentPanelContainerSidebarComponent, decorators: [{
|
|
3513
3513
|
type: Component,
|
|
3514
|
-
args: [{ selector: 'mad-content-panel-container-sidebar', standalone: true, template: "<ng-content></ng-content>\n", styles: [":host{border-top:.05rem solid
|
|
3514
|
+
args: [{ selector: 'mad-content-panel-container-sidebar', standalone: true, template: "<ng-content></ng-content>\n", styles: [":host{border-top:.05rem solid var(--mat-sys-outline-variant);min-height:2rem;display:flex;flex:0 0 auto}\n"] }]
|
|
3515
3515
|
}] });
|
|
3516
3516
|
|
|
3517
3517
|
class MainContainerComponent {
|
|
3518
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3519
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
3518
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MainContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3519
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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"] }); }
|
|
3520
3520
|
}
|
|
3521
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3521
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MainContainerComponent, decorators: [{
|
|
3522
3522
|
type: Component,
|
|
3523
3523
|
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"] }]
|
|
3524
3524
|
}] });
|
|
3525
3525
|
|
|
3526
3526
|
class ContentPanelModule {
|
|
3527
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3528
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
3527
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContentPanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
3528
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: ContentPanelModule, imports: [CommonModule,
|
|
3529
3529
|
ContentHeaderComponent,
|
|
3530
3530
|
ContentPanelContainerComponent,
|
|
3531
3531
|
ContentPanelContainerContentComponent,
|
|
@@ -3537,9 +3537,9 @@ class ContentPanelModule {
|
|
|
3537
3537
|
ContentPanelContainerFooterComponent,
|
|
3538
3538
|
ContentPanelContainerSidebarComponent,
|
|
3539
3539
|
MainContainerComponent] }); }
|
|
3540
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
3540
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContentPanelModule, imports: [CommonModule] }); }
|
|
3541
3541
|
}
|
|
3542
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3542
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ContentPanelModule, decorators: [{
|
|
3543
3543
|
type: NgModule,
|
|
3544
3544
|
args: [{
|
|
3545
3545
|
imports: [
|
|
@@ -3722,12 +3722,12 @@ class FlowbarComponent {
|
|
|
3722
3722
|
const index = this.getCurrentIndex();
|
|
3723
3723
|
return this._steps.slice(index + 1, this._steps.length).find((step) => step.enabled);
|
|
3724
3724
|
}
|
|
3725
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3726
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
3725
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FlowbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3726
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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 <!-- Always show numbers -->\n <ng-template matStepperIcon=\"number\" let-index=\"index\">\n {{ index + 1 }}\n </ng-template>\n\n <!-- Replace edit/done/error with the same number -->\n <ng-template matStepperIcon=\"edit\" let-index=\"index\">\n {{ index + 1 }}\n </ng-template>\n\n <ng-template matStepperIcon=\"done\" let-index=\"index\">\n {{ index + 1 }}\n </ng-template>\n\n <ng-template matStepperIcon=\"error\" let-index=\"index\">\n {{ index + 1 }}\n </ng-template>\n\n @for (step of _steps; track step) {\n <mat-step [aria-labelledby]=\"!step.enabled ? 'disabled' : null\">\n <ng-template matStepLabel>\n @if (this._headerClick.observers.length > 0) {\n <div class=\"step-header-overlay\" (click)=\"headerClick($event, step)\"></div>\n }\n <span>{{ step.label }}</span>\n </ng-template>\n </mat-step>\n }\n </mat-horizontal-stepper>\n</div>\n", styles: [".stepper-container{display:flex;padding:0 1rem}.step-header-overlay{position:absolute;width:100%;height:100%;right:0;top:0}\n"], dependencies: [{ kind: "ngmodule", type: MatStepperModule }, { kind: "component", type: i1$8.MatStep, selector: "mat-step", inputs: ["color"], exportAs: ["matStep"] }, { kind: "directive", type: i1$8.MatStepLabel, selector: "[matStepLabel]" }, { kind: "component", type: i1$8.MatStepper, selector: "mat-stepper, mat-vertical-stepper, mat-horizontal-stepper, [matStepper]", inputs: ["disableRipple", "color", "labelPosition", "headerPosition", "headerPrefix", "animationDuration"], outputs: ["animationDone"], exportAs: ["matStepper", "matVerticalStepper", "matHorizontalStepper"] }, { kind: "directive", type: i1$8.MatStepperIcon, selector: "ng-template[matStepperIcon]", inputs: ["matStepperIcon"] }] }); }
|
|
3727
3727
|
}
|
|
3728
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3728
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FlowbarComponent, decorators: [{
|
|
3729
3729
|
type: Component,
|
|
3730
|
-
args: [{ selector: 'mad-flowbar', imports: [MatStepperModule], template: "<div class=\"stepper-container\">\n <mat-horizontal-stepper #stepper [selectedIndex]=\"this.getIndexForActiveStep()\" (click)=\"triggerClick()\">\n <!-- Always show numbers -->\n <ng-template matStepperIcon=\"number\" let-index=\"index\">\n {{ index + 1 }}\n </ng-template>\n\n <!-- Replace edit/done/error with the same number -->\n <ng-template matStepperIcon=\"edit\" let-index=\"index\">\n {{ index + 1 }}\n </ng-template>\n\n <ng-template matStepperIcon=\"done\" let-index=\"index\">\n {{ index + 1 }}\n </ng-template>\n\n <ng-template matStepperIcon=\"error\" let-index=\"index\">\n {{ index + 1 }}\n </ng-template>\n\n @for (step of _steps; track step) {\n <mat-step [aria-labelledby]=\"!step.enabled ? 'disabled' : null\">\n <ng-template matStepLabel>\n @if (this._headerClick.observers.length > 0) {\n <div class=\"step-header-overlay\" (click)=\"headerClick($event, step)\"></div>\n }\n <span>{{ step.label }}</span>\n </ng-template>\n </mat-step>\n }\n </mat-horizontal-stepper>\n</div>\n", styles: [".stepper-container{display:flex;padding:0 1rem}
|
|
3730
|
+
args: [{ selector: 'mad-flowbar', imports: [MatStepperModule], template: "<div class=\"stepper-container\">\n <mat-horizontal-stepper #stepper [selectedIndex]=\"this.getIndexForActiveStep()\" (click)=\"triggerClick()\">\n <!-- Always show numbers -->\n <ng-template matStepperIcon=\"number\" let-index=\"index\">\n {{ index + 1 }}\n </ng-template>\n\n <!-- Replace edit/done/error with the same number -->\n <ng-template matStepperIcon=\"edit\" let-index=\"index\">\n {{ index + 1 }}\n </ng-template>\n\n <ng-template matStepperIcon=\"done\" let-index=\"index\">\n {{ index + 1 }}\n </ng-template>\n\n <ng-template matStepperIcon=\"error\" let-index=\"index\">\n {{ index + 1 }}\n </ng-template>\n\n @for (step of _steps; track step) {\n <mat-step [aria-labelledby]=\"!step.enabled ? 'disabled' : null\">\n <ng-template matStepLabel>\n @if (this._headerClick.observers.length > 0) {\n <div class=\"step-header-overlay\" (click)=\"headerClick($event, step)\"></div>\n }\n <span>{{ step.label }}</span>\n </ng-template>\n </mat-step>\n }\n </mat-horizontal-stepper>\n</div>\n", styles: [".stepper-container{display:flex;padding:0 1rem}.step-header-overlay{position:absolute;width:100%;height:100%;right:0;top:0}\n"] }]
|
|
3731
3731
|
}], propDecorators: { _steps: [{
|
|
3732
3732
|
type: Input,
|
|
3733
3733
|
args: ['steps']
|
|
@@ -3746,11 +3746,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
3746
3746
|
}] } });
|
|
3747
3747
|
|
|
3748
3748
|
class FlowbarModule {
|
|
3749
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3750
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
3751
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
3749
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FlowbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
3750
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: FlowbarModule, imports: [CommonModule, MatStepperModule, FlowbarComponent], exports: [FlowbarComponent] }); }
|
|
3751
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FlowbarModule, imports: [CommonModule, MatStepperModule, FlowbarComponent] }); }
|
|
3752
3752
|
}
|
|
3753
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3753
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FlowbarModule, decorators: [{
|
|
3754
3754
|
type: NgModule,
|
|
3755
3755
|
args: [{
|
|
3756
3756
|
imports: [CommonModule, MatStepperModule, FlowbarComponent],
|
|
@@ -3765,31 +3765,31 @@ class SidebarComponent {
|
|
|
3765
3765
|
toggleCollapse() {
|
|
3766
3766
|
this.collapsed = !this.collapsed;
|
|
3767
3767
|
}
|
|
3768
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3769
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
3768
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3769
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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:var(--mat-sys-on-surface-variant)}.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[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
|
|
3770
3770
|
}
|
|
3771
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3771
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SidebarComponent, decorators: [{
|
|
3772
3772
|
type: Component,
|
|
3773
|
-
args: [{ selector: 'mad-sidebar', 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
|
|
3773
|
+
args: [{ selector: 'mad-sidebar', 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:var(--mat-sys-on-surface-variant)}.sidebar-wrapper.collapsed .item-list{display:none}.sidebar-wrapper .item-list{display:flex;flex-direction:column;margin-top:16px}\n"] }]
|
|
3774
3774
|
}], propDecorators: { collapsed: [{
|
|
3775
3775
|
type: Input
|
|
3776
3776
|
}] } });
|
|
3777
3777
|
|
|
3778
3778
|
class SidebarItemComponent {
|
|
3779
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3780
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.
|
|
3779
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SidebarItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3780
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", 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:var(--mat-sys-on-surface);opacity:.04}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
3781
3781
|
}
|
|
3782
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3782
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SidebarItemComponent, decorators: [{
|
|
3783
3783
|
type: Component,
|
|
3784
|
-
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
|
|
3784
|
+
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:var(--mat-sys-on-surface);opacity:.04}\n"] }]
|
|
3785
3785
|
}] });
|
|
3786
3786
|
|
|
3787
3787
|
class SidebarModule {
|
|
3788
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3789
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
3790
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
3788
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SidebarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
3789
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: SidebarModule, imports: [CommonModule, MatIconModule, MatButtonModule, SidebarComponent, SidebarItemComponent], exports: [SidebarComponent, SidebarItemComponent] }); }
|
|
3790
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SidebarModule, imports: [CommonModule, MatIconModule, MatButtonModule, SidebarComponent] }); }
|
|
3791
3791
|
}
|
|
3792
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3792
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SidebarModule, decorators: [{
|
|
3793
3793
|
type: NgModule,
|
|
3794
3794
|
args: [{
|
|
3795
3795
|
exports: [SidebarComponent, SidebarItemComponent],
|
|
@@ -3823,12 +3823,12 @@ class SidebarLayoutComponent {
|
|
|
3823
3823
|
goToPreviousPage() {
|
|
3824
3824
|
this.location.back();
|
|
3825
3825
|
}
|
|
3826
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3827
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
3826
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SidebarLayoutComponent, deps: [{ token: i0.ViewContainerRef }, { token: i1$9.Router }, { token: i2$5.Location }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3827
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: SidebarLayoutComponent, isStandalone: true, selector: "mad-sidebar-layout", inputs: { title: "title", hasBackButton: "hasBackButton", titleTemplate: "titleTemplate", sideBarItems: "sideBarItems", headerContent: "headerContent", actionGroup: "actionGroup", content: "content", footer: "footer" }, ngImport: i0, template: "<mad-main-container class=\"w-full\">\n <mad-content-header>\n @if (headerContentPortal) {\n <ng-template [cdkPortalOutlet]=\"headerContentPortal\"></ng-template>\n } @else {\n <div class=\"sidebar-wrapper default-header-wrapper\">\n <div class=\"back-and-title\">\n @if (hasBackButton) {\n <button class=\"back-button\">\n <mat-icon (click)=\"goToPreviousPage()\" class=\"mat-primary\"> arrow_back</mat-icon>\n </button>\n }\n @if (titleTemplate) {\n <ng-container *ngTemplateOutlet=\"titleTemplate\"></ng-container>\n } @else {\n <h2 class=\"title\">{{ title }}</h2>\n }\n </div>\n <ng-template [cdkPortalOutlet]=\"actionGroupPortal\"></ng-template>\n </div>\n }\n </mad-content-header>\n <mad-content-panel-container>\n @if (sideBarItemsPortal) {\n <mad-content-panel-container-sidebar>\n <ng-template [cdkPortalOutlet]=\"sideBarItemsPortal\"></ng-template>\n </mad-content-panel-container-sidebar>\n }\n @if (contentPortal) {\n <mad-content-panel-container-content>\n <ng-template [cdkPortalOutlet]=\"contentPortal\"></ng-template>\n </mad-content-panel-container-content>\n }\n @if (footerPortal) {\n <mad-content-panel-container-footer>\n <ng-template [cdkPortalOutlet]=\"footerPortal\"></ng-template>\n </mad-content-panel-container-footer>\n }\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$5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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.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 }] }); }
|
|
3828
3828
|
}
|
|
3829
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3829
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SidebarLayoutComponent, decorators: [{
|
|
3830
3830
|
type: Component,
|
|
3831
|
-
args: [{ selector: 'mad-sidebar-layout', imports: [CommonModule, ContentPanelModule, PortalModule, MatIconModule, RouterModule], template: "<mad-main-container class=\"w-full\">\n <mad-content-header>\n @if (headerContentPortal) {\n <ng-template [cdkPortalOutlet]=\"headerContentPortal\"></ng-template>\n } @else {\n <div class=\"sidebar-wrapper default-header-wrapper\">\n <div class=\"back-and-title\">\n @if (hasBackButton) {\n <button class=\"back-button\">\n <mat-icon (click)=\"goToPreviousPage()\"
|
|
3831
|
+
args: [{ selector: 'mad-sidebar-layout', imports: [CommonModule, ContentPanelModule, PortalModule, MatIconModule, RouterModule], template: "<mad-main-container class=\"w-full\">\n <mad-content-header>\n @if (headerContentPortal) {\n <ng-template [cdkPortalOutlet]=\"headerContentPortal\"></ng-template>\n } @else {\n <div class=\"sidebar-wrapper default-header-wrapper\">\n <div class=\"back-and-title\">\n @if (hasBackButton) {\n <button class=\"back-button\">\n <mat-icon (click)=\"goToPreviousPage()\" class=\"mat-primary\"> arrow_back</mat-icon>\n </button>\n }\n @if (titleTemplate) {\n <ng-container *ngTemplateOutlet=\"titleTemplate\"></ng-container>\n } @else {\n <h2 class=\"title\">{{ title }}</h2>\n }\n </div>\n <ng-template [cdkPortalOutlet]=\"actionGroupPortal\"></ng-template>\n </div>\n }\n </mad-content-header>\n <mad-content-panel-container>\n @if (sideBarItemsPortal) {\n <mad-content-panel-container-sidebar>\n <ng-template [cdkPortalOutlet]=\"sideBarItemsPortal\"></ng-template>\n </mad-content-panel-container-sidebar>\n }\n @if (contentPortal) {\n <mad-content-panel-container-content>\n <ng-template [cdkPortalOutlet]=\"contentPortal\"></ng-template>\n </mad-content-panel-container-content>\n }\n @if (footerPortal) {\n <mad-content-panel-container-footer>\n <ng-template [cdkPortalOutlet]=\"footerPortal\"></ng-template>\n </mad-content-panel-container-footer>\n }\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"] }]
|
|
3832
3832
|
}], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i1$9.Router }, { type: i2$5.Location }], propDecorators: { title: [{
|
|
3833
3833
|
type: Input
|
|
3834
3834
|
}], hasBackButton: [{
|
|
@@ -3969,10 +3969,10 @@ class ToolbarService {
|
|
|
3969
3969
|
clearMainActions() {
|
|
3970
3970
|
this.mainActions = [];
|
|
3971
3971
|
}
|
|
3972
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
3973
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.
|
|
3972
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ToolbarService, deps: [{ token: i1$9.Router }, { token: i2$4.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
3973
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ToolbarService, providedIn: 'root' }); }
|
|
3974
3974
|
}
|
|
3975
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
3975
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ToolbarService, decorators: [{
|
|
3976
3976
|
type: Injectable,
|
|
3977
3977
|
args: [{
|
|
3978
3978
|
providedIn: 'root',
|
|
@@ -4030,12 +4030,14 @@ class ToolbarComponent {
|
|
|
4030
4030
|
hasImportantToolbarActions() {
|
|
4031
4031
|
return this.getToolbarActions().filter((value) => !!value.importantAction).length > 0;
|
|
4032
4032
|
}
|
|
4033
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
4034
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
4033
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ToolbarComponent, deps: [{ token: i1$a.BreakpointObserver }, { token: i2$6.Title }, { token: ToolbarService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4034
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: ToolbarComponent, isStandalone: true, selector: "mad-toolbar", host: { classAttribute: "mad-toolbar" }, ngImport: i0, template: "<mat-toolbar class=\"content-toolbar\">\n @if (isRouterLink(getBackAction())) {\n <a data-cy=\"back-link-button\" [routerLink]=\"getBackAction().routerLink\" [queryParams]=\"getBackAction().queryParams\">\n <button [id]=\"'go-back'\" class=\"mat-primary go-back-button\" mat-icon-button>\n <mat-icon>{{ getBackAction().matIcon }}</mat-icon>\n </button>\n </a>\n }\n @if (isAbsoluteLink(getBackAction())) {\n <a data-cy=\"back-href-button\" [href]=\"getBackAction().href\">\n <button [id]=\"'go-back'\" class=\"go-back-button mat-primary\" mat-icon-button>\n <mat-icon>{{ getBackAction().matIcon }}</mat-icon>\n </button>\n </a>\n }\n @if (isAction(getBackAction())) {\n <a data-cy=\"back-action-button\" (click)=\"getBackAction().action()\">\n <button [id]=\"'go-back'\" class=\"mat-primary go-back-button\" mat-icon-button>\n <mat-icon>{{ getBackAction().matIcon }}</mat-icon>\n </button>\n </a>\n }\n\n <span class=\"toolbar-title\">{{ getTitle() }}</span>\n\n @for (mainAction of getMainActions(); track mainAction; let i = $index) {\n @if (hasPermission(mainAction) | async) {\n @if (!(isHandset$ | async)) {\n <div>\n @if (isRouterLink(mainAction)) {\n <a data-cy=\"main-action-link-button\" [routerLink]=\"mainAction.routerLink\">\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 }\n @if (isAction(mainAction)) {\n <a data-cy=\"main-action-button\" (click)=\"mainAction.action()\">\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 }\n </div>\n }\n @if (isHandset$ | async) {\n <div>\n @if (isRouterLink(getBackAction())) {\n <mad-material-action-button\n data-cy=\"material-main-link-button\"\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 }\n @if (isAction(getBackAction())) {\n <mad-material-action-button\n data-cy=\"material-main-action-button\"\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 }\n </div>\n }\n }\n }\n\n <div class=\"right-aligned no-print\">\n @for (action of getToolbarActions(); track action; let i = $index) {\n @if (hasPermission(action) | async) {\n @if (\n (!(isHandset$ | async) && !getToolbarActionsAlwaysAsMenu()) ||\n i < (getToolbarActions().length > 2 ? (hasImportantToolbarActions() ? 0 : 1) : 2) ||\n !!action.importantAction\n ) {\n <mad-icon-button\n data-cy=\"action-icon-button\"\n (click)=\"action.action()\"\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 }\n }\n }\n\n @if ((isHandset$ | async) || getToolbarActionsAlwaysAsMenu()) {\n @if (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 @for (action of getToolbarActions(); track action; let i = $index) {\n @if (!action.importantAction) {\n @if (hasPermission(action) | async) {\n @if (i >= (hasImportantToolbarActions() ? 0 : 1)) {\n <button data-cy=\"burger-menu-button\" mat-menu-item (click)=\"action.action()\" [title]=\"action.actionName\">\n <mat-icon\n class=\"mat-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 }\n }\n }\n }\n </mat-menu>\n }\n }\n </div>\n</mat-toolbar>\n", styles: ["mat-toolbar{background:var(--toolbar-background)}.content-toolbar{height:57px;border-bottom:1px solid var(--mat-sys-outline-variant)}.right-aligned{overflow:visible;margin-left:auto;margin-right:0}.go-back-button{padding-left:0;padding-right:0}.toolbar-title{margin-right:72px}.action-button-content-container{display:flex;align-items:center;gap:5px}\n"], dependencies: [{ kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i4.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { 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], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { 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: "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: i17.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$4.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$4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$4.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" }] }); }
|
|
4035
4035
|
}
|
|
4036
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
4036
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ToolbarComponent, decorators: [{
|
|
4037
4037
|
type: Component,
|
|
4038
|
-
args: [{ selector: 'mad-toolbar',
|
|
4038
|
+
args: [{ selector: 'mad-toolbar', host: {
|
|
4039
|
+
class: 'mad-toolbar',
|
|
4040
|
+
}, imports: [
|
|
4039
4041
|
MatToolbarModule,
|
|
4040
4042
|
RouterLink,
|
|
4041
4043
|
MatButtonModule,
|
|
@@ -4047,12 +4049,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
4047
4049
|
MatBadgeModule,
|
|
4048
4050
|
MatMenuModule,
|
|
4049
4051
|
AsyncPipe,
|
|
4050
|
-
], template: "<mat-toolbar class=\"content-toolbar\">\n @if (isRouterLink(getBackAction())) {\n <a data-cy=\"back-link-button\" [routerLink]=\"getBackAction().routerLink\" [queryParams]=\"getBackAction().queryParams\">\n <button [id]=\"'go-back'\"
|
|
4052
|
+
], template: "<mat-toolbar class=\"content-toolbar\">\n @if (isRouterLink(getBackAction())) {\n <a data-cy=\"back-link-button\" [routerLink]=\"getBackAction().routerLink\" [queryParams]=\"getBackAction().queryParams\">\n <button [id]=\"'go-back'\" class=\"mat-primary go-back-button\" mat-icon-button>\n <mat-icon>{{ getBackAction().matIcon }}</mat-icon>\n </button>\n </a>\n }\n @if (isAbsoluteLink(getBackAction())) {\n <a data-cy=\"back-href-button\" [href]=\"getBackAction().href\">\n <button [id]=\"'go-back'\" class=\"go-back-button mat-primary\" mat-icon-button>\n <mat-icon>{{ getBackAction().matIcon }}</mat-icon>\n </button>\n </a>\n }\n @if (isAction(getBackAction())) {\n <a data-cy=\"back-action-button\" (click)=\"getBackAction().action()\">\n <button [id]=\"'go-back'\" class=\"mat-primary go-back-button\" mat-icon-button>\n <mat-icon>{{ getBackAction().matIcon }}</mat-icon>\n </button>\n </a>\n }\n\n <span class=\"toolbar-title\">{{ getTitle() }}</span>\n\n @for (mainAction of getMainActions(); track mainAction; let i = $index) {\n @if (hasPermission(mainAction) | async) {\n @if (!(isHandset$ | async)) {\n <div>\n @if (isRouterLink(mainAction)) {\n <a data-cy=\"main-action-link-button\" [routerLink]=\"mainAction.routerLink\">\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 }\n @if (isAction(mainAction)) {\n <a data-cy=\"main-action-button\" (click)=\"mainAction.action()\">\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 }\n </div>\n }\n @if (isHandset$ | async) {\n <div>\n @if (isRouterLink(getBackAction())) {\n <mad-material-action-button\n data-cy=\"material-main-link-button\"\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 }\n @if (isAction(getBackAction())) {\n <mad-material-action-button\n data-cy=\"material-main-action-button\"\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 }\n </div>\n }\n }\n }\n\n <div class=\"right-aligned no-print\">\n @for (action of getToolbarActions(); track action; let i = $index) {\n @if (hasPermission(action) | async) {\n @if (\n (!(isHandset$ | async) && !getToolbarActionsAlwaysAsMenu()) ||\n i < (getToolbarActions().length > 2 ? (hasImportantToolbarActions() ? 0 : 1) : 2) ||\n !!action.importantAction\n ) {\n <mad-icon-button\n data-cy=\"action-icon-button\"\n (click)=\"action.action()\"\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 }\n }\n }\n\n @if ((isHandset$ | async) || getToolbarActionsAlwaysAsMenu()) {\n @if (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 @for (action of getToolbarActions(); track action; let i = $index) {\n @if (!action.importantAction) {\n @if (hasPermission(action) | async) {\n @if (i >= (hasImportantToolbarActions() ? 0 : 1)) {\n <button data-cy=\"burger-menu-button\" mat-menu-item (click)=\"action.action()\" [title]=\"action.actionName\">\n <mat-icon\n class=\"mat-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 }\n }\n }\n }\n </mat-menu>\n }\n }\n </div>\n</mat-toolbar>\n", styles: ["mat-toolbar{background:var(--toolbar-background)}.content-toolbar{height:57px;border-bottom:1px solid var(--mat-sys-outline-variant)}.right-aligned{overflow:visible;margin-left:auto;margin-right:0}.go-back-button{padding-left:0;padding-right:0}.toolbar-title{margin-right:72px}.action-button-content-container{display:flex;align-items:center;gap:5px}\n"] }]
|
|
4051
4053
|
}], ctorParameters: () => [{ type: i1$a.BreakpointObserver }, { type: i2$6.Title }, { type: ToolbarService }] });
|
|
4052
4054
|
|
|
4053
4055
|
class ToolbarModule {
|
|
4054
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
4055
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
4056
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ToolbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
4057
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: ToolbarModule, imports: [CommonModule,
|
|
4056
4058
|
RouterModule,
|
|
4057
4059
|
MatMenuModule,
|
|
4058
4060
|
MatButtonModule,
|
|
@@ -4063,7 +4065,7 @@ class ToolbarModule {
|
|
|
4063
4065
|
ButtonModule,
|
|
4064
4066
|
MatBadgeModule,
|
|
4065
4067
|
ToolbarComponent], exports: [ToolbarComponent] }); }
|
|
4066
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
4068
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ToolbarModule, imports: [CommonModule,
|
|
4067
4069
|
RouterModule,
|
|
4068
4070
|
MatMenuModule,
|
|
4069
4071
|
MatButtonModule,
|
|
@@ -4075,7 +4077,7 @@ class ToolbarModule {
|
|
|
4075
4077
|
MatBadgeModule,
|
|
4076
4078
|
ToolbarComponent] }); }
|
|
4077
4079
|
}
|
|
4078
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
4080
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ToolbarModule, decorators: [{
|
|
4079
4081
|
type: NgModule,
|
|
4080
4082
|
args: [{
|
|
4081
4083
|
imports: [
|
|
@@ -4096,8 +4098,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
4096
4098
|
}] });
|
|
4097
4099
|
|
|
4098
4100
|
class MaterialAddonsModule {
|
|
4099
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
4100
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
4101
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MaterialAddonsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
4102
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: MaterialAddonsModule, exports: [ReadOnlyFormFieldModule,
|
|
4101
4103
|
ButtonModule,
|
|
4102
4104
|
ToolbarModule,
|
|
4103
4105
|
MaterialActionButtonModule,
|
|
@@ -4106,7 +4108,7 @@ class MaterialAddonsModule {
|
|
|
4106
4108
|
QuickListModule,
|
|
4107
4109
|
ThrottleClickModule,
|
|
4108
4110
|
SidebarModule] }); }
|
|
4109
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
4111
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MaterialAddonsModule, imports: [ReadOnlyFormFieldModule,
|
|
4110
4112
|
ButtonModule,
|
|
4111
4113
|
ToolbarModule,
|
|
4112
4114
|
MaterialActionButtonModule,
|
|
@@ -4116,7 +4118,7 @@ class MaterialAddonsModule {
|
|
|
4116
4118
|
ThrottleClickModule,
|
|
4117
4119
|
SidebarModule] }); }
|
|
4118
4120
|
}
|
|
4119
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
4121
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MaterialAddonsModule, decorators: [{
|
|
4120
4122
|
type: NgModule,
|
|
4121
4123
|
args: [{
|
|
4122
4124
|
exports: [
|
|
@@ -4164,10 +4166,10 @@ class DragAndDropDirectiveDirective {
|
|
|
4164
4166
|
this.onFileDropped.emit(files);
|
|
4165
4167
|
}
|
|
4166
4168
|
}
|
|
4167
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
4168
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.
|
|
4169
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DragAndDropDirectiveDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
4170
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", 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 }); }
|
|
4169
4171
|
}
|
|
4170
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
4172
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DragAndDropDirectiveDirective, decorators: [{
|
|
4171
4173
|
type: Directive,
|
|
4172
4174
|
args: [{
|
|
4173
4175
|
selector: '[madDragAndDrop]',
|
|
@@ -4258,10 +4260,10 @@ class FileUploadComponent {
|
|
|
4258
4260
|
hasSingleFile() {
|
|
4259
4261
|
return !this.multiple && this.fileList.length === 1;
|
|
4260
4262
|
}
|
|
4261
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
4262
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
4263
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4264
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: FileUploadComponent, isStandalone: true, selector: "mad-file-upload", inputs: { id: "id", multiple: "multiple", accept: "accept", text: "text", showFileList: "showFileList", removable: "removable" }, 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]=\"acceptedFileTypes\"\n [id]=\"id\"\n [multiple]=\"multiple\"\n hidden\n type=\"file\"\n />\n <mat-card-content>\n @if (hasSingleFile()) {\n {{ fileList[0].name }}\n } @else {\n <mat-icon>vertical_align_top</mat-icon>\n {{ text ? text : 'Upload' }}\n }\n </mat-card-content>\n</mat-card>\n\n@if (showFileList) {\n <mat-chip-listbox>\n @for (file of fileList; track file) {\n <mat-chip (click)=\"openFile(file)\" class=\"download\" [removable]=\"removable\" (removed)=\"remove(file)\">\n {{ file.name }}\n @if (removable) {\n <mat-icon matChipRemove>delete_forever</mat-icon>\n }\n </mat-chip>\n }\n </mat-chip-listbox>\n}\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: MatCardModule }, { kind: "component", type: i1$3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i1$3.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: i3$2.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"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: i3$2.MatChipListbox, selector: "mat-chip-listbox", inputs: ["multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "directive", type: i3$2.MatChipRemove, selector: "[matChipRemove]" }] }); }
|
|
4263
4265
|
}
|
|
4264
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
4266
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FileUploadComponent, decorators: [{
|
|
4265
4267
|
type: Component,
|
|
4266
4268
|
args: [{ selector: 'mad-file-upload', imports: [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]=\"acceptedFileTypes\"\n [id]=\"id\"\n [multiple]=\"multiple\"\n hidden\n type=\"file\"\n />\n <mat-card-content>\n @if (hasSingleFile()) {\n {{ fileList[0].name }}\n } @else {\n <mat-icon>vertical_align_top</mat-icon>\n {{ text ? text : 'Upload' }}\n }\n </mat-card-content>\n</mat-card>\n\n@if (showFileList) {\n <mat-chip-listbox>\n @for (file of fileList; track file) {\n <mat-chip (click)=\"openFile(file)\" class=\"download\" [removable]=\"removable\" (removed)=\"remove(file)\">\n {{ file.name }}\n @if (removable) {\n <mat-icon matChipRemove>delete_forever</mat-icon>\n }\n </mat-chip>\n }\n </mat-chip-listbox>\n}\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"] }]
|
|
4267
4269
|
}], propDecorators: { id: [{
|
|
@@ -4326,10 +4328,10 @@ class AlertComponent {
|
|
|
4326
4328
|
onAction() {
|
|
4327
4329
|
this.action.emit();
|
|
4328
4330
|
}
|
|
4329
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
4330
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
4331
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AlertComponent, deps: [{ token: MAD_ALERT_DEFAULT_CONFIGURATION }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4332
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", 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 @if (actionText) {\n <span data-cy=\"alert-action-btn\" class=\"action-btn\" (click)=\"onAction()\">{{ actionText }}</span>\n }\n @if (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 }\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$5.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: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }] }); }
|
|
4331
4333
|
}
|
|
4332
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
4334
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AlertComponent, decorators: [{
|
|
4333
4335
|
type: Component,
|
|
4334
4336
|
args: [{ selector: 'mad-alert', 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 @if (actionText) {\n <span data-cy=\"alert-action-btn\" class=\"action-btn\" (click)=\"onAction()\">{{ actionText }}</span>\n }\n @if (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 }\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"] }]
|
|
4335
4337
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|