@codetectonics/mantle 2.0.7 → 2.0.9

package/fesm2022/codetectonics-mantle.mjs

@@ -566,6 +566,9 @@ class DynamicPipe {
             case 'datetime':
                 return this.transformDateTime(value);
                 break;
+            case 'obscured':
+                return this.transformObscured(value);
+                break;
             default: return this.transformString(value);
         }
     }
@@ -585,6 +588,11 @@ class DynamicPipe {
             return '';
         return moment(value, 'YYYY-MM-DD HH:mm').format('DD/MM/YYYY @ HH:mm');
     }
+    transformObscured(value) {
+        if (!value)
+            return '';
+        return value.replace(/./g, '*');
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DynamicPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
     static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: DynamicPipe, isStandalone: false, name: "dynamicPipe" }); }
 }
@@ -2733,6 +2741,51 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                 type: Input
             }] } });
 
+class ObscuredInputComponent {
+    constructor() {
+        this.value = null;
+        this.onChange = (newValue) => { };
+        this.onTouched = () => { };
+    }
+    registerOnChange(fn) { this.onChange = fn; }
+    registerOnTouched(fn) { this.onTouched = fn; }
+    writeValue(newValue) {
+        this.value = newValue;
+        this.onChange(newValue);
+    }
+    onValueChanged(event) {
+        this.onChange(this.value);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ObscuredInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: ObscuredInputComponent, isStandalone: false, selector: "mantle-obscured-input", inputs: { label: "label", tooltip: "tooltip", disable: "disable", required: "required", error: "error" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => ObscuredInputComponent),
+                multi: true
+            }
+        ], ngImport: i0, template: "<mat-form-field [class.mat-mdc-form-field-invalid]=\"error\">\n  <mat-label>\n    {{ label | translate }}\n    <mantle-tooltip *ngIf=\"tooltip\" [message]=\"tooltip\"></mantle-tooltip>\n  </mat-label>\n  <input matInput\n      type=\"password\"\n      [(ngModel)]=\"value\"\n      (keyup)=\"onValueChanged($event)\"\n      (change)=\"onValueChanged($event)\"\n      [required]=\"required\"\n      [disabled]=\"disable\"\n      autocomplete=\"off\">\n\n  <mat-hint *ngIf=\"error\" class=\"error-message\">{{ error }}</mat-hint>\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3$5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i3$5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$5.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$5.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "component", type: TooltipComponent, selector: "mantle-tooltip", inputs: ["message"] }, { kind: "pipe", type: i6.TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ObscuredInputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'mantle-obscured-input', standalone: false, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => ObscuredInputComponent),
+                            multi: true
+                        }
+                    ], template: "<mat-form-field [class.mat-mdc-form-field-invalid]=\"error\">\n  <mat-label>\n    {{ label | translate }}\n    <mantle-tooltip *ngIf=\"tooltip\" [message]=\"tooltip\"></mantle-tooltip>\n  </mat-label>\n  <input matInput\n      type=\"password\"\n      [(ngModel)]=\"value\"\n      (keyup)=\"onValueChanged($event)\"\n      (change)=\"onValueChanged($event)\"\n      [required]=\"required\"\n      [disabled]=\"disable\"\n      autocomplete=\"off\">\n\n  <mat-hint *ngIf=\"error\" class=\"error-message\">{{ error }}</mat-hint>\n</mat-form-field>\n" }]
+        }], ctorParameters: () => [], propDecorators: { label: [{
+                type: Input
+            }], tooltip: [{
+                type: Input
+            }], disable: [{
+                type: Input
+            }], required: [{
+                type: Input
+            }], error: [{
+                type: Input
+            }] } });
+
 class TextareaComponent {
     constructor() {
         this.rows = 1;
@@ -3866,11 +3919,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
 
 class DynamicFormFieldComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DynamicFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: DynamicFormFieldComponent, isStandalone: false, selector: "mantle-dynamic-form-field", inputs: { field: "field", form: "form", error: "error" }, ngImport: i0, template: "<div class=\"dynamic-form-field-wrapper\" [formGroup]=\"form\">\n  <ng-container [ngSwitch]=\"field.type\">\n\n    <mantle-text-input *ngSwitchCase=\"'string'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-text-input *ngSwitchCase=\"'string-md'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-text-input *ngSwitchCase=\"'string-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-textarea *ngSwitchCase=\"'text'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [rows]=\"4\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-textarea>\n\n    <mantle-dropdown *ngSwitchCase=\"'dropdown'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-dropdown>\n\n    <mantle-dropdown *ngSwitchCase=\"'dropdown-md'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-dropdown>\n\n    <mantle-dropdown *ngSwitchCase=\"'dropdown-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-dropdown>\n\n    <mantle-multiselect-input *ngSwitchCase=\"'multiselect'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-multiselect-input>\n\n    <mantle-multiselect-input *ngSwitchCase=\"'multiselect-md'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-multiselect-input>\n\n    <mantle-multiselect-input *ngSwitchCase=\"'multiselect-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-multiselect-input>\n\n    <mantle-datepicker *ngSwitchCase=\"'date'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-datepicker>\n\n    <mantle-datetimepicker *ngSwitchCase=\"'datetime'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-datetimepicker>\n\n    <mantle-time-input *ngSwitchCase=\"'time'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-time-input>\n\n    <mantle-number-input *ngSwitchCase=\"'number'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-number-input>\n\n    <mantle-number-input *ngSwitchCase=\"'currency'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-number-input>\n\n    <mantle-filepicker *ngSwitchCase=\"'file'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-filepicker>\n\n    <mantle-imagepicker *ngSwitchCase=\"'image'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-imagepicker>\n\n    <mantle-chip-input *ngSwitchCase=\"'chips'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-chip-input>\n\n    <mantle-chip-input *ngSwitchCase=\"'chips-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-chip-input>\n\n    <mantle-password-input *ngSwitchCase=\"'password'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-password-input>\n\n    <mantle-markdown-input *ngSwitchCase=\"'markdown'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-markdown-input>\n\n    <mantle-rich-text-input *ngSwitchCase=\"'rich-text'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-rich-text-input>\n\n    <mantle-autocomplete-input *ngSwitchCase=\"'autocomplete'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-autocomplete-input>\n\n    <mantle-text-input *ngSwitchCase=\"'link'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-colorpicker-input *ngSwitchCase=\"'color'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-colorpicker-input>\n\n    <mantle-chart-config-input *ngSwitchCase=\"'chart-config'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-chart-config-input>\n\n    <mantle-report-config-input *ngSwitchCase=\"'report-config'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-report-config-input>\n  </ng-container>\n</div>\n", styles: [":host,.dynamic-form-field-wrapper{display:block;width:100%;height:100%}\n"], dependencies: [{ kind: "directive", type: i1$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ChipInputComponent, selector: "mantle-chip-input", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: DatepickerComponent, selector: "mantle-datepicker", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: DatetimepickerComponent, selector: "mantle-datetimepicker", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: ColorPickerInputComponent, selector: "mantle-colorpicker-input", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: DropdownComponent, selector: "mantle-dropdown", inputs: ["label", "tooltip", "options", "disable", "required", "error"], outputs: ["change"] }, { kind: "component", type: FilepickerComponent, selector: "mantle-filepicker", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: ImagepickerComponent, selector: "mantle-imagepicker", inputs: ["label", "tooltip", "options", "disable", "required", "error"] }, { kind: "component", type: NumberInputComponent, selector: "mantle-number-input", inputs: ["label", "tooltip", "options", "disable", "required", "error"] }, { kind: "component", type: PasswordInputComponent, selector: "mantle-password-input", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: TextareaComponent, selector: "mantle-textarea", inputs: ["label", "tooltip", "rows", "disable", "required", "error"] }, { kind: "component", type: TextInputComponent, selector: "mantle-text-input", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: TimeInputComponent, selector: "mantle-time-input", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: MarkdownInputComponent, selector: "mantle-markdown-input", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: MultiselectInputComponent, selector: "mantle-multiselect-input", inputs: ["label", "tooltip", "options", "disable", "required", "error"] }, { kind: "component", type: RichTextInputComponent, selector: "mantle-rich-text-input", inputs: ["label", "tooltip", "options", "disable", "required", "error"] }, { kind: "component", type: ChartConfigInputComponent, selector: "mantle-chart-config-input", inputs: ["label", "tooltip", "options", "disable", "required", "error"] }, { kind: "component", type: ReportConfigInputComponent, selector: "mantle-report-config-input", inputs: ["label", "tooltip", "options", "disable", "required", "error"] }, { kind: "component", type: AutocompleteInputComponent, selector: "mantle-autocomplete-input", inputs: ["label", "tooltip", "options", "disable", "required", "error"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: DynamicFormFieldComponent, isStandalone: false, selector: "mantle-dynamic-form-field", inputs: { field: "field", form: "form", error: "error" }, ngImport: i0, template: "<div class=\"dynamic-form-field-wrapper\" [formGroup]=\"form\">\n  <ng-container [ngSwitch]=\"field.type\">\n\n    <mantle-text-input *ngSwitchCase=\"'string'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-text-input *ngSwitchCase=\"'string-md'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-text-input *ngSwitchCase=\"'string-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-textarea *ngSwitchCase=\"'text'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [rows]=\"4\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-textarea>\n\n    <mantle-dropdown *ngSwitchCase=\"'dropdown'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-dropdown>\n\n    <mantle-dropdown *ngSwitchCase=\"'dropdown-md'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-dropdown>\n\n    <mantle-dropdown *ngSwitchCase=\"'dropdown-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-dropdown>\n\n    <mantle-multiselect-input *ngSwitchCase=\"'multiselect'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-multiselect-input>\n\n    <mantle-multiselect-input *ngSwitchCase=\"'multiselect-md'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-multiselect-input>\n\n    <mantle-multiselect-input *ngSwitchCase=\"'multiselect-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-multiselect-input>\n\n    <mantle-datepicker *ngSwitchCase=\"'date'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-datepicker>\n\n    <mantle-datetimepicker *ngSwitchCase=\"'datetime'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-datetimepicker>\n\n    <mantle-time-input *ngSwitchCase=\"'time'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-time-input>\n\n    <mantle-number-input *ngSwitchCase=\"'number'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-number-input>\n\n    <mantle-number-input *ngSwitchCase=\"'currency'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-number-input>\n\n    <mantle-filepicker *ngSwitchCase=\"'file'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-filepicker>\n\n    <mantle-imagepicker *ngSwitchCase=\"'image'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-imagepicker>\n\n    <mantle-chip-input *ngSwitchCase=\"'chips'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-chip-input>\n\n    <mantle-chip-input *ngSwitchCase=\"'chips-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-chip-input>\n\n    <mantle-password-input *ngSwitchCase=\"'password'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-password-input>\n\n    <mantle-obscured-input *ngSwitchCase=\"'obscured'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-obscured-input>\n\n    <mantle-markdown-input *ngSwitchCase=\"'markdown'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-markdown-input>\n\n    <mantle-rich-text-input *ngSwitchCase=\"'rich-text'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-rich-text-input>\n\n    <mantle-autocomplete-input *ngSwitchCase=\"'autocomplete'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-autocomplete-input>\n\n    <mantle-text-input *ngSwitchCase=\"'link'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-colorpicker-input *ngSwitchCase=\"'color'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-colorpicker-input>\n\n    <mantle-chart-config-input *ngSwitchCase=\"'chart-config'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-chart-config-input>\n\n    <mantle-report-config-input *ngSwitchCase=\"'report-config'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-report-config-input>\n  </ng-container>\n</div>\n", styles: [":host,.dynamic-form-field-wrapper{display:block;width:100%;height:100%}\n"], dependencies: [{ kind: "directive", type: i1$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ChipInputComponent, selector: "mantle-chip-input", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: DatepickerComponent, selector: "mantle-datepicker", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: DatetimepickerComponent, selector: "mantle-datetimepicker", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: ColorPickerInputComponent, selector: "mantle-colorpicker-input", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: DropdownComponent, selector: "mantle-dropdown", inputs: ["label", "tooltip", "options", "disable", "required", "error"], outputs: ["change"] }, { kind: "component", type: FilepickerComponent, selector: "mantle-filepicker", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: ImagepickerComponent, selector: "mantle-imagepicker", inputs: ["label", "tooltip", "options", "disable", "required", "error"] }, { kind: "component", type: NumberInputComponent, selector: "mantle-number-input", inputs: ["label", "tooltip", "options", "disable", "required", "error"] }, { kind: "component", type: PasswordInputComponent, selector: "mantle-password-input", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: ObscuredInputComponent, selector: "mantle-obscured-input", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: TextareaComponent, selector: "mantle-textarea", inputs: ["label", "tooltip", "rows", "disable", "required", "error"] }, { kind: "component", type: TextInputComponent, selector: "mantle-text-input", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: TimeInputComponent, selector: "mantle-time-input", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: MarkdownInputComponent, selector: "mantle-markdown-input", inputs: ["label", "tooltip", "disable", "required", "error"] }, { kind: "component", type: MultiselectInputComponent, selector: "mantle-multiselect-input", inputs: ["label", "tooltip", "options", "disable", "required", "error"] }, { kind: "component", type: RichTextInputComponent, selector: "mantle-rich-text-input", inputs: ["label", "tooltip", "options", "disable", "required", "error"] }, { kind: "component", type: ChartConfigInputComponent, selector: "mantle-chart-config-input", inputs: ["label", "tooltip", "options", "disable", "required", "error"] }, { kind: "component", type: ReportConfigInputComponent, selector: "mantle-report-config-input", inputs: ["label", "tooltip", "options", "disable", "required", "error"] }, { kind: "component", type: AutocompleteInputComponent, selector: "mantle-autocomplete-input", inputs: ["label", "tooltip", "options", "disable", "required", "error"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DynamicFormFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mantle-dynamic-form-field', standalone: false, template: "<div class=\"dynamic-form-field-wrapper\" [formGroup]=\"form\">\n  <ng-container [ngSwitch]=\"field.type\">\n\n    <mantle-text-input *ngSwitchCase=\"'string'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-text-input *ngSwitchCase=\"'string-md'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-text-input *ngSwitchCase=\"'string-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-textarea *ngSwitchCase=\"'text'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [rows]=\"4\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-textarea>\n\n    <mantle-dropdown *ngSwitchCase=\"'dropdown'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-dropdown>\n\n    <mantle-dropdown *ngSwitchCase=\"'dropdown-md'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-dropdown>\n\n    <mantle-dropdown *ngSwitchCase=\"'dropdown-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-dropdown>\n\n    <mantle-multiselect-input *ngSwitchCase=\"'multiselect'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-multiselect-input>\n\n    <mantle-multiselect-input *ngSwitchCase=\"'multiselect-md'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-multiselect-input>\n\n    <mantle-multiselect-input *ngSwitchCase=\"'multiselect-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-multiselect-input>\n\n    <mantle-datepicker *ngSwitchCase=\"'date'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-datepicker>\n\n    <mantle-datetimepicker *ngSwitchCase=\"'datetime'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-datetimepicker>\n\n    <mantle-time-input *ngSwitchCase=\"'time'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-time-input>\n\n    <mantle-number-input *ngSwitchCase=\"'number'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-number-input>\n\n    <mantle-number-input *ngSwitchCase=\"'currency'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-number-input>\n\n    <mantle-filepicker *ngSwitchCase=\"'file'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-filepicker>\n\n    <mantle-imagepicker *ngSwitchCase=\"'image'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-imagepicker>\n\n    <mantle-chip-input *ngSwitchCase=\"'chips'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-chip-input>\n\n    <mantle-chip-input *ngSwitchCase=\"'chips-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-chip-input>\n\n    <mantle-password-input *ngSwitchCase=\"'password'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-password-input>\n\n    <mantle-markdown-input *ngSwitchCase=\"'markdown'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-markdown-input>\n\n    <mantle-rich-text-input *ngSwitchCase=\"'rich-text'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-rich-text-input>\n\n    <mantle-autocomplete-input *ngSwitchCase=\"'autocomplete'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-autocomplete-input>\n\n    <mantle-text-input *ngSwitchCase=\"'link'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-colorpicker-input *ngSwitchCase=\"'color'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-colorpicker-input>\n\n    <mantle-chart-config-input *ngSwitchCase=\"'chart-config'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-chart-config-input>\n\n    <mantle-report-config-input *ngSwitchCase=\"'report-config'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-report-config-input>\n  </ng-container>\n</div>\n", styles: [":host,.dynamic-form-field-wrapper{display:block;width:100%;height:100%}\n"] }]
+            args: [{ selector: 'mantle-dynamic-form-field', standalone: false, template: "<div class=\"dynamic-form-field-wrapper\" [formGroup]=\"form\">\n  <ng-container [ngSwitch]=\"field.type\">\n\n    <mantle-text-input *ngSwitchCase=\"'string'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-text-input *ngSwitchCase=\"'string-md'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-text-input *ngSwitchCase=\"'string-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-textarea *ngSwitchCase=\"'text'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [rows]=\"4\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-textarea>\n\n    <mantle-dropdown *ngSwitchCase=\"'dropdown'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-dropdown>\n\n    <mantle-dropdown *ngSwitchCase=\"'dropdown-md'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-dropdown>\n\n    <mantle-dropdown *ngSwitchCase=\"'dropdown-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-dropdown>\n\n    <mantle-multiselect-input *ngSwitchCase=\"'multiselect'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-multiselect-input>\n\n    <mantle-multiselect-input *ngSwitchCase=\"'multiselect-md'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-multiselect-input>\n\n    <mantle-multiselect-input *ngSwitchCase=\"'multiselect-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-multiselect-input>\n\n    <mantle-datepicker *ngSwitchCase=\"'date'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-datepicker>\n\n    <mantle-datetimepicker *ngSwitchCase=\"'datetime'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-datetimepicker>\n\n    <mantle-time-input *ngSwitchCase=\"'time'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-time-input>\n\n    <mantle-number-input *ngSwitchCase=\"'number'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-number-input>\n\n    <mantle-number-input *ngSwitchCase=\"'currency'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-number-input>\n\n    <mantle-filepicker *ngSwitchCase=\"'file'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-filepicker>\n\n    <mantle-imagepicker *ngSwitchCase=\"'image'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-imagepicker>\n\n    <mantle-chip-input *ngSwitchCase=\"'chips'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-chip-input>\n\n    <mantle-chip-input *ngSwitchCase=\"'chips-lg'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-chip-input>\n\n    <mantle-password-input *ngSwitchCase=\"'password'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-password-input>\n\n    <mantle-obscured-input *ngSwitchCase=\"'obscured'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-obscured-input>\n\n    <mantle-markdown-input *ngSwitchCase=\"'markdown'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-markdown-input>\n\n    <mantle-rich-text-input *ngSwitchCase=\"'rich-text'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-rich-text-input>\n\n    <mantle-autocomplete-input *ngSwitchCase=\"'autocomplete'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-autocomplete-input>\n\n    <mantle-text-input *ngSwitchCase=\"'link'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-text-input>\n\n    <mantle-colorpicker-input *ngSwitchCase=\"'color'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-colorpicker-input>\n\n    <mantle-chart-config-input *ngSwitchCase=\"'chart-config'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-chart-config-input>\n\n    <mantle-report-config-input *ngSwitchCase=\"'report-config'\"\n        [id]=\"field.attr\"\n        [formControlName]=\"field.attr\"\n        [label]=\"field.label\"\n        [tooltip]=\"field.tooltip\"\n        [options]=\"field.options\"\n        [required]=\"field.required\"\n        [disable]=\"field.disabled\"\n        [error]=\"error\">\n    </mantle-report-config-input>\n  </ng-container>\n</div>\n", styles: [":host,.dynamic-form-field-wrapper{display:block;width:100%;height:100%}\n"] }]
         }], propDecorators: { field: [{
                 type: Input
             }], form: [{
@@ -4125,11 +4178,13 @@ class DashboardCardComponent {
     }
     refreshFormContent() {
         let elements = this.dashboardWidgetService.widgetSearchFields();
-        elements.forEach((searchField) => {
-            if ((searchField.type == 'dropdown') && (this.searchValues[searchField.attr] !== undefined)) {
-                searchField.options = { values: this.searchValues[searchField.attr] };
-            }
-        });
+        if (!!this.searchValues) {
+            elements.forEach((searchField) => {
+                if ((searchField.type == 'dropdown') && (this.searchValues[searchField.attr] !== undefined)) {
+                    searchField.options = { values: this.searchValues[searchField.attr] };
+                }
+            });
+        }
         this.formContent = {
             data: this.options,
             elements: elements
@@ -5498,11 +5553,11 @@ class GridLayoutEditorSectionComponent {
         return dialogConfig;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: GridLayoutEditorSectionComponent, deps: [{ token: i1$3.MatDialog }, { token: ArrayService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: GridLayoutEditorSectionComponent, isStandalone: false, selector: "mantle-grid-layout-editor-section", inputs: { section: "section", defaultRowHeight: "defaultRowHeight" }, ngImport: i0, template: "<div class=\"grid-layout-editor-section\">\n  <mantle-field-grid\n      [singleColumn]=\"section.singleColumn || false\"\n      [rowHeight]=\"section.rowHeight || defaultRowHeight\">\n\n    <ng-container *ngFor=\"let element of section.dynamic_layout_grid_fields_attributes\">\n      <ng-container *ngIf=\"!element._destroy\">\n        <ng-container *mantleFieldGridItem=\"let _; colspan: getColSpanForField(element); rowspan: getRowSpanForField(element)\">\n          <mantle-dynamic-layout-editor-element\n              elementType=\"field\"\n              [element]=\"element\"\n              [showControls]=\"!section.elements_locked\">\n          </mantle-dynamic-layout-editor-element>\n        </ng-container>\n      </ng-container>\n    </ng-container>\n\n  </mantle-field-grid>\n</div>\n\n<div fxLayout=\"row\" fxLayoutAlign=\"center start\" fxLayoutGap=\"16px\" class=\"section-controls\">\n  <div fxFlex=\"1 1 auto\"></div>\n  <div fxFlex=\"0 0 auto\" *ngIf=\"!section.elements_locked\">\n    <button mat-raised-button\n        color=\"primary\"\n        type=\"button\"\n        (click)=\"onAddElementClicked()\">\n      <mat-icon>add</mat-icon>\n    </button>\n  </div>\n</div>\n", styles: [".section-controls{margin-top:16px}.section-controls button{padding:0;min-width:36px}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4$1.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i4$1.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i4$1.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i4$1.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i6$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: FieldGridItemDirective, selector: "[mantleFieldGridItem]", inputs: ["mantleFieldGridItemColspan", "mantleFieldGridItemRowspan"] }, { kind: "component", type: DynamicLayoutEditorElementComponent, selector: "mantle-dynamic-layout-editor-element", inputs: ["element", "elementType", "showControls"] }, { kind: "component", type: FieldGridComponent, selector: "mantle-field-grid", inputs: ["singleColumn", "rowHeight"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: GridLayoutEditorSectionComponent, isStandalone: false, selector: "mantle-grid-layout-editor-section", inputs: { section: "section", defaultRowHeight: "defaultRowHeight" }, ngImport: i0, template: "<div class=\"grid-layout-editor-section\">\n  <mantle-field-grid\n      [singleColumn]=\"section.singleColumn || false\"\n      [rowHeight]=\"section.rowHeight || defaultRowHeight\">\n\n    <ng-container *ngFor=\"let element of section.dynamic_layout_grid_fields_attributes\">\n      <ng-container *ngIf=\"!element._destroy\">\n        <ng-container *mantleFieldGridItem=\"let _; colspan: getColSpanForField(element); rowspan: getRowSpanForField(element)\">\n          <mantle-dynamic-layout-editor-element\n              elementType=\"field\"\n              [element]=\"element\"\n              [showControls]=\"!section.elements_locked\">\n          </mantle-dynamic-layout-editor-element>\n        </ng-container>\n      </ng-container>\n    </ng-container>\n\n  </mantle-field-grid>\n</div>\n\n<div fxLayout=\"row\" fxLayoutAlign=\"center start\" fxLayoutGap=\"16px\" class=\"section-controls\">\n  <div fxFlex=\"1 1 auto\"></div>\n  <div fxFlex=\"0 0 auto\" *ngIf=\"!section.elements_locked\">\n    <button mat-raised-button\n        color=\"primary\"\n        type=\"button\"\n        (click)=\"onAddElementClicked()\">\n      <mat-icon>add</mat-icon>\n    </button>\n  </div>\n</div>\n", styles: [".section-controls{margin-top:16px}.section-controls button{padding:0;min-width:36px}.section-controls button .mat-icon{margin-left:0;margin-right:0}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4$1.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i4$1.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i4$1.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i4$1.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i6$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: FieldGridItemDirective, selector: "[mantleFieldGridItem]", inputs: ["mantleFieldGridItemColspan", "mantleFieldGridItemRowspan"] }, { kind: "component", type: DynamicLayoutEditorElementComponent, selector: "mantle-dynamic-layout-editor-element", inputs: ["element", "elementType", "showControls"] }, { kind: "component", type: FieldGridComponent, selector: "mantle-field-grid", inputs: ["singleColumn", "rowHeight"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: GridLayoutEditorSectionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mantle-grid-layout-editor-section', standalone: false, template: "<div class=\"grid-layout-editor-section\">\n  <mantle-field-grid\n      [singleColumn]=\"section.singleColumn || false\"\n      [rowHeight]=\"section.rowHeight || defaultRowHeight\">\n\n    <ng-container *ngFor=\"let element of section.dynamic_layout_grid_fields_attributes\">\n      <ng-container *ngIf=\"!element._destroy\">\n        <ng-container *mantleFieldGridItem=\"let _; colspan: getColSpanForField(element); rowspan: getRowSpanForField(element)\">\n          <mantle-dynamic-layout-editor-element\n              elementType=\"field\"\n              [element]=\"element\"\n              [showControls]=\"!section.elements_locked\">\n          </mantle-dynamic-layout-editor-element>\n        </ng-container>\n      </ng-container>\n    </ng-container>\n\n  </mantle-field-grid>\n</div>\n\n<div fxLayout=\"row\" fxLayoutAlign=\"center start\" fxLayoutGap=\"16px\" class=\"section-controls\">\n  <div fxFlex=\"1 1 auto\"></div>\n  <div fxFlex=\"0 0 auto\" *ngIf=\"!section.elements_locked\">\n    <button mat-raised-button\n        color=\"primary\"\n        type=\"button\"\n        (click)=\"onAddElementClicked()\">\n      <mat-icon>add</mat-icon>\n    </button>\n  </div>\n</div>\n", styles: [".section-controls{margin-top:16px}.section-controls button{padding:0;min-width:36px}\n"] }]
+            args: [{ selector: 'mantle-grid-layout-editor-section', standalone: false, template: "<div class=\"grid-layout-editor-section\">\n  <mantle-field-grid\n      [singleColumn]=\"section.singleColumn || false\"\n      [rowHeight]=\"section.rowHeight || defaultRowHeight\">\n\n    <ng-container *ngFor=\"let element of section.dynamic_layout_grid_fields_attributes\">\n      <ng-container *ngIf=\"!element._destroy\">\n        <ng-container *mantleFieldGridItem=\"let _; colspan: getColSpanForField(element); rowspan: getRowSpanForField(element)\">\n          <mantle-dynamic-layout-editor-element\n              elementType=\"field\"\n              [element]=\"element\"\n              [showControls]=\"!section.elements_locked\">\n          </mantle-dynamic-layout-editor-element>\n        </ng-container>\n      </ng-container>\n    </ng-container>\n\n  </mantle-field-grid>\n</div>\n\n<div fxLayout=\"row\" fxLayoutAlign=\"center start\" fxLayoutGap=\"16px\" class=\"section-controls\">\n  <div fxFlex=\"1 1 auto\"></div>\n  <div fxFlex=\"0 0 auto\" *ngIf=\"!section.elements_locked\">\n    <button mat-raised-button\n        color=\"primary\"\n        type=\"button\"\n        (click)=\"onAddElementClicked()\">\n      <mat-icon>add</mat-icon>\n    </button>\n  </div>\n</div>\n", styles: [".section-controls{margin-top:16px}.section-controls button{padding:0;min-width:36px}.section-controls button .mat-icon{margin-left:0;margin-right:0}\n"] }]
         }], ctorParameters: () => [{ type: i1$3.MatDialog }, { type: ArrayService }], propDecorators: { section: [{
                 type: Input
             }], defaultRowHeight: [{
@@ -5567,11 +5622,11 @@ class TableLayoutEditorSectionComponent {
         return dialogConfig;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TableLayoutEditorSectionComponent, deps: [{ token: i1$3.MatDialog }, { token: ArrayService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: TableLayoutEditorSectionComponent, isStandalone: false, selector: "mantle-table-layout-editor-section", inputs: { section: "section" }, ngImport: i0, template: "<div class=\"table-layout-editor-section\">\n  <h4 class=\"section-type-label\">Table</h4>\n  <mat-grid-list rowHeight=\"120px\" [cols]=\"section.dynamic_layout_table_columns_attributes.length\" [class.multi-column]=\"true\" [ngStyle]=\"{ 'width.px': section.dynamic_layout_table_columns_attributes.length * 300 }\">\n\n    <ng-container *ngFor=\"let element of section.dynamic_layout_table_columns_attributes\">\n      <mat-grid-tile *ngIf=\"!element._destroy\" colspan=\"1\" rowspan=\"1\">\n        <mantle-dynamic-layout-editor-element\n            elementType=\"table-column\"\n            [element]=\"element\"\n            [showControls]=\"!section.elements_locked\">\n        </mantle-dynamic-layout-editor-element>\n      </mat-grid-tile>\n    </ng-container>\n\n  </mat-grid-list>\n</div>\n\n<div fxLayout=\"row\" fxLayoutAlign=\"center start\" fxLayoutGap=\"16px\" class=\"section-controls\">\n  <div fxFlex=\"1 1 auto\"></div>\n  <div fxFlex=\"0 0 auto\" *ngIf=\"!section.elements_locked\">\n    <button mat-raised-button\n        color=\"primary\"\n        type=\"button\"\n        (click)=\"onAddElementClicked()\">\n      <mat-icon>add</mat-icon>\n    </button>\n  </div>\n</div>\n", styles: [".section-controls{margin-top:16px}.section-controls button{padding:0;min-width:36px}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i4$1.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i4$1.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i4$1.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i4$1.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i5.DefaultStyleDirective, selector: "  [ngStyle],  [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl],  [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl],  [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]", inputs: ["ngStyle", "ngStyle.xs", "ngStyle.sm", "ngStyle.md", "ngStyle.lg", "ngStyle.xl", "ngStyle.lt-sm", "ngStyle.lt-md", "ngStyle.lt-lg", "ngStyle.lt-xl", "ngStyle.gt-xs", "ngStyle.gt-sm", "ngStyle.gt-md", "ngStyle.gt-lg"] }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3$3.MatGridList, selector: "mat-grid-list", inputs: ["cols", "gutterSize", "rowHeight"], exportAs: ["matGridList"] }, { kind: "component", type: i3$3.MatGridTile, selector: "mat-grid-tile", inputs: ["rowspan", "colspan"], exportAs: ["matGridTile"] }, { kind: "component", type: i6$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: DynamicLayoutEditorElementComponent, selector: "mantle-dynamic-layout-editor-element", inputs: ["element", "elementType", "showControls"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: TableLayoutEditorSectionComponent, isStandalone: false, selector: "mantle-table-layout-editor-section", inputs: { section: "section" }, ngImport: i0, template: "<div class=\"table-layout-editor-section\">\n  <h4 class=\"section-type-label\">Table</h4>\n  <mat-grid-list rowHeight=\"120px\" [cols]=\"section.dynamic_layout_table_columns_attributes.length\" [class.multi-column]=\"true\" [ngStyle]=\"{ 'width.px': section.dynamic_layout_table_columns_attributes.length * 300 }\">\n\n    <ng-container *ngFor=\"let element of section.dynamic_layout_table_columns_attributes\">\n      <mat-grid-tile *ngIf=\"!element._destroy\" colspan=\"1\" rowspan=\"1\">\n        <mantle-dynamic-layout-editor-element\n            elementType=\"table-column\"\n            [element]=\"element\"\n            [showControls]=\"!section.elements_locked\">\n        </mantle-dynamic-layout-editor-element>\n      </mat-grid-tile>\n    </ng-container>\n\n  </mat-grid-list>\n</div>\n\n<div fxLayout=\"row\" fxLayoutAlign=\"center start\" fxLayoutGap=\"16px\" class=\"section-controls\">\n  <div fxFlex=\"1 1 auto\"></div>\n  <div fxFlex=\"0 0 auto\" *ngIf=\"!section.elements_locked\">\n    <button mat-raised-button\n        color=\"primary\"\n        type=\"button\"\n        (click)=\"onAddElementClicked()\">\n      <mat-icon>add</mat-icon>\n    </button>\n  </div>\n</div>\n", styles: [".section-controls{margin-top:16px}.section-controls button{padding:0;min-width:36px}.section-controls button .mat-icon{margin-left:0;margin-right:0}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i4$1.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i4$1.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i4$1.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i4$1.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i5.DefaultStyleDirective, selector: "  [ngStyle],  [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl],  [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl],  [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]", inputs: ["ngStyle", "ngStyle.xs", "ngStyle.sm", "ngStyle.md", "ngStyle.lg", "ngStyle.xl", "ngStyle.lt-sm", "ngStyle.lt-md", "ngStyle.lt-lg", "ngStyle.lt-xl", "ngStyle.gt-xs", "ngStyle.gt-sm", "ngStyle.gt-md", "ngStyle.gt-lg"] }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3$3.MatGridList, selector: "mat-grid-list", inputs: ["cols", "gutterSize", "rowHeight"], exportAs: ["matGridList"] }, { kind: "component", type: i3$3.MatGridTile, selector: "mat-grid-tile", inputs: ["rowspan", "colspan"], exportAs: ["matGridTile"] }, { kind: "component", type: i6$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: DynamicLayoutEditorElementComponent, selector: "mantle-dynamic-layout-editor-element", inputs: ["element", "elementType", "showControls"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TableLayoutEditorSectionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mantle-table-layout-editor-section', standalone: false, template: "<div class=\"table-layout-editor-section\">\n  <h4 class=\"section-type-label\">Table</h4>\n  <mat-grid-list rowHeight=\"120px\" [cols]=\"section.dynamic_layout_table_columns_attributes.length\" [class.multi-column]=\"true\" [ngStyle]=\"{ 'width.px': section.dynamic_layout_table_columns_attributes.length * 300 }\">\n\n    <ng-container *ngFor=\"let element of section.dynamic_layout_table_columns_attributes\">\n      <mat-grid-tile *ngIf=\"!element._destroy\" colspan=\"1\" rowspan=\"1\">\n        <mantle-dynamic-layout-editor-element\n            elementType=\"table-column\"\n            [element]=\"element\"\n            [showControls]=\"!section.elements_locked\">\n        </mantle-dynamic-layout-editor-element>\n      </mat-grid-tile>\n    </ng-container>\n\n  </mat-grid-list>\n</div>\n\n<div fxLayout=\"row\" fxLayoutAlign=\"center start\" fxLayoutGap=\"16px\" class=\"section-controls\">\n  <div fxFlex=\"1 1 auto\"></div>\n  <div fxFlex=\"0 0 auto\" *ngIf=\"!section.elements_locked\">\n    <button mat-raised-button\n        color=\"primary\"\n        type=\"button\"\n        (click)=\"onAddElementClicked()\">\n      <mat-icon>add</mat-icon>\n    </button>\n  </div>\n</div>\n", styles: [".section-controls{margin-top:16px}.section-controls button{padding:0;min-width:36px}\n"] }]
+            args: [{ selector: 'mantle-table-layout-editor-section', standalone: false, template: "<div class=\"table-layout-editor-section\">\n  <h4 class=\"section-type-label\">Table</h4>\n  <mat-grid-list rowHeight=\"120px\" [cols]=\"section.dynamic_layout_table_columns_attributes.length\" [class.multi-column]=\"true\" [ngStyle]=\"{ 'width.px': section.dynamic_layout_table_columns_attributes.length * 300 }\">\n\n    <ng-container *ngFor=\"let element of section.dynamic_layout_table_columns_attributes\">\n      <mat-grid-tile *ngIf=\"!element._destroy\" colspan=\"1\" rowspan=\"1\">\n        <mantle-dynamic-layout-editor-element\n            elementType=\"table-column\"\n            [element]=\"element\"\n            [showControls]=\"!section.elements_locked\">\n        </mantle-dynamic-layout-editor-element>\n      </mat-grid-tile>\n    </ng-container>\n\n  </mat-grid-list>\n</div>\n\n<div fxLayout=\"row\" fxLayoutAlign=\"center start\" fxLayoutGap=\"16px\" class=\"section-controls\">\n  <div fxFlex=\"1 1 auto\"></div>\n  <div fxFlex=\"0 0 auto\" *ngIf=\"!section.elements_locked\">\n    <button mat-raised-button\n        color=\"primary\"\n        type=\"button\"\n        (click)=\"onAddElementClicked()\">\n      <mat-icon>add</mat-icon>\n    </button>\n  </div>\n</div>\n", styles: [".section-controls{margin-top:16px}.section-controls button{padding:0;min-width:36px}.section-controls button .mat-icon{margin-left:0;margin-right:0}\n"] }]
         }], ctorParameters: () => [{ type: i1$3.MatDialog }, { type: ArrayService }], propDecorators: { section: [{
                 type: Input
             }] } });
@@ -7037,6 +7092,7 @@ class MantleModule {
             ImageCropperComponent,
             NumberInputComponent,
             PasswordInputComponent,
+            ObscuredInputComponent,
             TextareaComponent,
             TextInputComponent,
             TimeInputComponent,
@@ -7169,6 +7225,7 @@ class MantleModule {
             ImageCropperComponent,
             NumberInputComponent,
             PasswordInputComponent,
+            ObscuredInputComponent,
             TextareaComponent,
             TextInputComponent,
             TimeInputComponent,
@@ -7312,6 +7369,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         ImageCropperComponent,
                         NumberInputComponent,
                         PasswordInputComponent,
+                        ObscuredInputComponent,
                         TextareaComponent,
                         TextInputComponent,
                         TimeInputComponent,
@@ -7454,6 +7512,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         ImageCropperComponent,
                         NumberInputComponent,
                         PasswordInputComponent,
+                        ObscuredInputComponent,
                         TextareaComponent,
                         TextInputComponent,
                         TimeInputComponent,
@@ -8632,5 +8691,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AccordionDetailsContainerComponent, AccordionFormContainerComponent, AccordionLayoutEditorContainerComponent, ActionsAttributeDisplayComponent, AnnouncementService, ArrayService, AutocompleteInputComponent, BoardDetailsSectionComponent, BoardFormSectionComponent, COLUMN_CHART, ChartConfigInputComponent, ChartService, ChartViewerDisplayComponent, ChipAttributeDisplayComponent, ChipInputComponent, ClickStopPropagationDirective, ColorPickerInputComponent, ConfirmationService, ContentTitleComponent, CurrentUserService, CustomDashboardPageComponent, DashboardCardComponent, DashboardCardSearchMenuComponent, DashboardInfoCardComponent, DashboardLayoutEditorSectionComponent, DashboardPageComponent, DashboardSectionComponent, DashboardTableComponent, DashboardTableDataSource, DataBroadcastService, DatepickerComponent, DatetimepickerComponent, DeleteConfirmationDialogComponent, DetailPageComponent, DialogDetailsComponent, DialogFormComponent, DialogNestedDetailsComponent, DialogNestedFormComponent, DocumentsPageComponent, DraggableTableComponent, DraggableTableDataSource, DropdownComponent, DynamicAttributeDisplayComponent, DynamicBoardComponent, DynamicBoardWidgetContentComponent, DynamicChartComponent, DynamicCustomDashboardComponent, DynamicCustomDashboardContainerComponent, DynamicCustomDashboardSectionComponent, DynamicDashboardComponent, DynamicDashboardContainerComponent, DynamicDetailsComponent, DynamicDetailsContainerComponent, DynamicDetailsSectionComponent, DynamicFormComponent, DynamicFormContainerComponent, DynamicFormField, DynamicFormFieldComponent, DynamicFormSectionComponent, DynamicFormService, DynamicLayoutEditorComponent, DynamicLayoutEditorContainerComponent, DynamicLayoutEditorElementComponent, DynamicLayoutEditorSectionComponent, DynamicPipe, DynamicTableComponent, DynamicTableDataSource, DynamicWidgetDisplayComponent, ENVIRONMENT, ExportPageComponent, FeatureConfigService, FeatureGuard, FieldGridComponent, FieldGridItemDirective, FileAttributeDisplayComponent, FileDropzoneDirective, FilePreviewDialogComponent, FilepickerComponent, FormPageComponent, GANTT_CHART, GridDetailsSectionComponent, GridFormSectionComponent, GridLayoutEditorSectionComponent, IconAttributeDisplayComponent, ImageAttributeDisplayComponent, ImageCropperComponent, ImagepickerComponent, LayoutEditorFieldElementComponent, LayoutEditorPageComponent, LayoutEditorTableColumnElementComponent, LayoutEditorWidgetElementComponent, LinkAttributeDisplayComponent, ListPageComponent, ListPageDataSource, LoaderComponent, LocaleService, MANTLE_LANG_EN, MANTLE_LANG_MS, MantleModule, MapDisplayComponent, MarkdownAttributeDisplayComponent, MarkdownDetailsSectionComponent, MarkdownInputComponent, MarkdownLayoutEditorSectionComponent, MaterialModule, MultiselectDisplayComponent, MultiselectInputComponent, NavTreeComponent, NumberInputComponent, ObjectService, PIE_CHART, PROGRESS_BAR_CHART, PageTitleComponent, PasswordCheckGuard, PasswordCheckService, PasswordInputComponent, PlainCustomDashboardContainerComponent, PlainDashboardContainerComponent, PlainDetailsContainerComponent, PlainFormContainerComponent, PlainLayoutEditorContainerComponent, QrCodeDialogComponent, ReportConfigInputComponent, ReportDetailsSectionComponent, ReportViewerDisplayComponent, RerouteComponent, RichTextDisplayComponent, RichTextInputComponent, RosterPageComponent, RosterShiftListDetailsSectionComponent, RosterShiftListFormSectionComponent, SPLINE_CHART, SaveConfirmationDialogComponent, ScreenSizeMap, ScreenSizeService, SearchPanelComponent, SectionTitleComponent, SecureImagePipe, SessionGuard, SnackbarComponent, TabbedPageComponent, TableDetailsSectionComponent, TableFormSectionComponent, TableLayoutEditorSectionComponent, TextInputComponent, TextareaComponent, ThumbnailDisplayComponent, TimeInputComponent, TooltipComponent, WebApiListRequest, WebApiService, WebsocketService };
+export { AccordionDetailsContainerComponent, AccordionFormContainerComponent, AccordionLayoutEditorContainerComponent, ActionsAttributeDisplayComponent, AnnouncementService, ArrayService, AutocompleteInputComponent, BoardDetailsSectionComponent, BoardFormSectionComponent, COLUMN_CHART, ChartConfigInputComponent, ChartService, ChartViewerDisplayComponent, ChipAttributeDisplayComponent, ChipInputComponent, ClickStopPropagationDirective, ColorPickerInputComponent, ConfirmationService, ContentTitleComponent, CurrentUserService, CustomDashboardPageComponent, DashboardCardComponent, DashboardCardSearchMenuComponent, DashboardInfoCardComponent, DashboardLayoutEditorSectionComponent, DashboardPageComponent, DashboardSectionComponent, DashboardTableComponent, DashboardTableDataSource, DataBroadcastService, DatepickerComponent, DatetimepickerComponent, DeleteConfirmationDialogComponent, DetailPageComponent, DialogDetailsComponent, DialogFormComponent, DialogNestedDetailsComponent, DialogNestedFormComponent, DocumentsPageComponent, DraggableTableComponent, DraggableTableDataSource, DropdownComponent, DynamicAttributeDisplayComponent, DynamicBoardComponent, DynamicBoardWidgetContentComponent, DynamicChartComponent, DynamicCustomDashboardComponent, DynamicCustomDashboardContainerComponent, DynamicCustomDashboardSectionComponent, DynamicDashboardComponent, DynamicDashboardContainerComponent, DynamicDetailsComponent, DynamicDetailsContainerComponent, DynamicDetailsSectionComponent, DynamicFormComponent, DynamicFormContainerComponent, DynamicFormField, DynamicFormFieldComponent, DynamicFormSectionComponent, DynamicFormService, DynamicLayoutEditorComponent, DynamicLayoutEditorContainerComponent, DynamicLayoutEditorElementComponent, DynamicLayoutEditorSectionComponent, DynamicPipe, DynamicTableComponent, DynamicTableDataSource, DynamicWidgetDisplayComponent, ENVIRONMENT, ExportPageComponent, FeatureConfigService, FeatureGuard, FieldGridComponent, FieldGridItemDirective, FileAttributeDisplayComponent, FileDropzoneDirective, FilePreviewDialogComponent, FilepickerComponent, FormPageComponent, GANTT_CHART, GridDetailsSectionComponent, GridFormSectionComponent, GridLayoutEditorSectionComponent, IconAttributeDisplayComponent, ImageAttributeDisplayComponent, ImageCropperComponent, ImagepickerComponent, LayoutEditorFieldElementComponent, LayoutEditorPageComponent, LayoutEditorTableColumnElementComponent, LayoutEditorWidgetElementComponent, LinkAttributeDisplayComponent, ListPageComponent, ListPageDataSource, LoaderComponent, LocaleService, MANTLE_LANG_EN, MANTLE_LANG_MS, MantleModule, MapDisplayComponent, MarkdownAttributeDisplayComponent, MarkdownDetailsSectionComponent, MarkdownInputComponent, MarkdownLayoutEditorSectionComponent, MaterialModule, MultiselectDisplayComponent, MultiselectInputComponent, NavTreeComponent, NumberInputComponent, ObjectService, ObscuredInputComponent, PIE_CHART, PROGRESS_BAR_CHART, PageTitleComponent, PasswordCheckGuard, PasswordCheckService, PasswordInputComponent, PlainCustomDashboardContainerComponent, PlainDashboardContainerComponent, PlainDetailsContainerComponent, PlainFormContainerComponent, PlainLayoutEditorContainerComponent, QrCodeDialogComponent, ReportConfigInputComponent, ReportDetailsSectionComponent, ReportViewerDisplayComponent, RerouteComponent, RichTextDisplayComponent, RichTextInputComponent, RosterPageComponent, RosterShiftListDetailsSectionComponent, RosterShiftListFormSectionComponent, SPLINE_CHART, SaveConfirmationDialogComponent, ScreenSizeMap, ScreenSizeService, SearchPanelComponent, SectionTitleComponent, SecureImagePipe, SessionGuard, SnackbarComponent, TabbedPageComponent, TableDetailsSectionComponent, TableFormSectionComponent, TableLayoutEditorSectionComponent, TextInputComponent, TextareaComponent, ThumbnailDisplayComponent, TimeInputComponent, TooltipComponent, WebApiListRequest, WebApiService, WebsocketService };
 //# sourceMappingURL=codetectonics-mantle.mjs.map