@messaia/cdk-cms 21.1.0-rc.21 → 21.1.0-rc.22

package/fesm2022/messaia-cdk-cms.mjs

@@ -698,7 +698,7 @@ class ContentFormComponent extends GenericReactiveFormComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ContentFormComponent, deps: [{ token: ContentService }, { token: i2.FileService }, { token: i3.HttpClient }, { token: i3$1.ActivatedRoute }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ContentFormComponent, isStandalone: true, selector: "app-content-form", viewQueries: [{ propertyName: "formElement", first: true, predicate: ["form"], descendants: true }, { propertyName: "editorComponent", first: true, predicate: ["editor"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<vd-layout-nav color=\"primary\" [backNavigationRoute]=\"listRoute\" toolbarTitle=\"Content\" i18n-toolbarTitle=\"@@content\" [editMode]=\"isEditMode\" [actions]=\"toolbarActions\" [data]=\"item\" [context]=\"this\">\r\n    @if (form) {\r\n        <form [formGroup]=\"form\" novalidate (ngSubmit)=\"save()\">\r\n            <vd-layout-card-over class=\"accordion\" cardWidth=\"70\" color=\"primary\" flex>\r\n                <mat-accordion [multi]=\"!isEditMode\">\r\n                    <!-- #region Details -->\r\n                    <mat-expansion-panel expanded=\"true\" id=\"details\">\r\n                        <mat-expansion-panel-header>\r\n                            <mat-panel-title i18n=\"@@details\">Details</mat-panel-title>\r\n                        </mat-expansion-panel-header>\r\n                        <ng-template matExpansionPanelContent>\r\n                            <vd-generic-form [formGroup]=\"form\" [fieldGroups]=\"fieldGroups\" [context]=\"this\">\r\n                                <ng-template vd-editor let-field=\"field\" let-formGroup=\"formGroup\">\r\n                                    <mat-form-field [attr.flex]=\"field.flex||0\" layout-margin appearance=\"outline\" flex>\r\n                                        <mat-label>{{field.label}}</mat-label>\r\n                                        <editor [formControlName]=\"field.name\" [init]=\"editorConfig\" tinyMatFormControl flex></editor>\r\n                                        @if (field.hint) {\r\n                                            <mat-hint>{{field.hint}}</mat-hint>\r\n                                        }\r\n                                        @for (errorMessage of formGroup.controls[field.name]['errorMessages']; track errorMessage) {\r\n                                            <mat-error>{{errorMessage}}</mat-error>\r\n                                        }\r\n                                    </mat-form-field>\r\n                                </ng-template>\r\n                            </vd-generic-form>\r\n                        </ng-template>\r\n                        <mat-action-row>\r\n                            <button type=\"submit\" mat-flat-button color=\"primary\" [disabled]=\"isSaving\" i18n=\"@@save\">Save</button>\r\n                            @if (isEditMode || true) {\r\n                                <button type=\"button\" mat-button (click)=\"apply()\" [disabled]=\"isSaving\" i18n=\"@@apply\">Apply</button>\r\n                            }\r\n                            <button type=\"button\" mat-button (click)=\"back()\" i18n=\"@@cancel\">Cancel</button>\r\n                            <span flex></span>\r\n                        </mat-action-row>\r\n                    </mat-expansion-panel>\r\n                    <!-- #endregion -->\r\n                    <!-- #region Audit -->\r\n                    @if (isEditMode) {\r\n                        <mat-expansion-panel id=\"audit\">\r\n                            <mat-expansion-panel-header>\r\n                                <mat-panel-title>\r\n                                    <span i18n=\"@@audit\">Audit</span>\r\n                                </mat-panel-title>\r\n                            </mat-expansion-panel-header>\r\n                            <ng-template matExpansionPanelContent>\r\n                                <vd-audit [entity]=\"item\"> </vd-audit>\r\n                            </ng-template>\r\n                            <mat-action-row>\r\n                                <button type=\"button\" mat-flat-button color=\"accent\" (click)=\"back()\" i18n=\"@@close\">Close</button>\r\n                                <span flex></span>\r\n                            </mat-action-row>\r\n                        </mat-expansion-panel>\r\n                    }\r\n                    <!-- #endregion -->\r\n                </mat-accordion>\r\n            </vd-layout-card-over>\r\n        </form>\r\n    }\r\n</vd-layout-nav>", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: RxReactiveFormsModule }, { kind: "directive", type: i2.AsyncValidationDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["async"] }, { kind: "directive", type: i2.RxwebFormDirective, selector: "[formGroup],[rxwebForm]", inputs: ["formGroup", "rxwebForm"] }, { kind: "directive", type: i2.RxFormControlDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["rxalpha", "rxalphaNumeric", "rxascii", "rxcompare", "rxcompose", "rxcontains", "rxcreditCard", "rxdataUri", "rxdifferent", "rxdigit", "rxemail", "rxendsWith", "rxeven", "rxextension", "rxfactor", "rxfileSize", "rxgreaterThanEqualTo", "rxgreaterThan", "rxhexColor", "rxjson", "rxlatitude", "rxlatLong", "rxleapYear", "rxlessThan", "rxlessThanEqualTo", "rxlongitude", "rxlowerCase", "rxmac", "rxmaxDate", "rxmaxLength", "rxmaxNumber", "rxminDate", "rxminLength", "rxminNumber", "rxnumeric", "rxodd", "rxpassword", "rxport", "rxprimeNumber", "rxrequired", "rxrange", "rxrule", "rxstartsWith", "rxtime", "rxupperCase", "rxurl", "rxunique", "rxnotEmpty", "rxcusip", "rxgrid", "rxdate"] }, { kind: "ngmodule", type: EditorModule }, { kind: "component", type: i6.EditorComponent, selector: "editor", inputs: ["cloudChannel", "apiKey", "licenseKey", "init", "id", "initialValue", "outputFormat", "inline", "tagName", "plugins", "toolbar", "modelEvents", "allowedEvents", "ignoreEvents", "disabled"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i7.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i7.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: i7.MatExpansionPanelActionRow, selector: "mat-action-row" }, { kind: "component", type: i7.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i7.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i7.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i8.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i9.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: "directive", type: MatFormFieldEditorDirective, selector: "[tinyMatFormControl]", inputs: ["errorStateMatcher", "disabled", "id", "placeholder", "required", "value"], outputs: ["editorChange"] }, { kind: "component", type: VdLayoutNavComponent, selector: "vd-layout-nav", inputs: ["toolbarTitle", "editMode", "actions", "data", "context", "hideToolbar", "icon", "logo", "color", "hideToggle", "backNavigationRoute", "navigationRoute"], outputs: ["reload"] }, { kind: "component", type: VdLayoutCardOverComponent, selector: "vd-layout-card-over", inputs: ["cardTitle", "cardSubtitle", "cardWidth", "color"] }, { kind: "component", type: VdGenericFormComponent, selector: "vd-generic-form", inputs: ["formGroup", "classType", "formDefinition", "fieldGroups", "groupName", "fieldSets", "context", "debugValue", "readonly", "separatorKeysCodes"] }, { kind: "directive", type: VdEditorDirective, selector: "[vd-editor]ng-template" }, { kind: "component", type: VdAuditComponent, selector: "vd-audit", inputs: ["entity"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ContentFormComponent, isStandalone: true, selector: "app-content-form", viewQueries: [{ propertyName: "formElement", first: true, predicate: ["form"], descendants: true }, { propertyName: "editorComponent", first: true, predicate: ["editor"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<vd-layout-nav color=\"primary\" [backNavigationRoute]=\"listRoute\" toolbarTitle=\"Content\" i18n-toolbarTitle=\"@@content\" [editMode]=\"isEditMode\" [actions]=\"toolbarActions\" [data]=\"item\" [context]=\"this\">\r\n    @if (form) {\r\n        <form [formGroup]=\"form\" novalidate (ngSubmit)=\"save()\">\r\n            <vd-layout-card-over class=\"accordion\" cardWidth=\"70\" color=\"primary\" flex>\r\n                <mat-accordion [multi]=\"!isEditMode\">\r\n                    <!-- #region Details -->\r\n                    <mat-expansion-panel expanded=\"true\" id=\"details\">\r\n                        <mat-expansion-panel-header>\r\n                            <mat-panel-title i18n=\"@@details\">Details</mat-panel-title>\r\n                        </mat-expansion-panel-header>\r\n                        <ng-template matExpansionPanelContent>\r\n                            <vd-generic-form [formGroup]=\"form\" [fieldGroups]=\"fieldGroups\" [context]=\"this\">\r\n                                <ng-template vd-editor let-field=\"field\" let-formGroup=\"formGroup\">\r\n                                    <mat-form-field [attr.flex]=\"field.flex||0\" layout-margin appearance=\"outline\" flex>\r\n                                        <mat-label>{{field.label}}</mat-label>\r\n                                        <editor [formControlName]=\"field.name\" [init]=\"editorConfig\" tinyMatFormControl flex></editor>\r\n                                        @if (field.hint) {\r\n                                            <mat-hint>{{field.hint}}</mat-hint>\r\n                                        }\r\n                                        @for (errorMessage of formGroup.controls[field.name]['errorMessages']; track errorMessage) {\r\n                                            <mat-error>{{errorMessage}}</mat-error>\r\n                                        }\r\n                                    </mat-form-field>\r\n                                </ng-template>\r\n                            </vd-generic-form>\r\n                        </ng-template>\r\n                        <mat-action-row>\r\n                            <button type=\"submit\" mat-flat-button color=\"primary\" [disabled]=\"isSaving\" i18n=\"@@save\">Save</button>\r\n                            @if (isEditMode || true) {\r\n                                <button type=\"button\" mat-button (click)=\"apply()\" [disabled]=\"isSaving\" i18n=\"@@apply\">Apply</button>\r\n                            }\r\n                            <button type=\"button\" mat-button (click)=\"back()\" i18n=\"@@cancel\">Cancel</button>\r\n                            <span flex></span>\r\n                        </mat-action-row>\r\n                    </mat-expansion-panel>\r\n                    <!-- #endregion -->\r\n                    <!-- #region Audit -->\r\n                    @if (isEditMode) {\r\n                        <mat-expansion-panel id=\"audit\">\r\n                            <mat-expansion-panel-header>\r\n                                <mat-panel-title>\r\n                                    <span i18n=\"@@audit\">Audit</span>\r\n                                </mat-panel-title>\r\n                            </mat-expansion-panel-header>\r\n                            <ng-template matExpansionPanelContent>\r\n                                <vd-audit [entity]=\"item\"> </vd-audit>\r\n                            </ng-template>\r\n                            <mat-action-row>\r\n                                <button type=\"button\" mat-flat-button color=\"accent\" (click)=\"back()\" i18n=\"@@close\">Close</button>\r\n                                <span flex></span>\r\n                            </mat-action-row>\r\n                        </mat-expansion-panel>\r\n                    }\r\n                    <!-- #endregion -->\r\n                </mat-accordion>\r\n            </vd-layout-card-over>\r\n        </form>\r\n    }\r\n</vd-layout-nav>", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: RxReactiveFormsModule }, { kind: "directive", type: i2.AsyncValidationDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["async"] }, { kind: "directive", type: i2.RxwebFormDirective, selector: "[formGroup],[rxwebForm]", inputs: ["formGroup", "rxwebForm"] }, { kind: "directive", type: i2.RxFormControlDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["rxalpha", "rxalphaNumeric", "rxascii", "rxcompare", "rxcompose", "rxcontains", "rxcreditCard", "rxdataUri", "rxdifferent", "rxdigit", "rxemail", "rxendsWith", "rxeven", "rxextension", "rxfactor", "rxfileSize", "rxgreaterThanEqualTo", "rxgreaterThan", "rxhexColor", "rxjson", "rxlatitude", "rxlatLong", "rxleapYear", "rxlessThan", "rxlessThanEqualTo", "rxlongitude", "rxlowerCase", "rxmac", "rxmaxDate", "rxmaxLength", "rxmaxNumber", "rxminDate", "rxminLength", "rxminNumber", "rxnumeric", "rxodd", "rxpassword", "rxport", "rxprimeNumber", "rxrequired", "rxrange", "rxrule", "rxstartsWith", "rxtime", "rxupperCase", "rxurl", "rxunique", "rxnotEmpty", "rxcusip", "rxgrid", "rxdate"] }, { kind: "ngmodule", type: EditorModule }, { kind: "component", type: i6.EditorComponent, selector: "editor", inputs: ["cloudChannel", "apiKey", "licenseKey", "init", "id", "initialValue", "outputFormat", "inline", "tagName", "plugins", "toolbar", "modelEvents", "allowedEvents", "ignoreEvents", "disabled"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i7.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i7.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: i7.MatExpansionPanelActionRow, selector: "mat-action-row" }, { kind: "component", type: i7.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i7.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i7.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i8.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i9.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: "directive", type: MatFormFieldEditorDirective, selector: "[tinyMatFormControl]", inputs: ["errorStateMatcher", "disabled", "id", "placeholder", "required", "value"], outputs: ["editorChange"] }, { kind: "component", type: VdLayoutNavComponent, selector: "vd-layout-nav", inputs: ["toolbarTitle", "editMode", "actions", "data", "context", "hideToolbar", "icon", "logo", "color", "hideToggle", "backNavigationRoute", "navigationRoute"], outputs: ["reload"] }, { kind: "component", type: VdLayoutCardOverComponent, selector: "vd-layout-card-over", inputs: ["cardTitle", "cardSubtitle", "cardWidth", "color"] }, { kind: "component", type: VdGenericFormComponent, selector: "vd-generic-form", inputs: ["formGroup", "classType", "formDefinition", "fieldGroups", "groupName", "fieldSets", "context", "debugValue", "readonly", "separatorKeysCodes"], outputs: ["init"] }, { kind: "directive", type: VdEditorDirective, selector: "[vd-editor]ng-template" }, { kind: "component", type: VdAuditComponent, selector: "vd-audit", inputs: ["entity"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ContentFormComponent, decorators: [{
             type: Component,
@@ -973,7 +973,7 @@ class DocumentDialogComponent extends DocumentFormBaseComponent {
         this.item.isPublic = true;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DocumentDialogComponent, deps: [{ token: DocumentService }, { token: i2.FileService }, { token: i3$1.ActivatedRoute }, { token: i0.ChangeDetectorRef }, { token: i4.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: DocumentDialogComponent, isStandalone: true, selector: "document-dialog", usesInheritance: true, ngImport: i0, template: "\n    <div mat-dialog-title class=\"mat-headline-6\" i18n=\"@@newDocument\">New document</div>\n    @if(form){\n        <form [formGroup]=\"form\" (ngSubmit)=\"save()\">\n            <vd-generic-form [formGroup]=\"form\" [fieldGroups]=\"fieldGroups\" [context]=\"this\">\n                <ng-template vd-file let-field=\"field\" let-formGroup=\"formGroup\">\n                    <mat-form-field [attr.flex]=\"field.flex||0\" layout-margin appearance=\"outline\">\n                        <mat-label>{{field.header}}</mat-label>\n                        <div vd-file-input [formControlName]=\"field.name\" (select)=\"upload($event)\" [accept]=\"field.fileExtensions\"></div>\n                    </mat-form-field>\n                </ng-template>\n            </vd-generic-form>\n            <div mat-dialog-actions class=\"pad-top\">\n                <button type=\"submit\" mat-flat-button [disabled]=\"isSaving\" color=\"primary\" i18n=\"@@save\">Save</button>\n                <button type=\"button\" mat-button (click)=\"cancel()\" i18n=\"@@cancel\">Cancel</button>\n            </div>\n        </form>\n    }", isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i4.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i4.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "component", type: VdGenericFormComponent, selector: "vd-generic-form", inputs: ["formGroup", "classType", "formDefinition", "fieldGroups", "groupName", "fieldSets", "context", "debugValue", "readonly", "separatorKeysCodes"] }, { kind: "component", type: VdFileInputComponent, selector: "[vd-file-input]", inputs: ["accept", "placeholder", "required", "multiple", "disabled", "errorState"], outputs: ["select", "clear"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: DocumentDialogComponent, isStandalone: true, selector: "document-dialog", usesInheritance: true, ngImport: i0, template: "\n    <div mat-dialog-title class=\"mat-headline-6\" i18n=\"@@newDocument\">New document</div>\n    @if(form){\n        <form [formGroup]=\"form\" (ngSubmit)=\"save()\">\n            <vd-generic-form [formGroup]=\"form\" [fieldGroups]=\"fieldGroups\" [context]=\"this\">\n                <ng-template vd-file let-field=\"field\" let-formGroup=\"formGroup\">\n                    <mat-form-field [attr.flex]=\"field.flex||0\" layout-margin appearance=\"outline\">\n                        <mat-label>{{field.header}}</mat-label>\n                        <div vd-file-input [formControlName]=\"field.name\" (select)=\"upload($event)\" [accept]=\"field.fileExtensions\"></div>\n                    </mat-form-field>\n                </ng-template>\n            </vd-generic-form>\n            <div mat-dialog-actions class=\"pad-top\">\n                <button type=\"submit\" mat-flat-button [disabled]=\"isSaving\" color=\"primary\" i18n=\"@@save\">Save</button>\n                <button type=\"button\" mat-button (click)=\"cancel()\" i18n=\"@@cancel\">Cancel</button>\n            </div>\n        </form>\n    }", isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i4.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i4.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "component", type: VdGenericFormComponent, selector: "vd-generic-form", inputs: ["formGroup", "classType", "formDefinition", "fieldGroups", "groupName", "fieldSets", "context", "debugValue", "readonly", "separatorKeysCodes"], outputs: ["init"] }, { kind: "component", type: VdFileInputComponent, selector: "[vd-file-input]", inputs: ["accept", "placeholder", "required", "multiple", "disabled", "errorState"], outputs: ["select", "clear"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DocumentDialogComponent, decorators: [{
             type: Component,
@@ -1295,7 +1295,7 @@ class FaqFormComponent extends GenericReactiveFormComponent {
         return (!this.canCreate || (!this.settings?.multitenantable && !this.settings?.multiClients)) || this.isClientAdmin;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: FaqFormComponent, deps: [{ token: FaqService }, { token: i2.FileService }, { token: i3.HttpClient }, { token: i3$1.ActivatedRoute }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: FaqFormComponent, isStandalone: true, selector: "app-faq-form", usesInheritance: true, ngImport: i0, template: "<vd-layout-nav color=\"primary\" [backNavigationRoute]=\"listRoute\" toolbarTitle=\"FAQ\" i18n-toolbarTitle=\"@@faq\" [editMode]=\"isEditMode\" [actions]=\"toolbarActions\" [data]=\"item\" [context]=\"this\">\r\n    @if (form) {\r\n        <form [formGroup]=\"form\" novalidate (ngSubmit)=\"save()\">\r\n            <vd-layout-card-over class=\"accordion\" cardWidth=\"70\" color=\"primary\" flex>\r\n                <mat-accordion [multi]=\"!isEditMode\">\r\n                    <!-- #region Details -->\r\n                    <mat-expansion-panel expanded=\"true\" id=\"details\">\r\n                        <mat-expansion-panel-header>\r\n                            <mat-panel-title i18n=\"@@details\">Details</mat-panel-title>\r\n                        </mat-expansion-panel-header>\r\n                        <ng-template matExpansionPanelContent>\r\n                            <vd-generic-form [formGroup]=\"form\" [fieldGroups]=\"fieldGroups\" [context]=\"this\">\r\n                                <ng-template vd-editor let-field=\"field\" let-formGroup=\"formGroup\">\r\n                                    <mat-form-field [attr.flex]=\"field.flex||0\" layout-margin appearance=\"outline\" flex>\r\n                                        <mat-label>{{field.label}}</mat-label>\r\n                                        <editor [formControlName]=\"field.name\" [init]=\"editorConfig\" tinyMatFormControl flex></editor>\r\n                                        @if (field.hint) {\r\n                                            <mat-hint>{{field.hint}}</mat-hint>\r\n                                        }\r\n                                        @for (errorMessage of formGroup.controls[field.name]['errorMessages']; track errorMessage) {\r\n                                            <mat-error>{{errorMessage}}</mat-error>\r\n                                        }\r\n                                    </mat-form-field>\r\n                                </ng-template>\r\n                            </vd-generic-form>\r\n                        </ng-template>\r\n                        <mat-action-row>\r\n                            <button type=\"submit\" mat-flat-button color=\"primary\" [disabled]=\"isSaving\" i18n=\"@@save\">Save</button>\r\n                            @if (isEditMode || true) {\r\n                                <button type=\"button\" mat-button (click)=\"apply()\" [disabled]=\"isSaving\" i18n=\"@@apply\">Apply</button>\r\n                            }\r\n                            <button type=\"button\" mat-button (click)=\"back()\" i18n=\"@@cancel\">Cancel</button>\r\n                            <span flex></span>\r\n                        </mat-action-row>\r\n                    </mat-expansion-panel>\r\n                    <!-- #endregion -->\r\n                    <!-- #region Audit -->\r\n                    @if (isEditMode) {\r\n                        <mat-expansion-panel id=\"audit\">\r\n                            <mat-expansion-panel-header>\r\n                                <mat-panel-title>\r\n                                    <span i18n=\"@@audit\">Audit</span>\r\n                                </mat-panel-title>\r\n                            </mat-expansion-panel-header>\r\n                            <ng-template matExpansionPanelContent>\r\n                                <vd-audit [entity]=\"item\"> </vd-audit>\r\n                            </ng-template>\r\n                            <mat-action-row>\r\n                                <button type=\"button\" mat-flat-button color=\"accent\" (click)=\"back()\" i18n=\"@@close\">Close</button>\r\n                                <span flex></span>\r\n                            </mat-action-row>\r\n                        </mat-expansion-panel>\r\n                    }\r\n                    <!-- #endregion -->\r\n                </mat-accordion>\r\n            </vd-layout-card-over>\r\n        </form>\r\n    }\r\n</vd-layout-nav>", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: RxReactiveFormsModule }, { kind: "directive", type: i2.AsyncValidationDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["async"] }, { kind: "directive", type: i2.RxwebFormDirective, selector: "[formGroup],[rxwebForm]", inputs: ["formGroup", "rxwebForm"] }, { kind: "directive", type: i2.RxFormControlDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["rxalpha", "rxalphaNumeric", "rxascii", "rxcompare", "rxcompose", "rxcontains", "rxcreditCard", "rxdataUri", "rxdifferent", "rxdigit", "rxemail", "rxendsWith", "rxeven", "rxextension", "rxfactor", "rxfileSize", "rxgreaterThanEqualTo", "rxgreaterThan", "rxhexColor", "rxjson", "rxlatitude", "rxlatLong", "rxleapYear", "rxlessThan", "rxlessThanEqualTo", "rxlongitude", "rxlowerCase", "rxmac", "rxmaxDate", "rxmaxLength", "rxmaxNumber", "rxminDate", "rxminLength", "rxminNumber", "rxnumeric", "rxodd", "rxpassword", "rxport", "rxprimeNumber", "rxrequired", "rxrange", "rxrule", "rxstartsWith", "rxtime", "rxupperCase", "rxurl", "rxunique", "rxnotEmpty", "rxcusip", "rxgrid", "rxdate"] }, { kind: "ngmodule", type: EditorModule }, { kind: "component", type: i6.EditorComponent, selector: "editor", inputs: ["cloudChannel", "apiKey", "licenseKey", "init", "id", "initialValue", "outputFormat", "inline", "tagName", "plugins", "toolbar", "modelEvents", "allowedEvents", "ignoreEvents", "disabled"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i7.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i7.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: i7.MatExpansionPanelActionRow, selector: "mat-action-row" }, { kind: "component", type: i7.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i7.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i7.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i8.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i9.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: "directive", type: MatFormFieldEditorDirective, selector: "[tinyMatFormControl]", inputs: ["errorStateMatcher", "disabled", "id", "placeholder", "required", "value"], outputs: ["editorChange"] }, { kind: "component", type: VdLayoutNavComponent, selector: "vd-layout-nav", inputs: ["toolbarTitle", "editMode", "actions", "data", "context", "hideToolbar", "icon", "logo", "color", "hideToggle", "backNavigationRoute", "navigationRoute"], outputs: ["reload"] }, { kind: "component", type: VdLayoutCardOverComponent, selector: "vd-layout-card-over", inputs: ["cardTitle", "cardSubtitle", "cardWidth", "color"] }, { kind: "component", type: VdGenericFormComponent, selector: "vd-generic-form", inputs: ["formGroup", "classType", "formDefinition", "fieldGroups", "groupName", "fieldSets", "context", "debugValue", "readonly", "separatorKeysCodes"] }, { kind: "directive", type: VdEditorDirective, selector: "[vd-editor]ng-template" }, { kind: "component", type: VdAuditComponent, selector: "vd-audit", inputs: ["entity"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: FaqFormComponent, isStandalone: true, selector: "app-faq-form", usesInheritance: true, ngImport: i0, template: "<vd-layout-nav color=\"primary\" [backNavigationRoute]=\"listRoute\" toolbarTitle=\"FAQ\" i18n-toolbarTitle=\"@@faq\" [editMode]=\"isEditMode\" [actions]=\"toolbarActions\" [data]=\"item\" [context]=\"this\">\r\n    @if (form) {\r\n        <form [formGroup]=\"form\" novalidate (ngSubmit)=\"save()\">\r\n            <vd-layout-card-over class=\"accordion\" cardWidth=\"70\" color=\"primary\" flex>\r\n                <mat-accordion [multi]=\"!isEditMode\">\r\n                    <!-- #region Details -->\r\n                    <mat-expansion-panel expanded=\"true\" id=\"details\">\r\n                        <mat-expansion-panel-header>\r\n                            <mat-panel-title i18n=\"@@details\">Details</mat-panel-title>\r\n                        </mat-expansion-panel-header>\r\n                        <ng-template matExpansionPanelContent>\r\n                            <vd-generic-form [formGroup]=\"form\" [fieldGroups]=\"fieldGroups\" [context]=\"this\">\r\n                                <ng-template vd-editor let-field=\"field\" let-formGroup=\"formGroup\">\r\n                                    <mat-form-field [attr.flex]=\"field.flex||0\" layout-margin appearance=\"outline\" flex>\r\n                                        <mat-label>{{field.label}}</mat-label>\r\n                                        <editor [formControlName]=\"field.name\" [init]=\"editorConfig\" tinyMatFormControl flex></editor>\r\n                                        @if (field.hint) {\r\n                                            <mat-hint>{{field.hint}}</mat-hint>\r\n                                        }\r\n                                        @for (errorMessage of formGroup.controls[field.name]['errorMessages']; track errorMessage) {\r\n                                            <mat-error>{{errorMessage}}</mat-error>\r\n                                        }\r\n                                    </mat-form-field>\r\n                                </ng-template>\r\n                            </vd-generic-form>\r\n                        </ng-template>\r\n                        <mat-action-row>\r\n                            <button type=\"submit\" mat-flat-button color=\"primary\" [disabled]=\"isSaving\" i18n=\"@@save\">Save</button>\r\n                            @if (isEditMode || true) {\r\n                                <button type=\"button\" mat-button (click)=\"apply()\" [disabled]=\"isSaving\" i18n=\"@@apply\">Apply</button>\r\n                            }\r\n                            <button type=\"button\" mat-button (click)=\"back()\" i18n=\"@@cancel\">Cancel</button>\r\n                            <span flex></span>\r\n                        </mat-action-row>\r\n                    </mat-expansion-panel>\r\n                    <!-- #endregion -->\r\n                    <!-- #region Audit -->\r\n                    @if (isEditMode) {\r\n                        <mat-expansion-panel id=\"audit\">\r\n                            <mat-expansion-panel-header>\r\n                                <mat-panel-title>\r\n                                    <span i18n=\"@@audit\">Audit</span>\r\n                                </mat-panel-title>\r\n                            </mat-expansion-panel-header>\r\n                            <ng-template matExpansionPanelContent>\r\n                                <vd-audit [entity]=\"item\"> </vd-audit>\r\n                            </ng-template>\r\n                            <mat-action-row>\r\n                                <button type=\"button\" mat-flat-button color=\"accent\" (click)=\"back()\" i18n=\"@@close\">Close</button>\r\n                                <span flex></span>\r\n                            </mat-action-row>\r\n                        </mat-expansion-panel>\r\n                    }\r\n                    <!-- #endregion -->\r\n                </mat-accordion>\r\n            </vd-layout-card-over>\r\n        </form>\r\n    }\r\n</vd-layout-nav>", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: RxReactiveFormsModule }, { kind: "directive", type: i2.AsyncValidationDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["async"] }, { kind: "directive", type: i2.RxwebFormDirective, selector: "[formGroup],[rxwebForm]", inputs: ["formGroup", "rxwebForm"] }, { kind: "directive", type: i2.RxFormControlDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["rxalpha", "rxalphaNumeric", "rxascii", "rxcompare", "rxcompose", "rxcontains", "rxcreditCard", "rxdataUri", "rxdifferent", "rxdigit", "rxemail", "rxendsWith", "rxeven", "rxextension", "rxfactor", "rxfileSize", "rxgreaterThanEqualTo", "rxgreaterThan", "rxhexColor", "rxjson", "rxlatitude", "rxlatLong", "rxleapYear", "rxlessThan", "rxlessThanEqualTo", "rxlongitude", "rxlowerCase", "rxmac", "rxmaxDate", "rxmaxLength", "rxmaxNumber", "rxminDate", "rxminLength", "rxminNumber", "rxnumeric", "rxodd", "rxpassword", "rxport", "rxprimeNumber", "rxrequired", "rxrange", "rxrule", "rxstartsWith", "rxtime", "rxupperCase", "rxurl", "rxunique", "rxnotEmpty", "rxcusip", "rxgrid", "rxdate"] }, { kind: "ngmodule", type: EditorModule }, { kind: "component", type: i6.EditorComponent, selector: "editor", inputs: ["cloudChannel", "apiKey", "licenseKey", "init", "id", "initialValue", "outputFormat", "inline", "tagName", "plugins", "toolbar", "modelEvents", "allowedEvents", "ignoreEvents", "disabled"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i7.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i7.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: i7.MatExpansionPanelActionRow, selector: "mat-action-row" }, { kind: "component", type: i7.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i7.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i7.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i8.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i9.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: "directive", type: MatFormFieldEditorDirective, selector: "[tinyMatFormControl]", inputs: ["errorStateMatcher", "disabled", "id", "placeholder", "required", "value"], outputs: ["editorChange"] }, { kind: "component", type: VdLayoutNavComponent, selector: "vd-layout-nav", inputs: ["toolbarTitle", "editMode", "actions", "data", "context", "hideToolbar", "icon", "logo", "color", "hideToggle", "backNavigationRoute", "navigationRoute"], outputs: ["reload"] }, { kind: "component", type: VdLayoutCardOverComponent, selector: "vd-layout-card-over", inputs: ["cardTitle", "cardSubtitle", "cardWidth", "color"] }, { kind: "component", type: VdGenericFormComponent, selector: "vd-generic-form", inputs: ["formGroup", "classType", "formDefinition", "fieldGroups", "groupName", "fieldSets", "context", "debugValue", "readonly", "separatorKeysCodes"], outputs: ["init"] }, { kind: "directive", type: VdEditorDirective, selector: "[vd-editor]ng-template" }, { kind: "component", type: VdAuditComponent, selector: "vd-audit", inputs: ["entity"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: FaqFormComponent, decorators: [{
             type: Component,
@@ -2112,7 +2112,7 @@ class TemplateFormComponent extends GenericReactiveFormComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TemplateFormComponent, deps: [{ token: TemplateService }, { token: TemplateDocService }, { token: i2.FileService }, { token: i4.MatDialog }, { token: i3$1.ActivatedRoute }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: TemplateFormComponent, isStandalone: true, selector: "app-template-form", usesInheritance: true, ngImport: i0, template: "<vd-layout-nav color=\"primary\" [backNavigationRoute]=\"listRoute\" toolbarTitle=\"Template\" i18n-toolbarTitle=\"@@template\" [editMode]=\"isEditMode\" [actions]=\"toolbarActions\" [data]=\"item\" [context]=\"this\">\r\n    @if (form) {\r\n        <form [formGroup]=\"form\" novalidate (ngSubmit)=\"save()\">\r\n            <vd-layout-card-over class=\"accordion\" cardWidth=\"70\" color=\"primary\" flex>\r\n                <mat-accordion [multi]=\"!isEditMode\">\r\n                    <!-- #region Details -->\r\n                    <mat-expansion-panel expanded=\"true\" id=\"details\">\r\n                        <mat-expansion-panel-header>\r\n                            <mat-panel-title i18n=\"@@details\">Details</mat-panel-title>\r\n                        </mat-expansion-panel-header>\r\n                        <ng-template matExpansionPanelContent>\r\n                            <vd-generic-form [formGroup]=\"form\" [fieldGroups]=\"fieldGroups\" [fieldSets]=\"['details']\" [context]=\"this\"></vd-generic-form>\r\n                        </ng-template>\r\n                        <mat-action-row>\r\n                            <button type=\"submit\" mat-flat-button color=\"primary\" [disabled]=\"isSaving\" i18n=\"@@save\">Save</button>\r\n                            @if (isEditMode) {\r\n                                <button type=\"button\" mat-button (click)=\"apply()\" [disabled]=\"isSaving\" i18n=\"@@apply\">Apply</button>\r\n                            }\r\n                            <button type=\"button\" mat-button (click)=\"back()\" i18n=\"@@cancel\">Cancel</button>\r\n                            <span flex></span>\r\n                        </mat-action-row>\r\n                    </mat-expansion-panel>\r\n                    <!-- #endregion -->\r\n                    <!-- #region Content -->\r\n                    <mat-expansion-panel id=\"content\">\r\n                        <mat-expansion-panel-header>\r\n                            <mat-panel-title>\r\n                                <span i18n=\"@@content\">Content</span>\r\n                            </mat-panel-title>\r\n                        </mat-expansion-panel-header>\r\n                        <ng-template matExpansionPanelContent>\r\n                            <div layout-margin>\r\n                                <ngx-codemirror formControlName=\"content\" rows=\"160\" [options]=\"editorOptions\"></ngx-codemirror>\r\n                            </div>\r\n                        </ng-template>\r\n                        <mat-action-row>\r\n                            <button type=\"submit\" mat-flat-button color=\"primary\" [disabled]=\"isSaving\" i18n=\"@@save\">Save</button>\r\n                            @if (isEditMode) {\r\n                                <button type=\"button\" mat-button (click)=\"apply()\" [disabled]=\"isSaving\" i18n=\"@@apply\">Apply</button>\r\n                            }\r\n                            @if (isEditMode) {\r\n                                <button type=\"button\" mat-button (click)=\"showPreview()\" [disabled]=\"isSaving || !form.pristine\" i18n=\"@@preview\">Preview</button>\r\n                            }\r\n                            <button type=\"button\" mat-button (click)=\"back()\" i18n=\"@@cancel\">Cancel</button>\r\n                            <span flex></span>\r\n                        </mat-action-row>\r\n                    </mat-expansion-panel>\r\n                    <!-- #endregion -->\r\n                    <!-- #region Content -->\r\n                    <mat-expansion-panel id=\"testData\">\r\n                        <mat-expansion-panel-header>\r\n                            <mat-panel-title>\r\n                                <span i18n=\"@@testData\">Test Data</span>\r\n                            </mat-panel-title>\r\n                        </mat-expansion-panel-header>\r\n                        <ng-template matExpansionPanelContent>\r\n                            <div layout-margin>\r\n                                <ngx-codemirror formControlName=\"dummyData\" rows=\"120\" [options]=\"jsonEditorOptions\"></ngx-codemirror>\r\n                            </div>\r\n                        </ng-template>\r\n                        <mat-action-row>\r\n                            <button type=\"submit\" mat-flat-button color=\"primary\" [disabled]=\"isSaving\" i18n=\"@@save\">Save</button>\r\n                            @if (isEditMode) {\r\n                                <button type=\"button\" mat-button (click)=\"apply()\" [disabled]=\"isSaving\" i18n=\"@@apply\">Apply</button>\r\n                            }\r\n                            @if (isEditMode) {\r\n                                <button type=\"button\" mat-button (click)=\"showPreview()\" [disabled]=\"isSaving || !form.pristine\" i18n=\"@@preview\">Preview</button>\r\n                            }\r\n                            <button type=\"button\" mat-button (click)=\"back()\" i18n=\"@@cancel\">Cancel</button>\r\n                            <span flex></span>\r\n                        </mat-action-row>\r\n                    </mat-expansion-panel>\r\n                    <!-- #endregion -->\r\n                    <!-- #region Audit -->\r\n                    @if (isEditMode) {\r\n                        <mat-expansion-panel id=\"audit\">\r\n                            <mat-expansion-panel-header>\r\n                                <mat-panel-title>\r\n                                    <span i18n=\"@@audit\">Audit</span>\r\n                                </mat-panel-title>\r\n                            </mat-expansion-panel-header>\r\n                            <ng-template matExpansionPanelContent>\r\n                                <vd-audit [entity]=\"item\"> </vd-audit>\r\n                            </ng-template>\r\n                            <mat-action-row>\r\n                                <button type=\"button\" mat-flat-button color=\"accent\" (click)=\"back()\" i18n=\"@@close\">Close</button>\r\n                                <span flex></span>\r\n                            </mat-action-row>\r\n                        </mat-expansion-panel>\r\n                    }\r\n                    <!-- #endregion -->\r\n                </mat-accordion>\r\n            </vd-layout-card-over>\r\n        </form>\r\n    }\r\n</vd-layout-nav>", styles: ["codemirror{width:100%}.CodeMirror{height:500px}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: RxReactiveFormsModule }, { kind: "directive", type: i2.AsyncValidationDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["async"] }, { kind: "directive", type: i2.RxwebFormDirective, selector: "[formGroup],[rxwebForm]", inputs: ["formGroup", "rxwebForm"] }, { kind: "directive", type: i2.RxFormControlDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["rxalpha", "rxalphaNumeric", "rxascii", "rxcompare", "rxcompose", "rxcontains", "rxcreditCard", "rxdataUri", "rxdifferent", "rxdigit", "rxemail", "rxendsWith", "rxeven", "rxextension", "rxfactor", "rxfileSize", "rxgreaterThanEqualTo", "rxgreaterThan", "rxhexColor", "rxjson", "rxlatitude", "rxlatLong", "rxleapYear", "rxlessThan", "rxlessThanEqualTo", "rxlongitude", "rxlowerCase", "rxmac", "rxmaxDate", "rxmaxLength", "rxmaxNumber", "rxminDate", "rxminLength", "rxminNumber", "rxnumeric", "rxodd", "rxpassword", "rxport", "rxprimeNumber", "rxrequired", "rxrange", "rxrule", "rxstartsWith", "rxtime", "rxupperCase", "rxurl", "rxunique", "rxnotEmpty", "rxcusip", "rxgrid", "rxdate"] }, { kind: "ngmodule", type: CodemirrorModule }, { kind: "component", type: i7$2.CodemirrorComponent, selector: "ngx-codemirror", inputs: ["className", "name", "autoFocus", "options", "preserveScrollPosition"], outputs: ["cursorActivity", "focusChange", "scroll", "drop", "codeMirrorLoaded"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i7.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i7.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: i7.MatExpansionPanelActionRow, selector: "mat-action-row" }, { kind: "component", type: i7.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i7.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i7.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i9.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: VdLayoutNavComponent, selector: "vd-layout-nav", inputs: ["toolbarTitle", "editMode", "actions", "data", "context", "hideToolbar", "icon", "logo", "color", "hideToggle", "backNavigationRoute", "navigationRoute"], outputs: ["reload"] }, { kind: "component", type: VdLayoutCardOverComponent, selector: "vd-layout-card-over", inputs: ["cardTitle", "cardSubtitle", "cardWidth", "color"] }, { kind: "component", type: VdGenericFormComponent, selector: "vd-generic-form", inputs: ["formGroup", "classType", "formDefinition", "fieldGroups", "groupName", "fieldSets", "context", "debugValue", "readonly", "separatorKeysCodes"] }, { kind: "component", type: VdAuditComponent, selector: "vd-audit", inputs: ["entity"] }], encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: TemplateFormComponent, isStandalone: true, selector: "app-template-form", usesInheritance: true, ngImport: i0, template: "<vd-layout-nav color=\"primary\" [backNavigationRoute]=\"listRoute\" toolbarTitle=\"Template\" i18n-toolbarTitle=\"@@template\" [editMode]=\"isEditMode\" [actions]=\"toolbarActions\" [data]=\"item\" [context]=\"this\">\r\n    @if (form) {\r\n        <form [formGroup]=\"form\" novalidate (ngSubmit)=\"save()\">\r\n            <vd-layout-card-over class=\"accordion\" cardWidth=\"70\" color=\"primary\" flex>\r\n                <mat-accordion [multi]=\"!isEditMode\">\r\n                    <!-- #region Details -->\r\n                    <mat-expansion-panel expanded=\"true\" id=\"details\">\r\n                        <mat-expansion-panel-header>\r\n                            <mat-panel-title i18n=\"@@details\">Details</mat-panel-title>\r\n                        </mat-expansion-panel-header>\r\n                        <ng-template matExpansionPanelContent>\r\n                            <vd-generic-form [formGroup]=\"form\" [fieldGroups]=\"fieldGroups\" [fieldSets]=\"['details']\" [context]=\"this\"></vd-generic-form>\r\n                        </ng-template>\r\n                        <mat-action-row>\r\n                            <button type=\"submit\" mat-flat-button color=\"primary\" [disabled]=\"isSaving\" i18n=\"@@save\">Save</button>\r\n                            @if (isEditMode) {\r\n                                <button type=\"button\" mat-button (click)=\"apply()\" [disabled]=\"isSaving\" i18n=\"@@apply\">Apply</button>\r\n                            }\r\n                            <button type=\"button\" mat-button (click)=\"back()\" i18n=\"@@cancel\">Cancel</button>\r\n                            <span flex></span>\r\n                        </mat-action-row>\r\n                    </mat-expansion-panel>\r\n                    <!-- #endregion -->\r\n                    <!-- #region Content -->\r\n                    <mat-expansion-panel id=\"content\">\r\n                        <mat-expansion-panel-header>\r\n                            <mat-panel-title>\r\n                                <span i18n=\"@@content\">Content</span>\r\n                            </mat-panel-title>\r\n                        </mat-expansion-panel-header>\r\n                        <ng-template matExpansionPanelContent>\r\n                            <div layout-margin>\r\n                                <ngx-codemirror formControlName=\"content\" rows=\"160\" [options]=\"editorOptions\"></ngx-codemirror>\r\n                            </div>\r\n                        </ng-template>\r\n                        <mat-action-row>\r\n                            <button type=\"submit\" mat-flat-button color=\"primary\" [disabled]=\"isSaving\" i18n=\"@@save\">Save</button>\r\n                            @if (isEditMode) {\r\n                                <button type=\"button\" mat-button (click)=\"apply()\" [disabled]=\"isSaving\" i18n=\"@@apply\">Apply</button>\r\n                            }\r\n                            @if (isEditMode) {\r\n                                <button type=\"button\" mat-button (click)=\"showPreview()\" [disabled]=\"isSaving || !form.pristine\" i18n=\"@@preview\">Preview</button>\r\n                            }\r\n                            <button type=\"button\" mat-button (click)=\"back()\" i18n=\"@@cancel\">Cancel</button>\r\n                            <span flex></span>\r\n                        </mat-action-row>\r\n                    </mat-expansion-panel>\r\n                    <!-- #endregion -->\r\n                    <!-- #region Content -->\r\n                    <mat-expansion-panel id=\"testData\">\r\n                        <mat-expansion-panel-header>\r\n                            <mat-panel-title>\r\n                                <span i18n=\"@@testData\">Test Data</span>\r\n                            </mat-panel-title>\r\n                        </mat-expansion-panel-header>\r\n                        <ng-template matExpansionPanelContent>\r\n                            <div layout-margin>\r\n                                <ngx-codemirror formControlName=\"dummyData\" rows=\"120\" [options]=\"jsonEditorOptions\"></ngx-codemirror>\r\n                            </div>\r\n                        </ng-template>\r\n                        <mat-action-row>\r\n                            <button type=\"submit\" mat-flat-button color=\"primary\" [disabled]=\"isSaving\" i18n=\"@@save\">Save</button>\r\n                            @if (isEditMode) {\r\n                                <button type=\"button\" mat-button (click)=\"apply()\" [disabled]=\"isSaving\" i18n=\"@@apply\">Apply</button>\r\n                            }\r\n                            @if (isEditMode) {\r\n                                <button type=\"button\" mat-button (click)=\"showPreview()\" [disabled]=\"isSaving || !form.pristine\" i18n=\"@@preview\">Preview</button>\r\n                            }\r\n                            <button type=\"button\" mat-button (click)=\"back()\" i18n=\"@@cancel\">Cancel</button>\r\n                            <span flex></span>\r\n                        </mat-action-row>\r\n                    </mat-expansion-panel>\r\n                    <!-- #endregion -->\r\n                    <!-- #region Audit -->\r\n                    @if (isEditMode) {\r\n                        <mat-expansion-panel id=\"audit\">\r\n                            <mat-expansion-panel-header>\r\n                                <mat-panel-title>\r\n                                    <span i18n=\"@@audit\">Audit</span>\r\n                                </mat-panel-title>\r\n                            </mat-expansion-panel-header>\r\n                            <ng-template matExpansionPanelContent>\r\n                                <vd-audit [entity]=\"item\"> </vd-audit>\r\n                            </ng-template>\r\n                            <mat-action-row>\r\n                                <button type=\"button\" mat-flat-button color=\"accent\" (click)=\"back()\" i18n=\"@@close\">Close</button>\r\n                                <span flex></span>\r\n                            </mat-action-row>\r\n                        </mat-expansion-panel>\r\n                    }\r\n                    <!-- #endregion -->\r\n                </mat-accordion>\r\n            </vd-layout-card-over>\r\n        </form>\r\n    }\r\n</vd-layout-nav>", styles: ["codemirror{width:100%}.CodeMirror{height:500px}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: RxReactiveFormsModule }, { kind: "directive", type: i2.AsyncValidationDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["async"] }, { kind: "directive", type: i2.RxwebFormDirective, selector: "[formGroup],[rxwebForm]", inputs: ["formGroup", "rxwebForm"] }, { kind: "directive", type: i2.RxFormControlDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["rxalpha", "rxalphaNumeric", "rxascii", "rxcompare", "rxcompose", "rxcontains", "rxcreditCard", "rxdataUri", "rxdifferent", "rxdigit", "rxemail", "rxendsWith", "rxeven", "rxextension", "rxfactor", "rxfileSize", "rxgreaterThanEqualTo", "rxgreaterThan", "rxhexColor", "rxjson", "rxlatitude", "rxlatLong", "rxleapYear", "rxlessThan", "rxlessThanEqualTo", "rxlongitude", "rxlowerCase", "rxmac", "rxmaxDate", "rxmaxLength", "rxmaxNumber", "rxminDate", "rxminLength", "rxminNumber", "rxnumeric", "rxodd", "rxpassword", "rxport", "rxprimeNumber", "rxrequired", "rxrange", "rxrule", "rxstartsWith", "rxtime", "rxupperCase", "rxurl", "rxunique", "rxnotEmpty", "rxcusip", "rxgrid", "rxdate"] }, { kind: "ngmodule", type: CodemirrorModule }, { kind: "component", type: i7$2.CodemirrorComponent, selector: "ngx-codemirror", inputs: ["className", "name", "autoFocus", "options", "preserveScrollPosition"], outputs: ["cursorActivity", "focusChange", "scroll", "drop", "codeMirrorLoaded"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i7.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i7.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: i7.MatExpansionPanelActionRow, selector: "mat-action-row" }, { kind: "component", type: i7.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i7.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i7.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i9.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: VdLayoutNavComponent, selector: "vd-layout-nav", inputs: ["toolbarTitle", "editMode", "actions", "data", "context", "hideToolbar", "icon", "logo", "color", "hideToggle", "backNavigationRoute", "navigationRoute"], outputs: ["reload"] }, { kind: "component", type: VdLayoutCardOverComponent, selector: "vd-layout-card-over", inputs: ["cardTitle", "cardSubtitle", "cardWidth", "color"] }, { kind: "component", type: VdGenericFormComponent, selector: "vd-generic-form", inputs: ["formGroup", "classType", "formDefinition", "fieldGroups", "groupName", "fieldSets", "context", "debugValue", "readonly", "separatorKeysCodes"], outputs: ["init"] }, { kind: "component", type: VdAuditComponent, selector: "vd-audit", inputs: ["entity"] }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TemplateFormComponent, decorators: [{
             type: Component,