mmhglobal-dynamicform 2.23.3 → 2.23.5

package/README.md

@@ -3,6 +3,12 @@
 This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 11.2.13.
 
 ## Changelog 
+`2.23.5`<br/>
+[zgrid] - implemented onExcelExport for formatting the cell in the excel when Export data.
+
+`2.23.4`<br/>
+[zgrid]- use the ExportDataResourceURL value set in the field element when Export data.
+
 `2.23.3`<br/>
 [textarea]- Fix bug readonly textarea not scrollable #3481.<br/>
 [textarea]- Character counter allow to ignore white space. #2934<br/>

package/esm2020/lib/components/buttonfieldbase.component.mjs

@@ -60,9 +60,9 @@ export class ButtonFieldBase extends FieldBase {
         }
     }
 }
-ButtonFieldBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ButtonFieldBase, deps: [{ token: i1.ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
-ButtonFieldBase.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: ButtonFieldBase, selector: "ng-component", usesInheritance: true, ngImport: i0, template: ``, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ButtonFieldBase, decorators: [{
+ButtonFieldBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ButtonFieldBase, deps: [{ token: i1.ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
+ButtonFieldBase.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ButtonFieldBase, selector: "ng-component", usesInheritance: true, ngImport: i0, template: ``, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ButtonFieldBase, decorators: [{
             type: Component,
             args: [{
                     template: ``,

package/esm2020/lib/components/containerfieldbase.component.mjs

@@ -39,9 +39,9 @@ export class ContainerFieldBase extends FieldBase {
         this.triggerEvent("container-OnCollapse", this.data.OnCollapse, event, fieldValue);
     }
 }
-ContainerFieldBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ContainerFieldBase, deps: [{ token: i1.ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
-ContainerFieldBase.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: ContainerFieldBase, selector: "ng-component", usesInheritance: true, ngImport: i0, template: ``, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ContainerFieldBase, decorators: [{
+ContainerFieldBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ContainerFieldBase, deps: [{ token: i1.ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
+ContainerFieldBase.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ContainerFieldBase, selector: "ng-component", usesInheritance: true, ngImport: i0, template: ``, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ContainerFieldBase, decorators: [{
             type: Component,
             args: [{
                     template: ``,

package/esm2020/lib/components/datalistingfieldbase.component.mjs

@@ -149,9 +149,9 @@ export class DataListingFieldBase extends FieldBase {
         }
     }
 }
-DataListingFieldBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: DataListingFieldBase, deps: [{ token: i1.ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
-DataListingFieldBase.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: DataListingFieldBase, selector: "ng-component", outputs: { showFormPage: "showFormPage" }, viewQueries: [{ propertyName: "popovercontainer", first: true, predicate: ["popovercontainer"], descendants: true }, { propertyName: "dataItemContextMenu", first: true, predicate: ["dataitemcontextmenu"], descendants: true }], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: DataListingFieldBase, decorators: [{
+DataListingFieldBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: DataListingFieldBase, deps: [{ token: i1.ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
+DataListingFieldBase.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: DataListingFieldBase, selector: "ng-component", outputs: { showFormPage: "showFormPage" }, viewQueries: [{ propertyName: "popovercontainer", first: true, predicate: ["popovercontainer"], descendants: true }, { propertyName: "dataItemContextMenu", first: true, predicate: ["dataitemcontextmenu"], descendants: true }], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: DataListingFieldBase, decorators: [{
             type: Component,
             args: [{
                     template: ``,

package/esm2020/lib/components/fieldbase.component.mjs

@@ -154,9 +154,9 @@ export class FieldBase {
         return fieldValue;
     }
 }
-FieldBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FieldBase, deps: [{ token: i1.ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
-FieldBase.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FieldBase, selector: "ng-component", inputs: { data: "data", group: "group", form: "form", containerField: "containerField", componentProperties: "componentProperties" }, ngImport: i0, template: ``, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FieldBase, decorators: [{
+FieldBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: FieldBase, deps: [{ token: i1.ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
+FieldBase.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: FieldBase, selector: "ng-component", inputs: { data: "data", group: "group", form: "form", containerField: "containerField", componentProperties: "componentProperties" }, ngImport: i0, template: ``, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: FieldBase, decorators: [{
             type: Component,
             args: [{
                     template: ``,

package/esm2020/lib/components/inputfieldbase.component.mjs

@@ -188,9 +188,9 @@ export class InputFieldBase extends FieldBase {
         }
     }
 }
-InputFieldBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputFieldBase, deps: [{ token: i1.ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
-InputFieldBase.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: InputFieldBase, selector: "ng-component", outputs: { triggerContainerEvent: "triggerContainerEvent" }, usesInheritance: true, ngImport: i0, template: ``, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputFieldBase, decorators: [{
+InputFieldBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: InputFieldBase, deps: [{ token: i1.ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
+InputFieldBase.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: InputFieldBase, selector: "ng-component", outputs: { triggerContainerEvent: "triggerContainerEvent" }, usesInheritance: true, ngImport: i0, template: ``, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: InputFieldBase, decorators: [{
             type: Component,
             args: [{
                     template: ``,

package/esm2020/lib/directives/elementcontainer.directive.mjs

@@ -5,9 +5,9 @@ export class ElementContainerDirective {
         this.viewContainerRef = viewContainerRef;
     }
 }
-ElementContainerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ElementContainerDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
-ElementContainerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.4.0", type: ElementContainerDirective, selector: "[elementcontainer]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ElementContainerDirective, decorators: [{
+ElementContainerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ElementContainerDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
+ElementContainerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.3", type: ElementContainerDirective, selector: "[elementcontainer]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ElementContainerDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[elementcontainer]'

package/esm2020/lib/directives/fieldelement.directive.mjs

@@ -5,9 +5,9 @@ export class FieldElementDirective {
         this.viewContainerRef = viewContainerRef;
     }
 }
-FieldElementDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FieldElementDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
-FieldElementDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.4.0", type: FieldElementDirective, selector: "[fieldelement]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FieldElementDirective, decorators: [{
+FieldElementDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: FieldElementDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
+FieldElementDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.3", type: FieldElementDirective, selector: "[fieldelement]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: FieldElementDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[fieldelement]'

package/esm2020/lib/directives/scrollbar.theme.directive.mjs

@@ -34,9 +34,9 @@ export class ScrollbarThemeDirective {
         // }
     }
 }
-ScrollbarThemeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ScrollbarThemeDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-ScrollbarThemeDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.4.0", type: ScrollbarThemeDirective, selector: "[appScrollbarTheme]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ScrollbarThemeDirective, decorators: [{
+ScrollbarThemeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ScrollbarThemeDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+ScrollbarThemeDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.3", type: ScrollbarThemeDirective, selector: "[appScrollbarTheme]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ScrollbarThemeDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[appScrollbarTheme]'

package/esm2020/lib/embed-components/context-menu/context-menu.component.mjs

@@ -97,9 +97,9 @@ export class ContextMenuComponent extends FieldBase {
         }
     }
 }
-ContextMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ContextMenuComponent, deps: [{ token: i1.ZComponentService }, { token: i2.FontAweSomeService }, { token: i2.TranslationService }, { token: i2.UISignalService }], target: i0.ɵɵFactoryTarget.Component });
-ContextMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: ContextMenuComponent, selector: "app-context-menu", inputs: { target: "target", selectedData: "selectedData" }, viewQueries: [{ propertyName: "contextMenuList", predicate: ["contextMenu"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"context-menu-container\" *ngIf=\"target && !isLoading\">\r\n  <kendo-contextmenu\r\n    #contextMenu\r\n    class=\"context-menu-item\"\r\n    *ngFor=\"let targetContextMenuSetting of contextMenuSettings\"\r\n    [target]=\"target\"\r\n    [size]=\"targetContextMenuSetting.Size ?? 'medium'\"\r\n    [kendoMenuHierarchyBinding]=\"targetContextMenuSetting.ContextMenuItems\"\r\n    childrenField=\"Value\"\r\n    separatorField=\"IsSeparator\"\r\n    (select)=\"onSelect($event, targetContextMenuSetting)\"\r\n    [filter]=\"targetContextMenuSetting.CSSSelectorFilter\"\r\n    (popupOpen)=\"popUpOpened(contextMenu)\">\r\n    <ng-template kendoMenuItemTemplate let-item=\"item\">\r\n      <div class=\"context-menu-item-container\" [class.has-icon]=\"item.data.Icon\" [ngClass]=\"item.data.Class\"\r\n        *ngIf=\"!item.data.IsSeparator\">\r\n        <fa-icon class=\"context-menu-item-icon\" [icon]=\"getFontAwesome(item.data.Icon, fontAweSomeService)\"\r\n          *ngIf=\"item.data.Icon\"></fa-icon>\r\n        <div class=\"context-menu-item-text\" *ngIf=\"item.data.Text\">{{ item.data.TranslatedText ?? item.data.Text }}\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </kendo-contextmenu>\r\n</div>\r\n\r\n<!-- Manual trigger from zgrid, ztree -->\r\n<div class=\"context-menu-container-manual-trigger-mode\" *ngIf=\"!target && !isLoading\">\r\n  <kendo-contextmenu\r\n    #contextMenu\r\n    class=\"context-menu-item\"\r\n    *ngFor=\"let targetContextMenuSetting of contextMenuSettings\"\r\n    [size]=\"targetContextMenuSetting.Size ?? 'medium'\"\r\n    [kendoMenuHierarchyBinding]=\"targetContextMenuSetting.ContextMenuItems\"\r\n    childrenField=\"Value\"\r\n    separatorField=\"IsSeparator\"\r\n    (select)=\"onSelect($event, targetContextMenuSetting)\"\r\n    [filter]=\"targetContextMenuSetting.CSSSelectorFilter\">\r\n    <ng-template kendoMenuItemTemplate let-item=\"item\">\r\n      <div class=\"context-menu-item-container\" [class.has-icon]=\"item.data.Icon\" [ngClass]=\"item.data.Class\"\r\n        *ngIf=\"!item.data.IsSeparator\">\r\n        <fa-icon class=\"context-menu-item-icon\" [icon]=\"getFontAwesome(item.data.Icon, fontAweSomeService)\"\r\n          *ngIf=\"item.data.Icon\"></fa-icon>\r\n        <div class=\"context-menu-item-text\" *ngIf=\"item.data.Text\">{{ item.data.TranslatedText ?? item.data.Text }}\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </kendo-contextmenu>\r\n</div>\r\n", styles: [".context-menu-item-container.has-icon{display:grid;grid-template-columns:20px auto}.context-menu-item-container.has-icon .context-menu-item-icon{padding-right:5px}\n"], components: [{ type: i3.ContextMenuComponent, selector: "kendo-contextmenu", inputs: ["showOn", "target", "filter", "alignToAnchor", "vertical", "popupAnimate", "popupAlign", "anchorAlign", "collision", "appendTo", "ariaLabel"], outputs: ["popupOpen", "popupClose", "select", "open", "close"], exportAs: ["kendoContextMenu"] }, { type: i4.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.HierarchyBindingDirective, selector: "[kendoMenuHierarchyBinding]", inputs: ["kendoMenuHierarchyBinding", "textField", "urlField", "iconField", "disabledField", "cssClassField", "cssStyleField", "separatorField", "childrenField"], exportAs: ["kendoMenuHierarchyBinding"] }, { type: i3.ItemTemplateDirective, selector: "[kendoMenuItemTemplate]" }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i6.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ContextMenuComponent, decorators: [{
+ContextMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ContextMenuComponent, deps: [{ token: i1.ZComponentService }, { token: i2.FontAweSomeService }, { token: i2.TranslationService }, { token: i2.UISignalService }], target: i0.ɵɵFactoryTarget.Component });
+ContextMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ContextMenuComponent, selector: "app-context-menu", inputs: { target: "target", selectedData: "selectedData" }, viewQueries: [{ propertyName: "contextMenuList", predicate: ["contextMenu"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"context-menu-container\" *ngIf=\"target && !isLoading\">\r\n  <kendo-contextmenu\r\n    #contextMenu\r\n    class=\"context-menu-item\"\r\n    *ngFor=\"let targetContextMenuSetting of contextMenuSettings\"\r\n    [target]=\"target\"\r\n    [size]=\"targetContextMenuSetting.Size ?? 'medium'\"\r\n    [kendoMenuHierarchyBinding]=\"targetContextMenuSetting.ContextMenuItems\"\r\n    childrenField=\"Value\"\r\n    separatorField=\"IsSeparator\"\r\n    (select)=\"onSelect($event, targetContextMenuSetting)\"\r\n    [filter]=\"targetContextMenuSetting.CSSSelectorFilter\"\r\n    (popupOpen)=\"popUpOpened(contextMenu)\">\r\n    <ng-template kendoMenuItemTemplate let-item=\"item\">\r\n      <div class=\"context-menu-item-container\" [class.has-icon]=\"item.data.Icon\" [ngClass]=\"item.data.Class\"\r\n        *ngIf=\"!item.data.IsSeparator\">\r\n        <fa-icon class=\"context-menu-item-icon\" [icon]=\"getFontAwesome(item.data.Icon, fontAweSomeService)\"\r\n          *ngIf=\"item.data.Icon\"></fa-icon>\r\n        <div class=\"context-menu-item-text\" *ngIf=\"item.data.Text\">{{ item.data.TranslatedText ?? item.data.Text }}\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </kendo-contextmenu>\r\n</div>\r\n\r\n<!-- Manual trigger from zgrid, ztree -->\r\n<div class=\"context-menu-container-manual-trigger-mode\" *ngIf=\"!target && !isLoading\">\r\n  <kendo-contextmenu\r\n    #contextMenu\r\n    class=\"context-menu-item\"\r\n    *ngFor=\"let targetContextMenuSetting of contextMenuSettings\"\r\n    [size]=\"targetContextMenuSetting.Size ?? 'medium'\"\r\n    [kendoMenuHierarchyBinding]=\"targetContextMenuSetting.ContextMenuItems\"\r\n    childrenField=\"Value\"\r\n    separatorField=\"IsSeparator\"\r\n    (select)=\"onSelect($event, targetContextMenuSetting)\"\r\n    [filter]=\"targetContextMenuSetting.CSSSelectorFilter\">\r\n    <ng-template kendoMenuItemTemplate let-item=\"item\">\r\n      <div class=\"context-menu-item-container\" [class.has-icon]=\"item.data.Icon\" [ngClass]=\"item.data.Class\"\r\n        *ngIf=\"!item.data.IsSeparator\">\r\n        <fa-icon class=\"context-menu-item-icon\" [icon]=\"getFontAwesome(item.data.Icon, fontAweSomeService)\"\r\n          *ngIf=\"item.data.Icon\"></fa-icon>\r\n        <div class=\"context-menu-item-text\" *ngIf=\"item.data.Text\">{{ item.data.TranslatedText ?? item.data.Text }}\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </kendo-contextmenu>\r\n</div>\r\n", styles: [".context-menu-item-container.has-icon{display:grid;grid-template-columns:20px auto}.context-menu-item-container.has-icon .context-menu-item-icon{padding-right:5px}\n"], components: [{ type: i3.ContextMenuComponent, selector: "kendo-contextmenu", inputs: ["showOn", "target", "filter", "alignToAnchor", "vertical", "popupAnimate", "popupAlign", "anchorAlign", "collision", "appendTo", "ariaLabel"], outputs: ["popupOpen", "popupClose", "select", "open", "close"], exportAs: ["kendoContextMenu"] }, { type: i4.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.HierarchyBindingDirective, selector: "[kendoMenuHierarchyBinding]", inputs: ["kendoMenuHierarchyBinding", "textField", "urlField", "iconField", "disabledField", "cssClassField", "cssStyleField", "separatorField", "childrenField"], exportAs: ["kendoMenuHierarchyBinding"] }, { type: i3.ItemTemplateDirective, selector: "[kendoMenuItemTemplate]" }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i6.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ContextMenuComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-context-menu", template: "<div class=\"context-menu-container\" *ngIf=\"target && !isLoading\">\r\n  <kendo-contextmenu\r\n    #contextMenu\r\n    class=\"context-menu-item\"\r\n    *ngFor=\"let targetContextMenuSetting of contextMenuSettings\"\r\n    [target]=\"target\"\r\n    [size]=\"targetContextMenuSetting.Size ?? 'medium'\"\r\n    [kendoMenuHierarchyBinding]=\"targetContextMenuSetting.ContextMenuItems\"\r\n    childrenField=\"Value\"\r\n    separatorField=\"IsSeparator\"\r\n    (select)=\"onSelect($event, targetContextMenuSetting)\"\r\n    [filter]=\"targetContextMenuSetting.CSSSelectorFilter\"\r\n    (popupOpen)=\"popUpOpened(contextMenu)\">\r\n    <ng-template kendoMenuItemTemplate let-item=\"item\">\r\n      <div class=\"context-menu-item-container\" [class.has-icon]=\"item.data.Icon\" [ngClass]=\"item.data.Class\"\r\n        *ngIf=\"!item.data.IsSeparator\">\r\n        <fa-icon class=\"context-menu-item-icon\" [icon]=\"getFontAwesome(item.data.Icon, fontAweSomeService)\"\r\n          *ngIf=\"item.data.Icon\"></fa-icon>\r\n        <div class=\"context-menu-item-text\" *ngIf=\"item.data.Text\">{{ item.data.TranslatedText ?? item.data.Text }}\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </kendo-contextmenu>\r\n</div>\r\n\r\n<!-- Manual trigger from zgrid, ztree -->\r\n<div class=\"context-menu-container-manual-trigger-mode\" *ngIf=\"!target && !isLoading\">\r\n  <kendo-contextmenu\r\n    #contextMenu\r\n    class=\"context-menu-item\"\r\n    *ngFor=\"let targetContextMenuSetting of contextMenuSettings\"\r\n    [size]=\"targetContextMenuSetting.Size ?? 'medium'\"\r\n    [kendoMenuHierarchyBinding]=\"targetContextMenuSetting.ContextMenuItems\"\r\n    childrenField=\"Value\"\r\n    separatorField=\"IsSeparator\"\r\n    (select)=\"onSelect($event, targetContextMenuSetting)\"\r\n    [filter]=\"targetContextMenuSetting.CSSSelectorFilter\">\r\n    <ng-template kendoMenuItemTemplate let-item=\"item\">\r\n      <div class=\"context-menu-item-container\" [class.has-icon]=\"item.data.Icon\" [ngClass]=\"item.data.Class\"\r\n        *ngIf=\"!item.data.IsSeparator\">\r\n        <fa-icon class=\"context-menu-item-icon\" [icon]=\"getFontAwesome(item.data.Icon, fontAweSomeService)\"\r\n          *ngIf=\"item.data.Icon\"></fa-icon>\r\n        <div class=\"context-menu-item-text\" *ngIf=\"item.data.Text\">{{ item.data.TranslatedText ?? item.data.Text }}\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </kendo-contextmenu>\r\n</div>\r\n", styles: [".context-menu-item-container.has-icon{display:grid;grid-template-columns:20px auto}.context-menu-item-container.has-icon .context-menu-item-icon{padding-right:5px}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.ZComponentService }, { type: i2.FontAweSomeService }, { type: i2.TranslationService }, { type: i2.UISignalService }]; }, propDecorators: { target: [{

package/esm2020/lib/embed-components/input-field-addons/input-field-addons.component.mjs

@@ -80,9 +80,9 @@ export class InputFieldAddOnsComponent extends InputFieldBase {
         }
     }
 }
-InputFieldAddOnsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputFieldAddOnsComponent, deps: [{ token: i1.ZComponentService }, { token: i2.FontAweSomeService }, { token: i2.TranslationService }], target: i0.ɵɵFactoryTarget.Component });
-InputFieldAddOnsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: InputFieldAddOnsComponent, selector: "app-input-field-addons", inputs: { position: "position", addOn: "addOn" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [class]=\"'addons-container ' + position\" *ngIf=\"addOn\">\r\n  <div class=\"addons-icon\" *ngIf=\"addOn.IconList\">\r\n    <div *ngFor=\"let item of addOn.IconList\">\r\n      <div kendoTooltip class=\"icon-button\" showOn=\"hover\" [position]=\"item.ToolTipPosition ?? 'top'\">\r\n        <span (click)=\"onIconClick(item.Click)\" [title]=\"item.ToolTipText\" [style]=\"item.Style\">\r\n          <fa-icon [icon]=\"item.Icon\">\r\n          </fa-icon>\r\n        </span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"addons-text\" *ngIf=\"addOn.TextList\">\r\n    <div *ngFor=\"let item of addOn.TextList\">\r\n      <div kendoTooltip class=\"icon-button\" showOn=\"hover\" [position]=\"item.ToolTipPosition ?? 'top'\">\r\n        <span (click)=\"onIconClick(item.Click)\" [title]=\"item.ToolTipText\" [style]=\"item.Style\">\r\n          {{item.Text}}\r\n        </span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"addons-buttons\" *ngIf=\"addOn.ButtonList\">\r\n    <ion-button *ngFor=\"let button of addOn.ButtonList; let i = button\" [fill]=\"button.fill\" [ngClass]=\"button.class\"\r\n      [color]=\"button.color\" [size]=\"button.Size || 'small'\" strong=\"false\" (click)=\"onIconClick(button.Click)\"\r\n      [hidden]=\"!button.Visible\" [disabled]=\"group.isTriggered || button.Disabled\" [style]=\"button.Style\">\r\n      <fa-icon *ngIf=\"button.Icon\" [icon]=\"getFontAwesome(button.Icon, fontAweSomeService)\"\r\n        [style.padding-right]=\"button.Text ? '5px' : '0px'\"></fa-icon>\r\n      <span class=\"ion-text-capitalize\">{{ button.Text }}</span>\r\n    </ion-button>\r\n  </div>\r\n</div>\r\n", styles: [".addons-container{display:flex}.addons-container .addons-icon{display:flex;flex-direction:row}.addons-container .addons-icon fa-icon{padding:4px 6px;font-size:calc(var(--content-font-size) - 2px)}.addons-container .addons-buttons>ion-button{margin:0 0 0 5px;font-size:calc(var(--content-font-size) - 2px)}.addons-container .addons-text{padding-left:6px;padding-top:3px;font-size:calc(var(--content-font-size) - 2px)}.addons-container.top .addons-buttons>ion-button{top:-3px;position:relative}.addons-container.left .addons-buttons>ion-button{margin:0 5px 0 0}.addons-buttons ion-button{font-size:var(--button-font-size);margin-left:10px;--border-radius: var(--button-border-radius);--box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, .25)}.addons-buttons ion-button.useCustomClass{--background-hover-opacity: 1;--border-width: 2px;--border-style: solid;--background: #fff;--background-hover: rgba(var(--ion-color-primary-rgb), .05);--color: var(--ion-color-primary);--border-color: var(--ion-color-primary)}.addons-buttons ion-button.primary-light{--background: rgba(var(--ion-color-primary-rgb), .05);--background-hover: #fff;--color: var(--ion-color-primary);--border-color: var(--ion-color-primary)}.addons-buttons ion-button.primary{--background: var(--ion-color-primary);--background-hover: var(--ion-color-primary-tint);--color: var(--ion-color-primary-contrast);--border-color: var(--ion-color-primary-shade)}.addons-buttons ion-button.success{--background: var(--ion-color-success);--background-hover: var(--ion-color-success-tint);--color: var(--ion-color-success-contrast);--border-color: var(--ion-color-success-shade)}.addons-buttons ion-button.danger{--background: var(--ion-color-danger);--background-hover: var(--ion-color-danger-tint2);--color: var(--ion-color-danger-contrast);--border-color: var(--ion-color-danger-shade)}.addons-buttons ion-button.warning{--background: var(--ion-color-warning);--background-hover: var(--ion-color-warning-tint);--color: #000;--border-color: var(--ion-color-warning-shade)}.addons-buttons ion-button.no-shadow{--box-shadow: none}\n"], components: [{ type: i3.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i4.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6.TooltipDirective, selector: "[kendoTooltip]", inputs: ["filter", "position", "titleTemplate", "showOn", "showAfter", "callout", "closable", "offset", "tooltipWidth", "tooltipHeight", "tooltipClass", "collision", "closeTitle", "tooltipTemplate"], exportAs: ["kendoTooltip"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputFieldAddOnsComponent, decorators: [{
+InputFieldAddOnsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: InputFieldAddOnsComponent, deps: [{ token: i1.ZComponentService }, { token: i2.FontAweSomeService }, { token: i2.TranslationService }], target: i0.ɵɵFactoryTarget.Component });
+InputFieldAddOnsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: InputFieldAddOnsComponent, selector: "app-input-field-addons", inputs: { position: "position", addOn: "addOn" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [class]=\"'addons-container ' + position\" *ngIf=\"addOn\">\r\n  <div class=\"addons-icon\" *ngIf=\"addOn.IconList\">\r\n    <div *ngFor=\"let item of addOn.IconList\">\r\n      <div kendoTooltip class=\"icon-button\" showOn=\"hover\" [position]=\"item.ToolTipPosition ?? 'top'\">\r\n        <span (click)=\"onIconClick(item.Click)\" [title]=\"item.ToolTipText\" [style]=\"item.Style\">\r\n          <fa-icon [icon]=\"item.Icon\">\r\n          </fa-icon>\r\n        </span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"addons-text\" *ngIf=\"addOn.TextList\">\r\n    <div *ngFor=\"let item of addOn.TextList\">\r\n      <div kendoTooltip class=\"icon-button\" showOn=\"hover\" [position]=\"item.ToolTipPosition ?? 'top'\">\r\n        <span (click)=\"onIconClick(item.Click)\" [title]=\"item.ToolTipText\" [style]=\"item.Style\">\r\n          {{item.Text}}\r\n        </span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"addons-buttons\" *ngIf=\"addOn.ButtonList\">\r\n    <ion-button *ngFor=\"let button of addOn.ButtonList; let i = button\" [fill]=\"button.fill\" [ngClass]=\"button.class\"\r\n      [color]=\"button.color\" [size]=\"button.Size || 'small'\" strong=\"false\" (click)=\"onIconClick(button.Click)\"\r\n      [hidden]=\"!button.Visible\" [disabled]=\"group.isTriggered || button.Disabled\" [style]=\"button.Style\">\r\n      <fa-icon *ngIf=\"button.Icon\" [icon]=\"getFontAwesome(button.Icon, fontAweSomeService)\"\r\n        [style.padding-right]=\"button.Text ? '5px' : '0px'\"></fa-icon>\r\n      <span class=\"ion-text-capitalize\">{{ button.Text }}</span>\r\n    </ion-button>\r\n  </div>\r\n</div>\r\n", styles: [".addons-container{display:flex}.addons-container .addons-icon{display:flex;flex-direction:row}.addons-container .addons-icon fa-icon{padding:4px 6px;font-size:calc(var(--content-font-size) - 2px)}.addons-container .addons-buttons>ion-button{margin:0 0 0 5px;font-size:calc(var(--content-font-size) - 2px)}.addons-container .addons-text{padding-left:6px;padding-top:3px;font-size:calc(var(--content-font-size) - 2px)}.addons-container.top .addons-buttons>ion-button{top:-3px;position:relative}.addons-container.left .addons-buttons>ion-button{margin:0 5px 0 0}.addons-buttons ion-button{font-size:var(--button-font-size);margin-left:10px;--border-radius: var(--button-border-radius);--box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, .25)}.addons-buttons ion-button.useCustomClass{--background-hover-opacity: 1;--border-width: 2px;--border-style: solid;--background: #fff;--background-hover: rgba(var(--ion-color-primary-rgb), .05);--color: var(--ion-color-primary);--border-color: var(--ion-color-primary)}.addons-buttons ion-button.primary-light{--background: rgba(var(--ion-color-primary-rgb), .05);--background-hover: #fff;--color: var(--ion-color-primary);--border-color: var(--ion-color-primary)}.addons-buttons ion-button.primary{--background: var(--ion-color-primary);--background-hover: var(--ion-color-primary-tint);--color: var(--ion-color-primary-contrast);--border-color: var(--ion-color-primary-shade)}.addons-buttons ion-button.success{--background: var(--ion-color-success);--background-hover: var(--ion-color-success-tint);--color: var(--ion-color-success-contrast);--border-color: var(--ion-color-success-shade)}.addons-buttons ion-button.danger{--background: var(--ion-color-danger);--background-hover: var(--ion-color-danger-tint2);--color: var(--ion-color-danger-contrast);--border-color: var(--ion-color-danger-shade)}.addons-buttons ion-button.warning{--background: var(--ion-color-warning);--background-hover: var(--ion-color-warning-tint);--color: #000;--border-color: var(--ion-color-warning-shade)}.addons-buttons ion-button.no-shadow{--box-shadow: none}\n"], components: [{ type: i3.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i4.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6.TooltipDirective, selector: "[kendoTooltip]", inputs: ["filter", "position", "titleTemplate", "showOn", "showAfter", "callout", "closable", "offset", "tooltipWidth", "tooltipHeight", "tooltipClass", "collision", "closeTitle", "tooltipTemplate"], exportAs: ["kendoTooltip"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: InputFieldAddOnsComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-input-field-addons", template: "<div [class]=\"'addons-container ' + position\" *ngIf=\"addOn\">\r\n  <div class=\"addons-icon\" *ngIf=\"addOn.IconList\">\r\n    <div *ngFor=\"let item of addOn.IconList\">\r\n      <div kendoTooltip class=\"icon-button\" showOn=\"hover\" [position]=\"item.ToolTipPosition ?? 'top'\">\r\n        <span (click)=\"onIconClick(item.Click)\" [title]=\"item.ToolTipText\" [style]=\"item.Style\">\r\n          <fa-icon [icon]=\"item.Icon\">\r\n          </fa-icon>\r\n        </span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"addons-text\" *ngIf=\"addOn.TextList\">\r\n    <div *ngFor=\"let item of addOn.TextList\">\r\n      <div kendoTooltip class=\"icon-button\" showOn=\"hover\" [position]=\"item.ToolTipPosition ?? 'top'\">\r\n        <span (click)=\"onIconClick(item.Click)\" [title]=\"item.ToolTipText\" [style]=\"item.Style\">\r\n          {{item.Text}}\r\n        </span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"addons-buttons\" *ngIf=\"addOn.ButtonList\">\r\n    <ion-button *ngFor=\"let button of addOn.ButtonList; let i = button\" [fill]=\"button.fill\" [ngClass]=\"button.class\"\r\n      [color]=\"button.color\" [size]=\"button.Size || 'small'\" strong=\"false\" (click)=\"onIconClick(button.Click)\"\r\n      [hidden]=\"!button.Visible\" [disabled]=\"group.isTriggered || button.Disabled\" [style]=\"button.Style\">\r\n      <fa-icon *ngIf=\"button.Icon\" [icon]=\"getFontAwesome(button.Icon, fontAweSomeService)\"\r\n        [style.padding-right]=\"button.Text ? '5px' : '0px'\"></fa-icon>\r\n      <span class=\"ion-text-capitalize\">{{ button.Text }}</span>\r\n    </ion-button>\r\n  </div>\r\n</div>\r\n", styles: [".addons-container{display:flex}.addons-container .addons-icon{display:flex;flex-direction:row}.addons-container .addons-icon fa-icon{padding:4px 6px;font-size:calc(var(--content-font-size) - 2px)}.addons-container .addons-buttons>ion-button{margin:0 0 0 5px;font-size:calc(var(--content-font-size) - 2px)}.addons-container .addons-text{padding-left:6px;padding-top:3px;font-size:calc(var(--content-font-size) - 2px)}.addons-container.top .addons-buttons>ion-button{top:-3px;position:relative}.addons-container.left .addons-buttons>ion-button{margin:0 5px 0 0}.addons-buttons ion-button{font-size:var(--button-font-size);margin-left:10px;--border-radius: var(--button-border-radius);--box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, .25)}.addons-buttons ion-button.useCustomClass{--background-hover-opacity: 1;--border-width: 2px;--border-style: solid;--background: #fff;--background-hover: rgba(var(--ion-color-primary-rgb), .05);--color: var(--ion-color-primary);--border-color: var(--ion-color-primary)}.addons-buttons ion-button.primary-light{--background: rgba(var(--ion-color-primary-rgb), .05);--background-hover: #fff;--color: var(--ion-color-primary);--border-color: var(--ion-color-primary)}.addons-buttons ion-button.primary{--background: var(--ion-color-primary);--background-hover: var(--ion-color-primary-tint);--color: var(--ion-color-primary-contrast);--border-color: var(--ion-color-primary-shade)}.addons-buttons ion-button.success{--background: var(--ion-color-success);--background-hover: var(--ion-color-success-tint);--color: var(--ion-color-success-contrast);--border-color: var(--ion-color-success-shade)}.addons-buttons ion-button.danger{--background: var(--ion-color-danger);--background-hover: var(--ion-color-danger-tint2);--color: var(--ion-color-danger-contrast);--border-color: var(--ion-color-danger-shade)}.addons-buttons ion-button.warning{--background: var(--ion-color-warning);--background-hover: var(--ion-color-warning-tint);--color: #000;--border-color: var(--ion-color-warning-shade)}.addons-buttons ion-button.no-shadow{--box-shadow: none}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.ZComponentService }, { type: i2.FontAweSomeService }, { type: i2.TranslationService }]; }, propDecorators: { position: [{

package/esm2020/lib/embed-components/page-loader/page-loader.component.mjs

@@ -5,9 +5,9 @@ export class PageLoaderComponent {
     ngOnInit() {
     }
 }
-PageLoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: PageLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-PageLoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: PageLoaderComponent, selector: "app-page-loader", ngImport: i0, template: "<div class=\"loader\"></div>\r\n", styles: [".loader{animation:rotate 1s infinite;height:50px;width:50px;margin:auto;margin-top:10vh}.loader:before,.loader:after{border-radius:50%;content:\"\";display:block;height:20px;width:20px}.loader:before{animation:ball1 1s infinite;background-color:#38c22e;box-shadow:30px 0 #f37932;margin-bottom:10px}.loader:after{animation:ball2 1s infinite;background-color:#f26a1b;box-shadow:30px 0 #3db93d}@keyframes rotate{0%{-webkit-transform:rotate(0deg) scale(.8);-moz-transform:rotate(0deg) scale(.8)}50%{-webkit-transform:rotate(360deg) scale(1.2);-moz-transform:rotate(360deg) scale(1.2)}to{-webkit-transform:rotate(720deg) scale(.8);-moz-transform:rotate(720deg) scale(.8)}}@keyframes ball1{0%{box-shadow:30px 0 #f37932}50%{box-shadow:0 0 #f37932;margin-bottom:0;-webkit-transform:translate(15px,15px);-moz-transform:translate(15px,15px)}to{box-shadow:30px 0 #f37932;margin-bottom:10px}}@keyframes ball2{0%{box-shadow:30px 0 #3db93d}50%{box-shadow:0 0 #3db93d;margin-top:-20px;-webkit-transform:translate(15px,15px);-moz-transform:translate(15px,15px)}to{box-shadow:30px 0 #3db93d;margin-top:0}}\n"] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: PageLoaderComponent, decorators: [{
+PageLoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: PageLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+PageLoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: PageLoaderComponent, selector: "app-page-loader", ngImport: i0, template: "<div class=\"loader\"></div>\r\n", styles: [".loader{animation:rotate 1s infinite;height:50px;width:50px;margin:auto;margin-top:10vh}.loader:before,.loader:after{border-radius:50%;content:\"\";display:block;height:20px;width:20px}.loader:before{animation:ball1 1s infinite;background-color:#38c22e;box-shadow:30px 0 #f37932;margin-bottom:10px}.loader:after{animation:ball2 1s infinite;background-color:#f26a1b;box-shadow:30px 0 #3db93d}@keyframes rotate{0%{-webkit-transform:rotate(0deg) scale(.8);-moz-transform:rotate(0deg) scale(.8)}50%{-webkit-transform:rotate(360deg) scale(1.2);-moz-transform:rotate(360deg) scale(1.2)}to{-webkit-transform:rotate(720deg) scale(.8);-moz-transform:rotate(720deg) scale(.8)}}@keyframes ball1{0%{box-shadow:30px 0 #f37932}50%{box-shadow:0 0 #f37932;margin-bottom:0;-webkit-transform:translate(15px,15px);-moz-transform:translate(15px,15px)}to{box-shadow:30px 0 #f37932;margin-bottom:10px}}@keyframes ball2{0%{box-shadow:30px 0 #3db93d}50%{box-shadow:0 0 #3db93d;margin-top:-20px;-webkit-transform:translate(15px,15px);-moz-transform:translate(15px,15px)}to{box-shadow:30px 0 #3db93d;margin-top:0}}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: PageLoaderComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-page-loader", template: "<div class=\"loader\"></div>\r\n", styles: [".loader{animation:rotate 1s infinite;height:50px;width:50px;margin:auto;margin-top:10vh}.loader:before,.loader:after{border-radius:50%;content:\"\";display:block;height:20px;width:20px}.loader:before{animation:ball1 1s infinite;background-color:#38c22e;box-shadow:30px 0 #f37932;margin-bottom:10px}.loader:after{animation:ball2 1s infinite;background-color:#f26a1b;box-shadow:30px 0 #3db93d}@keyframes rotate{0%{-webkit-transform:rotate(0deg) scale(.8);-moz-transform:rotate(0deg) scale(.8)}50%{-webkit-transform:rotate(360deg) scale(1.2);-moz-transform:rotate(360deg) scale(1.2)}to{-webkit-transform:rotate(720deg) scale(.8);-moz-transform:rotate(720deg) scale(.8)}}@keyframes ball1{0%{box-shadow:30px 0 #f37932}50%{box-shadow:0 0 #f37932;margin-bottom:0;-webkit-transform:translate(15px,15px);-moz-transform:translate(15px,15px)}to{box-shadow:30px 0 #f37932;margin-bottom:10px}}@keyframes ball2{0%{box-shadow:30px 0 #3db93d}50%{box-shadow:0 0 #3db93d;margin-top:-20px;-webkit-transform:translate(15px,15px);-moz-transform:translate(15px,15px)}to{box-shadow:30px 0 #3db93d;margin-top:0}}\n"] }]
         }], ctorParameters: function () { return []; } });

package/esm2020/lib/embed-components/processing-record-loader/processing-record-loader.component.mjs

@@ -5,10 +5,10 @@ export class ProcessingRecordLoaderComponent {
     ngOnInit() {
     }
 }
-ProcessingRecordLoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ProcessingRecordLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ProcessingRecordLoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: ProcessingRecordLoaderComponent, selector: "processing-record-loader", ngImport: i0, template: "<div class=\"loader-container\">\r\n  <div class=\"ring\">Processing\r\n    <span></span>\r\n  </div>\r\n</div>\r\n", styles: [".loader-container{position:absolute;z-index:11;width:100vw;height:100vh;background:rgba(0,0,0,.7)}body{margin:0;padding:0;background:#262626}.ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px;background:transparent;border:3px solid #3c3c3c;border-radius:50%;text-align:center;line-height:190px;font-family:sans-serif;font-size:20px;color:#cfbbff;letter-spacing:4px;text-transform:uppercase;text-shadow:0 0 10px #cfbbff;box-shadow:0 0 20px #00000080}.ring:before{content:\"\";position:absolute;top:-3px;left:-3px;width:100%;height:100%;border:3px solid transparent;border-top:3px solid #cfbbff;border-right:3px solid #cfbbff;border-radius:50%;animation:animateC 2s linear infinite}span{display:block;position:absolute;top:calc(50% - 2px);left:50%;width:50%;height:4px;background:transparent;transform-origin:left;animation:animate 2s linear infinite}span:before{content:\"\";position:absolute;width:16px;height:16px;border-radius:50%;background:#cfbbff;top:-6px;right:-8px;box-shadow:0 0 20px #cfbbff}@keyframes animateC{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes animate{0%{transform:rotate(45deg)}to{transform:rotate(405deg)}}\n"] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ProcessingRecordLoaderComponent, decorators: [{
+ProcessingRecordLoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ProcessingRecordLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ProcessingRecordLoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ProcessingRecordLoaderComponent, selector: "processing-record-loader", ngImport: i0, template: "<div class=\"loader-container\">\r\n  <div class=\"ring\">Processing\r\n    <span></span>\r\n  </div>\r\n</div>\r\n", styles: [".loader-container{position:absolute;z-index:11;width:100vw;height:100vh;background:rgba(0,0,0,.7)}body{margin:0;padding:0;background:#262626}.ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px;background:transparent;border:3px solid #3c3c3c;border-radius:50%;text-align:center;line-height:190px;font-family:sans-serif;font-size:20px;color:#cfbbff;letter-spacing:4px;text-transform:uppercase;text-shadow:0 0 10px rgb(207,187,255);box-shadow:0 0 20px #00000080}.ring:before{content:\"\";position:absolute;top:-3px;left:-3px;width:100%;height:100%;border:3px solid transparent;border-top:3px solid rgb(207,187,255);border-right:3px solid rgb(207,187,255);border-radius:50%;animation:animateC 2s linear infinite}span{display:block;position:absolute;top:calc(50% - 2px);left:50%;width:50%;height:4px;background:transparent;transform-origin:left;animation:animate 2s linear infinite}span:before{content:\"\";position:absolute;width:16px;height:16px;border-radius:50%;background:rgb(207,187,255);top:-6px;right:-8px;box-shadow:0 0 20px #cfbbff}@keyframes animateC{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes animate{0%{transform:rotate(45deg)}to{transform:rotate(405deg)}}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ProcessingRecordLoaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: "processing-record-loader", template: "<div class=\"loader-container\">\r\n  <div class=\"ring\">Processing\r\n    <span></span>\r\n  </div>\r\n</div>\r\n", styles: [".loader-container{position:absolute;z-index:11;width:100vw;height:100vh;background:rgba(0,0,0,.7)}body{margin:0;padding:0;background:#262626}.ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px;background:transparent;border:3px solid #3c3c3c;border-radius:50%;text-align:center;line-height:190px;font-family:sans-serif;font-size:20px;color:#cfbbff;letter-spacing:4px;text-transform:uppercase;text-shadow:0 0 10px #cfbbff;box-shadow:0 0 20px #00000080}.ring:before{content:\"\";position:absolute;top:-3px;left:-3px;width:100%;height:100%;border:3px solid transparent;border-top:3px solid #cfbbff;border-right:3px solid #cfbbff;border-radius:50%;animation:animateC 2s linear infinite}span{display:block;position:absolute;top:calc(50% - 2px);left:50%;width:50%;height:4px;background:transparent;transform-origin:left;animation:animate 2s linear infinite}span:before{content:\"\";position:absolute;width:16px;height:16px;border-radius:50%;background:#cfbbff;top:-6px;right:-8px;box-shadow:0 0 20px #cfbbff}@keyframes animateC{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes animate{0%{transform:rotate(45deg)}to{transform:rotate(405deg)}}\n"] }]
+            args: [{ selector: "processing-record-loader", template: "<div class=\"loader-container\">\r\n  <div class=\"ring\">Processing\r\n    <span></span>\r\n  </div>\r\n</div>\r\n", styles: [".loader-container{position:absolute;z-index:11;width:100vw;height:100vh;background:rgba(0,0,0,.7)}body{margin:0;padding:0;background:#262626}.ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px;background:transparent;border:3px solid #3c3c3c;border-radius:50%;text-align:center;line-height:190px;font-family:sans-serif;font-size:20px;color:#cfbbff;letter-spacing:4px;text-transform:uppercase;text-shadow:0 0 10px rgb(207,187,255);box-shadow:0 0 20px #00000080}.ring:before{content:\"\";position:absolute;top:-3px;left:-3px;width:100%;height:100%;border:3px solid transparent;border-top:3px solid rgb(207,187,255);border-right:3px solid rgb(207,187,255);border-radius:50%;animation:animateC 2s linear infinite}span{display:block;position:absolute;top:calc(50% - 2px);left:50%;width:50%;height:4px;background:transparent;transform-origin:left;animation:animate 2s linear infinite}span:before{content:\"\";position:absolute;width:16px;height:16px;border-radius:50%;background:rgb(207,187,255);top:-6px;right:-8px;box-shadow:0 0 20px #cfbbff}@keyframes animateC{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes animate{0%{transform:rotate(45deg)}to{transform:rotate(405deg)}}\n"] }]
         }], ctorParameters: function () { return []; } });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJvY2Vzc2luZy1yZWNvcmQtbG9hZGVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL21taGdsb2JhbC1keW5hbWljZm9ybS9zcmMvbGliL2VtYmVkLWNvbXBvbmVudHMvcHJvY2Vzc2luZy1yZWNvcmQtbG9hZGVyL3Byb2Nlc3NpbmctcmVjb3JkLWxvYWRlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tbWhnbG9iYWwtZHluYW1pY2Zvcm0vc3JjL2xpYi9lbWJlZC1jb21wb25lbnRzL3Byb2Nlc3NpbmctcmVjb3JkLWxvYWRlci9wcm9jZXNzaW5nLXJlY29yZC1sb2FkZXIuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBVSxNQUFNLGVBQWUsQ0FBQzs7QUFPbEQsTUFBTSxPQUFPLCtCQUErQjtJQUMxQyxnQkFBZ0IsQ0FBQztJQUVqQixRQUFRO0lBQ1IsQ0FBQzs7NEhBSlUsK0JBQStCO2dIQUEvQiwrQkFBK0IsZ0VDUDVDLHFIQUtBOzJGREVhLCtCQUErQjtrQkFMM0MsU0FBUzsrQkFDRSwwQkFBMEIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIE9uSW5pdCB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogXCJwcm9jZXNzaW5nLXJlY29yZC1sb2FkZXJcIixcclxuICB0ZW1wbGF0ZVVybDogXCIuL3Byb2Nlc3NpbmctcmVjb3JkLWxvYWRlci5jb21wb25lbnQuaHRtbFwiLFxyXG4gIHN0eWxlVXJsczogW1wiLi9wcm9jZXNzaW5nLXJlY29yZC1sb2FkZXIuY29tcG9uZW50LnNjc3NcIl1cclxufSlcclxuZXhwb3J0IGNsYXNzIFByb2Nlc3NpbmdSZWNvcmRMb2FkZXJDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gIGNvbnN0cnVjdG9yKCkgeyB9XHJcblxyXG4gIG5nT25Jbml0KCkge1xyXG4gIH1cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwibG9hZGVyLWNvbnRhaW5lclwiPlxyXG4gIDxkaXYgY2xhc3M9XCJyaW5nXCI+UHJvY2Vzc2luZ1xyXG4gICAgPHNwYW4+PC9zcGFuPlxyXG4gIDwvZGl2PlxyXG48L2Rpdj5cclxuIl19

package/esm2020/lib/embed-components/spinner/spinner.component.mjs

@@ -18,9 +18,9 @@ export class SpinnerComponent extends FieldBase {
         this.componentService.decrementComponentCounterForField(this.data);
     }
 }
-SpinnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SpinnerComponent, deps: [{ token: i1.ZComponentService }, { token: i2.FontAweSomeService }], target: i0.ɵɵFactoryTarget.Component });
-SpinnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SpinnerComponent, selector: "app-spinner", usesInheritance: true, ngImport: i0, template: "<div\r\n  *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n  class=\"loader e1tag-style\" [style]=\"componentProperties.style.style\" [ngClass]=\"data.Class\"></div>\r\n", styles: [".loader{animation:rotate 1s infinite;height:50px;width:50px;margin:auto;margin-top:10vh}.loader:before,.loader:after{border-radius:50%;content:\"\";display:block;height:20px;width:20px}.loader:before{animation:ball1 1s infinite;background-color:#38c22e;box-shadow:30px 0 #f37932;margin-bottom:10px}.loader:after{animation:ball2 1s infinite;background-color:#f26a1b;box-shadow:30px 0 #3db93d}@keyframes rotate{0%{-webkit-transform:rotate(0deg) scale(.8);-moz-transform:rotate(0deg) scale(.8)}50%{-webkit-transform:rotate(360deg) scale(1.2);-moz-transform:rotate(360deg) scale(1.2)}to{-webkit-transform:rotate(720deg) scale(.8);-moz-transform:rotate(720deg) scale(.8)}}@keyframes ball1{0%{box-shadow:30px 0 #f37932}50%{box-shadow:0 0 #f37932;margin-bottom:0;-webkit-transform:translate(15px,15px);-moz-transform:translate(15px,15px)}to{box-shadow:30px 0 #f37932;margin-bottom:10px}}@keyframes ball2{0%{box-shadow:30px 0 #3db93d}50%{box-shadow:0 0 #3db93d;margin-top:-20px;-webkit-transform:translate(15px,15px);-moz-transform:translate(15px,15px)}to{box-shadow:30px 0 #3db93d;margin-top:0}}\n", ".loader{margin-top:0}\n"], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SpinnerComponent, decorators: [{
+SpinnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: SpinnerComponent, deps: [{ token: i1.ZComponentService }, { token: i2.FontAweSomeService }], target: i0.ɵɵFactoryTarget.Component });
+SpinnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: SpinnerComponent, selector: "app-spinner", usesInheritance: true, ngImport: i0, template: "<div\r\n  *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n  class=\"loader e1tag-style\" [style]=\"componentProperties.style.style\" [ngClass]=\"data.Class\"></div>\r\n", styles: [".loader{animation:rotate 1s infinite;height:50px;width:50px;margin:auto;margin-top:10vh}.loader:before,.loader:after{border-radius:50%;content:\"\";display:block;height:20px;width:20px}.loader:before{animation:ball1 1s infinite;background-color:#38c22e;box-shadow:30px 0 #f37932;margin-bottom:10px}.loader:after{animation:ball2 1s infinite;background-color:#f26a1b;box-shadow:30px 0 #3db93d}@keyframes rotate{0%{-webkit-transform:rotate(0deg) scale(.8);-moz-transform:rotate(0deg) scale(.8)}50%{-webkit-transform:rotate(360deg) scale(1.2);-moz-transform:rotate(360deg) scale(1.2)}to{-webkit-transform:rotate(720deg) scale(.8);-moz-transform:rotate(720deg) scale(.8)}}@keyframes ball1{0%{box-shadow:30px 0 #f37932}50%{box-shadow:0 0 #f37932;margin-bottom:0;-webkit-transform:translate(15px,15px);-moz-transform:translate(15px,15px)}to{box-shadow:30px 0 #f37932;margin-bottom:10px}}@keyframes ball2{0%{box-shadow:30px 0 #3db93d}50%{box-shadow:0 0 #3db93d;margin-top:-20px;-webkit-transform:translate(15px,15px);-moz-transform:translate(15px,15px)}to{box-shadow:30px 0 #3db93d;margin-top:0}}\n", ".loader{margin-top:0}\n"], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: SpinnerComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-spinner", template: "<div\r\n  *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n  class=\"loader e1tag-style\" [style]=\"componentProperties.style.style\" [ngClass]=\"data.Class\"></div>\r\n", styles: [".loader{animation:rotate 1s infinite;height:50px;width:50px;margin:auto;margin-top:10vh}.loader:before,.loader:after{border-radius:50%;content:\"\";display:block;height:20px;width:20px}.loader:before{animation:ball1 1s infinite;background-color:#38c22e;box-shadow:30px 0 #f37932;margin-bottom:10px}.loader:after{animation:ball2 1s infinite;background-color:#f26a1b;box-shadow:30px 0 #3db93d}@keyframes rotate{0%{-webkit-transform:rotate(0deg) scale(.8);-moz-transform:rotate(0deg) scale(.8)}50%{-webkit-transform:rotate(360deg) scale(1.2);-moz-transform:rotate(360deg) scale(1.2)}to{-webkit-transform:rotate(720deg) scale(.8);-moz-transform:rotate(720deg) scale(.8)}}@keyframes ball1{0%{box-shadow:30px 0 #f37932}50%{box-shadow:0 0 #f37932;margin-bottom:0;-webkit-transform:translate(15px,15px);-moz-transform:translate(15px,15px)}to{box-shadow:30px 0 #f37932;margin-bottom:10px}}@keyframes ball2{0%{box-shadow:30px 0 #3db93d}50%{box-shadow:0 0 #3db93d;margin-top:-20px;-webkit-transform:translate(15px,15px);-moz-transform:translate(15px,15px)}to{box-shadow:30px 0 #3db93d;margin-top:0}}\n", ".loader{margin-top:0}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.ZComponentService }, { type: i2.FontAweSomeService }]; } });

package/esm2020/lib/input-error-message/input-error-message.component.mjs

@@ -44,9 +44,9 @@ export class InputErrorMessageComponent extends FieldBase {
         return isShow;
     }
 }
-InputErrorMessageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputErrorMessageComponent, deps: [{ token: i1.ZComponentService }, { token: i2.FontAweSomeService }, { token: i2.ComponentErrorHandlerService }, { token: i2.TranslationService }], target: i0.ɵɵFactoryTarget.Component });
-InputErrorMessageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: InputErrorMessageComponent, selector: "app-error", usesInheritance: true, ngImport: i0, template: "<div class=\"inputfield-error-msg\" *ngIf=\"IsShow()\">\r\n  <div *ngFor=\"let errMsg of errMsgList\">\r\n    <span #warning class=\"k-icon k-i-warning validation_icon\"></span>\r\n    <ion-label>{{errMsg}}</ion-label>\r\n  </div>\r\n</div>\r\n", styles: [".inputfield-error-msg{margin-top:5px;font-size:calc(var(--content-font-size) - 1px);color:var(--ion-color-danger)}.inputfield-error-msg span{margin:0 4px 0 2px;font-size:calc(var(--content-font-size) + 1px);top:-1px}\n"], components: [{ type: i3.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputErrorMessageComponent, decorators: [{
+InputErrorMessageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: InputErrorMessageComponent, deps: [{ token: i1.ZComponentService }, { token: i2.FontAweSomeService }, { token: i2.ComponentErrorHandlerService }, { token: i2.TranslationService }], target: i0.ɵɵFactoryTarget.Component });
+InputErrorMessageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: InputErrorMessageComponent, selector: "app-error", usesInheritance: true, ngImport: i0, template: "<div class=\"inputfield-error-msg\" *ngIf=\"IsShow()\">\r\n  <div *ngFor=\"let errMsg of errMsgList\">\r\n    <span #warning class=\"k-icon k-i-warning validation_icon\"></span>\r\n    <ion-label>{{errMsg}}</ion-label>\r\n  </div>\r\n</div>\r\n", styles: [".inputfield-error-msg{margin-top:5px;font-size:calc(var(--content-font-size) - 1px);color:var(--ion-color-danger)}.inputfield-error-msg span{margin:0 4px 0 2px;font-size:calc(var(--content-font-size) + 1px);top:-1px}\n"], components: [{ type: i3.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: InputErrorMessageComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-error", template: "<div class=\"inputfield-error-msg\" *ngIf=\"IsShow()\">\r\n  <div *ngFor=\"let errMsg of errMsgList\">\r\n    <span #warning class=\"k-icon k-i-warning validation_icon\"></span>\r\n    <ion-label>{{errMsg}}</ion-label>\r\n  </div>\r\n</div>\r\n", styles: [".inputfield-error-msg{margin-top:5px;font-size:calc(var(--content-font-size) - 1px);color:var(--ion-color-danger)}.inputfield-error-msg span{margin:0 4px 0 2px;font-size:calc(var(--content-font-size) + 1px);top:-1px}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.ZComponentService }, { type: i2.FontAweSomeService }, { type: i2.ComponentErrorHandlerService }, { type: i2.TranslationService }]; } });

package/esm2020/lib/kcard/kcard.component.mjs

@@ -81,9 +81,9 @@ export class KcardComponent extends ContainerFieldBase {
         });
     }
 }
-KcardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: KcardComponent, deps: [{ token: i1.ZComponentService }, { token: i2.MainService }, { token: i3.FontAweSomeService }], target: i0.ɵɵFactoryTarget.Component });
-KcardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: KcardComponent, selector: "app-kcard", usesInheritance: true, ngImport: i0, template: "<div class=\"kcard-container e1tag-container-style\"\r\n     *ngIf=\"!isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n     [ngClass]=\"data.Class\" [style]=\"componentProperties.containerStyle.style\" [class]=\"data.ComponentStyleType\">\r\n  <kendo-card [ngClass]=\"getClass(null, data)\" [style]=\"componentProperties.containerStyle.style1\"\r\n              [class]=\"data.ComponentStyleType\" class=\"e1tag-container-style1\">\r\n    <kendo-card-header class=\"k-hstack card-header e1tag-container-style2\" *ngIf=\"data.Icon || data.Title\"\r\n                       [style]=\"componentProperties.containerStyle.style2\">\r\n      <div kendoCardTitle class=\"card-header-content e1tag-container-style3\" [style]=\"componentProperties.containerStyle.style3\">\r\n        <div class=\"left-panel e1tag-container-style4\" [style]=\"componentProperties.containerStyle.style4\">\r\n          <fa-icon *ngIf=\"componentProperties.icon\" class=\"card-icon e1tag-container-style6\"\r\n                   [icon]=\"getFontAwesome(componentProperties.icon.toString(), fontAweSomeService)\"\r\n                   [style]=\"componentProperties.containerStyle.style6\"></fa-icon>\r\n          <ion-label *ngIf=\"componentProperties.title\" class=\"card-title e1tag-container-style7\"\r\n                     [style]=\"componentProperties.containerStyle.style7\">{{componentProperties.title}}</ion-label>\r\n        </div>\r\n        <div class=\"right-panel e1tag-container-style5\" *ngIf=\"data.EditButtonVisible\" [style]=\"componentProperties.containerStyle.style5\">\r\n          <div class=\"read-mode-btns\" *ngIf=\"!data['_EditMode'].value\">\r\n            <ion-button fill=\"outline\" size=\"default\" strong=\"true\" (click)=\"toggleEditMode()\">\r\n              <fa-icon icon=\"edit\"></fa-icon>\r\n              <span class=\"btn-label ion-text-capitalize\">{{getToolBarItemLabelName('Edit')}}</span>\r\n            </ion-button>\r\n          </div>\r\n          <div class=\"edit-mode-btns\" *ngIf=\"data['_EditMode'].value\">\r\n            <ion-button fill=\"solid\" size=\"default\" strong=\"true\" (click)=\"saveData()\">\r\n              <fa-icon icon=\"check\"></fa-icon>\r\n              <span class=\"btn-label ion-text-capitalize\">{{getToolBarItemLabelName('Save')}}</span>\r\n            </ion-button>\r\n            <ion-button fill=\"clear\" size=\"small\" strong=\"false\" (click)=\"cancelEdit()\">\r\n              <span class=\"btn-label ion-text-capitalize\">{{getToolBarItemLabelName('Cancel')}}</span>\r\n            </ion-button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </kendo-card-header>\r\n    <kendo-card-body>\r\n      <app-zdiv class=\"e1tag-container-style8\" [style]=\"componentProperties.containerStyle.style8\" [data]=\"data\"\r\n                [form]=\"myFormGroup ? myFormGroup : form\" [group]=\"group\">\r\n      </app-zdiv>\r\n\r\n      <!-- <app-zformcontrol [ngClass]=\"group[field.isVisibleField] ? field.DivClass :\r\n        ((field.Visible === true) ?  field.DivClass : 'flex-hide')\"\r\n        *ngFor=\"let field of data.Value | divzlayout: data.zlayout\" [field]=\"field\" [group]=\"group\" [form]=\"form\"\r\n        id=\"{{field.Type}}-{{field.Name}}\">\r\n      </app-zformcontrol> -->\r\n    </kendo-card-body>\r\n  </kendo-card>\r\n</div>\r\n", styles: [":host ::ng-deep kendo-card{width:100%!important;margin:auto auto 10px;border-radius:var(--ion-container-border-radius);margin-top:var(--container-margin-top)}:host ::ng-deep kendo-card.left-border-primary{border-left:5px solid var(--ion-color-primary)}:host ::ng-deep kendo-card>.card-header{color:var(--ion-color-primary-shade);padding:0;padding-top:--container-title-padding-top-and-bottom;padding-bottom:--container-title-padding-top-and-bottom}:host ::ng-deep kendo-card>.card-header>.card-header-content{display:flex;width:100%;font-size:var(--content-title-font-size)}:host ::ng-deep kendo-card>.card-header>.card-header-content>.left-panel{padding:12px 16px;flex-grow:1}:host ::ng-deep kendo-card>.card-header>.card-header-content>.left-panel>.card-icon{margin-right:15px}:host ::ng-deep kendo-card>.card-header>.card-header-content>.left-panel>.card-title{font-weight:600}:host ::ng-deep kendo-card>.card-header>.card-header-content>.right-panel{margin:auto 5px}:host ::ng-deep kendo-card>.card-header>.card-header-content>.right-panel ion-button{height:30px}:host ::ng-deep kendo-card>.card-header>.card-header-content>.right-panel ion-button .btn-label{padding-left:5px}:host ::ng-deep kendo-card .k-card-body{padding:5px 10px var(--container-padding-bottom) 5px}:host ::ng-deep kendo-card.body-padding-0 .k-card-body{padding:0}.kcard-container{margin-left:5px}\n"], components: [{ type: i4.CardComponent, selector: "kendo-card", inputs: ["orientation", "width"] }, { type: i4.CardHeaderComponent, selector: "kendo-card-header" }, { type: i5.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i6.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i6.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { type: i4.CardBodyComponent, selector: "kendo-card-body" }, { type: i7.ZdivComponent, selector: "app-zdiv" }], directives: [{ type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i8.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i9.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i4.CardTitleDirective, selector: "[kendoCardTitle]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: KcardComponent, decorators: [{
+KcardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: KcardComponent, deps: [{ token: i1.ZComponentService }, { token: i2.MainService }, { token: i3.FontAweSomeService }], target: i0.ɵɵFactoryTarget.Component });
+KcardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: KcardComponent, selector: "app-kcard", usesInheritance: true, ngImport: i0, template: "<div class=\"kcard-container e1tag-container-style\"\r\n     *ngIf=\"!isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n     [ngClass]=\"data.Class\" [style]=\"componentProperties.containerStyle.style\" [class]=\"data.ComponentStyleType\">\r\n  <kendo-card [ngClass]=\"getClass(null, data)\" [style]=\"componentProperties.containerStyle.style1\"\r\n              [class]=\"data.ComponentStyleType\" class=\"e1tag-container-style1\">\r\n    <kendo-card-header class=\"k-hstack card-header e1tag-container-style2\" *ngIf=\"data.Icon || data.Title\"\r\n                       [style]=\"componentProperties.containerStyle.style2\">\r\n      <div kendoCardTitle class=\"card-header-content e1tag-container-style3\" [style]=\"componentProperties.containerStyle.style3\">\r\n        <div class=\"left-panel e1tag-container-style4\" [style]=\"componentProperties.containerStyle.style4\">\r\n          <fa-icon *ngIf=\"componentProperties.icon\" class=\"card-icon e1tag-container-style6\"\r\n                   [icon]=\"getFontAwesome(componentProperties.icon.toString(), fontAweSomeService)\"\r\n                   [style]=\"componentProperties.containerStyle.style6\"></fa-icon>\r\n          <ion-label *ngIf=\"componentProperties.title\" class=\"card-title e1tag-container-style7\"\r\n                     [style]=\"componentProperties.containerStyle.style7\">{{componentProperties.title}}</ion-label>\r\n        </div>\r\n        <div class=\"right-panel e1tag-container-style5\" *ngIf=\"data.EditButtonVisible\" [style]=\"componentProperties.containerStyle.style5\">\r\n          <div class=\"read-mode-btns\" *ngIf=\"!data['_EditMode'].value\">\r\n            <ion-button fill=\"outline\" size=\"default\" strong=\"true\" (click)=\"toggleEditMode()\">\r\n              <fa-icon icon=\"edit\"></fa-icon>\r\n              <span class=\"btn-label ion-text-capitalize\">{{getToolBarItemLabelName('Edit')}}</span>\r\n            </ion-button>\r\n          </div>\r\n          <div class=\"edit-mode-btns\" *ngIf=\"data['_EditMode'].value\">\r\n            <ion-button fill=\"solid\" size=\"default\" strong=\"true\" (click)=\"saveData()\">\r\n              <fa-icon icon=\"check\"></fa-icon>\r\n              <span class=\"btn-label ion-text-capitalize\">{{getToolBarItemLabelName('Save')}}</span>\r\n            </ion-button>\r\n            <ion-button fill=\"clear\" size=\"small\" strong=\"false\" (click)=\"cancelEdit()\">\r\n              <span class=\"btn-label ion-text-capitalize\">{{getToolBarItemLabelName('Cancel')}}</span>\r\n            </ion-button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </kendo-card-header>\r\n    <kendo-card-body>\r\n      <app-zdiv class=\"e1tag-container-style8\" [style]=\"componentProperties.containerStyle.style8\" [data]=\"data\"\r\n                [form]=\"myFormGroup ? myFormGroup : form\" [group]=\"group\">\r\n      </app-zdiv>\r\n\r\n      <!-- <app-zformcontrol [ngClass]=\"group[field.isVisibleField] ? field.DivClass :\r\n        ((field.Visible === true) ?  field.DivClass : 'flex-hide')\"\r\n        *ngFor=\"let field of data.Value | divzlayout: data.zlayout\" [field]=\"field\" [group]=\"group\" [form]=\"form\"\r\n        id=\"{{field.Type}}-{{field.Name}}\">\r\n      </app-zformcontrol> -->\r\n    </kendo-card-body>\r\n  </kendo-card>\r\n</div>\r\n", styles: [":host ::ng-deep kendo-card{width:100%!important;margin:auto auto 10px;border-radius:var(--ion-container-border-radius);margin-top:var(--container-margin-top)}:host ::ng-deep kendo-card.left-border-primary{border-left:5px solid var(--ion-color-primary)}:host ::ng-deep kendo-card>.card-header{color:var(--ion-color-primary-shade);padding:0;padding-top:--container-title-padding-top-and-bottom;padding-bottom:--container-title-padding-top-and-bottom}:host ::ng-deep kendo-card>.card-header>.card-header-content{display:flex;width:100%;font-size:var(--content-title-font-size)}:host ::ng-deep kendo-card>.card-header>.card-header-content>.left-panel{padding:12px 16px;flex-grow:1}:host ::ng-deep kendo-card>.card-header>.card-header-content>.left-panel>.card-icon{margin-right:15px}:host ::ng-deep kendo-card>.card-header>.card-header-content>.left-panel>.card-title{font-weight:600}:host ::ng-deep kendo-card>.card-header>.card-header-content>.right-panel{margin:auto 5px}:host ::ng-deep kendo-card>.card-header>.card-header-content>.right-panel ion-button{height:30px}:host ::ng-deep kendo-card>.card-header>.card-header-content>.right-panel ion-button .btn-label{padding-left:5px}:host ::ng-deep kendo-card .k-card-body{padding:5px 10px var(--container-padding-bottom) 5px}:host ::ng-deep kendo-card.body-padding-0 .k-card-body{padding:0}.kcard-container{margin-left:5px}\n"], components: [{ type: i4.CardComponent, selector: "kendo-card", inputs: ["orientation", "width"] }, { type: i4.CardHeaderComponent, selector: "kendo-card-header" }, { type: i5.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i6.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i6.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { type: i4.CardBodyComponent, selector: "kendo-card-body" }, { type: i7.ZdivComponent, selector: "app-zdiv" }], directives: [{ type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i8.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i9.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i4.CardTitleDirective, selector: "[kendoCardTitle]" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: KcardComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-kcard", template: "<div class=\"kcard-container e1tag-container-style\"\r\n     *ngIf=\"!isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n     [ngClass]=\"data.Class\" [style]=\"componentProperties.containerStyle.style\" [class]=\"data.ComponentStyleType\">\r\n  <kendo-card [ngClass]=\"getClass(null, data)\" [style]=\"componentProperties.containerStyle.style1\"\r\n              [class]=\"data.ComponentStyleType\" class=\"e1tag-container-style1\">\r\n    <kendo-card-header class=\"k-hstack card-header e1tag-container-style2\" *ngIf=\"data.Icon || data.Title\"\r\n                       [style]=\"componentProperties.containerStyle.style2\">\r\n      <div kendoCardTitle class=\"card-header-content e1tag-container-style3\" [style]=\"componentProperties.containerStyle.style3\">\r\n        <div class=\"left-panel e1tag-container-style4\" [style]=\"componentProperties.containerStyle.style4\">\r\n          <fa-icon *ngIf=\"componentProperties.icon\" class=\"card-icon e1tag-container-style6\"\r\n                   [icon]=\"getFontAwesome(componentProperties.icon.toString(), fontAweSomeService)\"\r\n                   [style]=\"componentProperties.containerStyle.style6\"></fa-icon>\r\n          <ion-label *ngIf=\"componentProperties.title\" class=\"card-title e1tag-container-style7\"\r\n                     [style]=\"componentProperties.containerStyle.style7\">{{componentProperties.title}}</ion-label>\r\n        </div>\r\n        <div class=\"right-panel e1tag-container-style5\" *ngIf=\"data.EditButtonVisible\" [style]=\"componentProperties.containerStyle.style5\">\r\n          <div class=\"read-mode-btns\" *ngIf=\"!data['_EditMode'].value\">\r\n            <ion-button fill=\"outline\" size=\"default\" strong=\"true\" (click)=\"toggleEditMode()\">\r\n              <fa-icon icon=\"edit\"></fa-icon>\r\n              <span class=\"btn-label ion-text-capitalize\">{{getToolBarItemLabelName('Edit')}}</span>\r\n            </ion-button>\r\n          </div>\r\n          <div class=\"edit-mode-btns\" *ngIf=\"data['_EditMode'].value\">\r\n            <ion-button fill=\"solid\" size=\"default\" strong=\"true\" (click)=\"saveData()\">\r\n              <fa-icon icon=\"check\"></fa-icon>\r\n              <span class=\"btn-label ion-text-capitalize\">{{getToolBarItemLabelName('Save')}}</span>\r\n            </ion-button>\r\n            <ion-button fill=\"clear\" size=\"small\" strong=\"false\" (click)=\"cancelEdit()\">\r\n              <span class=\"btn-label ion-text-capitalize\">{{getToolBarItemLabelName('Cancel')}}</span>\r\n            </ion-button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </kendo-card-header>\r\n    <kendo-card-body>\r\n      <app-zdiv class=\"e1tag-container-style8\" [style]=\"componentProperties.containerStyle.style8\" [data]=\"data\"\r\n                [form]=\"myFormGroup ? myFormGroup : form\" [group]=\"group\">\r\n      </app-zdiv>\r\n\r\n      <!-- <app-zformcontrol [ngClass]=\"group[field.isVisibleField] ? field.DivClass :\r\n        ((field.Visible === true) ?  field.DivClass : 'flex-hide')\"\r\n        *ngFor=\"let field of data.Value | divzlayout: data.zlayout\" [field]=\"field\" [group]=\"group\" [form]=\"form\"\r\n        id=\"{{field.Type}}-{{field.Name}}\">\r\n      </app-zformcontrol> -->\r\n    </kendo-card-body>\r\n  </kendo-card>\r\n</div>\r\n", styles: [":host ::ng-deep kendo-card{width:100%!important;margin:auto auto 10px;border-radius:var(--ion-container-border-radius);margin-top:var(--container-margin-top)}:host ::ng-deep kendo-card.left-border-primary{border-left:5px solid var(--ion-color-primary)}:host ::ng-deep kendo-card>.card-header{color:var(--ion-color-primary-shade);padding:0;padding-top:--container-title-padding-top-and-bottom;padding-bottom:--container-title-padding-top-and-bottom}:host ::ng-deep kendo-card>.card-header>.card-header-content{display:flex;width:100%;font-size:var(--content-title-font-size)}:host ::ng-deep kendo-card>.card-header>.card-header-content>.left-panel{padding:12px 16px;flex-grow:1}:host ::ng-deep kendo-card>.card-header>.card-header-content>.left-panel>.card-icon{margin-right:15px}:host ::ng-deep kendo-card>.card-header>.card-header-content>.left-panel>.card-title{font-weight:600}:host ::ng-deep kendo-card>.card-header>.card-header-content>.right-panel{margin:auto 5px}:host ::ng-deep kendo-card>.card-header>.card-header-content>.right-panel ion-button{height:30px}:host ::ng-deep kendo-card>.card-header>.card-header-content>.right-panel ion-button .btn-label{padding-left:5px}:host ::ng-deep kendo-card .k-card-body{padding:5px 10px var(--container-padding-bottom) 5px}:host ::ng-deep kendo-card.body-padding-0 .k-card-body{padding:0}.kcard-container{margin-left:5px}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.ZComponentService }, { type: i2.MainService }, { type: i3.FontAweSomeService }]; } });

package/esm2020/lib/ksplitter/ksplitter.component.mjs

@@ -33,9 +33,9 @@ export class KsplitterComponent extends ContainerFieldBase {
         }
     }
 }
-KsplitterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: KsplitterComponent, deps: [{ token: i1.ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
-KsplitterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: KsplitterComponent, selector: "app-ksplitter", viewQueries: [{ propertyName: "splitter", first: true, predicate: SplitterComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ksplitter-container e1tag-container-style\"\r\n  *ngIf=\"!isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n  [ngClass]=\"data.Class\" [style]=\"componentProperties.containerStyle.style\" [class]=\"data.ComponentStyleType\">\r\n  <kendo-splitter #splitter [orientation]=\"data.Orientation || 'horizontal'\" class=\"e1tag-container-style1\"\r\n    [style]=\"componentProperties.containerStyle.style1\">\r\n    <kendo-splitter-pane  *ngFor=\"let item of data.PanelItems; let i = index\"\r\n      [resizable]=\"item.Resizable != undefined ? item.Resizable : true\"\r\n      [collapsible]=\"item.AllowCollapse != undefined ? item.AllowCollapse : true\" [size]=\"item.Size\"\r\n      class=\"e1tag-container-style2\" [style]=\"componentProperties.containerStyle.style2 + item.Style\"\r\n      [min]=\"item.MinWidth\" [max]=\"item.MaxWidth\"\r\n      (collapsedChange)=\"OnCollapse($event, item)\">\r\n      <app-zdiv [style]=\"componentProperties.containerStyle.style3\" class=\"e1tag-container-style3\"\r\n        [data]=\"data | tabfilter: i + ''\" [form]=\"form\" [group]=\"group\" [containerField]=\"containerField\">\r\n      </app-zdiv>\r\n    </kendo-splitter-pane>\r\n  </kendo-splitter>\r\n</div>\r\n", styles: [""], components: [{ type: i2.SplitterComponent, selector: "kendo-splitter", inputs: ["orientation", "resizeStep"], outputs: ["layoutChange"], exportAs: ["kendoSplitter"] }, { type: i2.SplitterPaneComponent, selector: "kendo-splitter-pane", inputs: ["order", "size", "separatorLabel", "min", "max", "resizable", "collapsible", "scrollable", "collapsed", "orientation", "containsSplitter", "overlayContent"], outputs: ["sizeChange", "collapsedChange"], exportAs: ["kendoSplitterPane"] }, { type: i3.ZdivComponent, selector: "app-zdiv" }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "tabfilter": i6.TabFilter } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: KsplitterComponent, decorators: [{
+KsplitterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: KsplitterComponent, deps: [{ token: i1.ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
+KsplitterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: KsplitterComponent, selector: "app-ksplitter", viewQueries: [{ propertyName: "splitter", first: true, predicate: SplitterComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ksplitter-container e1tag-container-style\"\r\n  *ngIf=\"!isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n  [ngClass]=\"data.Class\" [style]=\"componentProperties.containerStyle.style\" [class]=\"data.ComponentStyleType\">\r\n  <kendo-splitter #splitter [orientation]=\"data.Orientation || 'horizontal'\" class=\"e1tag-container-style1\"\r\n    [style]=\"componentProperties.containerStyle.style1\">\r\n    <kendo-splitter-pane  *ngFor=\"let item of data.PanelItems; let i = index\"\r\n      [resizable]=\"item.Resizable != undefined ? item.Resizable : true\"\r\n      [collapsible]=\"item.AllowCollapse != undefined ? item.AllowCollapse : true\" [size]=\"item.Size\"\r\n      class=\"e1tag-container-style2\" [style]=\"componentProperties.containerStyle.style2 + item.Style\"\r\n      [min]=\"item.MinWidth\" [max]=\"item.MaxWidth\"\r\n      (collapsedChange)=\"OnCollapse($event, item)\">\r\n      <app-zdiv [style]=\"componentProperties.containerStyle.style3\" class=\"e1tag-container-style3\"\r\n        [data]=\"data | tabfilter: i + ''\" [form]=\"form\" [group]=\"group\" [containerField]=\"containerField\">\r\n      </app-zdiv>\r\n    </kendo-splitter-pane>\r\n  </kendo-splitter>\r\n</div>\r\n", styles: [""], components: [{ type: i2.SplitterComponent, selector: "kendo-splitter", inputs: ["orientation"], outputs: ["layoutChange"], exportAs: ["kendoSplitter"] }, { type: i2.SplitterPaneComponent, selector: "kendo-splitter-pane", inputs: ["order", "size", "min", "max", "resizable", "collapsible", "scrollable", "collapsed", "orientation", "containsSplitter", "overlayContent"], outputs: ["sizeChange", "collapsedChange"], exportAs: ["kendoSplitterPane"] }, { type: i3.ZdivComponent, selector: "app-zdiv" }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "tabfilter": i6.TabFilter } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: KsplitterComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-ksplitter", template: "<div class=\"ksplitter-container e1tag-container-style\"\r\n  *ngIf=\"!isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n  [ngClass]=\"data.Class\" [style]=\"componentProperties.containerStyle.style\" [class]=\"data.ComponentStyleType\">\r\n  <kendo-splitter #splitter [orientation]=\"data.Orientation || 'horizontal'\" class=\"e1tag-container-style1\"\r\n    [style]=\"componentProperties.containerStyle.style1\">\r\n    <kendo-splitter-pane  *ngFor=\"let item of data.PanelItems; let i = index\"\r\n      [resizable]=\"item.Resizable != undefined ? item.Resizable : true\"\r\n      [collapsible]=\"item.AllowCollapse != undefined ? item.AllowCollapse : true\" [size]=\"item.Size\"\r\n      class=\"e1tag-container-style2\" [style]=\"componentProperties.containerStyle.style2 + item.Style\"\r\n      [min]=\"item.MinWidth\" [max]=\"item.MaxWidth\"\r\n      (collapsedChange)=\"OnCollapse($event, item)\">\r\n      <app-zdiv [style]=\"componentProperties.containerStyle.style3\" class=\"e1tag-container-style3\"\r\n        [data]=\"data | tabfilter: i + ''\" [form]=\"form\" [group]=\"group\" [containerField]=\"containerField\">\r\n      </app-zdiv>\r\n    </kendo-splitter-pane>\r\n  </kendo-splitter>\r\n</div>\r\n", styles: [""] }]
         }], ctorParameters: function () { return [{ type: i1.ZComponentService }]; }, propDecorators: { splitter: [{

package/esm2020/lib/mmhglobal-dynamicform.module.mjs

@@ -128,8 +128,8 @@ import { ContextMenuComponent } from './embed-components/context-menu/context-me
 import * as i0 from "@angular/core";
 export class MmhglobalDynamicformModule {
 }
-MmhglobalDynamicformModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: MmhglobalDynamicformModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-MmhglobalDynamicformModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: MmhglobalDynamicformModule, declarations: [ScrollbarThemeDirective,
+MmhglobalDynamicformModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: MmhglobalDynamicformModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+MmhglobalDynamicformModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: MmhglobalDynamicformModule, declarations: [ScrollbarThemeDirective,
         FieldElementDirective,
         ZGridBindingDirective,
         ZGridPopupAnchorDirective,
@@ -331,7 +331,7 @@ MmhglobalDynamicformModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.
         KsplitterComponent,
         VirtualScrollComponent,
         ZcolorpickerComponent] });
-MmhglobalDynamicformModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: MmhglobalDynamicformModule, providers: [
+MmhglobalDynamicformModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: MmhglobalDynamicformModule, providers: [
         ModalService
     ], imports: [[
             IonicModule,
@@ -383,7 +383,7 @@ MmhglobalDynamicformModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.
             ColorPickerModule,
             MenusModule
         ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: MmhglobalDynamicformModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: MmhglobalDynamicformModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [

package/esm2020/lib/pipe/htmlSanitize.pipe.mjs

@@ -9,9 +9,9 @@ export class HtmlSanitizePipe {
         return this.domSanitizer.bypassSecurityTrustHtml(html);
     }
 }
-HtmlSanitizePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: HtmlSanitizePipe, deps: [{ token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
-HtmlSanitizePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: HtmlSanitizePipe, name: "htmlSanitize" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: HtmlSanitizePipe, decorators: [{
+HtmlSanitizePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: HtmlSanitizePipe, deps: [{ token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
+HtmlSanitizePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: HtmlSanitizePipe, name: "htmlSanitize" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: HtmlSanitizePipe, decorators: [{
             type: Pipe,
             args: [{ name: 'htmlSanitize' }]
         }], ctorParameters: function () { return [{ type: i1.DomSanitizer }]; } });

package/esm2020/lib/services/main.service.mjs

@@ -1159,9 +1159,9 @@ export class MainService {
         }
     }
 }
-MainService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: MainService, deps: [{ token: i1.Router }, { token: i1.ActivatedRoute }, { token: i2.ModalController }, { token: i2.NavController }, { token: i3.AlertService }, { token: i3.CacheService }, { token: i3.FieldService }, { token: i3.ResourceApiService }, { token: i3.ComponentErrorHandlerService }, { token: i3.WebApiService }, { token: i3.ZCoreService }, { token: i4.ModalService }, { token: i3.StorageSessionService }, { token: i5.ZComponentDebugService }, { token: i3.TranslationService }, { token: i3.SignalrService }, { token: i6.DialogService }, { token: i3.OAuth2Service }, { token: i3.ToastService }, { token: i3.AuthService }], target: i0.ɵɵFactoryTarget.Injectable });
-MainService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: MainService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: MainService, decorators: [{
+MainService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: MainService, deps: [{ token: i1.Router }, { token: i1.ActivatedRoute }, { token: i2.ModalController }, { token: i2.NavController }, { token: i3.AlertService }, { token: i3.CacheService }, { token: i3.FieldService }, { token: i3.ResourceApiService }, { token: i3.ComponentErrorHandlerService }, { token: i3.WebApiService }, { token: i3.ZCoreService }, { token: i4.ModalService }, { token: i3.StorageSessionService }, { token: i5.ZComponentDebugService }, { token: i3.TranslationService }, { token: i3.SignalrService }, { token: i6.DialogService }, { token: i3.OAuth2Service }, { token: i3.ToastService }, { token: i3.AuthService }], target: i0.ɵɵFactoryTarget.Injectable });
+MainService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: MainService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: MainService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',

package/esm2020/lib/services/zcomponent.debug.service.mjs

@@ -647,9 +647,9 @@ export class ZComponentDebugService {
         return this.modalService.show(modalPageParams);
     }
 }
-ZComponentDebugService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ZComponentDebugService, deps: [{ token: i1.Router }, { token: i2.AlertService }, { token: i2.AuthService }, { token: i2.FieldService }, { token: i2.ResourceApiService }, { token: i2.ComponentErrorHandlerService }, { token: i2.ToastService }, { token: i3.ModalService }, { token: i2.WebApiService }, { token: i2.SignalrService }], target: i0.ɵɵFactoryTarget.Injectable });
-ZComponentDebugService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ZComponentDebugService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ZComponentDebugService, decorators: [{
+ZComponentDebugService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZComponentDebugService, deps: [{ token: i1.Router }, { token: i2.AlertService }, { token: i2.AuthService }, { token: i2.FieldService }, { token: i2.ResourceApiService }, { token: i2.ComponentErrorHandlerService }, { token: i2.ToastService }, { token: i3.ModalService }, { token: i2.WebApiService }, { token: i2.SignalrService }], target: i0.ɵɵFactoryTarget.Injectable });
+ZComponentDebugService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZComponentDebugService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZComponentDebugService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'

package/esm2020/lib/services/zcomponent.service.mjs

@@ -286,9 +286,9 @@ export class ZComponentService {
         return false;
     }
 }
-ZComponentService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ZComponentService, deps: [{ token: i1.UISignalService }, { token: i2.ComponentObjectService }, { token: i1.TranslationService }, { token: i1.ZCoreService }, { token: i1.FieldService }], target: i0.ɵɵFactoryTarget.Injectable });
-ZComponentService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ZComponentService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ZComponentService, decorators: [{
+ZComponentService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZComponentService, deps: [{ token: i1.UISignalService }, { token: i2.ComponentObjectService }, { token: i1.TranslationService }, { token: i1.ZCoreService }, { token: i1.FieldService }], target: i0.ɵɵFactoryTarget.Injectable });
+ZComponentService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZComponentService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZComponentService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'