ngx-material-entity 18.2.0 → 18.2.2

package/fesm2022/ngx-material-entity.mjs

@@ -6116,7 +6116,7 @@ class NgxMatEntityInputComponent {
      */
     referencesOneName;
     /**
-     * The form context for an object property.
+     * The form context for an references one property.
      */
     referencesOneFormContext;
     /**
@@ -6476,7 +6476,11 @@ class NgxMatEntityInputComponent {
     setReferencesOneObject() {
         const foundEntity = this.metadataReferencesOne.getEntityForId(this.entity[this.propertyKey], this.referencesOneAllReferencedEntities);
         const referencesOneObject = new this.metadataReferencesOne.EntityClass(foundEntity);
-        const referencesOnePropertyTabs = EntityUtilities.getEntityTabs(referencesOneObject, this.injector);
+        const referencesOnePropertyTabs = EntityUtilities.getEntityTabs(referencesOneObject, this.injector, undefined, undefined, this.metadataReferencesOne.omit);
+        if (this.metadataReferencesOne.dropdownOnly) {
+            this.emitChange();
+            return;
+        }
         this.referencesOneFormContext = {
             $implicit: {
                 entity: referencesOneObject,
@@ -6976,7 +6980,7 @@ class NgxMatEntityInputComponent {
         this.emitChange();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgxMatEntityInputComponent, deps: [{ token: i1.MatDialog }, { token: i0.EnvironmentInjector }, { token: i2$6.Router }, { token: NGX_GET_VALIDATION_ERROR_MESSAGE }, { token: NGX_COMPLETE_GLOBAL_DEFAULT_VALUES }, { token: i2$1.HttpClient }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.7", type: NgxMatEntityInputComponent, isStandalone: true, selector: "ngx-mat-entity-input", inputs: { entity: "entity", propertyKey: "propertyKey", getValidationErrorMessage: "getValidationErrorMessage", hideOmitForCreate: "hideOmitForCreate", hideOmitForEdit: "hideOmitForEdit", validEmpty: "validEmpty", isReadOnly: "isReadOnly" }, outputs: { inputChangeEvent: "inputChangeEvent" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "addArrayItemDialog", first: true, predicate: ["addArrayItemDialog"], descendants: true }, { propertyName: "editArrayItemDialog", first: true, predicate: ["editArrayItemDialog"], descendants: true }, { propertyName: "createHasManyDialog", first: true, predicate: ["createHasManyDialog"], descendants: true }, { propertyName: "editHasManyDialog", first: true, predicate: ["editHasManyDialog"], descendants: true }], ngImport: i0, template: "<!-- eslint-disable angular/no-call-expression -->\n \n@if(!(hideOmitForCreate && metadata.omitForCreate) && !(hideOmitForEdit && metadata.omitForUpdate)) {\n    @switch (type) {\n        <!-------------------------------------------->\n        <!-----------------Strings-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.STRING) {\n            <string-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-input>\n        }\n        @case (DecoratorTypes.STRING_TEXTBOX) {\n            <string-textbox-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-textbox-input>\n        }\n        @case (DecoratorTypes.STRING_AUTOCOMPLETE) {\n            <string-autocomplete-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-autocomplete-input>\n        }\n        @case (DecoratorTypes.STRING_DROPDOWN) {\n            <string-dropdown-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-dropdown-input>\n        }\n        @case (DecoratorTypes.STRING_PASSWORD) {\n            <string-password-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-password-input>\n        }\n        <!-------------------------------------------->\n        <!-----------------Booleans------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.BOOLEAN_CHECKBOX) {\n            <boolean-checkbox-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </boolean-checkbox-input>\n        }\n        @case (DecoratorTypes.BOOLEAN_TOGGLE) {\n            <boolean-toggle-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </boolean-toggle-input>\n        }\n        @case (DecoratorTypes.BOOLEAN_DROPDOWN) {\n            <boolean-dropdown-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </boolean-dropdown-input>\n        }\n        <!-------------------------------------------->\n        <!------------------Numbers------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.NUMBER) {\n            <number-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </number-input>\n        }\n        @case (DecoratorTypes.NUMBER_DROPDOWN) {\n            <number-dropdown-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </number-dropdown-input>\n        }\n        @case (DecoratorTypes.NUMBER_SLIDER) {\n            <number-slider-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </number-slider-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Array-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.ARRAY_DATE) {\n            <array-date-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-date-input>\n        }\n        @case (DecoratorTypes.ARRAY_DATE_TIME) {\n            <array-date-time-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-date-time-input>\n        }\n        @case (DecoratorTypes.ARRAY_DATE_RANGE) {\n            <array-date-range-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-date-range-input>\n        }\n        @case (DecoratorTypes.ARRAY_STRING_CHIPS) {\n            <array-string-chips-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-string-chips-input>\n        }\n        @case (DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS) {\n            <array-string-autocomplete-chips\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-string-autocomplete-chips>\n        }\n        <!-------------------------------------------->\n        <!-------------------Dates-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.DATE) {\n            <date-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </date-input>\n        }\n        @case (DecoratorTypes.DATE_RANGE) {\n            <date-range-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </date-range-input>\n        }\n        @case (DecoratorTypes.DATE_TIME) {\n            <date-time-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </date-time-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Files-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.FILE_DEFAULT) {\n            <file-default-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </file-default-input>\n        }\n        @case (DecoratorTypes.FILE_IMAGE) {\n            <file-image-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </file-image-input>\n        }\n        <!-------------------------------------------->\n        <!-------------- references many ------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.REFERENCES_MANY) {\n            <references-many-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </references-many-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Custom------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.CUSTOM) {\n            <custom-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </custom-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Object------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.OBJECT) {\n            <b>{{metadataDefaultObject.displayName}}</b>\n            <!-- iterates over the object properties -->\n            <ng-container *ngTemplateOutlet=\"form; context: objectFormContext\"></ng-container>\n        }\n        <!-------------------------------------------->\n        <!---------------Object Dropdown-------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.OBJECT_DROPDOWN) {\n            <mat-form-field class=\"object-dropdown\">\n                <mat-label>{{metadata.displayName}}</mat-label>\n                <mat-select #model=\"ngModel\"\n                    [name]=\"objectDropdownName\"\n                    [required]=\"metadata.required(entity)\"\n                    [disabled]=\"internalIsReadOnly\"\n                    [compareWith]=\"compareObjectsBound\"\n                    [(ngModel)]=\"entity[propertyKey]\"\n                    (selectionChange)=\"emitChange()\"\n                    (opened)=\"selectSearchInput.focus()\"\n                >\n                    <mat-form-field class=\"select-search-input\">\n                        <!-- eslint-disable-next-line angular/no-any -->\n                        <input #selectSearchInput matInput (keyup)=\"filterObjectDropdownValues($any($event.target).value)\">\n                        <fa-icon matSuffix [icon]=\"faSearch\"></fa-icon>\n                    </mat-form-field>\n                    @if (!metadata.required(entity)) {\n                        <mat-option>-</mat-option>\n                    }\n                    @if (shouldDisplayCurrentObjectDropdownValue) {\n                        <mat-option [value]=\"currentObjectDropdownValue?.value\">{{currentObjectDropdownValue?.displayName}}</mat-option>\n                    }\n                    @for (value of filteredObjectDropdownValues; track $index) {\n                        <mat-option [value]=\"value.value\">{{value.displayName}}</mat-option>\n                    }\n                </mat-select>\n                <mat-error>{{internalGetValidationErrorMessage(model)}}</mat-error>\n            </mat-form-field>\n        }\n        <!-------------------------------------------->\n        <!-------------- references one -------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.REFERENCES_ONE) {\n            <mat-form-field>\n                <mat-label>{{metadata.displayName}}</mat-label>\n                <mat-select #inputModel=\"ngModel\"\n                    [name]=\"referencesOneName\"\n                    [disabled]=\"internalIsReadOnly\"\n                    [required]=\"metadata.required(entity)\"\n                    [(ngModel)]=\"entity[propertyKey]\"\n                    (selectionChange)=\"setReferencesOneObject()\"\n                    (opened)=\"selectSearchInput.focus()\"\n                >\n                    <mat-form-field class=\"select-search-input\">\n                        <!-- eslint-disable-next-line angular/no-any -->\n                        <input #selectSearchInput matInput (keyup)=\"filterReferencesOneValues($any($event.target).value)\">\n                        <fa-icon matSuffix [icon]=\"faSearch\"></fa-icon>\n                    </mat-form-field>\n                    @if (!metadata.required(entity)) {\n                        <mat-option>-</mat-option>\n                    }\n                    @if (shouldDisplayCurrentReferencesOneDropdownValue) {\n                        <mat-option [value]=\"currentReferencesOneDropdownValue?.value\">{{currentReferencesOneDropdownValue?.displayName}}</mat-option>\n                    }\n                    @for (value of filteredReferencesOneDropdownValues; track $index) {\n                        <mat-option [value]=\"value.value\">{{value.displayName}}</mat-option>\n                    }\n                </mat-select>\n                <mat-error>{{internalGetValidationErrorMessage(inputModel)}}</mat-error>\n            </mat-form-field>\n            <!-- iterates over the references one properties -->\n            @if (referencesOneFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: referencesOneFormContext\"></ng-container>\n            }\n        }\n        <!-------------------------------------------->\n        <!-------------------Array-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.ARRAY) {\n            <div class=\"entityArray\">\n                <div class=\"mat-elevation-z8 elevation-container\">\n                    <div class=\"array-headline\">\n                        <b>{{metadataEntityArray.displayName}}</b>\n                    </div>\n                    @if (metadataEntityArray.createInline && !internalIsReadOnly && addArrayItemFormContext) {\n                        <ng-container *ngTemplateOutlet=\"form; context: addArrayItemFormContext\"></ng-container>\n                    }\n                    @if (!internalIsReadOnly && entityArrayTableContext) {\n                        <div class=\"buttons\">\n                            <button type=\"button\" mat-raised-button\n                                [disabled]=\"metadataEntityArray.createInline && !isArrayItemValid\"\n                                (click)=\"addEntity()\">\n                                {{metadataEntityArray.addButtonLabel}}\n                            </button>\n                            <button type=\"button\" mat-raised-button\n                                [disabled]=\"!entityArrayTableContext.$implicit.selection.selected.length\"\n                                (click)=\"removeFromEntityArray()\">\n                                {{metadataEntityArray.removeButtonLabel}}\n                            </button>\n                        </div>\n                    }\n                    @if (entityArrayTableContext) {\n                        <ng-container *ngTemplateOutlet=\"table; context: entityArrayTableContext\"></ng-container>\n                    }\n                </div>\n            </div>\n        }\n        <!-------------------------------------------->\n        <!------------------ has many ---------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.HAS_MANY) {\n            <div class=\"hasMany\">\n                <h2 class=\"title\">{{metadataHasMany.tableData.baseData.title}}</h2>\n                <div class=\"grid grid-cols-12\" style=\"column-gap: 24px;\">\n                    <mat-form-field class=\"lg:col-span-8 md:col-span-6 col-span-12\">\n                        <mat-label>{{metadataHasMany.tableData.baseData.searchLabel}}</mat-label>\n                        <input matInput (keyup)=\"applyHasManyFilter($event)\">\n                    </mat-form-field>\n                    @if (metadataHasMany.tableData.baseData.tableActions.length) {\n                        <div\n                            [class.lg:col-span-2]=\"hasManyAllowCreate\"\n                            [class.lg:col-span-4]=\"!hasManyAllowCreate\"\n                            [class.md:col-span-3]=\"hasManyAllowCreate\"\n                            [class.md:col-span-6]=\"!hasManyAllowCreate\"\n                            [class.col-span-6]=\"hasManyAllowCreate\"\n                            [class.col-span-12]=\"!hasManyAllowCreate\"\n                        >\n                            <button type=\"button\" class=\"actions-button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                                {{metadataHasMany.tableData.baseData.tableActionsLabel}}\n                            </button>\n                        </div>\n                    }\n                    <mat-menu #menu=\"matMenu\">\n                        @if (metadataHasMany.tableData.baseData.allowJsonImport) {\n                            <button type=\"button\" mat-menu-item [disabled]=\"hasManyTableActionDisabled(hasManyImportAction)\" (click)=\"runHasManyTableAction(hasManyImportAction)\">\n                                {{hasManyImportAction.displayName}}\n                            </button>\n                        }\n                        @for (action of metadataHasMany.tableData.baseData.tableActions; track $index) {\n                            <button type=\"button\" mat-menu-item [disabled]=\"hasManyTableActionDisabled(action)\" (click)=\"runHasManyTableAction(action)\">\n                                {{action.displayName}}\n                            </button>\n                        }\n                    </mat-menu>\n                    @if (hasManyAllowCreate) {\n                        <div\n                            [class.lg:col-span-2]=\"metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.lg:col-span-4]=\"!metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.md:col-span-3]=\"metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.md:col-span-6]=\"!metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.col-span-6]=\"metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.col-span-12]=\"!metadataHasMany.tableData.baseData.tableActions.length\"\n                        >\n                            <button type=\"button\" class=\"create-button\" mat-raised-button (click)=\"createHasManyEntity()\">\n                                {{metadataHasMany.tableData.baseData.createButtonLabel}}\n                            </button>\n                        </div>\n                    }\n                </div>\n        \n                <div class=\"mat-elevation-z8 elevation-container\">\n                    @if (hasManyTableContext) {\n                        <ng-container *ngTemplateOutlet=\"table; context: hasManyTableContext\"></ng-container>\n                    }\n                </div>\n            </div>\n        }\n        \n        @default {\n            <div>ERROR: The type {{type}} is not known.</div>\n        }\n    }\n}\n\n\n<ng-template #table let-context>\n    <mat-table matSort [dataSource]=\"context.dataSource\" [class.table-with-error-slot]=\"context.shouldShowMissingError\">\n        <!-- select Column -->\n        <ng-container matColumnDef=\"select\">\n            <mat-header-cell *matHeaderCellDef>\n                <mat-checkbox [checked]=\"context.selection.hasValue() && SelectionUtilities.isAllSelected(context.selection, context.dataSource)\"\n                    [indeterminate]=\"context.selection.hasValue() && !SelectionUtilities.isAllSelected(context.selection, context.dataSource)\"\n                    (change)=\"$event ? SelectionUtilities.masterToggle(context.selection, context.dataSource) : null\">\n                </mat-checkbox>\n            </mat-header-cell>\n            <mat-cell *matCellDef=\"let value\" [dynamicStyleClasses]=\"context.dynamicRowStyleClasses\" [value]=\"value\">\n                <mat-checkbox [checked]=\"context.selection.isSelected(value)\"\n                    (click)=\"$event.stopPropagation()\"\n                    (change)=\"$event ? context.selection.toggle(value) : null\">\n                </mat-checkbox>\n            </mat-cell>\n        </ng-container>\n\n        @for (dCol of context.displayColumns; track $index) {\n            <ng-container [matColumnDef]=\"dCol.displayName\">\n                <mat-header-cell *matHeaderCellDef mat-sort-header>\n                    {{dCol.displayName}}\n                </mat-header-cell>\n                <mat-cell *matCellDef=\"let value\" [class.enabled]=\"!dCol.disableClick && context.allowClick(value)\"\n                    [dynamicStyleClasses]=\"context.dynamicRowStyleClasses\" [value]=\"value\"\n                    (click)=\"clickCell(value, dCol, context)\"\n                >\n                    @if (dCol.Component) {\n                        <display-column-value [entity]=\"value\" [ComponentClass]=\"dCol.Component\"></display-column-value>\n                    }\n                    @else {\n                        {{getDisplayColumnValue(value, dCol)}}\n                    }\n                </mat-cell>\n            </ng-container>\n        }\n\n        <mat-header-row *matHeaderRowDef=\"context.displayedColumns\"></mat-header-row>\n        <mat-row *matRowDef=\"let row; columns: context.displayedColumns\"></mat-row>\n    </mat-table>\n\n    @if (context.displayLoadingSpinner && context.isLoading) {\n        <mat-spinner>\n        </mat-spinner>\n    }\n    @else if (context.shouldShowMissingError && !context.dataSource.data.length) {\n        <div class=\"table-error\">{{context.emptyErrorMessage}}</div>\n    }\n\n    <mat-paginator [length]=\"context.dataSource.filteredData.length\" [pageIndex]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 50]\"></mat-paginator>\n</ng-template>\n\n<!--------------------------------------------------------->\n<!---------------------------Form-------------------------->\n<!--------------------------------------------------------->\n<ng-template #form let-context>\n     <!-- eslint-disable angular/no-call-expression -->\n    @if (context.tabs.length > 1) {\n        <mat-tab-group preserveContent>\n            @for (tab of context.tabs; track $index) {\n                <mat-tab [label]=\"tab.tabName\">\n                    @for (row of tab.rows; track $index) {\n                        <div class=\"grid grid-cols-12\" style=\"column-gap: 24px;\">\n                            @for (key of row.keys; track key) {\n                                <ngx-mat-entity-input\n                                    [entity]=\"context.entity\"\n                                    [propertyKey]=\"key\"\n                                    [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                                    [validEmpty]=\"context.validEmpty?.()\"\n                                    [isReadOnly]=\"context.isReadOnly?.(context.entity, key)\"\n                                    [class]=\"EntityUtilities.getWidthClasses(context.entity, key)\"\n                                    [hideOmitForEdit]=\"context.hideOmitForEdit\"\n                                    [hideOmitForCreate]=\"context.hideOmitForCreate\"\n                                    (inputChangeEvent)=\"context.inputChangeEvent()\"\n                                >\n                                </ngx-mat-entity-input>\n                            }\n                        </div>\n                    }\n                </mat-tab>\n            }\n        </mat-tab-group>\n    }\n    @else {\n        @if (!context.tabs.length) {\n            <span class=\"no-entity-tabs\">\n                ERROR: No Inputs. Did you correctly assign all values in the model constructor?\n            </span>\n        }\n        @else {\n            @for (row of context.tabs[0].rows; track $index) {\n                <div class=\"grid grid-cols-12\" style=\"column-gap: 24px;\">\n                    @for (key of row.keys; track key) {\n                        <ngx-mat-entity-input\n                            [entity]=\"context.entity\"\n                            [propertyKey]=\"key\"\n                            [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                            [validEmpty]=\"context.validEmpty?.()\"\n                            [isReadOnly]=\"context.isReadOnly?.(context.entity, key)\"\n                            [class]=\"EntityUtilities.getWidthClasses(context.entity, key)\"\n                            [hideOmitForEdit]=\"context.hideOmitForEdit\"\n                            [hideOmitForCreate]=\"context.hideOmitForCreate\"\n                            (inputChangeEvent)=\"context.inputChangeEvent()\"\n                        >\n                        </ngx-mat-entity-input>\n                    }\n                </div>\n            }\n        }\n    }\n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Add Array Item Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #addArrayItemDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{addArrayItemDialogData.title}}</div>\n    </div>\n\n    <form>\n        <mat-dialog-content>\n            @if (addArrayItemFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: addArrayItemFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n    \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [disabled]=\"!isArrayItemValid\"\n                    [matBadge]=\"arrayItemValidationErrors.length\"\n                    [matBadgeHidden]=\"!arrayItemValidationErrors.length\"\n                    (click)=\"addArrayItem()\"\n                >\n                    {{addArrayItemDialogData.createButtonLabel}}\n                </button>\n                @if (arrayItemValidationErrors.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"arrayItemTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"closeAddArrayItemDialog()\">\n                {{addArrayItemDialogData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n\n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Edit Array Item Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #editArrayItemDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{editArrayItemDialogData.title(arrayItemPriorChanges)}}</div>\n    </div>\n    \n    <form>\n        <mat-dialog-content>\n            @if (editArrayItemFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: editArrayItemFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n        \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [class.badge-changes]=\"!arrayItemValidationErrors.length\"\n                    [disabled]=\"internalIsReadOnly || !isArrayItemValid || !isArrayItemDirty\"\n                    [matBadge]=\"arrayItemValidationErrors.length > 0 ? arrayItemValidationErrors.length : arrayItemChanges.length\"\n                    [matBadgeHidden]=\"!arrayItemValidationErrors.length && !arrayItemChanges.length\"\n                    (click)=\"saveArrayItem()\"\n                >\n                    {{editArrayItemDialogData.confirmButtonLabel}}\n                </button>\n                @if (arrayItemValidationErrors.length || arrayItemChanges.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"arrayItemTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"closeEditArrayItemDialog()\">\n                {{editArrayItemDialogData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Create Has Many Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #createHasManyDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{metadataHasMany.tableData.createData.title}}</div>\n    </div>\n    \n    <form>\n        <mat-dialog-content>\n            @if (hasManyCreateFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: hasManyCreateFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n        \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [disabled]=\"!isHasManyEntityValid\"\n                    [matBadge]=\"hasManyValidationErrors.length\"\n                    [matBadgeHidden]=\"!hasManyValidationErrors.length\"\n                    (click)=\"dialogCreateHasMany()\"\n                >\n                    {{metadataHasMany.tableData.createData.createButtonLabel}}\n                </button>\n                @if (hasManyValidationErrors.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"hasManyTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"dialogCancelCreateHasMany()\">\n                {{metadataHasMany.tableData.createData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n    \n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Edit Has Many Dialog----------------->\n<!--------------------------------------------------------->\n<ng-template #editHasManyDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{metadataHasMany.tableData.editData.title(hasManyEntityPriorChanges)}}</div>\n\n        <div class=\"actions-container\">\n            @if (metadataHasMany.tableData.editData.actions.length) {\n                <button type=\"button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                    {{metadataHasMany.tableData.editData.actionsLabel}}\n                </button>\n            }\n            <mat-menu #menu=\"matMenu\">\n                @for (action of metadataHasMany.tableData.editData.actions; track $index) {\n                    <button type=\"button\" mat-menu-item [disabled]=\"hasManyEditActionDisabled(action)\" (click)=\"hasManyRunEditAction(action)\">\n                        {{action.displayName}}\n                    </button>\n                }\n            </mat-menu>\n        \n            @if (hasManyAllowDelete(hasManyEntity)) {\n                <button type=\"button\" mat-raised-button color=\"warn\" class=\"delete-button\" tabindex=\"-1\" (click)=\"deleteHasManyEntity()\">\n                    {{metadataHasMany.tableData.editData.deleteButtonLabel}}\n                </button>\n            }\n        </div>\n    </div>\n    \n    <form>\n        <mat-dialog-content>\n            @if (hasManyEditFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: hasManyEditFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n        \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [class.badge-changes]=\"!hasManyValidationErrors.length\"\n                    [disabled]=\"internalIsReadOnly || !isHasManyEntityValid || !isHasManyEntityDirty\"\n                    [matBadge]=\"hasManyValidationErrors.length > 0 ? hasManyValidationErrors.length : hasManyChanges.length\"\n                    [matBadgeHidden]=\"!hasManyValidationErrors.length && !hasManyChanges.length\"\n                    (click)=\"dialogEditHasMany()\"\n                >\n                    {{metadataHasMany.tableData.editData.confirmButtonLabel}}\n                </button>\n                @if (hasManyValidationErrors.length || hasManyChanges.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"hasManyTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"dialogCancelEditHasMany()\">\n                {{metadataHasMany.tableData.editData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n</ng-template>", styles: ["::ng-deep mat-tab-body{padding-top:10px;padding-left:12px;padding-right:12px}::ng-deep mat-tab-body .mat-mdc-tab-body-content{overflow:initial}::ng-deep .mat-mdc-tab-body-wrapper{margin-left:-12px;margin-right:-12px}::ng-deep .mat-mdc-form-field-has-icon-suffix .mat-mdc-text-field-wrapper{padding-right:16px}::ng-deep .select-search-input{width:100%;margin-top:-8px;margin-bottom:8px}::ng-deep .select-search-input .mat-mdc-form-field-subscript-wrapper{display:none}::ng-deep .mat-mdc-form-field.mat-form-field-disabled label{color:#0009}::ng-deep .mat-mdc-form-field.mat-form-field-disabled input,::ng-deep .mat-mdc-form-field.mat-form-field-disabled textarea,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-select-disabled,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-select-value{color:#000!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#707070}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[disabled]:checked~.mdc-checkbox__background,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[disabled]:indeterminate~.mdc-checkbox__background,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[data-indeterminate=true][disabled]~.mdc-checkbox__background{background-color:#000}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-chip.mat-mdc-standard-chip.mat-mdc-chip-disabled{opacity:1}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-chip.mat-mdc-standard-chip.mat-mdc-chip-disabled button{opacity:.2}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--selected:disabled .mdc-switch__icons,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--unselected:disabled .mdc-switch__icons{opacity:1}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--selected:disabled .mdc-switch__handle:after,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--unselected:disabled .mdc-switch__handle:after{opacity:1;background:#000}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--selected:disabled .mdc-switch__track,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--unselected:disabled .mdc-switch__track{opacity:.3}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-date-range-input-inner:disabled{color:#000}::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled{opacity:1}::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled .mdc-slider__input{cursor:default}::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled mat-slider-visual-thumb .mat-mdc-slider,::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled mat-slider-visual-thumb .mdc-slider__thumb:hover,::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled mat-slider-visual-thumb .mdc-slider__thumb-knob{background-color:#000;border-color:#000}::ng-deep .mat-mdc-form-field .mat-mdc-slide-toggle{opacity:1}::ng-deep .badge-changes .mat-badge-content{background-color:orange;color:#fff}mat-spinner{margin:10px auto}.mdc-data-table__row:last-child .mdc-data-table__cell{border-bottom:1px solid rgba(0,0,0,.12)}mat-paginator{padding-top:10px;padding-bottom:10px}.dialog-button-with-info-icon{margin-top:10px;gap:12px;display:flex;align-items:center}.actions-container{display:flex;gap:10px}.object-dropdown{width:100%}.table-with-error-slot{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:5px}.mat-column-select{flex:0 0 48px;padding-left:0;padding-right:0;justify-content:center}.enabled:hover{cursor:pointer}.table-error{display:flex;align-items:center;justify-content:center;margin-top:-6px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:fit-content;padding-left:4px;padding-right:4px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.entityArray .elevation-container{border-radius:5px;padding:15px 15px 0;margin-bottom:15px;margin-top:15px}.entityArray .array-headline{padding-bottom:10px}.entityArray .buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px;flex-wrap:wrap;gap:10px}.entityArray .buttons button{flex-grow:1}.hasMany button{width:100%;height:56px;line-height:24px;font-size:16px}.hasMany .title{text-align:center}.hasMany .elevation-container{margin-bottom:15px}\n", "::ng-deep .mdc-dialog .mdc-dialog__content{padding:6px 20px!important}mat-dialog-actions{justify-content:space-between;align-items:center;padding-left:20px;padding-right:20px}.mat-dialog-title{padding:12px 20px;display:flex;justify-content:space-between;align-items:center}.mat-dialog-title div{font-size:var(--mdc-dialog-subhead-size, 14px);font-weight:var(--mdc-dialog-subhead-weight, 500)}\n", ".grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.grid{display:grid}@media (min-width: 1024px){.lg\\:col-span-12{grid-column:span 12/span 12!important}.lg\\:col-span-11{grid-column:span 11/span 11!important}.lg\\:col-span-10{grid-column:span 10/span 10!important}.lg\\:col-span-9{grid-column:span 9/span 9!important}.lg\\:col-span-8{grid-column:span 8/span 8!important}.lg\\:col-span-7{grid-column:span 7/span 7!important}.lg\\:col-span-6{grid-column:span 6/span 6!important}.lg\\:col-span-5{grid-column:span 5/span 5!important}.lg\\:col-span-4{grid-column:span 4/span 4!important}.lg\\:col-span-3{grid-column:span 3/span 3!important}.lg\\:col-span-2{grid-column:span 2/span 2!important}.lg\\:col-span-1{grid-column:span 1/span 1!important}}@media (min-width: 768px) and (max-width: 1023px){.md\\:col-span-12{grid-column:span 12/span 12!important}.md\\:col-span-11{grid-column:span 11/span 11!important}.md\\:col-span-10{grid-column:span 10/span 10!important}.md\\:col-span-9{grid-column:span 9/span 9!important}.md\\:col-span-8{grid-column:span 8/span 8!important}.md\\:col-span-7{grid-column:span 7/span 7!important}.md\\:col-span-6{grid-column:span 6/span 6!important}.md\\:col-span-5{grid-column:span 5/span 5!important}.md\\:col-span-4{grid-column:span 4/span 4!important}.md\\:col-span-3{grid-column:span 3/span 3!important}.md\\:col-span-2{grid-column:span 2/span 2!important}.md\\:col-span-1{grid-column:span 1/span 1!important}}.col-span-12{grid-column:span 12/span 12}.col-span-11{grid-column:span 11/span 11}.col-span-10{grid-column:span 10/span 10}.col-span-9{grid-column:span 9/span 9}.col-span-8{grid-column:span 8/span 8}.col-span-7{grid-column:span 7/span 7}.col-span-6{grid-column:span 6/span 6}.col-span-5{grid-column:span 5/span 5}.col-span-4{grid-column:span 4/span 4}.col-span-3{grid-column:span 3/span 3}.col-span-2{grid-column:span 2/span 2}.col-span-1{grid-column:span 1/span 1}\n"], dependencies: [{ kind: "component", type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit", "validEmpty", "isReadOnly"], outputs: ["inputChangeEvent"] }, { kind: "component", type: DisplayColumnValueComponent, selector: "display-column-value", inputs: ["entity", "ComponentClass"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i5$1.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass"], exportAs: ["matTab"] }, { kind: "component", type: i5$1.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i1$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i10.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i7.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i7.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i7.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i3$2.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i5.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i2.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i2.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i2.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i2.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i2.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i2.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i3$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: TooltipComponent, selector: "ngx-mat-entity-tooltip", inputs: ["tooltipContent"] }, { kind: "component", type: StringInputComponent, selector: "string-input" }, { kind: "component", type: StringTextboxInputComponent, selector: "string-textbox-input" }, { kind: "component", type: StringAutocompleteInputComponent, selector: "string-autocomplete-input" }, { kind: "component", type: StringDropdownInputComponent, selector: "string-dropdown-input" }, { kind: "component", type: StringPasswordInputComponent, selector: "string-password-input" }, { kind: "component", type: BooleanCheckboxInputComponent, selector: "boolean-checkbox-input" }, { kind: "component", type: BooleanToggleInputComponent, selector: "boolean-toggle-input" }, { kind: "component", type: BooleanDropdownInputComponent, selector: "boolean-dropdown-input" }, { kind: "component", type: NumberInputComponent, selector: "number-input" }, { kind: "component", type: NumberDropdownInputComponent, selector: "number-dropdown-input" }, { kind: "component", type: NumberSliderInputComponent, selector: "number-slider-input" }, { kind: "component", type: ArrayDateInputComponent, selector: "array-date-input" }, { kind: "component", type: ArrayDateRangeInputComponent, selector: "array-date-range-input" }, { kind: "component", type: ArrayDateTimeInputComponent, selector: "array-date-time-input" }, { kind: "component", type: ArrayStringAutocompleteChipsComponent, selector: "array-string-autocomplete-chips" }, { kind: "component", type: ArrayStringChipsInputComponent, selector: "array-string-chips-input" }, { kind: "component", type: DateInputComponent, selector: "date-input" }, { kind: "component", type: DateRangeInputComponent, selector: "date-range-input" }, { kind: "component", type: DateTimeInputComponent, selector: "date-time-input" }, { kind: "component", type: FileDefaultInputComponent, selector: "file-default-input" }, { kind: "component", type: FileImageInputComponent, selector: "file-image-input" }, { kind: "component", type: ReferencesManyInputComponent, selector: "references-many-input" }, { kind: "component", type: CustomInputComponent, selector: "custom-input" }, { kind: "directive", type: DynamicStyleClassDirective, selector: "[dynamicStyleClasses]", inputs: ["dynamicStyleClasses", "value"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i4.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i4.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.7", type: NgxMatEntityInputComponent, isStandalone: true, selector: "ngx-mat-entity-input", inputs: { entity: "entity", propertyKey: "propertyKey", getValidationErrorMessage: "getValidationErrorMessage", hideOmitForCreate: "hideOmitForCreate", hideOmitForEdit: "hideOmitForEdit", validEmpty: "validEmpty", isReadOnly: "isReadOnly" }, outputs: { inputChangeEvent: "inputChangeEvent" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "addArrayItemDialog", first: true, predicate: ["addArrayItemDialog"], descendants: true }, { propertyName: "editArrayItemDialog", first: true, predicate: ["editArrayItemDialog"], descendants: true }, { propertyName: "createHasManyDialog", first: true, predicate: ["createHasManyDialog"], descendants: true }, { propertyName: "editHasManyDialog", first: true, predicate: ["editHasManyDialog"], descendants: true }], ngImport: i0, template: "<!-- eslint-disable angular/no-call-expression -->\n@if(!(hideOmitForCreate && metadata.omitForCreate) && !(hideOmitForEdit && metadata.omitForUpdate)) {\n    @switch (type) {\n        <!-------------------------------------------->\n        <!-----------------Strings-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.STRING) {\n            <string-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-input>\n        }\n        @case (DecoratorTypes.STRING_TEXTBOX) {\n            <string-textbox-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-textbox-input>\n        }\n        @case (DecoratorTypes.STRING_AUTOCOMPLETE) {\n            <string-autocomplete-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-autocomplete-input>\n        }\n        @case (DecoratorTypes.STRING_DROPDOWN) {\n            <string-dropdown-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-dropdown-input>\n        }\n        @case (DecoratorTypes.STRING_PASSWORD) {\n            <string-password-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-password-input>\n        }\n        <!-------------------------------------------->\n        <!-----------------Booleans------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.BOOLEAN_CHECKBOX) {\n            <boolean-checkbox-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </boolean-checkbox-input>\n        }\n        @case (DecoratorTypes.BOOLEAN_TOGGLE) {\n            <boolean-toggle-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </boolean-toggle-input>\n        }\n        @case (DecoratorTypes.BOOLEAN_DROPDOWN) {\n            <boolean-dropdown-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </boolean-dropdown-input>\n        }\n        <!-------------------------------------------->\n        <!------------------Numbers------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.NUMBER) {\n            <number-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </number-input>\n        }\n        @case (DecoratorTypes.NUMBER_DROPDOWN) {\n            <number-dropdown-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </number-dropdown-input>\n        }\n        @case (DecoratorTypes.NUMBER_SLIDER) {\n            <number-slider-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </number-slider-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Array-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.ARRAY_DATE) {\n            <array-date-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-date-input>\n        }\n        @case (DecoratorTypes.ARRAY_DATE_TIME) {\n            <array-date-time-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-date-time-input>\n        }\n        @case (DecoratorTypes.ARRAY_DATE_RANGE) {\n            <array-date-range-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-date-range-input>\n        }\n        @case (DecoratorTypes.ARRAY_STRING_CHIPS) {\n            <array-string-chips-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-string-chips-input>\n        }\n        @case (DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS) {\n            <array-string-autocomplete-chips\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-string-autocomplete-chips>\n        }\n        <!-------------------------------------------->\n        <!-------------------Dates-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.DATE) {\n            <date-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </date-input>\n        }\n        @case (DecoratorTypes.DATE_RANGE) {\n            <date-range-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </date-range-input>\n        }\n        @case (DecoratorTypes.DATE_TIME) {\n            <date-time-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </date-time-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Files-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.FILE_DEFAULT) {\n            <file-default-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </file-default-input>\n        }\n        @case (DecoratorTypes.FILE_IMAGE) {\n            <file-image-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </file-image-input>\n        }\n        <!-------------------------------------------->\n        <!-------------- references many ------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.REFERENCES_MANY) {\n            <references-many-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </references-many-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Custom------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.CUSTOM) {\n            <custom-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </custom-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Object------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.OBJECT) {\n            <b>{{metadataDefaultObject.displayName}}</b>\n            <!-- iterates over the object properties -->\n            <ng-container *ngTemplateOutlet=\"form; context: objectFormContext\"></ng-container>\n        }\n        <!-------------------------------------------->\n        <!---------------Object Dropdown-------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.OBJECT_DROPDOWN) {\n            <mat-form-field class=\"w-full\">\n                <mat-label>{{metadata.displayName}}</mat-label>\n                <mat-select #model=\"ngModel\"\n                    [name]=\"objectDropdownName\"\n                    [required]=\"metadata.required(entity)\"\n                    [disabled]=\"internalIsReadOnly\"\n                    [compareWith]=\"compareObjectsBound\"\n                    [(ngModel)]=\"entity[propertyKey]\"\n                    (selectionChange)=\"emitChange()\"\n                    (opened)=\"selectSearchInput.focus()\"\n                >\n                    <mat-form-field class=\"select-search-input\">\n                        <!-- eslint-disable-next-line angular/no-any -->\n                        <input #selectSearchInput matInput (keyup)=\"filterObjectDropdownValues($any($event.target).value)\">\n                        <fa-icon matSuffix [icon]=\"faSearch\"></fa-icon>\n                    </mat-form-field>\n                    @if (!metadata.required(entity)) {\n                        <mat-option>-</mat-option>\n                    }\n                    @if (shouldDisplayCurrentObjectDropdownValue) {\n                        <mat-option [value]=\"currentObjectDropdownValue?.value\">{{currentObjectDropdownValue?.displayName}}</mat-option>\n                    }\n                    @for (value of filteredObjectDropdownValues; track $index) {\n                        <mat-option [value]=\"value.value\">{{value.displayName}}</mat-option>\n                    }\n                </mat-select>\n                <mat-error>{{internalGetValidationErrorMessage(model)}}</mat-error>\n            </mat-form-field>\n        }\n        <!-------------------------------------------->\n        <!-------------- references one -------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.REFERENCES_ONE) {\n            <mat-form-field [class.w-full]=\"metadataReferencesOne.dropdownOnly\">\n                <mat-label>{{metadata.displayName}}</mat-label>\n                <mat-select #inputModel=\"ngModel\"\n                    [name]=\"referencesOneName\"\n                    [disabled]=\"internalIsReadOnly\"\n                    [required]=\"metadata.required(entity)\"\n                    [(ngModel)]=\"entity[propertyKey]\"\n                    (selectionChange)=\"setReferencesOneObject()\"\n                    (opened)=\"selectSearchInput.focus()\"\n                >\n                    <mat-form-field class=\"select-search-input\">\n                        <!-- eslint-disable-next-line angular/no-any -->\n                        <input #selectSearchInput matInput (keyup)=\"filterReferencesOneValues($any($event.target).value)\">\n                        <fa-icon matSuffix [icon]=\"faSearch\"></fa-icon>\n                    </mat-form-field>\n                    @if (!metadata.required(entity)) {\n                        <mat-option>-</mat-option>\n                    }\n                    @if (shouldDisplayCurrentReferencesOneDropdownValue) {\n                        <mat-option [value]=\"currentReferencesOneDropdownValue?.value\">{{currentReferencesOneDropdownValue?.displayName}}</mat-option>\n                    }\n                    @for (value of filteredReferencesOneDropdownValues; track $index) {\n                        <mat-option [value]=\"value.value\">{{value.displayName}}</mat-option>\n                    }\n                </mat-select>\n                <mat-error>{{internalGetValidationErrorMessage(inputModel)}}</mat-error>\n            </mat-form-field>\n            <!-- iterates over the references one properties -->\n            @if (referencesOneFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: referencesOneFormContext\"></ng-container>\n            }\n        }\n        <!-------------------------------------------->\n        <!-------------------Array-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.ARRAY) {\n            <div class=\"entityArray\">\n                <div class=\"mat-elevation-z8 elevation-container\">\n                    <div class=\"array-headline\">\n                        <b>{{metadataEntityArray.displayName}}</b>\n                    </div>\n                    @if (metadataEntityArray.createInline && !internalIsReadOnly && addArrayItemFormContext) {\n                        <ng-container *ngTemplateOutlet=\"form; context: addArrayItemFormContext\"></ng-container>\n                    }\n                    @if (!internalIsReadOnly && entityArrayTableContext) {\n                        <div class=\"buttons\">\n                            <button type=\"button\" mat-raised-button\n                                [disabled]=\"metadataEntityArray.createInline && !isArrayItemValid\"\n                                (click)=\"addEntity()\">\n                                {{metadataEntityArray.addButtonLabel}}\n                            </button>\n                            <button type=\"button\" mat-raised-button\n                                [disabled]=\"!entityArrayTableContext.$implicit.selection.selected.length\"\n                                (click)=\"removeFromEntityArray()\">\n                                {{metadataEntityArray.removeButtonLabel}}\n                            </button>\n                        </div>\n                    }\n                    @if (entityArrayTableContext) {\n                        <ng-container *ngTemplateOutlet=\"table; context: entityArrayTableContext\"></ng-container>\n                    }\n                </div>\n            </div>\n        }\n        <!-------------------------------------------->\n        <!------------------ has many ---------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.HAS_MANY) {\n            <div class=\"hasMany\">\n                <h2 class=\"title\">{{metadataHasMany.tableData.baseData.title}}</h2>\n                <div class=\"grid grid-cols-12\" style=\"column-gap: 24px;\">\n                    <mat-form-field class=\"lg:col-span-8 md:col-span-6 col-span-12\">\n                        <mat-label>{{metadataHasMany.tableData.baseData.searchLabel}}</mat-label>\n                        <input matInput (keyup)=\"applyHasManyFilter($event)\">\n                    </mat-form-field>\n                    @if (metadataHasMany.tableData.baseData.tableActions.length) {\n                        <div\n                            [class.lg:col-span-2]=\"hasManyAllowCreate\"\n                            [class.lg:col-span-4]=\"!hasManyAllowCreate\"\n                            [class.md:col-span-3]=\"hasManyAllowCreate\"\n                            [class.md:col-span-6]=\"!hasManyAllowCreate\"\n                            [class.col-span-6]=\"hasManyAllowCreate\"\n                            [class.col-span-12]=\"!hasManyAllowCreate\"\n                        >\n                            <button type=\"button\" class=\"actions-button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                                {{metadataHasMany.tableData.baseData.tableActionsLabel}}\n                            </button>\n                        </div>\n                    }\n                    <mat-menu #menu=\"matMenu\">\n                        @if (metadataHasMany.tableData.baseData.allowJsonImport) {\n                            <button type=\"button\" mat-menu-item [disabled]=\"hasManyTableActionDisabled(hasManyImportAction)\" (click)=\"runHasManyTableAction(hasManyImportAction)\">\n                                {{hasManyImportAction.displayName}}\n                            </button>\n                        }\n                        @for (action of metadataHasMany.tableData.baseData.tableActions; track $index) {\n                            <button type=\"button\" mat-menu-item [disabled]=\"hasManyTableActionDisabled(action)\" (click)=\"runHasManyTableAction(action)\">\n                                {{action.displayName}}\n                            </button>\n                        }\n                    </mat-menu>\n                    @if (hasManyAllowCreate) {\n                        <div\n                            [class.lg:col-span-2]=\"metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.lg:col-span-4]=\"!metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.md:col-span-3]=\"metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.md:col-span-6]=\"!metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.col-span-6]=\"metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.col-span-12]=\"!metadataHasMany.tableData.baseData.tableActions.length\"\n                        >\n                            <button type=\"button\" class=\"create-button\" mat-raised-button (click)=\"createHasManyEntity()\">\n                                {{metadataHasMany.tableData.baseData.createButtonLabel}}\n                            </button>\n                        </div>\n                    }\n                </div>\n        \n                <div class=\"mat-elevation-z8 elevation-container\">\n                    @if (hasManyTableContext) {\n                        <ng-container *ngTemplateOutlet=\"table; context: hasManyTableContext\"></ng-container>\n                    }\n                </div>\n            </div>\n        }\n        \n        @default {\n            <div>ERROR: The type {{type}} is not known.</div>\n        }\n    }\n}\n\n\n<ng-template #table let-context>\n    <mat-table matSort [dataSource]=\"context.dataSource\" [class.table-with-error-slot]=\"context.shouldShowMissingError\">\n        <!-- select Column -->\n        <ng-container matColumnDef=\"select\">\n            <mat-header-cell *matHeaderCellDef>\n                <mat-checkbox [checked]=\"context.selection.hasValue() && SelectionUtilities.isAllSelected(context.selection, context.dataSource)\"\n                    [indeterminate]=\"context.selection.hasValue() && !SelectionUtilities.isAllSelected(context.selection, context.dataSource)\"\n                    (change)=\"$event ? SelectionUtilities.masterToggle(context.selection, context.dataSource) : null\">\n                </mat-checkbox>\n            </mat-header-cell>\n            <mat-cell *matCellDef=\"let value\" [dynamicStyleClasses]=\"context.dynamicRowStyleClasses\" [value]=\"value\">\n                <mat-checkbox [checked]=\"context.selection.isSelected(value)\"\n                    (click)=\"$event.stopPropagation()\"\n                    (change)=\"$event ? context.selection.toggle(value) : null\">\n                </mat-checkbox>\n            </mat-cell>\n        </ng-container>\n\n        @for (dCol of context.displayColumns; track $index) {\n            <ng-container [matColumnDef]=\"dCol.displayName\">\n                <mat-header-cell *matHeaderCellDef mat-sort-header>\n                    {{dCol.displayName}}\n                </mat-header-cell>\n                <mat-cell *matCellDef=\"let value\" [class.enabled]=\"!dCol.disableClick && context.allowClick(value)\"\n                    [dynamicStyleClasses]=\"context.dynamicRowStyleClasses\" [value]=\"value\"\n                    (click)=\"clickCell(value, dCol, context)\"\n                >\n                    @if (dCol.Component) {\n                        <display-column-value [entity]=\"value\" [ComponentClass]=\"dCol.Component\"></display-column-value>\n                    }\n                    @else {\n                        {{getDisplayColumnValue(value, dCol)}}\n                    }\n                </mat-cell>\n            </ng-container>\n        }\n\n        <mat-header-row *matHeaderRowDef=\"context.displayedColumns\"></mat-header-row>\n        <mat-row *matRowDef=\"let row; columns: context.displayedColumns\"></mat-row>\n    </mat-table>\n\n    @if (context.displayLoadingSpinner && context.isLoading) {\n        <mat-spinner>\n        </mat-spinner>\n    }\n    @else if (context.shouldShowMissingError && !context.dataSource.data.length) {\n        <div class=\"table-error\">{{context.emptyErrorMessage}}</div>\n    }\n\n    <mat-paginator [length]=\"context.dataSource.filteredData.length\" [pageIndex]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 50]\"></mat-paginator>\n</ng-template>\n\n<!--------------------------------------------------------->\n<!---------------------------Form-------------------------->\n<!--------------------------------------------------------->\n<ng-template #form let-context>\n     <!-- eslint-disable angular/no-call-expression -->\n    @if (context.tabs.length > 1) {\n        <mat-tab-group preserveContent>\n            @for (tab of context.tabs; track $index) {\n                <mat-tab [label]=\"tab.tabName\">\n                    @for (row of tab.rows; track $index) {\n                        <div class=\"grid grid-cols-12\" style=\"column-gap: 24px;\">\n                            @for (key of row.keys; track key) {\n                                <ngx-mat-entity-input\n                                    [entity]=\"context.entity\"\n                                    [propertyKey]=\"key\"\n                                    [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                                    [validEmpty]=\"context.validEmpty?.()\"\n                                    [isReadOnly]=\"context.isReadOnly?.(context.entity, key)\"\n                                    [class]=\"EntityUtilities.getWidthClasses(context.entity, key)\"\n                                    [hideOmitForEdit]=\"context.hideOmitForEdit\"\n                                    [hideOmitForCreate]=\"context.hideOmitForCreate\"\n                                    (inputChangeEvent)=\"context.inputChangeEvent()\"\n                                >\n                                </ngx-mat-entity-input>\n                            }\n                        </div>\n                    }\n                </mat-tab>\n            }\n        </mat-tab-group>\n    }\n    @else {\n        @if (!context.tabs.length) {\n            <span class=\"no-entity-tabs\">\n                ERROR: No Inputs. Did you correctly assign all values in the model constructor?\n            </span>\n        }\n        @else {\n            @for (row of context.tabs[0].rows; track $index) {\n                <div class=\"grid grid-cols-12\" style=\"column-gap: 24px;\">\n                    @for (key of row.keys; track key) {\n                        <ngx-mat-entity-input\n                            [entity]=\"context.entity\"\n                            [propertyKey]=\"key\"\n                            [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                            [validEmpty]=\"context.validEmpty?.()\"\n                            [isReadOnly]=\"context.isReadOnly?.(context.entity, key)\"\n                            [class]=\"EntityUtilities.getWidthClasses(context.entity, key)\"\n                            [hideOmitForEdit]=\"context.hideOmitForEdit\"\n                            [hideOmitForCreate]=\"context.hideOmitForCreate\"\n                            (inputChangeEvent)=\"context.inputChangeEvent()\"\n                        >\n                        </ngx-mat-entity-input>\n                    }\n                </div>\n            }\n        }\n    }\n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Add Array Item Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #addArrayItemDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{addArrayItemDialogData.title}}</div>\n    </div>\n\n    <form (ngSubmit)=\"addArrayItem()\">\n        <mat-dialog-content>\n            @if (addArrayItemFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: addArrayItemFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n    \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [disabled]=\"!isArrayItemValid\"\n                    [matBadge]=\"arrayItemValidationErrors.length\"\n                    [matBadgeHidden]=\"!arrayItemValidationErrors.length\"\n                >\n                    {{addArrayItemDialogData.createButtonLabel}}\n                </button>\n                @if (arrayItemValidationErrors.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"arrayItemTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"closeAddArrayItemDialog()\">\n                {{addArrayItemDialogData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n\n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Edit Array Item Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #editArrayItemDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{editArrayItemDialogData.title(arrayItemPriorChanges)}}</div>\n    </div>\n    \n    <form (ngSubmit)=\"saveArrayItem()\">\n        <mat-dialog-content>\n            @if (editArrayItemFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: editArrayItemFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n        \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [class.badge-changes]=\"!arrayItemValidationErrors.length\"\n                    [disabled]=\"internalIsReadOnly || !isArrayItemValid || !isArrayItemDirty\"\n                    [matBadge]=\"arrayItemValidationErrors.length > 0 ? arrayItemValidationErrors.length : arrayItemChanges.length\"\n                    [matBadgeHidden]=\"!arrayItemValidationErrors.length && !arrayItemChanges.length\"\n                >\n                    {{editArrayItemDialogData.confirmButtonLabel}}\n                </button>\n                @if (arrayItemValidationErrors.length || arrayItemChanges.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"arrayItemTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"closeEditArrayItemDialog()\">\n                {{editArrayItemDialogData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Create Has Many Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #createHasManyDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{metadataHasMany.tableData.createData.title}}</div>\n    </div>\n    \n    <form (ngSubmit)=\"dialogCreateHasMany()\">\n        <mat-dialog-content>\n            @if (hasManyCreateFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: hasManyCreateFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n        \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [disabled]=\"!isHasManyEntityValid\"\n                    [matBadge]=\"hasManyValidationErrors.length\"\n                    [matBadgeHidden]=\"!hasManyValidationErrors.length\"\n                >\n                    {{metadataHasMany.tableData.createData.createButtonLabel}}\n                </button>\n                @if (hasManyValidationErrors.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"hasManyTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"dialogCancelCreateHasMany()\">\n                {{metadataHasMany.tableData.createData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n    \n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Edit Has Many Dialog----------------->\n<!--------------------------------------------------------->\n<ng-template #editHasManyDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{metadataHasMany.tableData.editData.title(hasManyEntityPriorChanges)}}</div>\n\n        <div class=\"actions-container\">\n            @if (metadataHasMany.tableData.editData.actions.length) {\n                <button type=\"button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                    {{metadataHasMany.tableData.editData.actionsLabel}}\n                </button>\n            }\n            <mat-menu #menu=\"matMenu\">\n                @for (action of metadataHasMany.tableData.editData.actions; track $index) {\n                    <button type=\"button\" mat-menu-item [disabled]=\"hasManyEditActionDisabled(action)\" (click)=\"hasManyRunEditAction(action)\">\n                        {{action.displayName}}\n                    </button>\n                }\n            </mat-menu>\n        \n            @if (hasManyAllowDelete(hasManyEntity)) {\n                <button type=\"button\" mat-raised-button color=\"warn\" class=\"delete-button\" tabindex=\"-1\" (click)=\"deleteHasManyEntity()\">\n                    {{metadataHasMany.tableData.editData.deleteButtonLabel}}\n                </button>\n            }\n        </div>\n    </div>\n    \n    <form (ngSubmit)=\"dialogEditHasMany()\">\n        <mat-dialog-content>\n            @if (hasManyEditFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: hasManyEditFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n        \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [class.badge-changes]=\"!hasManyValidationErrors.length\"\n                    [disabled]=\"internalIsReadOnly || !isHasManyEntityValid || !isHasManyEntityDirty\"\n                    [matBadge]=\"hasManyValidationErrors.length > 0 ? hasManyValidationErrors.length : hasManyChanges.length\"\n                    [matBadgeHidden]=\"!hasManyValidationErrors.length && !hasManyChanges.length\"\n                >\n                    {{metadataHasMany.tableData.editData.confirmButtonLabel}}\n                </button>\n                @if (hasManyValidationErrors.length || hasManyChanges.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"hasManyTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"dialogCancelEditHasMany()\">\n                {{metadataHasMany.tableData.editData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n</ng-template>", styles: ["::ng-deep mat-tab-body{padding-top:10px;padding-left:12px;padding-right:12px}::ng-deep mat-tab-body .mat-mdc-tab-body-content{overflow:initial}::ng-deep .mat-mdc-tab-body-wrapper{margin-left:-12px;margin-right:-12px}::ng-deep .mat-mdc-form-field-has-icon-suffix .mat-mdc-text-field-wrapper{padding-right:16px}::ng-deep .select-search-input{width:100%;margin-top:-8px;margin-bottom:8px}::ng-deep .select-search-input .mat-mdc-form-field-subscript-wrapper{display:none}::ng-deep .mat-mdc-form-field.mat-form-field-disabled label{color:#0009}::ng-deep .mat-mdc-form-field.mat-form-field-disabled input,::ng-deep .mat-mdc-form-field.mat-form-field-disabled textarea,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-select-disabled,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-select-value{color:#000!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#707070}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[disabled]:checked~.mdc-checkbox__background,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[disabled]:indeterminate~.mdc-checkbox__background,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[data-indeterminate=true][disabled]~.mdc-checkbox__background{background-color:#000}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-chip.mat-mdc-standard-chip.mat-mdc-chip-disabled{opacity:1}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-chip.mat-mdc-standard-chip.mat-mdc-chip-disabled button{opacity:.2}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--selected:disabled .mdc-switch__icons,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--unselected:disabled .mdc-switch__icons{opacity:1}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--selected:disabled .mdc-switch__handle:after,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--unselected:disabled .mdc-switch__handle:after{opacity:1;background:#000}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--selected:disabled .mdc-switch__track,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--unselected:disabled .mdc-switch__track{opacity:.3}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-date-range-input-inner:disabled{color:#000}::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled{opacity:1}::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled .mdc-slider__input{cursor:default}::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled mat-slider-visual-thumb .mat-mdc-slider,::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled mat-slider-visual-thumb .mdc-slider__thumb:hover,::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled mat-slider-visual-thumb .mdc-slider__thumb-knob{background-color:#000;border-color:#000}::ng-deep .mat-mdc-form-field .mat-mdc-slide-toggle{opacity:1}::ng-deep .badge-changes .mat-badge-content{background-color:orange;color:#fff}mat-spinner{margin:10px auto}.mdc-data-table__row:last-child .mdc-data-table__cell{border-bottom:1px solid rgba(0,0,0,.12)}mat-paginator{padding-top:10px;padding-bottom:10px}.dialog-button-with-info-icon{margin-top:10px;gap:12px;display:flex;align-items:center}.actions-container{display:flex;gap:10px}.w-full{width:100%}.table-with-error-slot{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:5px}.mat-column-select{flex:0 0 48px;padding-left:0;padding-right:0;justify-content:center}.enabled:hover{cursor:pointer}.table-error{display:flex;align-items:center;justify-content:center;margin-top:-6px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:fit-content;padding-left:4px;padding-right:4px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.entityArray .elevation-container{border-radius:5px;padding:15px 15px 0;margin-bottom:15px;margin-top:15px}.entityArray .array-headline{padding-bottom:10px}.entityArray .buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px;flex-wrap:wrap;gap:10px}.entityArray .buttons button{flex-grow:1}.hasMany button{width:100%;height:56px;line-height:24px;font-size:16px}.hasMany .title{text-align:center}.hasMany .elevation-container{margin-bottom:15px}\n", "::ng-deep .mdc-dialog .mdc-dialog__content{padding:6px 20px!important}mat-dialog-actions{justify-content:space-between;align-items:center;padding-left:20px;padding-right:20px}.mat-dialog-title{padding:12px 20px;display:flex;justify-content:space-between;align-items:center}.mat-dialog-title div{font-size:var(--mdc-dialog-subhead-size, 14px);font-weight:var(--mdc-dialog-subhead-weight, 500)}\n", ".grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.grid{display:grid}@media (min-width: 1024px){.lg\\:col-span-12{grid-column:span 12/span 12!important}.lg\\:col-span-11{grid-column:span 11/span 11!important}.lg\\:col-span-10{grid-column:span 10/span 10!important}.lg\\:col-span-9{grid-column:span 9/span 9!important}.lg\\:col-span-8{grid-column:span 8/span 8!important}.lg\\:col-span-7{grid-column:span 7/span 7!important}.lg\\:col-span-6{grid-column:span 6/span 6!important}.lg\\:col-span-5{grid-column:span 5/span 5!important}.lg\\:col-span-4{grid-column:span 4/span 4!important}.lg\\:col-span-3{grid-column:span 3/span 3!important}.lg\\:col-span-2{grid-column:span 2/span 2!important}.lg\\:col-span-1{grid-column:span 1/span 1!important}}@media (min-width: 768px) and (max-width: 1023px){.md\\:col-span-12{grid-column:span 12/span 12!important}.md\\:col-span-11{grid-column:span 11/span 11!important}.md\\:col-span-10{grid-column:span 10/span 10!important}.md\\:col-span-9{grid-column:span 9/span 9!important}.md\\:col-span-8{grid-column:span 8/span 8!important}.md\\:col-span-7{grid-column:span 7/span 7!important}.md\\:col-span-6{grid-column:span 6/span 6!important}.md\\:col-span-5{grid-column:span 5/span 5!important}.md\\:col-span-4{grid-column:span 4/span 4!important}.md\\:col-span-3{grid-column:span 3/span 3!important}.md\\:col-span-2{grid-column:span 2/span 2!important}.md\\:col-span-1{grid-column:span 1/span 1!important}}.col-span-12{grid-column:span 12/span 12}.col-span-11{grid-column:span 11/span 11}.col-span-10{grid-column:span 10/span 10}.col-span-9{grid-column:span 9/span 9}.col-span-8{grid-column:span 8/span 8}.col-span-7{grid-column:span 7/span 7}.col-span-6{grid-column:span 6/span 6}.col-span-5{grid-column:span 5/span 5}.col-span-4{grid-column:span 4/span 4}.col-span-3{grid-column:span 3/span 3}.col-span-2{grid-column:span 2/span 2}.col-span-1{grid-column:span 1/span 1}\n"], dependencies: [{ kind: "component", type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit", "validEmpty", "isReadOnly"], outputs: ["inputChangeEvent"] }, { kind: "component", type: DisplayColumnValueComponent, selector: "display-column-value", inputs: ["entity", "ComponentClass"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i5$1.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass"], exportAs: ["matTab"] }, { kind: "component", type: i5$1.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i1$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i10.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i7.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i7.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i7.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i3$2.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i5.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i2.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i2.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i2.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i2.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i2.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i2.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i3$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: TooltipComponent, selector: "ngx-mat-entity-tooltip", inputs: ["tooltipContent"] }, { kind: "component", type: StringInputComponent, selector: "string-input" }, { kind: "component", type: StringTextboxInputComponent, selector: "string-textbox-input" }, { kind: "component", type: StringAutocompleteInputComponent, selector: "string-autocomplete-input" }, { kind: "component", type: StringDropdownInputComponent, selector: "string-dropdown-input" }, { kind: "component", type: StringPasswordInputComponent, selector: "string-password-input" }, { kind: "component", type: BooleanCheckboxInputComponent, selector: "boolean-checkbox-input" }, { kind: "component", type: BooleanToggleInputComponent, selector: "boolean-toggle-input" }, { kind: "component", type: BooleanDropdownInputComponent, selector: "boolean-dropdown-input" }, { kind: "component", type: NumberInputComponent, selector: "number-input" }, { kind: "component", type: NumberDropdownInputComponent, selector: "number-dropdown-input" }, { kind: "component", type: NumberSliderInputComponent, selector: "number-slider-input" }, { kind: "component", type: ArrayDateInputComponent, selector: "array-date-input" }, { kind: "component", type: ArrayDateRangeInputComponent, selector: "array-date-range-input" }, { kind: "component", type: ArrayDateTimeInputComponent, selector: "array-date-time-input" }, { kind: "component", type: ArrayStringAutocompleteChipsComponent, selector: "array-string-autocomplete-chips" }, { kind: "component", type: ArrayStringChipsInputComponent, selector: "array-string-chips-input" }, { kind: "component", type: DateInputComponent, selector: "date-input" }, { kind: "component", type: DateRangeInputComponent, selector: "date-range-input" }, { kind: "component", type: DateTimeInputComponent, selector: "date-time-input" }, { kind: "component", type: FileDefaultInputComponent, selector: "file-default-input" }, { kind: "component", type: FileImageInputComponent, selector: "file-image-input" }, { kind: "component", type: ReferencesManyInputComponent, selector: "references-many-input" }, { kind: "component", type: CustomInputComponent, selector: "custom-input" }, { kind: "directive", type: DynamicStyleClassDirective, selector: "[dynamicStyleClasses]", inputs: ["dynamicStyleClasses", "value"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i4.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i4.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgxMatEntityInputComponent, decorators: [{
             type: Component,
@@ -7023,7 +7027,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.7", ngImpor
                         DynamicStyleClassDirective,
                         MatSortModule,
                         FaIconComponent
-                    ], template: "<!-- eslint-disable angular/no-call-expression -->\n \n@if(!(hideOmitForCreate && metadata.omitForCreate) && !(hideOmitForEdit && metadata.omitForUpdate)) {\n    @switch (type) {\n        <!-------------------------------------------->\n        <!-----------------Strings-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.STRING) {\n            <string-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-input>\n        }\n        @case (DecoratorTypes.STRING_TEXTBOX) {\n            <string-textbox-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-textbox-input>\n        }\n        @case (DecoratorTypes.STRING_AUTOCOMPLETE) {\n            <string-autocomplete-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-autocomplete-input>\n        }\n        @case (DecoratorTypes.STRING_DROPDOWN) {\n            <string-dropdown-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-dropdown-input>\n        }\n        @case (DecoratorTypes.STRING_PASSWORD) {\n            <string-password-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-password-input>\n        }\n        <!-------------------------------------------->\n        <!-----------------Booleans------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.BOOLEAN_CHECKBOX) {\n            <boolean-checkbox-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </boolean-checkbox-input>\n        }\n        @case (DecoratorTypes.BOOLEAN_TOGGLE) {\n            <boolean-toggle-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </boolean-toggle-input>\n        }\n        @case (DecoratorTypes.BOOLEAN_DROPDOWN) {\n            <boolean-dropdown-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </boolean-dropdown-input>\n        }\n        <!-------------------------------------------->\n        <!------------------Numbers------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.NUMBER) {\n            <number-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </number-input>\n        }\n        @case (DecoratorTypes.NUMBER_DROPDOWN) {\n            <number-dropdown-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </number-dropdown-input>\n        }\n        @case (DecoratorTypes.NUMBER_SLIDER) {\n            <number-slider-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </number-slider-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Array-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.ARRAY_DATE) {\n            <array-date-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-date-input>\n        }\n        @case (DecoratorTypes.ARRAY_DATE_TIME) {\n            <array-date-time-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-date-time-input>\n        }\n        @case (DecoratorTypes.ARRAY_DATE_RANGE) {\n            <array-date-range-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-date-range-input>\n        }\n        @case (DecoratorTypes.ARRAY_STRING_CHIPS) {\n            <array-string-chips-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-string-chips-input>\n        }\n        @case (DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS) {\n            <array-string-autocomplete-chips\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-string-autocomplete-chips>\n        }\n        <!-------------------------------------------->\n        <!-------------------Dates-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.DATE) {\n            <date-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </date-input>\n        }\n        @case (DecoratorTypes.DATE_RANGE) {\n            <date-range-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </date-range-input>\n        }\n        @case (DecoratorTypes.DATE_TIME) {\n            <date-time-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </date-time-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Files-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.FILE_DEFAULT) {\n            <file-default-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </file-default-input>\n        }\n        @case (DecoratorTypes.FILE_IMAGE) {\n            <file-image-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </file-image-input>\n        }\n        <!-------------------------------------------->\n        <!-------------- references many ------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.REFERENCES_MANY) {\n            <references-many-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </references-many-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Custom------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.CUSTOM) {\n            <custom-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </custom-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Object------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.OBJECT) {\n            <b>{{metadataDefaultObject.displayName}}</b>\n            <!-- iterates over the object properties -->\n            <ng-container *ngTemplateOutlet=\"form; context: objectFormContext\"></ng-container>\n        }\n        <!-------------------------------------------->\n        <!---------------Object Dropdown-------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.OBJECT_DROPDOWN) {\n            <mat-form-field class=\"object-dropdown\">\n                <mat-label>{{metadata.displayName}}</mat-label>\n                <mat-select #model=\"ngModel\"\n                    [name]=\"objectDropdownName\"\n                    [required]=\"metadata.required(entity)\"\n                    [disabled]=\"internalIsReadOnly\"\n                    [compareWith]=\"compareObjectsBound\"\n                    [(ngModel)]=\"entity[propertyKey]\"\n                    (selectionChange)=\"emitChange()\"\n                    (opened)=\"selectSearchInput.focus()\"\n                >\n                    <mat-form-field class=\"select-search-input\">\n                        <!-- eslint-disable-next-line angular/no-any -->\n                        <input #selectSearchInput matInput (keyup)=\"filterObjectDropdownValues($any($event.target).value)\">\n                        <fa-icon matSuffix [icon]=\"faSearch\"></fa-icon>\n                    </mat-form-field>\n                    @if (!metadata.required(entity)) {\n                        <mat-option>-</mat-option>\n                    }\n                    @if (shouldDisplayCurrentObjectDropdownValue) {\n                        <mat-option [value]=\"currentObjectDropdownValue?.value\">{{currentObjectDropdownValue?.displayName}}</mat-option>\n                    }\n                    @for (value of filteredObjectDropdownValues; track $index) {\n                        <mat-option [value]=\"value.value\">{{value.displayName}}</mat-option>\n                    }\n                </mat-select>\n                <mat-error>{{internalGetValidationErrorMessage(model)}}</mat-error>\n            </mat-form-field>\n        }\n        <!-------------------------------------------->\n        <!-------------- references one -------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.REFERENCES_ONE) {\n            <mat-form-field>\n                <mat-label>{{metadata.displayName}}</mat-label>\n                <mat-select #inputModel=\"ngModel\"\n                    [name]=\"referencesOneName\"\n                    [disabled]=\"internalIsReadOnly\"\n                    [required]=\"metadata.required(entity)\"\n                    [(ngModel)]=\"entity[propertyKey]\"\n                    (selectionChange)=\"setReferencesOneObject()\"\n                    (opened)=\"selectSearchInput.focus()\"\n                >\n                    <mat-form-field class=\"select-search-input\">\n                        <!-- eslint-disable-next-line angular/no-any -->\n                        <input #selectSearchInput matInput (keyup)=\"filterReferencesOneValues($any($event.target).value)\">\n                        <fa-icon matSuffix [icon]=\"faSearch\"></fa-icon>\n                    </mat-form-field>\n                    @if (!metadata.required(entity)) {\n                        <mat-option>-</mat-option>\n                    }\n                    @if (shouldDisplayCurrentReferencesOneDropdownValue) {\n                        <mat-option [value]=\"currentReferencesOneDropdownValue?.value\">{{currentReferencesOneDropdownValue?.displayName}}</mat-option>\n                    }\n                    @for (value of filteredReferencesOneDropdownValues; track $index) {\n                        <mat-option [value]=\"value.value\">{{value.displayName}}</mat-option>\n                    }\n                </mat-select>\n                <mat-error>{{internalGetValidationErrorMessage(inputModel)}}</mat-error>\n            </mat-form-field>\n            <!-- iterates over the references one properties -->\n            @if (referencesOneFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: referencesOneFormContext\"></ng-container>\n            }\n        }\n        <!-------------------------------------------->\n        <!-------------------Array-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.ARRAY) {\n            <div class=\"entityArray\">\n                <div class=\"mat-elevation-z8 elevation-container\">\n                    <div class=\"array-headline\">\n                        <b>{{metadataEntityArray.displayName}}</b>\n                    </div>\n                    @if (metadataEntityArray.createInline && !internalIsReadOnly && addArrayItemFormContext) {\n                        <ng-container *ngTemplateOutlet=\"form; context: addArrayItemFormContext\"></ng-container>\n                    }\n                    @if (!internalIsReadOnly && entityArrayTableContext) {\n                        <div class=\"buttons\">\n                            <button type=\"button\" mat-raised-button\n                                [disabled]=\"metadataEntityArray.createInline && !isArrayItemValid\"\n                                (click)=\"addEntity()\">\n                                {{metadataEntityArray.addButtonLabel}}\n                            </button>\n                            <button type=\"button\" mat-raised-button\n                                [disabled]=\"!entityArrayTableContext.$implicit.selection.selected.length\"\n                                (click)=\"removeFromEntityArray()\">\n                                {{metadataEntityArray.removeButtonLabel}}\n                            </button>\n                        </div>\n                    }\n                    @if (entityArrayTableContext) {\n                        <ng-container *ngTemplateOutlet=\"table; context: entityArrayTableContext\"></ng-container>\n                    }\n                </div>\n            </div>\n        }\n        <!-------------------------------------------->\n        <!------------------ has many ---------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.HAS_MANY) {\n            <div class=\"hasMany\">\n                <h2 class=\"title\">{{metadataHasMany.tableData.baseData.title}}</h2>\n                <div class=\"grid grid-cols-12\" style=\"column-gap: 24px;\">\n                    <mat-form-field class=\"lg:col-span-8 md:col-span-6 col-span-12\">\n                        <mat-label>{{metadataHasMany.tableData.baseData.searchLabel}}</mat-label>\n                        <input matInput (keyup)=\"applyHasManyFilter($event)\">\n                    </mat-form-field>\n                    @if (metadataHasMany.tableData.baseData.tableActions.length) {\n                        <div\n                            [class.lg:col-span-2]=\"hasManyAllowCreate\"\n                            [class.lg:col-span-4]=\"!hasManyAllowCreate\"\n                            [class.md:col-span-3]=\"hasManyAllowCreate\"\n                            [class.md:col-span-6]=\"!hasManyAllowCreate\"\n                            [class.col-span-6]=\"hasManyAllowCreate\"\n                            [class.col-span-12]=\"!hasManyAllowCreate\"\n                        >\n                            <button type=\"button\" class=\"actions-button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                                {{metadataHasMany.tableData.baseData.tableActionsLabel}}\n                            </button>\n                        </div>\n                    }\n                    <mat-menu #menu=\"matMenu\">\n                        @if (metadataHasMany.tableData.baseData.allowJsonImport) {\n                            <button type=\"button\" mat-menu-item [disabled]=\"hasManyTableActionDisabled(hasManyImportAction)\" (click)=\"runHasManyTableAction(hasManyImportAction)\">\n                                {{hasManyImportAction.displayName}}\n                            </button>\n                        }\n                        @for (action of metadataHasMany.tableData.baseData.tableActions; track $index) {\n                            <button type=\"button\" mat-menu-item [disabled]=\"hasManyTableActionDisabled(action)\" (click)=\"runHasManyTableAction(action)\">\n                                {{action.displayName}}\n                            </button>\n                        }\n                    </mat-menu>\n                    @if (hasManyAllowCreate) {\n                        <div\n                            [class.lg:col-span-2]=\"metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.lg:col-span-4]=\"!metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.md:col-span-3]=\"metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.md:col-span-6]=\"!metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.col-span-6]=\"metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.col-span-12]=\"!metadataHasMany.tableData.baseData.tableActions.length\"\n                        >\n                            <button type=\"button\" class=\"create-button\" mat-raised-button (click)=\"createHasManyEntity()\">\n                                {{metadataHasMany.tableData.baseData.createButtonLabel}}\n                            </button>\n                        </div>\n                    }\n                </div>\n        \n                <div class=\"mat-elevation-z8 elevation-container\">\n                    @if (hasManyTableContext) {\n                        <ng-container *ngTemplateOutlet=\"table; context: hasManyTableContext\"></ng-container>\n                    }\n                </div>\n            </div>\n        }\n        \n        @default {\n            <div>ERROR: The type {{type}} is not known.</div>\n        }\n    }\n}\n\n\n<ng-template #table let-context>\n    <mat-table matSort [dataSource]=\"context.dataSource\" [class.table-with-error-slot]=\"context.shouldShowMissingError\">\n        <!-- select Column -->\n        <ng-container matColumnDef=\"select\">\n            <mat-header-cell *matHeaderCellDef>\n                <mat-checkbox [checked]=\"context.selection.hasValue() && SelectionUtilities.isAllSelected(context.selection, context.dataSource)\"\n                    [indeterminate]=\"context.selection.hasValue() && !SelectionUtilities.isAllSelected(context.selection, context.dataSource)\"\n                    (change)=\"$event ? SelectionUtilities.masterToggle(context.selection, context.dataSource) : null\">\n                </mat-checkbox>\n            </mat-header-cell>\n            <mat-cell *matCellDef=\"let value\" [dynamicStyleClasses]=\"context.dynamicRowStyleClasses\" [value]=\"value\">\n                <mat-checkbox [checked]=\"context.selection.isSelected(value)\"\n                    (click)=\"$event.stopPropagation()\"\n                    (change)=\"$event ? context.selection.toggle(value) : null\">\n                </mat-checkbox>\n            </mat-cell>\n        </ng-container>\n\n        @for (dCol of context.displayColumns; track $index) {\n            <ng-container [matColumnDef]=\"dCol.displayName\">\n                <mat-header-cell *matHeaderCellDef mat-sort-header>\n                    {{dCol.displayName}}\n                </mat-header-cell>\n                <mat-cell *matCellDef=\"let value\" [class.enabled]=\"!dCol.disableClick && context.allowClick(value)\"\n                    [dynamicStyleClasses]=\"context.dynamicRowStyleClasses\" [value]=\"value\"\n                    (click)=\"clickCell(value, dCol, context)\"\n                >\n                    @if (dCol.Component) {\n                        <display-column-value [entity]=\"value\" [ComponentClass]=\"dCol.Component\"></display-column-value>\n                    }\n                    @else {\n                        {{getDisplayColumnValue(value, dCol)}}\n                    }\n                </mat-cell>\n            </ng-container>\n        }\n\n        <mat-header-row *matHeaderRowDef=\"context.displayedColumns\"></mat-header-row>\n        <mat-row *matRowDef=\"let row; columns: context.displayedColumns\"></mat-row>\n    </mat-table>\n\n    @if (context.displayLoadingSpinner && context.isLoading) {\n        <mat-spinner>\n        </mat-spinner>\n    }\n    @else if (context.shouldShowMissingError && !context.dataSource.data.length) {\n        <div class=\"table-error\">{{context.emptyErrorMessage}}</div>\n    }\n\n    <mat-paginator [length]=\"context.dataSource.filteredData.length\" [pageIndex]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 50]\"></mat-paginator>\n</ng-template>\n\n<!--------------------------------------------------------->\n<!---------------------------Form-------------------------->\n<!--------------------------------------------------------->\n<ng-template #form let-context>\n     <!-- eslint-disable angular/no-call-expression -->\n    @if (context.tabs.length > 1) {\n        <mat-tab-group preserveContent>\n            @for (tab of context.tabs; track $index) {\n                <mat-tab [label]=\"tab.tabName\">\n                    @for (row of tab.rows; track $index) {\n                        <div class=\"grid grid-cols-12\" style=\"column-gap: 24px;\">\n                            @for (key of row.keys; track key) {\n                                <ngx-mat-entity-input\n                                    [entity]=\"context.entity\"\n                                    [propertyKey]=\"key\"\n                                    [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                                    [validEmpty]=\"context.validEmpty?.()\"\n                                    [isReadOnly]=\"context.isReadOnly?.(context.entity, key)\"\n                                    [class]=\"EntityUtilities.getWidthClasses(context.entity, key)\"\n                                    [hideOmitForEdit]=\"context.hideOmitForEdit\"\n                                    [hideOmitForCreate]=\"context.hideOmitForCreate\"\n                                    (inputChangeEvent)=\"context.inputChangeEvent()\"\n                                >\n                                </ngx-mat-entity-input>\n                            }\n                        </div>\n                    }\n                </mat-tab>\n            }\n        </mat-tab-group>\n    }\n    @else {\n        @if (!context.tabs.length) {\n            <span class=\"no-entity-tabs\">\n                ERROR: No Inputs. Did you correctly assign all values in the model constructor?\n            </span>\n        }\n        @else {\n            @for (row of context.tabs[0].rows; track $index) {\n                <div class=\"grid grid-cols-12\" style=\"column-gap: 24px;\">\n                    @for (key of row.keys; track key) {\n                        <ngx-mat-entity-input\n                            [entity]=\"context.entity\"\n                            [propertyKey]=\"key\"\n                            [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                            [validEmpty]=\"context.validEmpty?.()\"\n                            [isReadOnly]=\"context.isReadOnly?.(context.entity, key)\"\n                            [class]=\"EntityUtilities.getWidthClasses(context.entity, key)\"\n                            [hideOmitForEdit]=\"context.hideOmitForEdit\"\n                            [hideOmitForCreate]=\"context.hideOmitForCreate\"\n                            (inputChangeEvent)=\"context.inputChangeEvent()\"\n                        >\n                        </ngx-mat-entity-input>\n                    }\n                </div>\n            }\n        }\n    }\n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Add Array Item Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #addArrayItemDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{addArrayItemDialogData.title}}</div>\n    </div>\n\n    <form>\n        <mat-dialog-content>\n            @if (addArrayItemFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: addArrayItemFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n    \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [disabled]=\"!isArrayItemValid\"\n                    [matBadge]=\"arrayItemValidationErrors.length\"\n                    [matBadgeHidden]=\"!arrayItemValidationErrors.length\"\n                    (click)=\"addArrayItem()\"\n                >\n                    {{addArrayItemDialogData.createButtonLabel}}\n                </button>\n                @if (arrayItemValidationErrors.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"arrayItemTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"closeAddArrayItemDialog()\">\n                {{addArrayItemDialogData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n\n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Edit Array Item Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #editArrayItemDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{editArrayItemDialogData.title(arrayItemPriorChanges)}}</div>\n    </div>\n    \n    <form>\n        <mat-dialog-content>\n            @if (editArrayItemFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: editArrayItemFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n        \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [class.badge-changes]=\"!arrayItemValidationErrors.length\"\n                    [disabled]=\"internalIsReadOnly || !isArrayItemValid || !isArrayItemDirty\"\n                    [matBadge]=\"arrayItemValidationErrors.length > 0 ? arrayItemValidationErrors.length : arrayItemChanges.length\"\n                    [matBadgeHidden]=\"!arrayItemValidationErrors.length && !arrayItemChanges.length\"\n                    (click)=\"saveArrayItem()\"\n                >\n                    {{editArrayItemDialogData.confirmButtonLabel}}\n                </button>\n                @if (arrayItemValidationErrors.length || arrayItemChanges.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"arrayItemTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"closeEditArrayItemDialog()\">\n                {{editArrayItemDialogData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Create Has Many Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #createHasManyDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{metadataHasMany.tableData.createData.title}}</div>\n    </div>\n    \n    <form>\n        <mat-dialog-content>\n            @if (hasManyCreateFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: hasManyCreateFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n        \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [disabled]=\"!isHasManyEntityValid\"\n                    [matBadge]=\"hasManyValidationErrors.length\"\n                    [matBadgeHidden]=\"!hasManyValidationErrors.length\"\n                    (click)=\"dialogCreateHasMany()\"\n                >\n                    {{metadataHasMany.tableData.createData.createButtonLabel}}\n                </button>\n                @if (hasManyValidationErrors.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"hasManyTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"dialogCancelCreateHasMany()\">\n                {{metadataHasMany.tableData.createData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n    \n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Edit Has Many Dialog----------------->\n<!--------------------------------------------------------->\n<ng-template #editHasManyDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{metadataHasMany.tableData.editData.title(hasManyEntityPriorChanges)}}</div>\n\n        <div class=\"actions-container\">\n            @if (metadataHasMany.tableData.editData.actions.length) {\n                <button type=\"button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                    {{metadataHasMany.tableData.editData.actionsLabel}}\n                </button>\n            }\n            <mat-menu #menu=\"matMenu\">\n                @for (action of metadataHasMany.tableData.editData.actions; track $index) {\n                    <button type=\"button\" mat-menu-item [disabled]=\"hasManyEditActionDisabled(action)\" (click)=\"hasManyRunEditAction(action)\">\n                        {{action.displayName}}\n                    </button>\n                }\n            </mat-menu>\n        \n            @if (hasManyAllowDelete(hasManyEntity)) {\n                <button type=\"button\" mat-raised-button color=\"warn\" class=\"delete-button\" tabindex=\"-1\" (click)=\"deleteHasManyEntity()\">\n                    {{metadataHasMany.tableData.editData.deleteButtonLabel}}\n                </button>\n            }\n        </div>\n    </div>\n    \n    <form>\n        <mat-dialog-content>\n            @if (hasManyEditFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: hasManyEditFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n        \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [class.badge-changes]=\"!hasManyValidationErrors.length\"\n                    [disabled]=\"internalIsReadOnly || !isHasManyEntityValid || !isHasManyEntityDirty\"\n                    [matBadge]=\"hasManyValidationErrors.length > 0 ? hasManyValidationErrors.length : hasManyChanges.length\"\n                    [matBadgeHidden]=\"!hasManyValidationErrors.length && !hasManyChanges.length\"\n                    (click)=\"dialogEditHasMany()\"\n                >\n                    {{metadataHasMany.tableData.editData.confirmButtonLabel}}\n                </button>\n                @if (hasManyValidationErrors.length || hasManyChanges.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"hasManyTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"dialogCancelEditHasMany()\">\n                {{metadataHasMany.tableData.editData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n</ng-template>", styles: ["::ng-deep mat-tab-body{padding-top:10px;padding-left:12px;padding-right:12px}::ng-deep mat-tab-body .mat-mdc-tab-body-content{overflow:initial}::ng-deep .mat-mdc-tab-body-wrapper{margin-left:-12px;margin-right:-12px}::ng-deep .mat-mdc-form-field-has-icon-suffix .mat-mdc-text-field-wrapper{padding-right:16px}::ng-deep .select-search-input{width:100%;margin-top:-8px;margin-bottom:8px}::ng-deep .select-search-input .mat-mdc-form-field-subscript-wrapper{display:none}::ng-deep .mat-mdc-form-field.mat-form-field-disabled label{color:#0009}::ng-deep .mat-mdc-form-field.mat-form-field-disabled input,::ng-deep .mat-mdc-form-field.mat-form-field-disabled textarea,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-select-disabled,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-select-value{color:#000!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#707070}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[disabled]:checked~.mdc-checkbox__background,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[disabled]:indeterminate~.mdc-checkbox__background,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[data-indeterminate=true][disabled]~.mdc-checkbox__background{background-color:#000}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-chip.mat-mdc-standard-chip.mat-mdc-chip-disabled{opacity:1}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-chip.mat-mdc-standard-chip.mat-mdc-chip-disabled button{opacity:.2}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--selected:disabled .mdc-switch__icons,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--unselected:disabled .mdc-switch__icons{opacity:1}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--selected:disabled .mdc-switch__handle:after,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--unselected:disabled .mdc-switch__handle:after{opacity:1;background:#000}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--selected:disabled .mdc-switch__track,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--unselected:disabled .mdc-switch__track{opacity:.3}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-date-range-input-inner:disabled{color:#000}::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled{opacity:1}::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled .mdc-slider__input{cursor:default}::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled mat-slider-visual-thumb .mat-mdc-slider,::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled mat-slider-visual-thumb .mdc-slider__thumb:hover,::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled mat-slider-visual-thumb .mdc-slider__thumb-knob{background-color:#000;border-color:#000}::ng-deep .mat-mdc-form-field .mat-mdc-slide-toggle{opacity:1}::ng-deep .badge-changes .mat-badge-content{background-color:orange;color:#fff}mat-spinner{margin:10px auto}.mdc-data-table__row:last-child .mdc-data-table__cell{border-bottom:1px solid rgba(0,0,0,.12)}mat-paginator{padding-top:10px;padding-bottom:10px}.dialog-button-with-info-icon{margin-top:10px;gap:12px;display:flex;align-items:center}.actions-container{display:flex;gap:10px}.object-dropdown{width:100%}.table-with-error-slot{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:5px}.mat-column-select{flex:0 0 48px;padding-left:0;padding-right:0;justify-content:center}.enabled:hover{cursor:pointer}.table-error{display:flex;align-items:center;justify-content:center;margin-top:-6px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:fit-content;padding-left:4px;padding-right:4px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.entityArray .elevation-container{border-radius:5px;padding:15px 15px 0;margin-bottom:15px;margin-top:15px}.entityArray .array-headline{padding-bottom:10px}.entityArray .buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px;flex-wrap:wrap;gap:10px}.entityArray .buttons button{flex-grow:1}.hasMany button{width:100%;height:56px;line-height:24px;font-size:16px}.hasMany .title{text-align:center}.hasMany .elevation-container{margin-bottom:15px}\n", "::ng-deep .mdc-dialog .mdc-dialog__content{padding:6px 20px!important}mat-dialog-actions{justify-content:space-between;align-items:center;padding-left:20px;padding-right:20px}.mat-dialog-title{padding:12px 20px;display:flex;justify-content:space-between;align-items:center}.mat-dialog-title div{font-size:var(--mdc-dialog-subhead-size, 14px);font-weight:var(--mdc-dialog-subhead-weight, 500)}\n", ".grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.grid{display:grid}@media (min-width: 1024px){.lg\\:col-span-12{grid-column:span 12/span 12!important}.lg\\:col-span-11{grid-column:span 11/span 11!important}.lg\\:col-span-10{grid-column:span 10/span 10!important}.lg\\:col-span-9{grid-column:span 9/span 9!important}.lg\\:col-span-8{grid-column:span 8/span 8!important}.lg\\:col-span-7{grid-column:span 7/span 7!important}.lg\\:col-span-6{grid-column:span 6/span 6!important}.lg\\:col-span-5{grid-column:span 5/span 5!important}.lg\\:col-span-4{grid-column:span 4/span 4!important}.lg\\:col-span-3{grid-column:span 3/span 3!important}.lg\\:col-span-2{grid-column:span 2/span 2!important}.lg\\:col-span-1{grid-column:span 1/span 1!important}}@media (min-width: 768px) and (max-width: 1023px){.md\\:col-span-12{grid-column:span 12/span 12!important}.md\\:col-span-11{grid-column:span 11/span 11!important}.md\\:col-span-10{grid-column:span 10/span 10!important}.md\\:col-span-9{grid-column:span 9/span 9!important}.md\\:col-span-8{grid-column:span 8/span 8!important}.md\\:col-span-7{grid-column:span 7/span 7!important}.md\\:col-span-6{grid-column:span 6/span 6!important}.md\\:col-span-5{grid-column:span 5/span 5!important}.md\\:col-span-4{grid-column:span 4/span 4!important}.md\\:col-span-3{grid-column:span 3/span 3!important}.md\\:col-span-2{grid-column:span 2/span 2!important}.md\\:col-span-1{grid-column:span 1/span 1!important}}.col-span-12{grid-column:span 12/span 12}.col-span-11{grid-column:span 11/span 11}.col-span-10{grid-column:span 10/span 10}.col-span-9{grid-column:span 9/span 9}.col-span-8{grid-column:span 8/span 8}.col-span-7{grid-column:span 7/span 7}.col-span-6{grid-column:span 6/span 6}.col-span-5{grid-column:span 5/span 5}.col-span-4{grid-column:span 4/span 4}.col-span-3{grid-column:span 3/span 3}.col-span-2{grid-column:span 2/span 2}.col-span-1{grid-column:span 1/span 1}\n"] }]
+                    ], template: "<!-- eslint-disable angular/no-call-expression -->\n@if(!(hideOmitForCreate && metadata.omitForCreate) && !(hideOmitForEdit && metadata.omitForUpdate)) {\n    @switch (type) {\n        <!-------------------------------------------->\n        <!-----------------Strings-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.STRING) {\n            <string-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-input>\n        }\n        @case (DecoratorTypes.STRING_TEXTBOX) {\n            <string-textbox-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-textbox-input>\n        }\n        @case (DecoratorTypes.STRING_AUTOCOMPLETE) {\n            <string-autocomplete-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-autocomplete-input>\n        }\n        @case (DecoratorTypes.STRING_DROPDOWN) {\n            <string-dropdown-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-dropdown-input>\n        }\n        @case (DecoratorTypes.STRING_PASSWORD) {\n            <string-password-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </string-password-input>\n        }\n        <!-------------------------------------------->\n        <!-----------------Booleans------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.BOOLEAN_CHECKBOX) {\n            <boolean-checkbox-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </boolean-checkbox-input>\n        }\n        @case (DecoratorTypes.BOOLEAN_TOGGLE) {\n            <boolean-toggle-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </boolean-toggle-input>\n        }\n        @case (DecoratorTypes.BOOLEAN_DROPDOWN) {\n            <boolean-dropdown-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </boolean-dropdown-input>\n        }\n        <!-------------------------------------------->\n        <!------------------Numbers------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.NUMBER) {\n            <number-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </number-input>\n        }\n        @case (DecoratorTypes.NUMBER_DROPDOWN) {\n            <number-dropdown-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </number-dropdown-input>\n        }\n        @case (DecoratorTypes.NUMBER_SLIDER) {\n            <number-slider-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </number-slider-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Array-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.ARRAY_DATE) {\n            <array-date-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-date-input>\n        }\n        @case (DecoratorTypes.ARRAY_DATE_TIME) {\n            <array-date-time-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-date-time-input>\n        }\n        @case (DecoratorTypes.ARRAY_DATE_RANGE) {\n            <array-date-range-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-date-range-input>\n        }\n        @case (DecoratorTypes.ARRAY_STRING_CHIPS) {\n            <array-string-chips-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-string-chips-input>\n        }\n        @case (DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS) {\n            <array-string-autocomplete-chips\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </array-string-autocomplete-chips>\n        }\n        <!-------------------------------------------->\n        <!-------------------Dates-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.DATE) {\n            <date-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </date-input>\n        }\n        @case (DecoratorTypes.DATE_RANGE) {\n            <date-range-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </date-range-input>\n        }\n        @case (DecoratorTypes.DATE_TIME) {\n            <date-time-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </date-time-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Files-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.FILE_DEFAULT) {\n            <file-default-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </file-default-input>\n        }\n        @case (DecoratorTypes.FILE_IMAGE) {\n            <file-image-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </file-image-input>\n        }\n        <!-------------------------------------------->\n        <!-------------- references many ------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.REFERENCES_MANY) {\n            <references-many-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </references-many-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Custom------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.CUSTOM) {\n            <custom-input\n                [entity]=\"entity\"\n                [key]=\"propertyKey\"\n                [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                [isReadOnly]=\"internalIsReadOnly\"\n                (inputChangeEvent)=\"emitChange()\"\n            >\n            </custom-input>\n        }\n        <!-------------------------------------------->\n        <!-------------------Object------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.OBJECT) {\n            <b>{{metadataDefaultObject.displayName}}</b>\n            <!-- iterates over the object properties -->\n            <ng-container *ngTemplateOutlet=\"form; context: objectFormContext\"></ng-container>\n        }\n        <!-------------------------------------------->\n        <!---------------Object Dropdown-------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.OBJECT_DROPDOWN) {\n            <mat-form-field class=\"w-full\">\n                <mat-label>{{metadata.displayName}}</mat-label>\n                <mat-select #model=\"ngModel\"\n                    [name]=\"objectDropdownName\"\n                    [required]=\"metadata.required(entity)\"\n                    [disabled]=\"internalIsReadOnly\"\n                    [compareWith]=\"compareObjectsBound\"\n                    [(ngModel)]=\"entity[propertyKey]\"\n                    (selectionChange)=\"emitChange()\"\n                    (opened)=\"selectSearchInput.focus()\"\n                >\n                    <mat-form-field class=\"select-search-input\">\n                        <!-- eslint-disable-next-line angular/no-any -->\n                        <input #selectSearchInput matInput (keyup)=\"filterObjectDropdownValues($any($event.target).value)\">\n                        <fa-icon matSuffix [icon]=\"faSearch\"></fa-icon>\n                    </mat-form-field>\n                    @if (!metadata.required(entity)) {\n                        <mat-option>-</mat-option>\n                    }\n                    @if (shouldDisplayCurrentObjectDropdownValue) {\n                        <mat-option [value]=\"currentObjectDropdownValue?.value\">{{currentObjectDropdownValue?.displayName}}</mat-option>\n                    }\n                    @for (value of filteredObjectDropdownValues; track $index) {\n                        <mat-option [value]=\"value.value\">{{value.displayName}}</mat-option>\n                    }\n                </mat-select>\n                <mat-error>{{internalGetValidationErrorMessage(model)}}</mat-error>\n            </mat-form-field>\n        }\n        <!-------------------------------------------->\n        <!-------------- references one -------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.REFERENCES_ONE) {\n            <mat-form-field [class.w-full]=\"metadataReferencesOne.dropdownOnly\">\n                <mat-label>{{metadata.displayName}}</mat-label>\n                <mat-select #inputModel=\"ngModel\"\n                    [name]=\"referencesOneName\"\n                    [disabled]=\"internalIsReadOnly\"\n                    [required]=\"metadata.required(entity)\"\n                    [(ngModel)]=\"entity[propertyKey]\"\n                    (selectionChange)=\"setReferencesOneObject()\"\n                    (opened)=\"selectSearchInput.focus()\"\n                >\n                    <mat-form-field class=\"select-search-input\">\n                        <!-- eslint-disable-next-line angular/no-any -->\n                        <input #selectSearchInput matInput (keyup)=\"filterReferencesOneValues($any($event.target).value)\">\n                        <fa-icon matSuffix [icon]=\"faSearch\"></fa-icon>\n                    </mat-form-field>\n                    @if (!metadata.required(entity)) {\n                        <mat-option>-</mat-option>\n                    }\n                    @if (shouldDisplayCurrentReferencesOneDropdownValue) {\n                        <mat-option [value]=\"currentReferencesOneDropdownValue?.value\">{{currentReferencesOneDropdownValue?.displayName}}</mat-option>\n                    }\n                    @for (value of filteredReferencesOneDropdownValues; track $index) {\n                        <mat-option [value]=\"value.value\">{{value.displayName}}</mat-option>\n                    }\n                </mat-select>\n                <mat-error>{{internalGetValidationErrorMessage(inputModel)}}</mat-error>\n            </mat-form-field>\n            <!-- iterates over the references one properties -->\n            @if (referencesOneFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: referencesOneFormContext\"></ng-container>\n            }\n        }\n        <!-------------------------------------------->\n        <!-------------------Array-------------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.ARRAY) {\n            <div class=\"entityArray\">\n                <div class=\"mat-elevation-z8 elevation-container\">\n                    <div class=\"array-headline\">\n                        <b>{{metadataEntityArray.displayName}}</b>\n                    </div>\n                    @if (metadataEntityArray.createInline && !internalIsReadOnly && addArrayItemFormContext) {\n                        <ng-container *ngTemplateOutlet=\"form; context: addArrayItemFormContext\"></ng-container>\n                    }\n                    @if (!internalIsReadOnly && entityArrayTableContext) {\n                        <div class=\"buttons\">\n                            <button type=\"button\" mat-raised-button\n                                [disabled]=\"metadataEntityArray.createInline && !isArrayItemValid\"\n                                (click)=\"addEntity()\">\n                                {{metadataEntityArray.addButtonLabel}}\n                            </button>\n                            <button type=\"button\" mat-raised-button\n                                [disabled]=\"!entityArrayTableContext.$implicit.selection.selected.length\"\n                                (click)=\"removeFromEntityArray()\">\n                                {{metadataEntityArray.removeButtonLabel}}\n                            </button>\n                        </div>\n                    }\n                    @if (entityArrayTableContext) {\n                        <ng-container *ngTemplateOutlet=\"table; context: entityArrayTableContext\"></ng-container>\n                    }\n                </div>\n            </div>\n        }\n        <!-------------------------------------------->\n        <!------------------ has many ---------------->\n        <!-------------------------------------------->\n        @case (DecoratorTypes.HAS_MANY) {\n            <div class=\"hasMany\">\n                <h2 class=\"title\">{{metadataHasMany.tableData.baseData.title}}</h2>\n                <div class=\"grid grid-cols-12\" style=\"column-gap: 24px;\">\n                    <mat-form-field class=\"lg:col-span-8 md:col-span-6 col-span-12\">\n                        <mat-label>{{metadataHasMany.tableData.baseData.searchLabel}}</mat-label>\n                        <input matInput (keyup)=\"applyHasManyFilter($event)\">\n                    </mat-form-field>\n                    @if (metadataHasMany.tableData.baseData.tableActions.length) {\n                        <div\n                            [class.lg:col-span-2]=\"hasManyAllowCreate\"\n                            [class.lg:col-span-4]=\"!hasManyAllowCreate\"\n                            [class.md:col-span-3]=\"hasManyAllowCreate\"\n                            [class.md:col-span-6]=\"!hasManyAllowCreate\"\n                            [class.col-span-6]=\"hasManyAllowCreate\"\n                            [class.col-span-12]=\"!hasManyAllowCreate\"\n                        >\n                            <button type=\"button\" class=\"actions-button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                                {{metadataHasMany.tableData.baseData.tableActionsLabel}}\n                            </button>\n                        </div>\n                    }\n                    <mat-menu #menu=\"matMenu\">\n                        @if (metadataHasMany.tableData.baseData.allowJsonImport) {\n                            <button type=\"button\" mat-menu-item [disabled]=\"hasManyTableActionDisabled(hasManyImportAction)\" (click)=\"runHasManyTableAction(hasManyImportAction)\">\n                                {{hasManyImportAction.displayName}}\n                            </button>\n                        }\n                        @for (action of metadataHasMany.tableData.baseData.tableActions; track $index) {\n                            <button type=\"button\" mat-menu-item [disabled]=\"hasManyTableActionDisabled(action)\" (click)=\"runHasManyTableAction(action)\">\n                                {{action.displayName}}\n                            </button>\n                        }\n                    </mat-menu>\n                    @if (hasManyAllowCreate) {\n                        <div\n                            [class.lg:col-span-2]=\"metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.lg:col-span-4]=\"!metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.md:col-span-3]=\"metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.md:col-span-6]=\"!metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.col-span-6]=\"metadataHasMany.tableData.baseData.tableActions.length\"\n                            [class.col-span-12]=\"!metadataHasMany.tableData.baseData.tableActions.length\"\n                        >\n                            <button type=\"button\" class=\"create-button\" mat-raised-button (click)=\"createHasManyEntity()\">\n                                {{metadataHasMany.tableData.baseData.createButtonLabel}}\n                            </button>\n                        </div>\n                    }\n                </div>\n        \n                <div class=\"mat-elevation-z8 elevation-container\">\n                    @if (hasManyTableContext) {\n                        <ng-container *ngTemplateOutlet=\"table; context: hasManyTableContext\"></ng-container>\n                    }\n                </div>\n            </div>\n        }\n        \n        @default {\n            <div>ERROR: The type {{type}} is not known.</div>\n        }\n    }\n}\n\n\n<ng-template #table let-context>\n    <mat-table matSort [dataSource]=\"context.dataSource\" [class.table-with-error-slot]=\"context.shouldShowMissingError\">\n        <!-- select Column -->\n        <ng-container matColumnDef=\"select\">\n            <mat-header-cell *matHeaderCellDef>\n                <mat-checkbox [checked]=\"context.selection.hasValue() && SelectionUtilities.isAllSelected(context.selection, context.dataSource)\"\n                    [indeterminate]=\"context.selection.hasValue() && !SelectionUtilities.isAllSelected(context.selection, context.dataSource)\"\n                    (change)=\"$event ? SelectionUtilities.masterToggle(context.selection, context.dataSource) : null\">\n                </mat-checkbox>\n            </mat-header-cell>\n            <mat-cell *matCellDef=\"let value\" [dynamicStyleClasses]=\"context.dynamicRowStyleClasses\" [value]=\"value\">\n                <mat-checkbox [checked]=\"context.selection.isSelected(value)\"\n                    (click)=\"$event.stopPropagation()\"\n                    (change)=\"$event ? context.selection.toggle(value) : null\">\n                </mat-checkbox>\n            </mat-cell>\n        </ng-container>\n\n        @for (dCol of context.displayColumns; track $index) {\n            <ng-container [matColumnDef]=\"dCol.displayName\">\n                <mat-header-cell *matHeaderCellDef mat-sort-header>\n                    {{dCol.displayName}}\n                </mat-header-cell>\n                <mat-cell *matCellDef=\"let value\" [class.enabled]=\"!dCol.disableClick && context.allowClick(value)\"\n                    [dynamicStyleClasses]=\"context.dynamicRowStyleClasses\" [value]=\"value\"\n                    (click)=\"clickCell(value, dCol, context)\"\n                >\n                    @if (dCol.Component) {\n                        <display-column-value [entity]=\"value\" [ComponentClass]=\"dCol.Component\"></display-column-value>\n                    }\n                    @else {\n                        {{getDisplayColumnValue(value, dCol)}}\n                    }\n                </mat-cell>\n            </ng-container>\n        }\n\n        <mat-header-row *matHeaderRowDef=\"context.displayedColumns\"></mat-header-row>\n        <mat-row *matRowDef=\"let row; columns: context.displayedColumns\"></mat-row>\n    </mat-table>\n\n    @if (context.displayLoadingSpinner && context.isLoading) {\n        <mat-spinner>\n        </mat-spinner>\n    }\n    @else if (context.shouldShowMissingError && !context.dataSource.data.length) {\n        <div class=\"table-error\">{{context.emptyErrorMessage}}</div>\n    }\n\n    <mat-paginator [length]=\"context.dataSource.filteredData.length\" [pageIndex]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 50]\"></mat-paginator>\n</ng-template>\n\n<!--------------------------------------------------------->\n<!---------------------------Form-------------------------->\n<!--------------------------------------------------------->\n<ng-template #form let-context>\n     <!-- eslint-disable angular/no-call-expression -->\n    @if (context.tabs.length > 1) {\n        <mat-tab-group preserveContent>\n            @for (tab of context.tabs; track $index) {\n                <mat-tab [label]=\"tab.tabName\">\n                    @for (row of tab.rows; track $index) {\n                        <div class=\"grid grid-cols-12\" style=\"column-gap: 24px;\">\n                            @for (key of row.keys; track key) {\n                                <ngx-mat-entity-input\n                                    [entity]=\"context.entity\"\n                                    [propertyKey]=\"key\"\n                                    [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                                    [validEmpty]=\"context.validEmpty?.()\"\n                                    [isReadOnly]=\"context.isReadOnly?.(context.entity, key)\"\n                                    [class]=\"EntityUtilities.getWidthClasses(context.entity, key)\"\n                                    [hideOmitForEdit]=\"context.hideOmitForEdit\"\n                                    [hideOmitForCreate]=\"context.hideOmitForCreate\"\n                                    (inputChangeEvent)=\"context.inputChangeEvent()\"\n                                >\n                                </ngx-mat-entity-input>\n                            }\n                        </div>\n                    }\n                </mat-tab>\n            }\n        </mat-tab-group>\n    }\n    @else {\n        @if (!context.tabs.length) {\n            <span class=\"no-entity-tabs\">\n                ERROR: No Inputs. Did you correctly assign all values in the model constructor?\n            </span>\n        }\n        @else {\n            @for (row of context.tabs[0].rows; track $index) {\n                <div class=\"grid grid-cols-12\" style=\"column-gap: 24px;\">\n                    @for (key of row.keys; track key) {\n                        <ngx-mat-entity-input\n                            [entity]=\"context.entity\"\n                            [propertyKey]=\"key\"\n                            [getValidationErrorMessage]=\"internalGetValidationErrorMessage\"\n                            [validEmpty]=\"context.validEmpty?.()\"\n                            [isReadOnly]=\"context.isReadOnly?.(context.entity, key)\"\n                            [class]=\"EntityUtilities.getWidthClasses(context.entity, key)\"\n                            [hideOmitForEdit]=\"context.hideOmitForEdit\"\n                            [hideOmitForCreate]=\"context.hideOmitForCreate\"\n                            (inputChangeEvent)=\"context.inputChangeEvent()\"\n                        >\n                        </ngx-mat-entity-input>\n                    }\n                </div>\n            }\n        }\n    }\n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Add Array Item Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #addArrayItemDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{addArrayItemDialogData.title}}</div>\n    </div>\n\n    <form (ngSubmit)=\"addArrayItem()\">\n        <mat-dialog-content>\n            @if (addArrayItemFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: addArrayItemFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n    \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [disabled]=\"!isArrayItemValid\"\n                    [matBadge]=\"arrayItemValidationErrors.length\"\n                    [matBadgeHidden]=\"!arrayItemValidationErrors.length\"\n                >\n                    {{addArrayItemDialogData.createButtonLabel}}\n                </button>\n                @if (arrayItemValidationErrors.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"arrayItemTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"closeAddArrayItemDialog()\">\n                {{addArrayItemDialogData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n\n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Edit Array Item Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #editArrayItemDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{editArrayItemDialogData.title(arrayItemPriorChanges)}}</div>\n    </div>\n    \n    <form (ngSubmit)=\"saveArrayItem()\">\n        <mat-dialog-content>\n            @if (editArrayItemFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: editArrayItemFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n        \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [class.badge-changes]=\"!arrayItemValidationErrors.length\"\n                    [disabled]=\"internalIsReadOnly || !isArrayItemValid || !isArrayItemDirty\"\n                    [matBadge]=\"arrayItemValidationErrors.length > 0 ? arrayItemValidationErrors.length : arrayItemChanges.length\"\n                    [matBadgeHidden]=\"!arrayItemValidationErrors.length && !arrayItemChanges.length\"\n                >\n                    {{editArrayItemDialogData.confirmButtonLabel}}\n                </button>\n                @if (arrayItemValidationErrors.length || arrayItemChanges.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"arrayItemTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"closeEditArrayItemDialog()\">\n                {{editArrayItemDialogData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Create Has Many Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #createHasManyDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{metadataHasMany.tableData.createData.title}}</div>\n    </div>\n    \n    <form (ngSubmit)=\"dialogCreateHasMany()\">\n        <mat-dialog-content>\n            @if (hasManyCreateFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: hasManyCreateFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n        \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [disabled]=\"!isHasManyEntityValid\"\n                    [matBadge]=\"hasManyValidationErrors.length\"\n                    [matBadgeHidden]=\"!hasManyValidationErrors.length\"\n                >\n                    {{metadataHasMany.tableData.createData.createButtonLabel}}\n                </button>\n                @if (hasManyValidationErrors.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"hasManyTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"dialogCancelCreateHasMany()\">\n                {{metadataHasMany.tableData.createData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n    \n</ng-template>\n\n<!--------------------------------------------------------->\n<!--------------------Edit Has Many Dialog----------------->\n<!--------------------------------------------------------->\n<ng-template #editHasManyDialog>\n    <div class=\"mat-dialog-title\">\n        <div>{{metadataHasMany.tableData.editData.title(hasManyEntityPriorChanges)}}</div>\n\n        <div class=\"actions-container\">\n            @if (metadataHasMany.tableData.editData.actions.length) {\n                <button type=\"button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                    {{metadataHasMany.tableData.editData.actionsLabel}}\n                </button>\n            }\n            <mat-menu #menu=\"matMenu\">\n                @for (action of metadataHasMany.tableData.editData.actions; track $index) {\n                    <button type=\"button\" mat-menu-item [disabled]=\"hasManyEditActionDisabled(action)\" (click)=\"hasManyRunEditAction(action)\">\n                        {{action.displayName}}\n                    </button>\n                }\n            </mat-menu>\n        \n            @if (hasManyAllowDelete(hasManyEntity)) {\n                <button type=\"button\" mat-raised-button color=\"warn\" class=\"delete-button\" tabindex=\"-1\" (click)=\"deleteHasManyEntity()\">\n                    {{metadataHasMany.tableData.editData.deleteButtonLabel}}\n                </button>\n            }\n        </div>\n    </div>\n    \n    <form (ngSubmit)=\"dialogEditHasMany()\">\n        <mat-dialog-content>\n            @if (hasManyEditFormContext) {\n                <ng-container *ngTemplateOutlet=\"form; context: hasManyEditFormContext\"></ng-container>\n            }\n        </mat-dialog-content>\n        \n        <mat-dialog-actions>\n            <div class=\"dialog-button-with-info-icon\">\n                <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                    [class.badge-changes]=\"!hasManyValidationErrors.length\"\n                    [disabled]=\"internalIsReadOnly || !isHasManyEntityValid || !isHasManyEntityDirty\"\n                    [matBadge]=\"hasManyValidationErrors.length > 0 ? hasManyValidationErrors.length : hasManyChanges.length\"\n                    [matBadgeHidden]=\"!hasManyValidationErrors.length && !hasManyChanges.length\"\n                >\n                    {{metadataHasMany.tableData.editData.confirmButtonLabel}}\n                </button>\n                @if (hasManyValidationErrors.length || hasManyChanges.length) {\n                    <ngx-mat-entity-tooltip [tooltipContent]=\"hasManyTooltipContent\"></ngx-mat-entity-tooltip>\n                }\n            </div>\n            <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"dialogCancelEditHasMany()\">\n                {{metadataHasMany.tableData.editData.cancelButtonLabel}}\n            </button>\n        </mat-dialog-actions>\n    </form>\n</ng-template>", styles: ["::ng-deep mat-tab-body{padding-top:10px;padding-left:12px;padding-right:12px}::ng-deep mat-tab-body .mat-mdc-tab-body-content{overflow:initial}::ng-deep .mat-mdc-tab-body-wrapper{margin-left:-12px;margin-right:-12px}::ng-deep .mat-mdc-form-field-has-icon-suffix .mat-mdc-text-field-wrapper{padding-right:16px}::ng-deep .select-search-input{width:100%;margin-top:-8px;margin-bottom:8px}::ng-deep .select-search-input .mat-mdc-form-field-subscript-wrapper{display:none}::ng-deep .mat-mdc-form-field.mat-form-field-disabled label{color:#0009}::ng-deep .mat-mdc-form-field.mat-form-field-disabled input,::ng-deep .mat-mdc-form-field.mat-form-field-disabled textarea,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-select-disabled,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-select-value{color:#000!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#707070}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[disabled]:checked~.mdc-checkbox__background,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[disabled]:indeterminate~.mdc-checkbox__background,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-checkbox .mdc-checkbox__native-control[data-indeterminate=true][disabled]~.mdc-checkbox__background{background-color:#000}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-chip.mat-mdc-standard-chip.mat-mdc-chip-disabled{opacity:1}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-chip.mat-mdc-standard-chip.mat-mdc-chip-disabled button{opacity:.2}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--selected:disabled .mdc-switch__icons,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--unselected:disabled .mdc-switch__icons{opacity:1}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--selected:disabled .mdc-switch__handle:after,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--unselected:disabled .mdc-switch__handle:after{opacity:1;background:#000}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--selected:disabled .mdc-switch__track,::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mdc-switch.mdc-switch--unselected:disabled .mdc-switch__track{opacity:.3}::ng-deep .mat-mdc-form-field.mat-form-field-disabled .mat-date-range-input-inner:disabled{color:#000}::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled{opacity:1}::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled .mdc-slider__input{cursor:default}::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled mat-slider-visual-thumb .mat-mdc-slider,::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled mat-slider-visual-thumb .mdc-slider__thumb:hover,::ng-deep #slider.mat-mdc-slider.mdc-slider--disabled mat-slider-visual-thumb .mdc-slider__thumb-knob{background-color:#000;border-color:#000}::ng-deep .mat-mdc-form-field .mat-mdc-slide-toggle{opacity:1}::ng-deep .badge-changes .mat-badge-content{background-color:orange;color:#fff}mat-spinner{margin:10px auto}.mdc-data-table__row:last-child .mdc-data-table__cell{border-bottom:1px solid rgba(0,0,0,.12)}mat-paginator{padding-top:10px;padding-bottom:10px}.dialog-button-with-info-icon{margin-top:10px;gap:12px;display:flex;align-items:center}.actions-container{display:flex;gap:10px}.w-full{width:100%}.table-with-error-slot{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:5px}.mat-column-select{flex:0 0 48px;padding-left:0;padding-right:0;justify-content:center}.enabled:hover{cursor:pointer}.table-error{display:flex;align-items:center;justify-content:center;margin-top:-6px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:fit-content;padding-left:4px;padding-right:4px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.entityArray .elevation-container{border-radius:5px;padding:15px 15px 0;margin-bottom:15px;margin-top:15px}.entityArray .array-headline{padding-bottom:10px}.entityArray .buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px;flex-wrap:wrap;gap:10px}.entityArray .buttons button{flex-grow:1}.hasMany button{width:100%;height:56px;line-height:24px;font-size:16px}.hasMany .title{text-align:center}.hasMany .elevation-container{margin-bottom:15px}\n", "::ng-deep .mdc-dialog .mdc-dialog__content{padding:6px 20px!important}mat-dialog-actions{justify-content:space-between;align-items:center;padding-left:20px;padding-right:20px}.mat-dialog-title{padding:12px 20px;display:flex;justify-content:space-between;align-items:center}.mat-dialog-title div{font-size:var(--mdc-dialog-subhead-size, 14px);font-weight:var(--mdc-dialog-subhead-weight, 500)}\n", ".grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.grid{display:grid}@media (min-width: 1024px){.lg\\:col-span-12{grid-column:span 12/span 12!important}.lg\\:col-span-11{grid-column:span 11/span 11!important}.lg\\:col-span-10{grid-column:span 10/span 10!important}.lg\\:col-span-9{grid-column:span 9/span 9!important}.lg\\:col-span-8{grid-column:span 8/span 8!important}.lg\\:col-span-7{grid-column:span 7/span 7!important}.lg\\:col-span-6{grid-column:span 6/span 6!important}.lg\\:col-span-5{grid-column:span 5/span 5!important}.lg\\:col-span-4{grid-column:span 4/span 4!important}.lg\\:col-span-3{grid-column:span 3/span 3!important}.lg\\:col-span-2{grid-column:span 2/span 2!important}.lg\\:col-span-1{grid-column:span 1/span 1!important}}@media (min-width: 768px) and (max-width: 1023px){.md\\:col-span-12{grid-column:span 12/span 12!important}.md\\:col-span-11{grid-column:span 11/span 11!important}.md\\:col-span-10{grid-column:span 10/span 10!important}.md\\:col-span-9{grid-column:span 9/span 9!important}.md\\:col-span-8{grid-column:span 8/span 8!important}.md\\:col-span-7{grid-column:span 7/span 7!important}.md\\:col-span-6{grid-column:span 6/span 6!important}.md\\:col-span-5{grid-column:span 5/span 5!important}.md\\:col-span-4{grid-column:span 4/span 4!important}.md\\:col-span-3{grid-column:span 3/span 3!important}.md\\:col-span-2{grid-column:span 2/span 2!important}.md\\:col-span-1{grid-column:span 1/span 1!important}}.col-span-12{grid-column:span 12/span 12}.col-span-11{grid-column:span 11/span 11}.col-span-10{grid-column:span 10/span 10}.col-span-9{grid-column:span 9/span 9}.col-span-8{grid-column:span 8/span 8}.col-span-7{grid-column:span 7/span 7}.col-span-6{grid-column:span 6/span 6}.col-span-5{grid-column:span 5/span 5}.col-span-4{grid-column:span 4/span 4}.col-span-3{grid-column:span 3/span 3}.col-span-2{grid-column:span 2/span 2}.col-span-1{grid-column:span 1/span 1}\n"] }]
         }], ctorParameters: () => [{ type: i1.MatDialog }, { type: i0.EnvironmentInjector }, { type: i2$6.Router }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [NGX_GET_VALIDATION_ERROR_MESSAGE]
@@ -7375,7 +7379,7 @@ class NgxMatEntityCreatePageComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgxMatEntityCreatePageComponent, deps: [{ token: i1.MatDialog }, { token: i2$7.Location }, { token: i0.EnvironmentInjector }, { token: NGX_CREATE_DATA_ENTITY_SERVICE }, { token: NGX_CREATE_DATA_ENTITY }, { token: NGX_CREATE_DATA }, { token: i2$1.HttpClient }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: NGX_COMPLETE_GLOBAL_DEFAULT_VALUES }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.7", type: NgxMatEntityCreatePageComponent, isStandalone: true, selector: "ngx-mat-entity-create-page", host: { listeners: { "window:beforeunload": "canDeactivate()", "window:scroll": "checkOffset()" } }, ngImport: i0, template: "@if (!isLoaded && data.displayLoadingSpinner) {\n    <div class=\"page-container\">\n        <br>\n        <mat-spinner></mat-spinner>\n        <br>\n    </div>\n}\n\n@if (isLoaded) {\n    <div class=\"page-container\">\n        <br>\n    \n        <!------------>\n        <!-- Header -->\n        <!------------>\n        <div class=\"header\">\n            <div class=\"cancel-container\">\n                <button type=\"button\" mat-raised-button class=\"back-button\" tabindex=\"-1\" [class.unsavedChanges]=\"hasUnsavedChanges\" (click)=\"navigateBack()\">\n                    <fa-icon [icon]=\"faChevronLeft\"></fa-icon>\n                    {{data.createData.cancelButtonLabel}}\n                    @if (hasUnsavedChanges) {\n                        <fa-icon style=\"color: orange;\" [icon]=\"faWarning\"></fa-icon>\n                    }\n                </button>\n            </div>\n        </div>\n    \n        <h1>{{data.createData.title}}</h1>\n    \n        <!----------->\n        <!-- Input -->\n        <!----------->\n        <form>\n            <ngx-mat-entity-form [hideOmitForCreate]=\"true\" [entity]=\"entity\" (selectedTabChange)=\"checkOffset()\" (formChange)=\"checkEntity()\">\n            </ngx-mat-entity-form>\n    \n            <div class=\"bottom-row-container\">\n                <div class=\"bottom-row container\">\n                    <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                        [disabled]=\"!isEntityValid || !isEntityDirty\"\n                        [matBadge]=\"validationErrors.length\"\n                        [matBadgeHidden]=\"!validationErrors.length\"\n                        (click)=\"create()\"\n                    >\n                        {{data.createData.createButtonLabel}}\n                    </button>\n                    @if (validationErrors.length) {\n                        <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n                    }\n                </div>\n            </div>\n        </form>\n    \n        <br>\n    </div>\n}", styles: ["h1{text-align:center}mat-spinner{margin:10px auto}.page-container{width:100%;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}@media (min-width: 640px){.page-container{max-width:640px}}@media (min-width: 768px){.page-container{max-width:768px}}@media (min-width: 1024px){.page-container{max-width:1024px}}@media (min-width: 1280px){.page-container{max-width:1280px}}@media (min-width: 1536px){.page-container{max-width:1536px}}.bottom-row{display:flex;align-items:center;margin-top:10px;column-gap:10px}.fixed{position:fixed;bottom:0;left:0;right:0;width:100%;z-index:1000;padding:8px 20px;background-color:#fff}.header{display:flex;margin-bottom:5px;gap:10px;flex-wrap:wrap}.header button{min-width:150px}.header .cancel-container{display:flex;justify-content:flex-start;align-items:center;column-gap:10px;width:calc(50% - 10px)}.unsavedChanges{background-color:#ffe48d}@media (max-width: 800px){.header{margin-bottom:10px;gap:15px}.header button{min-width:0px;width:50%}.header .cancel-container{width:100%;gap:15px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i5.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i10.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: TooltipComponent, selector: "ngx-mat-entity-tooltip", inputs: ["tooltipContent"] }, { kind: "component", type: NgxMatEntityFormComponent, selector: "ngx-mat-entity-form", inputs: ["entity", "isEntityReadOnly", "hideOmitForCreate", "hideOmitForEdit", "additionalOmitKeys"], outputs: ["formChange", "selectedTabChange"] }, { kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.7", type: NgxMatEntityCreatePageComponent, isStandalone: true, selector: "ngx-mat-entity-create-page", host: { listeners: { "window:beforeunload": "canDeactivate()", "window:scroll": "checkOffset()" } }, ngImport: i0, template: "@if (!isLoaded && data.displayLoadingSpinner) {\n    <div class=\"page-container\">\n        <br>\n        <mat-spinner></mat-spinner>\n        <br>\n    </div>\n}\n\n@if (isLoaded) {\n    <div class=\"page-container\">\n        <br>\n    \n        <!------------>\n        <!-- Header -->\n        <!------------>\n        <div class=\"header\">\n            <div class=\"cancel-container\">\n                <button type=\"button\" mat-raised-button class=\"back-button\" tabindex=\"-1\" [class.unsavedChanges]=\"hasUnsavedChanges\" (click)=\"navigateBack()\">\n                    <fa-icon [icon]=\"faChevronLeft\"></fa-icon>\n                    {{data.createData.cancelButtonLabel}}\n                    @if (hasUnsavedChanges) {\n                        <fa-icon style=\"color: orange;\" [icon]=\"faWarning\"></fa-icon>\n                    }\n                </button>\n            </div>\n        </div>\n    \n        <h1>{{data.createData.title}}</h1>\n    \n        <!----------->\n        <!-- Input -->\n        <!----------->\n        <form (ngSubmit)=\"create()\">\n            <ngx-mat-entity-form [hideOmitForCreate]=\"true\" [entity]=\"entity\" (selectedTabChange)=\"checkOffset()\" (formChange)=\"checkEntity()\">\n            </ngx-mat-entity-form>\n    \n            <div class=\"bottom-row-container\">\n                <div class=\"bottom-row container\">\n                    <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                        [disabled]=\"!isEntityValid || !isEntityDirty\"\n                        [matBadge]=\"validationErrors.length\"\n                        [matBadgeHidden]=\"!validationErrors.length\"\n                    >\n                        {{data.createData.createButtonLabel}}\n                    </button>\n                    @if (validationErrors.length) {\n                        <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n                    }\n                </div>\n            </div>\n        </form>\n    \n        <br>\n    </div>\n}", styles: ["h1{text-align:center}mat-spinner{margin:10px auto}.page-container{width:100%;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}@media (min-width: 640px){.page-container{max-width:640px}}@media (min-width: 768px){.page-container{max-width:768px}}@media (min-width: 1024px){.page-container{max-width:1024px}}@media (min-width: 1280px){.page-container{max-width:1280px}}@media (min-width: 1536px){.page-container{max-width:1536px}}.bottom-row{display:flex;align-items:center;margin-top:10px;column-gap:10px}.fixed{position:fixed;bottom:0;left:0;right:0;width:100%;z-index:1000;padding:8px 20px;background-color:#fff}.header{display:flex;margin-bottom:5px;gap:10px;flex-wrap:wrap}.header button{min-width:150px}.header .cancel-container{display:flex;justify-content:flex-start;align-items:center;column-gap:10px;width:calc(50% - 10px)}.unsavedChanges{background-color:#ffe48d}@media (max-width: 800px){.header{margin-bottom:10px;gap:15px}.header button{min-width:0px;width:50%}.header .cancel-container{width:100%;gap:15px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i5.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i10.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: TooltipComponent, selector: "ngx-mat-entity-tooltip", inputs: ["tooltipContent"] }, { kind: "component", type: NgxMatEntityFormComponent, selector: "ngx-mat-entity-form", inputs: ["entity", "isEntityReadOnly", "hideOmitForCreate", "hideOmitForEdit", "additionalOmitKeys"], outputs: ["formChange", "selectedTabChange"] }, { kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgxMatEntityCreatePageComponent, decorators: [{
             type: Component,
@@ -7386,8 +7390,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.7", ngImpor
                         MatBadgeModule,
                         TooltipComponent,
                         NgxMatEntityFormComponent,
-                        FaIconComponent
-                    ], template: "@if (!isLoaded && data.displayLoadingSpinner) {\n    <div class=\"page-container\">\n        <br>\n        <mat-spinner></mat-spinner>\n        <br>\n    </div>\n}\n\n@if (isLoaded) {\n    <div class=\"page-container\">\n        <br>\n    \n        <!------------>\n        <!-- Header -->\n        <!------------>\n        <div class=\"header\">\n            <div class=\"cancel-container\">\n                <button type=\"button\" mat-raised-button class=\"back-button\" tabindex=\"-1\" [class.unsavedChanges]=\"hasUnsavedChanges\" (click)=\"navigateBack()\">\n                    <fa-icon [icon]=\"faChevronLeft\"></fa-icon>\n                    {{data.createData.cancelButtonLabel}}\n                    @if (hasUnsavedChanges) {\n                        <fa-icon style=\"color: orange;\" [icon]=\"faWarning\"></fa-icon>\n                    }\n                </button>\n            </div>\n        </div>\n    \n        <h1>{{data.createData.title}}</h1>\n    \n        <!----------->\n        <!-- Input -->\n        <!----------->\n        <form>\n            <ngx-mat-entity-form [hideOmitForCreate]=\"true\" [entity]=\"entity\" (selectedTabChange)=\"checkOffset()\" (formChange)=\"checkEntity()\">\n            </ngx-mat-entity-form>\n    \n            <div class=\"bottom-row-container\">\n                <div class=\"bottom-row container\">\n                    <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                        [disabled]=\"!isEntityValid || !isEntityDirty\"\n                        [matBadge]=\"validationErrors.length\"\n                        [matBadgeHidden]=\"!validationErrors.length\"\n                        (click)=\"create()\"\n                    >\n                        {{data.createData.createButtonLabel}}\n                    </button>\n                    @if (validationErrors.length) {\n                        <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n                    }\n                </div>\n            </div>\n        </form>\n    \n        <br>\n    </div>\n}", styles: ["h1{text-align:center}mat-spinner{margin:10px auto}.page-container{width:100%;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}@media (min-width: 640px){.page-container{max-width:640px}}@media (min-width: 768px){.page-container{max-width:768px}}@media (min-width: 1024px){.page-container{max-width:1024px}}@media (min-width: 1280px){.page-container{max-width:1280px}}@media (min-width: 1536px){.page-container{max-width:1536px}}.bottom-row{display:flex;align-items:center;margin-top:10px;column-gap:10px}.fixed{position:fixed;bottom:0;left:0;right:0;width:100%;z-index:1000;padding:8px 20px;background-color:#fff}.header{display:flex;margin-bottom:5px;gap:10px;flex-wrap:wrap}.header button{min-width:150px}.header .cancel-container{display:flex;justify-content:flex-start;align-items:center;column-gap:10px;width:calc(50% - 10px)}.unsavedChanges{background-color:#ffe48d}@media (max-width: 800px){.header{margin-bottom:10px;gap:15px}.header button{min-width:0px;width:50%}.header .cancel-container{width:100%;gap:15px}}\n"] }]
+                        FaIconComponent,
+                        FormsModule
+                    ], template: "@if (!isLoaded && data.displayLoadingSpinner) {\n    <div class=\"page-container\">\n        <br>\n        <mat-spinner></mat-spinner>\n        <br>\n    </div>\n}\n\n@if (isLoaded) {\n    <div class=\"page-container\">\n        <br>\n    \n        <!------------>\n        <!-- Header -->\n        <!------------>\n        <div class=\"header\">\n            <div class=\"cancel-container\">\n                <button type=\"button\" mat-raised-button class=\"back-button\" tabindex=\"-1\" [class.unsavedChanges]=\"hasUnsavedChanges\" (click)=\"navigateBack()\">\n                    <fa-icon [icon]=\"faChevronLeft\"></fa-icon>\n                    {{data.createData.cancelButtonLabel}}\n                    @if (hasUnsavedChanges) {\n                        <fa-icon style=\"color: orange;\" [icon]=\"faWarning\"></fa-icon>\n                    }\n                </button>\n            </div>\n        </div>\n    \n        <h1>{{data.createData.title}}</h1>\n    \n        <!----------->\n        <!-- Input -->\n        <!----------->\n        <form (ngSubmit)=\"create()\">\n            <ngx-mat-entity-form [hideOmitForCreate]=\"true\" [entity]=\"entity\" (selectedTabChange)=\"checkOffset()\" (formChange)=\"checkEntity()\">\n            </ngx-mat-entity-form>\n    \n            <div class=\"bottom-row-container\">\n                <div class=\"bottom-row container\">\n                    <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                        [disabled]=\"!isEntityValid || !isEntityDirty\"\n                        [matBadge]=\"validationErrors.length\"\n                        [matBadgeHidden]=\"!validationErrors.length\"\n                    >\n                        {{data.createData.createButtonLabel}}\n                    </button>\n                    @if (validationErrors.length) {\n                        <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n                    }\n                </div>\n            </div>\n        </form>\n    \n        <br>\n    </div>\n}", styles: ["h1{text-align:center}mat-spinner{margin:10px auto}.page-container{width:100%;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}@media (min-width: 640px){.page-container{max-width:640px}}@media (min-width: 768px){.page-container{max-width:768px}}@media (min-width: 1024px){.page-container{max-width:1024px}}@media (min-width: 1280px){.page-container{max-width:1280px}}@media (min-width: 1536px){.page-container{max-width:1536px}}.bottom-row{display:flex;align-items:center;margin-top:10px;column-gap:10px}.fixed{position:fixed;bottom:0;left:0;right:0;width:100%;z-index:1000;padding:8px 20px;background-color:#fff}.header{display:flex;margin-bottom:5px;gap:10px;flex-wrap:wrap}.header button{min-width:150px}.header .cancel-container{display:flex;justify-content:flex-start;align-items:center;column-gap:10px;width:calc(50% - 10px)}.unsavedChanges{background-color:#ffe48d}@media (max-width: 800px){.header{margin-bottom:10px;gap:15px}.header button{min-width:0px;width:50%}.header .cancel-container{width:100%;gap:15px}}\n"] }]
         }], ctorParameters: () => [{ type: i1.MatDialog }, { type: i2$7.Location }, { type: i0.EnvironmentInjector }, { type: EntityService, decorators: [{
                     type: Inject,
                     args: [NGX_CREATE_DATA_ENTITY_SERVICE]
@@ -7747,7 +7752,7 @@ class NgxMatEntityEditPageComponent {
         return runInInjectionContext(this.injector, () => !action.enabled(this.entityPriorChanges));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgxMatEntityEditPageComponent, deps: [{ token: i1.MatDialog }, { token: i2$7.Location }, { token: i2$6.ActivatedRoute }, { token: i0.EnvironmentInjector }, { token: NGX_EDIT_DATA_ENTITY_SERVICE }, { token: NGX_EDIT_DATA_ENTITY }, { token: NGX_EDIT_DATA }, { token: i2$1.HttpClient }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: NGX_COMPLETE_GLOBAL_DEFAULT_VALUES }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.7", type: NgxMatEntityEditPageComponent, isStandalone: true, selector: "ngx-mat-entity-edit-page", host: { listeners: { "window:scroll": "checkOffset()", "window:beforeunload": "canDeactivate()" } }, ngImport: i0, template: " \n<!-- eslint-disable angular/no-call-expression -->\n@if (!isLoaded && data.displayLoadingSpinner) {\n    <div class=\"page-container\">\n        <br>\n        <mat-spinner></mat-spinner>\n        <br>\n    </div>\n}\n\n@if (isLoaded) {\n    <div class=\"page-container\">\n        <br>\n    \n        <!------------>\n        <!-- Header -->\n        <!------------>\n        <div class=\"header\">\n            <div class=\"cancel-container\">\n                <button type=\"button\" mat-raised-button class=\"back-button\" tabindex=\"-1\" [class.unsavedChanges]=\"hasUnsavedChanges\" (click)=\"navigateBack()\">\n                    <fa-icon [icon]=\"faChevronLeft\"></fa-icon>\n                    {{data.editData.cancelButtonLabel}}\n                    @if (hasUnsavedChanges) {\n                        <fa-icon style=\"color: orange;\" [icon]=\"faWarning\"></fa-icon>\n                    }\n                </button>\n            </div>\n            <div class=\"actions-container\">\n                @if (data.editData.actions.length) {\n                    <button type=\"button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                        {{data.editData.actionsLabel}}\n                    </button>\n                }\n                <mat-menu #menu=\"matMenu\">\n                    @for (action of data.editData.actions; track $index) {\n                        <button type=\"button\" mat-menu-item [disabled]=\"editActionDisabled(action)\" (click)=\"runEditAction(action)\">\n                            {{action.displayName}}\n                        </button>\n                    }\n                </mat-menu>\n            \n                @if (allowDelete) {\n                    <button type=\"button\" mat-raised-button color=\"warn\" class=\"delete-button\" tabindex=\"-1\" (click)=\"delete()\">\n                        {{data.editData.deleteButtonLabel}}\n                    </button>\n                }\n            </div>\n        </div>\n    \n        <h1>{{data.editData.title(entityPriorChanges)}}</h1>\n    \n        <!----------->\n        <!-- Input -->\n        <!----------->\n        <form>\n            <ngx-mat-entity-form [hideOmitForEdit]=\"true\" [isEntityReadOnly]=\"isEntityReadOnly\" [entity]=\"entity\" (selectedTabChange)=\"checkOffset()\" (formChange)=\"checkEntity()\">\n            </ngx-mat-entity-form>\n    \n            <div class=\"bottom-row-container\">\n                <div class=\"bottom-row container\">\n                    <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                        [class.badge-changes]=\"!validationErrors.length\"\n                        [disabled]=\"isEntityReadOnly || !isEntityValid || !isEntityDirty\"\n                        [matBadge]=\"validationErrors.length > 0 ? validationErrors.length : changes.length\"\n                        [matBadgeHidden]=\"!validationErrors.length && !changes.length\"\n                        (click)=\"edit()\"\n                    >\n                        {{data.editData.confirmButtonLabel}}\n                    </button>\n                    @if (validationErrors.length || changes.length) {\n                        <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n                    }\n                </div>\n            </div>\n        </form>\n        <br>\n    </div>\n}", styles: ["::ng-deep .badge-changes .mat-badge-content{background-color:orange;color:#fff}h1{text-align:center}mat-spinner{margin:10px auto}.page-container{width:100%;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}@media (min-width: 640px){.page-container{max-width:640px}}@media (min-width: 768px){.page-container{max-width:768px}}@media (min-width: 1024px){.page-container{max-width:1024px}}@media (min-width: 1280px){.page-container{max-width:1280px}}@media (min-width: 1536px){.page-container{max-width:1536px}}.bottom-row{display:flex;align-items:center;column-gap:10px;margin-top:10px}.fixed{position:fixed;bottom:0;left:0;right:0;width:100%;z-index:1000;padding:8px 20px;background-color:#fff}.header{display:flex;margin-bottom:5px;gap:10px;flex-wrap:wrap}.header button{min-width:150px}.header .cancel-container{display:flex;justify-content:flex-start;align-items:center;column-gap:10px;width:calc(50% - 10px)}.header .actions-container{display:flex;justify-content:flex-end;gap:10px;width:calc(50% - 10px)}.unsavedChanges{background-color:#ffe48d}@media (max-width: 800px){.header{margin-bottom:10px;gap:15px}.header button{min-width:0px;width:50%}.header .cancel-container,.header .actions-container{width:100%;gap:15px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i5.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i7.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i7.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i7.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i10.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: TooltipComponent, selector: "ngx-mat-entity-tooltip", inputs: ["tooltipContent"] }, { kind: "component", type: NgxMatEntityFormComponent, selector: "ngx-mat-entity-form", inputs: ["entity", "isEntityReadOnly", "hideOmitForCreate", "hideOmitForEdit", "additionalOmitKeys"], outputs: ["formChange", "selectedTabChange"] }, { kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.7", type: NgxMatEntityEditPageComponent, isStandalone: true, selector: "ngx-mat-entity-edit-page", host: { listeners: { "window:scroll": "checkOffset()", "window:beforeunload": "canDeactivate()" } }, ngImport: i0, template: " \n<!-- eslint-disable angular/no-call-expression -->\n@if (!isLoaded && data.displayLoadingSpinner) {\n    <div class=\"page-container\">\n        <br>\n        <mat-spinner></mat-spinner>\n        <br>\n    </div>\n}\n\n@if (isLoaded) {\n    <div class=\"page-container\">\n        <br>\n    \n        <!------------>\n        <!-- Header -->\n        <!------------>\n        <div class=\"header\">\n            <div class=\"cancel-container\">\n                <button type=\"button\" mat-raised-button class=\"back-button\" tabindex=\"-1\" [class.unsavedChanges]=\"hasUnsavedChanges\" (click)=\"navigateBack()\">\n                    <fa-icon [icon]=\"faChevronLeft\"></fa-icon>\n                    {{data.editData.cancelButtonLabel}}\n                    @if (hasUnsavedChanges) {\n                        <fa-icon style=\"color: orange;\" [icon]=\"faWarning\"></fa-icon>\n                    }\n                </button>\n            </div>\n            <div class=\"actions-container\">\n                @if (data.editData.actions.length) {\n                    <button type=\"button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                        {{data.editData.actionsLabel}}\n                    </button>\n                }\n                <mat-menu #menu=\"matMenu\">\n                    @for (action of data.editData.actions; track $index) {\n                        <button type=\"button\" mat-menu-item [disabled]=\"editActionDisabled(action)\" (click)=\"runEditAction(action)\">\n                            {{action.displayName}}\n                        </button>\n                    }\n                </mat-menu>\n            \n                @if (allowDelete) {\n                    <button type=\"button\" mat-raised-button color=\"warn\" class=\"delete-button\" tabindex=\"-1\" (click)=\"delete()\">\n                        {{data.editData.deleteButtonLabel}}\n                    </button>\n                }\n            </div>\n        </div>\n    \n        <h1>{{data.editData.title(entityPriorChanges)}}</h1>\n    \n        <!----------->\n        <!-- Input -->\n        <!----------->\n        <form (ngSubmit)=\"edit()\">\n            <ngx-mat-entity-form [hideOmitForEdit]=\"true\" [isEntityReadOnly]=\"isEntityReadOnly\" [entity]=\"entity\" (selectedTabChange)=\"checkOffset()\" (formChange)=\"checkEntity()\">\n            </ngx-mat-entity-form>\n    \n            <div class=\"bottom-row-container\">\n                <div class=\"bottom-row container\">\n                    <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                        [class.badge-changes]=\"!validationErrors.length\"\n                        [disabled]=\"isEntityReadOnly || !isEntityValid || !isEntityDirty\"\n                        [matBadge]=\"validationErrors.length > 0 ? validationErrors.length : changes.length\"\n                        [matBadgeHidden]=\"!validationErrors.length && !changes.length\"\n                    >\n                        {{data.editData.confirmButtonLabel}}\n                    </button>\n                    @if (validationErrors.length || changes.length) {\n                        <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n                    }\n                </div>\n            </div>\n        </form>\n        <br>\n    </div>\n}", styles: ["::ng-deep .badge-changes .mat-badge-content{background-color:orange;color:#fff}h1{text-align:center}mat-spinner{margin:10px auto}.page-container{width:100%;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}@media (min-width: 640px){.page-container{max-width:640px}}@media (min-width: 768px){.page-container{max-width:768px}}@media (min-width: 1024px){.page-container{max-width:1024px}}@media (min-width: 1280px){.page-container{max-width:1280px}}@media (min-width: 1536px){.page-container{max-width:1536px}}.bottom-row{display:flex;align-items:center;column-gap:10px;margin-top:10px}.fixed{position:fixed;bottom:0;left:0;right:0;width:100%;z-index:1000;padding:8px 20px;background-color:#fff}.header{display:flex;margin-bottom:5px;gap:10px;flex-wrap:wrap}.header button{min-width:150px}.header .cancel-container{display:flex;justify-content:flex-start;align-items:center;column-gap:10px;width:calc(50% - 10px)}.header .actions-container{display:flex;justify-content:flex-end;gap:10px;width:calc(50% - 10px)}.unsavedChanges{background-color:#ffe48d}@media (max-width: 800px){.header{margin-bottom:10px;gap:15px}.header button{min-width:0px;width:50%}.header .cancel-container,.header .actions-container{width:100%;gap:15px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i5.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i7.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i7.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i7.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i10.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: TooltipComponent, selector: "ngx-mat-entity-tooltip", inputs: ["tooltipContent"] }, { kind: "component", type: NgxMatEntityFormComponent, selector: "ngx-mat-entity-form", inputs: ["entity", "isEntityReadOnly", "hideOmitForCreate", "hideOmitForEdit", "additionalOmitKeys"], outputs: ["formChange", "selectedTabChange"] }, { kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgxMatEntityEditPageComponent, decorators: [{
             type: Component,
@@ -7759,8 +7764,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.7", ngImpor
                         MatBadgeModule,
                         TooltipComponent,
                         NgxMatEntityFormComponent,
-                        FaIconComponent
-                    ], template: " \n<!-- eslint-disable angular/no-call-expression -->\n@if (!isLoaded && data.displayLoadingSpinner) {\n    <div class=\"page-container\">\n        <br>\n        <mat-spinner></mat-spinner>\n        <br>\n    </div>\n}\n\n@if (isLoaded) {\n    <div class=\"page-container\">\n        <br>\n    \n        <!------------>\n        <!-- Header -->\n        <!------------>\n        <div class=\"header\">\n            <div class=\"cancel-container\">\n                <button type=\"button\" mat-raised-button class=\"back-button\" tabindex=\"-1\" [class.unsavedChanges]=\"hasUnsavedChanges\" (click)=\"navigateBack()\">\n                    <fa-icon [icon]=\"faChevronLeft\"></fa-icon>\n                    {{data.editData.cancelButtonLabel}}\n                    @if (hasUnsavedChanges) {\n                        <fa-icon style=\"color: orange;\" [icon]=\"faWarning\"></fa-icon>\n                    }\n                </button>\n            </div>\n            <div class=\"actions-container\">\n                @if (data.editData.actions.length) {\n                    <button type=\"button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                        {{data.editData.actionsLabel}}\n                    </button>\n                }\n                <mat-menu #menu=\"matMenu\">\n                    @for (action of data.editData.actions; track $index) {\n                        <button type=\"button\" mat-menu-item [disabled]=\"editActionDisabled(action)\" (click)=\"runEditAction(action)\">\n                            {{action.displayName}}\n                        </button>\n                    }\n                </mat-menu>\n            \n                @if (allowDelete) {\n                    <button type=\"button\" mat-raised-button color=\"warn\" class=\"delete-button\" tabindex=\"-1\" (click)=\"delete()\">\n                        {{data.editData.deleteButtonLabel}}\n                    </button>\n                }\n            </div>\n        </div>\n    \n        <h1>{{data.editData.title(entityPriorChanges)}}</h1>\n    \n        <!----------->\n        <!-- Input -->\n        <!----------->\n        <form>\n            <ngx-mat-entity-form [hideOmitForEdit]=\"true\" [isEntityReadOnly]=\"isEntityReadOnly\" [entity]=\"entity\" (selectedTabChange)=\"checkOffset()\" (formChange)=\"checkEntity()\">\n            </ngx-mat-entity-form>\n    \n            <div class=\"bottom-row-container\">\n                <div class=\"bottom-row container\">\n                    <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                        [class.badge-changes]=\"!validationErrors.length\"\n                        [disabled]=\"isEntityReadOnly || !isEntityValid || !isEntityDirty\"\n                        [matBadge]=\"validationErrors.length > 0 ? validationErrors.length : changes.length\"\n                        [matBadgeHidden]=\"!validationErrors.length && !changes.length\"\n                        (click)=\"edit()\"\n                    >\n                        {{data.editData.confirmButtonLabel}}\n                    </button>\n                    @if (validationErrors.length || changes.length) {\n                        <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n                    }\n                </div>\n            </div>\n        </form>\n        <br>\n    </div>\n}", styles: ["::ng-deep .badge-changes .mat-badge-content{background-color:orange;color:#fff}h1{text-align:center}mat-spinner{margin:10px auto}.page-container{width:100%;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}@media (min-width: 640px){.page-container{max-width:640px}}@media (min-width: 768px){.page-container{max-width:768px}}@media (min-width: 1024px){.page-container{max-width:1024px}}@media (min-width: 1280px){.page-container{max-width:1280px}}@media (min-width: 1536px){.page-container{max-width:1536px}}.bottom-row{display:flex;align-items:center;column-gap:10px;margin-top:10px}.fixed{position:fixed;bottom:0;left:0;right:0;width:100%;z-index:1000;padding:8px 20px;background-color:#fff}.header{display:flex;margin-bottom:5px;gap:10px;flex-wrap:wrap}.header button{min-width:150px}.header .cancel-container{display:flex;justify-content:flex-start;align-items:center;column-gap:10px;width:calc(50% - 10px)}.header .actions-container{display:flex;justify-content:flex-end;gap:10px;width:calc(50% - 10px)}.unsavedChanges{background-color:#ffe48d}@media (max-width: 800px){.header{margin-bottom:10px;gap:15px}.header button{min-width:0px;width:50%}.header .cancel-container,.header .actions-container{width:100%;gap:15px}}\n"] }]
+                        FaIconComponent,
+                        FormsModule
+                    ], template: " \n<!-- eslint-disable angular/no-call-expression -->\n@if (!isLoaded && data.displayLoadingSpinner) {\n    <div class=\"page-container\">\n        <br>\n        <mat-spinner></mat-spinner>\n        <br>\n    </div>\n}\n\n@if (isLoaded) {\n    <div class=\"page-container\">\n        <br>\n    \n        <!------------>\n        <!-- Header -->\n        <!------------>\n        <div class=\"header\">\n            <div class=\"cancel-container\">\n                <button type=\"button\" mat-raised-button class=\"back-button\" tabindex=\"-1\" [class.unsavedChanges]=\"hasUnsavedChanges\" (click)=\"navigateBack()\">\n                    <fa-icon [icon]=\"faChevronLeft\"></fa-icon>\n                    {{data.editData.cancelButtonLabel}}\n                    @if (hasUnsavedChanges) {\n                        <fa-icon style=\"color: orange;\" [icon]=\"faWarning\"></fa-icon>\n                    }\n                </button>\n            </div>\n            <div class=\"actions-container\">\n                @if (data.editData.actions.length) {\n                    <button type=\"button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                        {{data.editData.actionsLabel}}\n                    </button>\n                }\n                <mat-menu #menu=\"matMenu\">\n                    @for (action of data.editData.actions; track $index) {\n                        <button type=\"button\" mat-menu-item [disabled]=\"editActionDisabled(action)\" (click)=\"runEditAction(action)\">\n                            {{action.displayName}}\n                        </button>\n                    }\n                </mat-menu>\n            \n                @if (allowDelete) {\n                    <button type=\"button\" mat-raised-button color=\"warn\" class=\"delete-button\" tabindex=\"-1\" (click)=\"delete()\">\n                        {{data.editData.deleteButtonLabel}}\n                    </button>\n                }\n            </div>\n        </div>\n    \n        <h1>{{data.editData.title(entityPriorChanges)}}</h1>\n    \n        <!----------->\n        <!-- Input -->\n        <!----------->\n        <form (ngSubmit)=\"edit()\">\n            <ngx-mat-entity-form [hideOmitForEdit]=\"true\" [isEntityReadOnly]=\"isEntityReadOnly\" [entity]=\"entity\" (selectedTabChange)=\"checkOffset()\" (formChange)=\"checkEntity()\">\n            </ngx-mat-entity-form>\n    \n            <div class=\"bottom-row-container\">\n                <div class=\"bottom-row container\">\n                    <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                        [class.badge-changes]=\"!validationErrors.length\"\n                        [disabled]=\"isEntityReadOnly || !isEntityValid || !isEntityDirty\"\n                        [matBadge]=\"validationErrors.length > 0 ? validationErrors.length : changes.length\"\n                        [matBadgeHidden]=\"!validationErrors.length && !changes.length\"\n                    >\n                        {{data.editData.confirmButtonLabel}}\n                    </button>\n                    @if (validationErrors.length || changes.length) {\n                        <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n                    }\n                </div>\n            </div>\n        </form>\n        <br>\n    </div>\n}", styles: ["::ng-deep .badge-changes .mat-badge-content{background-color:orange;color:#fff}h1{text-align:center}mat-spinner{margin:10px auto}.page-container{width:100%;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}@media (min-width: 640px){.page-container{max-width:640px}}@media (min-width: 768px){.page-container{max-width:768px}}@media (min-width: 1024px){.page-container{max-width:1024px}}@media (min-width: 1280px){.page-container{max-width:1280px}}@media (min-width: 1536px){.page-container{max-width:1536px}}.bottom-row{display:flex;align-items:center;column-gap:10px;margin-top:10px}.fixed{position:fixed;bottom:0;left:0;right:0;width:100%;z-index:1000;padding:8px 20px;background-color:#fff}.header{display:flex;margin-bottom:5px;gap:10px;flex-wrap:wrap}.header button{min-width:150px}.header .cancel-container{display:flex;justify-content:flex-start;align-items:center;column-gap:10px;width:calc(50% - 10px)}.header .actions-container{display:flex;justify-content:flex-end;gap:10px;width:calc(50% - 10px)}.unsavedChanges{background-color:#ffe48d}@media (max-width: 800px){.header{margin-bottom:10px;gap:15px}.header button{min-width:0px;width:50%}.header .cancel-container,.header .actions-container{width:100%;gap:15px}}\n"] }]
         }], ctorParameters: () => [{ type: i1.MatDialog }, { type: i2$7.Location }, { type: i2$6.ActivatedRoute }, { type: i0.EnvironmentInjector }, { type: EntityService, decorators: [{
                     type: Inject,
                     args: [NGX_EDIT_DATA_ENTITY_SERVICE]
@@ -7952,7 +7958,7 @@ class NgxMatEntityCreateDialogComponent {
         this.dialogRef.close();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgxMatEntityCreateDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }, { token: i0.EnvironmentInjector }, { token: i1.MatDialog }, { token: i2$1.HttpClient }, { token: NGX_COMPLETE_GLOBAL_DEFAULT_VALUES }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.7", type: NgxMatEntityCreateDialogComponent, isStandalone: true, selector: "ngx-mat-entity-create-dialog", outputs: { unsavedChanges: "unsavedChanges" }, ngImport: i0, template: "<div class=\"mat-dialog-title\">\n    <div>{{data.createData.title}}</div>\n</div>\n\n<form>\n    <mat-dialog-content>\n        <ngx-mat-entity-form [hideOmitForCreate]=\"true\" [entity]=\"data.entity\" (formChange)=\"checkIsEntityValid()\">\n        </ngx-mat-entity-form>\n    </mat-dialog-content>\n    \n    <mat-dialog-actions>\n\n        <div class=\"dialog-button-with-info-icon\">\n            <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                [disabled]=\"!isEntityValid\"\n                [matBadge]=\"validationErrors.length\"\n                [matBadgeHidden]=\"!validationErrors.length\"\n                (click)=\"create()\"\n            >\n                {{data.createData.createButtonLabel}}\n            </button>\n            @if (validationErrors.length) {\n                <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n            }\n        </div>\n\n        <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"cancel()\">\n            {{data.createData.cancelButtonLabel}}\n        </button>\n    </mat-dialog-actions>\n</form>\n", styles: [".dialog-button-with-info-icon{margin-top:10px;gap:12px;display:flex;align-items:center}\n", "::ng-deep .mdc-dialog .mdc-dialog__content{padding:6px 20px!important}mat-dialog-actions{justify-content:space-between;align-items:center;padding-left:20px;padding-right:20px}.mat-dialog-title{padding:12px 20px;display:flex;justify-content:space-between;align-items:center}.mat-dialog-title div{font-size:var(--mdc-dialog-subhead-size, 14px);font-weight:var(--mdc-dialog-subhead-weight, 500)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i10.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: TooltipComponent, selector: "ngx-mat-entity-tooltip", inputs: ["tooltipContent"] }, { kind: "component", type: NgxMatEntityFormComponent, selector: "ngx-mat-entity-form", inputs: ["entity", "isEntityReadOnly", "hideOmitForCreate", "hideOmitForEdit", "additionalOmitKeys"], outputs: ["formChange", "selectedTabChange"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.7", type: NgxMatEntityCreateDialogComponent, isStandalone: true, selector: "ngx-mat-entity-create-dialog", outputs: { unsavedChanges: "unsavedChanges" }, ngImport: i0, template: "<div class=\"mat-dialog-title\">\n    <div>{{data.createData.title}}</div>\n</div>\n\n<form (ngSubmit)=\"create()\">\n    <mat-dialog-content>\n        <ngx-mat-entity-form [hideOmitForCreate]=\"true\" [entity]=\"data.entity\" (formChange)=\"checkIsEntityValid()\">\n        </ngx-mat-entity-form>\n    </mat-dialog-content>\n    \n    <mat-dialog-actions>\n\n        <div class=\"dialog-button-with-info-icon\">\n            <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                [disabled]=\"!isEntityValid\"\n                [matBadge]=\"validationErrors.length\"\n                [matBadgeHidden]=\"!validationErrors.length\"\n            >\n                {{data.createData.createButtonLabel}}\n            </button>\n            @if (validationErrors.length) {\n                <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n            }\n        </div>\n\n        <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"cancel()\">\n            {{data.createData.cancelButtonLabel}}\n        </button>\n    </mat-dialog-actions>\n</form>\n", styles: [".dialog-button-with-info-icon{margin-top:10px;gap:12px;display:flex;align-items:center}\n", "::ng-deep .mdc-dialog .mdc-dialog__content{padding:6px 20px!important}mat-dialog-actions{justify-content:space-between;align-items:center;padding-left:20px;padding-right:20px}.mat-dialog-title{padding:12px 20px;display:flex;justify-content:space-between;align-items:center}.mat-dialog-title div{font-size:var(--mdc-dialog-subhead-size, 14px);font-weight:var(--mdc-dialog-subhead-weight, 500)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i10.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: TooltipComponent, selector: "ngx-mat-entity-tooltip", inputs: ["tooltipContent"] }, { kind: "component", type: NgxMatEntityFormComponent, selector: "ngx-mat-entity-form", inputs: ["entity", "isEntityReadOnly", "hideOmitForCreate", "hideOmitForEdit", "additionalOmitKeys"], outputs: ["formChange", "selectedTabChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgxMatEntityCreateDialogComponent, decorators: [{
             type: Component,
@@ -7962,8 +7968,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.7", ngImpor
                         MatButtonModule,
                         MatBadgeModule,
                         TooltipComponent,
-                        NgxMatEntityFormComponent
-                    ], template: "<div class=\"mat-dialog-title\">\n    <div>{{data.createData.title}}</div>\n</div>\n\n<form>\n    <mat-dialog-content>\n        <ngx-mat-entity-form [hideOmitForCreate]=\"true\" [entity]=\"data.entity\" (formChange)=\"checkIsEntityValid()\">\n        </ngx-mat-entity-form>\n    </mat-dialog-content>\n    \n    <mat-dialog-actions>\n\n        <div class=\"dialog-button-with-info-icon\">\n            <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                [disabled]=\"!isEntityValid\"\n                [matBadge]=\"validationErrors.length\"\n                [matBadgeHidden]=\"!validationErrors.length\"\n                (click)=\"create()\"\n            >\n                {{data.createData.createButtonLabel}}\n            </button>\n            @if (validationErrors.length) {\n                <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n            }\n        </div>\n\n        <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"cancel()\">\n            {{data.createData.cancelButtonLabel}}\n        </button>\n    </mat-dialog-actions>\n</form>\n", styles: [".dialog-button-with-info-icon{margin-top:10px;gap:12px;display:flex;align-items:center}\n", "::ng-deep .mdc-dialog .mdc-dialog__content{padding:6px 20px!important}mat-dialog-actions{justify-content:space-between;align-items:center;padding-left:20px;padding-right:20px}.mat-dialog-title{padding:12px 20px;display:flex;justify-content:space-between;align-items:center}.mat-dialog-title div{font-size:var(--mdc-dialog-subhead-size, 14px);font-weight:var(--mdc-dialog-subhead-weight, 500)}\n"] }]
+                        NgxMatEntityFormComponent,
+                        FormsModule
+                    ], template: "<div class=\"mat-dialog-title\">\n    <div>{{data.createData.title}}</div>\n</div>\n\n<form (ngSubmit)=\"create()\">\n    <mat-dialog-content>\n        <ngx-mat-entity-form [hideOmitForCreate]=\"true\" [entity]=\"data.entity\" (formChange)=\"checkIsEntityValid()\">\n        </ngx-mat-entity-form>\n    </mat-dialog-content>\n    \n    <mat-dialog-actions>\n\n        <div class=\"dialog-button-with-info-icon\">\n            <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                [disabled]=\"!isEntityValid\"\n                [matBadge]=\"validationErrors.length\"\n                [matBadgeHidden]=\"!validationErrors.length\"\n            >\n                {{data.createData.createButtonLabel}}\n            </button>\n            @if (validationErrors.length) {\n                <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n            }\n        </div>\n\n        <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"cancel()\">\n            {{data.createData.cancelButtonLabel}}\n        </button>\n    </mat-dialog-actions>\n</form>\n", styles: [".dialog-button-with-info-icon{margin-top:10px;gap:12px;display:flex;align-items:center}\n", "::ng-deep .mdc-dialog .mdc-dialog__content{padding:6px 20px!important}mat-dialog-actions{justify-content:space-between;align-items:center;padding-left:20px;padding-right:20px}.mat-dialog-title{padding:12px 20px;display:flex;justify-content:space-between;align-items:center}.mat-dialog-title div{font-size:var(--mdc-dialog-subhead-size, 14px);font-weight:var(--mdc-dialog-subhead-weight, 500)}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -8373,7 +8380,7 @@ class NgxMatEntityEditDialogComponent {
         return runInInjectionContext(this.injector, () => !action.enabled(this.entityPriorChanges));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgxMatEntityEditDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }, { token: i0.EnvironmentInjector }, { token: i1.MatDialog }, { token: i2$1.HttpClient }, { token: NGX_COMPLETE_GLOBAL_DEFAULT_VALUES }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.7", type: NgxMatEntityEditDialogComponent, isStandalone: true, selector: "ngx-mat-entity-edit-dialog", outputs: { unsavedChanges: "unsavedChanges" }, ngImport: i0, template: "<!-- eslint-disable angular/no-call-expression -->\n<div class=\"mat-dialog-title\">\n    <div>{{data.editData.title(entityPriorChanges)}}</div>\n\n    <div class=\"actions-container\">\n        @if (data.editData.actions.length) {\n            <button type=\"button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                {{data.editData.actionsLabel}}\n            </button>\n        }\n        <mat-menu #menu=\"matMenu\">\n            @for (action of data.editData.actions; track $index) {\n                <button type=\"button\" mat-menu-item [disabled]=\"editActionDisabled(action)\" (click)=\"runEditAction(action)\">\n                    {{action.displayName}}\n                </button>\n            }\n        </mat-menu>\n    \n        @if (allowDelete) {\n            <button type=\"button\" mat-raised-button color=\"warn\" class=\"delete-button\" tabindex=\"-1\" (click)=\"delete()\">\n                {{data.editData.deleteButtonLabel}}\n            </button>\n        }\n    </div>\n</div>\n\n<form>\n    <mat-dialog-content>\n        <ngx-mat-entity-form [hideOmitForEdit]=\"true\" [isEntityReadOnly]=\"isEntityReadOnly\" [entity]=\"data.entity\" (formChange)=\"checkEntity()\">\n        </ngx-mat-entity-form>\n    </mat-dialog-content>\n    \n    <mat-dialog-actions>\n        <div class=\"dialog-button-with-info-icon\">\n            <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                [class.badge-changes]=\"!validationErrors.length\"   \n                [disabled]=\"isEntityReadOnly || !isEntityValid || !isEntityDirty\"\n                [matBadge]=\"validationErrors.length > 0 ? validationErrors.length : changes.length\"\n                [matBadgeHidden]=\"!validationErrors.length && !changes.length\"\n                (click)=\"edit()\"\n            >\n                {{data.editData.confirmButtonLabel}}\n            </button>\n            @if (validationErrors.length || changes.length) {\n                <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n            }\n        </div>\n\n\n        <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"cancel()\">\n            {{data.editData.cancelButtonLabel}}\n        </button>\n    </mat-dialog-actions>\n</form>\n", styles: ["::ng-deep .badge-changes .mat-badge-content{background-color:orange;color:#fff}.actions-container{display:flex;gap:10px}.dialog-button-with-info-icon{margin-top:10px;gap:12px;display:flex;align-items:center}\n", "::ng-deep .mdc-dialog .mdc-dialog__content{padding:6px 20px!important}mat-dialog-actions{justify-content:space-between;align-items:center;padding-left:20px;padding-right:20px}.mat-dialog-title{padding:12px 20px;display:flex;justify-content:space-between;align-items:center}.mat-dialog-title div{font-size:var(--mdc-dialog-subhead-size, 14px);font-weight:var(--mdc-dialog-subhead-weight, 500)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i7.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i7.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i7.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i10.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: TooltipComponent, selector: "ngx-mat-entity-tooltip", inputs: ["tooltipContent"] }, { kind: "component", type: NgxMatEntityFormComponent, selector: "ngx-mat-entity-form", inputs: ["entity", "isEntityReadOnly", "hideOmitForCreate", "hideOmitForEdit", "additionalOmitKeys"], outputs: ["formChange", "selectedTabChange"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.7", type: NgxMatEntityEditDialogComponent, isStandalone: true, selector: "ngx-mat-entity-edit-dialog", outputs: { unsavedChanges: "unsavedChanges" }, ngImport: i0, template: "<!-- eslint-disable angular/no-call-expression -->\n<div class=\"mat-dialog-title\">\n    <div>{{data.editData.title(entityPriorChanges)}}</div>\n\n    <div class=\"actions-container\">\n        @if (data.editData.actions.length) {\n            <button type=\"button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                {{data.editData.actionsLabel}}\n            </button>\n        }\n        <mat-menu #menu=\"matMenu\">\n            @for (action of data.editData.actions; track $index) {\n                <button type=\"button\" mat-menu-item [disabled]=\"editActionDisabled(action)\" (click)=\"runEditAction(action)\">\n                    {{action.displayName}}\n                </button>\n            }\n        </mat-menu>\n    \n        @if (allowDelete) {\n            <button type=\"button\" mat-raised-button color=\"warn\" class=\"delete-button\" tabindex=\"-1\" (click)=\"delete()\">\n                {{data.editData.deleteButtonLabel}}\n            </button>\n        }\n    </div>\n</div>\n\n<form (ngSubmit)=\"edit()\">\n    <mat-dialog-content>\n        <ngx-mat-entity-form [hideOmitForEdit]=\"true\" [isEntityReadOnly]=\"isEntityReadOnly\" [entity]=\"data.entity\" (formChange)=\"checkEntity()\">\n        </ngx-mat-entity-form>\n    </mat-dialog-content>\n    \n    <mat-dialog-actions>\n        <div class=\"dialog-button-with-info-icon\">\n            <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                [class.badge-changes]=\"!validationErrors.length\"   \n                [disabled]=\"isEntityReadOnly || !isEntityValid || !isEntityDirty\"\n                [matBadge]=\"validationErrors.length > 0 ? validationErrors.length : changes.length\"\n                [matBadgeHidden]=\"!validationErrors.length && !changes.length\"\n            >\n                {{data.editData.confirmButtonLabel}}\n            </button>\n            @if (validationErrors.length || changes.length) {\n                <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n            }\n        </div>\n\n\n        <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"cancel()\">\n            {{data.editData.cancelButtonLabel}}\n        </button>\n    </mat-dialog-actions>\n</form>\n", styles: ["::ng-deep .badge-changes .mat-badge-content{background-color:orange;color:#fff}.actions-container{display:flex;gap:10px}.dialog-button-with-info-icon{margin-top:10px;gap:12px;display:flex;align-items:center}\n", "::ng-deep .mdc-dialog .mdc-dialog__content{padding:6px 20px!important}mat-dialog-actions{justify-content:space-between;align-items:center;padding-left:20px;padding-right:20px}.mat-dialog-title{padding:12px 20px;display:flex;justify-content:space-between;align-items:center}.mat-dialog-title div{font-size:var(--mdc-dialog-subhead-size, 14px);font-weight:var(--mdc-dialog-subhead-weight, 500)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i7.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i7.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i7.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i10.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: TooltipComponent, selector: "ngx-mat-entity-tooltip", inputs: ["tooltipContent"] }, { kind: "component", type: NgxMatEntityFormComponent, selector: "ngx-mat-entity-form", inputs: ["entity", "isEntityReadOnly", "hideOmitForCreate", "hideOmitForEdit", "additionalOmitKeys"], outputs: ["formChange", "selectedTabChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgxMatEntityEditDialogComponent, decorators: [{
             type: Component,
@@ -8381,12 +8388,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.7", ngImpor
                         CommonModule,
                         MatDialogModule,
                         MatButtonModule,
-                        NgxMatEntityConfirmDialogComponent,
                         MatMenuModule,
                         MatBadgeModule,
                         TooltipComponent,
-                        NgxMatEntityFormComponent
-                    ], template: "<!-- eslint-disable angular/no-call-expression -->\n<div class=\"mat-dialog-title\">\n    <div>{{data.editData.title(entityPriorChanges)}}</div>\n\n    <div class=\"actions-container\">\n        @if (data.editData.actions.length) {\n            <button type=\"button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                {{data.editData.actionsLabel}}\n            </button>\n        }\n        <mat-menu #menu=\"matMenu\">\n            @for (action of data.editData.actions; track $index) {\n                <button type=\"button\" mat-menu-item [disabled]=\"editActionDisabled(action)\" (click)=\"runEditAction(action)\">\n                    {{action.displayName}}\n                </button>\n            }\n        </mat-menu>\n    \n        @if (allowDelete) {\n            <button type=\"button\" mat-raised-button color=\"warn\" class=\"delete-button\" tabindex=\"-1\" (click)=\"delete()\">\n                {{data.editData.deleteButtonLabel}}\n            </button>\n        }\n    </div>\n</div>\n\n<form>\n    <mat-dialog-content>\n        <ngx-mat-entity-form [hideOmitForEdit]=\"true\" [isEntityReadOnly]=\"isEntityReadOnly\" [entity]=\"data.entity\" (formChange)=\"checkEntity()\">\n        </ngx-mat-entity-form>\n    </mat-dialog-content>\n    \n    <mat-dialog-actions>\n        <div class=\"dialog-button-with-info-icon\">\n            <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                [class.badge-changes]=\"!validationErrors.length\"   \n                [disabled]=\"isEntityReadOnly || !isEntityValid || !isEntityDirty\"\n                [matBadge]=\"validationErrors.length > 0 ? validationErrors.length : changes.length\"\n                [matBadgeHidden]=\"!validationErrors.length && !changes.length\"\n                (click)=\"edit()\"\n            >\n                {{data.editData.confirmButtonLabel}}\n            </button>\n            @if (validationErrors.length || changes.length) {\n                <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n            }\n        </div>\n\n\n        <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"cancel()\">\n            {{data.editData.cancelButtonLabel}}\n        </button>\n    </mat-dialog-actions>\n</form>\n", styles: ["::ng-deep .badge-changes .mat-badge-content{background-color:orange;color:#fff}.actions-container{display:flex;gap:10px}.dialog-button-with-info-icon{margin-top:10px;gap:12px;display:flex;align-items:center}\n", "::ng-deep .mdc-dialog .mdc-dialog__content{padding:6px 20px!important}mat-dialog-actions{justify-content:space-between;align-items:center;padding-left:20px;padding-right:20px}.mat-dialog-title{padding:12px 20px;display:flex;justify-content:space-between;align-items:center}.mat-dialog-title div{font-size:var(--mdc-dialog-subhead-size, 14px);font-weight:var(--mdc-dialog-subhead-weight, 500)}\n"] }]
+                        NgxMatEntityFormComponent,
+                        FormsModule
+                    ], template: "<!-- eslint-disable angular/no-call-expression -->\n<div class=\"mat-dialog-title\">\n    <div>{{data.editData.title(entityPriorChanges)}}</div>\n\n    <div class=\"actions-container\">\n        @if (data.editData.actions.length) {\n            <button type=\"button\" mat-raised-button [matMenuTriggerFor]=\"menu\">\n                {{data.editData.actionsLabel}}\n            </button>\n        }\n        <mat-menu #menu=\"matMenu\">\n            @for (action of data.editData.actions; track $index) {\n                <button type=\"button\" mat-menu-item [disabled]=\"editActionDisabled(action)\" (click)=\"runEditAction(action)\">\n                    {{action.displayName}}\n                </button>\n            }\n        </mat-menu>\n    \n        @if (allowDelete) {\n            <button type=\"button\" mat-raised-button color=\"warn\" class=\"delete-button\" tabindex=\"-1\" (click)=\"delete()\">\n                {{data.editData.deleteButtonLabel}}\n            </button>\n        }\n    </div>\n</div>\n\n<form (ngSubmit)=\"edit()\">\n    <mat-dialog-content>\n        <ngx-mat-entity-form [hideOmitForEdit]=\"true\" [isEntityReadOnly]=\"isEntityReadOnly\" [entity]=\"data.entity\" (formChange)=\"checkEntity()\">\n        </ngx-mat-entity-form>\n    </mat-dialog-content>\n    \n    <mat-dialog-actions>\n        <div class=\"dialog-button-with-info-icon\">\n            <button type=\"submit\" mat-raised-button matBadgeColor=\"warn\"\n                [class.badge-changes]=\"!validationErrors.length\"   \n                [disabled]=\"isEntityReadOnly || !isEntityValid || !isEntityDirty\"\n                [matBadge]=\"validationErrors.length > 0 ? validationErrors.length : changes.length\"\n                [matBadgeHidden]=\"!validationErrors.length && !changes.length\"\n            >\n                {{data.editData.confirmButtonLabel}}\n            </button>\n            @if (validationErrors.length || changes.length) {\n                <ngx-mat-entity-tooltip [tooltipContent]=\"tooltipContent\"></ngx-mat-entity-tooltip>\n            }\n        </div>\n\n\n        <button type=\"button\" mat-raised-button class=\"cancel-button\" (click)=\"cancel()\">\n            {{data.editData.cancelButtonLabel}}\n        </button>\n    </mat-dialog-actions>\n</form>\n", styles: ["::ng-deep .badge-changes .mat-badge-content{background-color:orange;color:#fff}.actions-container{display:flex;gap:10px}.dialog-button-with-info-icon{margin-top:10px;gap:12px;display:flex;align-items:center}\n", "::ng-deep .mdc-dialog .mdc-dialog__content{padding:6px 20px!important}mat-dialog-actions{justify-content:space-between;align-items:center;padding-left:20px;padding-right:20px}.mat-dialog-title{padding:12px 20px;display:flex;justify-content:space-between;align-items:center}.mat-dialog-title div{font-size:var(--mdc-dialog-subhead-size, 14px);font-weight:var(--mdc-dialog-subhead-weight, 500)}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -9351,15 +9358,25 @@ class ReferencesOneDecoratorConfigInternal extends PropertyDecoratorConfigIntern
     getEntityForId;
     // eslint-disable-next-line jsdoc/require-jsdoc
     EntityClass;
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    dropdownOnly;
+    // eslint-disable-next-line jsdoc/require-jsdoc
+    omit;
     constructor(data) {
         super(data);
         this.getReferencedEntities = data.getReferencedEntities;
         this.getDropdownValues = data.getDropdownValues;
         this.getEntityForId = data.getEntityForId ?? defaultGetEntityForId;
         this.EntityClass = data.EntityClass;
-        this.defaultWidths = data.defaultWidths ?? [12, 12, 12];
+        this.dropdownOnly = data.dropdownOnly ?? false;
+        this.defaultWidths = data.defaultWidths ?? getDefaultWidths(this.dropdownOnly);
+        this.omit = data.omit ?? [];
     }
 }
+// eslint-disable-next-line jsdoc/require-jsdoc
+function getDefaultWidths(dropdownOnly) {
+    return dropdownOnly ? [6, 6, 12] : [12, 12, 12];
+}
 
 /**
  * Decorator for setting and getting references one property metadata.