mmhglobal-dynamicform 1.3.3 → 1.3.6

package/esm2020/lib/zcheckbox/zcheckbox.component.mjs

@@ -151,9 +151,9 @@ export class ZcheckboxComponent {
         return 'notooltipsinfo-adjustment';
     }
 }
-ZcheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZcheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ZcheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZcheckboxComponent, selector: "app-zcheckbox", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<ion-item [ngClass]=\"getClass(form, data)\" [formGroup]=\"form\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\">\r\n  <ion-label *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\"\r\n             [attr.for]=\"data.Value\"\r\n             [position]=\"data.LabelPosition ? data.LabelPosition : 'stacked'\"\r\n             [ngStyle]=\"getLabelStyle()\"\r\n             [ngClass]=\"data.LabelDivClass\">\r\n    {{data.Label}}\r\n    <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\"\r\n              color=\"danger\">\r\n      *\r\n    </ion-text>\r\n    <span kendoTooltip\r\n          *ngIf=\"!isMobileScreen() && tooltipsInfo && showTooltipsInfoIcon\"\r\n          [title]=\"tooltipsDisplayText\">\r\n      <fa-icon [icon]=\"tooltipsDisplayIcon\"\r\n               class=\"tooltipsinfo-icon\">\r\n      </fa-icon>\r\n    </span>\r\n  </ion-label>\r\n  <div class=\"ion-row divcheckbox\" [ngClass]=\"getCheckboxClass()\">\r\n    <div *ngIf=\"useKendoSwitch\">\r\n      <span>\r\n        <kendo-switch [id]=\"data.Value\"\r\n                      [formControlName]=\"data.Value\"\r\n                      [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                      (valueChange)=\"onSwitchChange($event)\"\r\n                      style=\"margin: 7px 0 0 0; width: 100%\"></kendo-switch>\r\n      </span>\r\n    </div>\r\n    <div *ngIf=\"!useKendoSwitch\" [class]=\"setTooltipsInfoSideBySide()\">\r\n      <!--<input kendoCheckBox\r\n             type=\"checkbox\"\r\n             [id]=\"data.Value\"\r\n             [formControlName]=\"data.Value\"\r\n             [disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n             (valueChange)=\"onChange($event)\" />-->\r\n      <ion-checkbox style=\"margin: 8px 0;\"\r\n                    [id]=\"data.Value\"\r\n                    [formControlName]=\"data.Value\"\r\n                    color=\"primary\"\r\n                    [attr.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                    (ionChange)=\"onChange($event)\"></ion-checkbox>\r\n      <kendo-label *ngIf=\"tooltipsInfo && !showTooltipsInfoIcon\"\r\n                   [text]=\"tooltipsDisplayText\"\r\n                   class=\"tooltipsinfo-text\"\r\n                   [style.color]=\"setTooltipsInfoColor()\">\r\n      </kendo-label>\r\n      <app-uivalidationmessage [group]=\"group\" [data]=\"data\" [form]=\"form\"></app-uivalidationmessage>\r\n    </div>\r\n  </div>\r\n</ion-item>\r\n", styles: [".ionItem{display:flex;flex-flow:row wrap}.gridInlineEdit{--background: transparent}.item.sc-ion-label-md-h,.item .sc-ion-label-md-h{font-weight:var(--z-label-weight);color:var(--z-label-color);text-shadow:var(--z-label-shadow)}:host ::ng-deep ion-item .k-checkbox{margin:6px 0 0 1.5px;height:22px;width:22px}:host ::ng-deep ion-item .k-checkbox:checked,:host ::ng-deep ion-item .k-checkbox.k-checked{margin:6px 0 0 1.5px;height:22px;width:22px;background-color:#3880ff;border:0px;outline:0}:host ::ng-deep ion-item .divcheckbox{justify-content:space-between;order:1}:host ::ng-deep ion-item .notooltipsinfo-adjustment{display:grid;grid-template-columns:.1fr;grid-gap:0px;padding-top:1px}:host ::ng-deep ion-item .tooltipsinfo-text{text-align:justify;text-justify:inter-word;word-wrap:break-word;font-size:10px;margin:6px 0;float:right}:host ::ng-deep ion-item .tooltipsinfo-right{display:grid;grid-template-columns:.1fr .9fr;grid-gap:5px}:host ::ng-deep ion-item .tooltipsinfo-icon{padding-left:10px;color:#3880ff}\n"], components: [{ type: i1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i3.SwitchComponent, selector: "kendo-switch", inputs: ["focusableId", "disabled", "readonly", "tabindex", "checked", "size", "thumbRounded", "trackRounded", "tabIndex", "onLabel", "offLabel"], outputs: ["focus", "blur", "valueChange"], exportAs: ["kendoSwitch"] }, { type: i1.IonCheckbox, selector: "ion-checkbox", inputs: ["checked", "color", "disabled", "indeterminate", "mode", "name", "value"] }, { type: i4.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional"], exportAs: ["kendoLabel"] }, { type: i5.UivalidationmessageComponent, selector: "app-uivalidationmessage", inputs: ["group", "data", "form"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i7.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i6.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i8.TooltipDirective, selector: "[kendoTooltip]", inputs: ["filter", "position", "showAfter", "callout", "closable", "offset", "tooltipTemplate", "showOn", "titleTemplate", "tooltipWidth", "tooltipHeight", "tooltipClass", "collision", "closeTitle"], exportAs: ["kendoTooltip"] }, { type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i1.BooleanValueAccessor, selector: "ion-checkbox,ion-toggle" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZcheckboxComponent, decorators: [{
+ZcheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZcheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ZcheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZcheckboxComponent, selector: "app-zcheckbox", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<ion-item [ngClass]=\"getClass(form, data)\" [formGroup]=\"form\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\">\r\n  <ion-label *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\"\r\n             [attr.for]=\"data.Value\"\r\n             [position]=\"data.LabelPosition ? data.LabelPosition : 'stacked'\"\r\n             [ngStyle]=\"getLabelStyle()\"\r\n             [ngClass]=\"data.LabelDivClass\">\r\n    {{data.Label}}\r\n    <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\"\r\n              color=\"danger\">\r\n      *\r\n    </ion-text>\r\n    <span kendoTooltip\r\n          *ngIf=\"!isMobileScreen() && tooltipsInfo && showTooltipsInfoIcon\"\r\n          [title]=\"tooltipsDisplayText\">\r\n      <fa-icon [icon]=\"tooltipsDisplayIcon\"\r\n               class=\"tooltipsinfo-icon\">\r\n      </fa-icon>\r\n    </span>\r\n  </ion-label>\r\n  <div class=\"ion-row divcheckbox\" [ngClass]=\"getCheckboxClass()\">\r\n    <div *ngIf=\"useKendoSwitch\">\r\n      <span>\r\n        <kendo-switch [id]=\"data.Value\"\r\n                      [formControlName]=\"data.Value\"\r\n                      [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                      (valueChange)=\"onSwitchChange($event)\"\r\n                      style=\"margin: 7px 0 0 0; width: 100%\"></kendo-switch>\r\n      </span>\r\n    </div>\r\n    <div *ngIf=\"!useKendoSwitch\" [class]=\"setTooltipsInfoSideBySide()\">\r\n      <!--<input kendoCheckBox\r\n             type=\"checkbox\"\r\n             [id]=\"data.Value\"\r\n             [formControlName]=\"data.Value\"\r\n             [disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n             (valueChange)=\"onChange($event)\" />-->\r\n      <ion-checkbox style=\"margin: 8px 0;\"\r\n                    [id]=\"data.Value\"\r\n                    [formControlName]=\"data.Value\"\r\n                    color=\"primary\"\r\n                    [attr.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                    (ionChange)=\"onChange($event)\"></ion-checkbox>\r\n      <kendo-label *ngIf=\"tooltipsInfo && !showTooltipsInfoIcon\"\r\n                   [text]=\"tooltipsDisplayText\"\r\n                   class=\"tooltipsinfo-text\"\r\n                   [style.color]=\"setTooltipsInfoColor()\">\r\n      </kendo-label>\r\n      <app-uivalidationmessage [group]=\"group\" [data]=\"data\" [form]=\"form\"></app-uivalidationmessage>\r\n    </div>\r\n  </div>\r\n</ion-item>\r\n", styles: [".ionItem{display:flex;flex-flow:row wrap}.gridInlineEdit{--background: transparent}.item.sc-ion-label-md-h,.item .sc-ion-label-md-h{font-weight:var(--z-label-weight);color:var(--z-label-color);text-shadow:var(--z-label-shadow)}:host ::ng-deep ion-item .k-checkbox{margin:6px 0 0 1.5px;height:22px;width:22px}:host ::ng-deep ion-item .k-checkbox:checked,:host ::ng-deep ion-item .k-checkbox.k-checked{margin:6px 0 0 1.5px;height:22px;width:22px;background-color:#3880ff;border:0px;outline:0}:host ::ng-deep ion-item .divcheckbox{justify-content:space-between;order:1}:host ::ng-deep ion-item .notooltipsinfo-adjustment{display:grid;grid-template-columns:.1fr;grid-gap:0px;padding-top:1px}:host ::ng-deep ion-item .tooltipsinfo-text{text-align:justify;text-justify:inter-word;word-wrap:break-word;font-size:10px;margin:6px 0;float:right}:host ::ng-deep ion-item .tooltipsinfo-right{display:grid;grid-template-columns:.1fr .9fr;grid-gap:5px}:host ::ng-deep ion-item .tooltipsinfo-icon{padding-left:10px;color:#3880ff}\n"], components: [{ type: i1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i3.SwitchComponent, selector: "kendo-switch", inputs: ["focusableId", "disabled", "readonly", "tabindex", "checked", "size", "thumbRounded", "trackRounded", "tabIndex", "onLabel", "offLabel"], outputs: ["focus", "blur", "valueChange"], exportAs: ["kendoSwitch"] }, { type: i1.IonCheckbox, selector: "ion-checkbox", inputs: ["checked", "color", "disabled", "indeterminate", "mode", "name", "value"] }, { type: i4.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional"], exportAs: ["kendoLabel"] }, { type: i5.UivalidationmessageComponent, selector: "app-uivalidationmessage", inputs: ["group", "data", "form"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i7.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i6.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i8.TooltipDirective, selector: "[kendoTooltip]", inputs: ["filter", "position", "showAfter", "callout", "closable", "offset", "tooltipTemplate", "showOn", "titleTemplate", "tooltipWidth", "tooltipHeight", "tooltipClass", "collision", "closeTitle"], exportAs: ["kendoTooltip"] }, { type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i1.BooleanValueAccessor, selector: "ion-checkbox,ion-toggle" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZcheckboxComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-zcheckbox", template: "<ion-item [ngClass]=\"getClass(form, data)\" [formGroup]=\"form\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\">\r\n  <ion-label *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\"\r\n             [attr.for]=\"data.Value\"\r\n             [position]=\"data.LabelPosition ? data.LabelPosition : 'stacked'\"\r\n             [ngStyle]=\"getLabelStyle()\"\r\n             [ngClass]=\"data.LabelDivClass\">\r\n    {{data.Label}}\r\n    <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\"\r\n              color=\"danger\">\r\n      *\r\n    </ion-text>\r\n    <span kendoTooltip\r\n          *ngIf=\"!isMobileScreen() && tooltipsInfo && showTooltipsInfoIcon\"\r\n          [title]=\"tooltipsDisplayText\">\r\n      <fa-icon [icon]=\"tooltipsDisplayIcon\"\r\n               class=\"tooltipsinfo-icon\">\r\n      </fa-icon>\r\n    </span>\r\n  </ion-label>\r\n  <div class=\"ion-row divcheckbox\" [ngClass]=\"getCheckboxClass()\">\r\n    <div *ngIf=\"useKendoSwitch\">\r\n      <span>\r\n        <kendo-switch [id]=\"data.Value\"\r\n                      [formControlName]=\"data.Value\"\r\n                      [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                      (valueChange)=\"onSwitchChange($event)\"\r\n                      style=\"margin: 7px 0 0 0; width: 100%\"></kendo-switch>\r\n      </span>\r\n    </div>\r\n    <div *ngIf=\"!useKendoSwitch\" [class]=\"setTooltipsInfoSideBySide()\">\r\n      <!--<input kendoCheckBox\r\n             type=\"checkbox\"\r\n             [id]=\"data.Value\"\r\n             [formControlName]=\"data.Value\"\r\n             [disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n             (valueChange)=\"onChange($event)\" />-->\r\n      <ion-checkbox style=\"margin: 8px 0;\"\r\n                    [id]=\"data.Value\"\r\n                    [formControlName]=\"data.Value\"\r\n                    color=\"primary\"\r\n                    [attr.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                    (ionChange)=\"onChange($event)\"></ion-checkbox>\r\n      <kendo-label *ngIf=\"tooltipsInfo && !showTooltipsInfoIcon\"\r\n                   [text]=\"tooltipsDisplayText\"\r\n                   class=\"tooltipsinfo-text\"\r\n                   [style.color]=\"setTooltipsInfoColor()\">\r\n      </kendo-label>\r\n      <app-uivalidationmessage [group]=\"group\" [data]=\"data\" [form]=\"form\"></app-uivalidationmessage>\r\n    </div>\r\n  </div>\r\n</ion-item>\r\n", styles: [".ionItem{display:flex;flex-flow:row wrap}.gridInlineEdit{--background: transparent}.item.sc-ion-label-md-h,.item .sc-ion-label-md-h{font-weight:var(--z-label-weight);color:var(--z-label-color);text-shadow:var(--z-label-shadow)}:host ::ng-deep ion-item .k-checkbox{margin:6px 0 0 1.5px;height:22px;width:22px}:host ::ng-deep ion-item .k-checkbox:checked,:host ::ng-deep ion-item .k-checkbox.k-checked{margin:6px 0 0 1.5px;height:22px;width:22px;background-color:#3880ff;border:0px;outline:0}:host ::ng-deep ion-item .divcheckbox{justify-content:space-between;order:1}:host ::ng-deep ion-item .notooltipsinfo-adjustment{display:grid;grid-template-columns:.1fr;grid-gap:0px;padding-top:1px}:host ::ng-deep ion-item .tooltipsinfo-text{text-align:justify;text-justify:inter-word;word-wrap:break-word;font-size:10px;margin:6px 0;float:right}:host ::ng-deep ion-item .tooltipsinfo-right{display:grid;grid-template-columns:.1fr .9fr;grid-gap:5px}:host ::ng-deep ion-item .tooltipsinfo-icon{padding-left:10px;color:#3880ff}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { data: [{

package/esm2020/lib/zchip/zchip.component.mjs

@@ -103,9 +103,9 @@ export class ZChipComponent {
         this.tooltipDir.toggle(element);
     }
 }
-ZChipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZChipComponent, deps: [{ token: i1.AuthService }], target: i0.ɵɵFactoryTarget.Component });
-ZChipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZChipComponent, selector: "app-zchip", inputs: { data: "data", group: "group", form: "form" }, viewQueries: [{ propertyName: "tooltipDir", first: true, predicate: TooltipDirective, descendants: true }], ngImport: i0, template: "<div\r\n  *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n  style=\"margin: 10px 0 6px 0;\" [ngClass]=\"getClass()\">\r\n  <ng-template #template let-anchor>\r\n    <span>{{ anchor.nativeElement.innerText }}</span>\r\n  </ng-template>\r\n  <div kendoTooltip [tooltipTemplate]=\"template\">\r\n    <kendo-chip-list [selection]=\"data.Multiple ? 'multiple' : 'single'\"\r\n      (selectedChange)=\"chipListChangeSelection($event)\">\r\n      <kendo-chip *ngFor=\"let chip of dataSource\" [label]=\"chip.Label\" [selected]=\"chip.Selected\"\r\n        (mouseover)=\"mouseover($event, chip)\" [ngClass]=\"getChipClass(chip)\" [icon]=\"chip.Icon\"\r\n        [selectedIcon]=\"chip.SelectedIcon\" (click)=\"chipChangeSelection(chip)\" >\r\n      </kendo-chip>\r\n    </kendo-chip-list>\r\n  </div>\r\n</div>\r\n", styles: [".medium kendo-chip{padding:20px;margin:5px;font-size:15px;min-height:50px;height:55px;max-height:60px;min-width:280px;max-width:320px}.mediumHeight kendo-chip-list{max-height:400px;border:1px solid black;padding:5px 15px;overflow-x:auto;border-radius:10px}.vertical kendo-chip-list{display:flex;flex-direction:column}.customColor .k-chip-filled.k-chip-selected{background-color:#bafff6;color:#000;font-weight:600}.customColor .k-chip-filled.k-chip-selected:hover{background-color:#9afcf0}.customColor .k-chip-filled.k-chip-has-icon:hover{background-color:#b5b5b5;color:#000}.customColor .chip-pointing{border:3px solid #1a63d9!important}\n"], components: [{ type: i2.ChipListComponent, selector: "kendo-chiplist, kendo-chip-list", inputs: ["selection", "size"], outputs: ["selectedChange", "remove"] }, { type: i2.ChipComponent, selector: "kendo-chip", inputs: ["selected", "removable", "disabled", "size", "rounded", "fillMode", "themeColor", "label", "icon", "iconClass", "avatarClass", "removeIcon"], outputs: ["remove", "contentClick"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.TooltipDirective, selector: "[kendoTooltip]", inputs: ["filter", "position", "showAfter", "callout", "closable", "offset", "tooltipTemplate", "showOn", "titleTemplate", "tooltipWidth", "tooltipHeight", "tooltipClass", "collision", "closeTitle"], exportAs: ["kendoTooltip"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZChipComponent, decorators: [{
+ZChipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZChipComponent, deps: [{ token: i1.AuthService }], target: i0.ɵɵFactoryTarget.Component });
+ZChipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZChipComponent, selector: "app-zchip", inputs: { data: "data", group: "group", form: "form" }, viewQueries: [{ propertyName: "tooltipDir", first: true, predicate: TooltipDirective, descendants: true }], ngImport: i0, template: "<div\r\n  *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n  style=\"margin: 10px 0 6px 0;\" [ngClass]=\"getClass()\">\r\n  <ng-template #template let-anchor>\r\n    <span>{{ anchor.nativeElement.innerText }}</span>\r\n  </ng-template>\r\n  <div kendoTooltip [tooltipTemplate]=\"template\">\r\n    <kendo-chip-list [selection]=\"data.Multiple ? 'multiple' : 'single'\"\r\n      (selectedChange)=\"chipListChangeSelection($event)\">\r\n      <kendo-chip *ngFor=\"let chip of dataSource\" [label]=\"chip.Label\" [selected]=\"chip.Selected\"\r\n        (mouseover)=\"mouseover($event, chip)\" [ngClass]=\"getChipClass(chip)\" [icon]=\"chip.Icon\"\r\n        [selectedIcon]=\"chip.SelectedIcon\" (click)=\"chipChangeSelection(chip)\" >\r\n      </kendo-chip>\r\n    </kendo-chip-list>\r\n  </div>\r\n</div>\r\n", styles: [".medium kendo-chip{padding:20px;margin:5px;font-size:15px;min-height:50px;height:55px;max-height:60px;min-width:280px;max-width:320px}.mediumHeight kendo-chip-list{max-height:400px;border:1px solid black;padding:5px 15px;overflow-x:auto;border-radius:10px}.vertical kendo-chip-list{display:flex;flex-direction:column}.customColor .k-chip-filled.k-chip-selected{background-color:#bafff6;color:#000;font-weight:600}.customColor .k-chip-filled.k-chip-selected:hover{background-color:#9afcf0}.customColor .k-chip-filled.k-chip-has-icon:hover{background-color:#b5b5b5;color:#000}.customColor .chip-pointing{border:3px solid #1a63d9!important}\n"], components: [{ type: i2.ChipListComponent, selector: "kendo-chiplist, kendo-chip-list", inputs: ["selection", "size"], outputs: ["selectedChange", "remove"] }, { type: i2.ChipComponent, selector: "kendo-chip", inputs: ["selected", "removable", "disabled", "size", "rounded", "fillMode", "themeColor", "label", "icon", "iconClass", "avatarClass", "removeIcon"], outputs: ["remove", "contentClick"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.TooltipDirective, selector: "[kendoTooltip]", inputs: ["filter", "position", "showAfter", "callout", "closable", "offset", "tooltipTemplate", "showOn", "titleTemplate", "tooltipWidth", "tooltipHeight", "tooltipClass", "collision", "closeTitle"], exportAs: ["kendoTooltip"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZChipComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-zchip', template: "<div\r\n  *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n  style=\"margin: 10px 0 6px 0;\" [ngClass]=\"getClass()\">\r\n  <ng-template #template let-anchor>\r\n    <span>{{ anchor.nativeElement.innerText }}</span>\r\n  </ng-template>\r\n  <div kendoTooltip [tooltipTemplate]=\"template\">\r\n    <kendo-chip-list [selection]=\"data.Multiple ? 'multiple' : 'single'\"\r\n      (selectedChange)=\"chipListChangeSelection($event)\">\r\n      <kendo-chip *ngFor=\"let chip of dataSource\" [label]=\"chip.Label\" [selected]=\"chip.Selected\"\r\n        (mouseover)=\"mouseover($event, chip)\" [ngClass]=\"getChipClass(chip)\" [icon]=\"chip.Icon\"\r\n        [selectedIcon]=\"chip.SelectedIcon\" (click)=\"chipChangeSelection(chip)\" >\r\n      </kendo-chip>\r\n    </kendo-chip-list>\r\n  </div>\r\n</div>\r\n", styles: [".medium kendo-chip{padding:20px;margin:5px;font-size:15px;min-height:50px;height:55px;max-height:60px;min-width:280px;max-width:320px}.mediumHeight kendo-chip-list{max-height:400px;border:1px solid black;padding:5px 15px;overflow-x:auto;border-radius:10px}.vertical kendo-chip-list{display:flex;flex-direction:column}.customColor .k-chip-filled.k-chip-selected{background-color:#bafff6;color:#000;font-weight:600}.customColor .k-chip-filled.k-chip-selected:hover{background-color:#9afcf0}.customColor .k-chip-filled.k-chip-has-icon:hover{background-color:#b5b5b5;color:#000}.customColor .chip-pointing{border:3px solid #1a63d9!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.AuthService }]; }, propDecorators: { data: [{

package/esm2020/lib/zcodeeditor/zcodeeditor.component.mjs

@@ -151,9 +151,9 @@ export class ZcodeeditorComponent {
         });
     }
 }
-ZcodeeditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZcodeeditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ZcodeeditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZcodeeditorComponent, selector: "app-zcodeeditor", inputs: { data: "data", group: "group", form: "form" }, viewQueries: [{ propertyName: "editor", first: true, predicate: ["editor"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\">\r\n  <ion-label *ngIf=\"data.ShowLabel\" position=\"stacked\" style=\"margin-bottom: 10px;\">\r\n    {{data.Label}} <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\" color=\"danger\">*</ion-text>\r\n  </ion-label>\r\n  <div>\r\n  <!-- <div ace-editor\r\n       [(text)]=\"text\"\r\n       ></div> -->\r\n  <ace-editor [readOnly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\" #editor [ngStyle]=\"getEditorStyle()\" (textChanged)=\"onTextChange($event)\" [text]=\"getValue() | editorfilter\" [theme]=\"theme\" [mode]=\"mode\"></ace-editor>\r\n\r\n    <!-- <ngx-monaco-editor #editor [options]=\"editorOptions\" [(ngModel)]=\"code\" (onInit)=\"onInit($event)\"></ngx-monaco-editor> -->\r\n  </div>\r\n\r\n</div>", styles: [""], components: [{ type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { type: i2.AceEditorComponent, selector: "ace-editor", inputs: ["style", "options", "readOnly", "theme", "mode", "value", "text", "autoUpdateContent", "durationBeforeCallback"], outputs: ["textChanged", "textChange"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "editorfilter": i4.EditorFilter } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZcodeeditorComponent, decorators: [{
+ZcodeeditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZcodeeditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ZcodeeditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZcodeeditorComponent, selector: "app-zcodeeditor", inputs: { data: "data", group: "group", form: "form" }, viewQueries: [{ propertyName: "editor", first: true, predicate: ["editor"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\">\r\n  <ion-label *ngIf=\"data.ShowLabel\" position=\"stacked\" style=\"margin-bottom: 10px;\">\r\n    {{data.Label}} <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\" color=\"danger\">*</ion-text>\r\n  </ion-label>\r\n  <div>\r\n  <!-- <div ace-editor\r\n       [(text)]=\"text\"\r\n       ></div> -->\r\n  <ace-editor [readOnly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\" #editor [ngStyle]=\"getEditorStyle()\" (textChanged)=\"onTextChange($event)\" [text]=\"getValue() | editorfilter\" [theme]=\"theme\" [mode]=\"mode\"></ace-editor>\r\n\r\n    <!-- <ngx-monaco-editor #editor [options]=\"editorOptions\" [(ngModel)]=\"code\" (onInit)=\"onInit($event)\"></ngx-monaco-editor> -->\r\n  </div>\r\n\r\n</div>", styles: [""], components: [{ type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { type: i2.AceEditorComponent, selector: "ace-editor", inputs: ["style", "options", "readOnly", "theme", "mode", "value", "text", "autoUpdateContent", "durationBeforeCallback"], outputs: ["textChanged", "textChange"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "editorfilter": i4.EditorFilter } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZcodeeditorComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-zcodeeditor", template: "<div *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\">\r\n  <ion-label *ngIf=\"data.ShowLabel\" position=\"stacked\" style=\"margin-bottom: 10px;\">\r\n    {{data.Label}} <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\" color=\"danger\">*</ion-text>\r\n  </ion-label>\r\n  <div>\r\n  <!-- <div ace-editor\r\n       [(text)]=\"text\"\r\n       ></div> -->\r\n  <ace-editor [readOnly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\" #editor [ngStyle]=\"getEditorStyle()\" (textChanged)=\"onTextChange($event)\" [text]=\"getValue() | editorfilter\" [theme]=\"theme\" [mode]=\"mode\"></ace-editor>\r\n\r\n    <!-- <ngx-monaco-editor #editor [options]=\"editorOptions\" [(ngModel)]=\"code\" (onInit)=\"onInit($event)\"></ngx-monaco-editor> -->\r\n  </div>\r\n\r\n</div>", styles: [""] }]
         }], ctorParameters: function () { return []; }, propDecorators: { data: [{

package/esm2020/lib/zcodeeditor/zcodeeditor.pipe.mjs

@@ -48,9 +48,9 @@ export class EditorFilter {
         // cache = null; // Enable garbage collection
     }
 }
-EditorFilter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: EditorFilter, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-EditorFilter.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: EditorFilter, name: "editorfilter", pure: false });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: EditorFilter, decorators: [{
+EditorFilter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: EditorFilter, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+EditorFilter.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: EditorFilter, name: "editorfilter", pure: false });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: EditorFilter, decorators: [{
             type: Pipe,
             args: [{
                     name: 'editorfilter',

package/esm2020/lib/zdaterange/zdaterange.component.mjs

@@ -52,9 +52,9 @@ export class ZdaterangeComponent {
         });
     }
 }
-ZdaterangeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZdaterangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ZdaterangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZdaterangeComponent, selector: "app-zdaterange", inputs: { data: "data", group: "group", form: "form" }, viewQueries: [{ propertyName: "zdaterange", first: true, predicate: ["zdaterange"], descendants: true }], ngImport: i0, template: "<ion-item [formGroup]=\"form\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\">\r\n  <ion-label [attr.for]=\"data.Value\" *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\" position=\"stacked\">\r\n    {{data.Label}} <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\" color=\"danger\">*</ion-text>\r\n  </ion-label>\r\n  <div class=\"ion-row\" style=\"justify-content: space-between; width: 100%\">\r\n    <span style=\"flex: 1;\">\r\n      <kendo-daterange #zdaterange class=\"ion-row\">\r\n        <!-- <label style=\"flex: 1;\"> -->\r\n        <!-- <span class=\"label\">Start</span> -->\r\n        <kendo-dateinput style=\"flex: 1;\" kendoDateRangeStartInput [(value)]=\"range.start\" \r\n        [attr.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"></kendo-dateinput>\r\n        <!-- </label> -->\r\n        <!-- <label style=\"flex: 1;\"> -->\r\n        <!-- <span class=\"label\">End</span> -->\r\n        <!-- <kendo-dateinput style=\"flex: 1;\" kendoDateRangeEndInput [(value)]=\"range.end\"></kendo-dateinput> -->\r\n        <!-- </label> -->\r\n\r\n        <kendo-daterange-popup [animate]=\"false\"></kendo-daterange-popup>\r\n      </kendo-daterange>\r\n    </span>\r\n    <app-uivalidationmessage [group]=\"group\" [data]=\"data\" [form]=\"form\"></app-uivalidationmessage>\r\n  </div>\r\n</ion-item>", styles: [".item.sc-ion-label-md-h,.item .sc-ion-label-md-h{font-weight:var(--z-label-weight);color:var(--z-label-color);text-shadow:var(--z-label-shadow)}.k-dateinput{color:var(--z-text-color)}\n"], components: [{ type: i1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { type: i2.DateRangeComponent, selector: "kendo-daterange" }, { type: i2.DateInputComponent, selector: "kendo-dateinput", inputs: ["focusableId", "disabled", "readonly", "title", "tabindex", "role", "ariaReadOnly", "format", "placeholder", "steps", "rangeValidation", "autoCorrect", "incompleteDateValidation", "twoDigitYearMax", "spinners", "isPopupOpen", "hasPopup", "tabIndex", "value", "size", "rounded", "fillMode", "formatPlaceholder", "max", "min"], outputs: ["valueChange", "valueUpdate", "focus", "blur"], exportAs: ["kendo-dateinput"] }, { type: i2.DateRangePopupComponent, selector: "kendo-daterange-popup", inputs: ["animate", "collision", "anchor", "anchorAlign", "appendTo", "popupAlign", "margin"], outputs: ["open", "close", "blur", "focus", "cancel"], exportAs: ["kendo-daterange-popup"] }, { type: i3.UivalidationmessageComponent, selector: "app-uivalidationmessage", inputs: ["group", "data", "form"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2.DateRangeStartInputDirective, selector: "[kendoDateRangeStartInput]", inputs: ["navigateCalendarOnFocus", "autoCorrectOn"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZdaterangeComponent, decorators: [{
+ZdaterangeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZdaterangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ZdaterangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZdaterangeComponent, selector: "app-zdaterange", inputs: { data: "data", group: "group", form: "form" }, viewQueries: [{ propertyName: "zdaterange", first: true, predicate: ["zdaterange"], descendants: true }], ngImport: i0, template: "<ion-item [formGroup]=\"form\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\">\r\n  <ion-label [attr.for]=\"data.Value\" *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\" position=\"stacked\">\r\n    {{data.Label}} <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\" color=\"danger\">*</ion-text>\r\n  </ion-label>\r\n  <div class=\"ion-row\" style=\"justify-content: space-between; width: 100%\">\r\n    <span style=\"flex: 1;\">\r\n      <kendo-daterange #zdaterange class=\"ion-row\">\r\n        <!-- <label style=\"flex: 1;\"> -->\r\n        <!-- <span class=\"label\">Start</span> -->\r\n        <kendo-dateinput style=\"flex: 1;\" kendoDateRangeStartInput [(value)]=\"range.start\" \r\n        [attr.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"></kendo-dateinput>\r\n        <!-- </label> -->\r\n        <!-- <label style=\"flex: 1;\"> -->\r\n        <!-- <span class=\"label\">End</span> -->\r\n        <!-- <kendo-dateinput style=\"flex: 1;\" kendoDateRangeEndInput [(value)]=\"range.end\"></kendo-dateinput> -->\r\n        <!-- </label> -->\r\n\r\n        <kendo-daterange-popup [animate]=\"false\"></kendo-daterange-popup>\r\n      </kendo-daterange>\r\n    </span>\r\n    <app-uivalidationmessage [group]=\"group\" [data]=\"data\" [form]=\"form\"></app-uivalidationmessage>\r\n  </div>\r\n</ion-item>", styles: [".item.sc-ion-label-md-h,.item .sc-ion-label-md-h{font-weight:var(--z-label-weight);color:var(--z-label-color);text-shadow:var(--z-label-shadow)}.k-dateinput{color:var(--z-text-color)}\n"], components: [{ type: i1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { type: i2.DateRangeComponent, selector: "kendo-daterange" }, { type: i2.DateInputComponent, selector: "kendo-dateinput", inputs: ["focusableId", "disabled", "readonly", "title", "tabindex", "role", "ariaReadOnly", "format", "placeholder", "steps", "rangeValidation", "autoCorrect", "incompleteDateValidation", "twoDigitYearMax", "spinners", "isPopupOpen", "hasPopup", "tabIndex", "value", "size", "rounded", "fillMode", "formatPlaceholder", "max", "min"], outputs: ["valueChange", "valueUpdate", "focus", "blur"], exportAs: ["kendo-dateinput"] }, { type: i2.DateRangePopupComponent, selector: "kendo-daterange-popup", inputs: ["animate", "collision", "anchor", "anchorAlign", "appendTo", "popupAlign", "margin"], outputs: ["open", "close", "blur", "focus", "cancel"], exportAs: ["kendo-daterange-popup"] }, { type: i3.UivalidationmessageComponent, selector: "app-uivalidationmessage", inputs: ["group", "data", "form"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2.DateRangeStartInputDirective, selector: "[kendoDateRangeStartInput]", inputs: ["navigateCalendarOnFocus", "autoCorrectOn"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZdaterangeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-zdaterange', template: "<ion-item [formGroup]=\"form\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\">\r\n  <ion-label [attr.for]=\"data.Value\" *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\" position=\"stacked\">\r\n    {{data.Label}} <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\" color=\"danger\">*</ion-text>\r\n  </ion-label>\r\n  <div class=\"ion-row\" style=\"justify-content: space-between; width: 100%\">\r\n    <span style=\"flex: 1;\">\r\n      <kendo-daterange #zdaterange class=\"ion-row\">\r\n        <!-- <label style=\"flex: 1;\"> -->\r\n        <!-- <span class=\"label\">Start</span> -->\r\n        <kendo-dateinput style=\"flex: 1;\" kendoDateRangeStartInput [(value)]=\"range.start\" \r\n        [attr.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"></kendo-dateinput>\r\n        <!-- </label> -->\r\n        <!-- <label style=\"flex: 1;\"> -->\r\n        <!-- <span class=\"label\">End</span> -->\r\n        <!-- <kendo-dateinput style=\"flex: 1;\" kendoDateRangeEndInput [(value)]=\"range.end\"></kendo-dateinput> -->\r\n        <!-- </label> -->\r\n\r\n        <kendo-daterange-popup [animate]=\"false\"></kendo-daterange-popup>\r\n      </kendo-daterange>\r\n    </span>\r\n    <app-uivalidationmessage [group]=\"group\" [data]=\"data\" [form]=\"form\"></app-uivalidationmessage>\r\n  </div>\r\n</ion-item>", styles: [".item.sc-ion-label-md-h,.item .sc-ion-label-md-h{font-weight:var(--z-label-weight);color:var(--z-label-color);text-shadow:var(--z-label-shadow)}.k-dateinput{color:var(--z-text-color)}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { data: [{

package/esm2020/lib/zdatetime/dateParser.pipe.mjs

@@ -18,9 +18,9 @@ export class DateParserFilter {
         }
     }
 }
-DateParserFilter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: DateParserFilter, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-DateParserFilter.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: DateParserFilter, name: "dateParser" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: DateParserFilter, decorators: [{
+DateParserFilter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: DateParserFilter, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+DateParserFilter.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: DateParserFilter, name: "dateParser" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: DateParserFilter, decorators: [{
             type: Pipe,
             args: [{
                     name: "dateParser",

package/esm2020/lib/zdatetime/zdatetime.component.mjs

@@ -270,9 +270,9 @@ export class ZdatetimeComponent {
         }, 500);
     }
 }
-ZdatetimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZdatetimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ZdatetimeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZdatetimeComponent, selector: "app-zdatetime", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<ion-item [ngClass]=\"data.Class\" [formGroup]=\"form\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\">\r\n  <ion-label [attr.for]=\"data.Value\" *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\" position=\"stacked\">\r\n    {{data.Label}} <ion-text *ngIf=\"componentProperties.isRequired\" color=\"danger\">*</ion-text>\r\n  </ion-label>\r\n  <div class=\"ion-row\" style=\"justify-content: space-between; width: 100%\">\r\n    <span style=\"flex: 1;\">\r\n      <ion-datetime *ngIf=\"isMobileScreen()\"\r\n                    style=\"padding: 8px 0px;\"\r\n                    [required]=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\"\r\n                    [placeholder]=\"data.PlaceHolder\"\r\n                    [id]=\"data.Value\"\r\n                    [displayFormat]=\"dateFormat\"\r\n                    [pickerFormat]=\"dateFormat\"\r\n                    [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                    [formControlName]=\"data.Value\"\r\n                    [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\">\r\n      </ion-datetime>\r\n      <kendo-datepicker *ngIf=\"!isMobileScreen() && dateFormat==='MMM-YYYY'\"\r\n                        [id]=\"data.Value\"\r\n                        [value]=\"form.get(data.Value).value | dateParser\"\r\n                        (valueChange)=\"onChange($event)\"\r\n                        [min]=\"data.MinDate\"\r\n                        [max]=\"data.MaxDate\"\r\n                        [activeView]=\"'year'\"\r\n                        [bottomView]=\"'year'\"\r\n                        style=\"margin-top: 7px; width: 100%;\"\r\n                        [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [format]=\"toKendoDateFormat()\"\r\n                        [placeholder]=\"data.PlaceHolder\">\r\n      </kendo-datepicker>\r\n      <kendo-datepicker *ngIf=\"!isMobileScreen() && dateFormat==='DD-MMM-YYYY'\"\r\n                        [id]=\"data.Value\"\r\n                        [value]=\"form.get(data.Value).value | dateParser\"\r\n                        (valueChange)=\"onChange($event)\"\r\n                        [min]=\"data.MinDate\"\r\n                        [max]=\"data.MaxDate\"\r\n                        style=\"margin-top: 7px; width: 100%;\"\r\n                        [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [format]=\"toKendoDateFormat()\"\r\n                        [placeholder]=\"data.PlaceHolder\"></kendo-datepicker>\r\n      <kendo-datetimepicker *ngIf=\"!isMobileScreen() && dateFormat==='DD-MMM-YYYY h:mm A'\"\r\n                            [id]=\"data.Value\"\r\n                            [value]=\"form.get(data.Value).value | dateParser\"\r\n                            (valueChange)=\"onChange($event)\"\r\n                            (open)=\"handlePreventableEvent($event, 'open', false)\"\r\n                            style=\"margin-top: 7px; width: 100%;\"\r\n                            [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                            [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                            [format]=\"toKendoDateFormat()\"\r\n                            [placeholder]=\"data.PlaceHolder\">\r\n        <ng-template kendoCalendarMonthCellTemplate let-date>\r\n          <span (click)=\"GetDate(date)\">{{date.getDate()}}</span>\r\n        </ng-template>\r\n      </kendo-datetimepicker>\r\n      <kendo-timepicker *ngIf=\"!isMobileScreen() && (dateFormat==='HH:mm:ss' || dateFormat==='HH:mm')\"\r\n                        [id]=\"data.Value\"\r\n                        [value]=\"form.get(data.Value).value | dateParser\"\r\n                        (valueChange)=\"onChange($event)\"\r\n                        style=\"margin-top: 7px; width: 100%;\"\r\n                        [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [format]=\"toKendoDateFormat()\"\r\n                        [placeholder]=\"data.PlaceHolder\"></kendo-timepicker>\r\n    </span>\r\n    <app-uivalidationmessage [group]=\"group\"\r\n                             [data]=\"data\"\r\n                             [form]=\"form\"></app-uivalidationmessage>\r\n  </div>\r\n</ion-item>\r\n", styles: [".gridInlineEdit{--background: transparent}.item.sc-ion-label-md-h,.item .sc-ion-label-md-h{font-weight:var(--z-label-weight);color:var(--z-label-color);text-shadow:var(--z-label-shadow)}.k-datepicker{color:var(--z-text-color)}\n"], components: [{ type: i1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { type: i1.IonDatetime, selector: "ion-datetime", inputs: ["cancelText", "clearText", "color", "dayValues", "disabled", "doneText", "firstDayOfWeek", "hourCycle", "hourValues", "isDateEnabled", "locale", "max", "min", "minuteValues", "mode", "monthValues", "name", "presentation", "readonly", "showClearButton", "showDefaultButtons", "showDefaultTimeLabel", "showDefaultTitle", "size", "value", "yearValues"] }, { type: i2.DatePickerComponent, selector: "kendo-datepicker", inputs: ["focusableId", "activeView", "bottomView", "topView", "calendarType", "animateCalendarNavigation", "disabled", "readonly", "readOnlyInput", "navigation", "min", "max", "incompleteDateValidation", "focusedDate", "format", "twoDigitYearMax", "placeholder", "tabindex", "title", "rangeValidation", "disabledDatesValidation", "weekNumber", "cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "navigationItemTemplate", "popupSettings", "value", "tabIndex", "disabledDates", "size", "rounded", "fillMode", "formatPlaceholder"], outputs: ["valueChange", "focus", "blur", "open", "close"], exportAs: ["kendo-datepicker"] }, { type: i2.DateTimePickerComponent, selector: "kendo-datetimepicker", inputs: ["twoDigitYearMax", "focusableId", "title", "disabled", "readonly", "readOnlyInput", "cancelButton", "steps", "calendarType", "animateCalendarNavigation", "weekNumber", "rangeValidation", "disabledDatesValidation", "incompleteDateValidation", "value", "format", "tabindex", "disabledDates", "popupSettings", "min", "max", "defaultTab", "size", "rounded", "fillMode", "formatPlaceholder", "placeholder", "focusedDate"], outputs: ["valueChange", "open", "close", "focus", "blur"], exportAs: ["kendo-datetimepicker"] }, { type: i2.TimePickerComponent, selector: "kendo-timepicker", inputs: ["focusableId", "disabled", "readonly", "readOnlyInput", "format", "placeholder", "incompleteDateValidation", "cancelButton", "nowButton", "tabindex", "title", "rangeValidation", "min", "max", "steps", "popupSettings", "tabIndex", "value", "size", "rounded", "fillMode", "formatPlaceholder"], outputs: ["valueChange", "focus", "blur", "open", "close"], exportAs: ["kendo-timepicker"] }, { type: i3.UivalidationmessageComponent, selector: "app-uivalidationmessage", inputs: ["group", "data", "form"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1.SelectValueAccessor, selector: "ion-range, ion-select, ion-radio-group, ion-segment, ion-datetime" }, { type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2.MonthCellTemplateDirective, selector: "[kendoCalendarMonthCellTemplate]" }], pipes: { "dateParser": i6.DateParserFilter } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZdatetimeComponent, decorators: [{
+ZdatetimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZdatetimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ZdatetimeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZdatetimeComponent, selector: "app-zdatetime", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<ion-item [ngClass]=\"data.Class\" [formGroup]=\"form\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\">\r\n  <ion-label [attr.for]=\"data.Value\" *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\" position=\"stacked\">\r\n    {{data.Label}} <ion-text *ngIf=\"componentProperties.isRequired\" color=\"danger\">*</ion-text>\r\n  </ion-label>\r\n  <div class=\"ion-row\" style=\"justify-content: space-between; width: 100%\">\r\n    <span style=\"flex: 1;\">\r\n      <ion-datetime *ngIf=\"isMobileScreen()\"\r\n                    style=\"padding: 8px 0px;\"\r\n                    [required]=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\"\r\n                    [placeholder]=\"data.PlaceHolder\"\r\n                    [id]=\"data.Value\"\r\n                    [displayFormat]=\"dateFormat\"\r\n                    [pickerFormat]=\"dateFormat\"\r\n                    [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                    [formControlName]=\"data.Value\"\r\n                    [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\">\r\n      </ion-datetime>\r\n      <kendo-datepicker *ngIf=\"!isMobileScreen() && dateFormat==='MMM-YYYY'\"\r\n                        [id]=\"data.Value\"\r\n                        [value]=\"form.get(data.Value).value | dateParser\"\r\n                        (valueChange)=\"onChange($event)\"\r\n                        [min]=\"data.MinDate\"\r\n                        [max]=\"data.MaxDate\"\r\n                        [activeView]=\"'year'\"\r\n                        [bottomView]=\"'year'\"\r\n                        style=\"margin-top: 7px; width: 100%;\"\r\n                        [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [format]=\"toKendoDateFormat()\"\r\n                        [placeholder]=\"data.PlaceHolder\">\r\n      </kendo-datepicker>\r\n      <kendo-datepicker *ngIf=\"!isMobileScreen() && dateFormat==='DD-MMM-YYYY'\"\r\n                        [id]=\"data.Value\"\r\n                        [value]=\"form.get(data.Value).value | dateParser\"\r\n                        (valueChange)=\"onChange($event)\"\r\n                        [min]=\"data.MinDate\"\r\n                        [max]=\"data.MaxDate\"\r\n                        style=\"margin-top: 7px; width: 100%;\"\r\n                        [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [format]=\"toKendoDateFormat()\"\r\n                        [placeholder]=\"data.PlaceHolder\"></kendo-datepicker>\r\n      <kendo-datetimepicker *ngIf=\"!isMobileScreen() && dateFormat==='DD-MMM-YYYY h:mm A'\"\r\n                            [id]=\"data.Value\"\r\n                            [value]=\"form.get(data.Value).value | dateParser\"\r\n                            (valueChange)=\"onChange($event)\"\r\n                            (open)=\"handlePreventableEvent($event, 'open', false)\"\r\n                            style=\"margin-top: 7px; width: 100%;\"\r\n                            [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                            [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                            [format]=\"toKendoDateFormat()\"\r\n                            [placeholder]=\"data.PlaceHolder\">\r\n        <ng-template kendoCalendarMonthCellTemplate let-date>\r\n          <span (click)=\"GetDate(date)\">{{date.getDate()}}</span>\r\n        </ng-template>\r\n      </kendo-datetimepicker>\r\n      <kendo-timepicker *ngIf=\"!isMobileScreen() && (dateFormat==='HH:mm:ss' || dateFormat==='HH:mm')\"\r\n                        [id]=\"data.Value\"\r\n                        [value]=\"form.get(data.Value).value | dateParser\"\r\n                        (valueChange)=\"onChange($event)\"\r\n                        style=\"margin-top: 7px; width: 100%;\"\r\n                        [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [format]=\"toKendoDateFormat()\"\r\n                        [placeholder]=\"data.PlaceHolder\"></kendo-timepicker>\r\n    </span>\r\n    <app-uivalidationmessage [group]=\"group\"\r\n                             [data]=\"data\"\r\n                             [form]=\"form\"></app-uivalidationmessage>\r\n  </div>\r\n</ion-item>\r\n", styles: [".gridInlineEdit{--background: transparent}.item.sc-ion-label-md-h,.item .sc-ion-label-md-h{font-weight:var(--z-label-weight);color:var(--z-label-color);text-shadow:var(--z-label-shadow)}.k-datepicker{color:var(--z-text-color)}\n"], components: [{ type: i1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { type: i1.IonDatetime, selector: "ion-datetime", inputs: ["cancelText", "clearText", "color", "dayValues", "disabled", "doneText", "firstDayOfWeek", "hourCycle", "hourValues", "isDateEnabled", "locale", "max", "min", "minuteValues", "mode", "monthValues", "name", "presentation", "readonly", "showClearButton", "showDefaultButtons", "showDefaultTimeLabel", "showDefaultTitle", "size", "value", "yearValues"] }, { type: i2.DatePickerComponent, selector: "kendo-datepicker", inputs: ["focusableId", "activeView", "bottomView", "topView", "calendarType", "animateCalendarNavigation", "disabled", "readonly", "readOnlyInput", "navigation", "min", "max", "incompleteDateValidation", "focusedDate", "format", "twoDigitYearMax", "placeholder", "tabindex", "title", "rangeValidation", "disabledDatesValidation", "weekNumber", "cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "navigationItemTemplate", "popupSettings", "value", "tabIndex", "disabledDates", "size", "rounded", "fillMode", "formatPlaceholder"], outputs: ["valueChange", "focus", "blur", "open", "close"], exportAs: ["kendo-datepicker"] }, { type: i2.DateTimePickerComponent, selector: "kendo-datetimepicker", inputs: ["twoDigitYearMax", "focusableId", "title", "disabled", "readonly", "readOnlyInput", "cancelButton", "steps", "calendarType", "animateCalendarNavigation", "weekNumber", "rangeValidation", "disabledDatesValidation", "incompleteDateValidation", "value", "format", "tabindex", "disabledDates", "popupSettings", "min", "max", "defaultTab", "size", "rounded", "fillMode", "formatPlaceholder", "placeholder", "focusedDate"], outputs: ["valueChange", "open", "close", "focus", "blur"], exportAs: ["kendo-datetimepicker"] }, { type: i2.TimePickerComponent, selector: "kendo-timepicker", inputs: ["focusableId", "disabled", "readonly", "readOnlyInput", "format", "placeholder", "incompleteDateValidation", "cancelButton", "nowButton", "tabindex", "title", "rangeValidation", "min", "max", "steps", "popupSettings", "tabIndex", "value", "size", "rounded", "fillMode", "formatPlaceholder"], outputs: ["valueChange", "focus", "blur", "open", "close"], exportAs: ["kendo-timepicker"] }, { type: i3.UivalidationmessageComponent, selector: "app-uivalidationmessage", inputs: ["group", "data", "form"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1.SelectValueAccessor, selector: "ion-range, ion-select, ion-radio-group, ion-segment, ion-datetime" }, { type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2.MonthCellTemplateDirective, selector: "[kendoCalendarMonthCellTemplate]" }], pipes: { "dateParser": i6.DateParserFilter } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZdatetimeComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-zdatetime", template: "<ion-item [ngClass]=\"data.Class\" [formGroup]=\"form\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\">\r\n  <ion-label [attr.for]=\"data.Value\" *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\" position=\"stacked\">\r\n    {{data.Label}} <ion-text *ngIf=\"componentProperties.isRequired\" color=\"danger\">*</ion-text>\r\n  </ion-label>\r\n  <div class=\"ion-row\" style=\"justify-content: space-between; width: 100%\">\r\n    <span style=\"flex: 1;\">\r\n      <ion-datetime *ngIf=\"isMobileScreen()\"\r\n                    style=\"padding: 8px 0px;\"\r\n                    [required]=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\"\r\n                    [placeholder]=\"data.PlaceHolder\"\r\n                    [id]=\"data.Value\"\r\n                    [displayFormat]=\"dateFormat\"\r\n                    [pickerFormat]=\"dateFormat\"\r\n                    [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                    [formControlName]=\"data.Value\"\r\n                    [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\">\r\n      </ion-datetime>\r\n      <kendo-datepicker *ngIf=\"!isMobileScreen() && dateFormat==='MMM-YYYY'\"\r\n                        [id]=\"data.Value\"\r\n                        [value]=\"form.get(data.Value).value | dateParser\"\r\n                        (valueChange)=\"onChange($event)\"\r\n                        [min]=\"data.MinDate\"\r\n                        [max]=\"data.MaxDate\"\r\n                        [activeView]=\"'year'\"\r\n                        [bottomView]=\"'year'\"\r\n                        style=\"margin-top: 7px; width: 100%;\"\r\n                        [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [format]=\"toKendoDateFormat()\"\r\n                        [placeholder]=\"data.PlaceHolder\">\r\n      </kendo-datepicker>\r\n      <kendo-datepicker *ngIf=\"!isMobileScreen() && dateFormat==='DD-MMM-YYYY'\"\r\n                        [id]=\"data.Value\"\r\n                        [value]=\"form.get(data.Value).value | dateParser\"\r\n                        (valueChange)=\"onChange($event)\"\r\n                        [min]=\"data.MinDate\"\r\n                        [max]=\"data.MaxDate\"\r\n                        style=\"margin-top: 7px; width: 100%;\"\r\n                        [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [format]=\"toKendoDateFormat()\"\r\n                        [placeholder]=\"data.PlaceHolder\"></kendo-datepicker>\r\n      <kendo-datetimepicker *ngIf=\"!isMobileScreen() && dateFormat==='DD-MMM-YYYY h:mm A'\"\r\n                            [id]=\"data.Value\"\r\n                            [value]=\"form.get(data.Value).value | dateParser\"\r\n                            (valueChange)=\"onChange($event)\"\r\n                            (open)=\"handlePreventableEvent($event, 'open', false)\"\r\n                            style=\"margin-top: 7px; width: 100%;\"\r\n                            [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                            [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                            [format]=\"toKendoDateFormat()\"\r\n                            [placeholder]=\"data.PlaceHolder\">\r\n        <ng-template kendoCalendarMonthCellTemplate let-date>\r\n          <span (click)=\"GetDate(date)\">{{date.getDate()}}</span>\r\n        </ng-template>\r\n      </kendo-datetimepicker>\r\n      <kendo-timepicker *ngIf=\"!isMobileScreen() && (dateFormat==='HH:mm:ss' || dateFormat==='HH:mm')\"\r\n                        [id]=\"data.Value\"\r\n                        [value]=\"form.get(data.Value).value | dateParser\"\r\n                        (valueChange)=\"onChange($event)\"\r\n                        style=\"margin-top: 7px; width: 100%;\"\r\n                        [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                        [format]=\"toKendoDateFormat()\"\r\n                        [placeholder]=\"data.PlaceHolder\"></kendo-timepicker>\r\n    </span>\r\n    <app-uivalidationmessage [group]=\"group\"\r\n                             [data]=\"data\"\r\n                             [form]=\"form\"></app-uivalidationmessage>\r\n  </div>\r\n</ion-item>\r\n", styles: [".gridInlineEdit{--background: transparent}.item.sc-ion-label-md-h,.item .sc-ion-label-md-h{font-weight:var(--z-label-weight);color:var(--z-label-color);text-shadow:var(--z-label-shadow)}.k-datepicker{color:var(--z-text-color)}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { data: [{

package/esm2020/lib/zdiv/zdiv.component.mjs

@@ -35,9 +35,9 @@ export class ZdivComponent {
         return ZComponentHelper.ComponentIsVisible(field, this.group);
     }
 }
-ZdivComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZdivComponent, deps: [{ token: i1.AuthService }], target: i0.ɵɵFactoryTarget.Component });
-ZdivComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZdivComponent, selector: "app-zdiv", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<div *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\" class=\"ion-row\">\r\n  <app-zformcontrol \r\n    [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\"\r\n    [group]=\"group\" [form]=\"form\" id=\"{{field.Type}}-{{field.Name}}\">\r\n  </app-zformcontrol>\r\n</div>", styles: [""], components: [{ type: i2.ZformcontrolComponent, selector: "app-zformcontrol", inputs: ["field", "group", "form"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "divzlayout": i4.DivzLayout } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZdivComponent, decorators: [{
+ZdivComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZdivComponent, deps: [{ token: i1.AuthService }], target: i0.ɵɵFactoryTarget.Component });
+ZdivComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZdivComponent, selector: "app-zdiv", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<div *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\" class=\"ion-row\">\r\n  <app-zformcontrol \r\n    [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\"\r\n    [group]=\"group\" [form]=\"form\" id=\"{{field.Type}}-{{field.Name}}\">\r\n  </app-zformcontrol>\r\n</div>", styles: [""], components: [{ type: i2.ZformcontrolComponent, selector: "app-zformcontrol", inputs: ["field", "group", "form"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "divzlayout": i4.DivzLayout } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZdivComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-zdiv', template: "<div *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\" class=\"ion-row\">\r\n  <app-zformcontrol \r\n    [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\"\r\n    [group]=\"group\" [form]=\"form\" id=\"{{field.Type}}-{{field.Name}}\">\r\n  </app-zformcontrol>\r\n</div>", styles: [""] }]
         }], ctorParameters: function () { return [{ type: i1.AuthService }]; }, propDecorators: { data: [{

package/esm2020/lib/zdiv/zdiv.pipe.mjs

@@ -19,9 +19,9 @@ export class DivzLayout {
         return items;
     }
 }
-DivzLayout.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: DivzLayout, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-DivzLayout.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: DivzLayout, name: "divzlayout" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: DivzLayout, decorators: [{
+DivzLayout.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: DivzLayout, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+DivzLayout.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: DivzLayout, name: "divzlayout" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: DivzLayout, decorators: [{
             type: Pipe,
             args: [{
                     name: 'divzlayout',

package/esm2020/lib/zform/zform.component.mjs

@@ -134,9 +134,9 @@ export class ZformComponent {
         return index;
     }
 }
-ZformComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZformComponent, deps: [{ token: i1.AuthService }, { token: i1.FieldService }, { token: i2.ZComponentDebugService }], target: i0.ɵɵFactoryTarget.Component });
-ZformComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZformComponent, selector: "app-zform", inputs: { group: "group", fieldName: "fieldName" }, ngImport: i0, template: "<div class=\"e1-form\">\r\n  <!--<div class=\"k-overlay\" *ngIf=\"isLoading\"></div>-->\r\n  <form [formGroup]=\"form\" autocomplete=\"off\" *ngIf=\"!isLoading\">\r\n    <ion-grid>\r\n      <ion-row id=\"dynamic-form-host\" class=\"ion-align-items-start\">\r\n        <app-zformcontrol *ngFor=\"let field of fields; trackBy: trackByFn\"\r\n                          [ngClass]=\"group[field['isVisibleField']] ? field.DivClass :\r\n                          ((field.Visible === true) ?  field.DivClass : 'flex-hide')\"\r\n                          [field]=\"field\"\r\n                          [group]=\"getGroup()\"\r\n                          [form]=\"form\"\r\n                          id=\"{{field.Type}}-{{field.Name}}\"></app-zformcontrol>\r\n      </ion-row>\r\n    </ion-grid>\r\n  </form>\r\n</div>\r\n", styles: ["#dynamic-form-host app-zformcontrol{overflow-x:auto;overflow-y:hidden}\n"], components: [{ type: i3.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { type: i3.IonRow, selector: "ion-row" }, { type: i4.ZformcontrolComponent, selector: "app-zformcontrol", inputs: ["field", "group", "form"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZformComponent, decorators: [{
+ZformComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZformComponent, deps: [{ token: i1.AuthService }, { token: i1.FieldService }, { token: i2.ZComponentDebugService }], target: i0.ɵɵFactoryTarget.Component });
+ZformComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZformComponent, selector: "app-zform", inputs: { group: "group", fieldName: "fieldName" }, ngImport: i0, template: "<div class=\"e1-form\">\r\n  <!--<div class=\"k-overlay\" *ngIf=\"isLoading\"></div>-->\r\n  <form [formGroup]=\"form\" autocomplete=\"off\" *ngIf=\"!isLoading\">\r\n    <ion-grid>\r\n      <ion-row id=\"dynamic-form-host\" class=\"ion-align-items-start\">\r\n        <app-zformcontrol *ngFor=\"let field of fields; trackBy: trackByFn\"\r\n                          [ngClass]=\"group[field['isVisibleField']] ? field.DivClass :\r\n                          ((field.Visible === true) ?  field.DivClass : 'flex-hide')\"\r\n                          [field]=\"field\"\r\n                          [group]=\"getGroup()\"\r\n                          [form]=\"form\"\r\n                          id=\"{{field.Type}}-{{field.Name}}\"></app-zformcontrol>\r\n      </ion-row>\r\n    </ion-grid>\r\n  </form>\r\n</div>\r\n", styles: ["#dynamic-form-host app-zformcontrol{overflow-x:auto;overflow-y:hidden}\n"], components: [{ type: i3.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { type: i3.IonRow, selector: "ion-row" }, { type: i4.ZformcontrolComponent, selector: "app-zformcontrol", inputs: ["field", "group", "form"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZformComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-zform", template: "<div class=\"e1-form\">\r\n  <!--<div class=\"k-overlay\" *ngIf=\"isLoading\"></div>-->\r\n  <form [formGroup]=\"form\" autocomplete=\"off\" *ngIf=\"!isLoading\">\r\n    <ion-grid>\r\n      <ion-row id=\"dynamic-form-host\" class=\"ion-align-items-start\">\r\n        <app-zformcontrol *ngFor=\"let field of fields; trackBy: trackByFn\"\r\n                          [ngClass]=\"group[field['isVisibleField']] ? field.DivClass :\r\n                          ((field.Visible === true) ?  field.DivClass : 'flex-hide')\"\r\n                          [field]=\"field\"\r\n                          [group]=\"getGroup()\"\r\n                          [form]=\"form\"\r\n                          id=\"{{field.Type}}-{{field.Name}}\"></app-zformcontrol>\r\n      </ion-row>\r\n    </ion-grid>\r\n  </form>\r\n</div>\r\n", styles: ["#dynamic-form-host app-zformcontrol{overflow-x:auto;overflow-y:hidden}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.AuthService }, { type: i1.FieldService }, { type: i2.ZComponentDebugService }]; }, propDecorators: { group: [{

package/esm2020/lib/zformcontrol/zformcontrol.component.mjs

@@ -31,9 +31,9 @@ export class ZformcontrolComponent {
         // this.componentRef.destroy();
     }
 }
-ZformcontrolComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZformcontrolComponent, deps: [{ token: i0.ComponentFactoryResolver }, { token: i1.ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
-ZformcontrolComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZformcontrolComponent, selector: "app-zformcontrol", inputs: { field: "field", group: "group", form: "form" }, viewQueries: [{ propertyName: "fieldElement", first: true, predicate: FieldElementDirective, descendants: true, static: true }], ngImport: i0, template: "<!-- <ion-col size=12 sizeSm=\"12\" sizeMd=\"6\" sizeLg=\"4\" sizeXl=\"3\" fieldelement></ion-col> -->\r\n<span fieldelement></span>", styles: [""], directives: [{ type: i2.FieldElementDirective, selector: "[fieldelement]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZformcontrolComponent, decorators: [{
+ZformcontrolComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZformcontrolComponent, deps: [{ token: i0.ComponentFactoryResolver }, { token: i1.ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
+ZformcontrolComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZformcontrolComponent, selector: "app-zformcontrol", inputs: { field: "field", group: "group", form: "form" }, viewQueries: [{ propertyName: "fieldElement", first: true, predicate: FieldElementDirective, descendants: true, static: true }], ngImport: i0, template: "<!-- <ion-col size=12 sizeSm=\"12\" sizeMd=\"6\" sizeLg=\"4\" sizeXl=\"3\" fieldelement></ion-col> -->\r\n<span fieldelement></span>", styles: [""], directives: [{ type: i2.FieldElementDirective, selector: "[fieldelement]" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZformcontrolComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-zformcontrol", template: "<!-- <ion-col size=12 sizeSm=\"12\" sizeMd=\"6\" sizeLg=\"4\" sizeXl=\"3\" fieldelement></ion-col> -->\r\n<span fieldelement></span>", styles: [""] }]
         }], ctorParameters: function () { return [{ type: i0.ComponentFactoryResolver }, { type: i1.ZComponentService }]; }, propDecorators: { field: [{

package/esm2020/lib/zgauge/zgauge.component.mjs

@@ -133,9 +133,9 @@ export class ZgaugeComponent {
         this.getFieldDeclarationForSetup(this.data, this.options);
     }
 }
-ZgaugeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZgaugeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ZgaugeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZgaugeComponent, selector: "app-zgauge", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<div *ngIf=\"!isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\" style=\"text-align: center;\">\r\n  <div id=\"marketShareContainer\" class=\"ion-row\" class=\"col-xs-12 stats-graph\">\r\n    <h6 style=\"color: gray;\">{{ options.title }}</h6>\r\n  </div>\r\n  <div [ngStyle]='alignment()'>\r\n    <kendo-arcgauge [value]=\"options.value\" [transitions]=\"options.transitions\" [colors]=\"options.colors\" style=\"margin-top:50px;width:90% ;height:100%; min-width: 330px;\">\r\n      <kendo-arcgauge-scale\r\n            [majorTicks]=\"{ visible: true, color: '#0000ff' }\"\r\n            [minorTicks]=\"{ visible: true, color: '#0000ff' }\"\r\n            [reverse]=\"options.reverse\"\r\n            [startAngle]=\"0\"\r\n            [endAngle]=\"180\"\r\n            [min]=\"options.minValue\"\r\n            [max]=\"options.maxValue\"\r\n            [rangePlaceholderColor]=\"options.rangePlaceholderColor\"\r\n            [rangeSize]=\"options.rangeSize\"\r\n            [rangeLineCap]=\"options.rangeLineCap\">\r\n            <kendo-arcgauge-scale-labels format=\"l\" [color]=\"options.labelsColor\" [visible]=\"options.showLabels\">\r\n            </kendo-arcgauge-scale-labels>\r\n      </kendo-arcgauge-scale>\r\n      <ng-template kendoArcGaugeCenterTemplate let-value=\"value\" let-color=\"color\">\r\n        <span [style.color]=\"color\">{{ value }}</span>\r\n    </ng-template>\r\n    </kendo-arcgauge>\r\n  </div>\r\n</div>\r\n", styles: [""], components: [{ type: i1.ArcGaugeComponent, selector: "kendo-arcgauge", inputs: ["value", "color", "colors", "opacity", "scale"], exportAs: ["kendoArcGauge"] }, { type: i1.ArcScaleComponent, selector: "kendo-arcgauge-scale", inputs: ["labels", "rangeDistance", "rangeLineCap", "startAngle", "endAngle"] }, { type: i1.ArcLabelsComponent, selector: "kendo-arcgauge-scale-labels" }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i1.ArcCenterTemplateDirective, selector: "[kendoArcGaugeCenterTemplate]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZgaugeComponent, decorators: [{
+ZgaugeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZgaugeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ZgaugeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZgaugeComponent, selector: "app-zgauge", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<div *ngIf=\"!isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\" style=\"text-align: center;\">\r\n  <div id=\"marketShareContainer\" class=\"ion-row\" class=\"col-xs-12 stats-graph\">\r\n    <h6 style=\"color: gray;\">{{ options.title }}</h6>\r\n  </div>\r\n  <div [ngStyle]='alignment()'>\r\n    <kendo-arcgauge [value]=\"options.value\" [transitions]=\"options.transitions\" [colors]=\"options.colors\" style=\"margin-top:50px;width:90% ;height:100%; min-width: 330px;\">\r\n      <kendo-arcgauge-scale\r\n            [majorTicks]=\"{ visible: true, color: '#0000ff' }\"\r\n            [minorTicks]=\"{ visible: true, color: '#0000ff' }\"\r\n            [reverse]=\"options.reverse\"\r\n            [startAngle]=\"0\"\r\n            [endAngle]=\"180\"\r\n            [min]=\"options.minValue\"\r\n            [max]=\"options.maxValue\"\r\n            [rangePlaceholderColor]=\"options.rangePlaceholderColor\"\r\n            [rangeSize]=\"options.rangeSize\"\r\n            [rangeLineCap]=\"options.rangeLineCap\">\r\n            <kendo-arcgauge-scale-labels format=\"l\" [color]=\"options.labelsColor\" [visible]=\"options.showLabels\">\r\n            </kendo-arcgauge-scale-labels>\r\n      </kendo-arcgauge-scale>\r\n      <ng-template kendoArcGaugeCenterTemplate let-value=\"value\" let-color=\"color\">\r\n        <span [style.color]=\"color\">{{ value }}</span>\r\n    </ng-template>\r\n    </kendo-arcgauge>\r\n  </div>\r\n</div>\r\n", styles: [""], components: [{ type: i1.ArcGaugeComponent, selector: "kendo-arcgauge", inputs: ["value", "color", "colors", "opacity", "scale"], exportAs: ["kendoArcGauge"] }, { type: i1.ArcScaleComponent, selector: "kendo-arcgauge-scale", inputs: ["labels", "rangeDistance", "rangeLineCap", "startAngle", "endAngle"] }, { type: i1.ArcLabelsComponent, selector: "kendo-arcgauge-scale-labels" }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i1.ArcCenterTemplateDirective, selector: "[kendoArcGaugeCenterTemplate]" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZgaugeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-zgauge', template: "<div *ngIf=\"!isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\" style=\"text-align: center;\">\r\n  <div id=\"marketShareContainer\" class=\"ion-row\" class=\"col-xs-12 stats-graph\">\r\n    <h6 style=\"color: gray;\">{{ options.title }}</h6>\r\n  </div>\r\n  <div [ngStyle]='alignment()'>\r\n    <kendo-arcgauge [value]=\"options.value\" [transitions]=\"options.transitions\" [colors]=\"options.colors\" style=\"margin-top:50px;width:90% ;height:100%; min-width: 330px;\">\r\n      <kendo-arcgauge-scale\r\n            [majorTicks]=\"{ visible: true, color: '#0000ff' }\"\r\n            [minorTicks]=\"{ visible: true, color: '#0000ff' }\"\r\n            [reverse]=\"options.reverse\"\r\n            [startAngle]=\"0\"\r\n            [endAngle]=\"180\"\r\n            [min]=\"options.minValue\"\r\n            [max]=\"options.maxValue\"\r\n            [rangePlaceholderColor]=\"options.rangePlaceholderColor\"\r\n            [rangeSize]=\"options.rangeSize\"\r\n            [rangeLineCap]=\"options.rangeLineCap\">\r\n            <kendo-arcgauge-scale-labels format=\"l\" [color]=\"options.labelsColor\" [visible]=\"options.showLabels\">\r\n            </kendo-arcgauge-scale-labels>\r\n      </kendo-arcgauge-scale>\r\n      <ng-template kendoArcGaugeCenterTemplate let-value=\"value\" let-color=\"color\">\r\n        <span [style.color]=\"color\">{{ value }}</span>\r\n    </ng-template>\r\n    </kendo-arcgauge>\r\n  </div>\r\n</div>\r\n", styles: [""] }]
         }], ctorParameters: function () { return []; }, propDecorators: { data: [{

package/esm2020/lib/zgrid/date-range-cell-filter.component.mjs

@@ -53,8 +53,8 @@ export class DateRangeFilterCellComponent extends BaseFilterCellComponent {
             .filter(({ operator }) => operator === op)[0];
     }
 }
-DateRangeFilterCellComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: DateRangeFilterCellComponent, deps: [{ token: i1.FilterService }], target: i0.ɵɵFactoryTarget.Component });
-DateRangeFilterCellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: DateRangeFilterCellComponent, selector: "date-range-filter-cell", inputs: { filter: "filter", field: "field" }, usesInheritance: true, ngImport: i0, template: `
+DateRangeFilterCellComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: DateRangeFilterCellComponent, deps: [{ token: i1.FilterService }], target: i0.ɵɵFactoryTarget.Component });
+DateRangeFilterCellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: DateRangeFilterCellComponent, selector: "date-range-filter-cell", inputs: { filter: "filter", field: "field" }, usesInheritance: true, ngImport: i0, template: `
         <kendo-daterange >
            <kendo-dateinput
                 class="range-filter"
@@ -84,7 +84,7 @@ DateRangeFilterCellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
             <span class="k-icon k-i-filter-clear" style="width:15px"></span>
         </button>
     `, isInline: true, styles: ["kendo-daterange>kendo-dateinput.range-filter{display:inline-block}.k-button{margin-left:4px}\n"], components: [{ type: i2.DateRangeComponent, selector: "kendo-daterange" }, { type: i2.DateInputComponent, selector: "kendo-dateinput", inputs: ["focusableId", "disabled", "readonly", "title", "tabindex", "role", "ariaReadOnly", "format", "placeholder", "steps", "rangeValidation", "autoCorrect", "incompleteDateValidation", "twoDigitYearMax", "spinners", "isPopupOpen", "hasPopup", "tabIndex", "value", "size", "rounded", "fillMode", "formatPlaceholder", "max", "min"], outputs: ["valueChange", "valueUpdate", "focus", "blur"], exportAs: ["kendo-dateinput"] }], directives: [{ type: i2.DateRangeStartInputDirective, selector: "[kendoDateRangeStartInput]", inputs: ["navigateCalendarOnFocus", "autoCorrectOn"] }, { type: i2.DateRangeEndInputDirective, selector: "[kendoDateRangeEndInput]", inputs: ["navigateCalendarOnFocus", "autoCorrectOn"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: DateRangeFilterCellComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: DateRangeFilterCellComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'date-range-filter-cell',