ngx-material-entity 0.1.1 → 0.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (133) hide show
  1. package/CONTRIBUTING.md +7 -1
  2. package/README.md +536 -328
  3. package/classes/base.builder.d.ts +35 -0
  4. package/classes/date.utilities.d.ts +58 -0
  5. package/classes/entity.model.d.ts +13 -0
  6. package/classes/{entity-service.class.d.ts → entity.service.d.ts} +35 -20
  7. package/classes/entity.utilities.d.ts +153 -0
  8. package/components/confirm-dialog/confirm-dialog-data.builder.d.ts +23 -0
  9. package/components/confirm-dialog/confirm-dialog-data.d.ts +18 -8
  10. package/components/confirm-dialog/confirm-dialog.component.d.ts +15 -5
  11. package/components/get-validation-error-message.function.d.ts +3 -2
  12. package/components/input/add-array-item-dialog-data.builder.d.ts +20 -0
  13. package/components/input/add-array-item-dialog-data.d.ts +19 -0
  14. package/components/input/input.component.d.ts +151 -30
  15. package/components/input/input.module.d.ts +7 -4
  16. package/components/table/create-dialog/create-dialog-data.builder.d.ts +21 -0
  17. package/components/table/create-dialog/create-entity-dialog-data.builder.d.ts +21 -0
  18. package/components/table/create-dialog/create-entity-dialog-data.d.ts +4 -5
  19. package/components/table/create-dialog/create-entity-dialog.component.d.ts +21 -8
  20. package/components/table/edit-dialog/edit-dialog-data.builder.d.ts +24 -0
  21. package/components/table/edit-dialog/edit-entity-dialog-data.d.ts +7 -8
  22. package/components/table/edit-dialog/edit-entity-dialog.builder.d.ts +22 -0
  23. package/components/table/edit-dialog/edit-entity-dialog.component.d.ts +25 -8
  24. package/components/table/table-data.builder.d.ts +51 -0
  25. package/components/table/table-data.d.ts +46 -30
  26. package/components/table/table.component.d.ts +53 -7
  27. package/components/table/table.module.d.ts +3 -1
  28. package/decorators/array/array-decorator-internal.data.d.ts +45 -0
  29. package/decorators/array/array-decorator.data.d.ts +129 -0
  30. package/decorators/array/array.decorator.d.ts +9 -0
  31. package/decorators/base/base-property.decorator.d.ts +7 -6
  32. package/decorators/base/decorator-types.enum.d.ts +12 -9
  33. package/decorators/base/dropdown-value.interface.d.ts +14 -0
  34. package/decorators/base/property-decorator-internal.data.d.ts +24 -0
  35. package/decorators/base/property-decorator.data.d.ts +70 -0
  36. package/decorators/boolean/boolean-decorator-internal.data.d.ts +25 -0
  37. package/decorators/boolean/boolean-decorator.data.d.ts +37 -0
  38. package/decorators/boolean/boolean.decorator.d.ts +8 -0
  39. package/decorators/date/date-decorator-internal.data.d.ts +44 -0
  40. package/decorators/date/date-decorator.data.d.ts +129 -0
  41. package/decorators/number/number-decorator-internal.data.d.ts +20 -0
  42. package/decorators/number/number-decorator.data.d.ts +36 -0
  43. package/decorators/number/number.decorator.d.ts +8 -0
  44. package/decorators/object/object-decorator-internal.data.d.ts +11 -0
  45. package/decorators/object/object-decorator.data.d.ts +25 -0
  46. package/decorators/object/object.decorator.d.ts +8 -0
  47. package/decorators/string/string-decorator-internal.data.d.ts +41 -0
  48. package/decorators/string/string-decorator.data.d.ts +77 -0
  49. package/decorators/string/string.decorator.d.ts +8 -0
  50. package/esm2020/classes/base.builder.mjs +43 -0
  51. package/esm2020/classes/date.utilities.mjs +138 -0
  52. package/esm2020/classes/entity.model.mjs +19 -0
  53. package/esm2020/classes/entity.service.mjs +83 -0
  54. package/esm2020/classes/entity.utilities.mjs +538 -0
  55. package/esm2020/components/confirm-dialog/confirm-dialog-data.builder.mjs +44 -0
  56. package/esm2020/components/confirm-dialog/confirm-dialog-data.mjs +1 -1
  57. package/esm2020/components/confirm-dialog/confirm-dialog.component.mjs +18 -22
  58. package/esm2020/components/get-validation-error-message.function.mjs +8 -3
  59. package/esm2020/components/input/add-array-item-dialog-data.builder.mjs +30 -0
  60. package/esm2020/components/input/add-array-item-dialog-data.mjs +2 -0
  61. package/esm2020/components/input/input.component.mjs +240 -36
  62. package/esm2020/components/input/input.module.mjs +23 -9
  63. package/esm2020/components/table/create-dialog/create-dialog-data.builder.mjs +32 -0
  64. package/esm2020/components/table/create-dialog/create-entity-dialog-data.builder.mjs +26 -0
  65. package/esm2020/components/table/create-dialog/create-entity-dialog-data.mjs +1 -1
  66. package/esm2020/components/table/create-dialog/create-entity-dialog.component.mjs +31 -31
  67. package/esm2020/components/table/create-dialog/create-entity-dialog.module.mjs +20 -4
  68. package/esm2020/components/table/edit-dialog/edit-dialog-data.builder.mjs +41 -0
  69. package/esm2020/components/table/edit-dialog/edit-entity-dialog-data.mjs +1 -1
  70. package/esm2020/components/table/edit-dialog/edit-entity-dialog.builder.mjs +27 -0
  71. package/esm2020/components/table/edit-dialog/edit-entity-dialog.component.mjs +45 -49
  72. package/esm2020/components/table/table-data.builder.mjs +105 -0
  73. package/esm2020/components/table/table-data.mjs +1 -1
  74. package/esm2020/components/table/table.component.mjs +91 -83
  75. package/esm2020/components/table/table.module.mjs +12 -4
  76. package/esm2020/decorators/array/array-decorator-internal.data.mjs +51 -0
  77. package/esm2020/decorators/array/array-decorator.data.mjs +7 -0
  78. package/esm2020/decorators/array/array.decorator.mjs +24 -0
  79. package/esm2020/decorators/base/base-property.decorator.mjs +6 -5
  80. package/esm2020/decorators/base/decorator-types.enum.mjs +4 -1
  81. package/esm2020/decorators/base/dropdown-value.interface.mjs +2 -0
  82. package/esm2020/decorators/base/property-decorator-internal.data.mjs +38 -0
  83. package/esm2020/decorators/base/property-decorator.data.mjs +6 -0
  84. package/esm2020/decorators/boolean/boolean-decorator-internal.data.mjs +33 -0
  85. package/esm2020/decorators/boolean/boolean-decorator.data.mjs +7 -0
  86. package/esm2020/decorators/boolean/boolean.decorator.mjs +21 -0
  87. package/esm2020/decorators/date/date-decorator-internal.data.mjs +48 -0
  88. package/esm2020/decorators/date/date-decorator.data.mjs +7 -0
  89. package/esm2020/decorators/number/number-decorator-internal.data.mjs +23 -0
  90. package/esm2020/decorators/number/number-decorator.data.mjs +7 -0
  91. package/esm2020/decorators/number/number.decorator.mjs +18 -0
  92. package/esm2020/decorators/object/object-decorator-internal.data.mjs +12 -0
  93. package/esm2020/decorators/object/object-decorator.data.mjs +7 -0
  94. package/esm2020/decorators/object/object.decorator.mjs +13 -0
  95. package/esm2020/decorators/string/string-decorator-internal.data.mjs +48 -0
  96. package/esm2020/decorators/string/string-decorator.data.mjs +7 -0
  97. package/esm2020/decorators/string/string.decorator.mjs +24 -0
  98. package/esm2020/public-api.mjs +20 -13
  99. package/fesm2015/ngx-material-entity.mjs +1664 -944
  100. package/fesm2015/ngx-material-entity.mjs.map +1 -1
  101. package/fesm2020/ngx-material-entity.mjs +1667 -941
  102. package/fesm2020/ngx-material-entity.mjs.map +1 -1
  103. package/package.json +7 -1
  104. package/public-api.d.ts +21 -10
  105. package/classes/entity-model.class.d.ts +0 -9
  106. package/classes/entity-utilities.class.d.ts +0 -95
  107. package/components/input/array-table/add-array-item-dialog/add-array-item-dialog.component.d.ts +0 -35
  108. package/components/input/array-table/add-array-item-dialog/add-array-item-dialog.module.d.ts +0 -12
  109. package/components/input/array-table/array-table.component.d.ts +0 -34
  110. package/components/input/array-table/array-table.module.d.ts +0 -19
  111. package/components/input/internal-input/internal-input.component.d.ts +0 -57
  112. package/components/input/internal-input/internal-input.module.d.ts +0 -16
  113. package/decorators/array.decorator.d.ts +0 -125
  114. package/decorators/base/property-decorator-config.interface.d.ts +0 -50
  115. package/decorators/boolean.decorator.d.ts +0 -42
  116. package/decorators/number.decorator.d.ts +0 -40
  117. package/decorators/object.decorator.d.ts +0 -27
  118. package/decorators/string.decorator.d.ts +0 -76
  119. package/esm2020/classes/entity-model.class.mjs +0 -19
  120. package/esm2020/classes/entity-service.class.mjs +0 -70
  121. package/esm2020/classes/entity-utilities.class.mjs +0 -296
  122. package/esm2020/components/input/array-table/add-array-item-dialog/add-array-item-dialog.component.mjs +0 -43
  123. package/esm2020/components/input/array-table/add-array-item-dialog/add-array-item-dialog.module.mjs +0 -22
  124. package/esm2020/components/input/array-table/array-table.component.mjs +0 -116
  125. package/esm2020/components/input/array-table/array-table.module.mjs +0 -66
  126. package/esm2020/components/input/internal-input/internal-input.component.mjs +0 -73
  127. package/esm2020/components/input/internal-input/internal-input.module.mjs +0 -54
  128. package/esm2020/decorators/array.decorator.mjs +0 -70
  129. package/esm2020/decorators/base/property-decorator-config.interface.mjs +0 -31
  130. package/esm2020/decorators/boolean.decorator.mjs +0 -44
  131. package/esm2020/decorators/number.decorator.mjs +0 -36
  132. package/esm2020/decorators/object.decorator.mjs +0 -23
  133. package/esm2020/decorators/string.decorator.mjs +0 -61
@@ -1,80 +1,51 @@
1
1
  import 'reflect-metadata';
2
2
  import { __decorate, __metadata, __awaiter } from 'tslib';
3
3
  import { BehaviorSubject, firstValueFrom, Subject, takeUntil } from 'rxjs';
4
- import { isEqual, omit, omitBy, isNil, cloneDeep } from 'lodash';
4
+ import { cloneDeep, isEqual, omit, omitBy, isNil } from 'lodash';
5
5
  import * as i0 from '@angular/core';
6
6
  import { Component, Inject, NgModule, Input, ViewChild } from '@angular/core';
7
7
  import * as i1 from '@angular/material/dialog';
8
8
  import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
9
- import * as i5 from '@angular/material/checkbox';
9
+ import * as i6 from '@angular/material/checkbox';
10
10
  import { MatCheckboxModule } from '@angular/material/checkbox';
11
11
  import * as i3 from '@angular/material/button';
12
12
  import { MatButtonModule } from '@angular/material/button';
13
- import * as i7 from '@angular/common';
13
+ import * as i12 from '@angular/common';
14
14
  import { CommonModule } from '@angular/common';
15
- import * as i12 from '@angular/forms';
15
+ import * as i14 from '@angular/forms';
16
16
  import { FormsModule } from '@angular/forms';
17
- import * as i7$1 from '@angular/material/paginator';
18
- import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
19
- import { MatSort } from '@angular/material/sort';
20
- import * as i4$1 from '@angular/material/table';
17
+ import * as i9 from '@angular/material/table';
21
18
  import { MatTableDataSource, MatTableModule } from '@angular/material/table';
22
19
  import { SelectionModel } from '@angular/cdk/collections';
23
- import * as i1$1 from '@angular/material/form-field';
20
+ import * as i2 from '@angular/material/form-field';
24
21
  import { MatFormFieldModule } from '@angular/material/form-field';
25
- import * as i2 from '@angular/material/autocomplete';
22
+ import * as i3$1 from '@angular/material/autocomplete';
26
23
  import { MatAutocompleteModule } from '@angular/material/autocomplete';
27
- import * as i3$1 from '@angular/material/core';
28
- import * as i4 from '@angular/material/select';
24
+ import * as i4 from '@angular/material/core';
25
+ import * as i5 from '@angular/material/select';
29
26
  import { MatSelectModule } from '@angular/material/select';
30
- import * as i6 from '@angular/material/slide-toggle';
27
+ import * as i7 from '@angular/material/slide-toggle';
31
28
  import { MatSlideToggleModule } from '@angular/material/slide-toggle';
32
- import * as i8 from '@angular/material/input';
33
- import { MatInputModule } from '@angular/material/input';
34
- import * as i10 from '@angular/cdk/text-field';
35
- import * as i8$1 from '@angular/material/chips';
29
+ import * as i10 from '@angular/material/chips';
36
30
  import { MatChipsModule } from '@angular/material/chips';
37
- import * as i9 from '@angular/material/icon';
31
+ import * as i11 from '@angular/material/datepicker';
32
+ import { MatDatepickerModule } from '@angular/material/datepicker';
33
+ import * as i13 from '@angular/material/input';
34
+ import { MatInputModule } from '@angular/material/input';
35
+ import * as i15 from '@angular/cdk/text-field';
38
36
  import { MatIconModule } from '@angular/material/icon';
39
- import * as i4$2 from '@angular/material/menu';
37
+ import * as i7$1 from '@angular/material/paginator';
38
+ import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
39
+ import { MatSort } from '@angular/material/sort';
40
+ import * as i4$1 from '@angular/material/menu';
40
41
  import { MatMenuModule } from '@angular/material/menu';
41
42
 
42
43
  /**
43
- * The base options for all propertyDecorators
44
- */
45
- class PropertyDecoratorConfig {
46
- /**
47
- * Defines, Whether or not there should be a line break after this input.
48
- * Is used inside the default create and edit dialogs.
49
- */
50
- // lineBreakAfter?: boolean;
51
- constructor(displayName, display = true, required = true, omitForCreate = false, omitForUpdate = false, defaultWidths = [6, 6, 12], order
52
- // lineBreakAfter: boolean = false
53
- ) {
54
- this.displayName = displayName;
55
- this.display = display;
56
- this.required = required;
57
- this.omitForCreate = omitForCreate;
58
- this.omitForUpdate = omitForUpdate;
59
- this.defaultWidths = defaultWidths;
60
- if (order) {
61
- if (order < 0) {
62
- throw new Error('order must be at least 0');
63
- }
64
- this.order = order;
65
- }
66
- else {
67
- this.order = -1;
68
- }
69
- // this.lineBreakAfter = lineBreakAfter;
70
- }
71
- }
72
-
73
- /**
74
- * The base decorator for setting metadata on properties
75
- * @param metadata The metadata to define
76
- * @param type The type of metadata
77
- * @returns The function that sets the metadata
44
+ * The base decorator for setting metadata on properties.
45
+ *
46
+ * @param metadata - The metadata to define.
47
+ * @param type - The type of metadata.
48
+ * @returns The method that sets the metadata.
78
49
  */
79
50
  function baseProperty(metadata, type) {
80
51
  return function (target, propertyKey) {
@@ -101,68 +72,119 @@ var DecoratorTypes;
101
72
  DecoratorTypes["ARRAY"] = "array";
102
73
  DecoratorTypes["ARRAY_STRING_CHIPS"] = "arrayStringChips";
103
74
  DecoratorTypes["ARRAY_STRING_AUTOCOMPLETE_CHIPS"] = "arrayStringAutocompleteChips";
75
+ DecoratorTypes["DATE"] = "date";
76
+ DecoratorTypes["DATE_RANGE"] = "dateRange";
77
+ DecoratorTypes["DATE_TIME"] = "dateTime";
104
78
  })(DecoratorTypes || (DecoratorTypes = {}));
105
79
 
106
80
  /**
107
- * Decorator for setting and getting string propery metadata
108
- * @param metadata The metadata of the string property
81
+ * The internal Position. Sets default values and validates user input.
109
82
  */
110
- function string(metadata) {
111
- if (metadata.displayStyle === 'dropdown') {
112
- return baseProperty(new DropdownStringDecoratorConfig(metadata), DecoratorTypes.STRING_DROPDOWN);
113
- }
114
- else if (metadata.displayStyle === 'autocomplete') {
115
- return baseProperty(new AutocompleteStringDecoratorConfig(metadata), DecoratorTypes.STRING_AUTOCOMPLETE);
116
- }
117
- else if (metadata.displayStyle === 'textbox') {
118
- return baseProperty(new TextboxStringDecoratorConfig(metadata), DecoratorTypes.STRING_TEXTBOX);
83
+ class PositionInternal {
84
+ constructor(data) {
85
+ this.validateInput(data);
86
+ this.row = (data === null || data === void 0 ? void 0 : data.row) ? data.row : -1;
87
+ this.order = (data === null || data === void 0 ? void 0 : data.order) ? data.order : -1;
88
+ }
89
+ validateInput(data) {
90
+ if (data === null || data === void 0 ? void 0 : data.order) {
91
+ if (data.order < 1) {
92
+ throw new Error('order must be at least 1');
93
+ }
94
+ if (data.order > 12) {
95
+ throw new Error('order cannot be bigger than 12 (the minimum value for a bootstrap column)');
96
+ }
97
+ }
98
+ if ((data === null || data === void 0 ? void 0 : data.row) && (data.row < 1)) {
99
+ throw new Error('row must be at least 1');
100
+ }
119
101
  }
120
- else {
121
- return baseProperty(new DefaultStringDecoratorConfig(metadata), DecoratorTypes.STRING);
102
+ }
103
+ /**
104
+ * The internal PropertyDecoratorConfig. Sets default values.
105
+ */
106
+ class PropertyDecoratorConfigInternal {
107
+ constructor(data) {
108
+ this.display = data.display != undefined ? data.display : true;
109
+ this.displayName = data.displayName;
110
+ this.required = data.required != undefined ? data.required : true;
111
+ this.omitForCreate = data.omitForCreate != undefined ? data.omitForCreate : false;
112
+ this.omitForUpdate = data.omitForUpdate != undefined ? data.omitForUpdate : false;
113
+ this.defaultWidths = data.defaultWidths ? data.defaultWidths : [6, 6, 12];
114
+ this.position = new PositionInternal(data.position);
122
115
  }
123
116
  }
117
+
124
118
  /**
125
- * Interface definition for the @string metadata
119
+ * The internal DropdownStringDecoratorConfig. Sets default values.
126
120
  */
127
- class StringDecoratorConfig extends PropertyDecoratorConfig {
121
+ class DropdownStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
122
+ constructor(data) {
123
+ super(data);
124
+ this.displayStyle = data.displayStyle;
125
+ this.dropdownValues = data.dropdownValues;
126
+ }
128
127
  }
129
- class DropdownStringDecoratorConfig extends StringDecoratorConfig {
130
- constructor(metadata) {
131
- super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
132
- this.displayStyle = metadata.displayStyle;
133
- this.dropdownValues = metadata.dropdownValues;
128
+ /**
129
+ * The internal DefaultStringDecoratorConfig. Sets default values.
130
+ */
131
+ class DefaultStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
132
+ constructor(data) {
133
+ super(data);
134
+ this.displayStyle = data.displayStyle;
135
+ this.minLength = data.minLength;
136
+ this.maxLength = data.maxLength;
137
+ this.regex = data.regex;
134
138
  }
135
139
  }
136
- class DefaultStringDecoratorConfig extends StringDecoratorConfig {
137
- constructor(metadata) {
138
- super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
139
- this.displayStyle = metadata.displayStyle;
140
- this.minLength = metadata.minLength;
141
- this.maxLength = metadata.maxLength;
142
- this.regex = metadata.regex;
140
+ /**
141
+ * The internal TextboxStringDecoratorConfig. Sets default values.
142
+ */
143
+ class TextboxStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
144
+ constructor(data) {
145
+ super(data);
146
+ this.displayStyle = data.displayStyle;
147
+ this.minLength = data.minLength;
148
+ this.maxLength = data.maxLength;
143
149
  }
144
150
  }
145
- class TextboxStringDecoratorConfig extends StringDecoratorConfig {
146
- constructor(metadata) {
147
- super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
148
- this.displayStyle = metadata.displayStyle;
149
- this.minLength = metadata.minLength;
150
- this.maxLength = metadata.maxLength;
151
+ /**
152
+ * The internal AutocompleteStringDecoratorConfig. Sets default values.
153
+ */
154
+ class AutocompleteStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
155
+ constructor(data) {
156
+ super(data);
157
+ this.displayStyle = data.displayStyle;
158
+ this.autocompleteValues = data.autocompleteValues;
159
+ this.minLength = data.minLength;
160
+ this.maxLength = data.maxLength;
161
+ this.regex = data.regex;
151
162
  }
152
163
  }
153
- class AutocompleteStringDecoratorConfig extends StringDecoratorConfig {
154
- constructor(metadata) {
155
- super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
156
- this.displayStyle = metadata.displayStyle;
157
- this.autocompleteValues = metadata.autocompleteValues;
158
- this.minLength = metadata.minLength;
159
- this.maxLength = metadata.maxLength;
160
- this.regex = metadata.regex;
164
+
165
+ /**
166
+ * Decorator for setting and getting string Property metadata.
167
+ *
168
+ * @param metadata - The metadata of the string property.
169
+ * @returns The method that defines the metadata.
170
+ */
171
+ function string(metadata) {
172
+ if (metadata.displayStyle === 'dropdown') {
173
+ return baseProperty(new DropdownStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING_DROPDOWN);
174
+ }
175
+ else if (metadata.displayStyle === 'autocomplete') {
176
+ return baseProperty(new AutocompleteStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING_AUTOCOMPLETE);
177
+ }
178
+ else if (metadata.displayStyle === 'textbox') {
179
+ return baseProperty(new TextboxStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING_TEXTBOX);
180
+ }
181
+ else {
182
+ return baseProperty(new DefaultStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING);
161
183
  }
162
184
  }
163
185
 
164
186
  /**
165
- * The base Entity class.
187
+ * A base Entity class with a builtin id.
166
188
  */
167
189
  class Entity {
168
190
  }
@@ -178,19 +200,157 @@ __decorate([
178
200
  __metadata("design:type", String)
179
201
  ], Entity.prototype, "id", void 0);
180
202
 
181
- var _a;
203
+ const DAY_IN_MS = 1000 * 60 * 60 * 24;
204
+ /**
205
+ * Contains Helper Functions for handling date properties.
206
+ */
207
+ class DateUtilities {
208
+ /**
209
+ * Gets the given value as a date value.
210
+ *
211
+ * @param value - The value to get as a date.
212
+ * @returns The given value as a date.
213
+ */
214
+ static asDate(value) {
215
+ return value;
216
+ }
217
+ /**
218
+ * Gets the default times used by the DateTime picker when nothing is specified by the user.
219
+ *
220
+ * @param format - The time format. Defaults to 24.
221
+ * @param minuteSteps - The steps from one time value to the next. Defaults to 30.
222
+ * @returns Times in the 24 hour format from 0:00 until 23:30 in 30 minute steps.
223
+ */
224
+ static getDefaultTimes(format = 24, minuteSteps = 30) {
225
+ const res = [{ displayName: '-', value: undefined }];
226
+ for (let hour = 0; hour < 24; hour++) {
227
+ for (let minute = 0; minute < 60; minute += minuteSteps) {
228
+ res.push(this.getTimeDropdownValue(format, hour, minute));
229
+ }
230
+ }
231
+ return res;
232
+ }
233
+ static getTimeDropdownValue(format, hour, minute) {
234
+ const displayHour = this.getFormattedHour(format, cloneDeep(hour));
235
+ const displayMinute = this.getFormattedMinute(format, hour, minute);
236
+ return {
237
+ displayName: `${displayHour}:${displayMinute}`,
238
+ value: {
239
+ hours: hour,
240
+ minutes: minute
241
+ }
242
+ };
243
+ }
244
+ static getFormattedHour(format, hour) {
245
+ if (format === 12 && hour > 12) {
246
+ hour -= 12;
247
+ }
248
+ return hour;
249
+ }
250
+ static getFormattedMinute(format, hour, minute) {
251
+ let res = `${minute}`;
252
+ if (format === 12) {
253
+ if (hour > 12) {
254
+ res = `${minute} PM`;
255
+ }
256
+ else {
257
+ res = `${minute} AM`;
258
+ }
259
+ }
260
+ if (minute.toString().length === 1) {
261
+ res = '0'.concat(res);
262
+ }
263
+ return res;
264
+ }
265
+ /**
266
+ * Gets the Time object from the given date.
267
+ *
268
+ * @param value - The date to get the time object from.
269
+ * @returns The Time object build from the date value.
270
+ */
271
+ static getTimeFromDate(value) {
272
+ if (!value) {
273
+ return {
274
+ hours: undefined,
275
+ minutes: undefined
276
+ };
277
+ }
278
+ else {
279
+ return {
280
+ hours: new Date(value).getHours(),
281
+ minutes: new Date(value).getMinutes()
282
+ };
283
+ }
284
+ }
285
+ /**
286
+ * Gets the dates between the two given gates. Does additional filtering based on the provided DateRange metadata.
287
+ *
288
+ * @param startDate - The start date.
289
+ * @param endDate - The end date.
290
+ * @param metadataDateRangeDate - The metadata.
291
+ * @returns All dates between the two provided dates. Includes start and end date.
292
+ */
293
+ static getDatesBetween(startDate, endDate, metadataDateRangeDate) {
294
+ const res = [];
295
+ while (startDate.getFullYear() < endDate.getFullYear()
296
+ || startDate.getMonth() < endDate.getMonth()
297
+ || startDate.getDate() <= endDate.getDate()) {
298
+ res.push(new Date(startDate));
299
+ startDate.setTime(startDate.getTime() + DAY_IN_MS);
300
+ }
301
+ if (metadataDateRangeDate.filter) {
302
+ return res.filter(d => { var _a; return (_a = metadataDateRangeDate.filter) === null || _a === void 0 ? void 0 : _a.call(metadataDateRangeDate, d); });
303
+ }
304
+ else {
305
+ return res;
306
+ }
307
+ }
308
+ /**
309
+ * Get all valid times for the dropdown of a datetime property.
310
+ *
311
+ * @param date - The date of the datetime.
312
+ * @param times - All given times to filter.
313
+ * @param min - The function that defines the minimum time.
314
+ * @param max - The function that defines the maximum time.
315
+ * @param filter - A filter function to do more specific time filtering. This could be e.g. The removal of lunch breaks.
316
+ * @returns All valid dropdown values for the datetime property.
317
+ */
318
+ static getValidTimesForDropdown(date, times, min, max, filter) {
319
+ if (min) {
320
+ const minTime = min(date);
321
+ times = times.filter(t => !t.value
322
+ || t.value.hours > minTime.hours
323
+ || (t.value.hours === minTime.hours
324
+ && t.value.minutes >= minTime.minutes));
325
+ }
326
+ if (max) {
327
+ const maxTime = max(date);
328
+ times = times.filter(t => !t.value
329
+ || t.value.hours < maxTime.hours
330
+ || (t.value.hours === maxTime.hours
331
+ && t.value.minutes <= maxTime.minutes));
332
+ }
333
+ if (filter) {
334
+ times = times.filter(t => !t.value || filter(t.value));
335
+ }
336
+ return times;
337
+ }
338
+ }
339
+
182
340
  /**
183
- * Contains HelperMethods around handling Entities and their property-metadata
341
+ * Contains HelperMethods around handling Entities and their property-metadata.
184
342
  */
185
343
  class EntityUtilities {
186
344
  /**
187
- * Gets the properties to omit when updating the entity
188
- * @returns The properties which should be left out for updating a new Entity
345
+ * Gets the properties to omit when updating the entity.
346
+ *
347
+ * @param entity - The entity to get the properties which should be left out for updating from.
348
+ * @returns The properties which should be left out for updating an Entity.
189
349
  */
190
350
  static getOmitForUpdate(entity) {
191
351
  const res = [];
192
- for (const key of Reflect.ownKeys(entity)) {
193
- const metadata = Reflect.getMetadata('metadata', entity, key);
352
+ for (const key of EntityUtilities.keysOf(entity)) {
353
+ const metadata = EntityUtilities.getPropertyMetadata(entity, key);
194
354
  if (metadata.omitForUpdate) {
195
355
  res.push(key);
196
356
  }
@@ -198,13 +358,15 @@ class EntityUtilities {
198
358
  return res;
199
359
  }
200
360
  /**
201
- * Gets the properties to omit when creating new entities
202
- * @returns The properties which should be left out for creating a new Entity
361
+ * Gets the properties to omit when creating new entities.
362
+ *
363
+ * @param entity - The entity to get the properties which should be left out for creating from.
364
+ * @returns The properties which should be left out for creating a new Entity.
203
365
  */
204
366
  static getOmitForCreate(entity) {
205
367
  const res = [];
206
- for (const key of Reflect.ownKeys(entity)) {
207
- const metadata = Reflect.getMetadata('metadata', entity, key);
368
+ for (const key of EntityUtilities.keysOf(entity)) {
369
+ const metadata = EntityUtilities.getPropertyMetadata(entity, key);
208
370
  if (metadata.omitForCreate) {
209
371
  res.push(key);
210
372
  }
@@ -212,11 +374,13 @@ class EntityUtilities {
212
374
  return res;
213
375
  }
214
376
  /**
215
- * Gets the metadata included in an property
216
- * @param entity The entity with the property to get the metadata from
217
- * @param propertyKey The property on the given Entity to get the metadata from
218
- * @param type For secure Typing, defines the returned PropertyConfig
219
- * @returns The metadata of the property
377
+ * Gets the metadata included in an property.
378
+ *
379
+ * @param entity - The entity with the property to get the metadata from.
380
+ * @param propertyKey - The property on the given Entity to get the metadata from.
381
+ * @param type - For secure Typing, defines the returned PropertyConfig.
382
+ * @returns The metadata of the property.
383
+ * @throws When no metadata can be found for the given property.
220
384
  */
221
385
  static getPropertyMetadata(entity, propertyKey,
222
386
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -224,143 +388,144 @@ class EntityUtilities {
224
388
  try {
225
389
  const metadata = Reflect.getMetadata('metadata', entity, propertyKey);
226
390
  if (!metadata) {
227
- throw new Error(`Could not find metadata for property ${String(propertyKey)}
228
- on the entity ${JSON.stringify(entity)}`);
391
+ throw new Error(`Could not find metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
229
392
  }
230
393
  return metadata;
231
394
  }
232
395
  catch (error) {
233
- throw new Error(`Could not find metadata for property ${String(propertyKey)}
234
- on the entity ${JSON.stringify(entity)}`);
396
+ throw new Error(`Could not find metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
235
397
  }
236
398
  }
237
399
  /**
238
400
  * Gets the type of the property-metadata.
239
- * @param entity The entity with the property to get the type from
240
- * @param propertyKey The property on the given Entity to get the type from
241
- * @returns The type of the metadata
401
+ *
402
+ * @param entity - The entity with the property to get the type from.
403
+ * @param propertyKey - The property on the given Entity to get the type from.
404
+ * @returns The type of the metadata.
405
+ * @throws Will throw an error if no metadata can be found for the given property.
242
406
  */
243
407
  static getPropertyType(entity, propertyKey) {
244
408
  try {
245
409
  const propertyType = Reflect.getMetadata('type', entity, propertyKey);
246
410
  if (!propertyType) {
247
- throw new Error(`Could not find type metadata for property ${String(propertyKey)}
248
- on the entity ${JSON.stringify(entity)}`);
411
+ throw new Error(`Could not find type metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
249
412
  }
250
413
  return propertyType;
251
414
  }
252
415
  catch (error) {
253
- throw new Error(`Could not find type metadata for property ${String(propertyKey)}
254
- on the entity ${JSON.stringify(entity)}`);
416
+ throw new Error(`Could not find type metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
255
417
  }
256
418
  }
257
419
  /**
258
420
  * Sets all property values based on a given entity data-object.
259
- * @param entity The data object to get the property values from.
260
- * @param target
261
- * the target object that needs to be constructed
262
- * (if called inside a Entity constructor its usually this)
421
+ *
422
+ * @param target - The target object that needs to be constructed (if called inside an Entity constructor its usually this).
423
+ * @param entity - The data object to get the property values from.
263
424
  * @alias new
264
425
  * @alias build
265
426
  * @alias construct
266
427
  */
267
428
  static new(target, entity) {
268
- if (entity) {
269
- for (const key in entity) {
270
- Reflect.set(target, key, Reflect.get(entity, key));
429
+ for (const key in target) {
430
+ const type = EntityUtilities.getPropertyType(target, key);
431
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
432
+ let value = entity ? Reflect.get(entity, key) : undefined;
433
+ switch (type) {
434
+ case DecoratorTypes.OBJECT:
435
+ const objectMetadata = EntityUtilities.getPropertyMetadata(target, key, DecoratorTypes.OBJECT);
436
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
437
+ value = new objectMetadata.EntityClass(value);
438
+ break;
439
+ case DecoratorTypes.ARRAY:
440
+ const inputArray = value;
441
+ const resArray = [];
442
+ if (inputArray) {
443
+ const arrayMetadata = EntityUtilities.getPropertyMetadata(target, key, DecoratorTypes.ARRAY);
444
+ for (const item of inputArray) {
445
+ const itemWithMetadata = new arrayMetadata.EntityClass(item);
446
+ resArray.push(itemWithMetadata);
447
+ }
448
+ }
449
+ value = resArray;
450
+ break;
451
+ default:
452
+ break;
271
453
  }
454
+ Reflect.set(target, key, value);
272
455
  }
273
456
  }
274
457
  /**
275
458
  * Checks if the values on an entity are valid.
276
- * Also checks all the validators given by the metadata ("required", "maxLength" etc.)
277
- * @param entity The entity to validate.
278
- * @param omit Whether to check for creatiung or editing validity
459
+ * Also checks all the validators given by the metadata ("required", "maxLength" etc.).
460
+ *
461
+ * @param entity - The entity to validate.
462
+ * @param omit - Whether to check for creating or editing validity.
279
463
  * @returns Whether or not the entity is valid.
280
464
  */
281
465
  static isEntityValid(entity, omit) {
282
466
  for (const key in entity) {
283
- if (!this.isPropertyValid(entity, key, omit)) {
467
+ if (!EntityUtilities.isPropertyValid(entity, key, omit)) {
284
468
  return false;
285
469
  }
286
470
  }
287
471
  return true;
288
472
  }
289
473
  /**
290
- * Checks if a single property value is valid
291
- * @param entity The entity where the property is from
292
- * @param key The name of the property
293
- * @returns Whether or not the property value is valid
474
+ * Checks if a single property value is valid.
475
+ *
476
+ * @param entity - The entity where the property is from.
477
+ * @param key - The name of the property.
478
+ * @param omit - Whether to check if the given entity is valid for creation or updating.
479
+ * @returns Whether or not the property value is valid.
480
+ * @throws Throws when it extracts an unknown metadata type.
294
481
  */
295
482
  static isPropertyValid(entity, key, omit) {
296
- const type = this.getPropertyType(entity, key);
297
- const metadata = this.getPropertyMetadata(entity, key, type);
298
- const metadataDefaultString = metadata;
299
- const metadataTextboxString = metadata;
300
- const metadataAutocompleteString = metadata;
301
- const metadataDefaultNumber = metadata;
302
- const objectProperty = entity[key];
303
- const metadataEntityArray = metadata;
304
- const arrayItems = entity[key];
483
+ const type = EntityUtilities.getPropertyType(entity, key);
484
+ const metadata = EntityUtilities.getPropertyMetadata(entity, key, type);
305
485
  if (metadata.omitForCreate && omit === 'create') {
306
486
  return true;
307
487
  }
308
- if (metadata.omitForUpdate && omit === 'edit') {
488
+ if (metadata.omitForUpdate && omit === 'update') {
309
489
  return true;
310
490
  }
311
491
  if (metadata.required && !entity[key]) {
312
492
  return false;
313
493
  }
314
494
  switch (type) {
495
+ case DecoratorTypes.BOOLEAN_DROPDOWN:
496
+ case DecoratorTypes.BOOLEAN_CHECKBOX:
497
+ case DecoratorTypes.BOOLEAN_TOGGLE:
498
+ return true;
499
+ case DecoratorTypes.STRING_DROPDOWN:
500
+ return true;
315
501
  case DecoratorTypes.STRING:
316
- if (metadataDefaultString.maxLength
317
- && entity[key].length > metadataDefaultString.maxLength) {
318
- return false;
319
- }
320
- if (metadataDefaultString.minLength
321
- && entity[key].length < metadataDefaultString.minLength) {
322
- return false;
323
- }
324
- if (metadataDefaultString.regex
325
- && !entity[key].match(metadataDefaultString.regex)) {
326
- return false;
327
- }
328
- break;
329
502
  case DecoratorTypes.STRING_AUTOCOMPLETE:
330
- if (metadataAutocompleteString.maxLength
331
- && entity[key].length > metadataAutocompleteString.maxLength) {
332
- return false;
333
- }
334
- if (metadataAutocompleteString.minLength
335
- && entity[key].length < metadataAutocompleteString.minLength) {
336
- return false;
337
- }
338
- if (metadataAutocompleteString.regex
339
- && entity[key].match(metadataAutocompleteString.regex)) {
503
+ const entityString = entity[key];
504
+ const stringMetadata = metadata;
505
+ if (!this.isStringValid(entityString, stringMetadata)) {
340
506
  return false;
341
507
  }
342
508
  break;
343
509
  case DecoratorTypes.STRING_TEXTBOX:
344
- if (metadataTextboxString.maxLength
345
- && entity[key].length > metadataTextboxString.maxLength) {
346
- return false;
347
- }
348
- if (metadataTextboxString.minLength
349
- && entity[key].length < metadataTextboxString.minLength) {
510
+ const entityTextbox = entity[key];
511
+ const textboxMetadata = metadata;
512
+ if (!this.isTextboxValid(entityTextbox, textboxMetadata)) {
350
513
  return false;
351
514
  }
352
515
  break;
516
+ case DecoratorTypes.NUMBER_DROPDOWN:
517
+ return true;
353
518
  case DecoratorTypes.NUMBER:
354
- if (metadataDefaultNumber.max && entity[key] > metadataDefaultNumber.max) {
355
- return false;
356
- }
357
- if (metadataDefaultNumber.min && entity[key] > metadataDefaultNumber.min) {
519
+ const entityNumber = entity[key];
520
+ const numberMetadata = metadata;
521
+ if (!this.isNumberValid(entityNumber, numberMetadata)) {
358
522
  return false;
359
523
  }
360
524
  break;
361
525
  case DecoratorTypes.OBJECT:
362
- for (const parameterKey in objectProperty) {
363
- if (!this.isPropertyValid(objectProperty, parameterKey, omit)) {
526
+ const entityObject = entity[key];
527
+ for (const parameterKey in entityObject) {
528
+ if (!EntityUtilities.isPropertyValid(entityObject, parameterKey, omit)) {
364
529
  return false;
365
530
  }
366
531
  }
@@ -368,7 +533,30 @@ class EntityUtilities {
368
533
  case DecoratorTypes.ARRAY_STRING_CHIPS:
369
534
  case DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS:
370
535
  case DecoratorTypes.ARRAY:
371
- if (metadataEntityArray.required && !arrayItems.length) {
536
+ const entityArray = entity[key];
537
+ const arrayMetadata = metadata;
538
+ if (arrayMetadata.required && !entityArray.length) {
539
+ return false;
540
+ }
541
+ break;
542
+ case DecoratorTypes.DATE:
543
+ const entityDate = new Date(entity[key]);
544
+ const dateMetadata = metadata;
545
+ if (!this.isDateValid(entityDate, dateMetadata)) {
546
+ return false;
547
+ }
548
+ break;
549
+ case DecoratorTypes.DATE_RANGE:
550
+ const entityDateRange = cloneDeep(entity[key]);
551
+ const dateRangeMetadata = metadata;
552
+ if (!this.isDateRangeValid(entityDateRange, dateRangeMetadata)) {
553
+ return false;
554
+ }
555
+ break;
556
+ case DecoratorTypes.DATE_TIME:
557
+ const entityDateTime = new Date(entity[key]);
558
+ const dateTimeMetadata = metadata;
559
+ if (!this.isDateTimeValid(entityDateTime, dateTimeMetadata)) {
372
560
  return false;
373
561
  }
374
562
  break;
@@ -377,100 +565,312 @@ class EntityUtilities {
377
565
  }
378
566
  return true;
379
567
  }
568
+ static isStringValid(value, metadata) {
569
+ if (metadata.maxLength && value.length > metadata.maxLength) {
570
+ return false;
571
+ }
572
+ if (metadata.minLength && value.length < metadata.minLength) {
573
+ return false;
574
+ }
575
+ if (metadata.regex && !value.match(metadata.regex)) {
576
+ return false;
577
+ }
578
+ return true;
579
+ }
580
+ static isTextboxValid(value, metadata) {
581
+ if (metadata.maxLength && value.length > metadata.maxLength) {
582
+ return false;
583
+ }
584
+ if (metadata.minLength && value.length < metadata.minLength) {
585
+ return false;
586
+ }
587
+ return true;
588
+ }
589
+ static isNumberValid(value, metadata) {
590
+ if (metadata.max && value > metadata.max) {
591
+ return false;
592
+ }
593
+ if (metadata.min && value < metadata.min) {
594
+ return false;
595
+ }
596
+ return true;
597
+ }
598
+ static isDateValid(value, metadata) {
599
+ if (metadata.min && value.getTime() < metadata.min(value).getTime()) {
600
+ return false;
601
+ }
602
+ if (metadata.max && value.getTime() > metadata.max(value).getTime()) {
603
+ return false;
604
+ }
605
+ if (metadata.filter && !metadata.filter(value)) {
606
+ return false;
607
+ }
608
+ return true;
609
+ }
610
+ static isDateRangeValid(value, metadata) {
611
+ if (metadata.required && (!value.start || !value.end)) {
612
+ return false;
613
+ }
614
+ value.start = new Date(value.start);
615
+ value.end = new Date(value.end);
616
+ if (metadata.minStart && value.start.getTime() < metadata.minStart(value.start).getTime()) {
617
+ return false;
618
+ }
619
+ if (metadata.maxStart && value.start.getTime() > metadata.maxStart(value.start).getTime()) {
620
+ return false;
621
+ }
622
+ if (metadata.minEnd && value.end.getTime() < metadata.minEnd(value.end).getTime()) {
623
+ return false;
624
+ }
625
+ if (metadata.maxEnd && value.end.getTime() > metadata.maxEnd(value.end).getTime()) {
626
+ return false;
627
+ }
628
+ if (metadata.filter) {
629
+ if (!metadata.filter(value.start)) {
630
+ return false;
631
+ }
632
+ if (!metadata.filter(value.end)) {
633
+ return false;
634
+ }
635
+ if (value.values) {
636
+ for (const date of value.values) {
637
+ if (!metadata.filter(date)) {
638
+ return false;
639
+ }
640
+ }
641
+ }
642
+ }
643
+ return true;
644
+ }
645
+ static isDateTimeValid(value, metadata) {
646
+ if (metadata.minDate && value.getTime() < metadata.minDate(value).getTime()) {
647
+ return false;
648
+ }
649
+ if (metadata.maxDate && value.getTime() > metadata.maxDate(value).getTime()) {
650
+ return false;
651
+ }
652
+ if (metadata.filterDate && !metadata.filterDate(value)) {
653
+ return false;
654
+ }
655
+ const time = {
656
+ hours: value.getHours(),
657
+ minutes: value.getMinutes()
658
+ };
659
+ if (metadata.minTime) {
660
+ const minTime = metadata.minTime(value);
661
+ if (!(time.hours > minTime.hours
662
+ || (time.hours === minTime.hours
663
+ && time.minutes >= minTime.minutes))) {
664
+ return false;
665
+ }
666
+ }
667
+ if (metadata.maxTime) {
668
+ const maxTime = metadata.maxTime(value);
669
+ if (!(time.hours < maxTime.hours
670
+ || (time.hours === maxTime.hours
671
+ && time.minutes <= maxTime.minutes))) {
672
+ return false;
673
+ }
674
+ }
675
+ if (metadata.filterTime) {
676
+ if (!metadata.filterTime(time)) {
677
+ return false;
678
+ }
679
+ }
680
+ return true;
681
+ }
380
682
  /**
381
- * Checks if an entity is "dirty" (if its values have changed)
382
- * @param entity The entity after all changes
383
- * @param entityPriorChanges The entity before the changes
384
- * @returns Whether or not the entity is dirty
683
+ * Checks if an entity is "dirty" (if its values have changed).
684
+ *
685
+ * @param entity - The entity after all changes.
686
+ * @param entityPriorChanges - The entity before the changes.
687
+ * @returns Whether or not the entity is dirty.
385
688
  */
386
689
  static dirty(entity, entityPriorChanges) {
387
690
  if (!entityPriorChanges) {
388
691
  return false;
389
692
  }
390
693
  else {
391
- const diff = this.difference(entity, entityPriorChanges);
392
- if (JSON.stringify(diff) === '{}') {
393
- return false;
394
- }
395
- else {
396
- return true;
694
+ const differences = this.differencesForDirty(entity, entityPriorChanges);
695
+ return differences.length ? true : false;
696
+ }
697
+ }
698
+ static differencesForDirty(entity, entityPriorChanges) {
699
+ const res = [];
700
+ for (const key in entity) {
701
+ if (!this.isEqual(entity[key], entityPriorChanges[key], EntityUtilities.getPropertyMetadata(entity, key))) {
702
+ res.push({
703
+ key: key,
704
+ before: entityPriorChanges[key],
705
+ after: entity[key]
706
+ });
397
707
  }
398
708
  }
709
+ return res;
399
710
  }
400
711
  /**
401
- * Compares two Entities and returns their difference in an object
402
- * @param entity The first entity to compare
403
- * @param entityPriorChanges The second entity to compare
404
- * @returns The difference between the two Entities in form of a Partial
712
+ * Compares two Entities and returns their difference in an object.
713
+ *
714
+ * @param entity - The first entity to compare.
715
+ * @param entityPriorChanges - The second entity to compare.
716
+ * @returns The difference between the two Entities in form of a Partial.
405
717
  */
406
718
  static difference(entity, entityPriorChanges) {
407
719
  const res = {};
408
720
  for (const key in entity) {
409
- if (!isEqual(entity[key], entityPriorChanges[key])) {
721
+ if (!this.isEqual(entity[key], entityPriorChanges[key], EntityUtilities.getPropertyMetadata(entity, key))) {
410
722
  res[key] = entity[key];
411
723
  }
412
724
  }
413
725
  return res;
414
726
  }
727
+ static isEqual(value, valuePriorChanges, metadata) {
728
+ if (this.isDateRange(value) && this.isDateRange(valuePriorChanges)) {
729
+ const dateRange = cloneDeep(value);
730
+ dateRange.start = new Date(value.start);
731
+ dateRange.end = new Date(value.end);
732
+ dateRange.values = DateUtilities.getDatesBetween(dateRange.start, dateRange.end, metadata);
733
+ const dateRangePriorChanges = cloneDeep(valuePriorChanges);
734
+ dateRangePriorChanges.start = new Date(valuePriorChanges.start);
735
+ dateRangePriorChanges.end = new Date(valuePriorChanges.end);
736
+ dateRangePriorChanges.values = DateUtilities.getDatesBetween(dateRangePriorChanges.start, dateRangePriorChanges.end, metadata);
737
+ return isEqual(dateRange, dateRangePriorChanges);
738
+ }
739
+ if (metadata.displayStyle === 'date') {
740
+ const date = new Date(DateUtilities.asDate(value));
741
+ const datePriorChanges = new Date(DateUtilities.asDate(valuePriorChanges));
742
+ date.setHours(0, 0, 0, 0);
743
+ datePriorChanges.setHours(0, 0, 0, 0);
744
+ return isEqual(date, datePriorChanges);
745
+ }
746
+ return isEqual(value, valuePriorChanges);
747
+ }
748
+ static isDateRange(value) {
749
+ const dateRange = value;
750
+ if (dateRange.start && dateRange.end) {
751
+ try {
752
+ new Date(dateRange.start);
753
+ new Date(dateRange.end);
754
+ return true;
755
+ }
756
+ catch (error) { }
757
+ ;
758
+ }
759
+ return false;
760
+ }
415
761
  /**
416
- * compare function for sorting entity keys by their order value
417
- * @param a first key of entity
418
- * @param b second key of entity
419
- * @param entity current entity (used to get metadata of entity keys)
762
+ * Compare function for sorting entity keys by their order value.
763
+ *
764
+ * @param a - First key of entity.
765
+ * @param b - Second key of entity.
766
+ * @param entity - Current entity (used to get metadata of entity keys).
767
+ * @returns 0 if both values have the same order, a negative value if 'a' comes before 'b', a positive value if 'a' comes behind 'b'.
420
768
  */
421
769
  static compareOrder(a, b, entity) {
422
- const metadataA = EntityUtilities.getPropertyMetadata(entity, a, EntityUtilities.getPropertyType(entity, a));
423
- const metadataB = EntityUtilities.getPropertyMetadata(entity, b, EntityUtilities.getPropertyType(entity, b));
424
- if (metadataA.order === -1) {
770
+ const metadataA = EntityUtilities.getPropertyMetadata(entity, a);
771
+ const metadataB = EntityUtilities.getPropertyMetadata(entity, b);
772
+ if (metadataA.position.order === -1) {
773
+ if (metadataB.position.order === -1) {
774
+ return 0;
775
+ }
425
776
  return 1;
426
777
  }
427
- else if (metadataB.order === -1) {
428
- return 0;
778
+ else if (metadataB.position.order === -1) {
779
+ return -1;
429
780
  }
430
- return (metadataA.order - metadataB.order);
781
+ return ((metadataA.position.order) - (metadataB.position.order));
431
782
  }
432
783
  /**
433
- * gets the bootstrap column values for "lg", "md", "sm"
434
- * @param entity entity to get the bootstrap column values of the key
435
- * @param key key of the property to get bootstrap column values from
436
- * @param type defines for which screensize the column values should be returned
437
- * @returns bootstrap column value
784
+ * Gets the bootstrap column values for "lg", "md", "sm".
785
+ *
786
+ * @param entity - Entity to get the bootstrap column values of the key.
787
+ * @param key - Key of the property to get bootstrap column values from.
788
+ * @param type - Defines for which screen size the column values should be returned.
789
+ * @returns Bootstrap column value.
438
790
  */
439
791
  static getWidth(entity, key, type) {
440
- const propertyType = EntityUtilities.getPropertyType(entity, key);
441
- const metadata = EntityUtilities.getPropertyMetadata(entity, key, propertyType);
442
- if (metadata.defaultWidths) {
443
- switch (type) {
444
- case 'lg':
445
- return metadata.defaultWidths[0];
446
- case 'md':
447
- return metadata.defaultWidths[1];
448
- case 'sm':
449
- return metadata.defaultWidths[2];
450
- default:
451
- throw new Error('Something went wrong getting the width');
452
- }
453
- }
454
- else {
455
- throw new Error('Something went wrong getting the width');
792
+ const metadata = EntityUtilities.getPropertyMetadata(entity, key);
793
+ switch (type) {
794
+ case 'lg':
795
+ return metadata.defaultWidths[0];
796
+ case 'md':
797
+ return metadata.defaultWidths[1];
798
+ case 'sm':
799
+ return metadata.defaultWidths[2];
456
800
  }
457
801
  }
458
802
  /**
459
- * Resets all changes on an entity
460
- * @param entity The entity to reset
461
- * @param entityPriorChanges The entity before any changes
803
+ * Resets all changes on an entity.
804
+ *
805
+ * @param entity - The entity to reset.
806
+ * @param entityPriorChanges - The entity before any changes.
462
807
  */
463
808
  static resetChangesOnEntity(entity, entityPriorChanges) {
464
809
  for (const key in entityPriorChanges) {
465
810
  Reflect.set(entity, key, Reflect.get(entityPriorChanges, key));
466
811
  }
467
812
  }
813
+ /**
814
+ * Gets the rows that are used to display the given entity.
815
+ *
816
+ * @param entity - The entity to get the rows from.
817
+ * @param hideOmitForCreate - Whether or not keys with the metadata omitForCreate should be filtered out.
818
+ * @param hideOmitForEdit - Whether or not keys with the metadata omitForUpdate should be filtered out.
819
+ * @returns The sorted Rows containing the row number and the keys to display in that row.
820
+ */
821
+ static getEntityRows(entity, hideOmitForCreate = false, hideOmitForEdit = false) {
822
+ const res = [];
823
+ const keys = EntityUtilities.keysOf(entity, hideOmitForCreate, hideOmitForEdit);
824
+ const numberOfRows = this.getNumberOfRows(keys, entity);
825
+ for (let i = 1; i <= numberOfRows; i++) {
826
+ const row = {
827
+ row: i,
828
+ keys: this.getKeysForRow(keys, entity, i)
829
+ };
830
+ res.push(row);
831
+ }
832
+ const lastRow = {
833
+ row: numberOfRows + 1,
834
+ keys: this.getKeysForRow(keys, entity, -1)
835
+ };
836
+ res.push(lastRow);
837
+ return res;
838
+ }
839
+ static getKeysForRow(keys, entity, i) {
840
+ return keys
841
+ .filter(k => EntityUtilities.getPropertyMetadata(entity, k).position.row === i)
842
+ .sort((a, b) => EntityUtilities.compareOrder(a, b, entity));
843
+ }
844
+ static getNumberOfRows(keys, entity) {
845
+ return keys
846
+ .map(k => EntityUtilities.getPropertyMetadata(entity, k).position.row)
847
+ .sort((a, b) => (a > b ? -1 : 1))[0];
848
+ }
849
+ /**
850
+ * Gets the keys of the provided entity correctly typed.
851
+ *
852
+ * @param entity - The entity to get the keys of.
853
+ * @param hideOmitForCreate - Whether or not keys with the metadata omitForCreate should be filtered out.
854
+ * @param hideOmitForEdit - Whether or not keys with the metadata omitForUpdate should be filtered out.
855
+ * @returns An array of keys of the entity.
856
+ */
857
+ static keysOf(entity, hideOmitForCreate = false, hideOmitForEdit = false) {
858
+ let keys = Reflect.ownKeys(entity);
859
+ if (hideOmitForCreate) {
860
+ const omitForCreateKeys = EntityUtilities.getOmitForCreate(entity);
861
+ keys = keys.filter(k => !omitForCreateKeys.includes(k));
862
+ }
863
+ if (hideOmitForEdit) {
864
+ const omitForUpdateKeys = EntityUtilities.getOmitForUpdate(entity);
865
+ keys = keys.filter(k => !omitForUpdateKeys.includes(k));
866
+ }
867
+ return keys;
868
+ }
468
869
  }
469
- _a = EntityUtilities;
470
- // eslint-disable-next-line @typescript-eslint/member-ordering
471
- EntityUtilities.construct = _a.new;
472
- // eslint-disable-next-line @typescript-eslint/member-ordering
473
- EntityUtilities.build = _a.new;
870
+ // eslint-disable-next-line @typescript-eslint/member-ordering, jsdoc/require-jsdoc
871
+ EntityUtilities.construct = EntityUtilities.new;
872
+ // eslint-disable-next-line @typescript-eslint/member-ordering, jsdoc/require-jsdoc
873
+ EntityUtilities.build = EntityUtilities.new;
474
874
 
475
875
  /**
476
876
  * A generic EntityService class.
@@ -482,22 +882,31 @@ class EntityService {
482
882
  constructor(http) {
483
883
  this.http = http;
484
884
  /**
485
- * a subject of all the entity values.
885
+ * The key which holds the id value.
886
+ *
887
+ * @default 'id'
888
+ */
889
+ this.idKey = 'id';
890
+ /**
891
+ * A subject of all the entity values.
486
892
  * Can be subscribed to when you want to do a specific thing whenever the entities change.
487
893
  */
488
894
  this.entitiesSubject = new BehaviorSubject([]);
489
895
  }
490
896
  /**
491
- * gets the entities in an array from the internal entitiesSubject
897
+ * Gets the entities in an array from the internal entitiesSubject.
898
+ *
899
+ * @returns The current entities in form of an array.
492
900
  */
493
901
  get entities() {
494
902
  return this.entitiesSubject.value;
495
903
  }
496
904
  /**
497
- * Creates a new Entity and pushes it to the entities array
498
- * @param entity The data of the entity to create.
905
+ * Creates a new Entity and pushes it to the entities array.
906
+ *
907
+ * @param entity - The data of the entity to create.
499
908
  * All values that should be omitted will be removed from it inside this method.
500
- * @returns A Promise of the created entity
909
+ * @returns A Promise of the created entity.
501
910
  */
502
911
  create(entity) {
503
912
  return __awaiter(this, void 0, void 0, function* () {
@@ -509,8 +918,9 @@ class EntityService {
509
918
  });
510
919
  }
511
920
  /**
512
- * Gets all existing entities and pushes them to the entites array
513
- * @returns A Promise of all received Entities
921
+ * Gets all existing entities and pushes them to the entities array.
922
+ *
923
+ * @returns A Promise of all received Entities.
514
924
  */
515
925
  read() {
516
926
  return __awaiter(this, void 0, void 0, function* () {
@@ -520,71 +930,155 @@ class EntityService {
520
930
  });
521
931
  }
522
932
  /**
523
- * Updates a specific Entity
524
- * @param entity The updated Entity
933
+ * Updates a specific Entity.
934
+ *
935
+ * @param entity - The updated Entity
525
936
  * All values that should be omitted will be removed from it inside this method.
526
- * @param entityPriorChanges The current Entity.
527
- * It Is used to get changed values and only update them instead of sending the whole entity data
937
+ * @param entityPriorChanges - The current Entity.
938
+ * It Is used to get changed values and only update them instead of sending the whole entity data.
528
939
  */
529
940
  update(entity, entityPriorChanges) {
530
941
  return __awaiter(this, void 0, void 0, function* () {
531
942
  const reqBody = omit(EntityUtilities.difference(entity, entityPriorChanges), EntityUtilities.getOmitForUpdate(entity));
532
- const updatedEntity = yield firstValueFrom(this.http.patch(`${this.baseUrl}/${entityPriorChanges.id}`, omitBy(reqBody, isNil)));
533
- this.entities[this.entities.findIndex((e) => e.id === entityPriorChanges.id)] = updatedEntity;
943
+ const updatedEntity = yield firstValueFrom(this.http.patch(`${this.baseUrl}/${entityPriorChanges[this.idKey]}`, omitBy(reqBody, isNil)));
944
+ this.entities[this.entities.findIndex(e => e[this.idKey] === entityPriorChanges[this.idKey])] = updatedEntity;
534
945
  this.entitiesSubject.next(this.entities);
535
946
  });
536
947
  }
537
948
  /**
538
- * Method to delete a specific Entity
539
- * @param id The id of the element to delete
949
+ * Deletes a specific Entity.
950
+ *
951
+ * @param entity - The entity to delete.
540
952
  */
541
- delete(id) {
953
+ delete(entity) {
542
954
  return __awaiter(this, void 0, void 0, function* () {
543
- yield firstValueFrom(this.http.delete(`${this.baseUrl}/${id}`));
544
- this.entities.splice(this.entities.findIndex((e) => e.id === id), 1);
955
+ yield firstValueFrom(this.http.delete(`${this.baseUrl}/${entity[this.idKey]}`));
956
+ // the == comparison instead of === is to catch ids that are numbers.
957
+ this.entities.splice(this.entities.findIndex(e => e[this.idKey] === entity[this.idKey]), 1);
545
958
  this.entitiesSubject.next(this.entities);
546
959
  });
547
960
  }
548
961
  }
549
962
 
550
- class NgxMatEntityConfirmDialogComponent {
551
- constructor(dialogRef, data) {
552
- this.dialogRef = dialogRef;
553
- this.data = data;
554
- /**
555
- * Used for the checkbox to confirm the action
556
- */
557
- this.confirm = false;
963
+ /**
964
+ * The abstract BaseBuilder class.
965
+ */
966
+ class BaseBuilder {
967
+ constructor(data) {
968
+ this.validateInput(data);
969
+ this.inputData = data;
970
+ this.data = this.generateBaseData(data);
971
+ return this;
558
972
  }
559
- ngOnInit() {
560
- if (this.data.requireConfirmation && !this.data.confirmationText) {
561
- throw new Error(`
562
- Missing required Input "confirmationText".
563
- You can only omit this if you dont have "requireConfirmation" set`);
564
- }
565
- if (!this.data.requireConfirmation && this.data.confirmationText) {
566
- throw new Error('The "confirmationText" will never be shown because "requireConfirmation" is not set to true');
567
- }
568
- if (this.data.requireConfirmation !== true && this.data.requireConfirmation !== false) {
569
- this.data.requireConfirmation = false;
570
- }
571
- if (this.data.type === 'info-only' && this.data.cancelButtonLabel) {
572
- throw new Error('The "cancelButtonLabel" will never be shown because "type" is set to "info-only"');
973
+ /**
974
+ * Used to validate the user input in the constructor.
975
+ *
976
+ * @param data - The user input.
977
+ */
978
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
979
+ validateInput(data) {
980
+ // By default, no validation is done
981
+ }
982
+ ;
983
+ /**
984
+ * Sets the value for the given key if no user value was provided.
985
+ *
986
+ * @param key - The key to set the default value for.
987
+ * @param value - The value to set when nothing was provided.
988
+ * @returns The Builder.
989
+ */
990
+ withDefault(key, value) {
991
+ if (!this.inputData || !this.inputData[key]) {
992
+ this.data[key] = value;
573
993
  }
574
- this.dialogRef.disableClose = true;
994
+ return this;
575
995
  }
576
- confirmAction() {
577
- this.dialogRef.close(1);
996
+ /**
997
+ * Method used to get the final build value after applying all chaining.
998
+ *
999
+ * @returns The build value.
1000
+ */
1001
+ getResult() {
1002
+ return this.data;
1003
+ }
1004
+ }
1005
+
1006
+ /**
1007
+ * The internal ConfirmDialogData. Requires all default values the user can leave out.
1008
+ */
1009
+ class ConfirmDialogDataInternal {
1010
+ constructor(text, type, confirmButtonLabel, cancelButtonLabel, title, requireConfirmation, confirmationText) {
1011
+ this.text = text;
1012
+ this.type = type;
1013
+ this.confirmButtonLabel = confirmButtonLabel;
1014
+ this.cancelButtonLabel = cancelButtonLabel;
1015
+ this.title = title;
1016
+ this.requireConfirmation = requireConfirmation;
1017
+ this.confirmationText = confirmationText;
578
1018
  }
1019
+ }
1020
+ /**
1021
+ * The Builder for the ConfirmDialogData. Sets default values.
1022
+ */
1023
+ class ConfirmDialogDataBuilder extends BaseBuilder {
1024
+ constructor(data) {
1025
+ super(data);
1026
+ }
1027
+ // eslint-disable-next-line jsdoc/require-jsdoc
1028
+ generateBaseData(data) {
1029
+ return new ConfirmDialogDataInternal((data === null || data === void 0 ? void 0 : data.text) ? data.text : ['Do you really want to do this?'], (data === null || data === void 0 ? void 0 : data.type) ? data.type : 'default', (data === null || data === void 0 ? void 0 : data.confirmButtonLabel) ? data.confirmButtonLabel : 'Confirm', (data === null || data === void 0 ? void 0 : data.cancelButtonLabel) ? data.cancelButtonLabel : 'Cancel', (data === null || data === void 0 ? void 0 : data.title) ? data.title : 'Confirmation', (data === null || data === void 0 ? void 0 : data.requireConfirmation) ? data.requireConfirmation : false, data === null || data === void 0 ? void 0 : data.confirmationText);
1030
+ }
1031
+ // eslint-disable-next-line jsdoc/require-jsdoc
1032
+ validateInput(data) {
1033
+ if (!data) {
1034
+ return;
1035
+ }
1036
+ if (data.requireConfirmation && !data.confirmationText) {
1037
+ throw new Error(`Missing required Input data "confirmationText".
1038
+ You can only omit this value when "requireConfirmation" is false.`);
1039
+ }
1040
+ if (!data.requireConfirmation && data.confirmationText) {
1041
+ throw new Error('The "confirmationText" will never be shown because "requireConfirmation" is not set to true');
1042
+ }
1043
+ if (data.type === 'info-only' && data.cancelButtonLabel) {
1044
+ throw new Error('The "cancelButtonLabel" will never be shown because "type" is set to "info-only"');
1045
+ }
1046
+ }
1047
+ }
1048
+
1049
+ /**
1050
+ * The Dialog used whenever confirmation by the user is required (e.g. When the user tries to delete an entity).
1051
+ *
1052
+ * Can be customized with the MAT_DIALOG_DATA "inputData". Customization options are defined in "ConfirmDialogData".
1053
+ */
1054
+ class NgxMatEntityConfirmDialogComponent {
1055
+ constructor(dialogRef, inputData) {
1056
+ this.dialogRef = dialogRef;
1057
+ this.inputData = inputData;
1058
+ this.confirm = false;
1059
+ }
1060
+ ngOnInit() {
1061
+ this.data = new ConfirmDialogDataBuilder(this.inputData).getResult();
1062
+ this.dialogRef.disableClose = true;
1063
+ }
1064
+ /**
1065
+ * Closes the dialog with value 1 to signal that the action should be run.
1066
+ */
1067
+ confirmAction() {
1068
+ this.dialogRef.close(1);
1069
+ }
1070
+ /**
1071
+ * Closes the dialog.
1072
+ */
579
1073
  cancel() {
580
1074
  this.dialogRef.close();
581
1075
  }
582
1076
  }
583
1077
  NgxMatEntityConfirmDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityConfirmDialogComponent, deps: [{ token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
584
- NgxMatEntityConfirmDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityConfirmDialogComponent, selector: "ngx-mat-entity-confirm-dialog", ngImport: i0, template: "<h2 mat-dialog-title *ngIf=\"data.title\">{{data.title}}</h2>\n\n<mat-dialog-content>\n <p *ngFor=\"let paragraph of data.text\">{{paragraph}}</p>\n <div *ngIf=\"data.requireConfirmation\" class=\"checkbox-wrapper\">\n <mat-checkbox [(ngModel)]=\"confirm\" name=\"confirm\">\n {{data.confirmationText}}\n </mat-checkbox>\n </div>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button *ngIf=\"data.type === 'delete'\" mat-raised-button color=\"warn\" (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n {{data.confirmButtonLabel ? data.confirmButtonLabel : 'Delete'}}\n </button>\n <button *ngIf=\"data.type !== 'delete'\" mat-raised-button (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n {{data.confirmButtonLabel ? data.confirmButtonLabel : data.type === 'info-only' ? 'Ok' : 'Confirm'}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.cancelButtonLabel ? data.cancelButtonLabel : 'Cancel'}}\n </button>\n</mat-dialog-actions>\n", styles: [".checkbox-wrapper{min-height:50px;display:flex}.checkbox-wrapper>mat-checkbox{align-self:center}mat-dialog-actions{display:flex;justify-content:space-between}\n"], components: [{ type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i12.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i12.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
1078
+ NgxMatEntityConfirmDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityConfirmDialogComponent, selector: "ngx-mat-entity-confirm-dialog", ngImport: i0, template: "<h2 mat-dialog-title *ngIf=\"data.title\">{{data.title}}</h2>\n\n<mat-dialog-content>\n <p *ngFor=\"let paragraph of data.text\">{{paragraph}}</p>\n <div *ngIf=\"data.requireConfirmation\" class=\"checkbox-wrapper\">\n <mat-checkbox [(ngModel)]=\"confirm\" name=\"confirm\">\n {{data.confirmationText}}\n </mat-checkbox>\n </div>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button *ngIf=\"data.type === 'delete'\" mat-raised-button color=\"warn\" (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n {{data.confirmButtonLabel}}\n </button>\n <button *ngIf=\"data.type !== 'delete'\" mat-raised-button (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n {{data.confirmButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.cancelButtonLabel}}\n </button>\n</mat-dialog-actions>\n", styles: [".checkbox-wrapper{min-height:50px;display:flex}.checkbox-wrapper>mat-checkbox{align-self:center}mat-dialog-actions{display:flex;justify-content:space-between}\n"], components: [{ type: i6.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i14.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i14.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
585
1079
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityConfirmDialogComponent, decorators: [{
586
1080
  type: Component,
587
- args: [{ selector: 'ngx-mat-entity-confirm-dialog', template: "<h2 mat-dialog-title *ngIf=\"data.title\">{{data.title}}</h2>\n\n<mat-dialog-content>\n <p *ngFor=\"let paragraph of data.text\">{{paragraph}}</p>\n <div *ngIf=\"data.requireConfirmation\" class=\"checkbox-wrapper\">\n <mat-checkbox [(ngModel)]=\"confirm\" name=\"confirm\">\n {{data.confirmationText}}\n </mat-checkbox>\n </div>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button *ngIf=\"data.type === 'delete'\" mat-raised-button color=\"warn\" (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n {{data.confirmButtonLabel ? data.confirmButtonLabel : 'Delete'}}\n </button>\n <button *ngIf=\"data.type !== 'delete'\" mat-raised-button (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n {{data.confirmButtonLabel ? data.confirmButtonLabel : data.type === 'info-only' ? 'Ok' : 'Confirm'}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.cancelButtonLabel ? data.cancelButtonLabel : 'Cancel'}}\n </button>\n</mat-dialog-actions>\n", styles: [".checkbox-wrapper{min-height:50px;display:flex}.checkbox-wrapper>mat-checkbox{align-self:center}mat-dialog-actions{display:flex;justify-content:space-between}\n"] }]
1081
+ args: [{ selector: 'ngx-mat-entity-confirm-dialog', template: "<h2 mat-dialog-title *ngIf=\"data.title\">{{data.title}}</h2>\n\n<mat-dialog-content>\n <p *ngFor=\"let paragraph of data.text\">{{paragraph}}</p>\n <div *ngIf=\"data.requireConfirmation\" class=\"checkbox-wrapper\">\n <mat-checkbox [(ngModel)]=\"confirm\" name=\"confirm\">\n {{data.confirmationText}}\n </mat-checkbox>\n </div>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button *ngIf=\"data.type === 'delete'\" mat-raised-button color=\"warn\" (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n {{data.confirmButtonLabel}}\n </button>\n <button *ngIf=\"data.type !== 'delete'\" mat-raised-button (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n {{data.confirmButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.cancelButtonLabel}}\n </button>\n</mat-dialog-actions>\n", styles: [".checkbox-wrapper{min-height:50px;display:flex}.checkbox-wrapper>mat-checkbox{align-self:center}mat-dialog-actions{display:flex;justify-content:space-between}\n"] }]
588
1082
  }], ctorParameters: function () {
589
1083
  return [{ type: i1.MatDialogRef }, { type: undefined, decorators: [{
590
1084
  type: Inject,
@@ -608,8 +1102,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
608
1102
 
609
1103
  /**
610
1104
  * Generates a default error message for most validation errors.
611
- * @param model The ngModel to get the error from
612
- * @returns The Validation Error Message to display
1105
+ *
1106
+ * @param model - The ngModel to get the error from.
1107
+ * @returns The Validation Error Message to display.
613
1108
  */
614
1109
  function getValidationErrorMessage(model) {
615
1110
  if (model.hasError('matDatepickerParse')) {
@@ -633,214 +1128,95 @@ function getValidationErrorMessage(model) {
633
1128
  else if (model.hasError('required')) {
634
1129
  return 'required';
635
1130
  }
1131
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
1132
+ else if (model.hasError('pattern') && model.getError('pattern').requiredPattern === '^true$') {
1133
+ return 'needs to be selected';
1134
+ }
636
1135
  else {
637
1136
  return 'invalid input';
638
1137
  }
639
1138
  }
640
1139
 
641
- class NgxMatEntityInternalInputComponent {
642
- constructor() {
643
- this.DecoratorTypes = DecoratorTypes;
644
- this.getWidth = EntityUtilities.getWidth;
645
- }
646
- /**
647
- * Helper method needed to recursively generate property input components (used eg. with the object)
648
- */
649
- trackByFn(index) {
650
- return index;
651
- }
652
- ngOnInit() {
653
- if (!this.entity) {
654
- throw new Error('Missing required Input data "entity"');
655
- }
656
- if (!this.propertyKey) {
657
- throw new Error('Missing required Input data "propertyKey"');
658
- }
659
- this.type = EntityUtilities.getPropertyType(this.entity, this.propertyKey);
660
- this.metadata = EntityUtilities.getPropertyMetadata(this.entity, this.propertyKey, this.type);
661
- this.metadataDefaultString = this.metadata;
662
- this.metadataTextboxString = this.metadata;
663
- this.metadataAutocompleteString = this.metadata;
664
- this.metadataDropdownString = this.metadata;
665
- this.metadataDropdownBoolean = this.metadata;
666
- this.metadataDefaultNumber = this.metadata;
667
- this.metadataDropdownNumber = this.metadata;
668
- this.metadataDefaultObject = this.metadata;
669
- this.objectProperty = this.entity[this.propertyKey];
670
- }
671
- getObjectProperties() {
672
- const res = [];
673
- for (const property in this.objectProperty) {
674
- const metadata = EntityUtilities.getPropertyMetadata(this.objectProperty, property, EntityUtilities.getPropertyType(this.objectProperty, property));
675
- if (!(this.hideOmitForCreate && metadata.omitForCreate)
676
- && !(this.hideOmitForEdit && metadata.omitForUpdate)) {
677
- res.push(property);
678
- }
679
- }
680
- return res.sort((a, b) => EntityUtilities.compareOrder(a, b, this.objectProperty));
1140
+ /**
1141
+ * The internal CreateDialogData. Requires all default values the user can leave out.
1142
+ */
1143
+ class CreateDialogDataInternal {
1144
+ constructor(title, createButtonLabel, cancelButtonLabel, createRequiresConfirmDialog, confirmCreateDialogData) {
1145
+ this.title = title;
1146
+ this.createButtonLabel = createButtonLabel;
1147
+ this.cancelButtonLabel = cancelButtonLabel;
1148
+ this.createRequiresConfirmDialog = createRequiresConfirmDialog;
1149
+ this.confirmCreateDialogData = confirmCreateDialogData;
681
1150
  }
682
1151
  }
683
- NgxMatEntityInternalInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
684
- NgxMatEntityInternalInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityInternalInputComponent, selector: "ngx-mat-entity-internal-input", inputs: { entity: "entity", propertyKey: "propertyKey", hideOmitForCreate: "hideOmitForCreate", hideOmitForEdit: "hideOmitForEdit", getValidationErrorMessage: "getValidationErrorMessage" }, ngImport: i0, template: "<div [ngSwitch]=\"type\" *ngIf=\"!(hideOmitForCreate && metadata.omitForCreate) && !(hideOmitForEdit && metadata.omitForUpdate)\">\n <!-------------------------------------------->\n <!-----------------Strings-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.STRING\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [pattern]=\"metadataDefaultString.regex ? metadataDefaultString.regex : '[\\\\s\\\\S]*'\"\n [minlength]=\"metadataDefaultString.minLength ? metadataDefaultString.minLength : null\"\n [maxlength]=\"metadataDefaultString.maxLength ? metadataDefaultString.maxLength : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_TEXTBOX\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <textarea\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"10\"\n [minlength]=\"metadataTextboxString.minLength ? metadataTextboxString.minLength : null\"\n [maxlength]=\"metadataTextboxString.maxLength ? metadataTextboxString.maxLength : null\"\n >\n </textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_AUTOCOMPLETE\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matAutocomplete]=\"auto\"\n [minlength]=\"metadataAutocompleteString.minLength ? metadataAutocompleteString.minLength : null\"\n [maxlength]=\"metadataAutocompleteString.maxLength ? metadataAutocompleteString.maxLength : null\"\n [pattern]=\"metadataAutocompleteString.regex ? metadataAutocompleteString.regex : '[\\\\s\\\\S]*'\"\n />\n <mat-autocomplete #auto=\"matAutocomplete\">\n <mat-option *ngFor=\"let value of metadataAutocompleteString.autocompleteValues\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\">\n <mat-option *ngFor=\"let value of metadataDropdownString.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-----------------Booleans------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_CHECKBOX\">\n <mat-form-field>\n <mat-checkbox [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\">\n {{metadata.displayName}}\n </mat-checkbox>\n <!-- hidden input is needed so that the checkbox can be used inside a mat-form-field -->\n <textarea matInput hidden></textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_TOGGLE\">\n <mat-form-field>\n <mat-slide-toggle [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\">\n {{metadata.displayName}}\n </mat-slide-toggle>\n <!-- hidden input is needed so that the toggle can be used inside a mat-form-field -->\n <textarea matInput hidden></textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\">\n <mat-option [value]=\"undefined\">-</mat-option>\n <mat-option [value]=\"true\">{{metadataDropdownBoolean.dropdownTrue}}</mat-option>\n <mat-option [value]=\"false\">{{metadataDropdownBoolean.dropdownFalse}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!------------------Numbers------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n type=\"number\"\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [min]=\"metadataDefaultNumber.min ? metadataDefaultNumber.min : null\"\n [max]=\"metadataDefaultNumber.max ? metadataDefaultNumber.max : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\">\n <mat-option *ngFor=\"let value of metadataDropdownNumber.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Object------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.OBJECT\">\n <b>{{metadataDefaultObject.displayName}}</b>\n <!-- iterates over the object properties -->\n <div class=\"row\">\n <!--\n displays another ngx-material-entity with the:\n object as the entity,\n the current key in the loop received by the keyvalue direction as the propertyKey\n and the getValidationErrorMessage of the current component\n -->\n <ngx-mat-entity-internal-input\n *ngFor=\"let key of getObjectProperties(); let i = index; trackBy: trackByFn\"\n [entity]=\"objectProperty\"\n [propertyKey]=\"key\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n [hideOmitForCreate]=\"hideOmitForCreate\"\n [hideOmitForEdit]=\"hideOmitForEdit\"\n class=\"col-lg-{{getWidth(objectProperty, key, 'lg')}} col-md-{{getWidth(objectProperty, key, 'md')}} col-sm-{{getWidth(objectProperty, key, 'sm')}}\"\n >\n </ngx-mat-entity-internal-input>\n </div>\n </div>\n\n <div *ngSwitchDefault>ERROR: The type {{type}}is not known.</div>\n</div>", styles: ["mat-form-field{width:100%}\n"], components: [{ type: i1$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i3$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i6.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { type: NgxMatEntityInternalInputComponent, selector: "ngx-mat-entity-internal-input", inputs: ["entity", "propertyKey", "hideOmitForCreate", "hideOmitForEdit", "getValidationErrorMessage"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i7.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1$1.MatLabel, selector: "mat-label" }, { type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i12.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i12.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i12.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i12.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i12.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { type: i12.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i1$1.MatError, selector: "mat-error", inputs: ["id"] }, { type: i10.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i12.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i12.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i12.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { type: i7.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
685
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputComponent, decorators: [{
686
- type: Component,
687
- args: [{ selector: 'ngx-mat-entity-internal-input', template: "<div [ngSwitch]=\"type\" *ngIf=\"!(hideOmitForCreate && metadata.omitForCreate) && !(hideOmitForEdit && metadata.omitForUpdate)\">\n <!-------------------------------------------->\n <!-----------------Strings-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.STRING\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [pattern]=\"metadataDefaultString.regex ? metadataDefaultString.regex : '[\\\\s\\\\S]*'\"\n [minlength]=\"metadataDefaultString.minLength ? metadataDefaultString.minLength : null\"\n [maxlength]=\"metadataDefaultString.maxLength ? metadataDefaultString.maxLength : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_TEXTBOX\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <textarea\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"10\"\n [minlength]=\"metadataTextboxString.minLength ? metadataTextboxString.minLength : null\"\n [maxlength]=\"metadataTextboxString.maxLength ? metadataTextboxString.maxLength : null\"\n >\n </textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_AUTOCOMPLETE\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matAutocomplete]=\"auto\"\n [minlength]=\"metadataAutocompleteString.minLength ? metadataAutocompleteString.minLength : null\"\n [maxlength]=\"metadataAutocompleteString.maxLength ? metadataAutocompleteString.maxLength : null\"\n [pattern]=\"metadataAutocompleteString.regex ? metadataAutocompleteString.regex : '[\\\\s\\\\S]*'\"\n />\n <mat-autocomplete #auto=\"matAutocomplete\">\n <mat-option *ngFor=\"let value of metadataAutocompleteString.autocompleteValues\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\">\n <mat-option *ngFor=\"let value of metadataDropdownString.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-----------------Booleans------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_CHECKBOX\">\n <mat-form-field>\n <mat-checkbox [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\">\n {{metadata.displayName}}\n </mat-checkbox>\n <!-- hidden input is needed so that the checkbox can be used inside a mat-form-field -->\n <textarea matInput hidden></textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_TOGGLE\">\n <mat-form-field>\n <mat-slide-toggle [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\">\n {{metadata.displayName}}\n </mat-slide-toggle>\n <!-- hidden input is needed so that the toggle can be used inside a mat-form-field -->\n <textarea matInput hidden></textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\">\n <mat-option [value]=\"undefined\">-</mat-option>\n <mat-option [value]=\"true\">{{metadataDropdownBoolean.dropdownTrue}}</mat-option>\n <mat-option [value]=\"false\">{{metadataDropdownBoolean.dropdownFalse}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!------------------Numbers------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n type=\"number\"\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [min]=\"metadataDefaultNumber.min ? metadataDefaultNumber.min : null\"\n [max]=\"metadataDefaultNumber.max ? metadataDefaultNumber.max : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\">\n <mat-option *ngFor=\"let value of metadataDropdownNumber.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Object------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.OBJECT\">\n <b>{{metadataDefaultObject.displayName}}</b>\n <!-- iterates over the object properties -->\n <div class=\"row\">\n <!--\n displays another ngx-material-entity with the:\n object as the entity,\n the current key in the loop received by the keyvalue direction as the propertyKey\n and the getValidationErrorMessage of the current component\n -->\n <ngx-mat-entity-internal-input\n *ngFor=\"let key of getObjectProperties(); let i = index; trackBy: trackByFn\"\n [entity]=\"objectProperty\"\n [propertyKey]=\"key\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n [hideOmitForCreate]=\"hideOmitForCreate\"\n [hideOmitForEdit]=\"hideOmitForEdit\"\n class=\"col-lg-{{getWidth(objectProperty, key, 'lg')}} col-md-{{getWidth(objectProperty, key, 'md')}} col-sm-{{getWidth(objectProperty, key, 'sm')}}\"\n >\n </ngx-mat-entity-internal-input>\n </div>\n </div>\n\n <div *ngSwitchDefault>ERROR: The type {{type}}is not known.</div>\n</div>", styles: ["mat-form-field{width:100%}\n"] }]
688
- }], propDecorators: { entity: [{
689
- type: Input
690
- }], propertyKey: [{
691
- type: Input
692
- }], hideOmitForCreate: [{
693
- type: Input
694
- }], hideOmitForEdit: [{
695
- type: Input
696
- }], getValidationErrorMessage: [{
697
- type: Input
698
- }] } });
699
-
700
- class NgxMatEntityAddArrayItemDialogComponent {
701
- constructor(data, dialogRef) {
702
- this.data = data;
703
- this.dialogRef = dialogRef;
704
- this.EntityUtilities = EntityUtilities;
705
- this.getWidth = EntityUtilities.getWidth;
706
- }
707
- ngOnInit() {
708
- this.dialogRef.disableClose = true;
709
- this.setEntityKeys();
710
- }
711
- setEntityKeys() {
712
- this.entityKeys = Reflect.ownKeys(this.data.entity);
713
- const omitCreateKeys = EntityUtilities.getOmitForCreate(this.data.entity);
714
- this.entityKeys = this.entityKeys.filter((k) => !omitCreateKeys.includes(k))
715
- .sort((a, b) => EntityUtilities.compareOrder(a, b, this.data.entity));
716
- }
717
- create() {
718
- this.dialogRef.close(1);
719
- }
720
- cancel() {
721
- this.dialogRef.close();
1152
+ /**
1153
+ * The Builder for the CreateDialogData. Sets default values.
1154
+ */
1155
+ class CreateDialogDataBuilder extends BaseBuilder {
1156
+ constructor(data) {
1157
+ super(data);
1158
+ }
1159
+ // eslint-disable-next-line jsdoc/require-jsdoc
1160
+ generateBaseData(data) {
1161
+ const confirmCreateDialogData = new ConfirmDialogDataBuilder(data === null || data === void 0 ? void 0 : data.confirmCreateDialogData)
1162
+ .withDefault('confirmButtonLabel', 'create')
1163
+ .withDefault('text', ['Do you really want to create this entity?'])
1164
+ .withDefault('title', 'Create')
1165
+ .getResult();
1166
+ return new CreateDialogDataInternal((data === null || data === void 0 ? void 0 : data.title) ? data.title : 'Create', (data === null || data === void 0 ? void 0 : data.createButtonLabel) ? data.createButtonLabel : 'Create', (data === null || data === void 0 ? void 0 : data.cancelButtonLabel) ? data.cancelButtonLabel : 'Cancel', (data === null || data === void 0 ? void 0 : data.createRequiresConfirmDialog) ? data.createRequiresConfirmDialog : false, confirmCreateDialogData);
722
1167
  }
723
1168
  }
724
- NgxMatEntityAddArrayItemDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
725
- NgxMatEntityAddArrayItemDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityAddArrayItemDialogComponent, selector: "ngx-mat-entity-add-array-item-dialog", ngImport: i0, template: "<h2 mat-dialog-title>{{data.createDialogData.title}}</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <ngx-mat-entity-internal-input\n *ngFor=\"let key of entityKeys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"data.getValidationErrorMessage\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-internal-input>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"create()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'create')\">\n {{data.createDialogData.createButtonLabel ? data.createDialogData.createButtonLabel : 'Add'}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.createDialogData.cancelButtonLabel ? data.createDialogData.cancelButtonLabel : 'Cancel'}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}\n"], components: [{ type: NgxMatEntityInternalInputComponent, selector: "ngx-mat-entity-internal-input", inputs: ["entity", "propertyKey", "hideOmitForCreate", "hideOmitForEdit", "getValidationErrorMessage"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i12.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i12.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i12.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
726
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogComponent, decorators: [{
727
- type: Component,
728
- args: [{ selector: 'ngx-mat-entity-add-array-item-dialog', template: "<h2 mat-dialog-title>{{data.createDialogData.title}}</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <ngx-mat-entity-internal-input\n *ngFor=\"let key of entityKeys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"data.getValidationErrorMessage\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-internal-input>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"create()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'create')\">\n {{data.createDialogData.createButtonLabel ? data.createDialogData.createButtonLabel : 'Add'}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.createDialogData.cancelButtonLabel ? data.createDialogData.cancelButtonLabel : 'Cancel'}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}\n"] }]
729
- }], ctorParameters: function () {
730
- return [{ type: undefined, decorators: [{
731
- type: Inject,
732
- args: [MAT_DIALOG_DATA]
733
- }] }, { type: i1.MatDialogRef }];
734
- } });
735
1169
 
736
- class NgxMatEntityArrayTableComponent {
737
- constructor(dialog) {
738
- this.dialog = dialog;
739
- this.selection = new SelectionModel(true, []);
740
- this.getWidth = EntityUtilities.getWidth;
741
- this.EntityUtilities = EntityUtilities;
742
- }
743
- trackByFn(index) {
744
- return index;
745
- }
746
- ngOnInit() {
747
- this.validateInput();
748
- const givenDisplayColumns = this.metadata.displayColumns.map((v) => v.displayName);
749
- if (givenDisplayColumns.find((s) => s === 'select')) {
750
- throw new Error(`The name "select" for a display column is reserved.
751
- Please choose a different name.`);
752
- }
753
- this.displayedColumns = ['select'].concat(givenDisplayColumns);
754
- this.dataSource = new MatTableDataSource();
755
- this.dataSource.data = this.arrayItems;
756
- this.arrayItem = new this.metadata.EntityClass();
757
- this.arrayItemPriorChanges = cloneDeep(this.arrayItem);
758
- }
759
- validateInput() {
760
- if (!this.metadata.createInline && !this.metadata.createDialogData) {
761
- throw new Error(`Missing required Input data "createDialogData".
762
- You can only omit this value when the creation is inline.`);
763
- }
764
- }
765
- add() {
766
- if (this.metadata.createInline) {
767
- this.arrayItems.push(cloneDeep(this.arrayItem));
768
- this.dataSource.data = this.arrayItems;
769
- EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
770
- }
771
- else {
772
- const dialogData = {
773
- entity: this.arrayItem,
774
- createDialogData: this.metadata.createDialogData,
775
- getValidationErrorMessage: this.getValidationErrorMessage
776
- };
777
- firstValueFrom(this.dialog.open(NgxMatEntityAddArrayItemDialogComponent, {
778
- data: dialogData,
779
- autoFocus: false,
780
- restoreFocus: false
781
- }).afterClosed()).then((res) => {
782
- if (res === 1) {
783
- this.arrayItems.push(cloneDeep(this.arrayItem));
784
- this.dataSource.data = this.arrayItems;
785
- }
786
- EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
787
- });
788
- }
789
- }
790
- remove() {
791
- this.selection.selected.forEach(s => {
792
- this.arrayItems.splice(this.arrayItems.indexOf(s), 1);
793
- });
794
- this.dataSource.data = this.arrayItems;
795
- this.selection.clear();
796
- }
797
- getObjectProperties() {
798
- const res = [];
799
- for (const property in this.arrayItem) {
800
- const metadata = EntityUtilities.getPropertyMetadata(this.arrayItem, property, EntityUtilities.getPropertyType(this.arrayItem, property));
801
- if (!(metadata.omitForCreate)) {
802
- res.push(property);
803
- }
804
- }
805
- return res.sort((a, b) => EntityUtilities.compareOrder(a, b, this.arrayItem));
806
- }
807
- masterToggle() {
808
- if (this.isAllSelected()) {
809
- this.selection.clear();
810
- }
811
- else {
812
- this.dataSource.data.forEach((row) => this.selection.select(row));
813
- }
1170
+ /**
1171
+ * The internal AddArrayItemDialogData. Requires all default values the user can leave out.
1172
+ */
1173
+ class AddArrayItemDialogDataInternal {
1174
+ constructor(entity, createDialogData, getValidationErrorMessage) {
1175
+ this.entity = entity;
1176
+ this.createDialogData = createDialogData;
1177
+ this.getValidationErrorMessage = getValidationErrorMessage;
814
1178
  }
815
- isAllSelected() {
816
- const numSelected = this.selection.selected.length;
817
- const numRows = this.dataSource.data.length;
818
- return numSelected === numRows;
1179
+ }
1180
+ /**
1181
+ * The Builder for the AddArrayItemDialogData. Sets default values.
1182
+ */
1183
+ class AddArrayItemDialogDataBuilder extends BaseBuilder {
1184
+ constructor(data) {
1185
+ super(data);
1186
+ }
1187
+ // eslint-disable-next-line jsdoc/require-jsdoc
1188
+ generateBaseData(data) {
1189
+ const createDialogData = new CreateDialogDataBuilder(data.createDialogData)
1190
+ .withDefault('createButtonLabel', 'Add')
1191
+ .withDefault('title', 'Add to array')
1192
+ .getResult();
1193
+ return new AddArrayItemDialogDataInternal(data.entity, createDialogData, data.getValidationErrorMessage ? data.getValidationErrorMessage : getValidationErrorMessage);
819
1194
  }
820
1195
  }
821
- NgxMatEntityArrayTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableComponent, deps: [{ token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
822
- NgxMatEntityArrayTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityArrayTableComponent, selector: "ngx-mat-entity-array-table", inputs: { arrayItems: "arrayItems", metadata: "metadata", getValidationErrorMessage: "getValidationErrorMessage", omit: "omit" }, ngImport: i0, template: "<div class=\"mat-elevation-z8\" style=\"border-radius: 5px;padding: 15px;margin-bottom: 15px;margin-top: 15px;\">\n\n <div style=\"padding-bottom: 10px\">\n <b>{{metadata.displayName}}</b>\n </div>\n <div class=\"row\" *ngIf=\"metadata.createInline\">\n <ngx-mat-entity-internal-input\n *ngFor=\"let key of getObjectProperties(); let i = index; trackBy: trackByFn\"\n [entity]=\"arrayItem\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n class=\"col-lg-{{getWidth(arrayItem, key, 'lg')}} col-md-{{getWidth(arrayItem, key, 'md')}} col-sm-{{getWidth(arrayItem, key, 'sm')}}\"\n >\n </ngx-mat-entity-internal-input>\n </div>\n <div class=\"buttons\">\n <button mat-raised-button\n [disabled]=\"metadata.createInline && !EntityUtilities.isEntityValid(arrayItem, 'create')\"\n (click)=\"add()\">\n Add\n </button>\n <button mat-raised-button\n [disabled]=\"!selection.selected.length\"\n (click)=\"remove()\">\n Remove\n </button>\n </div>\n\n <mat-table [dataSource]=\"dataSource\">\n <!-- select Column -->\n <ng-container matColumnDef=\"select\">\n <mat-header-cell *matHeaderCellDef>\n <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"></mat-checkbox>\n </mat-header-cell>\n <mat-cell *matCellDef=\"let module\" class=\"module\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"></mat-checkbox>\n </mat-cell>\n </ng-container>\n \n <ng-container *ngFor=\"let dCol of metadata.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n <mat-header-cell *matHeaderCellDef>\n {{dCol.displayName}}\n </mat-header-cell>\n <mat-cell class=\"entity\" *matCellDef=\"let entity\">\n {{dCol.value(entity)}}\n </mat-cell>\n </ng-container>\n \n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n </mat-table>\n\n <div class=\"array-error\" *ngIf=\"metadata.required && !dataSource.data.length\">\n {{metadata.missingErrorMessage ? metadata.missingErrorMessage : 'Needs to have at least one value'}}\n </div>\n</div>", styles: [".buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px}mat-table{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:25px}.mat-column-select{flex:0 0 75px}.array-error{display:flex;align-items:center;justify-content:center;margin-top:-25.5px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:25px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}\n"], components: [{ type: NgxMatEntityInternalInputComponent, selector: "ngx-mat-entity-internal-input", inputs: ["entity", "propertyKey", "hideOmitForCreate", "hideOmitForEdit", "getValidationErrorMessage"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i4$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i4$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i4$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i4$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i4$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i4$1.MatCellDef, selector: "[matCellDef]" }, { type: i4$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i4$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i4$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }] });
823
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableComponent, decorators: [{
824
- type: Component,
825
- args: [{ selector: 'ngx-mat-entity-array-table', template: "<div class=\"mat-elevation-z8\" style=\"border-radius: 5px;padding: 15px;margin-bottom: 15px;margin-top: 15px;\">\n\n <div style=\"padding-bottom: 10px\">\n <b>{{metadata.displayName}}</b>\n </div>\n <div class=\"row\" *ngIf=\"metadata.createInline\">\n <ngx-mat-entity-internal-input\n *ngFor=\"let key of getObjectProperties(); let i = index; trackBy: trackByFn\"\n [entity]=\"arrayItem\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n class=\"col-lg-{{getWidth(arrayItem, key, 'lg')}} col-md-{{getWidth(arrayItem, key, 'md')}} col-sm-{{getWidth(arrayItem, key, 'sm')}}\"\n >\n </ngx-mat-entity-internal-input>\n </div>\n <div class=\"buttons\">\n <button mat-raised-button\n [disabled]=\"metadata.createInline && !EntityUtilities.isEntityValid(arrayItem, 'create')\"\n (click)=\"add()\">\n Add\n </button>\n <button mat-raised-button\n [disabled]=\"!selection.selected.length\"\n (click)=\"remove()\">\n Remove\n </button>\n </div>\n\n <mat-table [dataSource]=\"dataSource\">\n <!-- select Column -->\n <ng-container matColumnDef=\"select\">\n <mat-header-cell *matHeaderCellDef>\n <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"></mat-checkbox>\n </mat-header-cell>\n <mat-cell *matCellDef=\"let module\" class=\"module\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"></mat-checkbox>\n </mat-cell>\n </ng-container>\n \n <ng-container *ngFor=\"let dCol of metadata.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n <mat-header-cell *matHeaderCellDef>\n {{dCol.displayName}}\n </mat-header-cell>\n <mat-cell class=\"entity\" *matCellDef=\"let entity\">\n {{dCol.value(entity)}}\n </mat-cell>\n </ng-container>\n \n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n </mat-table>\n\n <div class=\"array-error\" *ngIf=\"metadata.required && !dataSource.data.length\">\n {{metadata.missingErrorMessage ? metadata.missingErrorMessage : 'Needs to have at least one value'}}\n </div>\n</div>", styles: [".buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px}mat-table{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:25px}.mat-column-select{flex:0 0 75px}.array-error{display:flex;align-items:center;justify-content:center;margin-top:-25.5px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:25px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}\n"] }]
826
- }], ctorParameters: function () { return [{ type: i1.MatDialog }]; }, propDecorators: { arrayItems: [{
827
- type: Input
828
- }], metadata: [{
829
- type: Input
830
- }], getValidationErrorMessage: [{
831
- type: Input
832
- }], omit: [{
833
- type: Input
834
- }] } });
835
1196
 
1197
+ /**
1198
+ * The default input component. It gets the metadata of the property from the given @Input "entity" and @Input "propertyKey"
1199
+ * and displays the input field accordingly.
1200
+ *
1201
+ * You can also define a method that generates error-messages and if the input should be hidden when its metadata says
1202
+ * that it should be omitted for creating or updating.
1203
+ * The last part being mostly relevant if you want to use this component inside an ngFor.
1204
+ */
836
1205
  class NgxMatEntityInputComponent {
837
- constructor() {
1206
+ constructor(dialog) {
1207
+ this.dialog = dialog;
838
1208
  this.chipsInput = '';
1209
+ this.selection = new SelectionModel(true, []);
839
1210
  this.DecoratorTypes = DecoratorTypes;
840
- this.getWidth = EntityUtilities.getWidth;
1211
+ this.EntityUtilities = EntityUtilities;
1212
+ this.DateUtilities = DateUtilities;
1213
+ this.defaultDateFilter = () => true;
841
1214
  }
842
1215
  /**
843
- * Helper method needed to recursively generate property input components (used eg. with the object)
1216
+ * This is needed for the inputs to work inside an ngFor.
1217
+ *
1218
+ * @param index - The index of the element in the ngFor.
1219
+ * @returns The index.
844
1220
  */
845
1221
  trackByFn(index) {
846
1222
  return index;
@@ -862,12 +1238,19 @@ class NgxMatEntityInputComponent {
862
1238
  this.filteredAutocompleteStrings = cloneDeep(this.autocompleteStrings);
863
1239
  this.metadataDropdownString = this.metadata;
864
1240
  this.metadataDropdownBoolean = this.metadata;
1241
+ if ((this.type === DecoratorTypes.BOOLEAN_CHECKBOX || this.type === DecoratorTypes.BOOLEAN_TOGGLE)
1242
+ && this.entity[this.propertyKey] === undefined) {
1243
+ this.entity[this.propertyKey] = false;
1244
+ }
865
1245
  this.metadataDefaultNumber = this.metadata;
866
1246
  this.metadataDropdownNumber = this.metadata;
867
1247
  this.metadataDefaultObject = this.metadata;
868
1248
  this.objectProperty = this.entity[this.propertyKey];
1249
+ if (this.type === DecoratorTypes.OBJECT) {
1250
+ this.objectPropertyRows = EntityUtilities.getEntityRows(this.objectProperty, this.hideOmitForCreate, this.hideOmitForEdit);
1251
+ }
869
1252
  this.metadataEntityArray = this.metadata;
870
- if (this.metadataEntityArray.EntityClass) {
1253
+ if (this.type === DecoratorTypes.ARRAY) {
871
1254
  if (!this.entity[this.propertyKey]) {
872
1255
  this.entity[this.propertyKey] = [];
873
1256
  }
@@ -880,9 +1263,27 @@ class NgxMatEntityInputComponent {
880
1263
  title: 'Add'
881
1264
  };
882
1265
  }
1266
+ const givenDisplayColumns = this.metadataEntityArray.displayColumns.map((v) => v.displayName);
1267
+ if (givenDisplayColumns.find(s => s === 'select')) {
1268
+ throw new Error(`The name "select" for a display column is reserved.
1269
+ Please choose a different name.`);
1270
+ }
1271
+ this.displayedColumns = ['select'].concat(givenDisplayColumns);
1272
+ this.dataSource = new MatTableDataSource();
1273
+ this.dataSource.data = this.entityArrayValues;
1274
+ this.arrayItem = new this.metadataEntityArray.EntityClass();
1275
+ this.arrayItemInlineRows = EntityUtilities.getEntityRows(this.arrayItem, this.hideOmitForCreate === false ? false : true, this.hideOmitForEdit ? true : false);
1276
+ this.arrayItemPriorChanges = cloneDeep(this.arrayItem);
1277
+ this.dialogInputData = {
1278
+ entity: this.arrayItem,
1279
+ createDialogData: this.metadataEntityArray.createDialogData,
1280
+ getValidationErrorMessage: this.getValidationErrorMessage
1281
+ };
1282
+ this.dialogData = new AddArrayItemDialogDataBuilder(this.dialogInputData).getResult();
1283
+ this.arrayItemDialogRows = EntityUtilities.getEntityRows(this.dialogData.entity, true);
883
1284
  }
884
1285
  this.metadataStringChipsArray = this.metadata;
885
- if (this.metadataStringChipsArray.itemType
1286
+ if ((this.type === DecoratorTypes.ARRAY_STRING_CHIPS || this.type === DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS)
886
1287
  && ((_a = this.entity[this.propertyKey]) === null || _a === void 0 ? void 0 : _a.length)) {
887
1288
  this.stringChipsArrayValues = this.entity[this.propertyKey];
888
1289
  }
@@ -890,18 +1291,150 @@ class NgxMatEntityInputComponent {
890
1291
  if (!this.getValidationErrorMessage) {
891
1292
  this.getValidationErrorMessage = getValidationErrorMessage;
892
1293
  }
893
- }
894
- getObjectProperties() {
895
- const res = [];
896
- for (const property in this.objectProperty) {
897
- const metadata = EntityUtilities.getPropertyMetadata(this.objectProperty, property, EntityUtilities.getPropertyType(this.objectProperty, property));
898
- if (!(this.hideOmitForCreate && metadata.omitForCreate)
899
- && !(this.hideOmitForEdit && metadata.omitForUpdate)) {
900
- res.push(property);
1294
+ this.metadataDefaultDate = this.metadata;
1295
+ this.metadataDateRangeDate = this.metadata;
1296
+ this.metadataDateTimeDate = this.metadata;
1297
+ if (this.type === DecoratorTypes.DATE_RANGE) {
1298
+ this.dateRange = cloneDeep(this.entity[this.propertyKey]);
1299
+ if (!this.dateRange) {
1300
+ this.dateRange = {
1301
+ start: undefined,
1302
+ end: undefined,
1303
+ values: undefined
1304
+ };
1305
+ }
1306
+ this.dateRangeStart = new Date(this.dateRange.start);
1307
+ this.dateRangeEnd = new Date(this.dateRange.end);
1308
+ this.setDateRangeValues();
1309
+ }
1310
+ if (this.type === DecoratorTypes.DATE_TIME) {
1311
+ this.time = DateUtilities.getTimeFromDate(DateUtilities.asDate(this.entity[this.propertyKey]));
1312
+ this.timeDropdownValues = this.metadataDateTimeDate.times;
1313
+ if (this.entity[this.propertyKey]) {
1314
+ this.dateTime = new Date(this.entity[this.propertyKey]);
901
1315
  }
902
1316
  }
903
- return res.sort((a, b) => EntityUtilities.compareOrder(a, b, this.objectProperty));
904
1317
  }
1318
+ /**
1319
+ * Checks if two times are equal. Is needed for the dropdown.
1320
+ *
1321
+ * @param time1 - The first time to compare.
1322
+ * @param time2 - The second time to compare.
1323
+ * @returns Whether or not the time objects are the same.
1324
+ */
1325
+ compareTimes(time1, time2) {
1326
+ return time1 && time2 && time1.hours === time2.hours && time1.minutes === time2.minutes;
1327
+ }
1328
+ /**
1329
+ * Updates the date range values based on the start and end date.
1330
+ */
1331
+ setDateRangeValues() {
1332
+ if (this.dateRangeStart && this.dateRangeEnd) {
1333
+ this.dateRange.start = new Date(this.dateRangeStart);
1334
+ this.dateRange.end = new Date(this.dateRangeEnd);
1335
+ const values = DateUtilities.getDatesBetween(new Date(this.dateRange.start), new Date(this.dateRange.end), this.metadataDateRangeDate);
1336
+ this.dateRange.values = values.length ? values : undefined;
1337
+ }
1338
+ else {
1339
+ this.dateRange.values = undefined;
1340
+ }
1341
+ this.entity[this.propertyKey] = this.dateRange;
1342
+ }
1343
+ /**
1344
+ * Sets the time on a datetime property.
1345
+ */
1346
+ setTime() {
1347
+ var _a, _b;
1348
+ if (!this.dateTime) {
1349
+ this.entity[this.propertyKey] = undefined;
1350
+ return;
1351
+ }
1352
+ this.entity[this.propertyKey] = new Date(this.dateTime);
1353
+ if (((_a = this.time) === null || _a === void 0 ? void 0 : _a.hours) != null && ((_b = this.time) === null || _b === void 0 ? void 0 : _b.minutes) != null) {
1354
+ DateUtilities.asDate(this.entity[this.propertyKey]).setHours(this.time.hours, this.time.minutes, 0, 0);
1355
+ }
1356
+ else {
1357
+ DateUtilities.asDate(this.entity[this.propertyKey]).setHours(0, 0, 0, 0);
1358
+ }
1359
+ }
1360
+ /**
1361
+ * Tries to add an item to the array.
1362
+ * Does this either inline if the "createInline"-metadata is set to true
1363
+ * or in a separate dialog if it is set to false.
1364
+ */
1365
+ add() {
1366
+ if (this.metadataEntityArray.createInline) {
1367
+ this.entityArrayValues.push(cloneDeep(this.arrayItem));
1368
+ this.dataSource.data = this.entityArrayValues;
1369
+ EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
1370
+ }
1371
+ else {
1372
+ this.addArrayItemDialogRef = this.dialog.open(this.addArrayItemDialog, {
1373
+ data: this.dialogData,
1374
+ autoFocus: false,
1375
+ restoreFocus: false
1376
+ });
1377
+ }
1378
+ }
1379
+ /**
1380
+ * Adds the array item defined in the dialog.
1381
+ */
1382
+ addArrayItem() {
1383
+ this.addArrayItemDialogRef.close();
1384
+ this.entityArrayValues.push(cloneDeep(this.arrayItem));
1385
+ this.dataSource.data = this.entityArrayValues;
1386
+ EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
1387
+ }
1388
+ /**
1389
+ * Cancels adding the array item defined in the dialog.
1390
+ */
1391
+ cancelAddArrayItem() {
1392
+ this.addArrayItemDialogRef.close();
1393
+ EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
1394
+ }
1395
+ /**
1396
+ * Removes all selected entries from the array.
1397
+ */
1398
+ remove() {
1399
+ this.selection.selected.forEach(s => {
1400
+ this.entityArrayValues.splice(this.entityArrayValues.indexOf(s), 1);
1401
+ });
1402
+ this.dataSource.data = this.entityArrayValues;
1403
+ this.selection.clear();
1404
+ }
1405
+ /**
1406
+ * Toggles all array-items in the table.
1407
+ */
1408
+ masterToggle() {
1409
+ if (this.isAllSelected()) {
1410
+ this.selection.clear();
1411
+ }
1412
+ else {
1413
+ this.dataSource.data.forEach(row => this.selection.select(row));
1414
+ }
1415
+ }
1416
+ /**
1417
+ * Checks if all array-items in the table have been selected.
1418
+ * This is needed to display the "masterToggle"-checkbox correctly.
1419
+ *
1420
+ * @returns Whether or not all array-items in the table have been selected.
1421
+ */
1422
+ isAllSelected() {
1423
+ const numSelected = this.selection.selected.length;
1424
+ const numRows = this.dataSource.data.length;
1425
+ return numSelected === numRows;
1426
+ }
1427
+ /**
1428
+ * Handles adding strings to the chipsArray.
1429
+ * Checks validation and also creates a new array if it is undefined.
1430
+ * This is needed because two things are validated: The array itself
1431
+ * and the contents of the array. And we need a way to display an
1432
+ * mat-error. As the only validation for the array is whether or not
1433
+ * it contains values, we can set it to undefined when the last element is removed
1434
+ * (removeStringChipArrayValue). That way we can use the "required" validator.
1435
+ *
1436
+ * @param event - The event that fires when a new chip is completed.
1437
+ */
905
1438
  addStringChipArrayValue(event) {
906
1439
  const value = (event.value || '').trim();
907
1440
  if (value) {
@@ -924,6 +1457,16 @@ class NgxMatEntityInputComponent {
924
1457
  }
925
1458
  event.chipInput.clear();
926
1459
  }
1460
+ /**
1461
+ * Removes the given value from the array.
1462
+ * Sets the array to undefined if it is now empty.
1463
+ * This is needed because two things are validated: The array itself
1464
+ * and the contents of the array. And we need a way to display an
1465
+ * mat-error. As the only validation for the array is whether or not
1466
+ * it is empty, setting it to undefined here enables us to use the "required" validator.
1467
+ *
1468
+ * @param value - The string to remove from the array.
1469
+ */
927
1470
  removeStringChipArrayValue(value) {
928
1471
  this.stringChipsArrayValues.splice(this.stringChipsArrayValues.indexOf(value), 1);
929
1472
  if (!this.stringChipsArrayValues.length) {
@@ -931,6 +1474,12 @@ class NgxMatEntityInputComponent {
931
1474
  this.stringChipsArrayValues = this.entity[this.propertyKey];
932
1475
  }
933
1476
  }
1477
+ /**
1478
+ * Handles adding a string to the array when an autocomplete value has been selected.
1479
+ *
1480
+ * @param event - The autocomplete selected event.
1481
+ * @param chipsInput - The element where the user typed the value.
1482
+ */
934
1483
  selected(event, chipsInput) {
935
1484
  const value = (event.option.viewValue || '').trim();
936
1485
  if (this.metadataStringChipsArray.minLength && value.length < this.metadataStringChipsArray.minLength) {
@@ -951,17 +1500,24 @@ class NgxMatEntityInputComponent {
951
1500
  this.stringChipsArrayValues.push(value);
952
1501
  chipsInput.value = '';
953
1502
  }
1503
+ /**
1504
+ * Dynamically filters the Autocomplete options when the user inputs something.
1505
+ *
1506
+ * @param input - The input of the user.
1507
+ */
954
1508
  filterAutocompleteStrings(input) {
955
- const filterValue = input.toLowerCase();
956
- this.filteredAutocompleteStrings = this.autocompleteStrings.filter(s => s.toLowerCase().includes(filterValue));
1509
+ if (input) {
1510
+ const filterValue = input.toLowerCase();
1511
+ this.filteredAutocompleteStrings = this.autocompleteStrings.filter(s => s.toLowerCase().includes(filterValue));
1512
+ }
957
1513
  }
958
1514
  }
959
- NgxMatEntityInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
960
- NgxMatEntityInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: { entity: "entity", propertyKey: "propertyKey", getValidationErrorMessage: "getValidationErrorMessage", hideOmitForCreate: "hideOmitForCreate", hideOmitForEdit: "hideOmitForEdit" }, ngImport: i0, template: "<div [ngSwitch]=\"type\" *ngIf=\"!(hideOmitForCreate && metadata.omitForCreate) && !(hideOmitForEdit && metadata.omitForUpdate)\">\n <!-------------------------------------------->\n <!-----------------Strings-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.STRING\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n [pattern]=\"metadataDefaultString.regex ? metadataDefaultString.regex : '[\\\\s\\\\S]*'\"\n [minlength]=\"metadataDefaultString.minLength ? metadataDefaultString.minLength : null\"\n [maxlength]=\"metadataDefaultString.maxLength ? metadataDefaultString.maxLength : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_TEXTBOX\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <textarea\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"10\"\n [required]=\"metadata.required ? metadata.required : false\"\n [minlength]=\"metadataTextboxString.minLength ? metadataTextboxString.minLength : null\"\n [maxlength]=\"metadataTextboxString.maxLength ? metadataTextboxString.maxLength : null\"\n >\n </textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_AUTOCOMPLETE\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matAutocomplete]=\"auto\"\n (keyup)=\"filterAutocompleteStrings(entity[propertyKey])\"\n [required]=\"metadata.required ? metadata.required : false\"\n [minlength]=\"metadataAutocompleteString.minLength ? metadataAutocompleteString.minLength : null\"\n [maxlength]=\"metadataAutocompleteString.maxLength ? metadataAutocompleteString.maxLength : null\"\n [pattern]=\"metadataAutocompleteString.regex ? metadataAutocompleteString.regex : '[\\\\s\\\\S]*'\"\n />\n <mat-autocomplete #auto=\"matAutocomplete\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n <mat-option *ngFor=\"let value of metadataDropdownString.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-----------------Booleans------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_CHECKBOX\">\n <mat-form-field>\n <mat-checkbox [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n {{metadata.displayName}}\n </mat-checkbox>\n <!-- hidden input is needed so that the checkbox can be used inside a mat-form-field -->\n <textarea matInput hidden></textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_TOGGLE\">\n <mat-form-field>\n <mat-slide-toggle [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n {{metadata.displayName}}\n </mat-slide-toggle>\n <!-- hidden input is needed so that the toggle can be used inside a mat-form-field -->\n <textarea matInput hidden></textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n <mat-option [value]=\"undefined\">-</mat-option>\n <mat-option [value]=\"true\">{{metadataDropdownBoolean.dropdownTrue}}</mat-option>\n <mat-option [value]=\"false\">{{metadataDropdownBoolean.dropdownFalse}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!------------------Numbers------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n type=\"number\"\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n [min]=\"metadataDefaultNumber.min ? metadataDefaultNumber.min : null\"\n [max]=\"metadataDefaultNumber.max ? metadataDefaultNumber.max : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n <mat-option *ngFor=\"let value of metadataDropdownNumber.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Object------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.OBJECT\">\n <b>{{metadataDefaultObject.displayName}}</b>\n <!-- iterates over the object properties -->\n <div class=\"row\">\n <!--\n displays another ngx-material-entity with the:\n object as the entity,\n the current key in the loop received by the keyvalue direction as the propertyKey\n and the getValidationErrorMessage of the current component\n -->\n <ngx-mat-entity-input\n *ngFor=\"let key of getObjectProperties(); let i = index; trackBy: trackByFn\"\n [entity]=\"objectProperty\"\n [propertyKey]=\"key\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n [hideOmitForCreate]=\"hideOmitForCreate\"\n [hideOmitForEdit]=\"hideOmitForEdit\"\n class=\"col-lg-{{getWidth(objectProperty, key, 'lg')}} col-md-{{getWidth(objectProperty, key, 'md')}} col-sm-{{getWidth(objectProperty, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Array-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY\">\n <ngx-mat-entity-array-table\n [arrayItems]=\"entityArrayValues\"\n [metadata]=\"metadataEntityArray\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n [omit]=\"hideOmitForCreate ? 'create' : 'edit'\"\n >\n </ngx-mat-entity-array-table>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove *ngIf=\"metadataStringChipsArray.deleteHtml\" [innerHtml]=\"metadataStringChipsArray.deleteHtml\">\n </button>\n <button matChipRemove *ngIf=\"!metadataStringChipsArray.deleteHtml\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove *ngIf=\"metadataStringChipsArray.deleteHtml\" [innerHtml]=\"metadataStringChipsArray.deleteHtml\">\n </button>\n <button matChipRemove *ngIf=\"!metadataStringChipsArray.deleteHtml\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matAutocomplete]=\"auto\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n (keyup)=\"filterAutocompleteStrings(chipsInput)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n #chipsElement\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"selected($event, chipsElement)\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchDefault>ERROR: The type {{type}}is not known.</div>\n</div>", styles: ["mat-form-field{width:100%}\n"], components: [{ type: i1$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i3$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i6.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }, { type: NgxMatEntityArrayTableComponent, selector: "ngx-mat-entity-array-table", inputs: ["arrayItems", "metadata", "getValidationErrorMessage", "omit"] }, { type: i8$1.MatChipList, selector: "mat-chip-list", inputs: ["errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i7.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1$1.MatLabel, selector: "mat-label" }, { type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i12.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i12.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i12.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i12.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i12.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i12.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { type: i12.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i1$1.MatError, selector: "mat-error", inputs: ["id"] }, { type: i10.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.MatCheckboxRequiredValidator, selector: "mat-checkbox[required][formControlName], mat-checkbox[required][formControl], mat-checkbox[required][ngModel]" }, { type: i6.MatSlideToggleRequiredValidator, selector: "mat-slide-toggle[required][formControlName], mat-slide-toggle[required][formControl], mat-slide-toggle[required][ngModel]" }, { type: i12.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i12.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i12.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { type: i8$1.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i8$1.MatChipRemove, selector: "[matChipRemove]" }, { type: i8$1.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { type: i7.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
1515
+ NgxMatEntityInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputComponent, deps: [{ token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
1516
+ NgxMatEntityInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: { entity: "entity", propertyKey: "propertyKey", getValidationErrorMessage: "getValidationErrorMessage", hideOmitForCreate: "hideOmitForCreate", hideOmitForEdit: "hideOmitForEdit" }, viewQueries: [{ propertyName: "addArrayItemDialog", first: true, predicate: ["addArrayItemDialog"], descendants: true }], ngImport: i0, template: "<div [ngSwitch]=\"type\" *ngIf=\"!(hideOmitForCreate && metadata.omitForCreate) && !(hideOmitForEdit && metadata.omitForUpdate)\">\n <!-------------------------------------------->\n <!-----------------Strings-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.STRING\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required\"\n [pattern]=\"metadataDefaultString.regex ? metadataDefaultString.regex : '[\\\\s\\\\S]*'\"\n [minlength]=\"metadataDefaultString.minLength ? metadataDefaultString.minLength : null\"\n [maxlength]=\"metadataDefaultString.maxLength ? metadataDefaultString.maxLength : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_TEXTBOX\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <textarea\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"10\"\n [required]=\"metadata.required\"\n [minlength]=\"metadataTextboxString.minLength ? metadataTextboxString.minLength : null\"\n [maxlength]=\"metadataTextboxString.maxLength ? metadataTextboxString.maxLength : null\"\n >\n </textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_AUTOCOMPLETE\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matAutocomplete]=\"auto\"\n (keyup)=\"filterAutocompleteStrings(entity[propertyKey])\"\n [required]=\"metadata.required\"\n [minlength]=\"metadataAutocompleteString.minLength ? metadataAutocompleteString.minLength : null\"\n [maxlength]=\"metadataAutocompleteString.maxLength ? metadataAutocompleteString.maxLength : null\"\n [pattern]=\"metadataAutocompleteString.regex ? metadataAutocompleteString.regex : '[\\\\s\\\\S]*'\"\n />\n <mat-autocomplete #auto=\"matAutocomplete\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required\">\n <mat-option *ngFor=\"let value of metadataDropdownString.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-----------------Booleans------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_CHECKBOX\">\n <mat-form-field class=\"hideUnderline\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-checkbox (click)=\"model.control.markAsTouched()\" [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\"></mat-checkbox>\n <!-- hidden input is needed so that the checkbox can be used inside a mat-form-field -->\n <input matInput hidden\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString() + 'Helper'\"\n #model=\"ngModel\"\n [pattern]=\"metadata.required ? 'true' : '[\\\\s\\\\S]*'\"\n [required]=\"metadata.required\">\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_TOGGLE\">\n <mat-form-field class=\"hideUnderline\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-slide-toggle (click)=\"model.control.markAsTouched()\" [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\"></mat-slide-toggle>\n <!-- hidden input is needed so that the toggle can be used inside a mat-form-field -->\n <input matInput hidden\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString() + 'Helper'\"\n #model=\"ngModel\"\n [pattern]=\"metadata.required ? 'true' : '[\\\\s\\\\S]*'\"\n [required]=\"metadata.required\">\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required\">\n <mat-option [value]=\"undefined\">-</mat-option>\n <mat-option [value]=\"true\">{{metadataDropdownBoolean.dropdownTrue}}</mat-option>\n <mat-option [value]=\"false\">{{metadataDropdownBoolean.dropdownFalse}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!------------------Numbers------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n type=\"number\"\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required\"\n [min]=\"metadataDefaultNumber.min ? metadataDefaultNumber.min : null\"\n [max]=\"metadataDefaultNumber.max ? metadataDefaultNumber.max : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required\">\n <mat-option *ngFor=\"let value of metadataDropdownNumber.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Object------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.OBJECT\">\n <b>{{metadataDefaultObject.displayName}}</b>\n <!-- iterates over the object properties -->\n\n <div class=\"row\" *ngFor=\"let row of objectPropertyRows\">\n <!--\n displays another ngx-material-entity with the:\n object as the entity,\n the current key in the loop received by the keyvalue direction as the propertyKey\n and the getValidationErrorMessage of the current component\n -->\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys; let i = index; trackBy: trackByFn\"\n [entity]=\"objectProperty\"\n [propertyKey]=\"key\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n [hideOmitForCreate]=\"hideOmitForCreate\"\n [hideOmitForEdit]=\"hideOmitForEdit\"\n class=\"col-lg-{{EntityUtilities.getWidth(objectProperty, key, 'lg')}} col-md-{{EntityUtilities.getWidth(objectProperty, key, 'md')}} col-sm-{{EntityUtilities.getWidth(objectProperty, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Array-------------------->\n <!-------------------------------------------->\n <div class=\"entityArray\" *ngSwitchCase=\"DecoratorTypes.ARRAY\">\n <div class=\"mat-elevation-z8\" style=\"border-radius: 5px;padding: 15px;margin-bottom: 15px;margin-top: 15px;\">\n\n <div style=\"padding-bottom: 10px\">\n <b>{{metadataEntityArray.displayName}}</b>\n </div>\n <div *ngIf=\"metadataEntityArray.createInline\">\n <div class=\"row\" *ngFor=\"let row of arrayItemInlineRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys; let i = index; trackBy: trackByFn\"\n [entity]=\"arrayItem\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n class=\"col-lg-{{EntityUtilities.getWidth(arrayItem, key, 'lg')}} col-md-{{EntityUtilities.getWidth(arrayItem, key, 'md')}} col-sm-{{EntityUtilities.getWidth(arrayItem, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </div>\n \n <div class=\"buttons\">\n <button mat-raised-button\n [disabled]=\"metadataEntityArray.createInline && !EntityUtilities.isEntityValid(arrayItem, 'create')\"\n (click)=\"add()\">\n {{metadataEntityArray.addButtonLabel}}\n </button>\n <button mat-raised-button\n [disabled]=\"!selection.selected.length\"\n (click)=\"remove()\">\n {{metadataEntityArray.removeButtonLabel}}\n </button>\n </div>\n \n <mat-table [dataSource]=\"dataSource\">\n <!-- select Column -->\n <ng-container matColumnDef=\"select\">\n <mat-header-cell *matHeaderCellDef>\n <mat-checkbox [disabled]=\"!dataSource.data.length\" (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"></mat-checkbox>\n </mat-header-cell>\n <mat-cell *matCellDef=\"let module\" class=\"module\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"></mat-checkbox>\n </mat-cell>\n </ng-container>\n \n <ng-container *ngFor=\"let dCol of metadataEntityArray.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n <mat-header-cell *matHeaderCellDef>\n {{dCol.displayName}}\n </mat-header-cell>\n <mat-cell class=\"entity\" *matCellDef=\"let entity\">\n {{dCol.value(entity)}}\n </mat-cell>\n </ng-container>\n \n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n </mat-table>\n \n <div class=\"array-error\" *ngIf=\"metadataEntityArray.required && !dataSource.data.length\">\n {{metadataEntityArray.missingErrorMessage}}\n </div>\n </div>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove>\n <i class=\"{{metadataStringChipsArray.deleteIcon}}\"></i>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove>\n <i class=\"{{metadataStringChipsArray.deleteIcon}}\"></i>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matAutocomplete]=\"auto\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n (keyup)=\"filterAutocompleteStrings(chipsInput)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n #chipsElement\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"selected($event, chipsElement)\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Dates-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.DATE\">\n <mat-form-field appearance=\"standard\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matDatepicker]=\"picker\"\n [required]=\"metadata.required\"\n [min]=\"metadataDefaultDate.min ? metadataDefaultDate.min(DateUtilities.asDate(entity[propertyKey])) : undefined\"\n [max]=\"metadataDefaultDate.max ? metadataDefaultDate.max(DateUtilities.asDate(entity[propertyKey])) : undefined\"\n [matDatepickerFilter]=\"metadataDefaultDate.filter ? metadataDefaultDate.filter : defaultDateFilter\"\n >\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.DATE_RANGE\">\n <mat-form-field appearance=\"standard\">\n <mat-label>{{metadata.displayName}}</mat-label>\n \n <mat-date-range-input [rangePicker]=\"picker\" [required]=\"metadata.required\" [dateFilter]=\"metadataDateRangeDate.filter ? metadataDateRangeDate.filter : defaultDateFilter\">\n <input matStartDate\n [(ngModel)]=\"dateRangeStart\"\n [name]=\"propertyKey.toString() + 'start'\"\n #startModel=\"ngModel\"\n [required]=\"metadata.required\"\n [min]=\"metadataDateRangeDate.minStart ? metadataDateRangeDate.minStart(dateRange.start) : undefined\"\n [max]=\"metadataDateRangeDate.maxStart ? metadataDateRangeDate.maxStart(dateRange.start) : undefined\"\n [placeholder]=\"metadataDateRangeDate.placeholderStart ? metadataDateRangeDate.placeholderStart : 'Start'\"\n (ngModelChange)=\"setDateRangeValues()\"\n >\n <input matEndDate\n [(ngModel)]=\"dateRangeEnd\"\n [name]=\"propertyKey.toString() + 'end'\"\n #endModel=\"ngModel\"\n [required]=\"metadata.required\"\n [min]=\"metadataDateRangeDate.minEnd ? metadataDateRangeDate.minEnd(dateRange.end) : undefined\"\n [max]=\"metadataDateRangeDate.maxEnd ? metadataDateRangeDate.maxEnd(dateRange.end) : undefined\"\n [placeholder]=\"metadataDateRangeDate.placeholderEnd ? metadataDateRangeDate.placeholderEnd : 'End'\"\n (ngModelChange)=\"setDateRangeValues()\"\n >\n </mat-date-range-input>\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <mat-date-range-picker #picker></mat-date-range-picker>\n\n <mat-error *ngIf=\"startModel.errors\">{{getValidationErrorMessage(startModel)}}</mat-error>\n <mat-error *ngIf=\"!startModel.errors && endModel.errors\">{{getValidationErrorMessage(endModel)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.DATE_TIME\" class=\"date-time\">\n <mat-form-field appearance=\"standard\" class=\"datepicker\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"dateTime\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matDatepicker]=\"picker\"\n [required]=\"metadata.required\"\n [min]=\"metadataDateTimeDate.minDate ? metadataDateTimeDate.minDate(dateTime) : undefined\"\n [max]=\"metadataDateTimeDate.maxDate ? metadataDateTimeDate.maxDate(dateTime) : undefined\"\n [matDatepickerFilter]=\"metadataDateTimeDate.filterDate ? metadataDateTimeDate.filterDate : defaultDateFilter\"\n (dateInput)=\"setTime()\"\n >\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n <mat-form-field class=\"timepicker\">\n <mat-label>{{metadataDateTimeDate.timeDisplayName}}</mat-label>\n <mat-select\n [(ngModel)]=\"time\"\n [name]=\"propertyKey.toString() + 'time'\"\n #timeModel=\"ngModel\"\n [required]=\"metadata.required\"\n [compareWith]=\"compareTimes\"\n (ngModelChange)=\"setTime()\"\n >\n <mat-option *ngFor=\"let validTime of DateUtilities.getValidTimesForDropdown(\n DateUtilities.asDate(entity[propertyKey]),\n metadataDateTimeDate.times,\n metadataDateTimeDate.minTime,\n metadataDateTimeDate.maxTime,\n metadataDateTimeDate.filterTime\n )\"\n [value]=\"validTime.value\"\n >\n {{validTime.displayName}}\n </mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(timeModel)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchDefault>ERROR: The type {{type}} is not known.</div>\n</div>\n\n<!--------------------------------------------------------->\n<!--------------------Add Array Item Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #addArrayItemDialog>\n <h2 mat-dialog-title>{{dialogData.createDialogData.title}}</h2>\n\n <mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <div class=\"row\" *ngFor=\"let row of arrayItemDialogRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys\"\n [entity]=\"dialogData.entity\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"dialogData.getValidationErrorMessage\"\n class=\"col-lg-{{EntityUtilities.getWidth(dialogData.entity, key, 'lg')}} col-md-{{EntityUtilities.getWidth(dialogData.entity, key, 'md')}} col-sm-{{EntityUtilities.getWidth(dialogData.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </form>\n </mat-dialog-content>\n\n <mat-dialog-actions>\n <button mat-raised-button (click)=\"addArrayItem()\" [disabled]=\"!EntityUtilities.isEntityValid(dialogData.entity, 'create')\">\n {{dialogData.createDialogData.createButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancelAddArrayItem()\" class=\"cancel-button\">\n {{dialogData.createDialogData.cancelButtonLabel}}\n </button>\n </mat-dialog-actions>\n\n</ng-template>", styles: ["mat-form-field{width:100%}::ng-deep .hideUnderline .mat-form-field-underline{opacity:0%}.entityArray .buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px}.entityArray mat-table{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:25px}.entityArray .mat-column-select{flex:0 0 75px}.entityArray .array-error{display:flex;align-items:center;justify-content:center;margin-top:-25.8px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:25.8px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.date-time{display:flex;align-items:baseline}.date-time .timepicker{margin-left:10px}\n"], components: [{ type: i2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i3$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i4.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i5.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i6.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i7.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i9.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i9.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i9.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { type: i10.MatChipList, selector: "mat-chip-list", inputs: ["errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: i11.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { type: i11.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { type: i11.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { type: i11.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }], directives: [{ type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i12.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i12.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2.MatLabel, selector: "mat-label" }, { type: i13.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i14.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i14.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i14.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i14.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i14.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i14.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { type: i14.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i2.MatError, selector: "mat-error", inputs: ["id"] }, { type: i15.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i3$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i14.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i14.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i14.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { type: i9.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i9.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i9.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i9.MatCellDef, selector: "[matCellDef]" }, { type: i9.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i9.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i9.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { type: i10.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i10.MatChipRemove, selector: "[matChipRemove]" }, { type: i10.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { type: i11.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { type: i2.MatSuffix, selector: "[matSuffix]" }, { type: i11.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { type: i11.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { type: i12.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i14.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i14.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i14.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
961
1517
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputComponent, decorators: [{
962
1518
  type: Component,
963
- args: [{ selector: 'ngx-mat-entity-input', template: "<div [ngSwitch]=\"type\" *ngIf=\"!(hideOmitForCreate && metadata.omitForCreate) && !(hideOmitForEdit && metadata.omitForUpdate)\">\n <!-------------------------------------------->\n <!-----------------Strings-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.STRING\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n [pattern]=\"metadataDefaultString.regex ? metadataDefaultString.regex : '[\\\\s\\\\S]*'\"\n [minlength]=\"metadataDefaultString.minLength ? metadataDefaultString.minLength : null\"\n [maxlength]=\"metadataDefaultString.maxLength ? metadataDefaultString.maxLength : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_TEXTBOX\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <textarea\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"10\"\n [required]=\"metadata.required ? metadata.required : false\"\n [minlength]=\"metadataTextboxString.minLength ? metadataTextboxString.minLength : null\"\n [maxlength]=\"metadataTextboxString.maxLength ? metadataTextboxString.maxLength : null\"\n >\n </textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_AUTOCOMPLETE\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matAutocomplete]=\"auto\"\n (keyup)=\"filterAutocompleteStrings(entity[propertyKey])\"\n [required]=\"metadata.required ? metadata.required : false\"\n [minlength]=\"metadataAutocompleteString.minLength ? metadataAutocompleteString.minLength : null\"\n [maxlength]=\"metadataAutocompleteString.maxLength ? metadataAutocompleteString.maxLength : null\"\n [pattern]=\"metadataAutocompleteString.regex ? metadataAutocompleteString.regex : '[\\\\s\\\\S]*'\"\n />\n <mat-autocomplete #auto=\"matAutocomplete\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n <mat-option *ngFor=\"let value of metadataDropdownString.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-----------------Booleans------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_CHECKBOX\">\n <mat-form-field>\n <mat-checkbox [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n {{metadata.displayName}}\n </mat-checkbox>\n <!-- hidden input is needed so that the checkbox can be used inside a mat-form-field -->\n <textarea matInput hidden></textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_TOGGLE\">\n <mat-form-field>\n <mat-slide-toggle [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n {{metadata.displayName}}\n </mat-slide-toggle>\n <!-- hidden input is needed so that the toggle can be used inside a mat-form-field -->\n <textarea matInput hidden></textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n <mat-option [value]=\"undefined\">-</mat-option>\n <mat-option [value]=\"true\">{{metadataDropdownBoolean.dropdownTrue}}</mat-option>\n <mat-option [value]=\"false\">{{metadataDropdownBoolean.dropdownFalse}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!------------------Numbers------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n type=\"number\"\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n [min]=\"metadataDefaultNumber.min ? metadataDefaultNumber.min : null\"\n [max]=\"metadataDefaultNumber.max ? metadataDefaultNumber.max : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n <mat-option *ngFor=\"let value of metadataDropdownNumber.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Object------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.OBJECT\">\n <b>{{metadataDefaultObject.displayName}}</b>\n <!-- iterates over the object properties -->\n <div class=\"row\">\n <!--\n displays another ngx-material-entity with the:\n object as the entity,\n the current key in the loop received by the keyvalue direction as the propertyKey\n and the getValidationErrorMessage of the current component\n -->\n <ngx-mat-entity-input\n *ngFor=\"let key of getObjectProperties(); let i = index; trackBy: trackByFn\"\n [entity]=\"objectProperty\"\n [propertyKey]=\"key\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n [hideOmitForCreate]=\"hideOmitForCreate\"\n [hideOmitForEdit]=\"hideOmitForEdit\"\n class=\"col-lg-{{getWidth(objectProperty, key, 'lg')}} col-md-{{getWidth(objectProperty, key, 'md')}} col-sm-{{getWidth(objectProperty, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Array-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY\">\n <ngx-mat-entity-array-table\n [arrayItems]=\"entityArrayValues\"\n [metadata]=\"metadataEntityArray\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n [omit]=\"hideOmitForCreate ? 'create' : 'edit'\"\n >\n </ngx-mat-entity-array-table>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove *ngIf=\"metadataStringChipsArray.deleteHtml\" [innerHtml]=\"metadataStringChipsArray.deleteHtml\">\n </button>\n <button matChipRemove *ngIf=\"!metadataStringChipsArray.deleteHtml\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove *ngIf=\"metadataStringChipsArray.deleteHtml\" [innerHtml]=\"metadataStringChipsArray.deleteHtml\">\n </button>\n <button matChipRemove *ngIf=\"!metadataStringChipsArray.deleteHtml\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matAutocomplete]=\"auto\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n (keyup)=\"filterAutocompleteStrings(chipsInput)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n #chipsElement\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"selected($event, chipsElement)\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchDefault>ERROR: The type {{type}}is not known.</div>\n</div>", styles: ["mat-form-field{width:100%}\n"] }]
964
- }], ctorParameters: function () { return []; }, propDecorators: { entity: [{
1519
+ args: [{ selector: 'ngx-mat-entity-input', template: "<div [ngSwitch]=\"type\" *ngIf=\"!(hideOmitForCreate && metadata.omitForCreate) && !(hideOmitForEdit && metadata.omitForUpdate)\">\n <!-------------------------------------------->\n <!-----------------Strings-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.STRING\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required\"\n [pattern]=\"metadataDefaultString.regex ? metadataDefaultString.regex : '[\\\\s\\\\S]*'\"\n [minlength]=\"metadataDefaultString.minLength ? metadataDefaultString.minLength : null\"\n [maxlength]=\"metadataDefaultString.maxLength ? metadataDefaultString.maxLength : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_TEXTBOX\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <textarea\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"10\"\n [required]=\"metadata.required\"\n [minlength]=\"metadataTextboxString.minLength ? metadataTextboxString.minLength : null\"\n [maxlength]=\"metadataTextboxString.maxLength ? metadataTextboxString.maxLength : null\"\n >\n </textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_AUTOCOMPLETE\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matAutocomplete]=\"auto\"\n (keyup)=\"filterAutocompleteStrings(entity[propertyKey])\"\n [required]=\"metadata.required\"\n [minlength]=\"metadataAutocompleteString.minLength ? metadataAutocompleteString.minLength : null\"\n [maxlength]=\"metadataAutocompleteString.maxLength ? metadataAutocompleteString.maxLength : null\"\n [pattern]=\"metadataAutocompleteString.regex ? metadataAutocompleteString.regex : '[\\\\s\\\\S]*'\"\n />\n <mat-autocomplete #auto=\"matAutocomplete\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required\">\n <mat-option *ngFor=\"let value of metadataDropdownString.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-----------------Booleans------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_CHECKBOX\">\n <mat-form-field class=\"hideUnderline\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-checkbox (click)=\"model.control.markAsTouched()\" [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\"></mat-checkbox>\n <!-- hidden input is needed so that the checkbox can be used inside a mat-form-field -->\n <input matInput hidden\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString() + 'Helper'\"\n #model=\"ngModel\"\n [pattern]=\"metadata.required ? 'true' : '[\\\\s\\\\S]*'\"\n [required]=\"metadata.required\">\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_TOGGLE\">\n <mat-form-field class=\"hideUnderline\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-slide-toggle (click)=\"model.control.markAsTouched()\" [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\"></mat-slide-toggle>\n <!-- hidden input is needed so that the toggle can be used inside a mat-form-field -->\n <input matInput hidden\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString() + 'Helper'\"\n #model=\"ngModel\"\n [pattern]=\"metadata.required ? 'true' : '[\\\\s\\\\S]*'\"\n [required]=\"metadata.required\">\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required\">\n <mat-option [value]=\"undefined\">-</mat-option>\n <mat-option [value]=\"true\">{{metadataDropdownBoolean.dropdownTrue}}</mat-option>\n <mat-option [value]=\"false\">{{metadataDropdownBoolean.dropdownFalse}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!------------------Numbers------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n type=\"number\"\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required\"\n [min]=\"metadataDefaultNumber.min ? metadataDefaultNumber.min : null\"\n [max]=\"metadataDefaultNumber.max ? metadataDefaultNumber.max : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required\">\n <mat-option *ngFor=\"let value of metadataDropdownNumber.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Object------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.OBJECT\">\n <b>{{metadataDefaultObject.displayName}}</b>\n <!-- iterates over the object properties -->\n\n <div class=\"row\" *ngFor=\"let row of objectPropertyRows\">\n <!--\n displays another ngx-material-entity with the:\n object as the entity,\n the current key in the loop received by the keyvalue direction as the propertyKey\n and the getValidationErrorMessage of the current component\n -->\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys; let i = index; trackBy: trackByFn\"\n [entity]=\"objectProperty\"\n [propertyKey]=\"key\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n [hideOmitForCreate]=\"hideOmitForCreate\"\n [hideOmitForEdit]=\"hideOmitForEdit\"\n class=\"col-lg-{{EntityUtilities.getWidth(objectProperty, key, 'lg')}} col-md-{{EntityUtilities.getWidth(objectProperty, key, 'md')}} col-sm-{{EntityUtilities.getWidth(objectProperty, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Array-------------------->\n <!-------------------------------------------->\n <div class=\"entityArray\" *ngSwitchCase=\"DecoratorTypes.ARRAY\">\n <div class=\"mat-elevation-z8\" style=\"border-radius: 5px;padding: 15px;margin-bottom: 15px;margin-top: 15px;\">\n\n <div style=\"padding-bottom: 10px\">\n <b>{{metadataEntityArray.displayName}}</b>\n </div>\n <div *ngIf=\"metadataEntityArray.createInline\">\n <div class=\"row\" *ngFor=\"let row of arrayItemInlineRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys; let i = index; trackBy: trackByFn\"\n [entity]=\"arrayItem\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n class=\"col-lg-{{EntityUtilities.getWidth(arrayItem, key, 'lg')}} col-md-{{EntityUtilities.getWidth(arrayItem, key, 'md')}} col-sm-{{EntityUtilities.getWidth(arrayItem, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </div>\n \n <div class=\"buttons\">\n <button mat-raised-button\n [disabled]=\"metadataEntityArray.createInline && !EntityUtilities.isEntityValid(arrayItem, 'create')\"\n (click)=\"add()\">\n {{metadataEntityArray.addButtonLabel}}\n </button>\n <button mat-raised-button\n [disabled]=\"!selection.selected.length\"\n (click)=\"remove()\">\n {{metadataEntityArray.removeButtonLabel}}\n </button>\n </div>\n \n <mat-table [dataSource]=\"dataSource\">\n <!-- select Column -->\n <ng-container matColumnDef=\"select\">\n <mat-header-cell *matHeaderCellDef>\n <mat-checkbox [disabled]=\"!dataSource.data.length\" (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"></mat-checkbox>\n </mat-header-cell>\n <mat-cell *matCellDef=\"let module\" class=\"module\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"></mat-checkbox>\n </mat-cell>\n </ng-container>\n \n <ng-container *ngFor=\"let dCol of metadataEntityArray.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n <mat-header-cell *matHeaderCellDef>\n {{dCol.displayName}}\n </mat-header-cell>\n <mat-cell class=\"entity\" *matCellDef=\"let entity\">\n {{dCol.value(entity)}}\n </mat-cell>\n </ng-container>\n \n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n </mat-table>\n \n <div class=\"array-error\" *ngIf=\"metadataEntityArray.required && !dataSource.data.length\">\n {{metadataEntityArray.missingErrorMessage}}\n </div>\n </div>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove>\n <i class=\"{{metadataStringChipsArray.deleteIcon}}\"></i>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove>\n <i class=\"{{metadataStringChipsArray.deleteIcon}}\"></i>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matAutocomplete]=\"auto\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n (keyup)=\"filterAutocompleteStrings(chipsInput)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n #chipsElement\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"selected($event, chipsElement)\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Dates-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.DATE\">\n <mat-form-field appearance=\"standard\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matDatepicker]=\"picker\"\n [required]=\"metadata.required\"\n [min]=\"metadataDefaultDate.min ? metadataDefaultDate.min(DateUtilities.asDate(entity[propertyKey])) : undefined\"\n [max]=\"metadataDefaultDate.max ? metadataDefaultDate.max(DateUtilities.asDate(entity[propertyKey])) : undefined\"\n [matDatepickerFilter]=\"metadataDefaultDate.filter ? metadataDefaultDate.filter : defaultDateFilter\"\n >\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.DATE_RANGE\">\n <mat-form-field appearance=\"standard\">\n <mat-label>{{metadata.displayName}}</mat-label>\n \n <mat-date-range-input [rangePicker]=\"picker\" [required]=\"metadata.required\" [dateFilter]=\"metadataDateRangeDate.filter ? metadataDateRangeDate.filter : defaultDateFilter\">\n <input matStartDate\n [(ngModel)]=\"dateRangeStart\"\n [name]=\"propertyKey.toString() + 'start'\"\n #startModel=\"ngModel\"\n [required]=\"metadata.required\"\n [min]=\"metadataDateRangeDate.minStart ? metadataDateRangeDate.minStart(dateRange.start) : undefined\"\n [max]=\"metadataDateRangeDate.maxStart ? metadataDateRangeDate.maxStart(dateRange.start) : undefined\"\n [placeholder]=\"metadataDateRangeDate.placeholderStart ? metadataDateRangeDate.placeholderStart : 'Start'\"\n (ngModelChange)=\"setDateRangeValues()\"\n >\n <input matEndDate\n [(ngModel)]=\"dateRangeEnd\"\n [name]=\"propertyKey.toString() + 'end'\"\n #endModel=\"ngModel\"\n [required]=\"metadata.required\"\n [min]=\"metadataDateRangeDate.minEnd ? metadataDateRangeDate.minEnd(dateRange.end) : undefined\"\n [max]=\"metadataDateRangeDate.maxEnd ? metadataDateRangeDate.maxEnd(dateRange.end) : undefined\"\n [placeholder]=\"metadataDateRangeDate.placeholderEnd ? metadataDateRangeDate.placeholderEnd : 'End'\"\n (ngModelChange)=\"setDateRangeValues()\"\n >\n </mat-date-range-input>\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <mat-date-range-picker #picker></mat-date-range-picker>\n\n <mat-error *ngIf=\"startModel.errors\">{{getValidationErrorMessage(startModel)}}</mat-error>\n <mat-error *ngIf=\"!startModel.errors && endModel.errors\">{{getValidationErrorMessage(endModel)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.DATE_TIME\" class=\"date-time\">\n <mat-form-field appearance=\"standard\" class=\"datepicker\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"dateTime\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matDatepicker]=\"picker\"\n [required]=\"metadata.required\"\n [min]=\"metadataDateTimeDate.minDate ? metadataDateTimeDate.minDate(dateTime) : undefined\"\n [max]=\"metadataDateTimeDate.maxDate ? metadataDateTimeDate.maxDate(dateTime) : undefined\"\n [matDatepickerFilter]=\"metadataDateTimeDate.filterDate ? metadataDateTimeDate.filterDate : defaultDateFilter\"\n (dateInput)=\"setTime()\"\n >\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n <mat-form-field class=\"timepicker\">\n <mat-label>{{metadataDateTimeDate.timeDisplayName}}</mat-label>\n <mat-select\n [(ngModel)]=\"time\"\n [name]=\"propertyKey.toString() + 'time'\"\n #timeModel=\"ngModel\"\n [required]=\"metadata.required\"\n [compareWith]=\"compareTimes\"\n (ngModelChange)=\"setTime()\"\n >\n <mat-option *ngFor=\"let validTime of DateUtilities.getValidTimesForDropdown(\n DateUtilities.asDate(entity[propertyKey]),\n metadataDateTimeDate.times,\n metadataDateTimeDate.minTime,\n metadataDateTimeDate.maxTime,\n metadataDateTimeDate.filterTime\n )\"\n [value]=\"validTime.value\"\n >\n {{validTime.displayName}}\n </mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(timeModel)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchDefault>ERROR: The type {{type}} is not known.</div>\n</div>\n\n<!--------------------------------------------------------->\n<!--------------------Add Array Item Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #addArrayItemDialog>\n <h2 mat-dialog-title>{{dialogData.createDialogData.title}}</h2>\n\n <mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <div class=\"row\" *ngFor=\"let row of arrayItemDialogRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys\"\n [entity]=\"dialogData.entity\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"dialogData.getValidationErrorMessage\"\n class=\"col-lg-{{EntityUtilities.getWidth(dialogData.entity, key, 'lg')}} col-md-{{EntityUtilities.getWidth(dialogData.entity, key, 'md')}} col-sm-{{EntityUtilities.getWidth(dialogData.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </form>\n </mat-dialog-content>\n\n <mat-dialog-actions>\n <button mat-raised-button (click)=\"addArrayItem()\" [disabled]=\"!EntityUtilities.isEntityValid(dialogData.entity, 'create')\">\n {{dialogData.createDialogData.createButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancelAddArrayItem()\" class=\"cancel-button\">\n {{dialogData.createDialogData.cancelButtonLabel}}\n </button>\n </mat-dialog-actions>\n\n</ng-template>", styles: ["mat-form-field{width:100%}::ng-deep .hideUnderline .mat-form-field-underline{opacity:0%}.entityArray .buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px}.entityArray mat-table{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:25px}.entityArray .mat-column-select{flex:0 0 75px}.entityArray .array-error{display:flex;align-items:center;justify-content:center;margin-top:-25.8px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:25.8px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.date-time{display:flex;align-items:baseline}.date-time .timepicker{margin-left:10px}\n"] }]
1520
+ }], ctorParameters: function () { return [{ type: i1.MatDialog }]; }, propDecorators: { entity: [{
965
1521
  type: Input
966
1522
  }], propertyKey: [{
967
1523
  type: Input
@@ -971,11 +1527,103 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
971
1527
  type: Input
972
1528
  }], hideOmitForEdit: [{
973
1529
  type: Input
1530
+ }], addArrayItemDialog: [{
1531
+ type: ViewChild,
1532
+ args: ['addArrayItemDialog']
974
1533
  }] } });
975
1534
 
1535
+ class NgxMatEntityInputModule {
1536
+ }
1537
+ NgxMatEntityInputModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1538
+ NgxMatEntityInputModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, declarations: [NgxMatEntityInputComponent], imports: [CommonModule,
1539
+ MatInputModule,
1540
+ FormsModule,
1541
+ MatFormFieldModule,
1542
+ MatSelectModule,
1543
+ MatAutocompleteModule,
1544
+ MatCheckboxModule,
1545
+ MatSlideToggleModule,
1546
+ MatChipsModule,
1547
+ MatIconModule,
1548
+ MatTableModule,
1549
+ MatDialogModule,
1550
+ MatButtonModule,
1551
+ MatDatepickerModule], exports: [NgxMatEntityInputComponent] });
1552
+ NgxMatEntityInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, imports: [[
1553
+ CommonModule,
1554
+ MatInputModule,
1555
+ FormsModule,
1556
+ MatFormFieldModule,
1557
+ MatSelectModule,
1558
+ MatAutocompleteModule,
1559
+ MatCheckboxModule,
1560
+ MatSlideToggleModule,
1561
+ MatChipsModule,
1562
+ MatIconModule,
1563
+ MatTableModule,
1564
+ MatDialogModule,
1565
+ MatButtonModule,
1566
+ MatDatepickerModule
1567
+ ]] });
1568
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, decorators: [{
1569
+ type: NgModule,
1570
+ args: [{
1571
+ declarations: [
1572
+ NgxMatEntityInputComponent,
1573
+ ],
1574
+ imports: [
1575
+ CommonModule,
1576
+ MatInputModule,
1577
+ FormsModule,
1578
+ MatFormFieldModule,
1579
+ MatSelectModule,
1580
+ MatAutocompleteModule,
1581
+ MatCheckboxModule,
1582
+ MatSlideToggleModule,
1583
+ MatChipsModule,
1584
+ MatIconModule,
1585
+ MatTableModule,
1586
+ MatDialogModule,
1587
+ MatButtonModule,
1588
+ MatDatepickerModule
1589
+ ],
1590
+ exports: [NgxMatEntityInputComponent]
1591
+ }]
1592
+ }] });
1593
+
1594
+ /**
1595
+ * The internal CreateEntityDialogData. Requires all default values the user can leave out.
1596
+ */
1597
+ class CreateEntityDialogDataInternal {
1598
+ constructor(entity, EntityServiceClass, createDialogData) {
1599
+ this.entity = entity;
1600
+ this.EntityServiceClass = EntityServiceClass;
1601
+ this.createDialogData = createDialogData;
1602
+ }
1603
+ }
1604
+ /**
1605
+ * The Builder for the CreateEntityDialogData. Sets default values.
1606
+ */
1607
+ class CreateEntityDialogDataBuilder extends BaseBuilder {
1608
+ constructor(data) {
1609
+ super(data);
1610
+ }
1611
+ // eslint-disable-next-line jsdoc/require-jsdoc
1612
+ generateBaseData(data) {
1613
+ const createDialogData = new CreateDialogDataBuilder(data.createDialogData).getResult();
1614
+ return new CreateEntityDialogDataInternal(data.entity, data.EntityServiceClass, createDialogData);
1615
+ }
1616
+ }
1617
+
1618
+ /**
1619
+ * The default dialog used to create new entities based on the configuration passed in the MAT_DIALOG_DATA "inputData".
1620
+ * Used by the ngx-mat-entity-table.
1621
+ *
1622
+ * It offers a lot of customization options which can be found in "CreateEntityDialogData".
1623
+ */
976
1624
  class NgxMatEntityCreateDialogComponent {
977
- constructor(data, dialogRef, injector, dialog) {
978
- this.data = data;
1625
+ constructor(inputData, dialogRef, injector, dialog) {
1626
+ this.inputData = inputData;
979
1627
  this.dialogRef = dialogRef;
980
1628
  this.injector = injector;
981
1629
  this.dialog = dialog;
@@ -983,42 +1631,31 @@ class NgxMatEntityCreateDialogComponent {
983
1631
  this.getWidth = EntityUtilities.getWidth;
984
1632
  }
985
1633
  ngOnInit() {
1634
+ this.data = new CreateEntityDialogDataBuilder(this.inputData).getResult();
986
1635
  this.dialogRef.disableClose = true;
987
- this.setEntityKeys();
1636
+ this.entityRows = EntityUtilities.getEntityRows(this.data.entity, true);
988
1637
  this.entityService = this.injector.get(this.data.EntityServiceClass);
989
1638
  }
990
- setEntityKeys() {
991
- this.entityKeys = Reflect.ownKeys(this.data.entity);
992
- const omitCreateKeys = EntityUtilities.getOmitForCreate(this.data.entity);
993
- this.entityKeys = this.entityKeys.filter((k) => !omitCreateKeys.includes(k))
994
- .sort((a, b) => EntityUtilities.compareOrder(a, b, this.data.entity));
995
- }
1639
+ /**
1640
+ * Tries add the new entity and close the dialog afterwards.
1641
+ * Also handles the confirmation if required.
1642
+ */
996
1643
  create() {
997
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
998
- if (this.data.createDialogData.createRequiresConfirmDialog === false) {
1644
+ var _a, _b;
1645
+ if (!((_a = this.data.createDialogData) === null || _a === void 0 ? void 0 : _a.createRequiresConfirmDialog)) {
999
1646
  return this.confirmCreate();
1000
1647
  }
1001
- const dialogData = {
1002
- // eslint-disable-next-line max-len
1003
- text: ((_a = this.data.createDialogData.confirmCreateDialogData) === null || _a === void 0 ? void 0 : _a.text) ? (_b = this.data.createDialogData.confirmCreateDialogData) === null || _b === void 0 ? void 0 : _b.text : ['Do you really want to create this entity?'],
1004
- type: 'default',
1005
- // eslint-disable-next-line max-len
1006
- confirmButtonLabel: ((_c = this.data.createDialogData.confirmCreateDialogData) === null || _c === void 0 ? void 0 : _c.confirmButtonLabel) ? (_d = this.data.createDialogData.confirmCreateDialogData) === null || _d === void 0 ? void 0 : _d.confirmButtonLabel : 'Create',
1007
- // eslint-disable-next-line max-len
1008
- cancelButtonLabel: ((_e = this.data.createDialogData.confirmCreateDialogData) === null || _e === void 0 ? void 0 : _e.cancelButtonLabel) ? (_f = this.data.createDialogData.confirmCreateDialogData) === null || _f === void 0 ? void 0 : _f.cancelButtonLabel : 'Cancel',
1009
- // eslint-disable-next-line max-len
1010
- title: ((_g = this.data.createDialogData.confirmCreateDialogData) === null || _g === void 0 ? void 0 : _g.title) ? (_h = this.data.createDialogData.confirmCreateDialogData) === null || _h === void 0 ? void 0 : _h.title : 'Create',
1011
- // eslint-disable-next-line max-len
1012
- requireConfirmation: ((_j = this.data.createDialogData.confirmCreateDialogData) === null || _j === void 0 ? void 0 : _j.requireConfirmation) ? (_k = this.data.createDialogData.confirmCreateDialogData) === null || _k === void 0 ? void 0 : _k.requireConfirmation : false,
1013
- // eslint-disable-next-line max-len
1014
- confirmationText: ((_l = this.data.createDialogData.confirmCreateDialogData) === null || _l === void 0 ? void 0 : _l.confirmationText) ? (_m = this.data.createDialogData.confirmCreateDialogData) === null || _m === void 0 ? void 0 : _m.confirmationText : undefined,
1015
- };
1016
- const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
1648
+ const dialogData = new ConfirmDialogDataBuilder((_b = this.data.createDialogData) === null || _b === void 0 ? void 0 : _b.confirmCreateDialogData)
1649
+ .withDefault('text', ['Do you really want to create this entity?'])
1650
+ .withDefault('confirmButtonLabel', 'Create')
1651
+ .withDefault('title', 'Create')
1652
+ .getResult();
1653
+ const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
1017
1654
  data: dialogData,
1018
1655
  autoFocus: false,
1019
1656
  restoreFocus: false
1020
1657
  });
1021
- dialogref.afterClosed().subscribe((res) => {
1658
+ dialogRef.afterClosed().subscribe((res) => {
1022
1659
  if (res === 1) {
1023
1660
  this.confirmCreate();
1024
1661
  }
@@ -1027,15 +1664,18 @@ class NgxMatEntityCreateDialogComponent {
1027
1664
  confirmCreate() {
1028
1665
  this.entityService.create(this.data.entity).then(() => this.dialogRef.close());
1029
1666
  }
1667
+ /**
1668
+ * Closes the dialog.
1669
+ */
1030
1670
  cancel() {
1031
1671
  this.dialogRef.close();
1032
1672
  }
1033
1673
  }
1034
1674
  NgxMatEntityCreateDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }, { token: i0.Injector }, { token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
1035
- NgxMatEntityCreateDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityCreateDialogComponent, selector: "ngx-mat-entity-create-dialog", ngImport: i0, template: "<h2 mat-dialog-title>{{data.createDialogData.title}}</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <ngx-mat-entity-input\n *ngFor=\"let key of entityKeys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"create()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'create')\">\n {{data.createDialogData.createButtonLabel ? data.createDialogData.createButtonLabel : 'Create'}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.createDialogData.cancelButtonLabel ? data.createDialogData.cancelButtonLabel : 'Cancel'}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}\n"], components: [{ type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i12.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i12.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i12.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
1675
+ NgxMatEntityCreateDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityCreateDialogComponent, selector: "ngx-mat-entity-create-dialog", ngImport: i0, template: "<h2 mat-dialog-title>{{data.createDialogData.title}}</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\">\n <div class=\"row\" *ngFor=\"let row of entityRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"create()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'create')\">\n {{data.createDialogData.createButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.createDialogData.cancelButtonLabel}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}\n"], components: [{ type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i14.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i14.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i14.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
1036
1676
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogComponent, decorators: [{
1037
1677
  type: Component,
1038
- args: [{ selector: 'ngx-mat-entity-create-dialog', template: "<h2 mat-dialog-title>{{data.createDialogData.title}}</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <ngx-mat-entity-input\n *ngFor=\"let key of entityKeys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"create()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'create')\">\n {{data.createDialogData.createButtonLabel ? data.createDialogData.createButtonLabel : 'Create'}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.createDialogData.cancelButtonLabel ? data.createDialogData.cancelButtonLabel : 'Cancel'}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}\n"] }]
1678
+ args: [{ selector: 'ngx-mat-entity-create-dialog', template: "<h2 mat-dialog-title>{{data.createDialogData.title}}</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\">\n <div class=\"row\" *ngFor=\"let row of entityRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"create()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'create')\">\n {{data.createDialogData.createButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.createDialogData.cancelButtonLabel}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}\n"] }]
1039
1679
  }], ctorParameters: function () {
1040
1680
  return [{ type: undefined, decorators: [{
1041
1681
  type: Inject,
@@ -1043,9 +1683,79 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
1043
1683
  }] }, { type: i1.MatDialogRef }, { type: i0.Injector }, { type: i1.MatDialog }];
1044
1684
  } });
1045
1685
 
1686
+ /**
1687
+ * The internal EditDialogData. Requires all default values the user can leave out.
1688
+ */
1689
+ class EditDialogDataInternal {
1690
+ constructor(title, confirmButtonLabel, deleteButtonLabel, cancelButtonLabel, deleteRequiresConfirmDialog, editRequiresConfirmDialog, confirmDeleteDialogData, confirmEditDialogData) {
1691
+ this.title = title;
1692
+ this.confirmButtonLabel = confirmButtonLabel;
1693
+ this.deleteButtonLabel = deleteButtonLabel;
1694
+ this.cancelButtonLabel = cancelButtonLabel;
1695
+ this.deleteRequiresConfirmDialog = deleteRequiresConfirmDialog;
1696
+ this.editRequiresConfirmDialog = editRequiresConfirmDialog;
1697
+ this.confirmDeleteDialogData = confirmDeleteDialogData;
1698
+ this.confirmEditDialogData = confirmEditDialogData;
1699
+ }
1700
+ }
1701
+ /**
1702
+ * The Builder for the EditDialogData. Sets default values.
1703
+ */
1704
+ class EditDialogDataBuilder extends BaseBuilder {
1705
+ constructor(data) {
1706
+ super(data);
1707
+ }
1708
+ // eslint-disable-next-line jsdoc/require-jsdoc
1709
+ generateBaseData(data) {
1710
+ const confirmEditDialogData = new ConfirmDialogDataBuilder(data === null || data === void 0 ? void 0 : data.confirmEditDialogData)
1711
+ .withDefault('confirmButtonLabel', 'Save')
1712
+ .withDefault('text', ['Do you really want to save all changes?'])
1713
+ .withDefault('title', 'Edit')
1714
+ .getResult();
1715
+ const confirmDeleteDialogData = new ConfirmDialogDataBuilder(data === null || data === void 0 ? void 0 : data.confirmDeleteDialogData)
1716
+ .withDefault('confirmButtonLabel', 'Delete')
1717
+ .withDefault('type', 'delete')
1718
+ .withDefault('text', ['Do you really want to delete this entity?'])
1719
+ .withDefault('title', 'Delete')
1720
+ .getResult();
1721
+ return new EditDialogDataInternal((data === null || data === void 0 ? void 0 : data.title) ? data.title : () => 'Edit', (data === null || data === void 0 ? void 0 : data.confirmButtonLabel) ? data.confirmButtonLabel : 'Save', (data === null || data === void 0 ? void 0 : data.deleteButtonLabel) ? data.deleteButtonLabel : 'Delete', (data === null || data === void 0 ? void 0 : data.cancelButtonLabel) ? data.cancelButtonLabel : 'Cancel', (data === null || data === void 0 ? void 0 : data.deleteRequiresConfirmDialog) ? data.deleteRequiresConfirmDialog : true, (data === null || data === void 0 ? void 0 : data.editRequiresConfirmDialog) ? data.editRequiresConfirmDialog : false, confirmDeleteDialogData, confirmEditDialogData);
1722
+ }
1723
+ }
1724
+
1725
+ /**
1726
+ * The internal EditEntityDialogData. Requires all default values the user can leave out.
1727
+ */
1728
+ class EditEntityDialogDataInternal {
1729
+ constructor(entity, EntityServiceClass, editDialogData, allowDelete) {
1730
+ this.entity = entity;
1731
+ this.EntityServiceClass = EntityServiceClass;
1732
+ this.editDialogData = editDialogData;
1733
+ this.allowDelete = allowDelete;
1734
+ }
1735
+ }
1736
+ /**
1737
+ * The Builder for the EditEntityDialogData. Sets default values.
1738
+ */
1739
+ class EditEntityDialogDataBuilder extends BaseBuilder {
1740
+ constructor(data) {
1741
+ super(data);
1742
+ }
1743
+ // eslint-disable-next-line jsdoc/require-jsdoc
1744
+ generateBaseData(data) {
1745
+ const editDialogData = new EditDialogDataBuilder(data.editDialogData).getResult();
1746
+ return new EditEntityDialogDataInternal(data.entity, data.EntityServiceClass, editDialogData, data.allowDelete ? data.allowDelete : () => true);
1747
+ }
1748
+ }
1749
+
1750
+ /**
1751
+ * The default dialog used to edit an existing entity based on the configuration passed in the MAT_DIALOG_DATA "inputData".
1752
+ * Used by the ngx-mat-entity-table.
1753
+ *
1754
+ * It offers a lot of customization options which can be found in "EditEntityDialogData".
1755
+ */
1046
1756
  class NgxMatEntityEditDialogComponent {
1047
- constructor(data, dialogRef, injector, dialog) {
1048
- this.data = data;
1757
+ constructor(inputData, dialogRef, injector, dialog) {
1758
+ this.inputData = inputData;
1049
1759
  this.dialogRef = dialogRef;
1050
1760
  this.injector = injector;
1051
1761
  this.dialog = dialog;
@@ -1053,42 +1763,31 @@ class NgxMatEntityEditDialogComponent {
1053
1763
  this.getWidth = EntityUtilities.getWidth;
1054
1764
  }
1055
1765
  ngOnInit() {
1766
+ this.data = new EditEntityDialogDataBuilder(this.inputData).getResult();
1056
1767
  this.dialogRef.disableClose = true;
1057
- this.setEntityKeys();
1768
+ this.entityRows = EntityUtilities.getEntityRows(this.data.entity, false, true);
1058
1769
  this.entityService = this.injector.get(this.data.EntityServiceClass);
1059
1770
  this.entityPriorChanges = cloneDeep(this.data.entity);
1060
1771
  }
1061
- setEntityKeys() {
1062
- this.entityKeys = Reflect.ownKeys(this.data.entity);
1063
- const omitUpdateKeys = EntityUtilities.getOmitForUpdate(this.data.entity);
1064
- this.entityKeys = this.entityKeys.filter((k) => !omitUpdateKeys.includes(k))
1065
- .sort((a, b) => EntityUtilities.compareOrder(a, b, this.data.entity));
1066
- }
1772
+ /**
1773
+ * Tries to save the changes and close the dialog afterwards.
1774
+ * Also handles the confirmation if required.
1775
+ */
1067
1776
  edit() {
1068
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
1069
- if (this.data.editDialogData.editRequiresConfirmDialog === false) {
1777
+ if (!this.data.editDialogData.editRequiresConfirmDialog) {
1070
1778
  return this.confirmEdit();
1071
1779
  }
1072
- const dialogData = {
1073
- // eslint-disable-next-line max-len
1074
- text: ((_a = this.data.editDialogData.confirmEditDialogData) === null || _a === void 0 ? void 0 : _a.text) ? (_b = this.data.editDialogData.confirmEditDialogData) === null || _b === void 0 ? void 0 : _b.text : ['Do you really want to save all changes?'],
1075
- type: 'default',
1076
- // eslint-disable-next-line max-len
1077
- confirmButtonLabel: ((_c = this.data.editDialogData.confirmEditDialogData) === null || _c === void 0 ? void 0 : _c.confirmButtonLabel) ? (_d = this.data.editDialogData.confirmEditDialogData) === null || _d === void 0 ? void 0 : _d.confirmButtonLabel : 'Confirm',
1078
- // eslint-disable-next-line max-len
1079
- cancelButtonLabel: ((_e = this.data.editDialogData.confirmEditDialogData) === null || _e === void 0 ? void 0 : _e.cancelButtonLabel) ? (_f = this.data.editDialogData.confirmEditDialogData) === null || _f === void 0 ? void 0 : _f.cancelButtonLabel : 'Cancel',
1080
- title: ((_g = this.data.editDialogData.confirmEditDialogData) === null || _g === void 0 ? void 0 : _g.title) ? (_h = this.data.editDialogData.confirmEditDialogData) === null || _h === void 0 ? void 0 : _h.title : 'Edit',
1081
- // eslint-disable-next-line max-len
1082
- requireConfirmation: ((_j = this.data.editDialogData.confirmEditDialogData) === null || _j === void 0 ? void 0 : _j.requireConfirmation) ? (_k = this.data.editDialogData.confirmEditDialogData) === null || _k === void 0 ? void 0 : _k.requireConfirmation : false,
1083
- // eslint-disable-next-line max-len
1084
- confirmationText: ((_l = this.data.editDialogData.confirmEditDialogData) === null || _l === void 0 ? void 0 : _l.confirmationText) ? (_m = this.data.editDialogData.confirmEditDialogData) === null || _m === void 0 ? void 0 : _m.confirmationText : undefined,
1085
- };
1086
- const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
1780
+ const dialogData = new ConfirmDialogDataBuilder(this.data.editDialogData.confirmEditDialogData)
1781
+ .withDefault('text', ['Do you really want to save all changes?'])
1782
+ .withDefault('confirmButtonLabel', 'Save')
1783
+ .withDefault('title', 'Edit')
1784
+ .getResult();
1785
+ const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
1087
1786
  data: dialogData,
1088
1787
  autoFocus: false,
1089
1788
  restoreFocus: false
1090
1789
  });
1091
- dialogref.afterClosed().subscribe((res) => {
1790
+ dialogRef.afterClosed().subscribe((res) => {
1092
1791
  if (res === 1) {
1093
1792
  this.confirmEdit();
1094
1793
  }
@@ -1097,50 +1796,47 @@ class NgxMatEntityEditDialogComponent {
1097
1796
  confirmEdit() {
1098
1797
  this.entityService.update(this.data.entity, this.entityPriorChanges).then(() => this.dialogRef.close(1));
1099
1798
  }
1799
+ /**
1800
+ * Tries to delete the entity and close the dialog afterwards.
1801
+ * Also handles the confirmation if required.
1802
+ */
1100
1803
  delete() {
1101
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
1102
- if (this.data.editDialogData.deleteRequiresConfirmDialog === false) {
1804
+ if (!this.data.editDialogData.deleteRequiresConfirmDialog) {
1103
1805
  return this.confirmDelete();
1104
1806
  }
1105
- const dialogData = {
1106
- // eslint-disable-next-line max-len
1107
- text: ((_a = this.data.editDialogData.confirmDeleteDialogData) === null || _a === void 0 ? void 0 : _a.text) ? (_b = this.data.editDialogData.confirmDeleteDialogData) === null || _b === void 0 ? void 0 : _b.text : ['Do you really want to delete this entity?'],
1108
- type: 'delete',
1109
- // eslint-disable-next-line max-len
1110
- confirmButtonLabel: ((_c = this.data.editDialogData.confirmDeleteDialogData) === null || _c === void 0 ? void 0 : _c.confirmButtonLabel) ? (_d = this.data.editDialogData.confirmDeleteDialogData) === null || _d === void 0 ? void 0 : _d.confirmButtonLabel : 'Delete',
1111
- // eslint-disable-next-line max-len
1112
- cancelButtonLabel: ((_e = this.data.editDialogData.confirmDeleteDialogData) === null || _e === void 0 ? void 0 : _e.cancelButtonLabel) ? (_f = this.data.editDialogData.confirmDeleteDialogData) === null || _f === void 0 ? void 0 : _f.cancelButtonLabel : 'Cancel',
1113
- // eslint-disable-next-line max-len
1114
- title: ((_g = this.data.editDialogData.confirmDeleteDialogData) === null || _g === void 0 ? void 0 : _g.title) ? (_h = this.data.editDialogData.confirmDeleteDialogData) === null || _h === void 0 ? void 0 : _h.title : 'Delete',
1115
- // eslint-disable-next-line max-len
1116
- requireConfirmation: ((_j = this.data.editDialogData.confirmDeleteDialogData) === null || _j === void 0 ? void 0 : _j.requireConfirmation) ? (_k = this.data.editDialogData.confirmDeleteDialogData) === null || _k === void 0 ? void 0 : _k.requireConfirmation : false,
1117
- // eslint-disable-next-line max-len
1118
- confirmationText: ((_l = this.data.editDialogData.confirmDeleteDialogData) === null || _l === void 0 ? void 0 : _l.confirmationText) ? (_m = this.data.editDialogData.confirmDeleteDialogData) === null || _m === void 0 ? void 0 : _m.confirmationText : undefined,
1119
- };
1120
- const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
1807
+ const dialogData = new ConfirmDialogDataBuilder(this.data.editDialogData.confirmDeleteDialogData)
1808
+ .withDefault('text', ['Do you really want to delete this entity?'])
1809
+ .withDefault('type', 'delete')
1810
+ .withDefault('confirmButtonLabel', 'Delete')
1811
+ .withDefault('title', 'Delete')
1812
+ .getResult();
1813
+ const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
1121
1814
  data: dialogData,
1122
1815
  autoFocus: false,
1123
1816
  restoreFocus: false
1124
1817
  });
1125
- dialogref.afterClosed().subscribe((res) => {
1818
+ dialogRef.afterClosed().subscribe((res) => {
1126
1819
  if (res === 1) {
1127
1820
  this.confirmDelete();
1128
1821
  }
1129
1822
  });
1130
1823
  }
1131
1824
  confirmDelete() {
1132
- this.entityService.delete(this.entityPriorChanges.id).then(() => this.dialogRef.close(2));
1825
+ this.entityService.delete(this.entityPriorChanges).then(() => this.dialogRef.close(2));
1133
1826
  }
1827
+ /**
1828
+ * Reverts all changes made and closes the dialog.
1829
+ */
1134
1830
  cancel() {
1135
1831
  EntityUtilities.resetChangesOnEntity(this.data.entity, this.entityPriorChanges);
1136
1832
  this.dialogRef.close(0);
1137
1833
  }
1138
1834
  }
1139
1835
  NgxMatEntityEditDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }, { token: i0.Injector }, { token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
1140
- NgxMatEntityEditDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityEditDialogComponent, selector: "ngx-mat-entity-edit-dialog", ngImport: i0, template: "<h2 mat-dialog-title>\n {{data.editDialogData.title(data.entity)}}\n <button *ngIf=\"data.allowDelete(data.entity)\" mat-raised-button (click)=\"delete()\" color=\"warn\" class=\"delete-button\" tabindex=\"-1\">\n {{data.editDialogData.deleteButtonLabel ? data.editDialogData.deleteButtonLabel : 'Delete'}}\n </button>\n</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <ngx-mat-entity-input\n *ngFor=\"let key of entityKeys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForEdit]=\"true\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"edit()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'edit') || !EntityUtilities.dirty(data.entity, entityPriorChanges)\">\n {{data.editDialogData.confirmButtonLabel ? data.editDialogData.confirmButtonLabel : 'Save'}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.editDialogData.cancelButtonLabel ? data.editDialogData.cancelButtonLabel : 'Cancel'}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}.delete-button{float:right}\n"], components: [{ type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }], directives: [{ type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i12.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i12.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i12.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
1836
+ NgxMatEntityEditDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityEditDialogComponent, selector: "ngx-mat-entity-edit-dialog", ngImport: i0, template: "<h2 mat-dialog-title>\n {{data.editDialogData.title(data.entity)}}\n <button *ngIf=\"data.allowDelete(data.entity)\" mat-raised-button (click)=\"delete()\" color=\"warn\" class=\"delete-button\" tabindex=\"-1\">\n {{data.editDialogData.deleteButtonLabel}}\n </button>\n</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <div class=\"row\" *ngFor=\"let row of entityRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForEdit]=\"true\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"edit()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'update') || !EntityUtilities.dirty(data.entity, entityPriorChanges)\">\n {{data.editDialogData.confirmButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.editDialogData.cancelButtonLabel}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}.delete-button{float:right}\n"], components: [{ type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }], directives: [{ type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i14.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i14.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i14.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
1141
1837
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogComponent, decorators: [{
1142
1838
  type: Component,
1143
- args: [{ selector: 'ngx-mat-entity-edit-dialog', template: "<h2 mat-dialog-title>\n {{data.editDialogData.title(data.entity)}}\n <button *ngIf=\"data.allowDelete(data.entity)\" mat-raised-button (click)=\"delete()\" color=\"warn\" class=\"delete-button\" tabindex=\"-1\">\n {{data.editDialogData.deleteButtonLabel ? data.editDialogData.deleteButtonLabel : 'Delete'}}\n </button>\n</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <ngx-mat-entity-input\n *ngFor=\"let key of entityKeys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForEdit]=\"true\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"edit()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'edit') || !EntityUtilities.dirty(data.entity, entityPriorChanges)\">\n {{data.editDialogData.confirmButtonLabel ? data.editDialogData.confirmButtonLabel : 'Save'}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.editDialogData.cancelButtonLabel ? data.editDialogData.cancelButtonLabel : 'Cancel'}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}.delete-button{float:right}\n"] }]
1839
+ args: [{ selector: 'ngx-mat-entity-edit-dialog', template: "<h2 mat-dialog-title>\n {{data.editDialogData.title(data.entity)}}\n <button *ngIf=\"data.allowDelete(data.entity)\" mat-raised-button (click)=\"delete()\" color=\"warn\" class=\"delete-button\" tabindex=\"-1\">\n {{data.editDialogData.deleteButtonLabel}}\n </button>\n</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <div class=\"row\" *ngFor=\"let row of entityRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForEdit]=\"true\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"edit()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'update') || !EntityUtilities.dirty(data.entity, entityPriorChanges)\">\n {{data.editDialogData.confirmButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.editDialogData.cancelButtonLabel}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}.delete-button{float:right}\n"] }]
1144
1840
  }], ctorParameters: function () {
1145
1841
  return [{ type: undefined, decorators: [{
1146
1842
  type: Inject,
@@ -1148,6 +1844,115 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
1148
1844
  }] }, { type: i1.MatDialogRef }, { type: i0.Injector }, { type: i1.MatDialog }];
1149
1845
  } });
1150
1846
 
1847
+ /**
1848
+ * The internal TableData. Requires all default values the user can leave out.
1849
+ */
1850
+ class TableDataInternal {
1851
+ constructor(baseData, createDialogData, editDialogData) {
1852
+ this.baseData = baseData;
1853
+ this.createDialogData = createDialogData;
1854
+ this.editDialogData = editDialogData;
1855
+ }
1856
+ }
1857
+ /**
1858
+ * The Builder for the table BaseData. Sets default values.
1859
+ */
1860
+ class BaseDataBuilder extends BaseBuilder {
1861
+ constructor(data) {
1862
+ super(data);
1863
+ }
1864
+ // eslint-disable-next-line jsdoc/require-jsdoc
1865
+ generateBaseData(data) {
1866
+ return new BaseDataInternal(data.title, data.displayColumns, data.EntityServiceClass, data.searchLabel ? data.searchLabel : 'Search', data.createButtonLabel ? data.createButtonLabel : 'Create', data.searchString ? data.searchString : defaultSearchFunction, data.allowCreate === false ? data.allowCreate : true, data.allowEdit ? data.allowEdit : () => true, data.allowDelete ? data.allowDelete : () => true, data.multiSelectActions ? data.multiSelectActions : [], data.multiSelectLabel ? data.multiSelectLabel : 'Actions', data.EntityClass, data.edit, data.create);
1867
+ }
1868
+ }
1869
+ /**
1870
+ * The internal TableData. Requires all default values the user can leave out.
1871
+ */
1872
+ class BaseDataInternal {
1873
+ constructor(title, displayColumns, EntityServiceClass, searchLabel, createButtonLabel, searchString, allowCreate, allowEdit, allowDelete, multiSelectActions, multiSelectLabel, EntityClass, edit, create) {
1874
+ this.title = title;
1875
+ this.displayColumns = displayColumns;
1876
+ this.EntityServiceClass = EntityServiceClass;
1877
+ this.EntityClass = EntityClass;
1878
+ this.searchLabel = searchLabel;
1879
+ this.createButtonLabel = createButtonLabel;
1880
+ this.searchString = searchString;
1881
+ this.allowCreate = allowCreate;
1882
+ this.allowEdit = allowEdit;
1883
+ this.allowDelete = allowDelete;
1884
+ this.multiSelectActions = multiSelectActions;
1885
+ this.multiSelectLabel = multiSelectLabel;
1886
+ this.edit = edit;
1887
+ this.create = create;
1888
+ }
1889
+ }
1890
+ /**
1891
+ * The Builder for the complete TableData. Sets default values and validates user input.
1892
+ */
1893
+ class TableDataBuilder extends BaseBuilder {
1894
+ constructor(data) {
1895
+ super(data);
1896
+ }
1897
+ // eslint-disable-next-line jsdoc/require-jsdoc
1898
+ generateBaseData(data) {
1899
+ const createDialogData = new CreateDialogDataBuilder(data.createDialogData).getResult();
1900
+ const editDialogData = new EditDialogDataBuilder(data.editDialogData).getResult();
1901
+ const baseData = new BaseDataBuilder(data.baseData).getResult();
1902
+ return new TableDataInternal(baseData, createDialogData, editDialogData);
1903
+ }
1904
+ // eslint-disable-next-line jsdoc/require-jsdoc
1905
+ validateInput(data) {
1906
+ var _a;
1907
+ if (((_a = data.baseData.multiSelectActions) === null || _a === void 0 ? void 0 : _a.length) && data.baseData.displayColumns.find(dp => dp.displayName === 'select')) {
1908
+ throw new Error(`The name "select" for a display column is reserved for the multi-select action functionality.
1909
+ Please choose a different name.`);
1910
+ }
1911
+ if ((data.baseData.allowEdit && data.baseData.allowEdit !== (() => false)
1912
+ || data.baseData.allowDelete && data.baseData.allowDelete !== (() => false)
1913
+ || data.baseData.allowCreate)
1914
+ && !data.baseData.EntityClass) {
1915
+ throw new Error(`
1916
+ Missing required Input data "EntityClass".
1917
+ You can only omit this value if you can neither create or update entities.`);
1918
+ }
1919
+ if (data.baseData.allowCreate !== false && !data.baseData.create && !data.createDialogData) {
1920
+ throw new Error(`Missing required Input data "createDialogData".
1921
+ You can only omit this value when creation is disallowed or done with a custom create method.`);
1922
+ }
1923
+ if ((data.baseData.allowEdit !== (() => false)
1924
+ || data.baseData.allowDelete !== (() => false))
1925
+ && !data.baseData.edit
1926
+ && !data.editDialogData) {
1927
+ throw new Error(`Missing required Input data "editDialogData".
1928
+ You can only omit this value when editing and deleting is disallowed or done with a custom edit method.`);
1929
+ }
1930
+ }
1931
+ }
1932
+ /**
1933
+ * The default search function taken from googles mat table.
1934
+ * This will be used if no custom search function is provided by the configuration.
1935
+ *
1936
+ * It generates a string from an entity which is then used to compare it to the search input.
1937
+ *
1938
+ * @param entity - An entity that is in the search.
1939
+ * @returns The generated string of the given entity used for comparison with the search input.
1940
+ */
1941
+ function defaultSearchFunction(entity) {
1942
+ const searchString = Object.keys(entity)
1943
+ .reduce((currentTerm, key) => {
1944
+ return `${currentTerm}${entity[key]}◬`;
1945
+ }, '')
1946
+ .toLowerCase();
1947
+ return searchString;
1948
+ }
1949
+
1950
+ /**
1951
+ * Generates a fully functional table for displaying, creating, updating and deleting entities
1952
+ * based on the configuration passed in the @Input "tableData".
1953
+ *
1954
+ * It offers a lot of customization options which can be found in "TableData".
1955
+ */
1151
1956
  class NgxMatEntityTableComponent {
1152
1957
  constructor(dialog, injector) {
1153
1958
  this.dialog = dialog;
@@ -1156,16 +1961,14 @@ class NgxMatEntityTableComponent {
1156
1961
  this.dataSource = new MatTableDataSource();
1157
1962
  this.selection = new SelectionModel(true, []);
1158
1963
  }
1964
+ /**
1965
+ * Sets up all the configuration for the table and the EntityService.
1966
+ */
1159
1967
  ngOnInit() {
1160
- var _a;
1161
- this.validateInput();
1162
- this.entityService = this.injector.get(this.entitiesData.baseData.EntityServiceClass);
1163
- const givenDisplayColumns = this.entitiesData.baseData.displayColumns.map((v) => v.displayName);
1164
- if ((_a = this.entitiesData.baseData.multiSelectActions) === null || _a === void 0 ? void 0 : _a.length) {
1165
- if (givenDisplayColumns.find((s) => s === 'select')) {
1166
- throw new Error(`The name "select" for a display column is reserved for the multi-select action functionality.
1167
- Please choose a different name.`);
1168
- }
1968
+ this.data = new TableDataBuilder(this.tableData).getResult();
1969
+ this.entityService = this.injector.get(this.data.baseData.EntityServiceClass);
1970
+ const givenDisplayColumns = this.data.baseData.displayColumns.map((v) => v.displayName);
1971
+ if (this.data.baseData.multiSelectActions.length) {
1169
1972
  this.displayedColumns = ['select'].concat(givenDisplayColumns);
1170
1973
  }
1171
1974
  else {
@@ -1173,83 +1976,52 @@ class NgxMatEntityTableComponent {
1173
1976
  }
1174
1977
  this.dataSource.sortingDataAccessor = (entity, header) => {
1175
1978
  var _a;
1176
- return (_a = this.entitiesData.baseData.displayColumns.find((dp) => dp.displayName === header)) === null || _a === void 0 ? void 0 : _a.value(entity);
1979
+ return (_a = this.data.baseData.displayColumns.find((dp) => dp.displayName === header)) === null || _a === void 0 ? void 0 : _a.value(entity);
1177
1980
  };
1178
1981
  this.dataSource.sort = this.sort;
1179
- if (this.entitiesData.baseData.searchString) {
1180
- this.dataSource.filterPredicate = (entity, filter) => {
1181
- var _a, _b;
1182
- const searchStr = (_b = (_a = this.entitiesData.baseData).searchString) === null || _b === void 0 ? void 0 : _b.call(_a, entity);
1183
- const formattedSearchString = searchStr.toLowerCase();
1184
- const formattedFilterString = filter.toLowerCase();
1185
- return formattedSearchString.includes(formattedFilterString);
1186
- };
1187
- }
1188
- this.dataSource.filter = this.filter;
1189
- this.dataSource.paginator = this.paginator;
1190
- this.entityService.entitiesSubject.pipe(takeUntil(this.onDestroy)).subscribe((entities) => {
1191
- this.dataSource.data = entities;
1192
- this.selection.clear();
1193
- });
1194
- this.entityService.read();
1195
- }
1196
- validateInput() {
1197
- if (!this.entitiesData.baseData.displayColumns) {
1198
- throw new Error('Missing required Input data "displayColumns"');
1199
- }
1200
- if (!this.entitiesData.baseData.title) {
1201
- throw new Error('Missing required Input data "title"');
1202
- }
1203
- if (!this.entitiesData.baseData.EntityServiceClass) {
1204
- throw new Error('Missing required Input data "EntityServiceClass"');
1205
- }
1206
- if (this.entitiesData.baseData.allowCreate === undefined) {
1207
- this.entitiesData.baseData.allowCreate = true;
1208
- }
1209
- if (this.entitiesData.baseData.allowEdit === undefined) {
1210
- this.entitiesData.baseData.allowEdit = () => true;
1211
- }
1212
- if (this.entitiesData.baseData.allowDelete === undefined) {
1213
- this.entitiesData.baseData.allowDelete = () => true;
1214
- }
1215
- if ((this.entitiesData.baseData.allowEdit !== (() => false)
1216
- || this.entitiesData.baseData.allowDelete !== (() => false)
1217
- || this.entitiesData.baseData.allowCreate)
1218
- && !this.entitiesData.baseData.EntityClass) {
1219
- throw new Error(`
1220
- Missing required Input data "EntityClass".
1221
- You can only omit this value if you can neither create or update entities.`);
1222
- }
1223
- if (this.entitiesData.baseData.allowCreate && !this.entitiesData.baseData.create && !this.entitiesData.createDialogData) {
1224
- throw new Error(`Missing required Input data "createDialogData".
1225
- You can only omit this value when creation is disallowed or done with a custom create method.`);
1226
- }
1227
- if ((this.entitiesData.baseData.allowEdit !== (() => false)
1228
- || this.entitiesData.baseData.allowDelete !== (() => false))
1229
- && !this.entitiesData.baseData.edit
1230
- && !this.entitiesData.editDialogData) {
1231
- throw new Error(`Missing required Input data "editDialogData".
1232
- You can only omit this value when editing and deleting is disallowed or done with a custom edit method.`);
1982
+ if (this.data.baseData.searchString) {
1983
+ this.dataSource.filterPredicate = (entity, filter) => {
1984
+ const searchStr = this.data.baseData.searchString(entity);
1985
+ const formattedSearchString = searchStr.toLowerCase();
1986
+ const formattedFilterString = filter.toLowerCase();
1987
+ return formattedSearchString.includes(formattedFilterString);
1988
+ };
1233
1989
  }
1990
+ this.dataSource.filter = this.filter;
1991
+ this.dataSource.paginator = this.paginator;
1992
+ this.entityService.entitiesSubject.pipe(takeUntil(this.onDestroy)).subscribe((entities) => {
1993
+ this.dataSource.data = entities;
1994
+ this.selection.clear();
1995
+ });
1996
+ this.entityService.read();
1234
1997
  }
1998
+ /**
1999
+ * Edits an entity. This either calls the edit-Method provided by the user or uses a default edit-dialog.
2000
+ *
2001
+ * @param entity - The entity that should be updated.
2002
+ * @throws When no EntityClass was provided, as a new call is needed to initialize metadata.
2003
+ */
1235
2004
  editEntity(entity) {
1236
- var _a, _b;
1237
- if ((_b = (_a = this.entitiesData.baseData).allowEdit) === null || _b === void 0 ? void 0 : _b.call(_a, entity)) {
1238
- if (this.entitiesData.baseData.edit) {
1239
- this.entitiesData.baseData.edit(new this.entitiesData.baseData.EntityClass(entity));
2005
+ if (this.data.baseData.allowEdit(entity)) {
2006
+ if (!this.data.baseData.EntityClass) {
2007
+ throw new Error('No "EntityClass" specified for this table');
2008
+ }
2009
+ if (this.data.baseData.edit) {
2010
+ this.data.baseData.edit(new this.data.baseData.EntityClass(entity));
1240
2011
  }
1241
2012
  else {
1242
- this.editDefault(new this.entitiesData.baseData.EntityClass(entity));
2013
+ this.editDefault(new this.data.baseData.EntityClass(entity));
1243
2014
  }
1244
2015
  }
1245
2016
  }
1246
2017
  editDefault(entity) {
1247
- const dialogData = {
2018
+ const inputDialogData = {
1248
2019
  entity: entity,
1249
- EntityServiceClass: this.entitiesData.baseData.EntityServiceClass,
1250
- allowDelete: this.entitiesData.baseData.allowDelete,
1251
- editDialogData: this.entitiesData.editDialogData
2020
+ EntityServiceClass: this.data.baseData.EntityServiceClass,
2021
+ allowDelete: this.data.baseData.allowDelete,
2022
+ editDialogData: this.data.editDialogData
1252
2023
  };
2024
+ const dialogData = new EditEntityDialogDataBuilder(inputDialogData).getResult();
1253
2025
  firstValueFrom(this.dialog.open(NgxMatEntityEditDialogComponent, {
1254
2026
  data: dialogData,
1255
2027
  minWidth: '60%',
@@ -1258,28 +2030,36 @@ class NgxMatEntityTableComponent {
1258
2030
  }).afterClosed()).then((res) => {
1259
2031
  if (res === 0) {
1260
2032
  const data = this.dataSource.data;
1261
- data[this.dataSource.data.findIndex((e) => e.id === entity.id)] = entity;
2033
+ data[this.dataSource.data.findIndex((e) => e[this.entityService.idKey] === entity[this.entityService.idKey])] = entity;
1262
2034
  this.dataSource.data = data;
1263
2035
  this.selection.clear();
1264
2036
  }
1265
2037
  });
1266
2038
  }
2039
+ /**
2040
+ * Creates a new Entity. This either calls the create-Method provided by the user or uses a default create-dialog.
2041
+ *
2042
+ * @throws When no EntityClass was provided, as a new call is needed to initialize metadata.
2043
+ */
1267
2044
  createEntity() {
1268
- if (this.entitiesData.baseData.allowCreate) {
1269
- if (this.entitiesData.baseData.create) {
1270
- this.entitiesData.baseData.create(new this.entitiesData.baseData.EntityClass());
2045
+ if (this.data.baseData.allowCreate) {
2046
+ if (!this.data.baseData.EntityClass) {
2047
+ throw new Error('No "EntityClass" specified for this table');
2048
+ }
2049
+ if (this.data.baseData.create) {
2050
+ this.data.baseData.create(new this.data.baseData.EntityClass());
1271
2051
  }
1272
2052
  else {
1273
- this.createDefault(new this.entitiesData.baseData.EntityClass());
2053
+ this.createDefault(new this.data.baseData.EntityClass());
1274
2054
  }
1275
2055
  }
1276
2056
  }
1277
2057
  createDefault(entity) {
1278
- const dialogData = {
2058
+ const dialogData = new CreateEntityDialogDataBuilder({
1279
2059
  entity: entity,
1280
- EntityServiceClass: this.entitiesData.baseData.EntityServiceClass,
1281
- createDialogData: this.entitiesData.createDialogData
1282
- };
2060
+ EntityServiceClass: this.data.baseData.EntityServiceClass,
2061
+ createDialogData: this.data.createDialogData
2062
+ }).getResult();
1283
2063
  this.dialog.open(NgxMatEntityCreateDialogComponent, {
1284
2064
  data: dialogData,
1285
2065
  minWidth: '60%',
@@ -1287,27 +2067,26 @@ class NgxMatEntityTableComponent {
1287
2067
  restoreFocus: false
1288
2068
  });
1289
2069
  }
2070
+ /**
2071
+ * Runs the MultiAction for all selected entries.
2072
+ * Also handles confirmation with an additional dialog if configured.
2073
+ *
2074
+ * @param action - The MultiAction to run.
2075
+ */
1290
2076
  runMultiAction(action) {
1291
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
1292
2077
  if (!action.requireConfirmDialog || !action.requireConfirmDialog(this.selection.selected)) {
1293
2078
  return this.confirmRunMultiAction(action);
1294
2079
  }
1295
- const dialogData = {
1296
- // eslint-disable-next-line max-len
1297
- text: ((_a = action.confirmDialogData) === null || _a === void 0 ? void 0 : _a.text) ? (_b = action.confirmDialogData) === null || _b === void 0 ? void 0 : _b.text : [`Do you really want to run this action on ${this.selection.selected.length} entries?`],
1298
- type: 'default',
1299
- confirmButtonLabel: ((_c = action.confirmDialogData) === null || _c === void 0 ? void 0 : _c.confirmButtonLabel) ? (_d = action.confirmDialogData) === null || _d === void 0 ? void 0 : _d.confirmButtonLabel : 'Confirm',
1300
- cancelButtonLabel: ((_e = action.confirmDialogData) === null || _e === void 0 ? void 0 : _e.cancelButtonLabel) ? (_f = action.confirmDialogData) === null || _f === void 0 ? void 0 : _f.cancelButtonLabel : 'Cancel',
1301
- title: ((_g = action.confirmDialogData) === null || _g === void 0 ? void 0 : _g.title) ? (_h = action.confirmDialogData) === null || _h === void 0 ? void 0 : _h.title : action.displayName,
1302
- requireConfirmation: ((_j = action.confirmDialogData) === null || _j === void 0 ? void 0 : _j.requireConfirmation) ? (_k = action.confirmDialogData) === null || _k === void 0 ? void 0 : _k.requireConfirmation : false,
1303
- confirmationText: ((_l = action.confirmDialogData) === null || _l === void 0 ? void 0 : _l.confirmationText) ? (_m = action.confirmDialogData) === null || _m === void 0 ? void 0 : _m.confirmationText : undefined
1304
- };
1305
- const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
2080
+ const dialogData = new ConfirmDialogDataBuilder(action.confirmDialogData)
2081
+ .withDefault('text', [`Do you really want to run this action on ${this.selection.selected.length} entries?`])
2082
+ .withDefault('title', action.displayName)
2083
+ .getResult();
2084
+ const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
1306
2085
  data: dialogData,
1307
2086
  autoFocus: false,
1308
2087
  restoreFocus: false
1309
2088
  });
1310
- dialogref.afterClosed().subscribe((res) => {
2089
+ dialogRef.afterClosed().subscribe((res) => {
1311
2090
  if (res === 1) {
1312
2091
  this.confirmRunMultiAction(action);
1313
2092
  }
@@ -1316,6 +2095,12 @@ class NgxMatEntityTableComponent {
1316
2095
  confirmRunMultiAction(action) {
1317
2096
  action.action(this.selection.selected);
1318
2097
  }
2098
+ /**
2099
+ * Checks if an MultiAction is disabled (e.g. Because no entries have been selected).
2100
+ *
2101
+ * @param action - The MultiAction to check.
2102
+ * @returns Whether or not the Action can be used.
2103
+ */
1319
2104
  multiActionDisabled(action) {
1320
2105
  var _a;
1321
2106
  if (!this.selection.selected.length) {
@@ -1326,6 +2111,9 @@ class NgxMatEntityTableComponent {
1326
2111
  }
1327
2112
  return false;
1328
2113
  }
2114
+ /**
2115
+ * Toggles all entries in the table.
2116
+ */
1329
2117
  masterToggle() {
1330
2118
  if (this.isAllSelected()) {
1331
2119
  this.selection.clear();
@@ -1334,6 +2122,12 @@ class NgxMatEntityTableComponent {
1334
2122
  this.dataSource.data.forEach((row) => this.selection.select(row));
1335
2123
  }
1336
2124
  }
2125
+ /**
2126
+ * Checks if all entries in the table have been selected.
2127
+ * This is needed to display the "masterToggle"-checkbox correctly.
2128
+ *
2129
+ * @returns Whether or not all entries in the table have been selected.
2130
+ */
1337
2131
  isAllSelected() {
1338
2132
  const numSelected = this.selection.selected.length;
1339
2133
  const numRows = this.dataSource.data.length;
@@ -1343,17 +2137,22 @@ class NgxMatEntityTableComponent {
1343
2137
  this.onDestroy.next(undefined);
1344
2138
  this.onDestroy.complete();
1345
2139
  }
2140
+ /**
2141
+ * Applies the search input to filter the table entries.
2142
+ *
2143
+ * @param event - The keyup-event which contains the search-string of the user.
2144
+ */
1346
2145
  applyFilter(event) {
1347
2146
  const filterValue = event.target.value;
1348
2147
  this.dataSource.filter = filterValue.trim().toLowerCase();
1349
2148
  }
1350
2149
  }
1351
2150
  NgxMatEntityTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableComponent, deps: [{ token: i1.MatDialog }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
1352
- NgxMatEntityTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityTableComponent, selector: "ngx-mat-entity-table", inputs: { entitiesData: "entitiesData" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }, { propertyName: "filter", first: true, predicate: ["filter"], descendants: true, static: true }], ngImport: i0, template: "<h1 class=\"title\">{{entitiesData.baseData.title}}</h1>\n\n<div class=\"row\">\n <mat-form-field class=\"col-lg-8 col-md-6 col-sm-12\">\n <mat-label>{{entitiesData.baseData.searchLabel ? entitiesData.baseData.searchLabel : 'Search'}}</mat-label>\n <input matInput (keyup)=\"applyFilter($event)\" />\n </mat-form-field>\n <div\n *ngIf=\"entitiesData.baseData.multiSelectActions?.length\"\n [class.col-lg-2]=\"entitiesData.baseData.allowCreate\"\n [class.col-lg-4]=\"!entitiesData.baseData.allowCreate\"\n [class.col-md-3]=\"entitiesData.baseData.allowCreate\"\n [class.col-md-6]=\"!entitiesData.baseData.allowCreate\"\n [class.col-sm-6]=\"entitiesData.baseData.allowCreate\"\n [class.col-sm-12]=\"!entitiesData.baseData.allowCreate\"\n >\n <button class=\"actions-button\" [matMenuTriggerFor]=\"menu\" mat-raised-button>\n {{entitiesData.baseData.multiSelectLabel ? entitiesData.baseData.multiSelectLabel : 'Actions'}}\n </button>\n </div>\n <mat-menu #menu=\"matMenu\">\n <button *ngFor=\"let action of entitiesData.baseData.multiSelectActions\" [disabled]=\"multiActionDisabled(action)\" (click)=\"runMultiAction(action)\" mat-menu-item>\n {{action.displayName}}\n </button>\n </mat-menu>\n\n <div\n *ngIf=\"entitiesData.baseData.allowCreate\"\n [class.col-lg-2]=\"entitiesData.baseData.multiSelectActions?.length\"\n [class.col-lg-4]=\"!entitiesData.baseData.multiSelectActions?.length\"\n [class.col-md-3]=\"entitiesData.baseData.multiSelectActions?.length\"\n [class.col-md-6]=\"!entitiesData.baseData.multiSelectActions?.length\"\n [class.col-sm-6]=\"entitiesData.baseData.multiSelectActions?.length\"\n [class.col-sm-12]=\"!entitiesData.baseData.multiSelectActions?.length\"\n >\n <button class=\"create-button\" (click)=\"createEntity()\" mat-raised-button>\n {{entitiesData.baseData.createButtonLabel ? entitiesData.baseData.createButtonLabel : 'Create'}}\n </button>\n </div>\n</div>\n\n<div class=\"mat-elevation-z8\">\n <mat-table *ngIf=\"dataSource\" [dataSource]=\"dataSource\" matSort>\n <!-- select Column -->\n <ng-container matColumnDef=\"select\">\n <mat-header-cell *matHeaderCellDef>\n <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"> </mat-checkbox>\n </mat-header-cell>\n <mat-cell *matCellDef=\"let module\" class=\"module\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"> </mat-checkbox>\n </mat-cell>\n </ng-container>\n\n <ng-container *ngFor=\"let dCol of entitiesData.baseData.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n <mat-header-cell *matHeaderCellDef mat-sort-header>\n {{dCol.displayName}}\n </mat-header-cell>\n <mat-cell class=\"entity\" [class.enabled]=\"entitiesData.baseData.allowEdit?.(entity)\" (click)=\"editEntity(entity)\" *matCellDef=\"let entity\">\n {{dCol.value(entity)}}\n </mat-cell>\n </ng-container>\n\n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n </mat-table>\n\n <mat-paginator *ngIf=\"dataSource\" id=\"paginator\" [length]=\"dataSource.filteredData.length\" [pageIndex]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 50]\"> </mat-paginator>\n</div>\n", styles: [".title{text-align:center}button{width:100%}.mat-column-select{flex:0 0 75px}.enabled:hover{cursor:pointer}@media (max-width: 767px){.actions-button{margin-bottom:15px}}@media (max-width: 575px){.create-button{margin-bottom:15px}}\n"], components: [{ type: i1$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i4$2.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i4$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: i4$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i4$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i4$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { type: i7$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }], directives: [{ type: i1$1.MatLabel, selector: "mat-label" }, { type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i4$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i4$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i4$1.MatCellDef, selector: "[matCellDef]" }, { type: i4$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i4$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i4$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }] });
2151
+ NgxMatEntityTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityTableComponent, selector: "ngx-mat-entity-table", inputs: { tableData: "tableData" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }, { propertyName: "filter", first: true, predicate: ["filter"], descendants: true, static: true }], ngImport: i0, template: "<h1 class=\"title\">{{data.baseData.title}}</h1>\n\n<div class=\"row\">\n <mat-form-field class=\"col-lg-8 col-md-6 col-sm-12\">\n <mat-label>{{data.baseData.searchLabel}}</mat-label>\n <input matInput (keyup)=\"applyFilter($event)\" />\n </mat-form-field>\n <div\n *ngIf=\"data.baseData.multiSelectActions.length\"\n [class.col-lg-2]=\"data.baseData.allowCreate\"\n [class.col-lg-4]=\"!data.baseData.allowCreate\"\n [class.col-md-3]=\"data.baseData.allowCreate\"\n [class.col-md-6]=\"!data.baseData.allowCreate\"\n [class.col-sm-6]=\"data.baseData.allowCreate\"\n [class.col-sm-12]=\"!data.baseData.allowCreate\"\n >\n <button class=\"actions-button\" [matMenuTriggerFor]=\"menu\" mat-raised-button>\n {{data.baseData.multiSelectLabel}}\n </button>\n </div>\n <mat-menu #menu=\"matMenu\">\n <button *ngFor=\"let action of data.baseData.multiSelectActions\" [disabled]=\"multiActionDisabled(action)\" (click)=\"runMultiAction(action)\" mat-menu-item>\n {{action.displayName}}\n </button>\n </mat-menu>\n\n <div\n *ngIf=\"data.baseData.allowCreate\"\n [class.col-lg-2]=\"data.baseData.multiSelectActions.length\"\n [class.col-lg-4]=\"!data.baseData.multiSelectActions.length\"\n [class.col-md-3]=\"data.baseData.multiSelectActions.length\"\n [class.col-md-6]=\"!data.baseData.multiSelectActions.length\"\n [class.col-sm-6]=\"data.baseData.multiSelectActions.length\"\n [class.col-sm-12]=\"!data.baseData.multiSelectActions.length\"\n >\n <button class=\"create-button\" (click)=\"createEntity()\" mat-raised-button>\n {{data.baseData.createButtonLabel}}\n </button>\n </div>\n</div>\n\n<div class=\"mat-elevation-z8\">\n <mat-table *ngIf=\"dataSource\" [dataSource]=\"dataSource\" matSort>\n <!-- select Column -->\n <ng-container matColumnDef=\"select\">\n <mat-header-cell *matHeaderCellDef>\n <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"> </mat-checkbox>\n </mat-header-cell>\n <mat-cell *matCellDef=\"let module\" class=\"module\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"> </mat-checkbox>\n </mat-cell>\n </ng-container>\n\n <ng-container *ngFor=\"let dCol of data.baseData.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n <mat-header-cell *matHeaderCellDef mat-sort-header>\n {{dCol.displayName}}\n </mat-header-cell>\n <mat-cell class=\"entity\" [class.enabled]=\"data.baseData.allowEdit(entity)\" (click)=\"editEntity(entity)\" *matCellDef=\"let entity\">\n {{dCol.value(entity)}}\n </mat-cell>\n </ng-container>\n\n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n </mat-table>\n\n <mat-paginator *ngIf=\"dataSource\" id=\"paginator\" [length]=\"dataSource.filteredData.length\" [pageIndex]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 50]\"> </mat-paginator>\n</div>\n", styles: [".title{text-align:center}button{width:100%}.mat-column-select{flex:0 0 75px}.enabled:hover{cursor:pointer}@media (max-width: 767px){.actions-button,.create-button{margin-bottom:15px}}\n"], components: [{ type: i2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i4$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i4$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: i9.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i6.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i9.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i9.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { type: i7$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }], directives: [{ type: i2.MatLabel, selector: "mat-label" }, { type: i13.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i9.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i9.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i9.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i9.MatCellDef, selector: "[matCellDef]" }, { type: i9.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i9.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i9.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }] });
1353
2152
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableComponent, decorators: [{
1354
2153
  type: Component,
1355
- args: [{ selector: 'ngx-mat-entity-table', template: "<h1 class=\"title\">{{entitiesData.baseData.title}}</h1>\n\n<div class=\"row\">\n <mat-form-field class=\"col-lg-8 col-md-6 col-sm-12\">\n <mat-label>{{entitiesData.baseData.searchLabel ? entitiesData.baseData.searchLabel : 'Search'}}</mat-label>\n <input matInput (keyup)=\"applyFilter($event)\" />\n </mat-form-field>\n <div\n *ngIf=\"entitiesData.baseData.multiSelectActions?.length\"\n [class.col-lg-2]=\"entitiesData.baseData.allowCreate\"\n [class.col-lg-4]=\"!entitiesData.baseData.allowCreate\"\n [class.col-md-3]=\"entitiesData.baseData.allowCreate\"\n [class.col-md-6]=\"!entitiesData.baseData.allowCreate\"\n [class.col-sm-6]=\"entitiesData.baseData.allowCreate\"\n [class.col-sm-12]=\"!entitiesData.baseData.allowCreate\"\n >\n <button class=\"actions-button\" [matMenuTriggerFor]=\"menu\" mat-raised-button>\n {{entitiesData.baseData.multiSelectLabel ? entitiesData.baseData.multiSelectLabel : 'Actions'}}\n </button>\n </div>\n <mat-menu #menu=\"matMenu\">\n <button *ngFor=\"let action of entitiesData.baseData.multiSelectActions\" [disabled]=\"multiActionDisabled(action)\" (click)=\"runMultiAction(action)\" mat-menu-item>\n {{action.displayName}}\n </button>\n </mat-menu>\n\n <div\n *ngIf=\"entitiesData.baseData.allowCreate\"\n [class.col-lg-2]=\"entitiesData.baseData.multiSelectActions?.length\"\n [class.col-lg-4]=\"!entitiesData.baseData.multiSelectActions?.length\"\n [class.col-md-3]=\"entitiesData.baseData.multiSelectActions?.length\"\n [class.col-md-6]=\"!entitiesData.baseData.multiSelectActions?.length\"\n [class.col-sm-6]=\"entitiesData.baseData.multiSelectActions?.length\"\n [class.col-sm-12]=\"!entitiesData.baseData.multiSelectActions?.length\"\n >\n <button class=\"create-button\" (click)=\"createEntity()\" mat-raised-button>\n {{entitiesData.baseData.createButtonLabel ? entitiesData.baseData.createButtonLabel : 'Create'}}\n </button>\n </div>\n</div>\n\n<div class=\"mat-elevation-z8\">\n <mat-table *ngIf=\"dataSource\" [dataSource]=\"dataSource\" matSort>\n <!-- select Column -->\n <ng-container matColumnDef=\"select\">\n <mat-header-cell *matHeaderCellDef>\n <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"> </mat-checkbox>\n </mat-header-cell>\n <mat-cell *matCellDef=\"let module\" class=\"module\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"> </mat-checkbox>\n </mat-cell>\n </ng-container>\n\n <ng-container *ngFor=\"let dCol of entitiesData.baseData.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n <mat-header-cell *matHeaderCellDef mat-sort-header>\n {{dCol.displayName}}\n </mat-header-cell>\n <mat-cell class=\"entity\" [class.enabled]=\"entitiesData.baseData.allowEdit?.(entity)\" (click)=\"editEntity(entity)\" *matCellDef=\"let entity\">\n {{dCol.value(entity)}}\n </mat-cell>\n </ng-container>\n\n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n </mat-table>\n\n <mat-paginator *ngIf=\"dataSource\" id=\"paginator\" [length]=\"dataSource.filteredData.length\" [pageIndex]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 50]\"> </mat-paginator>\n</div>\n", styles: [".title{text-align:center}button{width:100%}.mat-column-select{flex:0 0 75px}.enabled:hover{cursor:pointer}@media (max-width: 767px){.actions-button{margin-bottom:15px}}@media (max-width: 575px){.create-button{margin-bottom:15px}}\n"] }]
1356
- }], ctorParameters: function () { return [{ type: i1.MatDialog }, { type: i0.Injector }]; }, propDecorators: { entitiesData: [{
2154
+ args: [{ selector: 'ngx-mat-entity-table', template: "<h1 class=\"title\">{{data.baseData.title}}</h1>\n\n<div class=\"row\">\n <mat-form-field class=\"col-lg-8 col-md-6 col-sm-12\">\n <mat-label>{{data.baseData.searchLabel}}</mat-label>\n <input matInput (keyup)=\"applyFilter($event)\" />\n </mat-form-field>\n <div\n *ngIf=\"data.baseData.multiSelectActions.length\"\n [class.col-lg-2]=\"data.baseData.allowCreate\"\n [class.col-lg-4]=\"!data.baseData.allowCreate\"\n [class.col-md-3]=\"data.baseData.allowCreate\"\n [class.col-md-6]=\"!data.baseData.allowCreate\"\n [class.col-sm-6]=\"data.baseData.allowCreate\"\n [class.col-sm-12]=\"!data.baseData.allowCreate\"\n >\n <button class=\"actions-button\" [matMenuTriggerFor]=\"menu\" mat-raised-button>\n {{data.baseData.multiSelectLabel}}\n </button>\n </div>\n <mat-menu #menu=\"matMenu\">\n <button *ngFor=\"let action of data.baseData.multiSelectActions\" [disabled]=\"multiActionDisabled(action)\" (click)=\"runMultiAction(action)\" mat-menu-item>\n {{action.displayName}}\n </button>\n </mat-menu>\n\n <div\n *ngIf=\"data.baseData.allowCreate\"\n [class.col-lg-2]=\"data.baseData.multiSelectActions.length\"\n [class.col-lg-4]=\"!data.baseData.multiSelectActions.length\"\n [class.col-md-3]=\"data.baseData.multiSelectActions.length\"\n [class.col-md-6]=\"!data.baseData.multiSelectActions.length\"\n [class.col-sm-6]=\"data.baseData.multiSelectActions.length\"\n [class.col-sm-12]=\"!data.baseData.multiSelectActions.length\"\n >\n <button class=\"create-button\" (click)=\"createEntity()\" mat-raised-button>\n {{data.baseData.createButtonLabel}}\n </button>\n </div>\n</div>\n\n<div class=\"mat-elevation-z8\">\n <mat-table *ngIf=\"dataSource\" [dataSource]=\"dataSource\" matSort>\n <!-- select Column -->\n <ng-container matColumnDef=\"select\">\n <mat-header-cell *matHeaderCellDef>\n <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"> </mat-checkbox>\n </mat-header-cell>\n <mat-cell *matCellDef=\"let module\" class=\"module\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"> </mat-checkbox>\n </mat-cell>\n </ng-container>\n\n <ng-container *ngFor=\"let dCol of data.baseData.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n <mat-header-cell *matHeaderCellDef mat-sort-header>\n {{dCol.displayName}}\n </mat-header-cell>\n <mat-cell class=\"entity\" [class.enabled]=\"data.baseData.allowEdit(entity)\" (click)=\"editEntity(entity)\" *matCellDef=\"let entity\">\n {{dCol.value(entity)}}\n </mat-cell>\n </ng-container>\n\n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n </mat-table>\n\n <mat-paginator *ngIf=\"dataSource\" id=\"paginator\" [length]=\"dataSource.filteredData.length\" [pageIndex]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 50]\"> </mat-paginator>\n</div>\n", styles: [".title{text-align:center}button{width:100%}.mat-column-select{flex:0 0 75px}.enabled:hover{cursor:pointer}@media (max-width: 767px){.actions-button,.create-button{margin-bottom:15px}}\n"] }]
2155
+ }], ctorParameters: function () { return [{ type: i1.MatDialog }, { type: i0.Injector }]; }, propDecorators: { tableData: [{
1357
2156
  type: Input
1358
2157
  }], paginator: [{
1359
2158
  type: ViewChild,
@@ -1366,421 +2165,342 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
1366
2165
  args: ['filter', { static: true }]
1367
2166
  }] } });
1368
2167
 
1369
- class NgxMatEntityTableModule {
2168
+ class NgxMatEntityCreateDialogModule {
1370
2169
  }
1371
- NgxMatEntityTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1372
- NgxMatEntityTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, declarations: [NgxMatEntityTableComponent], imports: [CommonModule,
1373
- MatInputModule,
2170
+ NgxMatEntityCreateDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2171
+ NgxMatEntityCreateDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, declarations: [NgxMatEntityCreateDialogComponent], imports: [CommonModule,
2172
+ NgxMatEntityInputModule,
2173
+ MatDialogModule,
1374
2174
  FormsModule,
1375
- MatFormFieldModule,
1376
- MatCheckboxModule,
1377
- MatTableModule,
1378
- MatPaginatorModule,
1379
- MatButtonModule,
1380
- MatMenuModule,
1381
- MatDialogModule], exports: [NgxMatEntityTableComponent] });
1382
- NgxMatEntityTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, imports: [[
2175
+ MatButtonModule], exports: [NgxMatEntityCreateDialogComponent] });
2176
+ NgxMatEntityCreateDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, imports: [[
1383
2177
  CommonModule,
1384
- MatInputModule,
2178
+ NgxMatEntityInputModule,
2179
+ MatDialogModule,
1385
2180
  FormsModule,
1386
- MatFormFieldModule,
1387
- MatCheckboxModule,
1388
- MatTableModule,
1389
- MatPaginatorModule,
1390
- MatButtonModule,
1391
- MatMenuModule,
1392
- MatDialogModule
2181
+ MatButtonModule
1393
2182
  ]] });
1394
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, decorators: [{
2183
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, decorators: [{
1395
2184
  type: NgModule,
1396
2185
  args: [{
1397
- declarations: [NgxMatEntityTableComponent],
2186
+ declarations: [NgxMatEntityCreateDialogComponent],
1398
2187
  imports: [
1399
2188
  CommonModule,
1400
- MatInputModule,
2189
+ NgxMatEntityInputModule,
2190
+ MatDialogModule,
1401
2191
  FormsModule,
1402
- MatFormFieldModule,
1403
- MatCheckboxModule,
1404
- MatTableModule,
1405
- MatPaginatorModule,
1406
- MatButtonModule,
1407
- MatMenuModule,
1408
- MatDialogModule
2192
+ MatButtonModule
1409
2193
  ],
1410
- exports: [NgxMatEntityTableComponent]
2194
+ exports: [NgxMatEntityCreateDialogComponent]
1411
2195
  }]
1412
2196
  }] });
1413
2197
 
1414
- class NgxMatEntityInternalInputModule {
2198
+ class NgxMatEntityEditDialogModule {
1415
2199
  }
1416
- NgxMatEntityInternalInputModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1417
- NgxMatEntityInternalInputModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputModule, declarations: [NgxMatEntityInternalInputComponent], imports: [CommonModule,
1418
- MatInputModule,
2200
+ NgxMatEntityEditDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2201
+ NgxMatEntityEditDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, declarations: [NgxMatEntityEditDialogComponent], imports: [CommonModule,
2202
+ NgxMatEntityInputModule,
2203
+ MatDialogModule,
1419
2204
  FormsModule,
1420
- MatFormFieldModule,
1421
- MatSelectModule,
1422
- MatAutocompleteModule,
1423
- MatCheckboxModule,
1424
- MatSlideToggleModule,
1425
- MatTableModule], exports: [NgxMatEntityInternalInputComponent] });
1426
- NgxMatEntityInternalInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputModule, imports: [[
2205
+ MatButtonModule,
2206
+ NgxMatEntityConfirmDialogModule], exports: [NgxMatEntityEditDialogComponent] });
2207
+ NgxMatEntityEditDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, imports: [[
1427
2208
  CommonModule,
1428
- MatInputModule,
2209
+ NgxMatEntityInputModule,
2210
+ MatDialogModule,
1429
2211
  FormsModule,
1430
- MatFormFieldModule,
1431
- MatSelectModule,
1432
- MatAutocompleteModule,
1433
- MatCheckboxModule,
1434
- MatSlideToggleModule,
1435
- MatTableModule
2212
+ MatButtonModule,
2213
+ NgxMatEntityConfirmDialogModule
1436
2214
  ]] });
1437
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputModule, decorators: [{
2215
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, decorators: [{
1438
2216
  type: NgModule,
1439
2217
  args: [{
1440
- declarations: [NgxMatEntityInternalInputComponent],
2218
+ declarations: [NgxMatEntityEditDialogComponent],
1441
2219
  imports: [
1442
2220
  CommonModule,
1443
- MatInputModule,
2221
+ NgxMatEntityInputModule,
2222
+ MatDialogModule,
1444
2223
  FormsModule,
1445
- MatFormFieldModule,
1446
- MatSelectModule,
1447
- MatAutocompleteModule,
1448
- MatCheckboxModule,
1449
- MatSlideToggleModule,
1450
- MatTableModule
2224
+ MatButtonModule,
2225
+ NgxMatEntityConfirmDialogModule
1451
2226
  ],
1452
- exports: [NgxMatEntityInternalInputComponent]
1453
- }]
1454
- }] });
1455
-
1456
- class NgxMatEntityAddArrayItemDialogModule {
1457
- }
1458
- NgxMatEntityAddArrayItemDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1459
- NgxMatEntityAddArrayItemDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogModule, declarations: [NgxMatEntityAddArrayItemDialogComponent], imports: [CommonModule, NgxMatEntityInternalInputModule, MatDialogModule, FormsModule, MatButtonModule], exports: [NgxMatEntityAddArrayItemDialogComponent] });
1460
- NgxMatEntityAddArrayItemDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogModule, imports: [[CommonModule, NgxMatEntityInternalInputModule, MatDialogModule, FormsModule, MatButtonModule]] });
1461
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogModule, decorators: [{
1462
- type: NgModule,
1463
- args: [{
1464
- declarations: [NgxMatEntityAddArrayItemDialogComponent],
1465
- imports: [CommonModule, NgxMatEntityInternalInputModule, MatDialogModule, FormsModule, MatButtonModule],
1466
- exports: [NgxMatEntityAddArrayItemDialogComponent]
2227
+ exports: [NgxMatEntityEditDialogComponent]
1467
2228
  }]
1468
2229
  }] });
1469
2230
 
1470
- class NgxMatEntityArrayTableModule {
2231
+ class NgxMatEntityTableModule {
1471
2232
  }
1472
- NgxMatEntityArrayTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1473
- NgxMatEntityArrayTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableModule, declarations: [NgxMatEntityArrayTableComponent], imports: [CommonModule,
2233
+ NgxMatEntityTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2234
+ NgxMatEntityTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, declarations: [NgxMatEntityTableComponent], imports: [CommonModule,
1474
2235
  MatInputModule,
1475
2236
  FormsModule,
1476
2237
  MatFormFieldModule,
1477
- MatSelectModule,
1478
- MatAutocompleteModule,
1479
2238
  MatCheckboxModule,
1480
- MatSlideToggleModule,
1481
2239
  MatTableModule,
1482
- NgxMatEntityInternalInputModule,
2240
+ MatPaginatorModule,
1483
2241
  MatButtonModule,
1484
- NgxMatEntityAddArrayItemDialogModule], exports: [NgxMatEntityArrayTableComponent] });
1485
- NgxMatEntityArrayTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableModule, imports: [[
2242
+ MatMenuModule,
2243
+ MatDialogModule,
2244
+ NgxMatEntityCreateDialogModule,
2245
+ NgxMatEntityEditDialogModule], exports: [NgxMatEntityTableComponent] });
2246
+ NgxMatEntityTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, imports: [[
1486
2247
  CommonModule,
1487
2248
  MatInputModule,
1488
2249
  FormsModule,
1489
2250
  MatFormFieldModule,
1490
- MatSelectModule,
1491
- MatAutocompleteModule,
1492
2251
  MatCheckboxModule,
1493
- MatSlideToggleModule,
1494
2252
  MatTableModule,
1495
- NgxMatEntityInternalInputModule,
2253
+ MatPaginatorModule,
1496
2254
  MatButtonModule,
1497
- NgxMatEntityAddArrayItemDialogModule
2255
+ MatMenuModule,
2256
+ MatDialogModule,
2257
+ NgxMatEntityCreateDialogModule,
2258
+ NgxMatEntityEditDialogModule,
1498
2259
  ]] });
1499
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableModule, decorators: [{
2260
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, decorators: [{
1500
2261
  type: NgModule,
1501
2262
  args: [{
1502
- declarations: [NgxMatEntityArrayTableComponent],
2263
+ declarations: [NgxMatEntityTableComponent],
1503
2264
  imports: [
1504
2265
  CommonModule,
1505
2266
  MatInputModule,
1506
2267
  FormsModule,
1507
2268
  MatFormFieldModule,
1508
- MatSelectModule,
1509
- MatAutocompleteModule,
1510
2269
  MatCheckboxModule,
1511
- MatSlideToggleModule,
1512
2270
  MatTableModule,
1513
- NgxMatEntityInternalInputModule,
2271
+ MatPaginatorModule,
1514
2272
  MatButtonModule,
1515
- NgxMatEntityAddArrayItemDialogModule
2273
+ MatMenuModule,
2274
+ MatDialogModule,
2275
+ NgxMatEntityCreateDialogModule,
2276
+ NgxMatEntityEditDialogModule,
1516
2277
  ],
1517
- exports: [NgxMatEntityArrayTableComponent]
2278
+ exports: [NgxMatEntityTableComponent]
1518
2279
  }]
1519
2280
  }] });
1520
2281
 
1521
- class NgxMatEntityInputModule {
2282
+ /**
2283
+ * The internal EntityArrayDecoratorConfig. Sets default values.
2284
+ */
2285
+ class EntityArrayDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
2286
+ constructor(data) {
2287
+ super(data);
2288
+ this.createInline = data.createInline != undefined ? data.createInline : true;
2289
+ this.displayStyle = data.displayStyle;
2290
+ this.itemType = data.itemType;
2291
+ this.EntityClass = data.EntityClass;
2292
+ this.displayColumns = data.displayColumns;
2293
+ this.createInline = data.createInline != undefined ? data.createInline : true;
2294
+ this.missingErrorMessage = data.missingErrorMessage ? data.missingErrorMessage : 'Needs to contain at least one value';
2295
+ this.defaultWidths = data.defaultWidths ? data.defaultWidths : [12, 12, 12];
2296
+ this.addButtonLabel = data.addButtonLabel ? data.addButtonLabel : 'Add';
2297
+ this.removeButtonLabel = data.removeButtonLabel ? data.removeButtonLabel : 'Remove';
2298
+ }
1522
2299
  }
1523
- NgxMatEntityInputModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1524
- NgxMatEntityInputModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, declarations: [NgxMatEntityInputComponent], imports: [CommonModule,
1525
- MatInputModule,
1526
- FormsModule,
1527
- MatFormFieldModule,
1528
- MatSelectModule,
1529
- MatAutocompleteModule,
1530
- MatCheckboxModule,
1531
- MatSlideToggleModule,
1532
- NgxMatEntityArrayTableModule,
1533
- MatChipsModule,
1534
- MatIconModule], exports: [NgxMatEntityInputComponent] });
1535
- NgxMatEntityInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, imports: [[
1536
- CommonModule,
1537
- MatInputModule,
1538
- FormsModule,
1539
- MatFormFieldModule,
1540
- MatSelectModule,
1541
- MatAutocompleteModule,
1542
- MatCheckboxModule,
1543
- MatSlideToggleModule,
1544
- NgxMatEntityArrayTableModule,
1545
- MatChipsModule,
1546
- MatIconModule
1547
- ]] });
1548
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, decorators: [{
1549
- type: NgModule,
1550
- args: [{
1551
- declarations: [NgxMatEntityInputComponent],
1552
- imports: [
1553
- CommonModule,
1554
- MatInputModule,
1555
- FormsModule,
1556
- MatFormFieldModule,
1557
- MatSelectModule,
1558
- MatAutocompleteModule,
1559
- MatCheckboxModule,
1560
- MatSlideToggleModule,
1561
- NgxMatEntityArrayTableModule,
1562
- MatChipsModule,
1563
- MatIconModule
1564
- ],
1565
- exports: [NgxMatEntityInputComponent]
1566
- }]
1567
- }] });
1568
-
1569
- class NgxMatEntityCreateDialogModule {
2300
+ /**
2301
+ * The internal StringChipsArrayDecoratorConfig. Sets default values.
2302
+ */
2303
+ class StringChipsArrayDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
2304
+ constructor(data) {
2305
+ super(data);
2306
+ this.deleteIcon = data.deleteIcon ? data.deleteIcon : 'fas fa-circle-minus';
2307
+ this.displayStyle = data.displayStyle;
2308
+ this.itemType = data.itemType;
2309
+ this.maxLength = data.maxLength;
2310
+ this.minLength = data.minLength;
2311
+ this.regex = data.regex;
2312
+ this.defaultWidths = data.defaultWidths ? data.defaultWidths : [6, 12, 12];
2313
+ }
1570
2314
  }
1571
- NgxMatEntityCreateDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1572
- NgxMatEntityCreateDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, declarations: [NgxMatEntityCreateDialogComponent], imports: [CommonModule, NgxMatEntityInputModule, MatDialogModule, FormsModule, MatButtonModule], exports: [NgxMatEntityCreateDialogComponent] });
1573
- NgxMatEntityCreateDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, imports: [[CommonModule, NgxMatEntityInputModule, MatDialogModule, FormsModule, MatButtonModule]] });
1574
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, decorators: [{
1575
- type: NgModule,
1576
- args: [{
1577
- declarations: [NgxMatEntityCreateDialogComponent],
1578
- imports: [CommonModule, NgxMatEntityInputModule, MatDialogModule, FormsModule, MatButtonModule],
1579
- exports: [NgxMatEntityCreateDialogComponent]
1580
- }]
1581
- }] });
1582
-
1583
- class NgxMatEntityEditDialogModule {
2315
+ /**
2316
+ * The internal AutocompleteStringChipsArrayDecoratorConfig. Sets default values.
2317
+ */
2318
+ class AutocompleteStringChipsArrayDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
2319
+ constructor(data) {
2320
+ super(data);
2321
+ this.autocompleteValues = data.autocompleteValues;
2322
+ this.deleteIcon = data.deleteIcon ? data.deleteIcon : 'fas fa-circle-minus';
2323
+ this.displayStyle = data.displayStyle;
2324
+ this.itemType = data.itemType;
2325
+ this.maxLength = data.maxLength;
2326
+ this.minLength = data.minLength;
2327
+ this.regex = data.regex;
2328
+ this.defaultWidths = data.defaultWidths ? data.defaultWidths : [6, 12, 12];
2329
+ }
1584
2330
  }
1585
- NgxMatEntityEditDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1586
- NgxMatEntityEditDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, declarations: [NgxMatEntityEditDialogComponent], imports: [CommonModule,
1587
- NgxMatEntityInputModule,
1588
- MatDialogModule,
1589
- FormsModule,
1590
- MatButtonModule,
1591
- NgxMatEntityConfirmDialogModule], exports: [NgxMatEntityEditDialogComponent] });
1592
- NgxMatEntityEditDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, imports: [[
1593
- CommonModule,
1594
- NgxMatEntityInputModule,
1595
- MatDialogModule,
1596
- FormsModule,
1597
- MatButtonModule,
1598
- NgxMatEntityConfirmDialogModule
1599
- ]] });
1600
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, decorators: [{
1601
- type: NgModule,
1602
- args: [{
1603
- declarations: [NgxMatEntityEditDialogComponent],
1604
- imports: [
1605
- CommonModule,
1606
- NgxMatEntityInputModule,
1607
- MatDialogModule,
1608
- FormsModule,
1609
- MatButtonModule,
1610
- NgxMatEntityConfirmDialogModule
1611
- ],
1612
- exports: [NgxMatEntityEditDialogComponent]
1613
- }]
1614
- }] });
1615
2331
 
1616
2332
  /**
1617
- * Decorator for setting and getting array propery metadata
1618
- * @param metadata The metadata of the array property
2333
+ * Decorator for setting and getting array property metadata.
2334
+ *
2335
+ * @param metadata - The metadata of the array property.
2336
+ * @returns The method that defines the metadata.
2337
+ * @throws When the given type of the array-items is unknown.
1619
2338
  */
1620
2339
  function array(metadata) {
1621
2340
  switch (metadata.itemType) {
1622
2341
  case DecoratorTypes.OBJECT:
1623
- return baseProperty(new EntityArrayDecoratorConfig(metadata), DecoratorTypes.ARRAY);
2342
+ return baseProperty(new EntityArrayDecoratorConfigInternal(metadata), DecoratorTypes.ARRAY);
1624
2343
  case DecoratorTypes.STRING:
1625
- return baseProperty(new StringChipsArrayDecoratorConfig(metadata), DecoratorTypes.ARRAY_STRING_CHIPS);
2344
+ return baseProperty(new StringChipsArrayDecoratorConfigInternal(metadata), DecoratorTypes.ARRAY_STRING_CHIPS);
1626
2345
  case DecoratorTypes.STRING_AUTOCOMPLETE:
1627
- return baseProperty(new AutocompleteStringChipsArrayDecoratorConfig(metadata), DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS);
2346
+ return baseProperty(new AutocompleteStringChipsArrayDecoratorConfigInternal(metadata), DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS);
1628
2347
  default:
1629
2348
  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access
1630
2349
  throw new Error(`Unknown itemType ${metadata.itemType}`);
1631
2350
  }
1632
2351
  }
2352
+
2353
+ /**
2354
+ * The base options for all propertyDecorators.
2355
+ */
2356
+ class PropertyDecoratorConfig {
2357
+ }
2358
+
1633
2359
  /**
1634
- * Interface definition for the @array metadata
2360
+ * Interface definition for the @array metadata.
1635
2361
  */
1636
2362
  class ArrayDecoratorConfig extends PropertyDecoratorConfig {
1637
2363
  }
2364
+
1638
2365
  /**
1639
- * Definition for an array of Entities
2366
+ * The internal DropdownBooleanDecoratorConfig. Sets default values.
1640
2367
  */
1641
- class EntityArrayDecoratorConfig extends ArrayDecoratorConfig {
1642
- constructor(metadata) {
1643
- super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
1644
- this.itemType = metadata.itemType;
1645
- this.displayStyle = metadata.displayStyle;
1646
- this.EntityClass = metadata.EntityClass;
1647
- this.createDialogData = metadata.createDialogData;
1648
- this.missingErrorMessage = metadata.missingErrorMessage;
1649
- this.createInline = metadata.createInline;
1650
- this.displayColumns = metadata.displayColumns;
2368
+ class DropdownBooleanDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
2369
+ constructor(data) {
2370
+ super(data);
2371
+ this.displayStyle = data.displayStyle;
2372
+ this.dropdownTrue = data.dropdownTrue;
2373
+ this.dropdownFalse = data.dropdownFalse;
1651
2374
  }
1652
2375
  }
1653
2376
  /**
1654
- * Definition for an array of strings displayed as a chips list
2377
+ * The internal CheckboxBooleanDecoratorConfig. Sets default values.
1655
2378
  */
1656
- class StringChipsArrayDecoratorConfig extends ArrayDecoratorConfig {
1657
- constructor(metadata) {
1658
- super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
1659
- this.itemType = metadata.itemType;
1660
- this.displayStyle = metadata.displayStyle;
1661
- this.deleteHtml = metadata.deleteHtml;
1662
- this.minLength = metadata.minLength;
1663
- this.maxLength = metadata.maxLength;
1664
- this.regex = metadata.regex;
2379
+ class CheckboxBooleanDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
2380
+ constructor(data) {
2381
+ super(data);
2382
+ this.displayStyle = data.displayStyle;
2383
+ this.required = data.required === undefined ? false : data.required;
1665
2384
  }
1666
2385
  }
1667
2386
  /**
1668
- * Definition for an array of autocomplete strings displayed as a chips list
2387
+ * The internal ToggleBooleanDecoratorConfig. Sets default values.
1669
2388
  */
1670
- class AutocompleteStringChipsArrayDecoratorConfig extends ArrayDecoratorConfig {
1671
- constructor(metadata) {
1672
- super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
1673
- this.itemType = metadata.itemType;
1674
- this.displayStyle = metadata.displayStyle;
1675
- this.deleteHtml = metadata.deleteHtml;
1676
- this.autocompleteValues = metadata.autocompleteValues;
1677
- this.minLength = metadata.minLength;
1678
- this.maxLength = metadata.maxLength;
1679
- this.regex = metadata.regex;
2389
+ class ToggleBooleanDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
2390
+ constructor(data) {
2391
+ super(data);
2392
+ this.displayStyle = data.displayStyle;
2393
+ this.required = data.required === undefined ? false : data.required;
1680
2394
  }
1681
2395
  }
1682
2396
 
1683
2397
  /**
1684
- * Decorator for setting and getting string propery metadata
1685
- * @param metadata The metadata of the string property
2398
+ * Decorator for setting and getting boolean property metadata.
2399
+ *
2400
+ * @param metadata - The metadata of the boolean property.
2401
+ * @returns The method that defines the metadata.
1686
2402
  */
1687
2403
  function boolean(metadata) {
1688
2404
  if (metadata.displayStyle === 'dropdown') {
1689
- return baseProperty(new DropdownBooleanDecoratorConfig(metadata), DecoratorTypes.BOOLEAN_DROPDOWN);
2405
+ return baseProperty(new DropdownBooleanDecoratorConfigInternal(metadata), DecoratorTypes.BOOLEAN_DROPDOWN);
1690
2406
  }
1691
2407
  else if (metadata.displayStyle === 'checkbox') {
1692
- return baseProperty(new CheckboxBooleanDecoratorConfig(metadata), DecoratorTypes.BOOLEAN_CHECKBOX);
2408
+ return baseProperty(new CheckboxBooleanDecoratorConfigInternal(metadata), DecoratorTypes.BOOLEAN_CHECKBOX);
1693
2409
  }
1694
2410
  else {
1695
- return baseProperty(new ToggleBooleanDecoratorConfig(metadata), DecoratorTypes.BOOLEAN_TOGGLE);
2411
+ return baseProperty(new ToggleBooleanDecoratorConfigInternal(metadata), DecoratorTypes.BOOLEAN_TOGGLE);
1696
2412
  }
1697
2413
  }
2414
+
1698
2415
  /**
1699
- * The Definition for the @boolean metadata
2416
+ * The Definition for the @boolean metadata.
1700
2417
  */
1701
2418
  class BooleanDecoratorConfig extends PropertyDecoratorConfig {
1702
2419
  }
1703
- class DropdownBooleanDecoratorConfig extends BooleanDecoratorConfig {
1704
- constructor(metadata) {
1705
- super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
1706
- this.displayStyle = metadata.displayStyle;
1707
- this.dropdownTrue = metadata.dropdownTrue;
1708
- this.dropdownFalse = metadata.dropdownFalse;
1709
- }
1710
- }
1711
- class CheckboxBooleanDecoratorConfig extends BooleanDecoratorConfig {
1712
- constructor(metadata) {
1713
- super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
1714
- this.displayStyle = metadata.displayStyle;
2420
+
2421
+ /**
2422
+ * The internal DefaultNumberDecoratorConfig. Sets default values.
2423
+ */
2424
+ class DefaultNumberDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
2425
+ constructor(data) {
2426
+ super(data);
2427
+ this.displayStyle = data.displayStyle;
2428
+ this.max = data.max;
2429
+ this.min = data.min;
1715
2430
  }
1716
2431
  }
1717
- class ToggleBooleanDecoratorConfig extends BooleanDecoratorConfig {
1718
- constructor(metadata) {
1719
- super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
1720
- this.displayStyle = metadata.displayStyle;
2432
+ /**
2433
+ * The internal DropdownNumberDecoratorConfig. Sets default values.
2434
+ */
2435
+ class DropdownNumberDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
2436
+ constructor(data) {
2437
+ super(data);
2438
+ this.displayStyle = data.displayStyle;
2439
+ this.dropdownValues = data.dropdownValues;
1721
2440
  }
1722
2441
  }
1723
2442
 
1724
2443
  /**
1725
- * Decorator for setting and getting string propery metadata
1726
- * @param metadata The metadata of the string property
2444
+ * Decorator for setting and getting number property metadata.
2445
+ *
2446
+ * @param metadata - The metadata of the number property.
2447
+ * @returns The method that defines the metadata.
1727
2448
  */
1728
2449
  function number(metadata) {
1729
2450
  if (metadata.displayStyle === 'dropdown') {
1730
- return baseProperty(new DropdownNumberDecoratorConfig(metadata), DecoratorTypes.NUMBER_DROPDOWN);
2451
+ return baseProperty(new DropdownNumberDecoratorConfigInternal(metadata), DecoratorTypes.NUMBER_DROPDOWN);
1731
2452
  }
1732
2453
  else {
1733
- return baseProperty(new DefaultNumberDecoratorConfig(metadata), DecoratorTypes.NUMBER);
2454
+ return baseProperty(new DefaultNumberDecoratorConfigInternal(metadata), DecoratorTypes.NUMBER);
1734
2455
  }
1735
2456
  }
2457
+
1736
2458
  /**
1737
- * Interface definition for the @number metadata
2459
+ * Definition for the @number metadata.
1738
2460
  */
1739
2461
  class NumberDecoratorConfig extends PropertyDecoratorConfig {
1740
2462
  }
1741
- class DefaultNumberDecoratorConfig extends NumberDecoratorConfig {
1742
- constructor(metadata) {
1743
- super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
1744
- this.displayStyle = metadata.displayStyle;
1745
- this.min = metadata.min;
1746
- this.max = metadata.max;
1747
- }
1748
- }
1749
- class DropdownNumberDecoratorConfig extends NumberDecoratorConfig {
1750
- constructor(metadata) {
1751
- super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
1752
- this.displayStyle = metadata.displayStyle;
1753
- this.dropdownValues = metadata.dropdownValues;
2463
+
2464
+ /**
2465
+ * The internal DefaultObjectDecoratorConfig. Sets default values.
2466
+ */
2467
+ class DefaultObjectDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
2468
+ constructor(data) {
2469
+ super(data);
2470
+ this.displayStyle = data.displayStyle;
2471
+ this.EntityClass = data.EntityClass;
1754
2472
  }
1755
2473
  }
1756
2474
 
1757
2475
  /**
1758
- * Decorator for setting and getting object propery metadata.
1759
- * @param metadata The metadata of the object property
2476
+ * Decorator for setting and getting object property metadata.
2477
+ *
2478
+ * @param metadata - The metadata of the object property.
2479
+ * @returns The method that defines the metadata.
1760
2480
  */
1761
2481
  function object(metadata) {
1762
- return baseProperty(new DefaultObjectDecoratorConfig(metadata), DecoratorTypes.OBJECT);
2482
+ return baseProperty(new DefaultObjectDecoratorConfigInternal(metadata), DecoratorTypes.OBJECT);
1763
2483
  }
2484
+
1764
2485
  /**
1765
- * Interface definition for the @object metadata
2486
+ * Definition for the @object metadata.
1766
2487
  */
1767
2488
  class ObjectDecoratorConfig extends PropertyDecoratorConfig {
1768
2489
  }
1769
- class DefaultObjectDecoratorConfig extends ObjectDecoratorConfig {
1770
- constructor(metadata) {
1771
- super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
1772
- this.displayStyle = metadata.displayStyle;
1773
- this.type = metadata.type;
1774
- }
2490
+
2491
+ /**
2492
+ * Definition for the @string metadata.
2493
+ */
2494
+ class StringDecoratorConfig extends PropertyDecoratorConfig {
1775
2495
  }
1776
2496
 
1777
- /*
1778
- * Public API Surface of ngx-material-entity
2497
+ /**
2498
+ * Public API Surface of ngx-material-entity.
1779
2499
  */
1780
2500
 
1781
2501
  /**
1782
2502
  * Generated bundle index. Do not edit.
1783
2503
  */
1784
2504
 
1785
- export { AutocompleteStringChipsArrayDecoratorConfig, AutocompleteStringDecoratorConfig, CheckboxBooleanDecoratorConfig, DecoratorTypes, DefaultNumberDecoratorConfig, DefaultObjectDecoratorConfig, DefaultStringDecoratorConfig, DropdownBooleanDecoratorConfig, DropdownNumberDecoratorConfig, DropdownStringDecoratorConfig, Entity, EntityArrayDecoratorConfig, EntityService, EntityUtilities, NgxMatEntityConfirmDialogComponent, NgxMatEntityConfirmDialogModule, NgxMatEntityCreateDialogComponent, NgxMatEntityCreateDialogModule, NgxMatEntityEditDialogComponent, NgxMatEntityEditDialogModule, NgxMatEntityInputComponent, NgxMatEntityInputModule, NgxMatEntityTableComponent, NgxMatEntityTableModule, StringChipsArrayDecoratorConfig, TextboxStringDecoratorConfig, ToggleBooleanDecoratorConfig, array, boolean, getValidationErrorMessage, number, object, string };
2505
+ export { DateUtilities, DecoratorTypes, Entity, EntityService, EntityUtilities, NgxMatEntityConfirmDialogComponent, NgxMatEntityConfirmDialogModule, NgxMatEntityCreateDialogComponent, NgxMatEntityCreateDialogModule, NgxMatEntityEditDialogComponent, NgxMatEntityEditDialogModule, NgxMatEntityInputComponent, NgxMatEntityInputModule, NgxMatEntityTableComponent, NgxMatEntityTableModule, array, boolean, getValidationErrorMessage, number, object, string };
1786
2506
  //# sourceMappingURL=ngx-material-entity.mjs.map