ngx-material-entity 0.1.1 → 0.1.4

package/fesm2020/ngx-material-entity.mjs

@@ -1,80 +1,51 @@
 import 'reflect-metadata';
 import { __decorate, __metadata } from 'tslib';
 import { BehaviorSubject, firstValueFrom, Subject, takeUntil } from 'rxjs';
-import { isEqual, omit, omitBy, isNil, cloneDeep } from 'lodash';
+import { cloneDeep, isEqual, omit, omitBy, isNil } from 'lodash';
 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 i12 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i12 from '@angular/forms';
+import * as i14 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
-import * as i7$1 from '@angular/material/paginator';
-import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
-import { MatSort } from '@angular/material/sort';
-import * as i4$1 from '@angular/material/table';
+import * as i9 from '@angular/material/table';
 import { MatTableDataSource, MatTableModule } from '@angular/material/table';
 import { SelectionModel } from '@angular/cdk/collections';
-import * as i1$1 from '@angular/material/form-field';
+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 * 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 i11 from '@angular/material/datepicker';
+import { MatDatepickerModule } from '@angular/material/datepicker';
+import * as i13 from '@angular/material/input';
+import { MatInputModule } from '@angular/material/input';
+import * as i15 from '@angular/cdk/text-field';
 import { MatIconModule } from '@angular/material/icon';
-import * as i4$2 from '@angular/material/menu';
+import * as i7$1 from '@angular/material/paginator';
+import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
+import { MatSort } from '@angular/material/sort';
+import * as i4$1 from '@angular/material/menu';
 import { MatMenuModule } from '@angular/material/menu';
 
 /**
- * The base options for all propertyDecorators
- */
-class PropertyDecoratorConfig {
-    /**
-     * Defines, Whether or not there should be a line break after this input.
-     * Is used inside the default create and edit dialogs.
-     */
-    // lineBreakAfter?: boolean;
-    constructor(displayName, display = true, required = true, omitForCreate = false, omitForUpdate = false, defaultWidths = [6, 6, 12], order
-    // lineBreakAfter: boolean = false
-    ) {
-        this.displayName = displayName;
-        this.display = display;
-        this.required = required;
-        this.omitForCreate = omitForCreate;
-        this.omitForUpdate = omitForUpdate;
-        this.defaultWidths = defaultWidths;
-        if (order) {
-            if (order < 0) {
-                throw new Error('order must be at least 0');
-            }
-            this.order = order;
-        }
-        else {
-            this.order = -1;
-        }
-        // this.lineBreakAfter = lineBreakAfter;
-    }
-}
-
-/**
- * The base decorator for setting metadata on properties
- * @param metadata The metadata to define
- * @param type The type of metadata
- * @returns The function that sets the metadata
+ * The base decorator for setting metadata on properties.
+ *
+ * @param metadata - The metadata to define.
+ * @param type - The type of metadata.
+ * @returns The method that sets the metadata.
  */
 function baseProperty(metadata, type) {
     return function (target, propertyKey) {
@@ -101,68 +72,119 @@ var DecoratorTypes;
     DecoratorTypes["ARRAY"] = "array";
     DecoratorTypes["ARRAY_STRING_CHIPS"] = "arrayStringChips";
     DecoratorTypes["ARRAY_STRING_AUTOCOMPLETE_CHIPS"] = "arrayStringAutocompleteChips";
+    DecoratorTypes["DATE"] = "date";
+    DecoratorTypes["DATE_RANGE"] = "dateRange";
+    DecoratorTypes["DATE_TIME"] = "dateTime";
 })(DecoratorTypes || (DecoratorTypes = {}));
 
 /**
- * Decorator for setting and getting string propery metadata
- * @param metadata The metadata of the string property
+ * The internal Position. Sets default values and validates user input.
  */
-function string(metadata) {
-    if (metadata.displayStyle === 'dropdown') {
-        return baseProperty(new DropdownStringDecoratorConfig(metadata), DecoratorTypes.STRING_DROPDOWN);
-    }
-    else if (metadata.displayStyle === 'autocomplete') {
-        return baseProperty(new AutocompleteStringDecoratorConfig(metadata), DecoratorTypes.STRING_AUTOCOMPLETE);
-    }
-    else if (metadata.displayStyle === 'textbox') {
-        return baseProperty(new TextboxStringDecoratorConfig(metadata), DecoratorTypes.STRING_TEXTBOX);
+class PositionInternal {
+    constructor(data) {
+        this.validateInput(data);
+        this.row = data?.row ? data.row : -1;
+        this.order = data?.order ? data.order : -1;
+    }
+    validateInput(data) {
+        if (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?.row && (data.row < 1)) {
+            throw new Error('row must be at least 1');
+        }
     }
-    else {
-        return baseProperty(new DefaultStringDecoratorConfig(metadata), DecoratorTypes.STRING);
+}
+/**
+ * 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.position = new PositionInternal(data.position);
     }
 }
+
 /**
- * Interface definition for the @string metadata
+ * The internal DropdownStringDecoratorConfig. Sets default values.
  */
-class StringDecoratorConfig extends PropertyDecoratorConfig {
+class DropdownStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
+    constructor(data) {
+        super(data);
+        this.displayStyle = data.displayStyle;
+        this.dropdownValues = data.dropdownValues;
+    }
 }
-class DropdownStringDecoratorConfig extends StringDecoratorConfig {
-    constructor(metadata) {
-        super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
-        this.displayStyle = metadata.displayStyle;
-        this.dropdownValues = metadata.dropdownValues;
+/**
+ * The internal DefaultStringDecoratorConfig. Sets default values.
+ */
+class DefaultStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
+    constructor(data) {
+        super(data);
+        this.displayStyle = data.displayStyle;
+        this.minLength = data.minLength;
+        this.maxLength = data.maxLength;
+        this.regex = data.regex;
     }
 }
-class DefaultStringDecoratorConfig extends StringDecoratorConfig {
-    constructor(metadata) {
-        super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
-        this.displayStyle = metadata.displayStyle;
-        this.minLength = metadata.minLength;
-        this.maxLength = metadata.maxLength;
-        this.regex = metadata.regex;
+/**
+ * The internal TextboxStringDecoratorConfig. Sets default values.
+ */
+class TextboxStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
+    constructor(data) {
+        super(data);
+        this.displayStyle = data.displayStyle;
+        this.minLength = data.minLength;
+        this.maxLength = data.maxLength;
     }
 }
-class TextboxStringDecoratorConfig extends StringDecoratorConfig {
-    constructor(metadata) {
-        super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
-        this.displayStyle = metadata.displayStyle;
-        this.minLength = metadata.minLength;
-        this.maxLength = metadata.maxLength;
+/**
+ * The internal AutocompleteStringDecoratorConfig. Sets default values.
+ */
+class AutocompleteStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
+    constructor(data) {
+        super(data);
+        this.displayStyle = data.displayStyle;
+        this.autocompleteValues = data.autocompleteValues;
+        this.minLength = data.minLength;
+        this.maxLength = data.maxLength;
+        this.regex = data.regex;
     }
 }
-class AutocompleteStringDecoratorConfig extends StringDecoratorConfig {
-    constructor(metadata) {
-        super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
-        this.displayStyle = metadata.displayStyle;
-        this.autocompleteValues = metadata.autocompleteValues;
-        this.minLength = metadata.minLength;
-        this.maxLength = metadata.maxLength;
-        this.regex = metadata.regex;
+
+/**
+ * Decorator for setting and getting string Property metadata.
+ *
+ * @param metadata - The metadata of the string property.
+ * @returns The method that defines the metadata.
+ */
+function string(metadata) {
+    if (metadata.displayStyle === 'dropdown') {
+        return baseProperty(new DropdownStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING_DROPDOWN);
+    }
+    else if (metadata.displayStyle === 'autocomplete') {
+        return baseProperty(new AutocompleteStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING_AUTOCOMPLETE);
+    }
+    else if (metadata.displayStyle === 'textbox') {
+        return baseProperty(new TextboxStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING_TEXTBOX);
+    }
+    else {
+        return baseProperty(new DefaultStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING);
     }
 }
 
 /**
- * The base Entity class.
+ * A base Entity class with a builtin id.
  */
 class Entity {
 }
@@ -178,19 +200,157 @@ __decorate([
     __metadata("design:type", String)
 ], Entity.prototype, "id", void 0);
 
-var _a;
+const DAY_IN_MS = 1000 * 60 * 60 * 24;
+/**
+ * Contains Helper Functions for handling date properties.
+ */
+class DateUtilities {
+    /**
+     * Gets the given value as a date value.
+     *
+     * @param value - The value to get as a date.
+     * @returns The given value as a date.
+     */
+    static asDate(value) {
+        return value;
+    }
+    /**
+     * Gets the default times used by the DateTime picker when nothing is specified by the user.
+     *
+     * @param format - The time format. Defaults to 24.
+     * @param minuteSteps - The steps from one time value to the next. Defaults to 30.
+     * @returns Times in the 24 hour format from 0:00 until 23:30 in 30 minute steps.
+     */
+    static getDefaultTimes(format = 24, minuteSteps = 30) {
+        const res = [{ displayName: '-', value: undefined }];
+        for (let hour = 0; hour < 24; hour++) {
+            for (let minute = 0; minute < 60; minute += minuteSteps) {
+                res.push(this.getTimeDropdownValue(format, hour, minute));
+            }
+        }
+        return res;
+    }
+    static getTimeDropdownValue(format, hour, minute) {
+        const displayHour = this.getFormattedHour(format, cloneDeep(hour));
+        const displayMinute = this.getFormattedMinute(format, hour, minute);
+        return {
+            displayName: `${displayHour}:${displayMinute}`,
+            value: {
+                hours: hour,
+                minutes: minute
+            }
+        };
+    }
+    static getFormattedHour(format, hour) {
+        if (format === 12 && hour > 12) {
+            hour -= 12;
+        }
+        return hour;
+    }
+    static getFormattedMinute(format, hour, minute) {
+        let res = `${minute}`;
+        if (format === 12) {
+            if (hour > 12) {
+                res = `${minute} PM`;
+            }
+            else {
+                res = `${minute} AM`;
+            }
+        }
+        if (minute.toString().length === 1) {
+            res = '0'.concat(res);
+        }
+        return res;
+    }
+    /**
+     * Gets the Time object from the given date.
+     *
+     * @param value - The date to get the time object from.
+     * @returns The Time object build from the date value.
+     */
+    static getTimeFromDate(value) {
+        if (!value) {
+            return {
+                hours: undefined,
+                minutes: undefined
+            };
+        }
+        else {
+            return {
+                hours: new Date(value).getHours(),
+                minutes: new Date(value).getMinutes()
+            };
+        }
+    }
+    /**
+     * Gets the dates between the two given gates. Does additional filtering based on the provided DateRange metadata.
+     *
+     * @param startDate - The start date.
+     * @param endDate - The end date.
+     * @param metadataDateRangeDate - The metadata.
+     * @returns All dates between the two provided dates. Includes start and end date.
+     */
+    static getDatesBetween(startDate, endDate, metadataDateRangeDate) {
+        const res = [];
+        while (startDate.getFullYear() < endDate.getFullYear()
+            || startDate.getMonth() < endDate.getMonth()
+            || startDate.getDate() <= endDate.getDate()) {
+            res.push(new Date(startDate));
+            startDate.setTime(startDate.getTime() + DAY_IN_MS);
+        }
+        if (metadataDateRangeDate.filter) {
+            return res.filter(d => metadataDateRangeDate.filter?.(d));
+        }
+        else {
+            return res;
+        }
+    }
+    /**
+     * Get all valid times for the dropdown of a datetime property.
+     *
+     * @param date - The date of the datetime.
+     * @param times - All given times to filter.
+     * @param min - The function that defines the minimum time.
+     * @param max - The function that defines the maximum time.
+     * @param filter - A filter function to do more specific time filtering. This could be e.g. The removal of lunch breaks.
+     * @returns All valid dropdown values for the datetime property.
+     */
+    static getValidTimesForDropdown(date, times, min, max, filter) {
+        if (min) {
+            const minTime = min(date);
+            times = times.filter(t => !t.value
+                || t.value.hours > minTime.hours
+                || (t.value.hours === minTime.hours
+                    && t.value.minutes >= minTime.minutes));
+        }
+        if (max) {
+            const maxTime = max(date);
+            times = times.filter(t => !t.value
+                || t.value.hours < maxTime.hours
+                || (t.value.hours === maxTime.hours
+                    && t.value.minutes <= maxTime.minutes));
+        }
+        if (filter) {
+            times = times.filter(t => !t.value || filter(t.value));
+        }
+        return times;
+    }
+}
+
 /**
- * Contains HelperMethods around handling Entities and their property-metadata
+ * Contains HelperMethods around handling Entities and their property-metadata.
  */
 class EntityUtilities {
     /**
-     * Gets the properties to omit when updating the entity
-     * @returns The properties which should be left out for updating a new Entity
+     * Gets the properties to omit when updating the entity.
+     *
+     * @param entity - The entity to get the properties which should be left out for updating from.
+     * @returns The properties which should be left out for updating an Entity.
      */
     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);
             }
@@ -198,13 +358,15 @@ class EntityUtilities {
         return res;
     }
     /**
-     * Gets the properties to omit when creating new entities
-     * @returns The properties which should be left out for creating a new Entity
+     * Gets the properties to omit when creating new entities.
+     *
+     * @param entity - The entity to get the properties which should be left out for creating from.
+     * @returns The properties which should be left out for creating a new Entity.
      */
     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);
             }
@@ -212,11 +374,13 @@ class EntityUtilities {
         return res;
     }
     /**
-     * Gets the metadata included in an property
-     * @param entity The entity with the property to get the metadata from
-     * @param propertyKey The property on the given Entity to get the metadata from
-     * @param type For secure Typing, defines the returned PropertyConfig
-     * @returns The metadata of the property
+     * Gets the metadata included in an property.
+     *
+     * @param entity - The entity with the property to get the metadata from.
+     * @param propertyKey - The property on the given Entity to get the metadata from.
+     * @param type - For secure Typing, defines the returned PropertyConfig.
+     * @returns The metadata of the property.
+     * @throws When no metadata can be found for the given property.
      */
     static getPropertyMetadata(entity, propertyKey, 
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -224,143 +388,144 @@ class EntityUtilities {
         try {
             const metadata = Reflect.getMetadata('metadata', entity, propertyKey);
             if (!metadata) {
-                throw new Error(`Could not find metadata for property ${String(propertyKey)}
-                    on the entity ${JSON.stringify(entity)}`);
+                throw new Error(`Could not find metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
             }
             return metadata;
         }
         catch (error) {
-            throw new Error(`Could not find metadata for property ${String(propertyKey)}
-                on the entity ${JSON.stringify(entity)}`);
+            throw new Error(`Could not find metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
         }
     }
     /**
      * Gets the type of the property-metadata.
-     * @param entity The entity with the property to get the type from
-     * @param propertyKey The property on the given Entity to get the type from
-     * @returns The type of the metadata
+     *
+     * @param entity - The entity with the property to get the type from.
+     * @param propertyKey - The property on the given Entity to get the type from.
+     * @returns The type of the metadata.
+     * @throws Will throw an error if no metadata can be found for the given property.
      */
     static getPropertyType(entity, propertyKey) {
         try {
             const propertyType = Reflect.getMetadata('type', entity, propertyKey);
             if (!propertyType) {
-                throw new Error(`Could not find type metadata for property ${String(propertyKey)}
-                    on the entity ${JSON.stringify(entity)}`);
+                throw new Error(`Could not find type metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
             }
             return propertyType;
         }
         catch (error) {
-            throw new Error(`Could not find type metadata for property ${String(propertyKey)}
-                on the entity ${JSON.stringify(entity)}`);
+            throw new Error(`Could not find type metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
         }
     }
     /**
      * Sets all property values based on a given entity data-object.
-     * @param entity The data object to get the property values from.
-     * @param target
-     * the target object that needs to be constructed
-     * (if called inside a Entity constructor its usually this)
+     *
+     * @param target - The target object that needs to be constructed (if called inside an Entity constructor its usually this).
+     * @param entity - The data object to get the property values from.
      * @alias new
      * @alias build
      * @alias construct
      */
     static new(target, entity) {
-        if (entity) {
-            for (const key in entity) {
-                Reflect.set(target, key, Reflect.get(entity, key));
+        for (const key in target) {
+            const type = EntityUtilities.getPropertyType(target, key);
+            // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+            let value = entity ? Reflect.get(entity, key) : undefined;
+            switch (type) {
+                case DecoratorTypes.OBJECT:
+                    const objectMetadata = EntityUtilities.getPropertyMetadata(target, key, DecoratorTypes.OBJECT);
+                    // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+                    value = new objectMetadata.EntityClass(value);
+                    break;
+                case DecoratorTypes.ARRAY:
+                    const inputArray = value;
+                    const resArray = [];
+                    if (inputArray) {
+                        const arrayMetadata = EntityUtilities.getPropertyMetadata(target, key, DecoratorTypes.ARRAY);
+                        for (const item of inputArray) {
+                            const itemWithMetadata = new arrayMetadata.EntityClass(item);
+                            resArray.push(itemWithMetadata);
+                        }
+                    }
+                    value = resArray;
+                    break;
+                default:
+                    break;
             }
+            Reflect.set(target, key, value);
         }
     }
     /**
      * Checks if the values on an entity are valid.
-     * 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
+     * Also checks all the validators given by the metadata ("required", "maxLength" etc.).
+     *
+     * @param entity - The entity to validate.
+     * @param omit - Whether to check for creating or editing validity.
      * @returns Whether or not the entity is valid.
      */
     static isEntityValid(entity, omit) {
         for (const key in entity) {
-            if (!this.isPropertyValid(entity, key, omit)) {
+            if (!EntityUtilities.isPropertyValid(entity, key, omit)) {
                 return false;
             }
         }
         return true;
     }
     /**
-     * Checks if a single property value is valid
-     * @param entity The entity where the property is from
-     * @param key The name of the property
-     * @returns Whether or not the property value is valid
+     * Checks if a single property value is valid.
+     *
+     * @param entity - The entity where the property is from.
+     * @param key - The name of the property.
+     * @param omit - Whether to check if the given entity is valid for creation or updating.
+     * @returns Whether or not the property value is valid.
+     * @throws Throws when it extracts an unknown metadata type.
      */
     static isPropertyValid(entity, key, omit) {
-        const type = this.getPropertyType(entity, key);
-        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;
-        const arrayItems = entity[key];
+        const type = EntityUtilities.getPropertyType(entity, key);
+        const metadata = EntityUtilities.getPropertyMetadata(entity, key, type);
         if (metadata.omitForCreate && omit === 'create') {
             return true;
         }
-        if (metadata.omitForUpdate && omit === 'edit') {
+        if (metadata.omitForUpdate && omit === 'update') {
             return true;
         }
         if (metadata.required && !entity[key]) {
             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:
-                if (metadataDefaultString.maxLength
-                    && entity[key].length > metadataDefaultString.maxLength) {
-                    return false;
-                }
-                if (metadataDefaultString.minLength
-                    && entity[key].length < metadataDefaultString.minLength) {
-                    return false;
-                }
-                if (metadataDefaultString.regex
-                    && !entity[key].match(metadataDefaultString.regex)) {
-                    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)) {
+                const entityString = entity[key];
+                const stringMetadata = metadata;
+                if (!this.isStringValid(entityString, stringMetadata)) {
                     return false;
                 }
                 break;
             case DecoratorTypes.STRING_TEXTBOX:
-                if (metadataTextboxString.maxLength
-                    && entity[key].length > metadataTextboxString.maxLength) {
-                    return false;
-                }
-                if (metadataTextboxString.minLength
-                    && entity[key].length < metadataTextboxString.minLength) {
+                const entityTextbox = entity[key];
+                const textboxMetadata = metadata;
+                if (!this.isTextboxValid(entityTextbox, textboxMetadata)) {
                     return false;
                 }
                 break;
+            case DecoratorTypes.NUMBER_DROPDOWN:
+                return true;
             case DecoratorTypes.NUMBER:
-                if (metadataDefaultNumber.max && entity[key] > metadataDefaultNumber.max) {
-                    return false;
-                }
-                if (metadataDefaultNumber.min && entity[key] > metadataDefaultNumber.min) {
+                const entityNumber = entity[key];
+                const numberMetadata = metadata;
+                if (!this.isNumberValid(entityNumber, numberMetadata)) {
                     return false;
                 }
                 break;
             case DecoratorTypes.OBJECT:
-                for (const parameterKey in objectProperty) {
-                    if (!this.isPropertyValid(objectProperty, parameterKey, omit)) {
+                const entityObject = entity[key];
+                for (const parameterKey in entityObject) {
+                    if (!EntityUtilities.isPropertyValid(entityObject, parameterKey, omit)) {
                         return false;
                     }
                 }
@@ -368,7 +533,30 @@ class EntityUtilities {
             case DecoratorTypes.ARRAY_STRING_CHIPS:
             case DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS:
             case DecoratorTypes.ARRAY:
-                if (metadataEntityArray.required && !arrayItems.length) {
+                const entityArray = entity[key];
+                const arrayMetadata = metadata;
+                if (arrayMetadata.required && !entityArray.length) {
+                    return false;
+                }
+                break;
+            case DecoratorTypes.DATE:
+                const entityDate = new Date(entity[key]);
+                const dateMetadata = metadata;
+                if (!this.isDateValid(entityDate, dateMetadata)) {
+                    return false;
+                }
+                break;
+            case DecoratorTypes.DATE_RANGE:
+                const entityDateRange = cloneDeep(entity[key]);
+                const dateRangeMetadata = metadata;
+                if (!this.isDateRangeValid(entityDateRange, dateRangeMetadata)) {
+                    return false;
+                }
+                break;
+            case DecoratorTypes.DATE_TIME:
+                const entityDateTime = new Date(entity[key]);
+                const dateTimeMetadata = metadata;
+                if (!this.isDateTimeValid(entityDateTime, dateTimeMetadata)) {
                     return false;
                 }
                 break;
@@ -377,100 +565,312 @@ class EntityUtilities {
         }
         return true;
     }
+    static isStringValid(value, metadata) {
+        if (metadata.maxLength && value.length > metadata.maxLength) {
+            return false;
+        }
+        if (metadata.minLength && value.length < metadata.minLength) {
+            return false;
+        }
+        if (metadata.regex && !value.match(metadata.regex)) {
+            return false;
+        }
+        return true;
+    }
+    static isTextboxValid(value, metadata) {
+        if (metadata.maxLength && value.length > metadata.maxLength) {
+            return false;
+        }
+        if (metadata.minLength && value.length < metadata.minLength) {
+            return false;
+        }
+        return true;
+    }
+    static isNumberValid(value, metadata) {
+        if (metadata.max && value > metadata.max) {
+            return false;
+        }
+        if (metadata.min && value < metadata.min) {
+            return false;
+        }
+        return true;
+    }
+    static isDateValid(value, metadata) {
+        if (metadata.min && value.getTime() < metadata.min(value).getTime()) {
+            return false;
+        }
+        if (metadata.max && value.getTime() > metadata.max(value).getTime()) {
+            return false;
+        }
+        if (metadata.filter && !metadata.filter(value)) {
+            return false;
+        }
+        return true;
+    }
+    static isDateRangeValid(value, metadata) {
+        if (metadata.required && (!value.start || !value.end)) {
+            return false;
+        }
+        value.start = new Date(value.start);
+        value.end = new Date(value.end);
+        if (metadata.minStart && value.start.getTime() < metadata.minStart(value.start).getTime()) {
+            return false;
+        }
+        if (metadata.maxStart && value.start.getTime() > metadata.maxStart(value.start).getTime()) {
+            return false;
+        }
+        if (metadata.minEnd && value.end.getTime() < metadata.minEnd(value.end).getTime()) {
+            return false;
+        }
+        if (metadata.maxEnd && value.end.getTime() > metadata.maxEnd(value.end).getTime()) {
+            return false;
+        }
+        if (metadata.filter) {
+            if (!metadata.filter(value.start)) {
+                return false;
+            }
+            if (!metadata.filter(value.end)) {
+                return false;
+            }
+            if (value.values) {
+                for (const date of value.values) {
+                    if (!metadata.filter(date)) {
+                        return false;
+                    }
+                }
+            }
+        }
+        return true;
+    }
+    static isDateTimeValid(value, metadata) {
+        if (metadata.minDate && value.getTime() < metadata.minDate(value).getTime()) {
+            return false;
+        }
+        if (metadata.maxDate && value.getTime() > metadata.maxDate(value).getTime()) {
+            return false;
+        }
+        if (metadata.filterDate && !metadata.filterDate(value)) {
+            return false;
+        }
+        const time = {
+            hours: value.getHours(),
+            minutes: value.getMinutes()
+        };
+        if (metadata.minTime) {
+            const minTime = metadata.minTime(value);
+            if (!(time.hours > minTime.hours
+                || (time.hours === minTime.hours
+                    && time.minutes >= minTime.minutes))) {
+                return false;
+            }
+        }
+        if (metadata.maxTime) {
+            const maxTime = metadata.maxTime(value);
+            if (!(time.hours < maxTime.hours
+                || (time.hours === maxTime.hours
+                    && time.minutes <= maxTime.minutes))) {
+                return false;
+            }
+        }
+        if (metadata.filterTime) {
+            if (!metadata.filterTime(time)) {
+                return false;
+            }
+        }
+        return true;
+    }
     /**
-     * Checks if an entity is "dirty" (if its values have changed)
-     * @param entity The entity after all changes
-     * @param entityPriorChanges The entity before the changes
-     * @returns Whether or not the entity is dirty
+     * Checks if an entity is "dirty" (if its values have changed).
+     *
+     * @param entity - The entity after all changes.
+     * @param entityPriorChanges - The entity before the changes.
+     * @returns Whether or not the entity is dirty.
      */
     static dirty(entity, entityPriorChanges) {
         if (!entityPriorChanges) {
             return false;
         }
         else {
-            const diff = this.difference(entity, entityPriorChanges);
-            if (JSON.stringify(diff) === '{}') {
-                return false;
-            }
-            else {
-                return true;
+            const differences = this.differencesForDirty(entity, entityPriorChanges);
+            return differences.length ? true : false;
+        }
+    }
+    static differencesForDirty(entity, entityPriorChanges) {
+        const res = [];
+        for (const key in entity) {
+            if (!this.isEqual(entity[key], entityPriorChanges[key], EntityUtilities.getPropertyMetadata(entity, key))) {
+                res.push({
+                    key: key,
+                    before: entityPriorChanges[key],
+                    after: entity[key]
+                });
             }
         }
+        return res;
     }
     /**
-     * Compares two Entities and returns their difference in an object
-     * @param entity The first entity to compare
-     * @param entityPriorChanges The second entity to compare
-     * @returns The difference between the two Entities in form of a Partial
+     * Compares two Entities and returns their difference in an object.
+     *
+     * @param entity - The first entity to compare.
+     * @param entityPriorChanges - The second entity to compare.
+     * @returns The difference between the two Entities in form of a Partial.
      */
     static difference(entity, entityPriorChanges) {
         const res = {};
         for (const key in entity) {
-            if (!isEqual(entity[key], entityPriorChanges[key])) {
+            if (!this.isEqual(entity[key], entityPriorChanges[key], EntityUtilities.getPropertyMetadata(entity, key))) {
                 res[key] = entity[key];
             }
         }
         return res;
     }
+    static isEqual(value, valuePriorChanges, metadata) {
+        if (this.isDateRange(value) && this.isDateRange(valuePriorChanges)) {
+            const dateRange = cloneDeep(value);
+            dateRange.start = new Date(value.start);
+            dateRange.end = new Date(value.end);
+            dateRange.values = DateUtilities.getDatesBetween(dateRange.start, dateRange.end, metadata);
+            const dateRangePriorChanges = cloneDeep(valuePriorChanges);
+            dateRangePriorChanges.start = new Date(valuePriorChanges.start);
+            dateRangePriorChanges.end = new Date(valuePriorChanges.end);
+            dateRangePriorChanges.values = DateUtilities.getDatesBetween(dateRangePriorChanges.start, dateRangePriorChanges.end, metadata);
+            return isEqual(dateRange, dateRangePriorChanges);
+        }
+        if (metadata.displayStyle === 'date') {
+            const date = new Date(DateUtilities.asDate(value));
+            const datePriorChanges = new Date(DateUtilities.asDate(valuePriorChanges));
+            date.setHours(0, 0, 0, 0);
+            datePriorChanges.setHours(0, 0, 0, 0);
+            return isEqual(date, datePriorChanges);
+        }
+        return isEqual(value, valuePriorChanges);
+    }
+    static isDateRange(value) {
+        const dateRange = value;
+        if (dateRange.start && dateRange.end) {
+            try {
+                new Date(dateRange.start);
+                new Date(dateRange.end);
+                return true;
+            }
+            catch (error) { }
+            ;
+        }
+        return false;
+    }
     /**
-     * compare function for sorting entity keys by their order value
-     * @param a first key of entity
-     * @param b second key of entity
-     * @param entity current entity (used to get metadata of entity keys)
+     * Compare function for sorting entity keys by their order value.
+     *
+     * @param a - First key of entity.
+     * @param b - Second key of entity.
+     * @param entity - Current entity (used to get metadata of entity keys).
+     * @returns 0 if both values have the same order, a negative value if 'a' comes before 'b', a positive value if 'a' comes behind 'b'.
      */
     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) {
+        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) {
-            return 0;
+        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
-     * @returns bootstrap column value
+     * 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 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);
-        if (metadata.defaultWidths) {
-            switch (type) {
-                case 'lg':
-                    return metadata.defaultWidths[0];
-                case 'md':
-                    return metadata.defaultWidths[1];
-                case 'sm':
-                    return metadata.defaultWidths[2];
-                default:
-                    throw new Error('Something went wrong getting the width');
-            }
-        }
-        else {
-            throw new Error('Something went wrong getting the width');
+        const metadata = EntityUtilities.getPropertyMetadata(entity, key);
+        switch (type) {
+            case 'lg':
+                return metadata.defaultWidths[0];
+            case 'md':
+                return metadata.defaultWidths[1];
+            case 'sm':
+                return metadata.defaultWidths[2];
         }
     }
     /**
-     * Resets all changes on an entity
-     * @param entity The entity to reset
-     * @param entityPriorChanges The entity before any changes
+     * Resets all changes on an entity.
+     *
+     * @param entity - The entity to reset.
+     * @param entityPriorChanges - The entity before any changes.
      */
     static resetChangesOnEntity(entity, entityPriorChanges) {
         for (const key in entityPriorChanges) {
             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 = this.getNumberOfRows(keys, entity);
+        for (let i = 1; i <= numberOfRows; i++) {
+            const row = {
+                row: i,
+                keys: this.getKeysForRow(keys, entity, i)
+            };
+            res.push(row);
+        }
+        const lastRow = {
+            row: numberOfRows + 1,
+            keys: this.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
-EntityUtilities.construct = _a.new;
-// eslint-disable-next-line @typescript-eslint/member-ordering
-EntityUtilities.build = _a.new;
+// eslint-disable-next-line @typescript-eslint/member-ordering, jsdoc/require-jsdoc
+EntityUtilities.construct = EntityUtilities.new;
+// eslint-disable-next-line @typescript-eslint/member-ordering, jsdoc/require-jsdoc
+EntityUtilities.build = EntityUtilities.new;
 
 /**
  * A generic EntityService class.
@@ -482,22 +882,31 @@ class EntityService {
     constructor(http) {
         this.http = http;
         /**
-         * a subject of all the entity values.
+         * The key which holds the id value.
+         *
+         * @default 'id'
+         */
+        this.idKey = 'id';
+        /**
+         * A subject of all the entity values.
          * Can be subscribed to when you want to do a specific thing whenever the entities change.
          */
         this.entitiesSubject = new BehaviorSubject([]);
     }
     /**
-     * gets the entities in an array from the internal entitiesSubject
+     * Gets the entities in an array from the internal entitiesSubject.
+     *
+     * @returns The current entities in form of an array.
      */
     get entities() {
         return this.entitiesSubject.value;
     }
     /**
-     * Creates a new Entity and pushes it to the entities array
-     * @param entity The data of the entity to create.
+     * Creates a new Entity and pushes it to the entities array.
+     *
+     * @param entity - The data of the entity to create.
      * All values that should be omitted will be removed from it inside this method.
-     * @returns A Promise of the created entity
+     * @returns A Promise of the created entity.
      */
     async create(entity) {
         const body = omit(entity, EntityUtilities.getOmitForCreate(entity));
@@ -507,8 +916,9 @@ class EntityService {
         return e;
     }
     /**
-     * Gets all existing entities and pushes them to the entites array
-     * @returns A Promise of all received Entities
+     * Gets all existing entities and pushes them to the entities array.
+     *
+     * @returns A Promise of all received Entities.
      */
     async read() {
         const e = await firstValueFrom(this.http.get(this.baseUrl));
@@ -516,67 +926,151 @@ class EntityService {
         return e;
     }
     /**
-     * Updates a specific Entity
-     * @param entity The updated Entity
+     * Updates a specific Entity.
+     *
+     * @param entity - The updated Entity
      * All values that should be omitted will be removed from it inside this method.
-     * @param entityPriorChanges The current Entity.
-     * It Is used to get changed values and only update them instead of sending the whole entity data
+     * @param entityPriorChanges - The current Entity.
+     * It Is used to get changed values and only update them instead of sending the whole entity data.
      */
     async update(entity, entityPriorChanges) {
         const reqBody = omit(EntityUtilities.difference(entity, entityPriorChanges), EntityUtilities.getOmitForUpdate(entity));
-        const updatedEntity = await firstValueFrom(this.http.patch(`${this.baseUrl}/${entityPriorChanges.id}`, omitBy(reqBody, isNil)));
-        this.entities[this.entities.findIndex((e) => e.id === entityPriorChanges.id)] = updatedEntity;
+        const updatedEntity = await firstValueFrom(this.http.patch(`${this.baseUrl}/${entityPriorChanges[this.idKey]}`, omitBy(reqBody, isNil)));
+        this.entities[this.entities.findIndex(e => e[this.idKey] === entityPriorChanges[this.idKey])] = updatedEntity;
         this.entitiesSubject.next(this.entities);
     }
     /**
-     * Method to delete a specific Entity
-     * @param id The id of the element to delete
+     * Deletes a specific Entity.
+     *
+     * @param entity - The entity to delete.
      */
-    async delete(id) {
-        await firstValueFrom(this.http.delete(`${this.baseUrl}/${id}`));
-        this.entities.splice(this.entities.findIndex((e) => e.id === id), 1);
+    async delete(entity) {
+        await firstValueFrom(this.http.delete(`${this.baseUrl}/${entity[this.idKey]}`));
+        // the == comparison instead of === is to catch ids that are numbers.
+        this.entities.splice(this.entities.findIndex(e => e[this.idKey] === entity[this.idKey]), 1);
         this.entitiesSubject.next(this.entities);
     }
 }
 
-class NgxMatEntityConfirmDialogComponent {
-    constructor(dialogRef, data) {
-        this.dialogRef = dialogRef;
-        this.data = data;
-        /**
-         * Used for the checkbox to confirm the action
-         */
-        this.confirm = false;
+/**
+ * The abstract BaseBuilder class.
+ */
+class BaseBuilder {
+    constructor(data) {
+        this.validateInput(data);
+        this.inputData = data;
+        this.data = this.generateBaseData(data);
+        return this;
     }
-    ngOnInit() {
-        if (this.data.requireConfirmation && !this.data.confirmationText) {
-            throw new Error(`
-                Missing required Input "confirmationText".
-                You can only omit this if you dont have "requireConfirmation" set`);
-        }
-        if (!this.data.requireConfirmation && this.data.confirmationText) {
-            throw new Error('The "confirmationText" will never be shown because "requireConfirmation" is not set to true');
-        }
-        if (this.data.requireConfirmation !== true && this.data.requireConfirmation !== false) {
-            this.data.requireConfirmation = false;
-        }
-        if (this.data.type === 'info-only' && this.data.cancelButtonLabel) {
-            throw new Error('The "cancelButtonLabel" will never be shown because "type" is set to "info-only"');
+    /**
+     * 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;
         }
-        this.dialogRef.disableClose = true;
+        return this;
     }
-    confirmAction() {
-        this.dialogRef.close(1);
+    /**
+     * 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;
+        this.type = type;
+        this.confirmButtonLabel = confirmButtonLabel;
+        this.cancelButtonLabel = cancelButtonLabel;
+        this.title = title;
+        this.requireConfirmation = requireConfirmation;
+        this.confirmationText = confirmationText;
+    }
+}
+/**
+ * The Builder for the ConfirmDialogData. Sets default values.
+ */
+class ConfirmDialogDataBuilder extends BaseBuilder {
+    constructor(data) {
+        super(data);
+    }
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    generateBaseData(data) {
+        return new ConfirmDialogDataInternal(data?.text ? data.text : ['Do you really want to do this?'], data?.type ? data.type : 'default', data?.confirmButtonLabel ? data.confirmButtonLabel : 'Confirm', data?.cancelButtonLabel ? data.cancelButtonLabel : 'Cancel', data?.title ? data.title : 'Confirmation', data?.requireConfirmation ? data.requireConfirmation : false, data?.confirmationText);
+    }
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    validateInput(data) {
+        if (!data) {
+            return;
+        }
+        if (data.requireConfirmation && !data.confirmationText) {
+            throw new Error(`Missing required Input data "confirmationText".
+            You can only omit this value when "requireConfirmation" is false.`);
+        }
+        if (!data.requireConfirmation && data.confirmationText) {
+            throw new Error('The "confirmationText" will never be shown because "requireConfirmation" is not set to true');
+        }
+        if (data.type === 'info-only' && data.cancelButtonLabel) {
+            throw new Error('The "cancelButtonLabel" will never be shown because "type" is set to "info-only"');
+        }
+    }
+}
+
+/**
+ * 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;
+        this.inputData = inputData;
+        this.confirm = false;
+    }
+    ngOnInit() {
+        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 ? data.confirmButtonLabel : 'Delete'}}\n    </button>\n    <button *ngIf=\"data.type !== 'delete'\" mat-raised-button (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n        {{data.confirmButtonLabel ? data.confirmButtonLabel : data.type === 'info-only' ? 'Ok' : 'Confirm'}}\n    </button>\n    <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n        {{data.cancelButtonLabel ? data.cancelButtonLabel : 'Cancel'}}\n    </button>\n</mat-dialog-actions>\n", styles: [".checkbox-wrapper{min-height:50px;display:flex}.checkbox-wrapper>mat-checkbox{align-self:center}mat-dialog-actions{display:flex;justify-content:space-between}\n"], components: [{ type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i12.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i12.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
+NgxMatEntityConfirmDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityConfirmDialogComponent, selector: "ngx-mat-entity-confirm-dialog", ngImport: i0, template: "<h2 mat-dialog-title *ngIf=\"data.title\">{{data.title}}</h2>\n\n<mat-dialog-content>\n    <p *ngFor=\"let paragraph of data.text\">{{paragraph}}</p>\n    <div *ngIf=\"data.requireConfirmation\" class=\"checkbox-wrapper\">\n        <mat-checkbox [(ngModel)]=\"confirm\" name=\"confirm\">\n            {{data.confirmationText}}\n        </mat-checkbox>\n    </div>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n    <button *ngIf=\"data.type === 'delete'\" mat-raised-button color=\"warn\" (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n        {{data.confirmButtonLabel}}\n    </button>\n    <button *ngIf=\"data.type !== 'delete'\" mat-raised-button (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n        {{data.confirmButtonLabel}}\n    </button>\n    <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n        {{data.cancelButtonLabel}}\n    </button>\n</mat-dialog-actions>\n", styles: [".checkbox-wrapper{min-height:50px;display:flex}.checkbox-wrapper>mat-checkbox{align-self:center}mat-dialog-actions{display:flex;justify-content:space-between}\n"], components: [{ type: i6.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i14.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i14.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
 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 ? data.confirmButtonLabel : 'Delete'}}\n    </button>\n    <button *ngIf=\"data.type !== 'delete'\" mat-raised-button (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n        {{data.confirmButtonLabel ? data.confirmButtonLabel : data.type === 'info-only' ? 'Ok' : 'Confirm'}}\n    </button>\n    <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n        {{data.cancelButtonLabel ? data.cancelButtonLabel : 'Cancel'}}\n    </button>\n</mat-dialog-actions>\n", styles: [".checkbox-wrapper{min-height:50px;display:flex}.checkbox-wrapper>mat-checkbox{align-self:center}mat-dialog-actions{display:flex;justify-content:space-between}\n"] }]
+            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"] }]
         }], ctorParameters: function () { return [{ type: i1.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -598,8 +1092,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
 
 /**
  * Generates a default error message for most validation errors.
- * @param model The ngModel to get the error from
- * @returns The Validation Error Message to display
+ *
+ * @param model - The ngModel to get the error from.
+ * @returns The Validation Error Message to display.
  */
 function getValidationErrorMessage(model) {
     if (model.hasError('matDatepickerParse')) {
@@ -623,85 +1118,95 @@ 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';
     }
 }
 
 /**
- * Decorator for setting and getting array propery metadata
- * @param metadata The metadata of the array property
+ * The internal CreateDialogData. Requires all default values the user can leave out.
  */
-function array(metadata) {
-    switch (metadata.itemType) {
-        case DecoratorTypes.OBJECT:
-            return baseProperty(new EntityArrayDecoratorConfig(metadata), DecoratorTypes.ARRAY);
-        case DecoratorTypes.STRING:
-            return baseProperty(new StringChipsArrayDecoratorConfig(metadata), DecoratorTypes.ARRAY_STRING_CHIPS);
-        case DecoratorTypes.STRING_AUTOCOMPLETE:
-            return baseProperty(new AutocompleteStringChipsArrayDecoratorConfig(metadata), DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS);
-        default:
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access
-            throw new Error(`Unknown itemType ${metadata.itemType}`);
+class CreateDialogDataInternal {
+    constructor(title, createButtonLabel, cancelButtonLabel, createRequiresConfirmDialog, confirmCreateDialogData) {
+        this.title = title;
+        this.createButtonLabel = createButtonLabel;
+        this.cancelButtonLabel = cancelButtonLabel;
+        this.createRequiresConfirmDialog = createRequiresConfirmDialog;
+        this.confirmCreateDialogData = confirmCreateDialogData;
     }
 }
 /**
- * Interface definition for the @array metadata
- */
-class ArrayDecoratorConfig extends PropertyDecoratorConfig {
-}
-/**
- * Definition for an array of Entities
+ * The Builder for the CreateDialogData. Sets default values.
  */
-class EntityArrayDecoratorConfig extends ArrayDecoratorConfig {
-    constructor(metadata) {
-        super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
-        this.itemType = metadata.itemType;
-        this.displayStyle = metadata.displayStyle;
-        this.EntityClass = metadata.EntityClass;
-        this.createDialogData = metadata.createDialogData;
-        this.missingErrorMessage = metadata.missingErrorMessage;
-        this.createInline = metadata.createInline;
-        this.displayColumns = metadata.displayColumns;
+class CreateDialogDataBuilder extends BaseBuilder {
+    constructor(data) {
+        super(data);
+    }
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    generateBaseData(data) {
+        const confirmCreateDialogData = new ConfirmDialogDataBuilder(data?.confirmCreateDialogData)
+            .withDefault('confirmButtonLabel', 'create')
+            .withDefault('text', ['Do you really want to create this entity?'])
+            .withDefault('title', 'Create')
+            .getResult();
+        return new CreateDialogDataInternal(data?.title ? data.title : 'Create', data?.createButtonLabel ? data.createButtonLabel : 'Create', data?.cancelButtonLabel ? data.cancelButtonLabel : 'Cancel', data?.createRequiresConfirmDialog ? data.createRequiresConfirmDialog : false, confirmCreateDialogData);
     }
 }
+
 /**
- * Definition for an array of strings displayed as a chips list
+ * The internal AddArrayItemDialogData. Requires all default values the user can leave out.
  */
-class StringChipsArrayDecoratorConfig extends ArrayDecoratorConfig {
-    constructor(metadata) {
-        super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
-        this.itemType = metadata.itemType;
-        this.displayStyle = metadata.displayStyle;
-        this.deleteHtml = metadata.deleteHtml;
-        this.minLength = metadata.minLength;
-        this.maxLength = metadata.maxLength;
-        this.regex = metadata.regex;
+class AddArrayItemDialogDataInternal {
+    constructor(entity, createDialogData, getValidationErrorMessage) {
+        this.entity = entity;
+        this.createDialogData = createDialogData;
+        this.getValidationErrorMessage = getValidationErrorMessage;
     }
 }
 /**
- * Definition for an array of autocomplete strings displayed as a chips list
+ * The Builder for the AddArrayItemDialogData. Sets default values.
  */
-class AutocompleteStringChipsArrayDecoratorConfig extends ArrayDecoratorConfig {
-    constructor(metadata) {
-        super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
-        this.itemType = metadata.itemType;
-        this.displayStyle = metadata.displayStyle;
-        this.deleteHtml = metadata.deleteHtml;
-        this.autocompleteValues = metadata.autocompleteValues;
-        this.minLength = metadata.minLength;
-        this.maxLength = metadata.maxLength;
-        this.regex = metadata.regex;
+class AddArrayItemDialogDataBuilder extends BaseBuilder {
+    constructor(data) {
+        super(data);
+    }
+    // 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.getWidth = EntityUtilities.getWidth;
+        this.EntityUtilities = EntityUtilities;
+        this.DateUtilities = DateUtilities;
+        this.defaultDateFilter = () => true;
     }
     /**
-     * Helper method needed to recursively generate property input components (used eg. with the object)
+     * 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;
@@ -718,244 +1223,206 @@ 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'
+                };
+            }
+            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)
+            && this.entity[this.propertyKey]?.length) {
+            this.stringChipsArrayValues = this.entity[this.propertyKey];
+        }
+        this.metadataAutocompleteStringChipsArray = this.metadata;
+        if (!this.getValidationErrorMessage) {
+            this.getValidationErrorMessage = getValidationErrorMessage;
+        }
+        this.metadataDefaultDate = this.metadata;
+        this.metadataDateRangeDate = this.metadata;
+        this.metadataDateTimeDate = this.metadata;
+        if (this.type === DecoratorTypes.DATE_RANGE) {
+            this.dateRange = cloneDeep(this.entity[this.propertyKey]);
+            if (!this.dateRange) {
+                this.dateRange = {
+                    start: undefined,
+                    end: undefined,
+                    values: undefined
+                };
+            }
+            this.dateRangeStart = new Date(this.dateRange.start);
+            this.dateRangeEnd = new Date(this.dateRange.end);
+            this.setDateRangeValues();
+        }
+        if (this.type === DecoratorTypes.DATE_TIME) {
+            this.time = DateUtilities.getTimeFromDate(DateUtilities.asDate(this.entity[this.propertyKey]));
+            this.timeDropdownValues = this.metadataDateTimeDate.times;
+            if (this.entity[this.propertyKey]) {
+                this.dateTime = new Date(this.entity[this.propertyKey]);
             }
         }
-        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(data, dialogRef) {
-        this.data = data;
-        this.dialogRef = dialogRef;
-        this.EntityUtilities = EntityUtilities;
-        this.getWidth = EntityUtilities.getWidth;
-    }
-    ngOnInit() {
-        this.dialogRef.disableClose = true;
-        this.setEntityKeys();
-    }
-    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));
-    }
-    create() {
-        this.dialogRef.close(1);
-    }
-    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 ? data.createDialogData.createButtonLabel : 'Add'}}\n    </button>\n    <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n        {{data.createDialogData.cancelButtonLabel ? data.createDialogData.cancelButtonLabel : 'Cancel'}}\n    </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}\n"], components: [{ type: NgxMatEntityInternalInputComponent, selector: "ngx-mat-entity-internal-input", inputs: ["entity", "propertyKey", "hideOmitForCreate", "hideOmitForEdit", "getValidationErrorMessage"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i12.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i12.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i12.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
-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 ? data.createDialogData.createButtonLabel : 'Add'}}\n    </button>\n    <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n        {{data.createDialogData.cancelButtonLabel ? data.createDialogData.cancelButtonLabel : 'Cancel'}}\n    </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}\n"] }]
-        }], 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;
+    /**
+     * Checks if two times are equal. Is needed for the dropdown.
+     *
+     * @param time1 - The first time to compare.
+     * @param time2 - The second time to compare.
+     * @returns Whether or not the time objects are the same.
+     */
+    compareTimes(time1, time2) {
+        return time1 && time2 && time1.hours === time2.hours && time1.minutes === time2.minutes;
     }
-    ngOnInit() {
-        this.validateInput();
-        const givenDisplayColumns = this.metadata.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.`);
+    /**
+     * Updates the date range values based on the start and end date.
+     */
+    setDateRangeValues() {
+        if (this.dateRangeStart && this.dateRangeEnd) {
+            this.dateRange.start = new Date(this.dateRangeStart);
+            this.dateRange.end = new Date(this.dateRangeEnd);
+            const values = DateUtilities.getDatesBetween(new Date(this.dateRange.start), new Date(this.dateRange.end), this.metadataDateRangeDate);
+            this.dateRange.values = values.length ? values : undefined;
         }
-        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);
+        else {
+            this.dateRange.values = undefined;
+        }
+        this.entity[this.propertyKey] = this.dateRange;
     }
-    validateInput() {
-        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.`);
+    /**
+     * Sets the time on a datetime property.
+     */
+    setTime() {
+        if (!this.dateTime) {
+            this.entity[this.propertyKey] = undefined;
+            return;
+        }
+        this.entity[this.propertyKey] = new Date(this.dateTime);
+        if (this.time?.hours != null && this.time?.minutes != null) {
+            DateUtilities.asDate(this.entity[this.propertyKey]).setHours(this.time.hours, this.time.minutes, 0, 0);
+        }
+        else {
+            DateUtilities.asDate(this.entity[this.propertyKey]).setHours(0, 0, 0, 0);
         }
     }
+    /**
+     * 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.metadata.createInline) {
-            this.arrayItems.push(cloneDeep(this.arrayItem));
-            this.dataSource.data = this.arrayItems;
+        if (this.metadataEntityArray.createInline) {
+            this.entityArrayValues.push(cloneDeep(this.arrayItem));
+            this.dataSource.data = this.entityArrayValues;
             EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
         }
         else {
-            const dialogData = {
-                entity: this.arrayItem,
-                createDialogData: this.metadata.createDialogData,
-                getValidationErrorMessage: this.getValidationErrorMessage
-            };
-            firstValueFrom(this.dialog.open(NgxMatEntityAddArrayItemDialogComponent, {
-                data: dialogData,
+            this.addArrayItemDialogRef = this.dialog.open(this.addArrayItemDialog, {
+                data: this.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);
             });
         }
     }
+    /**
+     * 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);
+    }
+    /**
+     * Cancels adding the array item defined in the dialog.
+     */
+    cancelAddArrayItem() {
+        this.addArrayItemDialogRef.close();
+        EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
+    }
+    /**
+     * Removes all selected entries from the array.
+     */
     remove() {
         this.selection.selected.forEach(s => {
-            this.arrayItems.splice(this.arrayItems.indexOf(s), 1);
+            this.entityArrayValues.splice(this.entityArrayValues.indexOf(s), 1);
         });
-        this.dataSource.data = this.arrayItems;
+        this.dataSource.data = this.entityArrayValues;
         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));
-    }
+    /**
+     * Toggles all array-items in the table.
+     */
     masterToggle() {
         if (this.isAllSelected()) {
             this.selection.clear();
         }
         else {
-            this.dataSource.data.forEach((row) => this.selection.select(row));
+            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 ? metadata.missingErrorMessage : 'Needs to have at least one value'}}\n    </div>\n</div>", styles: [".buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px}mat-table{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:25px}.mat-column-select{flex:0 0 75px}.array-error{display:flex;align-items:center;justify-content:center;margin-top:-25.5px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:25px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}\n"], components: [{ type: NgxMatEntityInternalInputComponent, selector: "ngx-mat-entity-internal-input", inputs: ["entity", "propertyKey", "hideOmitForCreate", "hideOmitForEdit", "getValidationErrorMessage"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i4$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i4$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i4$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i4$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i4$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i4$1.MatCellDef, selector: "[matCellDef]" }, { type: i4$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i4$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i4$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }] });
-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 ? metadata.missingErrorMessage : 'Needs to have at least one value'}}\n    </div>\n</div>", styles: [".buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px}mat-table{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:25px}.mat-column-select{flex:0 0 75px}.array-error{display:flex;align-items:center;justify-content:center;margin-top:-25.5px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:25px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}\n"] }]
-        }], 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;
-    }
     /**
-     * Helper method needed to recursively generate property input components (used eg. with the object)
+     * 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.
      */
-    trackByFn(index) {
-        return index;
-    }
-    ngOnInit() {
-        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
-            && this.entity[this.propertyKey]?.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));
-    }
     addStringChipArrayValue(event) {
         const value = (event.value || '').trim();
         if (value) {
@@ -978,6 +1445,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) {
@@ -985,6 +1462,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) {
@@ -1005,17 +1488,24 @@ 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));
+        if (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 ? metadata.required : false\"\n                [pattern]=\"metadataDefaultString.regex ? metadataDefaultString.regex : '[\\\\s\\\\S]*'\"\n                [minlength]=\"metadataDefaultString.minLength ? metadataDefaultString.minLength : null\"\n                [maxlength]=\"metadataDefaultString.maxLength ? metadataDefaultString.maxLength : null\"\n            />\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.STRING_TEXTBOX\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <textarea\n                matInput\n                [(ngModel)]=\"entity[propertyKey]\"\n                [name]=\"propertyKey.toString()\"\n                #model=\"ngModel\"\n                cdkTextareaAutosize\n                cdkAutosizeMinRows=\"10\"\n                [required]=\"metadata.required ? metadata.required : false\"\n                [minlength]=\"metadataTextboxString.minLength ? metadataTextboxString.minLength : null\"\n                [maxlength]=\"metadataTextboxString.maxLength ? metadataTextboxString.maxLength : null\"\n            >\n            </textarea>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.STRING_AUTOCOMPLETE\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <input\n                matInput\n                [(ngModel)]=\"entity[propertyKey]\"\n                [name]=\"propertyKey.toString()\"\n                #model=\"ngModel\"\n                [matAutocomplete]=\"auto\"\n                (keyup)=\"filterAutocompleteStrings(entity[propertyKey])\"\n                [required]=\"metadata.required ? metadata.required : false\"\n                [minlength]=\"metadataAutocompleteString.minLength ? metadataAutocompleteString.minLength : null\"\n                [maxlength]=\"metadataAutocompleteString.maxLength ? metadataAutocompleteString.maxLength : null\"\n                [pattern]=\"metadataAutocompleteString.regex ? metadataAutocompleteString.regex : '[\\\\s\\\\S]*'\"\n            />\n            <mat-autocomplete #auto=\"matAutocomplete\">\n                <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n                    {{value}}\n                </mat-option>\n            </mat-autocomplete>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.STRING_DROPDOWN\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n                <mat-option *ngFor=\"let value of metadataDropdownString.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n            </mat-select>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <!-------------------------------------------->\n    <!-----------------Booleans------------------->\n    <!-------------------------------------------->\n    <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_CHECKBOX\">\n        <mat-form-field>\n            <mat-checkbox [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n                {{metadata.displayName}}\n            </mat-checkbox>\n            <!-- hidden input is needed so that the checkbox can be used inside a mat-form-field -->\n            <textarea matInput hidden></textarea>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_TOGGLE\">\n        <mat-form-field>\n            <mat-slide-toggle [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n                {{metadata.displayName}}\n            </mat-slide-toggle>\n            <!-- hidden input is needed so that the toggle can be used inside a mat-form-field -->\n            <textarea matInput hidden></textarea>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_DROPDOWN\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n                <mat-option [value]=\"undefined\">-</mat-option>\n                <mat-option [value]=\"true\">{{metadataDropdownBoolean.dropdownTrue}}</mat-option>\n                <mat-option [value]=\"false\">{{metadataDropdownBoolean.dropdownFalse}}</mat-option>\n            </mat-select>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <!-------------------------------------------->\n    <!------------------Numbers------------------->\n    <!-------------------------------------------->\n    <div *ngSwitchCase=\"DecoratorTypes.NUMBER\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <input\n                matInput\n                type=\"number\"\n                [(ngModel)]=\"entity[propertyKey]\"\n                [name]=\"propertyKey.toString()\"\n                #model=\"ngModel\"\n                [required]=\"metadata.required ? metadata.required : false\"\n                [min]=\"metadataDefaultNumber.min ? metadataDefaultNumber.min : null\"\n                [max]=\"metadataDefaultNumber.max ? metadataDefaultNumber.max : null\"\n            />\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.NUMBER_DROPDOWN\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n                <mat-option *ngFor=\"let value of metadataDropdownNumber.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n            </mat-select>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <!-------------------------------------------->\n    <!-------------------Object------------------->\n    <!-------------------------------------------->\n    <div *ngSwitchCase=\"DecoratorTypes.OBJECT\">\n        <b>{{metadataDefaultObject.displayName}}</b>\n        <!-- iterates over the object properties -->\n        <div class=\"row\">\n            <!--\n                displays another ngx-material-entity with the:\n                object as the entity,\n                the current key in the loop received by the keyvalue direction as the propertyKey\n                and the getValidationErrorMessage of the current component\n            -->\n            <ngx-mat-entity-input\n                *ngFor=\"let key of getObjectProperties(); let i = index; trackBy: trackByFn\"\n                [entity]=\"objectProperty\"\n                [propertyKey]=\"key\"\n                [getValidationErrorMessage]=\"getValidationErrorMessage\"\n                [hideOmitForCreate]=\"hideOmitForCreate\"\n                [hideOmitForEdit]=\"hideOmitForEdit\"\n                class=\"col-lg-{{getWidth(objectProperty, key, 'lg')}} col-md-{{getWidth(objectProperty, key, 'md')}} col-sm-{{getWidth(objectProperty, key, 'sm')}}\"\n            >\n            </ngx-mat-entity-input>\n        </div>\n    </div>\n\n    <!-------------------------------------------->\n    <!-------------------Array-------------------->\n    <!-------------------------------------------->\n    <div *ngSwitchCase=\"DecoratorTypes.ARRAY\">\n        <ngx-mat-entity-array-table\n            [arrayItems]=\"entityArrayValues\"\n            [metadata]=\"metadataEntityArray\"\n            [getValidationErrorMessage]=\"getValidationErrorMessage\"\n            [omit]=\"hideOmitForCreate ? 'create' : 'edit'\"\n        >\n        </ngx-mat-entity-array-table>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_CHIPS\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <mat-chip-list #chipList\n                [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n                [required]=\"metadata.required ? metadata.required : false\"\n            >\n                <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n                    {{value}}\n                    <button matChipRemove *ngIf=\"metadataStringChipsArray.deleteHtml\" [innerHtml]=\"metadataStringChipsArray.deleteHtml\">\n                    </button>\n                    <button matChipRemove *ngIf=\"!metadataStringChipsArray.deleteHtml\">\n                        <mat-icon>cancel</mat-icon>\n                    </button>\n                </mat-chip>\n                <input matInput\n                    [matChipInputFor]=\"chipList\"\n                    [matChipInputAddOnBlur]=\"true\"\n                    (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n                    [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n                    [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n                    [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n                    [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n                >\n                <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n            </mat-chip-list>\n            <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <mat-chip-list #chipList\n                [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n                [required]=\"metadata.required ? metadata.required : false\"\n            >\n                <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n                    {{value}}\n                    <button matChipRemove *ngIf=\"metadataStringChipsArray.deleteHtml\" [innerHtml]=\"metadataStringChipsArray.deleteHtml\">\n                    </button>\n                    <button matChipRemove *ngIf=\"!metadataStringChipsArray.deleteHtml\">\n                        <mat-icon>cancel</mat-icon>\n                    </button>\n                </mat-chip>\n                <input matInput\n                    [matChipInputFor]=\"chipList\"\n                    [matAutocomplete]=\"auto\"\n                    [matChipInputAddOnBlur]=\"true\"\n                    (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n                    (keyup)=\"filterAutocompleteStrings(chipsInput)\"\n                    [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n                    #chipsElement\n                    [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n                    [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n                    [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n                >\n                <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n            </mat-chip-list>\n            <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"selected($event, chipsElement)\">\n                <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n                  {{value}}\n                </mat-option>\n            </mat-autocomplete>\n            <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchDefault>ERROR: The type {{type}}is not known.</div>\n</div>", styles: ["mat-form-field{width:100%}\n"], components: [{ type: i1$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i3$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i6.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }, { type: NgxMatEntityArrayTableComponent, selector: "ngx-mat-entity-array-table", inputs: ["arrayItems", "metadata", "getValidationErrorMessage", "omit"] }, { type: i8$1.MatChipList, selector: "mat-chip-list", inputs: ["errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i7.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1$1.MatLabel, selector: "mat-label" }, { type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i12.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i12.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i12.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i12.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i12.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i12.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { type: i12.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i1$1.MatError, selector: "mat-error", inputs: ["id"] }, { type: i10.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.MatCheckboxRequiredValidator, selector: "mat-checkbox[required][formControlName],             mat-checkbox[required][formControl], mat-checkbox[required][ngModel]" }, { type: i6.MatSlideToggleRequiredValidator, selector: "mat-slide-toggle[required][formControlName],             mat-slide-toggle[required][formControl], mat-slide-toggle[required][ngModel]" }, { type: i12.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i12.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i12.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { type: i8$1.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i8$1.MatChipRemove, selector: "[matChipRemove]" }, { type: i8$1.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { type: i7.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
+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-{{EntityUtilities.getWidth(objectProperty, key, 'lg')}} col-md-{{EntityUtilities.getWidth(objectProperty, key, 'md')}} col-sm-{{EntityUtilities.getWidth(objectProperty, key, 'sm')}}\"\n            >\n            </ngx-mat-entity-input>\n        </div>\n    </div>\n\n    <!-------------------------------------------->\n    <!-------------------Array-------------------->\n    <!-------------------------------------------->\n    <div class=\"entityArray\" *ngSwitchCase=\"DecoratorTypes.ARRAY\">\n        <div class=\"mat-elevation-z8\" style=\"border-radius: 5px;padding: 15px;margin-bottom: 15px;margin-top: 15px;\">\n\n            <div style=\"padding-bottom: 10px\">\n                <b>{{metadataEntityArray.displayName}}</b>\n            </div>\n            <div *ngIf=\"metadataEntityArray.createInline\">\n                <div class=\"row\" *ngFor=\"let row of arrayItemInlineRows\">\n                    <ngx-mat-entity-input\n                        *ngFor=\"let key of row.keys; let i = index; trackBy: trackByFn\"\n                        [entity]=\"arrayItem\"\n                        [propertyKey]=\"key\"\n                        [hideOmitForCreate]=\"true\"\n                        [getValidationErrorMessage]=\"getValidationErrorMessage\"\n                        class=\"col-lg-{{EntityUtilities.getWidth(arrayItem, key, 'lg')}} col-md-{{EntityUtilities.getWidth(arrayItem, key, 'md')}} col-sm-{{EntityUtilities.getWidth(arrayItem, key, 'sm')}}\"\n                    >\n                    </ngx-mat-entity-input>\n                </div>\n            </div>\n            \n            <div class=\"buttons\">\n                <button mat-raised-button\n                    [disabled]=\"metadataEntityArray.createInline && !EntityUtilities.isEntityValid(arrayItem, 'create')\"\n                    (click)=\"add()\">\n                    {{metadataEntityArray.addButtonLabel}}\n                </button>\n                <button mat-raised-button\n                    [disabled]=\"!selection.selected.length\"\n                    (click)=\"remove()\">\n                    {{metadataEntityArray.removeButtonLabel}}\n                </button>\n            </div>\n        \n            <mat-table [dataSource]=\"dataSource\">\n                <!-- select Column -->\n                <ng-container matColumnDef=\"select\">\n                    <mat-header-cell *matHeaderCellDef>\n                        <mat-checkbox [disabled]=\"!dataSource.data.length\" (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"></mat-checkbox>\n                    </mat-header-cell>\n                    <mat-cell *matCellDef=\"let module\" class=\"module\">\n                        <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"></mat-checkbox>\n                    </mat-cell>\n                </ng-container>\n            \n                <ng-container *ngFor=\"let dCol of metadataEntityArray.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n                    <mat-header-cell *matHeaderCellDef>\n                        {{dCol.displayName}}\n                    </mat-header-cell>\n                    <mat-cell class=\"entity\" *matCellDef=\"let entity\">\n                        {{dCol.value(entity)}}\n                    </mat-cell>\n                </ng-container>\n            \n                <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n                <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n            </mat-table>\n        \n            <div class=\"array-error\" *ngIf=\"metadataEntityArray.required && !dataSource.data.length\">\n                {{metadataEntityArray.missingErrorMessage}}\n            </div>\n        </div>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_CHIPS\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <mat-chip-list #chipList\n                [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n                [required]=\"metadata.required\"\n            >\n                <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n                    {{value}}\n                    <button matChipRemove>\n                        <i class=\"{{metadataStringChipsArray.deleteIcon}}\"></i>\n                    </button>\n                </mat-chip>\n                <input matInput\n                    [matChipInputFor]=\"chipList\"\n                    [matChipInputAddOnBlur]=\"true\"\n                    (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n                    [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n                    [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n                    [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n                    [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n                >\n                <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n            </mat-chip-list>\n            <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <mat-chip-list #chipList\n                [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n                [required]=\"metadata.required\"\n            >\n                <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n                    {{value}}\n                    <button matChipRemove>\n                        <i class=\"{{metadataStringChipsArray.deleteIcon}}\"></i>\n                    </button>\n                </mat-chip>\n                <input matInput\n                    [matChipInputFor]=\"chipList\"\n                    [matAutocomplete]=\"auto\"\n                    [matChipInputAddOnBlur]=\"true\"\n                    (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n                    (keyup)=\"filterAutocompleteStrings(chipsInput)\"\n                    [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n                    #chipsElement\n                    [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n                    [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n                    [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n                >\n                <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n            </mat-chip-list>\n            <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"selected($event, chipsElement)\">\n                <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n                  {{value}}\n                </mat-option>\n            </mat-autocomplete>\n            <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <!-------------------------------------------->\n    <!-------------------Dates-------------------->\n    <!-------------------------------------------->\n    <div *ngSwitchCase=\"DecoratorTypes.DATE\">\n        <mat-form-field appearance=\"standard\">\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <input\n                matInput\n                [(ngModel)]=\"entity[propertyKey]\"\n                [name]=\"propertyKey.toString()\"\n                #model=\"ngModel\"\n                [matDatepicker]=\"picker\"\n                [required]=\"metadata.required\"\n                [min]=\"metadataDefaultDate.min ? metadataDefaultDate.min(DateUtilities.asDate(entity[propertyKey])) : undefined\"\n                [max]=\"metadataDefaultDate.max ? metadataDefaultDate.max(DateUtilities.asDate(entity[propertyKey])) : undefined\"\n                [matDatepickerFilter]=\"metadataDefaultDate.filter ? metadataDefaultDate.filter : defaultDateFilter\"\n            >\n            <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n            <mat-datepicker #picker></mat-datepicker>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.DATE_RANGE\">\n        <mat-form-field appearance=\"standard\">\n            <mat-label>{{metadata.displayName}}</mat-label>\n            \n            <mat-date-range-input [rangePicker]=\"picker\" [required]=\"metadata.required\" [dateFilter]=\"metadataDateRangeDate.filter ? metadataDateRangeDate.filter : defaultDateFilter\">\n                <input matStartDate\n                    [(ngModel)]=\"dateRangeStart\"\n                    [name]=\"propertyKey.toString() + 'start'\"\n                    #startModel=\"ngModel\"\n                    [required]=\"metadata.required\"\n                    [min]=\"metadataDateRangeDate.minStart ? metadataDateRangeDate.minStart(dateRange.start) : undefined\"\n                    [max]=\"metadataDateRangeDate.maxStart ? metadataDateRangeDate.maxStart(dateRange.start) : undefined\"\n                    [placeholder]=\"metadataDateRangeDate.placeholderStart ? metadataDateRangeDate.placeholderStart : 'Start'\"\n                    (ngModelChange)=\"setDateRangeValues()\"\n                >\n                <input matEndDate\n                    [(ngModel)]=\"dateRangeEnd\"\n                    [name]=\"propertyKey.toString() + 'end'\"\n                    #endModel=\"ngModel\"\n                    [required]=\"metadata.required\"\n                    [min]=\"metadataDateRangeDate.minEnd ? metadataDateRangeDate.minEnd(dateRange.end) : undefined\"\n                    [max]=\"metadataDateRangeDate.maxEnd ? metadataDateRangeDate.maxEnd(dateRange.end) : undefined\"\n                    [placeholder]=\"metadataDateRangeDate.placeholderEnd ? metadataDateRangeDate.placeholderEnd : 'End'\"\n                    (ngModelChange)=\"setDateRangeValues()\"\n                >\n            </mat-date-range-input>\n            <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n            <mat-date-range-picker #picker></mat-date-range-picker>\n\n            <mat-error *ngIf=\"startModel.errors\">{{getValidationErrorMessage(startModel)}}</mat-error>\n            <mat-error *ngIf=\"!startModel.errors && endModel.errors\">{{getValidationErrorMessage(endModel)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.DATE_TIME\" class=\"date-time\">\n        <mat-form-field appearance=\"standard\" class=\"datepicker\">\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <input\n                matInput\n                [(ngModel)]=\"dateTime\"\n                [name]=\"propertyKey.toString()\"\n                #model=\"ngModel\"\n                [matDatepicker]=\"picker\"\n                [required]=\"metadata.required\"\n                [min]=\"metadataDateTimeDate.minDate ? metadataDateTimeDate.minDate(dateTime) : undefined\"\n                [max]=\"metadataDateTimeDate.maxDate ? metadataDateTimeDate.maxDate(dateTime) : undefined\"\n                [matDatepickerFilter]=\"metadataDateTimeDate.filterDate ? metadataDateTimeDate.filterDate : defaultDateFilter\"\n                (dateInput)=\"setTime()\"\n            >\n            <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n            <mat-datepicker #picker></mat-datepicker>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n        <mat-form-field class=\"timepicker\">\n            <mat-label>{{metadataDateTimeDate.timeDisplayName}}</mat-label>\n            <mat-select\n                [(ngModel)]=\"time\"\n                [name]=\"propertyKey.toString() + 'time'\"\n                #timeModel=\"ngModel\"\n                [required]=\"metadata.required\"\n                [compareWith]=\"compareTimes\"\n                (ngModelChange)=\"setTime()\"\n            >\n                <mat-option *ngFor=\"let validTime of DateUtilities.getValidTimesForDropdown(\n                        DateUtilities.asDate(entity[propertyKey]),\n                        metadataDateTimeDate.times,\n                        metadataDateTimeDate.minTime,\n                        metadataDateTimeDate.maxTime,\n                        metadataDateTimeDate.filterTime\n                    )\"\n                    [value]=\"validTime.value\"\n                >\n                    {{validTime.displayName}}\n                </mat-option>\n            </mat-select>\n            <mat-error>{{getValidationErrorMessage(timeModel)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchDefault>ERROR: The type {{type}} is not known.</div>\n</div>\n\n<!--------------------------------------------------------->\n<!--------------------Add Array Item Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #addArrayItemDialog>\n    <h2 mat-dialog-title>{{dialogData.createDialogData.title}}</h2>\n\n    <mat-dialog-content>\n        <form #form=\"ngForm\" class=\"row\">\n            <div class=\"row\" *ngFor=\"let row of arrayItemDialogRows\">\n                <ngx-mat-entity-input\n                    *ngFor=\"let key of row.keys\"\n                    [entity]=\"dialogData.entity\"\n                    [propertyKey]=\"key\"\n                    [hideOmitForCreate]=\"true\"\n                    [getValidationErrorMessage]=\"dialogData.getValidationErrorMessage\"\n                    class=\"col-lg-{{EntityUtilities.getWidth(dialogData.entity, key, 'lg')}} col-md-{{EntityUtilities.getWidth(dialogData.entity, key, 'md')}} col-sm-{{EntityUtilities.getWidth(dialogData.entity, key, 'sm')}}\"\n                >\n                </ngx-mat-entity-input>\n            </div>\n        </form>\n    </mat-dialog-content>\n\n    <mat-dialog-actions>\n        <button mat-raised-button (click)=\"addArrayItem()\" [disabled]=\"!EntityUtilities.isEntityValid(dialogData.entity, 'create')\">\n            {{dialogData.createDialogData.createButtonLabel}}\n        </button>\n        <button mat-raised-button (click)=\"cancelAddArrayItem()\" class=\"cancel-button\">\n            {{dialogData.createDialogData.cancelButtonLabel}}\n        </button>\n    </mat-dialog-actions>\n\n</ng-template>", styles: ["mat-form-field{width:100%}::ng-deep .hideUnderline .mat-form-field-underline{opacity:0%}.entityArray .buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px}.entityArray mat-table{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:25px}.entityArray .mat-column-select{flex:0 0 75px}.entityArray .array-error{display:flex;align-items:center;justify-content:center;margin-top:-25.8px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:25.8px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.date-time{display:flex;align-items:baseline}.date-time .timepicker{margin-left:10px}\n"], components: [{ type: i2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i3$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i4.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i5.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i6.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i7.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i9.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i9.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i9.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { type: i10.MatChipList, selector: "mat-chip-list", inputs: ["errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: i11.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { type: i11.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { type: i11.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { type: i11.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }], directives: [{ type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i12.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i12.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2.MatLabel, selector: "mat-label" }, { type: i13.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i14.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i14.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i14.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i14.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i14.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i14.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { type: i14.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i2.MatError, selector: "mat-error", inputs: ["id"] }, { type: i15.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i3$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i14.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i14.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i14.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { type: i9.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i9.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i9.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i9.MatCellDef, selector: "[matCellDef]" }, { type: i9.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i9.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i9.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { type: i10.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i10.MatChipRemove, selector: "[matChipRemove]" }, { type: i10.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { type: i11.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { type: i2.MatSuffix, selector: "[matSuffix]" }, { type: i11.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { type: i11.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { type: i12.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i14.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i14.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i14.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
 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 ? metadata.required : false\"\n                [pattern]=\"metadataDefaultString.regex ? metadataDefaultString.regex : '[\\\\s\\\\S]*'\"\n                [minlength]=\"metadataDefaultString.minLength ? metadataDefaultString.minLength : null\"\n                [maxlength]=\"metadataDefaultString.maxLength ? metadataDefaultString.maxLength : null\"\n            />\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.STRING_TEXTBOX\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <textarea\n                matInput\n                [(ngModel)]=\"entity[propertyKey]\"\n                [name]=\"propertyKey.toString()\"\n                #model=\"ngModel\"\n                cdkTextareaAutosize\n                cdkAutosizeMinRows=\"10\"\n                [required]=\"metadata.required ? metadata.required : false\"\n                [minlength]=\"metadataTextboxString.minLength ? metadataTextboxString.minLength : null\"\n                [maxlength]=\"metadataTextboxString.maxLength ? metadataTextboxString.maxLength : null\"\n            >\n            </textarea>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.STRING_AUTOCOMPLETE\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <input\n                matInput\n                [(ngModel)]=\"entity[propertyKey]\"\n                [name]=\"propertyKey.toString()\"\n                #model=\"ngModel\"\n                [matAutocomplete]=\"auto\"\n                (keyup)=\"filterAutocompleteStrings(entity[propertyKey])\"\n                [required]=\"metadata.required ? metadata.required : false\"\n                [minlength]=\"metadataAutocompleteString.minLength ? metadataAutocompleteString.minLength : null\"\n                [maxlength]=\"metadataAutocompleteString.maxLength ? metadataAutocompleteString.maxLength : null\"\n                [pattern]=\"metadataAutocompleteString.regex ? metadataAutocompleteString.regex : '[\\\\s\\\\S]*'\"\n            />\n            <mat-autocomplete #auto=\"matAutocomplete\">\n                <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n                    {{value}}\n                </mat-option>\n            </mat-autocomplete>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.STRING_DROPDOWN\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n                <mat-option *ngFor=\"let value of metadataDropdownString.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n            </mat-select>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <!-------------------------------------------->\n    <!-----------------Booleans------------------->\n    <!-------------------------------------------->\n    <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_CHECKBOX\">\n        <mat-form-field>\n            <mat-checkbox [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n                {{metadata.displayName}}\n            </mat-checkbox>\n            <!-- hidden input is needed so that the checkbox can be used inside a mat-form-field -->\n            <textarea matInput hidden></textarea>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_TOGGLE\">\n        <mat-form-field>\n            <mat-slide-toggle [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n                {{metadata.displayName}}\n            </mat-slide-toggle>\n            <!-- hidden input is needed so that the toggle can be used inside a mat-form-field -->\n            <textarea matInput hidden></textarea>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_DROPDOWN\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n                <mat-option [value]=\"undefined\">-</mat-option>\n                <mat-option [value]=\"true\">{{metadataDropdownBoolean.dropdownTrue}}</mat-option>\n                <mat-option [value]=\"false\">{{metadataDropdownBoolean.dropdownFalse}}</mat-option>\n            </mat-select>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <!-------------------------------------------->\n    <!------------------Numbers------------------->\n    <!-------------------------------------------->\n    <div *ngSwitchCase=\"DecoratorTypes.NUMBER\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <input\n                matInput\n                type=\"number\"\n                [(ngModel)]=\"entity[propertyKey]\"\n                [name]=\"propertyKey.toString()\"\n                #model=\"ngModel\"\n                [required]=\"metadata.required ? metadata.required : false\"\n                [min]=\"metadataDefaultNumber.min ? metadataDefaultNumber.min : null\"\n                [max]=\"metadataDefaultNumber.max ? metadataDefaultNumber.max : null\"\n            />\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.NUMBER_DROPDOWN\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n                <mat-option *ngFor=\"let value of metadataDropdownNumber.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n            </mat-select>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <!-------------------------------------------->\n    <!-------------------Object------------------->\n    <!-------------------------------------------->\n    <div *ngSwitchCase=\"DecoratorTypes.OBJECT\">\n        <b>{{metadataDefaultObject.displayName}}</b>\n        <!-- iterates over the object properties -->\n        <div class=\"row\">\n            <!--\n                displays another ngx-material-entity with the:\n                object as the entity,\n                the current key in the loop received by the keyvalue direction as the propertyKey\n                and the getValidationErrorMessage of the current component\n            -->\n            <ngx-mat-entity-input\n                *ngFor=\"let key of getObjectProperties(); let i = index; trackBy: trackByFn\"\n                [entity]=\"objectProperty\"\n                [propertyKey]=\"key\"\n                [getValidationErrorMessage]=\"getValidationErrorMessage\"\n                [hideOmitForCreate]=\"hideOmitForCreate\"\n                [hideOmitForEdit]=\"hideOmitForEdit\"\n                class=\"col-lg-{{getWidth(objectProperty, key, 'lg')}} col-md-{{getWidth(objectProperty, key, 'md')}} col-sm-{{getWidth(objectProperty, key, 'sm')}}\"\n            >\n            </ngx-mat-entity-input>\n        </div>\n    </div>\n\n    <!-------------------------------------------->\n    <!-------------------Array-------------------->\n    <!-------------------------------------------->\n    <div *ngSwitchCase=\"DecoratorTypes.ARRAY\">\n        <ngx-mat-entity-array-table\n            [arrayItems]=\"entityArrayValues\"\n            [metadata]=\"metadataEntityArray\"\n            [getValidationErrorMessage]=\"getValidationErrorMessage\"\n            [omit]=\"hideOmitForCreate ? 'create' : 'edit'\"\n        >\n        </ngx-mat-entity-array-table>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_CHIPS\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <mat-chip-list #chipList\n                [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n                [required]=\"metadata.required ? metadata.required : false\"\n            >\n                <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n                    {{value}}\n                    <button matChipRemove *ngIf=\"metadataStringChipsArray.deleteHtml\" [innerHtml]=\"metadataStringChipsArray.deleteHtml\">\n                    </button>\n                    <button matChipRemove *ngIf=\"!metadataStringChipsArray.deleteHtml\">\n                        <mat-icon>cancel</mat-icon>\n                    </button>\n                </mat-chip>\n                <input matInput\n                    [matChipInputFor]=\"chipList\"\n                    [matChipInputAddOnBlur]=\"true\"\n                    (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n                    [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n                    [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n                    [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n                    [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n                >\n                <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n            </mat-chip-list>\n            <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <mat-chip-list #chipList\n                [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n                [required]=\"metadata.required ? metadata.required : false\"\n            >\n                <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n                    {{value}}\n                    <button matChipRemove *ngIf=\"metadataStringChipsArray.deleteHtml\" [innerHtml]=\"metadataStringChipsArray.deleteHtml\">\n                    </button>\n                    <button matChipRemove *ngIf=\"!metadataStringChipsArray.deleteHtml\">\n                        <mat-icon>cancel</mat-icon>\n                    </button>\n                </mat-chip>\n                <input matInput\n                    [matChipInputFor]=\"chipList\"\n                    [matAutocomplete]=\"auto\"\n                    [matChipInputAddOnBlur]=\"true\"\n                    (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n                    (keyup)=\"filterAutocompleteStrings(chipsInput)\"\n                    [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n                    #chipsElement\n                    [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n                    [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n                    [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n                >\n                <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n            </mat-chip-list>\n            <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"selected($event, chipsElement)\">\n                <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n                  {{value}}\n                </mat-option>\n            </mat-autocomplete>\n            <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchDefault>ERROR: The type {{type}}is not known.</div>\n</div>", styles: ["mat-form-field{width:100%}\n"] }]
-        }], 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-{{EntityUtilities.getWidth(objectProperty, key, 'lg')}} col-md-{{EntityUtilities.getWidth(objectProperty, key, 'md')}} col-sm-{{EntityUtilities.getWidth(objectProperty, key, 'sm')}}\"\n            >\n            </ngx-mat-entity-input>\n        </div>\n    </div>\n\n    <!-------------------------------------------->\n    <!-------------------Array-------------------->\n    <!-------------------------------------------->\n    <div class=\"entityArray\" *ngSwitchCase=\"DecoratorTypes.ARRAY\">\n        <div class=\"mat-elevation-z8\" style=\"border-radius: 5px;padding: 15px;margin-bottom: 15px;margin-top: 15px;\">\n\n            <div style=\"padding-bottom: 10px\">\n                <b>{{metadataEntityArray.displayName}}</b>\n            </div>\n            <div *ngIf=\"metadataEntityArray.createInline\">\n                <div class=\"row\" *ngFor=\"let row of arrayItemInlineRows\">\n                    <ngx-mat-entity-input\n                        *ngFor=\"let key of row.keys; let i = index; trackBy: trackByFn\"\n                        [entity]=\"arrayItem\"\n                        [propertyKey]=\"key\"\n                        [hideOmitForCreate]=\"true\"\n                        [getValidationErrorMessage]=\"getValidationErrorMessage\"\n                        class=\"col-lg-{{EntityUtilities.getWidth(arrayItem, key, 'lg')}} col-md-{{EntityUtilities.getWidth(arrayItem, key, 'md')}} col-sm-{{EntityUtilities.getWidth(arrayItem, key, 'sm')}}\"\n                    >\n                    </ngx-mat-entity-input>\n                </div>\n            </div>\n            \n            <div class=\"buttons\">\n                <button mat-raised-button\n                    [disabled]=\"metadataEntityArray.createInline && !EntityUtilities.isEntityValid(arrayItem, 'create')\"\n                    (click)=\"add()\">\n                    {{metadataEntityArray.addButtonLabel}}\n                </button>\n                <button mat-raised-button\n                    [disabled]=\"!selection.selected.length\"\n                    (click)=\"remove()\">\n                    {{metadataEntityArray.removeButtonLabel}}\n                </button>\n            </div>\n        \n            <mat-table [dataSource]=\"dataSource\">\n                <!-- select Column -->\n                <ng-container matColumnDef=\"select\">\n                    <mat-header-cell *matHeaderCellDef>\n                        <mat-checkbox [disabled]=\"!dataSource.data.length\" (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"></mat-checkbox>\n                    </mat-header-cell>\n                    <mat-cell *matCellDef=\"let module\" class=\"module\">\n                        <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"></mat-checkbox>\n                    </mat-cell>\n                </ng-container>\n            \n                <ng-container *ngFor=\"let dCol of metadataEntityArray.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n                    <mat-header-cell *matHeaderCellDef>\n                        {{dCol.displayName}}\n                    </mat-header-cell>\n                    <mat-cell class=\"entity\" *matCellDef=\"let entity\">\n                        {{dCol.value(entity)}}\n                    </mat-cell>\n                </ng-container>\n            \n                <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n                <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n            </mat-table>\n        \n            <div class=\"array-error\" *ngIf=\"metadataEntityArray.required && !dataSource.data.length\">\n                {{metadataEntityArray.missingErrorMessage}}\n            </div>\n        </div>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_CHIPS\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <mat-chip-list #chipList\n                [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n                [required]=\"metadata.required\"\n            >\n                <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n                    {{value}}\n                    <button matChipRemove>\n                        <i class=\"{{metadataStringChipsArray.deleteIcon}}\"></i>\n                    </button>\n                </mat-chip>\n                <input matInput\n                    [matChipInputFor]=\"chipList\"\n                    [matChipInputAddOnBlur]=\"true\"\n                    (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n                    [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n                    [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n                    [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n                    [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n                >\n                <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n            </mat-chip-list>\n            <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS\">\n        <mat-form-field>\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <mat-chip-list #chipList\n                [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n                [required]=\"metadata.required\"\n            >\n                <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n                    {{value}}\n                    <button matChipRemove>\n                        <i class=\"{{metadataStringChipsArray.deleteIcon}}\"></i>\n                    </button>\n                </mat-chip>\n                <input matInput\n                    [matChipInputFor]=\"chipList\"\n                    [matAutocomplete]=\"auto\"\n                    [matChipInputAddOnBlur]=\"true\"\n                    (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n                    (keyup)=\"filterAutocompleteStrings(chipsInput)\"\n                    [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n                    #chipsElement\n                    [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n                    [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n                    [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n                >\n                <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n            </mat-chip-list>\n            <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"selected($event, chipsElement)\">\n                <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n                  {{value}}\n                </mat-option>\n            </mat-autocomplete>\n            <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <!-------------------------------------------->\n    <!-------------------Dates-------------------->\n    <!-------------------------------------------->\n    <div *ngSwitchCase=\"DecoratorTypes.DATE\">\n        <mat-form-field appearance=\"standard\">\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <input\n                matInput\n                [(ngModel)]=\"entity[propertyKey]\"\n                [name]=\"propertyKey.toString()\"\n                #model=\"ngModel\"\n                [matDatepicker]=\"picker\"\n                [required]=\"metadata.required\"\n                [min]=\"metadataDefaultDate.min ? metadataDefaultDate.min(DateUtilities.asDate(entity[propertyKey])) : undefined\"\n                [max]=\"metadataDefaultDate.max ? metadataDefaultDate.max(DateUtilities.asDate(entity[propertyKey])) : undefined\"\n                [matDatepickerFilter]=\"metadataDefaultDate.filter ? metadataDefaultDate.filter : defaultDateFilter\"\n            >\n            <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n            <mat-datepicker #picker></mat-datepicker>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.DATE_RANGE\">\n        <mat-form-field appearance=\"standard\">\n            <mat-label>{{metadata.displayName}}</mat-label>\n            \n            <mat-date-range-input [rangePicker]=\"picker\" [required]=\"metadata.required\" [dateFilter]=\"metadataDateRangeDate.filter ? metadataDateRangeDate.filter : defaultDateFilter\">\n                <input matStartDate\n                    [(ngModel)]=\"dateRangeStart\"\n                    [name]=\"propertyKey.toString() + 'start'\"\n                    #startModel=\"ngModel\"\n                    [required]=\"metadata.required\"\n                    [min]=\"metadataDateRangeDate.minStart ? metadataDateRangeDate.minStart(dateRange.start) : undefined\"\n                    [max]=\"metadataDateRangeDate.maxStart ? metadataDateRangeDate.maxStart(dateRange.start) : undefined\"\n                    [placeholder]=\"metadataDateRangeDate.placeholderStart ? metadataDateRangeDate.placeholderStart : 'Start'\"\n                    (ngModelChange)=\"setDateRangeValues()\"\n                >\n                <input matEndDate\n                    [(ngModel)]=\"dateRangeEnd\"\n                    [name]=\"propertyKey.toString() + 'end'\"\n                    #endModel=\"ngModel\"\n                    [required]=\"metadata.required\"\n                    [min]=\"metadataDateRangeDate.minEnd ? metadataDateRangeDate.minEnd(dateRange.end) : undefined\"\n                    [max]=\"metadataDateRangeDate.maxEnd ? metadataDateRangeDate.maxEnd(dateRange.end) : undefined\"\n                    [placeholder]=\"metadataDateRangeDate.placeholderEnd ? metadataDateRangeDate.placeholderEnd : 'End'\"\n                    (ngModelChange)=\"setDateRangeValues()\"\n                >\n            </mat-date-range-input>\n            <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n            <mat-date-range-picker #picker></mat-date-range-picker>\n\n            <mat-error *ngIf=\"startModel.errors\">{{getValidationErrorMessage(startModel)}}</mat-error>\n            <mat-error *ngIf=\"!startModel.errors && endModel.errors\">{{getValidationErrorMessage(endModel)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchCase=\"DecoratorTypes.DATE_TIME\" class=\"date-time\">\n        <mat-form-field appearance=\"standard\" class=\"datepicker\">\n            <mat-label>{{metadata.displayName}}</mat-label>\n            <input\n                matInput\n                [(ngModel)]=\"dateTime\"\n                [name]=\"propertyKey.toString()\"\n                #model=\"ngModel\"\n                [matDatepicker]=\"picker\"\n                [required]=\"metadata.required\"\n                [min]=\"metadataDateTimeDate.minDate ? metadataDateTimeDate.minDate(dateTime) : undefined\"\n                [max]=\"metadataDateTimeDate.maxDate ? metadataDateTimeDate.maxDate(dateTime) : undefined\"\n                [matDatepickerFilter]=\"metadataDateTimeDate.filterDate ? metadataDateTimeDate.filterDate : defaultDateFilter\"\n                (dateInput)=\"setTime()\"\n            >\n            <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n            <mat-datepicker #picker></mat-datepicker>\n            <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n        </mat-form-field>\n        <mat-form-field class=\"timepicker\">\n            <mat-label>{{metadataDateTimeDate.timeDisplayName}}</mat-label>\n            <mat-select\n                [(ngModel)]=\"time\"\n                [name]=\"propertyKey.toString() + 'time'\"\n                #timeModel=\"ngModel\"\n                [required]=\"metadata.required\"\n                [compareWith]=\"compareTimes\"\n                (ngModelChange)=\"setTime()\"\n            >\n                <mat-option *ngFor=\"let validTime of DateUtilities.getValidTimesForDropdown(\n                        DateUtilities.asDate(entity[propertyKey]),\n                        metadataDateTimeDate.times,\n                        metadataDateTimeDate.minTime,\n                        metadataDateTimeDate.maxTime,\n                        metadataDateTimeDate.filterTime\n                    )\"\n                    [value]=\"validTime.value\"\n                >\n                    {{validTime.displayName}}\n                </mat-option>\n            </mat-select>\n            <mat-error>{{getValidationErrorMessage(timeModel)}}</mat-error>\n        </mat-form-field>\n    </div>\n\n    <div *ngSwitchDefault>ERROR: The type {{type}} is not known.</div>\n</div>\n\n<!--------------------------------------------------------->\n<!--------------------Add Array Item Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #addArrayItemDialog>\n    <h2 mat-dialog-title>{{dialogData.createDialogData.title}}</h2>\n\n    <mat-dialog-content>\n        <form #form=\"ngForm\" class=\"row\">\n            <div class=\"row\" *ngFor=\"let row of arrayItemDialogRows\">\n                <ngx-mat-entity-input\n                    *ngFor=\"let key of row.keys\"\n                    [entity]=\"dialogData.entity\"\n                    [propertyKey]=\"key\"\n                    [hideOmitForCreate]=\"true\"\n                    [getValidationErrorMessage]=\"dialogData.getValidationErrorMessage\"\n                    class=\"col-lg-{{EntityUtilities.getWidth(dialogData.entity, key, 'lg')}} col-md-{{EntityUtilities.getWidth(dialogData.entity, key, 'md')}} col-sm-{{EntityUtilities.getWidth(dialogData.entity, key, 'sm')}}\"\n                >\n                </ngx-mat-entity-input>\n            </div>\n        </form>\n    </mat-dialog-content>\n\n    <mat-dialog-actions>\n        <button mat-raised-button (click)=\"addArrayItem()\" [disabled]=\"!EntityUtilities.isEntityValid(dialogData.entity, 'create')\">\n            {{dialogData.createDialogData.createButtonLabel}}\n        </button>\n        <button mat-raised-button (click)=\"cancelAddArrayItem()\" class=\"cancel-button\">\n            {{dialogData.createDialogData.cancelButtonLabel}}\n        </button>\n    </mat-dialog-actions>\n\n</ng-template>", styles: ["mat-form-field{width:100%}::ng-deep .hideUnderline .mat-form-field-underline{opacity:0%}.entityArray .buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px}.entityArray mat-table{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:25px}.entityArray .mat-column-select{flex:0 0 75px}.entityArray .array-error{display:flex;align-items:center;justify-content:center;margin-top:-25.8px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:25.8px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.date-time{display:flex;align-items:baseline}.date-time .timepicker{margin-left:10px}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.MatDialog }]; }, propDecorators: { entity: [{
                 type: Input
             }], propertyKey: [{
                 type: Input
@@ -1025,53 +1515,134 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 type: Input
             }], hideOmitForEdit: [{
                 type: Input
+            }], addArrayItemDialog: [{
+                type: ViewChild,
+                args: ['addArrayItemDialog']
             }] } });
 
-class NgxMatEntityCreateDialogComponent {
-    constructor(data, dialogRef, injector, dialog) {
-        this.data = data;
-        this.dialogRef = dialogRef;
-        this.injector = injector;
-        this.dialog = dialog;
-        this.EntityUtilities = EntityUtilities;
-        this.getWidth = EntityUtilities.getWidth;
+class NgxMatEntityInputModule {
+}
+NgxMatEntityInputModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NgxMatEntityInputModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, declarations: [NgxMatEntityInputComponent], imports: [CommonModule,
+        MatInputModule,
+        FormsModule,
+        MatFormFieldModule,
+        MatSelectModule,
+        MatAutocompleteModule,
+        MatCheckboxModule,
+        MatSlideToggleModule,
+        MatChipsModule,
+        MatIconModule,
+        MatTableModule,
+        MatDialogModule,
+        MatButtonModule,
+        MatDatepickerModule], exports: [NgxMatEntityInputComponent] });
+NgxMatEntityInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, imports: [[
+            CommonModule,
+            MatInputModule,
+            FormsModule,
+            MatFormFieldModule,
+            MatSelectModule,
+            MatAutocompleteModule,
+            MatCheckboxModule,
+            MatSlideToggleModule,
+            MatChipsModule,
+            MatIconModule,
+            MatTableModule,
+            MatDialogModule,
+            MatButtonModule,
+            MatDatepickerModule
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        NgxMatEntityInputComponent,
+                    ],
+                    imports: [
+                        CommonModule,
+                        MatInputModule,
+                        FormsModule,
+                        MatFormFieldModule,
+                        MatSelectModule,
+                        MatAutocompleteModule,
+                        MatCheckboxModule,
+                        MatSlideToggleModule,
+                        MatChipsModule,
+                        MatIconModule,
+                        MatTableModule,
+                        MatDialogModule,
+                        MatButtonModule,
+                        MatDatepickerModule
+                    ],
+                    exports: [NgxMatEntityInputComponent]
+                }]
+        }] });
+
+/**
+ * The internal CreateEntityDialogData. Requires all default values the user can leave out.
+ */
+class CreateEntityDialogDataInternal {
+    constructor(entity, EntityServiceClass, createDialogData) {
+        this.entity = entity;
+        this.EntityServiceClass = EntityServiceClass;
+        this.createDialogData = createDialogData;
+    }
+}
+/**
+ * The Builder for the CreateEntityDialogData. Sets default values.
+ */
+class CreateEntityDialogDataBuilder extends BaseBuilder {
+    constructor(data) {
+        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;
+        this.dialogRef = dialogRef;
+        this.injector = injector;
+        this.dialog = dialog;
+        this.EntityUtilities = EntityUtilities;
+        this.getWidth = EntityUtilities.getWidth;
     }
     ngOnInit() {
+        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() {
-        if (this.data.createDialogData.createRequiresConfirmDialog === false) {
+        if (!this.data.createDialogData?.createRequiresConfirmDialog) {
             return this.confirmCreate();
         }
-        const dialogData = {
-            // eslint-disable-next-line max-len
-            text: this.data.createDialogData.confirmCreateDialogData?.text ? this.data.createDialogData.confirmCreateDialogData?.text : ['Do you really want to create this entity?'],
-            type: 'default',
-            // eslint-disable-next-line max-len
-            confirmButtonLabel: this.data.createDialogData.confirmCreateDialogData?.confirmButtonLabel ? this.data.createDialogData.confirmCreateDialogData?.confirmButtonLabel : 'Create',
-            // eslint-disable-next-line max-len
-            cancelButtonLabel: this.data.createDialogData.confirmCreateDialogData?.cancelButtonLabel ? this.data.createDialogData.confirmCreateDialogData?.cancelButtonLabel : 'Cancel',
-            // eslint-disable-next-line max-len
-            title: this.data.createDialogData.confirmCreateDialogData?.title ? this.data.createDialogData.confirmCreateDialogData?.title : 'Create',
-            // eslint-disable-next-line max-len
-            requireConfirmation: this.data.createDialogData.confirmCreateDialogData?.requireConfirmation ? this.data.createDialogData.confirmCreateDialogData?.requireConfirmation : false,
-            // eslint-disable-next-line max-len
-            confirmationText: this.data.createDialogData.confirmCreateDialogData?.confirmationText ? this.data.createDialogData.confirmCreateDialogData?.confirmationText : undefined,
-        };
-        const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
+        const dialogData = new ConfirmDialogDataBuilder(this.data.createDialogData?.confirmCreateDialogData)
+            .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();
             }
@@ -1080,23 +1651,96 @@ 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 ? data.createDialogData.createButtonLabel : 'Create'}}\n    </button>\n    <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n        {{data.createDialogData.cancelButtonLabel ? data.createDialogData.cancelButtonLabel : 'Cancel'}}\n    </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}\n"], components: [{ type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i12.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i12.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i12.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
+NgxMatEntityCreateDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityCreateDialogComponent, selector: "ngx-mat-entity-create-dialog", ngImport: i0, template: "<h2 mat-dialog-title>{{data.createDialogData.title}}</h2>\n\n<mat-dialog-content>\n    <form #form=\"ngForm\">\n        <div class=\"row\" *ngFor=\"let row of entityRows\">\n            <ngx-mat-entity-input\n                *ngFor=\"let key of row.keys\"\n                [entity]=\"data.entity\"\n                [propertyKey]=\"key\"\n                [hideOmitForCreate]=\"true\"\n                class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n            >\n            </ngx-mat-entity-input>\n        </div>\n    </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n    <button mat-raised-button (click)=\"create()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'create')\">\n        {{data.createDialogData.createButtonLabel}}\n    </button>\n    <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n        {{data.createDialogData.cancelButtonLabel}}\n    </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}\n"], components: [{ type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i14.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i14.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i14.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
 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 ? data.createDialogData.createButtonLabel : 'Create'}}\n    </button>\n    <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n        {{data.createDialogData.cancelButtonLabel ? data.createDialogData.cancelButtonLabel : 'Cancel'}}\n    </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}\n"] }]
+            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,
                     args: [MAT_DIALOG_DATA]
                 }] }, { 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;
+        this.confirmButtonLabel = confirmButtonLabel;
+        this.deleteButtonLabel = deleteButtonLabel;
+        this.cancelButtonLabel = cancelButtonLabel;
+        this.deleteRequiresConfirmDialog = deleteRequiresConfirmDialog;
+        this.editRequiresConfirmDialog = editRequiresConfirmDialog;
+        this.confirmDeleteDialogData = confirmDeleteDialogData;
+        this.confirmEditDialogData = confirmEditDialogData;
+    }
+}
+/**
+ * The Builder for the EditDialogData. Sets default values.
+ */
+class EditDialogDataBuilder extends BaseBuilder {
+    constructor(data) {
+        super(data);
+    }
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    generateBaseData(data) {
+        const confirmEditDialogData = new ConfirmDialogDataBuilder(data?.confirmEditDialogData)
+            .withDefault('confirmButtonLabel', 'Save')
+            .withDefault('text', ['Do you really want to save all changes?'])
+            .withDefault('title', 'Edit')
+            .getResult();
+        const confirmDeleteDialogData = new ConfirmDialogDataBuilder(data?.confirmDeleteDialogData)
+            .withDefault('confirmButtonLabel', 'Delete')
+            .withDefault('type', 'delete')
+            .withDefault('text', ['Do you really want to delete this entity?'])
+            .withDefault('title', 'Delete')
+            .getResult();
+        return new EditDialogDataInternal(data?.title ? data.title : () => 'Edit', data?.confirmButtonLabel ? data.confirmButtonLabel : 'Save', data?.deleteButtonLabel ? data.deleteButtonLabel : 'Delete', data?.cancelButtonLabel ? data.cancelButtonLabel : 'Cancel', data?.deleteRequiresConfirmDialog ? data.deleteRequiresConfirmDialog : true, 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;
+        this.EntityServiceClass = EntityServiceClass;
+        this.editDialogData = editDialogData;
+        this.allowDelete = allowDelete;
+    }
+}
+/**
+ * The Builder for the EditEntityDialogData. Sets default values.
+ */
+class EditEntityDialogDataBuilder extends BaseBuilder {
+    constructor(data) {
+        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(data, dialogRef, injector, dialog) {
-        this.data = data;
+    constructor(inputData, dialogRef, injector, dialog) {
+        this.inputData = inputData;
         this.dialogRef = dialogRef;
         this.injector = injector;
         this.dialog = dialog;
@@ -1104,41 +1748,31 @@ class NgxMatEntityEditDialogComponent {
         this.getWidth = EntityUtilities.getWidth;
     }
     ngOnInit() {
+        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 === false) {
+        if (!this.data.editDialogData.editRequiresConfirmDialog) {
             return this.confirmEdit();
         }
-        const dialogData = {
-            // eslint-disable-next-line max-len
-            text: this.data.editDialogData.confirmEditDialogData?.text ? this.data.editDialogData.confirmEditDialogData?.text : ['Do you really want to save all changes?'],
-            type: 'default',
-            // eslint-disable-next-line max-len
-            confirmButtonLabel: this.data.editDialogData.confirmEditDialogData?.confirmButtonLabel ? this.data.editDialogData.confirmEditDialogData?.confirmButtonLabel : 'Confirm',
-            // eslint-disable-next-line max-len
-            cancelButtonLabel: this.data.editDialogData.confirmEditDialogData?.cancelButtonLabel ? this.data.editDialogData.confirmEditDialogData?.cancelButtonLabel : 'Cancel',
-            title: this.data.editDialogData.confirmEditDialogData?.title ? this.data.editDialogData.confirmEditDialogData?.title : 'Edit',
-            // eslint-disable-next-line max-len
-            requireConfirmation: this.data.editDialogData.confirmEditDialogData?.requireConfirmation ? this.data.editDialogData.confirmEditDialogData?.requireConfirmation : false,
-            // eslint-disable-next-line max-len
-            confirmationText: this.data.editDialogData.confirmEditDialogData?.confirmationText ? this.data.editDialogData.confirmEditDialogData?.confirmationText : undefined,
-        };
-        const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
+        const dialogData = new ConfirmDialogDataBuilder(this.data.editDialogData.confirmEditDialogData)
+            .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();
             }
@@ -1147,54 +1781,160 @@ 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 === false) {
+        if (!this.data.editDialogData.deleteRequiresConfirmDialog) {
             return this.confirmDelete();
         }
-        const dialogData = {
-            // eslint-disable-next-line max-len
-            text: this.data.editDialogData.confirmDeleteDialogData?.text ? this.data.editDialogData.confirmDeleteDialogData?.text : ['Do you really want to delete this entity?'],
-            type: 'delete',
-            // eslint-disable-next-line max-len
-            confirmButtonLabel: this.data.editDialogData.confirmDeleteDialogData?.confirmButtonLabel ? this.data.editDialogData.confirmDeleteDialogData?.confirmButtonLabel : 'Delete',
-            // eslint-disable-next-line max-len
-            cancelButtonLabel: this.data.editDialogData.confirmDeleteDialogData?.cancelButtonLabel ? this.data.editDialogData.confirmDeleteDialogData?.cancelButtonLabel : 'Cancel',
-            // eslint-disable-next-line max-len
-            title: this.data.editDialogData.confirmDeleteDialogData?.title ? this.data.editDialogData.confirmDeleteDialogData?.title : 'Delete',
-            // eslint-disable-next-line max-len
-            requireConfirmation: this.data.editDialogData.confirmDeleteDialogData?.requireConfirmation ? this.data.editDialogData.confirmDeleteDialogData?.requireConfirmation : false,
-            // eslint-disable-next-line max-len
-            confirmationText: this.data.editDialogData.confirmDeleteDialogData?.confirmationText ? this.data.editDialogData.confirmDeleteDialogData?.confirmationText : undefined,
-        };
-        const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
+        const dialogData = new ConfirmDialogDataBuilder(this.data.editDialogData.confirmDeleteDialogData)
+            .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();
             }
         });
     }
     confirmDelete() {
-        this.entityService.delete(this.entityPriorChanges.id).then(() => this.dialogRef.close(2));
+        this.entityService.delete(this.entityPriorChanges).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 ? data.editDialogData.deleteButtonLabel : 'Delete'}}\n    </button>\n</h2>\n\n<mat-dialog-content>\n    <form #form=\"ngForm\" class=\"row\">\n        <ngx-mat-entity-input\n            *ngFor=\"let key of entityKeys\"\n            [entity]=\"data.entity\"\n            [propertyKey]=\"key\"\n            [hideOmitForEdit]=\"true\"\n            class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n        >\n        </ngx-mat-entity-input>\n    </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n    <button mat-raised-button (click)=\"edit()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'edit') || !EntityUtilities.dirty(data.entity, entityPriorChanges)\">\n        {{data.editDialogData.confirmButtonLabel ? data.editDialogData.confirmButtonLabel : 'Save'}}\n    </button>\n    <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n        {{data.editDialogData.cancelButtonLabel ? data.editDialogData.cancelButtonLabel : 'Cancel'}}\n    </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}.delete-button{float:right}\n"], components: [{ type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }], directives: [{ type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i12.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i12.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i12.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
+NgxMatEntityEditDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityEditDialogComponent, selector: "ngx-mat-entity-edit-dialog", ngImport: i0, template: "<h2 mat-dialog-title>\n    {{data.editDialogData.title(data.entity)}}\n    <button *ngIf=\"data.allowDelete(data.entity)\" mat-raised-button (click)=\"delete()\" color=\"warn\" class=\"delete-button\" tabindex=\"-1\">\n        {{data.editDialogData.deleteButtonLabel}}\n    </button>\n</h2>\n\n<mat-dialog-content>\n    <form #form=\"ngForm\" class=\"row\">\n        <div class=\"row\" *ngFor=\"let row of entityRows\">\n            <ngx-mat-entity-input\n                *ngFor=\"let key of row.keys\"\n                [entity]=\"data.entity\"\n                [propertyKey]=\"key\"\n                [hideOmitForEdit]=\"true\"\n                class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n            >\n            </ngx-mat-entity-input>\n        </div>\n    </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n    <button mat-raised-button (click)=\"edit()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'update') || !EntityUtilities.dirty(data.entity, entityPriorChanges)\">\n        {{data.editDialogData.confirmButtonLabel}}\n    </button>\n    <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n        {{data.editDialogData.cancelButtonLabel}}\n    </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}.delete-button{float:right}\n"], components: [{ type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }], directives: [{ type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i14.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i14.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i14.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
 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 ? data.editDialogData.deleteButtonLabel : 'Delete'}}\n    </button>\n</h2>\n\n<mat-dialog-content>\n    <form #form=\"ngForm\" class=\"row\">\n        <ngx-mat-entity-input\n            *ngFor=\"let key of entityKeys\"\n            [entity]=\"data.entity\"\n            [propertyKey]=\"key\"\n            [hideOmitForEdit]=\"true\"\n            class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n        >\n        </ngx-mat-entity-input>\n    </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n    <button mat-raised-button (click)=\"edit()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'edit') || !EntityUtilities.dirty(data.entity, entityPriorChanges)\">\n        {{data.editDialogData.confirmButtonLabel ? data.editDialogData.confirmButtonLabel : 'Save'}}\n    </button>\n    <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n        {{data.editDialogData.cancelButtonLabel ? data.editDialogData.cancelButtonLabel : 'Cancel'}}\n    </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}.delete-button{float:right}\n"] }]
+            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,
                     args: [MAT_DIALOG_DATA]
                 }] }, { 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;
+        this.createDialogData = createDialogData;
+        this.editDialogData = editDialogData;
+    }
+}
+/**
+ * The Builder for the table BaseData. Sets default values.
+ */
+class BaseDataBuilder extends BaseBuilder {
+    constructor(data) {
+        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;
+        this.displayColumns = displayColumns;
+        this.EntityServiceClass = EntityServiceClass;
+        this.EntityClass = EntityClass;
+        this.searchLabel = searchLabel;
+        this.createButtonLabel = createButtonLabel;
+        this.searchString = searchString;
+        this.allowCreate = allowCreate;
+        this.allowEdit = allowEdit;
+        this.allowDelete = allowDelete;
+        this.multiSelectActions = multiSelectActions;
+        this.multiSelectLabel = multiSelectLabel;
+        this.edit = edit;
+        this.create = create;
+    }
+}
+/**
+ * The Builder for the complete TableData. Sets default values and validates user input.
+ */
+class TableDataBuilder extends BaseBuilder {
+    constructor(data) {
+        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) {
+        if (data.baseData.multiSelectActions?.length && data.baseData.displayColumns.find(dp => dp.displayName === 'select')) {
+            throw new Error(`The name "select" for a display column is reserved for the multi-select action functionality.
+                Please choose a different name.`);
+        }
+        if ((data.baseData.allowEdit && data.baseData.allowEdit !== (() => false)
+            || data.baseData.allowDelete && data.baseData.allowDelete !== (() => false)
+            || data.baseData.allowCreate)
+            && !data.baseData.EntityClass) {
+            throw new Error(`
+                Missing required Input data "EntityClass".
+                You can only omit this value if you can neither create or update entities.`);
+        }
+        if (data.baseData.allowCreate !== false && !data.baseData.create && !data.createDialogData) {
+            throw new Error(`Missing required Input data "createDialogData".
+                You can only omit this value when creation is disallowed or done with a custom create method.`);
+        }
+        if ((data.baseData.allowEdit !== (() => false)
+            || data.baseData.allowDelete !== (() => false))
+            && !data.baseData.edit
+            && !data.editDialogData) {
+            throw new Error(`Missing required Input data "editDialogData".
+                You can only omit this value when editing and deleting is disallowed or done with a custom edit method.`);
+        }
+    }
+}
+/**
+ * The default search function taken from googles mat table.
+ * This will be used if no custom search function is provided by the configuration.
+ *
+ * It generates a string from an entity which is then used to compare it to the search input.
+ *
+ * @param entity - An entity that is in the search.
+ * @returns The generated string of the given entity used for comparison with the search input.
+ */
+function defaultSearchFunction(entity) {
+    const searchString = Object.keys(entity)
+        .reduce((currentTerm, key) => {
+        return `${currentTerm}${entity[key]}◬`;
+    }, '')
+        .toLowerCase();
+    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;
@@ -1203,27 +1943,26 @@ class NgxMatEntityTableComponent {
         this.dataSource = new MatTableDataSource();
         this.selection = new SelectionModel(true, []);
     }
+    /**
+     * Sets up all the configuration for the table and the EntityService.
+     */
     ngOnInit() {
-        this.validateInput();
-        this.entityService = this.injector.get(this.entitiesData.baseData.EntityServiceClass);
-        const givenDisplayColumns = this.entitiesData.baseData.displayColumns.map((v) => v.displayName);
-        if (this.entitiesData.baseData.multiSelectActions?.length) {
-            if (givenDisplayColumns.find((s) => s === 'select')) {
-                throw new Error(`The name "select" for a display column is reserved for the multi-select action functionality.
-                    Please choose a different name.`);
-            }
+        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) {
             this.displayedColumns = ['select'].concat(givenDisplayColumns);
         }
         else {
             this.displayedColumns = givenDisplayColumns;
         }
         this.dataSource.sortingDataAccessor = (entity, header) => {
-            return this.entitiesData.baseData.displayColumns.find((dp) => dp.displayName === header)?.value(entity);
+            return this.data.baseData.displayColumns.find((dp) => dp.displayName === header)?.value(entity);
         };
         this.dataSource.sort = this.sort;
-        if (this.entitiesData.baseData.searchString) {
+        if (this.data.baseData.searchString) {
             this.dataSource.filterPredicate = (entity, filter) => {
-                const searchStr = this.entitiesData.baseData.searchString?.(entity);
+                const searchStr = this.data.baseData.searchString(entity);
                 const formattedSearchString = searchStr.toLowerCase();
                 const formattedFilterString = filter.toLowerCase();
                 return formattedSearchString.includes(formattedFilterString);
@@ -1237,62 +1976,33 @@ class NgxMatEntityTableComponent {
         });
         this.entityService.read();
     }
-    validateInput() {
-        if (!this.entitiesData.baseData.displayColumns) {
-            throw new Error('Missing required Input data "displayColumns"');
-        }
-        if (!this.entitiesData.baseData.title) {
-            throw new Error('Missing required Input data "title"');
-        }
-        if (!this.entitiesData.baseData.EntityServiceClass) {
-            throw new Error('Missing required Input data "EntityServiceClass"');
-        }
-        if (this.entitiesData.baseData.allowCreate === undefined) {
-            this.entitiesData.baseData.allowCreate = true;
-        }
-        if (this.entitiesData.baseData.allowEdit === undefined) {
-            this.entitiesData.baseData.allowEdit = () => true;
-        }
-        if (this.entitiesData.baseData.allowDelete === undefined) {
-            this.entitiesData.baseData.allowDelete = () => true;
-        }
-        if ((this.entitiesData.baseData.allowEdit !== (() => false)
-            || this.entitiesData.baseData.allowDelete !== (() => false)
-            || this.entitiesData.baseData.allowCreate)
-            && !this.entitiesData.baseData.EntityClass) {
-            throw new Error(`
-                Missing required Input data "EntityClass".
-                You can only omit this value if you can neither create or update entities.`);
-        }
-        if (this.entitiesData.baseData.allowCreate && !this.entitiesData.baseData.create && !this.entitiesData.createDialogData) {
-            throw new Error(`Missing required Input data "createDialogData".
-                You can only omit this value when creation is disallowed or done with a custom create method.`);
-        }
-        if ((this.entitiesData.baseData.allowEdit !== (() => false)
-            || this.entitiesData.baseData.allowDelete !== (() => false))
-            && !this.entitiesData.baseData.edit
-            && !this.entitiesData.editDialogData) {
-            throw new Error(`Missing required Input data "editDialogData".
-                You can only omit this value when editing and deleting is disallowed or done with a custom edit method.`);
-        }
-    }
+    /**
+     * 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.entitiesData.baseData.allowEdit?.(entity)) {
-            if (this.entitiesData.baseData.edit) {
-                this.entitiesData.baseData.edit(new this.entitiesData.baseData.EntityClass(entity));
+        if (this.data.baseData.allowEdit(entity)) {
+            if (!this.data.baseData.EntityClass) {
+                throw new Error('No "EntityClass" specified for this table');
+            }
+            if (this.data.baseData.edit) {
+                this.data.baseData.edit(new this.data.baseData.EntityClass(entity));
             }
             else {
-                this.editDefault(new this.entitiesData.baseData.EntityClass(entity));
+                this.editDefault(new this.data.baseData.EntityClass(entity));
             }
         }
     }
     editDefault(entity) {
-        const dialogData = {
+        const inputDialogData = {
             entity: entity,
-            EntityServiceClass: this.entitiesData.baseData.EntityServiceClass,
-            allowDelete: this.entitiesData.baseData.allowDelete,
-            editDialogData: this.entitiesData.editDialogData
+            EntityServiceClass: this.data.baseData.EntityServiceClass,
+            allowDelete: this.data.baseData.allowDelete,
+            editDialogData: this.data.editDialogData
         };
+        const dialogData = new EditEntityDialogDataBuilder(inputDialogData).getResult();
         firstValueFrom(this.dialog.open(NgxMatEntityEditDialogComponent, {
             data: dialogData,
             minWidth: '60%',
@@ -1301,28 +2011,36 @@ class NgxMatEntityTableComponent {
         }).afterClosed()).then((res) => {
             if (res === 0) {
                 const data = this.dataSource.data;
-                data[this.dataSource.data.findIndex((e) => e.id === entity.id)] = entity;
+                data[this.dataSource.data.findIndex((e) => e[this.entityService.idKey] === entity[this.entityService.idKey])] = entity;
                 this.dataSource.data = data;
                 this.selection.clear();
             }
         });
     }
+    /**
+     * 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.entitiesData.baseData.allowCreate) {
-            if (this.entitiesData.baseData.create) {
-                this.entitiesData.baseData.create(new this.entitiesData.baseData.EntityClass());
+        if (this.data.baseData.allowCreate) {
+            if (!this.data.baseData.EntityClass) {
+                throw new Error('No "EntityClass" specified for this table');
+            }
+            if (this.data.baseData.create) {
+                this.data.baseData.create(new this.data.baseData.EntityClass());
             }
             else {
-                this.createDefault(new this.entitiesData.baseData.EntityClass());
+                this.createDefault(new this.data.baseData.EntityClass());
             }
         }
     }
     createDefault(entity) {
-        const dialogData = {
+        const dialogData = new CreateEntityDialogDataBuilder({
             entity: entity,
-            EntityServiceClass: this.entitiesData.baseData.EntityServiceClass,
-            createDialogData: this.entitiesData.createDialogData
-        };
+            EntityServiceClass: this.data.baseData.EntityServiceClass,
+            createDialogData: this.data.createDialogData
+        }).getResult();
         this.dialog.open(NgxMatEntityCreateDialogComponent, {
             data: dialogData,
             minWidth: '60%',
@@ -1330,26 +2048,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 = {
-            // eslint-disable-next-line max-len
-            text: action.confirmDialogData?.text ? action.confirmDialogData?.text : [`Do you really want to run this action on ${this.selection.selected.length} entries?`],
-            type: 'default',
-            confirmButtonLabel: action.confirmDialogData?.confirmButtonLabel ? action.confirmDialogData?.confirmButtonLabel : 'Confirm',
-            cancelButtonLabel: action.confirmDialogData?.cancelButtonLabel ? action.confirmDialogData?.cancelButtonLabel : 'Cancel',
-            title: action.confirmDialogData?.title ? action.confirmDialogData?.title : action.displayName,
-            requireConfirmation: action.confirmDialogData?.requireConfirmation ? action.confirmDialogData?.requireConfirmation : false,
-            confirmationText: action.confirmDialogData?.confirmationText ? action.confirmDialogData?.confirmationText : undefined
-        };
-        const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
+        const dialogData = new ConfirmDialogDataBuilder(action.confirmDialogData)
+            .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);
             }
@@ -1358,6 +2076,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) {
         if (!this.selection.selected.length) {
             return true;
@@ -1367,6 +2091,9 @@ class NgxMatEntityTableComponent {
         }
         return false;
     }
+    /**
+     * Toggles all entries in the table.
+     */
     masterToggle() {
         if (this.isAllSelected()) {
             this.selection.clear();
@@ -1375,6 +2102,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;
@@ -1384,17 +2117,22 @@ 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: { entitiesData: "entitiesData" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }, { propertyName: "filter", first: true, predicate: ["filter"], descendants: true, static: true }], ngImport: i0, template: "<h1 class=\"title\">{{entitiesData.baseData.title}}</h1>\n\n<div class=\"row\">\n    <mat-form-field class=\"col-lg-8 col-md-6 col-sm-12\">\n        <mat-label>{{entitiesData.baseData.searchLabel ? entitiesData.baseData.searchLabel : 'Search'}}</mat-label>\n        <input matInput (keyup)=\"applyFilter($event)\" />\n    </mat-form-field>\n    <div\n        *ngIf=\"entitiesData.baseData.multiSelectActions?.length\"\n        [class.col-lg-2]=\"entitiesData.baseData.allowCreate\"\n        [class.col-lg-4]=\"!entitiesData.baseData.allowCreate\"\n        [class.col-md-3]=\"entitiesData.baseData.allowCreate\"\n        [class.col-md-6]=\"!entitiesData.baseData.allowCreate\"\n        [class.col-sm-6]=\"entitiesData.baseData.allowCreate\"\n        [class.col-sm-12]=\"!entitiesData.baseData.allowCreate\"\n    >\n        <button class=\"actions-button\" [matMenuTriggerFor]=\"menu\" mat-raised-button>\n            {{entitiesData.baseData.multiSelectLabel ? entitiesData.baseData.multiSelectLabel : 'Actions'}}\n        </button>\n    </div>\n    <mat-menu #menu=\"matMenu\">\n        <button *ngFor=\"let action of entitiesData.baseData.multiSelectActions\" [disabled]=\"multiActionDisabled(action)\" (click)=\"runMultiAction(action)\" mat-menu-item>\n            {{action.displayName}}\n        </button>\n    </mat-menu>\n\n    <div\n        *ngIf=\"entitiesData.baseData.allowCreate\"\n        [class.col-lg-2]=\"entitiesData.baseData.multiSelectActions?.length\"\n        [class.col-lg-4]=\"!entitiesData.baseData.multiSelectActions?.length\"\n        [class.col-md-3]=\"entitiesData.baseData.multiSelectActions?.length\"\n        [class.col-md-6]=\"!entitiesData.baseData.multiSelectActions?.length\"\n        [class.col-sm-6]=\"entitiesData.baseData.multiSelectActions?.length\"\n        [class.col-sm-12]=\"!entitiesData.baseData.multiSelectActions?.length\"\n    >\n        <button class=\"create-button\" (click)=\"createEntity()\" mat-raised-button>\n            {{entitiesData.baseData.createButtonLabel ? entitiesData.baseData.createButtonLabel : 'Create'}}\n        </button>\n    </div>\n</div>\n\n<div class=\"mat-elevation-z8\">\n    <mat-table *ngIf=\"dataSource\" [dataSource]=\"dataSource\" matSort>\n        <!-- select Column -->\n        <ng-container matColumnDef=\"select\">\n            <mat-header-cell *matHeaderCellDef>\n                <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"> </mat-checkbox>\n            </mat-header-cell>\n            <mat-cell *matCellDef=\"let module\" class=\"module\">\n                <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"> </mat-checkbox>\n            </mat-cell>\n        </ng-container>\n\n        <ng-container *ngFor=\"let dCol of entitiesData.baseData.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n            <mat-header-cell *matHeaderCellDef mat-sort-header>\n                {{dCol.displayName}}\n            </mat-header-cell>\n            <mat-cell class=\"entity\" [class.enabled]=\"entitiesData.baseData.allowEdit?.(entity)\" (click)=\"editEntity(entity)\" *matCellDef=\"let entity\">\n                {{dCol.value(entity)}}\n            </mat-cell>\n        </ng-container>\n\n        <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n        <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n    </mat-table>\n\n    <mat-paginator *ngIf=\"dataSource\" id=\"paginator\" [length]=\"dataSource.filteredData.length\" [pageIndex]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 50]\"> </mat-paginator>\n</div>\n", styles: [".title{text-align:center}button{width:100%}.mat-column-select{flex:0 0 75px}.enabled:hover{cursor:pointer}@media (max-width: 767px){.actions-button{margin-bottom:15px}}@media (max-width: 575px){.create-button{margin-bottom:15px}}\n"], components: [{ type: i1$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i4$2.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i4$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: i4$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i4$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i4$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { type: i7$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }], directives: [{ type: i1$1.MatLabel, selector: "mat-label" }, { type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i4$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i4$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i4$1.MatCellDef, selector: "[matCellDef]" }, { type: i4$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i4$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i4$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }] });
+NgxMatEntityTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityTableComponent, selector: "ngx-mat-entity-table", inputs: { tableData: "tableData" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }, { propertyName: "filter", first: true, predicate: ["filter"], descendants: true, static: true }], ngImport: i0, template: "<h1 class=\"title\">{{data.baseData.title}}</h1>\n\n<div class=\"row\">\n    <mat-form-field class=\"col-lg-8 col-md-6 col-sm-12\">\n        <mat-label>{{data.baseData.searchLabel}}</mat-label>\n        <input matInput (keyup)=\"applyFilter($event)\" />\n    </mat-form-field>\n    <div\n        *ngIf=\"data.baseData.multiSelectActions.length\"\n        [class.col-lg-2]=\"data.baseData.allowCreate\"\n        [class.col-lg-4]=\"!data.baseData.allowCreate\"\n        [class.col-md-3]=\"data.baseData.allowCreate\"\n        [class.col-md-6]=\"!data.baseData.allowCreate\"\n        [class.col-sm-6]=\"data.baseData.allowCreate\"\n        [class.col-sm-12]=\"!data.baseData.allowCreate\"\n    >\n        <button class=\"actions-button\" [matMenuTriggerFor]=\"menu\" mat-raised-button>\n            {{data.baseData.multiSelectLabel}}\n        </button>\n    </div>\n    <mat-menu #menu=\"matMenu\">\n        <button *ngFor=\"let action of data.baseData.multiSelectActions\" [disabled]=\"multiActionDisabled(action)\" (click)=\"runMultiAction(action)\" mat-menu-item>\n            {{action.displayName}}\n        </button>\n    </mat-menu>\n\n    <div\n        *ngIf=\"data.baseData.allowCreate\"\n        [class.col-lg-2]=\"data.baseData.multiSelectActions.length\"\n        [class.col-lg-4]=\"!data.baseData.multiSelectActions.length\"\n        [class.col-md-3]=\"data.baseData.multiSelectActions.length\"\n        [class.col-md-6]=\"!data.baseData.multiSelectActions.length\"\n        [class.col-sm-6]=\"data.baseData.multiSelectActions.length\"\n        [class.col-sm-12]=\"!data.baseData.multiSelectActions.length\"\n    >\n        <button class=\"create-button\" (click)=\"createEntity()\" mat-raised-button>\n            {{data.baseData.createButtonLabel}}\n        </button>\n    </div>\n</div>\n\n<div class=\"mat-elevation-z8\">\n    <mat-table *ngIf=\"dataSource\" [dataSource]=\"dataSource\" matSort>\n        <!-- select Column -->\n        <ng-container matColumnDef=\"select\">\n            <mat-header-cell *matHeaderCellDef>\n                <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"> </mat-checkbox>\n            </mat-header-cell>\n            <mat-cell *matCellDef=\"let module\" class=\"module\">\n                <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"> </mat-checkbox>\n            </mat-cell>\n        </ng-container>\n\n        <ng-container *ngFor=\"let dCol of data.baseData.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n            <mat-header-cell *matHeaderCellDef mat-sort-header>\n                {{dCol.displayName}}\n            </mat-header-cell>\n            <mat-cell class=\"entity\" [class.enabled]=\"data.baseData.allowEdit(entity)\" (click)=\"editEntity(entity)\" *matCellDef=\"let entity\">\n                {{dCol.value(entity)}}\n            </mat-cell>\n        </ng-container>\n\n        <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n        <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n    </mat-table>\n\n    <mat-paginator *ngIf=\"dataSource\" id=\"paginator\" [length]=\"dataSource.filteredData.length\" [pageIndex]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 50]\"> </mat-paginator>\n</div>\n", styles: [".title{text-align:center}button{width:100%}.mat-column-select{flex:0 0 75px}.enabled:hover{cursor:pointer}@media (max-width: 767px){.actions-button,.create-button{margin-bottom:15px}}\n"], components: [{ type: i2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i4$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i4$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: i9.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i6.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i9.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i9.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { type: i7$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }], directives: [{ type: i2.MatLabel, selector: "mat-label" }, { type: i13.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i9.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i9.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i9.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i9.MatCellDef, selector: "[matCellDef]" }, { type: i9.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i9.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i9.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }] });
 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\">{{entitiesData.baseData.title}}</h1>\n\n<div class=\"row\">\n    <mat-form-field class=\"col-lg-8 col-md-6 col-sm-12\">\n        <mat-label>{{entitiesData.baseData.searchLabel ? entitiesData.baseData.searchLabel : 'Search'}}</mat-label>\n        <input matInput (keyup)=\"applyFilter($event)\" />\n    </mat-form-field>\n    <div\n        *ngIf=\"entitiesData.baseData.multiSelectActions?.length\"\n        [class.col-lg-2]=\"entitiesData.baseData.allowCreate\"\n        [class.col-lg-4]=\"!entitiesData.baseData.allowCreate\"\n        [class.col-md-3]=\"entitiesData.baseData.allowCreate\"\n        [class.col-md-6]=\"!entitiesData.baseData.allowCreate\"\n        [class.col-sm-6]=\"entitiesData.baseData.allowCreate\"\n        [class.col-sm-12]=\"!entitiesData.baseData.allowCreate\"\n    >\n        <button class=\"actions-button\" [matMenuTriggerFor]=\"menu\" mat-raised-button>\n            {{entitiesData.baseData.multiSelectLabel ? entitiesData.baseData.multiSelectLabel : 'Actions'}}\n        </button>\n    </div>\n    <mat-menu #menu=\"matMenu\">\n        <button *ngFor=\"let action of entitiesData.baseData.multiSelectActions\" [disabled]=\"multiActionDisabled(action)\" (click)=\"runMultiAction(action)\" mat-menu-item>\n            {{action.displayName}}\n        </button>\n    </mat-menu>\n\n    <div\n        *ngIf=\"entitiesData.baseData.allowCreate\"\n        [class.col-lg-2]=\"entitiesData.baseData.multiSelectActions?.length\"\n        [class.col-lg-4]=\"!entitiesData.baseData.multiSelectActions?.length\"\n        [class.col-md-3]=\"entitiesData.baseData.multiSelectActions?.length\"\n        [class.col-md-6]=\"!entitiesData.baseData.multiSelectActions?.length\"\n        [class.col-sm-6]=\"entitiesData.baseData.multiSelectActions?.length\"\n        [class.col-sm-12]=\"!entitiesData.baseData.multiSelectActions?.length\"\n    >\n        <button class=\"create-button\" (click)=\"createEntity()\" mat-raised-button>\n            {{entitiesData.baseData.createButtonLabel ? entitiesData.baseData.createButtonLabel : 'Create'}}\n        </button>\n    </div>\n</div>\n\n<div class=\"mat-elevation-z8\">\n    <mat-table *ngIf=\"dataSource\" [dataSource]=\"dataSource\" matSort>\n        <!-- select Column -->\n        <ng-container matColumnDef=\"select\">\n            <mat-header-cell *matHeaderCellDef>\n                <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"> </mat-checkbox>\n            </mat-header-cell>\n            <mat-cell *matCellDef=\"let module\" class=\"module\">\n                <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"> </mat-checkbox>\n            </mat-cell>\n        </ng-container>\n\n        <ng-container *ngFor=\"let dCol of entitiesData.baseData.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n            <mat-header-cell *matHeaderCellDef mat-sort-header>\n                {{dCol.displayName}}\n            </mat-header-cell>\n            <mat-cell class=\"entity\" [class.enabled]=\"entitiesData.baseData.allowEdit?.(entity)\" (click)=\"editEntity(entity)\" *matCellDef=\"let entity\">\n                {{dCol.value(entity)}}\n            </mat-cell>\n        </ng-container>\n\n        <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n        <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n    </mat-table>\n\n    <mat-paginator *ngIf=\"dataSource\" id=\"paginator\" [length]=\"dataSource.filteredData.length\" [pageIndex]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 50]\"> </mat-paginator>\n</div>\n", styles: [".title{text-align:center}button{width:100%}.mat-column-select{flex:0 0 75px}.enabled:hover{cursor:pointer}@media (max-width: 767px){.actions-button{margin-bottom:15px}}@media (max-width: 575px){.create-button{margin-bottom:15px}}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.MatDialog }, { type: i0.Injector }]; }, propDecorators: { entitiesData: [{
+            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: [{
                 type: ViewChild,
@@ -1407,354 +2145,342 @@ 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]
+                    exports: [NgxMatEntityCreateDialogComponent]
                 }]
         }] });
 
-class NgxMatEntityInternalInputModule {
+class NgxMatEntityEditDialogModule {
 }
-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,
+NgxMatEntityEditDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NgxMatEntityEditDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, declarations: [NgxMatEntityEditDialogComponent], imports: [CommonModule,
+        NgxMatEntityInputModule,
+        MatDialogModule,
         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: [[
+        MatButtonModule,
+        NgxMatEntityConfirmDialogModule], exports: [NgxMatEntityEditDialogComponent] });
+NgxMatEntityEditDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, imports: [[
             CommonModule,
-            MatInputModule,
+            NgxMatEntityInputModule,
+            MatDialogModule,
             FormsModule,
-            MatFormFieldModule,
-            MatSelectModule,
-            MatAutocompleteModule,
-            MatCheckboxModule,
-            MatSlideToggleModule,
-            MatTableModule
+            MatButtonModule,
+            NgxMatEntityConfirmDialogModule
         ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [NgxMatEntityInternalInputComponent],
+                    declarations: [NgxMatEntityEditDialogComponent],
                     imports: [
                         CommonModule,
-                        MatInputModule,
+                        NgxMatEntityInputModule,
+                        MatDialogModule,
                         FormsModule,
-                        MatFormFieldModule,
-                        MatSelectModule,
-                        MatAutocompleteModule,
-                        MatCheckboxModule,
-                        MatSlideToggleModule,
-                        MatTableModule
+                        MatButtonModule,
+                        NgxMatEntityConfirmDialogModule
                     ],
-                    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]
+                    exports: [NgxMatEntityEditDialogComponent]
                 }]
         }] });
 
-class NgxMatEntityArrayTableModule {
+class NgxMatEntityTableModule {
 }
-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,
+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,
-        MatSelectModule,
-        MatAutocompleteModule,
         MatCheckboxModule,
-        MatSlideToggleModule,
         MatTableModule,
-        NgxMatEntityInternalInputModule,
+        MatPaginatorModule,
         MatButtonModule,
-        NgxMatEntityAddArrayItemDialogModule], exports: [NgxMatEntityArrayTableComponent] });
-NgxMatEntityArrayTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableModule, imports: [[
+        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,
-            MatSelectModule,
-            MatAutocompleteModule,
             MatCheckboxModule,
-            MatSlideToggleModule,
             MatTableModule,
-            NgxMatEntityInternalInputModule,
+            MatPaginatorModule,
             MatButtonModule,
-            NgxMatEntityAddArrayItemDialogModule
+            MatMenuModule,
+            MatDialogModule,
+            NgxMatEntityCreateDialogModule,
+            NgxMatEntityEditDialogModule,
         ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [NgxMatEntityArrayTableComponent],
+                    declarations: [NgxMatEntityTableComponent],
                     imports: [
                         CommonModule,
                         MatInputModule,
                         FormsModule,
                         MatFormFieldModule,
-                        MatSelectModule,
-                        MatAutocompleteModule,
                         MatCheckboxModule,
-                        MatSlideToggleModule,
                         MatTableModule,
-                        NgxMatEntityInternalInputModule,
+                        MatPaginatorModule,
                         MatButtonModule,
-                        NgxMatEntityAddArrayItemDialogModule
+                        MatMenuModule,
+                        MatDialogModule,
+                        NgxMatEntityCreateDialogModule,
+                        NgxMatEntityEditDialogModule,
                     ],
-                    exports: [NgxMatEntityArrayTableComponent]
+                    exports: [NgxMatEntityTableComponent]
                 }]
         }] });
 
-class NgxMatEntityInputModule {
+/**
+ * The internal EntityArrayDecoratorConfig. Sets default values.
+ */
+class EntityArrayDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
+    constructor(data) {
+        super(data);
+        this.createInline = data.createInline != undefined ? data.createInline : true;
+        this.displayStyle = data.displayStyle;
+        this.itemType = data.itemType;
+        this.EntityClass = data.EntityClass;
+        this.displayColumns = data.displayColumns;
+        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.deleteIcon = data.deleteIcon ? data.deleteIcon : 'fas fa-circle-minus';
+        this.displayStyle = data.displayStyle;
+        this.itemType = data.itemType;
+        this.maxLength = data.maxLength;
+        this.minLength = data.minLength;
+        this.regex = data.regex;
+        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.deleteIcon = data.deleteIcon ? data.deleteIcon : 'fas fa-circle-minus';
+        this.displayStyle = data.displayStyle;
+        this.itemType = data.itemType;
+        this.maxLength = data.maxLength;
+        this.minLength = data.minLength;
+        this.regex = data.regex;
+        this.defaultWidths = data.defaultWidths ? data.defaultWidths : [6, 12, 12];
+    }
 }
-NgxMatEntityInputModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NgxMatEntityInputModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, declarations: [NgxMatEntityInputComponent], imports: [CommonModule,
-        MatInputModule,
-        FormsModule,
-        MatFormFieldModule,
-        MatSelectModule,
-        MatAutocompleteModule,
-        MatCheckboxModule,
-        MatSlideToggleModule,
-        NgxMatEntityArrayTableModule,
-        MatChipsModule,
-        MatIconModule], exports: [NgxMatEntityInputComponent] });
-NgxMatEntityInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, imports: [[
-            CommonModule,
-            MatInputModule,
-            FormsModule,
-            MatFormFieldModule,
-            MatSelectModule,
-            MatAutocompleteModule,
-            MatCheckboxModule,
-            MatSlideToggleModule,
-            NgxMatEntityArrayTableModule,
-            MatChipsModule,
-            MatIconModule
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NgxMatEntityInputComponent],
-                    imports: [
-                        CommonModule,
-                        MatInputModule,
-                        FormsModule,
-                        MatFormFieldModule,
-                        MatSelectModule,
-                        MatAutocompleteModule,
-                        MatCheckboxModule,
-                        MatSlideToggleModule,
-                        NgxMatEntityArrayTableModule,
-                        MatChipsModule,
-                        MatIconModule
-                    ],
-                    exports: [NgxMatEntityInputComponent]
-                }]
-        }] });
 
-class NgxMatEntityCreateDialogModule {
+/**
+ * Decorator for setting and getting array property metadata.
+ *
+ * @param metadata - The metadata of the array property.
+ * @returns The method that defines the metadata.
+ * @throws When the given type of the array-items is unknown.
+ */
+function array(metadata) {
+    switch (metadata.itemType) {
+        case DecoratorTypes.OBJECT:
+            return baseProperty(new EntityArrayDecoratorConfigInternal(metadata), DecoratorTypes.ARRAY);
+        case DecoratorTypes.STRING:
+            return baseProperty(new StringChipsArrayDecoratorConfigInternal(metadata), DecoratorTypes.ARRAY_STRING_CHIPS);
+        case DecoratorTypes.STRING_AUTOCOMPLETE:
+            return baseProperty(new AutocompleteStringChipsArrayDecoratorConfigInternal(metadata), DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS);
+        default:
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access
+            throw new Error(`Unknown itemType ${metadata.itemType}`);
+    }
 }
-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]
-                }]
-        }] });
 
-class NgxMatEntityEditDialogModule {
+/**
+ * The base options for all propertyDecorators.
+ */
+class PropertyDecoratorConfig {
 }
-NgxMatEntityEditDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NgxMatEntityEditDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, declarations: [NgxMatEntityEditDialogComponent], imports: [CommonModule,
-        NgxMatEntityInputModule,
-        MatDialogModule,
-        FormsModule,
-        MatButtonModule,
-        NgxMatEntityConfirmDialogModule], exports: [NgxMatEntityEditDialogComponent] });
-NgxMatEntityEditDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, imports: [[
-            CommonModule,
-            NgxMatEntityInputModule,
-            MatDialogModule,
-            FormsModule,
-            MatButtonModule,
-            NgxMatEntityConfirmDialogModule
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NgxMatEntityEditDialogComponent],
-                    imports: [
-                        CommonModule,
-                        NgxMatEntityInputModule,
-                        MatDialogModule,
-                        FormsModule,
-                        MatButtonModule,
-                        NgxMatEntityConfirmDialogModule
-                    ],
-                    exports: [NgxMatEntityEditDialogComponent]
-                }]
-        }] });
 
 /**
- * Decorator for setting and getting string propery metadata
- * @param metadata The metadata of the string property
+ * Interface definition for the @array metadata.
+ */
+class ArrayDecoratorConfig extends PropertyDecoratorConfig {
+}
+
+/**
+ * The internal DropdownBooleanDecoratorConfig. Sets default values.
+ */
+class DropdownBooleanDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
+    constructor(data) {
+        super(data);
+        this.displayStyle = data.displayStyle;
+        this.dropdownTrue = data.dropdownTrue;
+        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 property metadata.
+ *
+ * @param metadata - The metadata of the boolean property.
+ * @returns The method that defines the metadata.
  */
 function boolean(metadata) {
     if (metadata.displayStyle === 'dropdown') {
-        return baseProperty(new DropdownBooleanDecoratorConfig(metadata), DecoratorTypes.BOOLEAN_DROPDOWN);
+        return baseProperty(new DropdownBooleanDecoratorConfigInternal(metadata), DecoratorTypes.BOOLEAN_DROPDOWN);
     }
     else if (metadata.displayStyle === 'checkbox') {
-        return baseProperty(new CheckboxBooleanDecoratorConfig(metadata), DecoratorTypes.BOOLEAN_CHECKBOX);
+        return baseProperty(new CheckboxBooleanDecoratorConfigInternal(metadata), DecoratorTypes.BOOLEAN_CHECKBOX);
     }
     else {
-        return baseProperty(new ToggleBooleanDecoratorConfig(metadata), DecoratorTypes.BOOLEAN_TOGGLE);
+        return baseProperty(new ToggleBooleanDecoratorConfigInternal(metadata), DecoratorTypes.BOOLEAN_TOGGLE);
     }
 }
+
 /**
- * The Definition for the @boolean metadata
+ * The Definition for the @boolean metadata.
  */
 class BooleanDecoratorConfig extends PropertyDecoratorConfig {
 }
-class DropdownBooleanDecoratorConfig extends BooleanDecoratorConfig {
-    constructor(metadata) {
-        super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
-        this.displayStyle = metadata.displayStyle;
-        this.dropdownTrue = metadata.dropdownTrue;
-        this.dropdownFalse = metadata.dropdownFalse;
-    }
-}
-class CheckboxBooleanDecoratorConfig extends BooleanDecoratorConfig {
-    constructor(metadata) {
-        super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
-        this.displayStyle = metadata.displayStyle;
+
+/**
+ * The internal DefaultNumberDecoratorConfig. Sets default values.
+ */
+class DefaultNumberDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
+    constructor(data) {
+        super(data);
+        this.displayStyle = data.displayStyle;
+        this.max = data.max;
+        this.min = data.min;
     }
 }
-class ToggleBooleanDecoratorConfig extends BooleanDecoratorConfig {
-    constructor(metadata) {
-        super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
-        this.displayStyle = metadata.displayStyle;
+/**
+ * The internal DropdownNumberDecoratorConfig. Sets default values.
+ */
+class DropdownNumberDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
+    constructor(data) {
+        super(data);
+        this.displayStyle = data.displayStyle;
+        this.dropdownValues = data.dropdownValues;
     }
 }
 
 /**
- * Decorator for setting and getting string propery metadata
- * @param metadata The metadata of the string property
+ * Decorator for setting and getting number property metadata.
+ *
+ * @param metadata - The metadata of the number property.
+ * @returns The method that defines the metadata.
  */
 function number(metadata) {
     if (metadata.displayStyle === 'dropdown') {
-        return baseProperty(new DropdownNumberDecoratorConfig(metadata), DecoratorTypes.NUMBER_DROPDOWN);
+        return baseProperty(new DropdownNumberDecoratorConfigInternal(metadata), DecoratorTypes.NUMBER_DROPDOWN);
     }
     else {
-        return baseProperty(new DefaultNumberDecoratorConfig(metadata), DecoratorTypes.NUMBER);
+        return baseProperty(new DefaultNumberDecoratorConfigInternal(metadata), DecoratorTypes.NUMBER);
     }
 }
+
 /**
- * Interface definition for the @number metadata
+ * Definition for the @number metadata.
  */
 class NumberDecoratorConfig extends PropertyDecoratorConfig {
 }
-class DefaultNumberDecoratorConfig extends NumberDecoratorConfig {
-    constructor(metadata) {
-        super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
-        this.displayStyle = metadata.displayStyle;
-        this.min = metadata.min;
-        this.max = metadata.max;
-    }
-}
-class DropdownNumberDecoratorConfig extends NumberDecoratorConfig {
-    constructor(metadata) {
-        super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
-        this.displayStyle = metadata.displayStyle;
-        this.dropdownValues = metadata.dropdownValues;
+
+/**
+ * The internal DefaultObjectDecoratorConfig. Sets default values.
+ */
+class DefaultObjectDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
+    constructor(data) {
+        super(data);
+        this.displayStyle = data.displayStyle;
+        this.EntityClass = data.EntityClass;
     }
 }
 
 /**
- * Decorator for setting and getting object propery metadata.
- * @param metadata The metadata of the object property
+ * Decorator for setting and getting object property metadata.
+ *
+ * @param metadata - The metadata of the object property.
+ * @returns The method that defines the metadata.
  */
 function object(metadata) {
-    return baseProperty(new DefaultObjectDecoratorConfig(metadata), DecoratorTypes.OBJECT);
+    return baseProperty(new DefaultObjectDecoratorConfigInternal(metadata), DecoratorTypes.OBJECT);
 }
+
 /**
- * Interface definition for the @object metadata
+ * Definition for the @object metadata.
  */
 class ObjectDecoratorConfig extends PropertyDecoratorConfig {
 }
-class DefaultObjectDecoratorConfig extends ObjectDecoratorConfig {
-    constructor(metadata) {
-        super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
-        this.displayStyle = metadata.displayStyle;
-        this.type = metadata.type;
-    }
+
+/**
+ * Definition for the @string metadata.
+ */
+class StringDecoratorConfig extends PropertyDecoratorConfig {
 }
 
-/*
- * Public API Surface of ngx-material-entity
+/**
+ * Public API Surface of ngx-material-entity.
  */
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { AutocompleteStringChipsArrayDecoratorConfig, AutocompleteStringDecoratorConfig, CheckboxBooleanDecoratorConfig, DecoratorTypes, DefaultNumberDecoratorConfig, DefaultObjectDecoratorConfig, DefaultStringDecoratorConfig, DropdownBooleanDecoratorConfig, DropdownNumberDecoratorConfig, DropdownStringDecoratorConfig, Entity, EntityArrayDecoratorConfig, EntityService, EntityUtilities, NgxMatEntityConfirmDialogComponent, NgxMatEntityConfirmDialogModule, NgxMatEntityCreateDialogComponent, NgxMatEntityCreateDialogModule, NgxMatEntityEditDialogComponent, NgxMatEntityEditDialogModule, NgxMatEntityInputComponent, NgxMatEntityInputModule, NgxMatEntityTableComponent, NgxMatEntityTableModule, StringChipsArrayDecoratorConfig, TextboxStringDecoratorConfig, ToggleBooleanDecoratorConfig, array, boolean, getValidationErrorMessage, number, object, string };
+export { DateUtilities, DecoratorTypes, Entity, EntityService, EntityUtilities, NgxMatEntityConfirmDialogComponent, NgxMatEntityConfirmDialogModule, NgxMatEntityCreateDialogComponent, NgxMatEntityCreateDialogModule, NgxMatEntityEditDialogComponent, NgxMatEntityEditDialogModule, NgxMatEntityInputComponent, NgxMatEntityInputModule, NgxMatEntityTableComponent, NgxMatEntityTableModule, array, boolean, getValidationErrorMessage, number, object, string };
 //# sourceMappingURL=ngx-material-entity.mjs.map