ngx-material-entity 0.1.2 → 0.1.3

package/fesm2015/ngx-material-entity.mjs

@@ -6,37 +6,36 @@ import * as i0 from '@angular/core';
 import { Component, Inject, NgModule, Input, ViewChild } from '@angular/core';
 import * as i1 from '@angular/material/dialog';
 import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
-import * as i5 from '@angular/material/checkbox';
+import * as i6 from '@angular/material/checkbox';
 import { MatCheckboxModule } from '@angular/material/checkbox';
 import * as i3 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
-import * as i7 from '@angular/common';
+import * as i11 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i12 from '@angular/forms';
+import * as i13 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
-import * as i1$1 from '@angular/material/form-field';
+import * as i9 from '@angular/material/table';
+import { MatTableDataSource, MatTableModule } from '@angular/material/table';
+import { SelectionModel } from '@angular/cdk/collections';
+import * as i2 from '@angular/material/form-field';
 import { MatFormFieldModule } from '@angular/material/form-field';
-import * as i2 from '@angular/material/autocomplete';
+import * as i3$1 from '@angular/material/autocomplete';
 import { MatAutocompleteModule } from '@angular/material/autocomplete';
-import * as i3$1 from '@angular/material/core';
-import * as i4 from '@angular/material/select';
+import * as i4 from '@angular/material/core';
+import * as i5 from '@angular/material/select';
 import { MatSelectModule } from '@angular/material/select';
-import * as i6 from '@angular/material/slide-toggle';
+import * as i7 from '@angular/material/slide-toggle';
 import { MatSlideToggleModule } from '@angular/material/slide-toggle';
-import { SelectionModel } from '@angular/cdk/collections';
-import * as i4$1 from '@angular/material/table';
-import { MatTableDataSource, MatTableModule } from '@angular/material/table';
-import * as i8 from '@angular/material/input';
-import { MatInputModule } from '@angular/material/input';
-import * as i10 from '@angular/cdk/text-field';
-import * as i8$1 from '@angular/material/chips';
+import * as i10 from '@angular/material/chips';
 import { MatChipsModule } from '@angular/material/chips';
-import * as i9 from '@angular/material/icon';
+import * as i12 from '@angular/material/input';
+import { MatInputModule } from '@angular/material/input';
+import * as i14 from '@angular/cdk/text-field';
 import { MatIconModule } from '@angular/material/icon';
 import * as i7$1 from '@angular/material/paginator';
 import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
 import { MatSort } from '@angular/material/sort';
-import * as i4$2 from '@angular/material/menu';
+import * as i4$1 from '@angular/material/menu';
 import { MatMenuModule } from '@angular/material/menu';
 
 /**
@@ -73,21 +72,47 @@ var DecoratorTypes;
     DecoratorTypes["ARRAY_STRING_AUTOCOMPLETE_CHIPS"] = "arrayStringAutocompleteChips";
 })(DecoratorTypes || (DecoratorTypes = {}));
 
-class PropertyDecoratorConfigInternal {
+/**
+ * The internal Position. Sets default values and validates user input.
+ */
+class PositionInternal {
     constructor(data) {
-        if (data.order && (data.order < 0)) {
-            throw new Error('order must be at least 0');
+        this.validateInput(data);
+        this.row = (data === null || data === void 0 ? void 0 : data.row) ? data.row : -1;
+        this.order = (data === null || data === void 0 ? void 0 : data.order) ? data.order : -1;
+    }
+    validateInput(data) {
+        if (data === null || data === void 0 ? void 0 : data.order) {
+            if (data.order < 1) {
+                throw new Error('order must be at least 1');
+            }
+            if (data.order > 12) {
+                throw new Error('order cannot be bigger than 12 (the minimum value for a bootstrap column)');
+            }
         }
+        if ((data === null || data === void 0 ? void 0 : data.row) && (data.row < 1)) {
+            throw new Error('row must be at least 1');
+        }
+    }
+}
+/**
+ * The internal PropertyDecoratorConfig. Sets default values.
+ */
+class PropertyDecoratorConfigInternal {
+    constructor(data) {
         this.display = data.display != undefined ? data.display : true;
         this.displayName = data.displayName;
         this.required = data.required != undefined ? data.required : true;
         this.omitForCreate = data.omitForCreate != undefined ? data.omitForCreate : false;
         this.omitForUpdate = data.omitForUpdate != undefined ? data.omitForUpdate : false;
         this.defaultWidths = data.defaultWidths ? data.defaultWidths : [6, 6, 12];
-        this.order = data.order ? data.order : -1;
+        this.position = new PositionInternal(data.position);
     }
 }
 
+/**
+ * The internal DropdownStringDecoratorConfig. Sets default values.
+ */
 class DropdownStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
     constructor(data) {
         super(data);
@@ -95,6 +120,9 @@ class DropdownStringDecoratorConfigInternal extends PropertyDecoratorConfigInter
         this.dropdownValues = data.dropdownValues;
     }
 }
+/**
+ * The internal DefaultStringDecoratorConfig. Sets default values.
+ */
 class DefaultStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
     constructor(data) {
         super(data);
@@ -104,6 +132,9 @@ class DefaultStringDecoratorConfigInternal extends PropertyDecoratorConfigIntern
         this.regex = data.regex;
     }
 }
+/**
+ * The internal TextboxStringDecoratorConfig. Sets default values.
+ */
 class TextboxStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
     constructor(data) {
         super(data);
@@ -112,6 +143,9 @@ class TextboxStringDecoratorConfigInternal extends PropertyDecoratorConfigIntern
         this.maxLength = data.maxLength;
     }
 }
+/**
+ * The internal AutocompleteStringDecoratorConfig. Sets default values.
+ */
 class AutocompleteStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
     constructor(data) {
         super(data);
@@ -124,7 +158,7 @@ class AutocompleteStringDecoratorConfigInternal extends PropertyDecoratorConfigI
 }
 
 /**
- * Decorator for setting and getting string propery metadata.
+ * Decorator for setting and getting string Property metadata.
  *
  * @param metadata - The metadata of the string property.
  * @returns The method that defines the metadata.
@@ -174,8 +208,8 @@ class EntityUtilities {
      */
     static getOmitForUpdate(entity) {
         const res = [];
-        for (const key of Reflect.ownKeys(entity)) {
-            const metadata = Reflect.getMetadata('metadata', entity, key);
+        for (const key of EntityUtilities.keysOf(entity)) {
+            const metadata = EntityUtilities.getPropertyMetadata(entity, key);
             if (metadata.omitForUpdate) {
                 res.push(key);
             }
@@ -190,8 +224,8 @@ class EntityUtilities {
      */
     static getOmitForCreate(entity) {
         const res = [];
-        for (const key of Reflect.ownKeys(entity)) {
-            const metadata = Reflect.getMetadata('metadata', entity, key);
+        for (const key of EntityUtilities.keysOf(entity)) {
+            const metadata = EntityUtilities.getPropertyMetadata(entity, key);
             if (metadata.omitForCreate) {
                 res.push(key);
             }
@@ -284,7 +318,7 @@ class EntityUtilities {
      * Also checks all the validators given by the metadata ("required", "maxLength" etc.).
      *
      * @param entity - The entity to validate.
-     * @param omit - Whether to check for creatiung or editing validity.
+     * @param omit - Whether to check for creating or editing validity.
      * @returns Whether or not the entity is valid.
      */
     static isEntityValid(entity, omit) {
@@ -309,7 +343,6 @@ class EntityUtilities {
         const metadata = this.getPropertyMetadata(entity, key, type);
         const metadataDefaultString = metadata;
         const metadataTextboxString = metadata;
-        const metadataAutocompleteString = metadata;
         const metadataDefaultNumber = metadata;
         const objectProperty = entity[key];
         const metadataEntityArray = metadata;
@@ -324,7 +357,14 @@ class EntityUtilities {
             return false;
         }
         switch (type) {
+            case DecoratorTypes.BOOLEAN_DROPDOWN:
+            case DecoratorTypes.BOOLEAN_CHECKBOX:
+            case DecoratorTypes.BOOLEAN_TOGGLE:
+                return true;
+            case DecoratorTypes.STRING_DROPDOWN:
+                return true;
             case DecoratorTypes.STRING:
+            case DecoratorTypes.STRING_AUTOCOMPLETE:
                 if (metadataDefaultString.maxLength
                     && entity[key].length > metadataDefaultString.maxLength) {
                     return false;
@@ -338,20 +378,6 @@ class EntityUtilities {
                     return false;
                 }
                 break;
-            case DecoratorTypes.STRING_AUTOCOMPLETE:
-                if (metadataAutocompleteString.maxLength
-                    && entity[key].length > metadataAutocompleteString.maxLength) {
-                    return false;
-                }
-                if (metadataAutocompleteString.minLength
-                    && entity[key].length < metadataAutocompleteString.minLength) {
-                    return false;
-                }
-                if (metadataAutocompleteString.regex
-                    && !entity[key].match(metadataAutocompleteString.regex)) {
-                    return false;
-                }
-                break;
             case DecoratorTypes.STRING_TEXTBOX:
                 if (metadataTextboxString.maxLength
                     && entity[key].length > metadataTextboxString.maxLength) {
@@ -362,6 +388,8 @@ class EntityUtilities {
                     return false;
                 }
                 break;
+            case DecoratorTypes.NUMBER_DROPDOWN:
+                return true;
             case DecoratorTypes.NUMBER:
                 if (metadataDefaultNumber.max && entity[key] > metadataDefaultNumber.max) {
                     return false;
@@ -436,31 +464,29 @@ class EntityUtilities {
      * @returns 0 if both values have the same order, a negative value if X, a positive value if Y.
      */
     static compareOrder(a, b, entity) {
-        const metadataA = EntityUtilities.getPropertyMetadata(entity, a, EntityUtilities.getPropertyType(entity, a));
-        const metadataB = EntityUtilities.getPropertyMetadata(entity, b, EntityUtilities.getPropertyType(entity, b));
-        if (metadataA.order === -1) {
-            if (metadataB.order === -1) {
+        const metadataA = EntityUtilities.getPropertyMetadata(entity, a);
+        const metadataB = EntityUtilities.getPropertyMetadata(entity, b);
+        if (metadataA.position.order === -1) {
+            if (metadataB.position.order === -1) {
                 return 0;
             }
             return 1;
         }
-        else if (metadataB.order === -1) {
+        else if (metadataB.position.order === -1) {
             return -1;
         }
-        return ((metadataA.order) - (metadataB.order));
+        return ((metadataA.position.order) - (metadataB.position.order));
     }
     /**
      * Gets the bootstrap column values for "lg", "md", "sm".
      *
      * @param entity - Entity to get the bootstrap column values of the key.
      * @param key - Key of the property to get bootstrap column values from.
-     * @param type - Defines for which screensize the column values should be returned.
+     * @param type - Defines for which screen size the column values should be returned.
      * @returns Bootstrap column value.
      */
     static getWidth(entity, key, type) {
-        const propertyType = EntityUtilities.getPropertyType(entity, key);
-        const metadata = EntityUtilities.getPropertyMetadata(entity, key, propertyType);
-        metadata.defaultWidths = metadata.defaultWidths;
+        const metadata = EntityUtilities.getPropertyMetadata(entity, key);
         switch (type) {
             case 'lg':
                 return metadata.defaultWidths[0];
@@ -481,11 +507,67 @@ class EntityUtilities {
             Reflect.set(entity, key, Reflect.get(entityPriorChanges, key));
         }
     }
+    /**
+     * Gets the rows that are used to display the given entity.
+     *
+     * @param entity - The entity to get the rows from.
+     * @param hideOmitForCreate - Whether or not keys with the metadata omitForCreate should be filtered out.
+     * @param hideOmitForEdit - Whether or not keys with the metadata omitForUpdate should be filtered out.
+     * @returns The sorted Rows containing the row number and the keys to display in that row.
+     */
+    static getEntityRows(entity, hideOmitForCreate = false, hideOmitForEdit = false) {
+        const res = [];
+        const keys = EntityUtilities.keysOf(entity, hideOmitForCreate, hideOmitForEdit);
+        const numberOfRows = EntityUtilities.getNumberOfRows(keys, entity);
+        for (let i = 1; i <= numberOfRows; i++) {
+            const row = {
+                row: i,
+                keys: EntityUtilities.getKeysForRow(keys, entity, i)
+            };
+            res.push(row);
+        }
+        const lastRow = {
+            row: numberOfRows + 1,
+            keys: EntityUtilities.getKeysForRow(keys, entity, -1)
+        };
+        res.push(lastRow);
+        return res;
+    }
+    static getKeysForRow(keys, entity, i) {
+        return keys
+            .filter(k => EntityUtilities.getPropertyMetadata(entity, k).position.row === i)
+            .sort((a, b) => EntityUtilities.compareOrder(a, b, entity));
+    }
+    static getNumberOfRows(keys, entity) {
+        return keys
+            .map(k => EntityUtilities.getPropertyMetadata(entity, k).position.row)
+            .sort((a, b) => (a > b ? -1 : 1))[0];
+    }
+    /**
+     * Gets the keys of the provided entity correctly typed.
+     *
+     * @param entity - The entity to get the keys of.
+     * @param hideOmitForCreate - Whether or not keys with the metadata omitForCreate should be filtered out.
+     * @param hideOmitForEdit - Whether or not keys with the metadata omitForUpdate should be filtered out.
+     * @returns An array of keys of the entity.
+     */
+    static keysOf(entity, hideOmitForCreate = false, hideOmitForEdit = false) {
+        let keys = Reflect.ownKeys(entity);
+        if (hideOmitForCreate) {
+            const omitForCreateKeys = EntityUtilities.getOmitForCreate(entity);
+            keys = keys.filter(k => !omitForCreateKeys.includes(k));
+        }
+        if (hideOmitForEdit) {
+            const omitForUpdateKeys = EntityUtilities.getOmitForUpdate(entity);
+            keys = keys.filter(k => !omitForUpdateKeys.includes(k));
+        }
+        return keys;
+    }
 }
 _a = EntityUtilities;
-// eslint-disable-next-line @typescript-eslint/member-ordering
+// eslint-disable-next-line @typescript-eslint/member-ordering, jsdoc/require-jsdoc
 EntityUtilities.construct = _a.new;
-// eslint-disable-next-line @typescript-eslint/member-ordering
+// eslint-disable-next-line @typescript-eslint/member-ordering, jsdoc/require-jsdoc
 EntityUtilities.build = _a.new;
 
 /**
@@ -528,7 +610,7 @@ class EntityService {
         });
     }
     /**
-     * Gets all existing entities and pushes them to the entites array.
+     * Gets all existing entities and pushes them to the entities array.
      *
      * @returns A Promise of all received Entities.
      */
@@ -569,6 +651,52 @@ class EntityService {
     }
 }
 
+/**
+ * The abstract BaseBuilder class.
+ */
+class BaseBuilder {
+    constructor(data) {
+        this.validateInput(data);
+        this.inputData = data;
+        this.data = this.generateBaseData(data);
+        return this;
+    }
+    /**
+     * Used to validate the user input in the constructor.
+     *
+     * @param data - The user input.
+     */
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    validateInput(data) {
+        // By default, no validation is done
+    }
+    ;
+    /**
+     * Sets the value for the given key if no user value was provided.
+     *
+     * @param key - The key to set the default value for.
+     * @param value - The value to set when nothing was provided.
+     * @returns The Builder.
+     */
+    withDefault(key, value) {
+        if (!this.inputData || !this.inputData[key]) {
+            this.data[key] = value;
+        }
+        return this;
+    }
+    /**
+     * Method used to get the final build value after applying all chaining.
+     *
+     * @returns The build value.
+     */
+    getResult() {
+        return this.data;
+    }
+}
+
+/**
+ * The internal ConfirmDialogData. Requires all default values the user can leave out.
+ */
 class ConfirmDialogDataInternal {
     constructor(text, type, confirmButtonLabel, cancelButtonLabel, title, requireConfirmation, confirmationText) {
         this.text = text;
@@ -580,13 +708,18 @@ class ConfirmDialogDataInternal {
         this.confirmationText = confirmationText;
     }
 }
-class ConfirmDialogDataBuilder {
+/**
+ * The Builder for the ConfirmDialogData. Sets default values.
+ */
+class ConfirmDialogDataBuilder extends BaseBuilder {
     constructor(data) {
-        this.validateInput(data);
-        this.dataInput = data;
-        this.confirmDialogData = 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);
-        return this;
+        super(data);
+    }
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    generateBaseData(data) {
+        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);
     }
+    // eslint-disable-next-line jsdoc/require-jsdoc
     validateInput(data) {
         if (!data) {
             return;
@@ -602,57 +735,13 @@ class ConfirmDialogDataBuilder {
             throw new Error('The "cancelButtonLabel" will never be shown because "type" is set to "info-only"');
         }
     }
-    withDefaultText(text) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.text)) {
-            this.confirmDialogData.text = text;
-        }
-        return this;
-    }
-    withDefaultType(type) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.type)) {
-            this.confirmDialogData.type = type;
-        }
-        return this;
-    }
-    withDefaultConfirmButtonLabel(label) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.confirmButtonLabel)) {
-            this.confirmDialogData.confirmButtonLabel = label;
-        }
-        return this;
-    }
-    withDefaultCancelButtonLabel(label) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.cancelButtonLabel)) {
-            this.confirmDialogData.cancelButtonLabel = label;
-        }
-        return this;
-    }
-    withDefaultTitle(title) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.title)) {
-            this.confirmDialogData.title = title;
-        }
-        return this;
-    }
-    withDefaultRequireConfirmation(requireConfirmation) {
-        var _a;
-        if (((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.requireConfirmation) === undefined) {
-            this.confirmDialogData.requireConfirmation = requireConfirmation;
-        }
-        return this;
-    }
-    withDefaultConfirmationText(confirmationText) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.confirmationText)) {
-            this.confirmDialogData.confirmationText = confirmationText;
-        }
-        return this;
-    }
 }
 
+/**
+ * The Dialog used whenever confirmation by the user is required (e.g. When the user tries to delete an entity).
+ *
+ * Can be customized with the MAT_DIALOG_DATA "inputData". Customization options are defined in "ConfirmDialogData".
+ */
 class NgxMatEntityConfirmDialogComponent {
     constructor(dialogRef, inputData) {
         this.dialogRef = dialogRef;
@@ -660,18 +749,24 @@ class NgxMatEntityConfirmDialogComponent {
         this.confirm = false;
     }
     ngOnInit() {
-        this.data = new ConfirmDialogDataBuilder(this.inputData).confirmDialogData;
+        this.data = new ConfirmDialogDataBuilder(this.inputData).getResult();
         this.dialogRef.disableClose = true;
     }
+    /**
+     * Closes the dialog with value 1 to signal that the action should be run.
+     */
     confirmAction() {
         this.dialogRef.close(1);
     }
+    /**
+     * Closes the dialog.
+     */
     cancel() {
         this.dialogRef.close();
     }
 }
 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 });
-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: 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]" }] });
+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: i11.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: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i13.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i13.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]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityConfirmDialogComponent, decorators: [{
             type: Component,
             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"] }]
@@ -724,11 +819,18 @@ function getValidationErrorMessage(model) {
     else if (model.hasError('required')) {
         return 'required';
     }
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+    else if (model.hasError('pattern') && model.getError('pattern').requiredPattern === '^true$') {
+        return 'needs to be selected';
+    }
     else {
         return 'invalid input';
     }
 }
 
+/**
+ * The internal CreateDialogData. Requires all default values the user can leave out.
+ */
 class CreateDialogDataInternal {
     constructor(title, createButtonLabel, cancelButtonLabel, createRequiresConfirmDialog, confirmCreateDialogData) {
         this.title = title;
@@ -738,55 +840,27 @@ class CreateDialogDataInternal {
         this.confirmCreateDialogData = confirmCreateDialogData;
     }
 }
-class CreateDialogDataBuilder {
+/**
+ * The Builder for the CreateDialogData. Sets default values.
+ */
+class CreateDialogDataBuilder extends BaseBuilder {
     constructor(data) {
-        // this.validateInput(data);
-        this.dataInput = data;
-        const confirmCreateDialogData = new ConfirmDialogDataBuilder(data === null || data === void 0 ? void 0 : data.confirmCreateDialogData)
-            .withDefaultConfirmButtonLabel('Create')
-            .withDefaultText(['Do you really want to create this entity?'])
-            .withDefaultTitle('Create')
-            .confirmDialogData;
-        this.createDialogData = 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);
-        return this;
-    }
-    withDefaultTitle(title) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.title)) {
-            this.createDialogData.title = title;
-        }
-        return this;
-    }
-    withDefaultCreateButtonLabel(label) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.createButtonLabel)) {
-            this.createDialogData.createButtonLabel = label;
-        }
-        return this;
-    }
-    withDefaultCancelButtonLabel(label) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.cancelButtonLabel)) {
-            this.createDialogData.cancelButtonLabel = label;
-        }
-        return this;
-    }
-    withDefaultCreateRequiresConfirmDialog(createRequiresConfirmDialog) {
-        var _a;
-        if (((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.createRequiresConfirmDialog) === undefined) {
-            this.createDialogData.createRequiresConfirmDialog = createRequiresConfirmDialog;
-        }
-        return this;
+        super(data);
     }
-    withDefaultConfirmCreateDialogData(confirmCreateDialogData) {
-        var _a;
-        if (((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.confirmCreateDialogData) === undefined) {
-            this.createDialogData.confirmCreateDialogData = confirmCreateDialogData;
-        }
-        return this;
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    generateBaseData(data) {
+        const confirmCreateDialogData = new ConfirmDialogDataBuilder(data === null || data === void 0 ? void 0 : data.confirmCreateDialogData)
+            .withDefault('confirmButtonLabel', 'create')
+            .withDefault('text', ['Do you really want to create this entity?'])
+            .withDefault('title', 'Create')
+            .getResult();
+        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);
     }
 }
 
+/**
+ * The internal AddArrayItemDialogData. Requires all default values the user can leave out.
+ */
 class AddArrayItemDialogDataInternal {
     constructor(entity, createDialogData, getValidationErrorMessage) {
         this.entity = entity;
@@ -794,39 +868,51 @@ class AddArrayItemDialogDataInternal {
         this.getValidationErrorMessage = getValidationErrorMessage;
     }
 }
-class AddArrayItemDialogDataBuilder {
+/**
+ * The Builder for the AddArrayItemDialogData. Sets default values.
+ */
+class AddArrayItemDialogDataBuilder extends BaseBuilder {
     constructor(data) {
-        this.dataInput = data;
-        const createDialogData = new CreateDialogDataBuilder(data.createDialogData)
-            .withDefaultCreateButtonLabel('Add')
-            .withDefaultTitle('Add to array')
-            .createDialogData;
-        this.addArrayItemDialogData = new AddArrayItemDialogDataInternal(data.entity, createDialogData, data.getValidationErrorMessage ? data.getValidationErrorMessage : getValidationErrorMessage);
-        return this;
-    }
-    withDefaultCreateDialogData(createDialogData) {
-        if (!this.dataInput.createDialogData) {
-            this.addArrayItemDialogData.createDialogData = createDialogData;
-        }
-        return this;
+        super(data);
     }
-    withDefaultGetValidationErrorMessage(getValidationErrorMessage) {
-        if (!this.dataInput.getValidationErrorMessage) {
-            this.addArrayItemDialogData.getValidationErrorMessage = getValidationErrorMessage;
-        }
-        return this;
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    generateBaseData(data) {
+        const createDialogData = new CreateDialogDataBuilder(data.createDialogData)
+            .withDefault('createButtonLabel', 'Add')
+            .withDefault('title', 'Add to array')
+            .getResult();
+        return new AddArrayItemDialogDataInternal(data.entity, createDialogData, data.getValidationErrorMessage ? data.getValidationErrorMessage : getValidationErrorMessage);
     }
 }
 
-class NgxMatEntityInternalInputComponent {
-    constructor() {
+/**
+ * The default input component. It gets the metadata of the property from the given @Input "entity" and @Input "propertyKey"
+ * and displays the input field accordingly.
+ *
+ * You can also define a method that generates error-messages and if the input should be hidden when its metadata says
+ * that it should be omitted for creating or updating.
+ * The last part being mostly relevant if you want to use this component inside an ngFor.
+ */
+class NgxMatEntityInputComponent {
+    constructor(dialog) {
+        this.dialog = dialog;
+        this.chipsInput = '';
+        this.selection = new SelectionModel(true, []);
         this.DecoratorTypes = DecoratorTypes;
+        this.EntityUtilities = EntityUtilities;
         this.getWidth = EntityUtilities.getWidth;
     }
+    /**
+     * This is needed for the inputs to work inside an ngFor.
+     *
+     * @param index - The index of the element in the ngFor.
+     * @returns The index.
+     */
     trackByFn(index) {
         return index;
     }
     ngOnInit() {
+        var _a;
         if (!this.entity) {
             throw new Error('Missing required Input data "entity"');
         }
@@ -838,152 +924,113 @@ class NgxMatEntityInternalInputComponent {
         this.metadataDefaultString = this.metadata;
         this.metadataTextboxString = this.metadata;
         this.metadataAutocompleteString = this.metadata;
+        this.autocompleteStrings = this.metadataAutocompleteString.autocompleteValues;
+        this.filteredAutocompleteStrings = cloneDeep(this.autocompleteStrings);
         this.metadataDropdownString = this.metadata;
         this.metadataDropdownBoolean = this.metadata;
+        if ((this.type === DecoratorTypes.BOOLEAN_CHECKBOX || this.type === DecoratorTypes.BOOLEAN_TOGGLE)
+            && this.entity[this.propertyKey] === undefined) {
+            this.entity[this.propertyKey] = false;
+        }
         this.metadataDefaultNumber = this.metadata;
         this.metadataDropdownNumber = this.metadata;
         this.metadataDefaultObject = this.metadata;
         this.objectProperty = this.entity[this.propertyKey];
-    }
-    getObjectProperties() {
-        const res = [];
-        for (const property in this.objectProperty) {
-            const metadata = EntityUtilities.getPropertyMetadata(this.objectProperty, property, EntityUtilities.getPropertyType(this.objectProperty, property));
-            if (!(this.hideOmitForCreate && metadata.omitForCreate)
-                && !(this.hideOmitForEdit && metadata.omitForUpdate)) {
-                res.push(property);
+        if (this.type === DecoratorTypes.OBJECT) {
+            this.objectPropertyRows = EntityUtilities.getEntityRows(this.objectProperty, this.hideOmitForCreate, this.hideOmitForEdit);
+        }
+        this.metadataEntityArray = this.metadata;
+        if (this.type === DecoratorTypes.ARRAY) {
+            if (!this.entity[this.propertyKey]) {
+                this.entity[this.propertyKey] = [];
+            }
+            this.entityArrayValues = this.entity[this.propertyKey];
+            if (this.metadataEntityArray.createInline === undefined) {
+                this.metadataEntityArray.createInline = true;
             }
+            if (!this.metadataEntityArray.createInline && !this.metadataEntityArray.createDialogData) {
+                this.metadataEntityArray.createDialogData = {
+                    title: 'Add'
+                };
+            }
+            // TODO
+            const givenDisplayColumns = this.metadataEntityArray.displayColumns.map((v) => v.displayName);
+            if (givenDisplayColumns.find((s) => s === 'select')) {
+                throw new Error(`The name "select" for a display column is reserved.
+                    Please choose a different name.`);
+            }
+            this.displayedColumns = ['select'].concat(givenDisplayColumns);
+            this.dataSource = new MatTableDataSource();
+            this.dataSource.data = this.entityArrayValues;
+            this.arrayItem = new this.metadataEntityArray.EntityClass();
+            this.arrayItemInlineRows = EntityUtilities.getEntityRows(this.arrayItem, this.hideOmitForCreate === false ? false : true, this.hideOmitForEdit ? true : false);
+            this.arrayItemPriorChanges = cloneDeep(this.arrayItem);
+            this.dialogInputData = {
+                entity: this.arrayItem,
+                createDialogData: this.metadataEntityArray.createDialogData,
+                getValidationErrorMessage: this.getValidationErrorMessage
+            };
+            this.dialogData = new AddArrayItemDialogDataBuilder(this.dialogInputData).getResult();
+            this.arrayItemDialogRows = EntityUtilities.getEntityRows(this.dialogData.entity, true);
+        }
+        this.metadataStringChipsArray = this.metadata;
+        if ((this.type === DecoratorTypes.ARRAY_STRING_CHIPS || this.type === DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS)
+            && ((_a = this.entity[this.propertyKey]) === null || _a === void 0 ? void 0 : _a.length)) {
+            this.stringChipsArrayValues = this.entity[this.propertyKey];
+        }
+        this.metadataAutocompleteStringChipsArray = this.metadata;
+        if (!this.getValidationErrorMessage) {
+            this.getValidationErrorMessage = getValidationErrorMessage;
         }
-        return res.sort((a, b) => EntityUtilities.compareOrder(a, b, this.objectProperty));
-    }
-}
-NgxMatEntityInternalInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-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]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputComponent, decorators: [{
-            type: Component,
-            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"] }]
-        }], propDecorators: { entity: [{
-                type: Input
-            }], propertyKey: [{
-                type: Input
-            }], hideOmitForCreate: [{
-                type: Input
-            }], hideOmitForEdit: [{
-                type: Input
-            }], getValidationErrorMessage: [{
-                type: Input
-            }] } });
-
-class NgxMatEntityAddArrayItemDialogComponent {
-    constructor(inputData, dialogRef) {
-        this.inputData = inputData;
-        this.dialogRef = dialogRef;
-        this.EntityUtilities = EntityUtilities;
-        this.getWidth = EntityUtilities.getWidth;
     }
-    ngOnInit() {
-        this.data = new AddArrayItemDialogDataBuilder(this.inputData).addArrayItemDialogData;
-        this.dialogRef.disableClose = true;
-        this.setEntityKeys();
+    /**
+     * Tries to add an item to the array.
+     * Does this either inline if the "createInline"-metadata is set to true
+     * or in a separate dialog if it is set to false.
+     */
+    add() {
+        if (this.metadataEntityArray.createInline) {
+            this.entityArrayValues.push(cloneDeep(this.arrayItem));
+            this.dataSource.data = this.entityArrayValues;
+            EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
+        }
+        else {
+            this.addArrayItemDialogRef = this.dialog.open(this.addArrayItemDialog, {
+                data: this.dialogData,
+                autoFocus: false,
+                restoreFocus: false
+            });
+        }
     }
-    setEntityKeys() {
-        this.entityKeys = Reflect.ownKeys(this.data.entity);
-        const omitCreateKeys = EntityUtilities.getOmitForCreate(this.data.entity);
-        this.entityKeys = this.entityKeys.filter((k) => !omitCreateKeys.includes(k))
-            .sort((a, b) => EntityUtilities.compareOrder(a, b, this.data.entity));
+    /**
+     * Adds the array item defined in the dialog.
+     */
+    addArrayItem() {
+        this.addArrayItemDialogRef.close();
+        this.entityArrayValues.push(cloneDeep(this.arrayItem));
+        this.dataSource.data = this.entityArrayValues;
+        EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
     }
-    create() {
-        this.dialogRef.close(1);
+    /**
+     * Cancels adding the array item defined in the dialog.
+     */
+    cancelAddArrayItem() {
+        this.addArrayItemDialogRef.close();
+        EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
     }
-    cancel() {
-        this.dialogRef.close();
-    }
-}
-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 });
-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}}\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: 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]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogComponent, decorators: [{
-            type: Component,
-            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}}\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"] }]
-        }], ctorParameters: function () {
-        return [{ type: undefined, decorators: [{
-                        type: Inject,
-                        args: [MAT_DIALOG_DATA]
-                    }] }, { type: i1.MatDialogRef }];
-    } });
-
-class NgxMatEntityArrayTableComponent {
-    constructor(dialog) {
-        this.dialog = dialog;
-        this.selection = new SelectionModel(true, []);
-        this.getWidth = EntityUtilities.getWidth;
-        this.EntityUtilities = EntityUtilities;
-    }
-    trackByFn(index) {
-        return index;
-    }
-    ngOnInit() {
-        const givenDisplayColumns = this.metadata.displayColumns.map((v) => v.displayName);
-        this.validateInput(givenDisplayColumns);
-        this.displayedColumns = ['select'].concat(givenDisplayColumns);
-        this.dataSource = new MatTableDataSource();
-        this.dataSource.data = this.arrayItems;
-        this.arrayItem = new this.metadata.EntityClass();
-        this.arrayItemPriorChanges = cloneDeep(this.arrayItem);
-    }
-    validateInput(givenDisplayColumns) {
-        if (givenDisplayColumns.find((s) => s === 'select')) {
-            throw new Error(`The name "select" for a display column is reserved.
-                Please choose a different name.`);
-        }
-        if (!this.metadata.createInline && !this.metadata.createDialogData) {
-            throw new Error(`Missing required Input data "createDialogData".
-                You can only omit this value when the creation is inline.`);
-        }
-    }
-    add() {
-        if (this.metadata.createInline) {
-            this.arrayItems.push(cloneDeep(this.arrayItem));
-            this.dataSource.data = this.arrayItems;
-            EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
-        }
-        else {
-            const dialogInputData = {
-                entity: this.arrayItem,
-                createDialogData: this.metadata.createDialogData,
-                getValidationErrorMessage: this.getValidationErrorMessage
-            };
-            const dialogData = new AddArrayItemDialogDataBuilder(dialogInputData)
-                .addArrayItemDialogData;
-            firstValueFrom(this.dialog.open(NgxMatEntityAddArrayItemDialogComponent, {
-                data: dialogData,
-                autoFocus: false,
-                restoreFocus: false
-            }).afterClosed()).then((res) => {
-                if (res === 1) {
-                    this.arrayItems.push(cloneDeep(this.arrayItem));
-                    this.dataSource.data = this.arrayItems;
-                }
-                EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
-            });
-        }
-    }
-    remove() {
-        this.selection.selected.forEach(s => {
-            this.arrayItems.splice(this.arrayItems.indexOf(s), 1);
-        });
-        this.dataSource.data = this.arrayItems;
-        this.selection.clear();
-    }
-    getObjectProperties() {
-        const res = [];
-        for (const property in this.arrayItem) {
-            const metadata = EntityUtilities.getPropertyMetadata(this.arrayItem, property, EntityUtilities.getPropertyType(this.arrayItem, property));
-            if (!(metadata.omitForCreate)) {
-                res.push(property);
-            }
-        }
-        return res.sort((a, b) => EntityUtilities.compareOrder(a, b, this.arrayItem));
+    /**
+     * Removes all selected entries from the array.
+     */
+    remove() {
+        this.selection.selected.forEach(s => {
+            this.entityArrayValues.splice(this.entityArrayValues.indexOf(s), 1);
+        });
+        this.dataSource.data = this.entityArrayValues;
+        this.selection.clear();
     }
+    /**
+     * Toggles all array-items in the table.
+     */
     masterToggle() {
         if (this.isAllSelected()) {
             this.selection.clear();
@@ -992,93 +1039,28 @@ class NgxMatEntityArrayTableComponent {
             this.dataSource.data.forEach((row) => this.selection.select(row));
         }
     }
+    /**
+     * Checks if all array-items in the table have been selected.
+     * This is needed to display the "masterToggle"-checkbox correctly.
+     *
+     * @returns Whether or not all array-items in the table have been selected.
+     */
     isAllSelected() {
         const numSelected = this.selection.selected.length;
         const numRows = this.dataSource.data.length;
         return numSelected === numRows;
     }
-}
-NgxMatEntityArrayTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableComponent, deps: [{ token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
-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}}\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.8px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:25.8px;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"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableComponent, decorators: [{
-            type: Component,
-            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}}\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.8px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:25.8px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.MatDialog }]; }, propDecorators: { arrayItems: [{
-                type: Input
-            }], metadata: [{
-                type: Input
-            }], getValidationErrorMessage: [{
-                type: Input
-            }], omit: [{
-                type: Input
-            }] } });
-
-class NgxMatEntityInputComponent {
-    constructor() {
-        this.chipsInput = '';
-        this.DecoratorTypes = DecoratorTypes;
-        this.getWidth = EntityUtilities.getWidth;
-    }
-    trackByFn(index) {
-        return index;
-    }
-    ngOnInit() {
-        var _a;
-        if (!this.entity) {
-            throw new Error('Missing required Input data "entity"');
-        }
-        if (!this.propertyKey) {
-            throw new Error('Missing required Input data "propertyKey"');
-        }
-        this.type = EntityUtilities.getPropertyType(this.entity, this.propertyKey);
-        this.metadata = EntityUtilities.getPropertyMetadata(this.entity, this.propertyKey, this.type);
-        this.metadataDefaultString = this.metadata;
-        this.metadataTextboxString = this.metadata;
-        this.metadataAutocompleteString = this.metadata;
-        this.autocompleteStrings = this.metadataAutocompleteString.autocompleteValues;
-        this.filteredAutocompleteStrings = cloneDeep(this.autocompleteStrings);
-        this.metadataDropdownString = this.metadata;
-        this.metadataDropdownBoolean = this.metadata;
-        this.metadataDefaultNumber = this.metadata;
-        this.metadataDropdownNumber = this.metadata;
-        this.metadataDefaultObject = this.metadata;
-        this.objectProperty = this.entity[this.propertyKey];
-        this.metadataEntityArray = this.metadata;
-        if (this.metadataEntityArray.EntityClass) {
-            if (!this.entity[this.propertyKey]) {
-                this.entity[this.propertyKey] = [];
-            }
-            this.entityArrayValues = this.entity[this.propertyKey];
-            if (this.metadataEntityArray.createInline === undefined) {
-                this.metadataEntityArray.createInline = true;
-            }
-            if (!this.metadataEntityArray.createInline && !this.metadataEntityArray.createDialogData) {
-                this.metadataEntityArray.createDialogData = {
-                    title: 'Add'
-                };
-            }
-        }
-        this.metadataStringChipsArray = this.metadata;
-        if (this.metadataStringChipsArray.itemType
-            && ((_a = this.entity[this.propertyKey]) === null || _a === void 0 ? void 0 : _a.length)) {
-            this.stringChipsArrayValues = this.entity[this.propertyKey];
-        }
-        this.metadataAutocompleteStringChipsArray = this.metadata;
-        if (!this.getValidationErrorMessage) {
-            this.getValidationErrorMessage = getValidationErrorMessage;
-        }
-    }
-    getObjectProperties() {
-        const res = [];
-        for (const property in this.objectProperty) {
-            const metadata = EntityUtilities.getPropertyMetadata(this.objectProperty, property, EntityUtilities.getPropertyType(this.objectProperty, property));
-            if (!(this.hideOmitForCreate && metadata.omitForCreate)
-                && !(this.hideOmitForEdit && metadata.omitForUpdate)) {
-                res.push(property);
-            }
-        }
-        return res.sort((a, b) => EntityUtilities.compareOrder(a, b, this.objectProperty));
-    }
+    /**
+     * Handles adding strings to the chipsArray.
+     * Checks validation and also creates a new array if it is undefined.
+     * This is needed because two things are validated: The array itself
+     * and the contents of the array. And we need a way to display an
+     * mat-error. As the only validation for the array is whether or not
+     * it contains values, we can set it to undefined when the last element is removed
+     * (removeStringChipArrayValue). That way we can use the "required" validator.
+     *
+     * @param event - The event that fires when a new chip is completed.
+     */
     addStringChipArrayValue(event) {
         const value = (event.value || '').trim();
         if (value) {
@@ -1101,6 +1083,16 @@ class NgxMatEntityInputComponent {
         }
         event.chipInput.clear();
     }
+    /**
+     * Removes the given value from the array.
+     * Sets the array to undefined if it is now empty.
+     * This is needed because two things are validated: The array itself
+     * and the contents of the array. And we need a way to display an
+     * mat-error. As the only validation for the array is whether or not
+     * it is empty, setting it to undefined here enables us to use the "required" validator.
+     *
+     * @param value - The string to remove from the array.
+     */
     removeStringChipArrayValue(value) {
         this.stringChipsArrayValues.splice(this.stringChipsArrayValues.indexOf(value), 1);
         if (!this.stringChipsArrayValues.length) {
@@ -1108,6 +1100,12 @@ class NgxMatEntityInputComponent {
             this.stringChipsArrayValues = this.entity[this.propertyKey];
         }
     }
+    /**
+     * Handles adding a string to the array when an autocomplete value has been selected.
+     *
+     * @param event - The autocomplete selected event.
+     * @param chipsInput - The element where the user typed the value.
+     */
     selected(event, chipsInput) {
         const value = (event.option.viewValue || '').trim();
         if (this.metadataStringChipsArray.minLength && value.length < this.metadataStringChipsArray.minLength) {
@@ -1128,17 +1126,22 @@ class NgxMatEntityInputComponent {
         this.stringChipsArrayValues.push(value);
         chipsInput.value = '';
     }
+    /**
+     * Dynamically filters the Autocomplete options when the user inputs something.
+     *
+     * @param input - The input of the user.
+     */
     filterAutocompleteStrings(input) {
         const filterValue = input.toLowerCase();
         this.filteredAutocompleteStrings = this.autocompleteStrings.filter(s => s.toLowerCase().includes(filterValue));
     }
 }
-NgxMatEntityInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-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\"\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>\n            <mat-checkbox [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required\">\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\">\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\">\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        <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' : 'update'\"\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\"\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\"\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]" }] });
+NgxMatEntityInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputComponent, deps: [{ token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
+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-{{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 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-{{getWidth(arrayItem, key, 'lg')}} col-md-{{getWidth(arrayItem, key, 'md')}} col-sm-{{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    <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-{{getWidth(dialogData.entity, key, 'lg')}} col-md-{{getWidth(dialogData.entity, key, 'md')}} col-sm-{{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}\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"] }], directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i11.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2.MatLabel, selector: "mat-label" }, { type: i12.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: i13.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: i13.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i13.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i13.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i13.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i13.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { type: i13.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i2.MatError, selector: "mat-error", inputs: ["id"] }, { type: i14.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i3$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i13.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i13.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i13.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.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: i13.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i13.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i13.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]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputComponent, decorators: [{
             type: Component,
-            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>\n            <mat-checkbox [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required\">\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\">\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\">\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        <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' : 'update'\"\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\"\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\"\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"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { entity: [{
+            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-{{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 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-{{getWidth(arrayItem, key, 'lg')}} col-md-{{getWidth(arrayItem, key, 'md')}} col-sm-{{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    <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-{{getWidth(dialogData.entity, key, 'lg')}} col-md-{{getWidth(dialogData.entity, key, 'md')}} col-sm-{{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}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.MatDialog }]; }, propDecorators: { entity: [{
                 type: Input
             }], propertyKey: [{
                 type: Input
@@ -1148,115 +1151,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 type: Input
             }], hideOmitForEdit: [{
                 type: Input
+            }], addArrayItemDialog: [{
+                type: ViewChild,
+                args: ['addArrayItemDialog']
             }] } });
 
-class NgxMatEntityInternalInputModule {
-}
-NgxMatEntityInternalInputModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NgxMatEntityInternalInputModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputModule, declarations: [NgxMatEntityInternalInputComponent], imports: [CommonModule,
-        MatInputModule,
-        FormsModule,
-        MatFormFieldModule,
-        MatSelectModule,
-        MatAutocompleteModule,
-        MatCheckboxModule,
-        MatSlideToggleModule,
-        MatTableModule], exports: [NgxMatEntityInternalInputComponent] });
-NgxMatEntityInternalInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputModule, imports: [[
-            CommonModule,
-            MatInputModule,
-            FormsModule,
-            MatFormFieldModule,
-            MatSelectModule,
-            MatAutocompleteModule,
-            MatCheckboxModule,
-            MatSlideToggleModule,
-            MatTableModule
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NgxMatEntityInternalInputComponent],
-                    imports: [
-                        CommonModule,
-                        MatInputModule,
-                        FormsModule,
-                        MatFormFieldModule,
-                        MatSelectModule,
-                        MatAutocompleteModule,
-                        MatCheckboxModule,
-                        MatSlideToggleModule,
-                        MatTableModule
-                    ],
-                    exports: [NgxMatEntityInternalInputComponent]
-                }]
-        }] });
-
-class NgxMatEntityAddArrayItemDialogModule {
-}
-NgxMatEntityAddArrayItemDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-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] });
-NgxMatEntityAddArrayItemDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogModule, imports: [[CommonModule, NgxMatEntityInternalInputModule, MatDialogModule, FormsModule, MatButtonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NgxMatEntityAddArrayItemDialogComponent],
-                    imports: [CommonModule, NgxMatEntityInternalInputModule, MatDialogModule, FormsModule, MatButtonModule],
-                    exports: [NgxMatEntityAddArrayItemDialogComponent]
-                }]
-        }] });
-
-class NgxMatEntityArrayTableModule {
-}
-NgxMatEntityArrayTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NgxMatEntityArrayTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableModule, declarations: [NgxMatEntityArrayTableComponent], imports: [CommonModule,
-        MatInputModule,
-        FormsModule,
-        MatFormFieldModule,
-        MatSelectModule,
-        MatAutocompleteModule,
-        MatCheckboxModule,
-        MatSlideToggleModule,
-        MatTableModule,
-        NgxMatEntityInternalInputModule,
-        MatButtonModule,
-        NgxMatEntityAddArrayItemDialogModule], exports: [NgxMatEntityArrayTableComponent] });
-NgxMatEntityArrayTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableModule, imports: [[
-            CommonModule,
-            MatInputModule,
-            FormsModule,
-            MatFormFieldModule,
-            MatSelectModule,
-            MatAutocompleteModule,
-            MatCheckboxModule,
-            MatSlideToggleModule,
-            MatTableModule,
-            NgxMatEntityInternalInputModule,
-            MatButtonModule,
-            NgxMatEntityAddArrayItemDialogModule
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NgxMatEntityArrayTableComponent],
-                    imports: [
-                        CommonModule,
-                        MatInputModule,
-                        FormsModule,
-                        MatFormFieldModule,
-                        MatSelectModule,
-                        MatAutocompleteModule,
-                        MatCheckboxModule,
-                        MatSlideToggleModule,
-                        MatTableModule,
-                        NgxMatEntityInternalInputModule,
-                        MatButtonModule,
-                        NgxMatEntityAddArrayItemDialogModule
-                    ],
-                    exports: [NgxMatEntityArrayTableComponent]
-                }]
-        }] });
-
 class NgxMatEntityInputModule {
 }
 NgxMatEntityInputModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
@@ -1268,9 +1167,11 @@ NgxMatEntityInputModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0",
         MatAutocompleteModule,
         MatCheckboxModule,
         MatSlideToggleModule,
-        NgxMatEntityArrayTableModule,
         MatChipsModule,
-        MatIconModule], exports: [NgxMatEntityInputComponent] });
+        MatIconModule,
+        MatTableModule,
+        MatDialogModule,
+        MatButtonModule], exports: [NgxMatEntityInputComponent] });
 NgxMatEntityInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, imports: [[
             CommonModule,
             MatInputModule,
@@ -1280,14 +1181,18 @@ NgxMatEntityInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0",
             MatAutocompleteModule,
             MatCheckboxModule,
             MatSlideToggleModule,
-            NgxMatEntityArrayTableModule,
             MatChipsModule,
-            MatIconModule
+            MatIconModule,
+            MatTableModule,
+            MatDialogModule,
+            MatButtonModule
         ]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [NgxMatEntityInputComponent],
+                    declarations: [
+                        NgxMatEntityInputComponent,
+                    ],
                     imports: [
                         CommonModule,
                         MatInputModule,
@@ -1297,14 +1202,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         MatAutocompleteModule,
                         MatCheckboxModule,
                         MatSlideToggleModule,
-                        NgxMatEntityArrayTableModule,
                         MatChipsModule,
-                        MatIconModule
+                        MatIconModule,
+                        MatTableModule,
+                        MatDialogModule,
+                        MatButtonModule
                     ],
                     exports: [NgxMatEntityInputComponent]
                 }]
         }] });
 
+/**
+ * The internal CreateEntityDialogData. Requires all default values the user can leave out.
+ */
 class CreateEntityDialogDataInternal {
     constructor(entity, EntityServiceClass, createDialogData) {
         this.entity = entity;
@@ -1312,16 +1222,26 @@ class CreateEntityDialogDataInternal {
         this.createDialogData = createDialogData;
     }
 }
-class CreateEntityDialogDataBuilder {
+/**
+ * The Builder for the CreateEntityDialogData. Sets default values.
+ */
+class CreateEntityDialogDataBuilder extends BaseBuilder {
     constructor(data) {
-        // this.validateInput(data);
-        this.dataInput = data;
-        const createDialogData = new CreateDialogDataBuilder(data.createDialogData).createDialogData;
-        this.createDialogData = new CreateEntityDialogDataInternal(data.entity, data.EntityServiceClass, createDialogData);
-        return this;
+        super(data);
+    }
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    generateBaseData(data) {
+        const createDialogData = new CreateDialogDataBuilder(data.createDialogData).getResult();
+        return new CreateEntityDialogDataInternal(data.entity, data.EntityServiceClass, createDialogData);
     }
 }
 
+/**
+ * The default dialog used to create new entities based on the configuration passed in the MAT_DIALOG_DATA "inputData".
+ * Used by the ngx-mat-entity-table.
+ *
+ * It offers a lot of customization options which can be found in "CreateEntityDialogData".
+ */
 class NgxMatEntityCreateDialogComponent {
     constructor(inputData, dialogRef, injector, dialog) {
         this.inputData = inputData;
@@ -1332,33 +1252,31 @@ class NgxMatEntityCreateDialogComponent {
         this.getWidth = EntityUtilities.getWidth;
     }
     ngOnInit() {
-        this.data = new CreateEntityDialogDataBuilder(this.inputData).createDialogData;
+        this.data = new CreateEntityDialogDataBuilder(this.inputData).getResult();
         this.dialogRef.disableClose = true;
-        this.setEntityKeys();
+        this.entityRows = EntityUtilities.getEntityRows(this.data.entity, true);
         this.entityService = this.injector.get(this.data.EntityServiceClass);
     }
-    setEntityKeys() {
-        this.entityKeys = Reflect.ownKeys(this.data.entity);
-        const omitCreateKeys = EntityUtilities.getOmitForCreate(this.data.entity);
-        this.entityKeys = this.entityKeys.filter((k) => !omitCreateKeys.includes(k))
-            .sort((a, b) => EntityUtilities.compareOrder(a, b, this.data.entity));
-    }
+    /**
+     * Tries add the new entity and close the dialog afterwards.
+     * Also handles the confirmation if required.
+     */
     create() {
         var _a, _b;
         if (!((_a = this.data.createDialogData) === null || _a === void 0 ? void 0 : _a.createRequiresConfirmDialog)) {
             return this.confirmCreate();
         }
         const dialogData = new ConfirmDialogDataBuilder((_b = this.data.createDialogData) === null || _b === void 0 ? void 0 : _b.confirmCreateDialogData)
-            .withDefaultText(['Do you really want to create this entity?'])
-            .withDefaultConfirmButtonLabel('Create')
-            .withDefaultTitle('Create')
-            .confirmDialogData;
-        const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
+            .withDefault('text', ['Do you really want to create this entity?'])
+            .withDefault('confirmButtonLabel', 'Create')
+            .withDefault('title', 'Create')
+            .getResult();
+        const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
             data: dialogData,
             autoFocus: false,
             restoreFocus: false
         });
-        dialogref.afterClosed().subscribe((res) => {
+        dialogRef.afterClosed().subscribe((res) => {
             if (res === 1) {
                 this.confirmCreate();
             }
@@ -1367,15 +1285,18 @@ class NgxMatEntityCreateDialogComponent {
     confirmCreate() {
         this.entityService.create(this.data.entity).then(() => this.dialogRef.close());
     }
+    /**
+     * Closes the dialog.
+     */
     cancel() {
         this.dialogRef.close();
     }
 }
 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 });
-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}}\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: 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]" }] });
+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: i13.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i13.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i13.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogComponent, decorators: [{
             type: Component,
-            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}}\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"] }]
+            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"] }]
         }], ctorParameters: function () {
         return [{ type: undefined, decorators: [{
                         type: Inject,
@@ -1383,6 +1304,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     }] }, { type: i1.MatDialogRef }, { type: i0.Injector }, { type: i1.MatDialog }];
     } });
 
+/**
+ * The internal EditDialogData. Requires all default values the user can leave out.
+ */
 class EditDialogDataInternal {
     constructor(title, confirmButtonLabel, deleteButtonLabel, cancelButtonLabel, deleteRequiresConfirmDialog, editRequiresConfirmDialog, confirmDeleteDialogData, confirmEditDialogData) {
         this.title = title;
@@ -1395,82 +1319,33 @@ class EditDialogDataInternal {
         this.confirmEditDialogData = confirmEditDialogData;
     }
 }
-class EditDialogDataBuilder {
+/**
+ * The Builder for the EditDialogData. Sets default values.
+ */
+class EditDialogDataBuilder extends BaseBuilder {
     constructor(data) {
-        // this.validateInput(data);
-        this.dataInput = data;
+        super(data);
+    }
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    generateBaseData(data) {
         const confirmEditDialogData = new ConfirmDialogDataBuilder(data === null || data === void 0 ? void 0 : data.confirmEditDialogData)
-            .withDefaultConfirmButtonLabel('Save')
-            .withDefaultText(['Do you really want to save all changes?'])
-            .withDefaultTitle('Edit')
-            .confirmDialogData;
+            .withDefault('confirmButtonLabel', 'Save')
+            .withDefault('text', ['Do you really want to save all changes?'])
+            .withDefault('title', 'Edit')
+            .getResult();
         const confirmDeleteDialogData = new ConfirmDialogDataBuilder(data === null || data === void 0 ? void 0 : data.confirmDeleteDialogData)
-            .withDefaultConfirmButtonLabel('Delete')
-            .withDefaultType('delete')
-            .withDefaultText(['Do you really want to delete this entity?'])
-            .withDefaultTitle('Delete')
-            .confirmDialogData;
-        this.editDialogData = 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);
-        return this;
-    }
-    withDefaultTitle(title) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.title)) {
-            this.editDialogData.title = title;
-        }
-        return this;
-    }
-    withDefaultConfirmButtonLabel(label) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.confirmButtonLabel)) {
-            this.editDialogData.confirmButtonLabel = label;
-        }
-        return this;
-    }
-    withDefaultDeleteButtonLabel(label) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.deleteButtonLabel)) {
-            this.editDialogData.deleteButtonLabel = label;
-        }
-        return this;
-    }
-    withDefaultCancelButtonLabel(label) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.cancelButtonLabel)) {
-            this.editDialogData.cancelButtonLabel = label;
-        }
-        return this;
-    }
-    withDefaultDeleteRequiresConfirmDialog(deleteRequiresConfirmDialog) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.deleteRequiresConfirmDialog)) {
-            this.editDialogData.deleteRequiresConfirmDialog = deleteRequiresConfirmDialog;
-        }
-        return this;
-    }
-    withDefaultEditRequiresConfirmDialog(editRequiresConfirmDialog) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.editRequiresConfirmDialog)) {
-            this.editDialogData.editRequiresConfirmDialog = editRequiresConfirmDialog;
-        }
-        return this;
-    }
-    withDefaultConfirmDeleteDialogData(confirmDeleteDialogData) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.confirmDeleteDialogData)) {
-            this.editDialogData.confirmDeleteDialogData = confirmDeleteDialogData;
-        }
-        return this;
-    }
-    withDefaultConfirmEditDialogData(confirmEditDialogData) {
-        var _a;
-        if (!((_a = this.dataInput) === null || _a === void 0 ? void 0 : _a.confirmEditDialogData)) {
-            this.editDialogData.confirmEditDialogData = confirmEditDialogData;
-        }
-        return this;
+            .withDefault('confirmButtonLabel', 'Delete')
+            .withDefault('type', 'delete')
+            .withDefault('text', ['Do you really want to delete this entity?'])
+            .withDefault('title', 'Delete')
+            .getResult();
+        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);
     }
 }
 
+/**
+ * The internal EditEntityDialogData. Requires all default values the user can leave out.
+ */
 class EditEntityDialogDataInternal {
     constructor(entity, EntityServiceClass, editDialogData, allowDelete) {
         this.entity = entity;
@@ -1479,16 +1354,26 @@ class EditEntityDialogDataInternal {
         this.allowDelete = allowDelete;
     }
 }
-class EditEntityDialogDataBuilder {
+/**
+ * The Builder for the EditEntityDialogData. Sets default values.
+ */
+class EditEntityDialogDataBuilder extends BaseBuilder {
     constructor(data) {
-        // this.validateInput(data);
-        this.dataInput = data;
-        const editDialogData = new EditDialogDataBuilder(data.editDialogData).editDialogData;
-        this.editDialogData = new EditEntityDialogDataInternal(data.entity, data.EntityServiceClass, editDialogData, data.allowDelete ? data.allowDelete : () => true);
-        return this;
+        super(data);
+    }
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    generateBaseData(data) {
+        const editDialogData = new EditDialogDataBuilder(data.editDialogData).getResult();
+        return new EditEntityDialogDataInternal(data.entity, data.EntityServiceClass, editDialogData, data.allowDelete ? data.allowDelete : () => true);
     }
 }
 
+/**
+ * The default dialog used to edit an existing entity based on the configuration passed in the MAT_DIALOG_DATA "inputData".
+ * Used by the ngx-mat-entity-table.
+ *
+ * It offers a lot of customization options which can be found in "EditEntityDialogData".
+ */
 class NgxMatEntityEditDialogComponent {
     constructor(inputData, dialogRef, injector, dialog) {
         this.inputData = inputData;
@@ -1499,33 +1384,31 @@ class NgxMatEntityEditDialogComponent {
         this.getWidth = EntityUtilities.getWidth;
     }
     ngOnInit() {
-        this.data = new EditEntityDialogDataBuilder(this.inputData).editDialogData;
+        this.data = new EditEntityDialogDataBuilder(this.inputData).getResult();
         this.dialogRef.disableClose = true;
-        this.setEntityKeys();
+        this.entityRows = EntityUtilities.getEntityRows(this.data.entity, false, true);
         this.entityService = this.injector.get(this.data.EntityServiceClass);
         this.entityPriorChanges = cloneDeep(this.data.entity);
     }
-    setEntityKeys() {
-        this.entityKeys = Reflect.ownKeys(this.data.entity);
-        const omitUpdateKeys = EntityUtilities.getOmitForUpdate(this.data.entity);
-        this.entityKeys = this.entityKeys.filter((k) => !omitUpdateKeys.includes(k))
-            .sort((a, b) => EntityUtilities.compareOrder(a, b, this.data.entity));
-    }
+    /**
+     * Tries to save the changes and close the dialog afterwards.
+     * Also handles the confirmation if required.
+     */
     edit() {
         if (!this.data.editDialogData.editRequiresConfirmDialog) {
             return this.confirmEdit();
         }
         const dialogData = new ConfirmDialogDataBuilder(this.data.editDialogData.confirmEditDialogData)
-            .withDefaultText(['Do you really want to save all changes?'])
-            .withDefaultConfirmButtonLabel('Save')
-            .withDefaultTitle('Edit')
-            .confirmDialogData;
-        const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
+            .withDefault('text', ['Do you really want to save all changes?'])
+            .withDefault('confirmButtonLabel', 'Save')
+            .withDefault('title', 'Edit')
+            .getResult();
+        const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
             data: dialogData,
             autoFocus: false,
             restoreFocus: false
         });
-        dialogref.afterClosed().subscribe((res) => {
+        dialogRef.afterClosed().subscribe((res) => {
             if (res === 1) {
                 this.confirmEdit();
             }
@@ -1534,22 +1417,26 @@ class NgxMatEntityEditDialogComponent {
     confirmEdit() {
         this.entityService.update(this.data.entity, this.entityPriorChanges).then(() => this.dialogRef.close(1));
     }
+    /**
+     * Tries to delete the entity and close the dialog afterwards.
+     * Also handles the confirmation if required.
+     */
     delete() {
         if (!this.data.editDialogData.deleteRequiresConfirmDialog) {
             return this.confirmDelete();
         }
         const dialogData = new ConfirmDialogDataBuilder(this.data.editDialogData.confirmDeleteDialogData)
-            .withDefaultText(['Do you really want to delete this entity?'])
-            .withDefaultType('delete')
-            .withDefaultConfirmButtonLabel('Delete')
-            .withDefaultTitle('Delete')
-            .confirmDialogData;
-        const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
+            .withDefault('text', ['Do you really want to delete this entity?'])
+            .withDefault('type', 'delete')
+            .withDefault('confirmButtonLabel', 'Delete')
+            .withDefault('title', 'Delete')
+            .getResult();
+        const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
             data: dialogData,
             autoFocus: false,
             restoreFocus: false
         });
-        dialogref.afterClosed().subscribe((res) => {
+        dialogRef.afterClosed().subscribe((res) => {
             if (res === 1) {
                 this.confirmDelete();
             }
@@ -1558,16 +1445,19 @@ class NgxMatEntityEditDialogComponent {
     confirmDelete() {
         this.entityService.delete(this.entityPriorChanges.id).then(() => this.dialogRef.close(2));
     }
+    /**
+     * Reverts all changes made and closes the dialog.
+     */
     cancel() {
         EntityUtilities.resetChangesOnEntity(this.data.entity, this.entityPriorChanges);
         this.dialogRef.close(0);
     }
 }
 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 });
-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        <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, '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: 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]" }] });
+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: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i13.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i13.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i13.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogComponent, decorators: [{
             type: Component,
-            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        <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, '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"] }]
+            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"] }]
         }], ctorParameters: function () {
         return [{ type: undefined, decorators: [{
                         type: Inject,
@@ -1575,6 +1465,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     }] }, { type: i1.MatDialogRef }, { type: i0.Injector }, { type: i1.MatDialog }];
     } });
 
+/**
+ * The internal TableData. Requires all default values the user can leave out.
+ */
 class TableDataInternal {
     constructor(baseData, createDialogData, editDialogData) {
         this.baseData = baseData;
@@ -1582,14 +1475,21 @@ class TableDataInternal {
         this.editDialogData = editDialogData;
     }
 }
-class BaseDataBuilder {
+/**
+ * The Builder for the table BaseData. Sets default values.
+ */
+class BaseDataBuilder extends BaseBuilder {
     constructor(data) {
-        //this.validateInput(data);
-        this.dataInput = data;
-        this.baseData = 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 ? 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);
-        return this;
+        super(data);
+    }
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    generateBaseData(data) {
+        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);
     }
 }
+/**
+ * The internal TableData. Requires all default values the user can leave out.
+ */
 class BaseDataInternal {
     constructor(title, displayColumns, EntityServiceClass, searchLabel, createButtonLabel, searchString, allowCreate, allowEdit, allowDelete, multiSelectActions, multiSelectLabel, EntityClass, edit, create) {
         this.title = title;
@@ -1608,16 +1508,21 @@ class BaseDataInternal {
         this.create = create;
     }
 }
-class TableDataBuilder {
+/**
+ * The Builder for the complete TableData. Sets default values and validates user input.
+ */
+class TableDataBuilder extends BaseBuilder {
     constructor(data) {
-        this.validateInput(data);
-        this.dataInput = data;
-        const createDialogData = new CreateDialogDataBuilder(data.createDialogData).createDialogData;
-        const editDialogData = new EditDialogDataBuilder(data.editDialogData).editDialogData;
-        const baseData = new BaseDataBuilder(data.baseData).baseData;
-        this.tableData = new TableDataInternal(baseData, createDialogData, editDialogData);
-        return this;
+        super(data);
     }
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    generateBaseData(data) {
+        const createDialogData = new CreateDialogDataBuilder(data.createDialogData).getResult();
+        const editDialogData = new EditDialogDataBuilder(data.editDialogData).getResult();
+        const baseData = new BaseDataBuilder(data.baseData).getResult();
+        return new TableDataInternal(baseData, createDialogData, editDialogData);
+    }
+    // eslint-disable-next-line jsdoc/require-jsdoc
     validateInput(data) {
         var _a;
         if (((_a = data.baseData.multiSelectActions) === null || _a === void 0 ? void 0 : _a.length) && data.baseData.displayColumns.find(dp => dp.displayName === 'select')) {
@@ -1663,6 +1568,12 @@ function defaultSearchFunction(entity) {
     return searchString;
 }
 
+/**
+ * Generates a fully functional table for displaying, creating, updating and deleting entities
+ * based on the configuration passed in the @Input "tableData".
+ *
+ * It offers a lot of customization options which can be found in "TableData".
+ */
 class NgxMatEntityTableComponent {
     constructor(dialog, injector) {
         this.dialog = dialog;
@@ -1671,8 +1582,11 @@ class NgxMatEntityTableComponent {
         this.dataSource = new MatTableDataSource();
         this.selection = new SelectionModel(true, []);
     }
+    /**
+     * Sets up all the configuration for the table and the EntityService.
+     */
     ngOnInit() {
-        this.data = new TableDataBuilder(this.tableData).tableData;
+        this.data = new TableDataBuilder(this.tableData).getResult();
         this.entityService = this.injector.get(this.data.baseData.EntityServiceClass);
         const givenDisplayColumns = this.data.baseData.displayColumns.map((v) => v.displayName);
         if (this.data.baseData.multiSelectActions.length) {
@@ -1702,6 +1616,12 @@ class NgxMatEntityTableComponent {
         });
         this.entityService.read();
     }
+    /**
+     * Edits an entity. This either calls the edit-Method provided by the user or uses a default edit-dialog.
+     *
+     * @param entity - The entity that should be updated.
+     * @throws When no EntityClass was provided, as a new call is needed to initialize metadata.
+     */
     editEntity(entity) {
         if (this.data.baseData.allowEdit(entity)) {
             if (!this.data.baseData.EntityClass) {
@@ -1722,7 +1642,7 @@ class NgxMatEntityTableComponent {
             allowDelete: this.data.baseData.allowDelete,
             editDialogData: this.data.editDialogData
         };
-        const dialogData = new EditEntityDialogDataBuilder(inputDialogData).editDialogData;
+        const dialogData = new EditEntityDialogDataBuilder(inputDialogData).getResult();
         firstValueFrom(this.dialog.open(NgxMatEntityEditDialogComponent, {
             data: dialogData,
             minWidth: '60%',
@@ -1737,6 +1657,11 @@ class NgxMatEntityTableComponent {
             }
         });
     }
+    /**
+     * Creates a new Entity. This either calls the create-Method provided by the user or uses a default create-dialog.
+     *
+     * @throws When no EntityClass was provided, as a new call is needed to initialize metadata.
+     */
     createEntity() {
         if (this.data.baseData.allowCreate) {
             if (!this.data.baseData.EntityClass) {
@@ -1755,7 +1680,7 @@ class NgxMatEntityTableComponent {
             entity: entity,
             EntityServiceClass: this.data.baseData.EntityServiceClass,
             createDialogData: this.data.createDialogData
-        }).createDialogData;
+        }).getResult();
         this.dialog.open(NgxMatEntityCreateDialogComponent, {
             data: dialogData,
             minWidth: '60%',
@@ -1763,19 +1688,26 @@ class NgxMatEntityTableComponent {
             restoreFocus: false
         });
     }
+    /**
+     * Runs the MultiAction for all selected entries.
+     * Also handles confirmation with an additional dialog if configured.
+     *
+     * @param action - The MultiAction to run.
+     */
     runMultiAction(action) {
         if (!action.requireConfirmDialog || !action.requireConfirmDialog(this.selection.selected)) {
             return this.confirmRunMultiAction(action);
         }
         const dialogData = new ConfirmDialogDataBuilder(action.confirmDialogData)
-            .withDefaultText([`Do you really want to run this action on ${this.selection.selected.length} entries?`])
-            .withDefaultTitle(action.displayName).confirmDialogData;
-        const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
+            .withDefault('text', [`Do you really want to run this action on ${this.selection.selected.length} entries?`])
+            .withDefault('title', action.displayName)
+            .getResult();
+        const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
             data: dialogData,
             autoFocus: false,
             restoreFocus: false
         });
-        dialogref.afterClosed().subscribe((res) => {
+        dialogRef.afterClosed().subscribe((res) => {
             if (res === 1) {
                 this.confirmRunMultiAction(action);
             }
@@ -1784,6 +1716,12 @@ class NgxMatEntityTableComponent {
     confirmRunMultiAction(action) {
         action.action(this.selection.selected);
     }
+    /**
+     * Checks if an MultiAction is disabled (e.g. Because no entries have been selected).
+     *
+     * @param action - The MultiAction to check.
+     * @returns Whether or not the Action can be used.
+     */
     multiActionDisabled(action) {
         var _a;
         if (!this.selection.selected.length) {
@@ -1794,6 +1732,9 @@ class NgxMatEntityTableComponent {
         }
         return false;
     }
+    /**
+     * Toggles all entries in the table.
+     */
     masterToggle() {
         if (this.isAllSelected()) {
             this.selection.clear();
@@ -1802,6 +1743,12 @@ class NgxMatEntityTableComponent {
             this.dataSource.data.forEach((row) => this.selection.select(row));
         }
     }
+    /**
+     * Checks if all entries in the table have been selected.
+     * This is needed to display the "masterToggle"-checkbox correctly.
+     *
+     * @returns Whether or not all entries in the table have been selected.
+     */
     isAllSelected() {
         const numSelected = this.selection.selected.length;
         const numRows = this.dataSource.data.length;
@@ -1811,16 +1758,21 @@ class NgxMatEntityTableComponent {
         this.onDestroy.next(undefined);
         this.onDestroy.complete();
     }
+    /**
+     * Applies the search input to filter the table entries.
+     *
+     * @param event - The keyup-event which contains the search-string of the user.
+     */
     applyFilter(event) {
         const filterValue = event.target.value;
         this.dataSource.filter = filterValue.trim().toLowerCase();
     }
 }
 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 });
-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{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"] }] });
+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: i12.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: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i11.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"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableComponent, decorators: [{
             type: Component,
-            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{margin-bottom:15px}}@media (max-width: 575px){.create-button{margin-bottom:15px}}\n"] }]
+            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"] }]
         }], ctorParameters: function () { return [{ type: i1.MatDialog }, { type: i0.Injector }]; }, propDecorators: { tableData: [{
                 type: Input
             }], paginator: [{
@@ -1834,61 +1786,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 args: ['filter', { static: true }]
             }] } });
 
-class NgxMatEntityTableModule {
+class NgxMatEntityCreateDialogModule {
 }
-NgxMatEntityTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NgxMatEntityTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, declarations: [NgxMatEntityTableComponent], imports: [CommonModule,
-        MatInputModule,
+NgxMatEntityCreateDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NgxMatEntityCreateDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, declarations: [NgxMatEntityCreateDialogComponent], imports: [CommonModule,
+        NgxMatEntityInputModule,
+        MatDialogModule,
         FormsModule,
-        MatFormFieldModule,
-        MatCheckboxModule,
-        MatTableModule,
-        MatPaginatorModule,
-        MatButtonModule,
-        MatMenuModule,
-        MatDialogModule], exports: [NgxMatEntityTableComponent] });
-NgxMatEntityTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, imports: [[
+        MatButtonModule], exports: [NgxMatEntityCreateDialogComponent] });
+NgxMatEntityCreateDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, imports: [[
             CommonModule,
-            MatInputModule,
+            NgxMatEntityInputModule,
+            MatDialogModule,
             FormsModule,
-            MatFormFieldModule,
-            MatCheckboxModule,
-            MatTableModule,
-            MatPaginatorModule,
-            MatButtonModule,
-            MatMenuModule,
-            MatDialogModule
+            MatButtonModule
         ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [NgxMatEntityTableComponent],
+                    declarations: [NgxMatEntityCreateDialogComponent],
                     imports: [
                         CommonModule,
-                        MatInputModule,
+                        NgxMatEntityInputModule,
+                        MatDialogModule,
                         FormsModule,
-                        MatFormFieldModule,
-                        MatCheckboxModule,
-                        MatTableModule,
-                        MatPaginatorModule,
-                        MatButtonModule,
-                        MatMenuModule,
-                        MatDialogModule
+                        MatButtonModule
                     ],
-                    exports: [NgxMatEntityTableComponent]
-                }]
-        }] });
-
-class NgxMatEntityCreateDialogModule {
-}
-NgxMatEntityCreateDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-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] });
-NgxMatEntityCreateDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, imports: [[CommonModule, NgxMatEntityInputModule, MatDialogModule, FormsModule, MatButtonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NgxMatEntityCreateDialogComponent],
-                    imports: [CommonModule, NgxMatEntityInputModule, MatDialogModule, FormsModule, MatButtonModule],
                     exports: [NgxMatEntityCreateDialogComponent]
                 }]
         }] });
@@ -1926,10 +1849,64 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 }]
         }] });
 
+class NgxMatEntityTableModule {
+}
+NgxMatEntityTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NgxMatEntityTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, declarations: [NgxMatEntityTableComponent], imports: [CommonModule,
+        MatInputModule,
+        FormsModule,
+        MatFormFieldModule,
+        MatCheckboxModule,
+        MatTableModule,
+        MatPaginatorModule,
+        MatButtonModule,
+        MatMenuModule,
+        MatDialogModule,
+        NgxMatEntityCreateDialogModule,
+        NgxMatEntityEditDialogModule], exports: [NgxMatEntityTableComponent] });
+NgxMatEntityTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, imports: [[
+            CommonModule,
+            MatInputModule,
+            FormsModule,
+            MatFormFieldModule,
+            MatCheckboxModule,
+            MatTableModule,
+            MatPaginatorModule,
+            MatButtonModule,
+            MatMenuModule,
+            MatDialogModule,
+            NgxMatEntityCreateDialogModule,
+            NgxMatEntityEditDialogModule,
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [NgxMatEntityTableComponent],
+                    imports: [
+                        CommonModule,
+                        MatInputModule,
+                        FormsModule,
+                        MatFormFieldModule,
+                        MatCheckboxModule,
+                        MatTableModule,
+                        MatPaginatorModule,
+                        MatButtonModule,
+                        MatMenuModule,
+                        MatDialogModule,
+                        NgxMatEntityCreateDialogModule,
+                        NgxMatEntityEditDialogModule,
+                    ],
+                    exports: [NgxMatEntityTableComponent]
+                }]
+        }] });
+
+/**
+ * The internal EntityArrayDecoratorConfig. Sets default values.
+ */
 class EntityArrayDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
     constructor(data) {
         super(data);
-        this.createDialogData = data.createDialogData;
+        this.createInline = data.createInline != undefined ? data.createInline : true;
         this.displayStyle = data.displayStyle;
         this.itemType = data.itemType;
         this.EntityClass = data.EntityClass;
@@ -1937,12 +1914,17 @@ class EntityArrayDecoratorConfigInternal extends PropertyDecoratorConfigInternal
         this.createInline = data.createInline != undefined ? data.createInline : true;
         this.missingErrorMessage = data.missingErrorMessage ? data.missingErrorMessage : 'Needs to contain at least one value';
         this.defaultWidths = data.defaultWidths ? data.defaultWidths : [12, 12, 12];
+        this.addButtonLabel = data.addButtonLabel ? data.addButtonLabel : 'Add';
+        this.removeButtonLabel = data.removeButtonLabel ? data.removeButtonLabel : 'Remove';
     }
 }
+/**
+ * The internal StringChipsArrayDecoratorConfig. Sets default values.
+ */
 class StringChipsArrayDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
     constructor(data) {
         super(data);
-        this.deleteHtml = data.deleteHtml;
+        this.deleteIcon = data.deleteIcon ? data.deleteIcon : 'fas fa-circle-minus';
         this.displayStyle = data.displayStyle;
         this.itemType = data.itemType;
         this.maxLength = data.maxLength;
@@ -1951,11 +1933,14 @@ class StringChipsArrayDecoratorConfigInternal extends PropertyDecoratorConfigInt
         this.defaultWidths = data.defaultWidths ? data.defaultWidths : [6, 12, 12];
     }
 }
+/**
+ * The internal AutocompleteStringChipsArrayDecoratorConfig. Sets default values.
+ */
 class AutocompleteStringChipsArrayDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
     constructor(data) {
         super(data);
         this.autocompleteValues = data.autocompleteValues;
-        this.deleteHtml = data.deleteHtml;
+        this.deleteIcon = data.deleteIcon ? data.deleteIcon : 'fas fa-circle-minus';
         this.displayStyle = data.displayStyle;
         this.itemType = data.itemType;
         this.maxLength = data.maxLength;
@@ -1966,7 +1951,7 @@ class AutocompleteStringChipsArrayDecoratorConfigInternal extends PropertyDecora
 }
 
 /**
- * Decorator for setting and getting array propery metadata.
+ * Decorator for setting and getting array property metadata.
  *
  * @param metadata - The metadata of the array property.
  * @returns The method that defines the metadata.
@@ -1998,6 +1983,9 @@ class PropertyDecoratorConfig {
 class ArrayDecoratorConfig extends PropertyDecoratorConfig {
 }
 
+/**
+ * The internal DropdownBooleanDecoratorConfig. Sets default values.
+ */
 class DropdownBooleanDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
     constructor(data) {
         super(data);
@@ -2006,21 +1994,29 @@ class DropdownBooleanDecoratorConfigInternal extends PropertyDecoratorConfigInte
         this.dropdownFalse = data.dropdownFalse;
     }
 }
+/**
+ * The internal CheckboxBooleanDecoratorConfig. Sets default values.
+ */
 class CheckboxBooleanDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
     constructor(data) {
         super(data);
         this.displayStyle = data.displayStyle;
+        this.required = data.required === undefined ? false : data.required;
     }
 }
+/**
+ * The internal ToggleBooleanDecoratorConfig. Sets default values.
+ */
 class ToggleBooleanDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
     constructor(data) {
         super(data);
         this.displayStyle = data.displayStyle;
+        this.required = data.required === undefined ? false : data.required;
     }
 }
 
 /**
- * Decorator for setting and getting boolean propery metadata.
+ * Decorator for setting and getting boolean property metadata.
  *
  * @param metadata - The metadata of the boolean property.
  * @returns The method that defines the metadata.
@@ -2043,6 +2039,9 @@ function boolean(metadata) {
 class BooleanDecoratorConfig extends PropertyDecoratorConfig {
 }
 
+/**
+ * The internal DefaultNumberDecoratorConfig. Sets default values.
+ */
 class DefaultNumberDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
     constructor(data) {
         super(data);
@@ -2051,6 +2050,9 @@ class DefaultNumberDecoratorConfigInternal extends PropertyDecoratorConfigIntern
         this.min = data.min;
     }
 }
+/**
+ * The internal DropdownNumberDecoratorConfig. Sets default values.
+ */
 class DropdownNumberDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
     constructor(data) {
         super(data);
@@ -2060,7 +2062,7 @@ class DropdownNumberDecoratorConfigInternal extends PropertyDecoratorConfigInter
 }
 
 /**
- * Decorator for setting and getting string propery metadata.
+ * Decorator for setting and getting string property metadata.
  *
  * @param metadata - The metadata of the string property.
  * @returns The method that defines the metadata.
@@ -2080,6 +2082,9 @@ function number(metadata) {
 class NumberDecoratorConfig extends PropertyDecoratorConfig {
 }
 
+/**
+ * The internal DefaultObjectDecoratorConfig. Sets default values.
+ */
 class DefaultObjectDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
     constructor(data) {
         super(data);
@@ -2089,7 +2094,7 @@ class DefaultObjectDecoratorConfigInternal extends PropertyDecoratorConfigIntern
 }
 
 /**
- * Decorator for setting and getting object propery metadata.
+ * Decorator for setting and getting object property metadata.
  *
  * @param metadata - The metadata of the object property.
  * @returns The method that defines the metadata.