mmhglobal-dynamicform 1.3.2 → 1.3.5

package/esm2020/lib/zgrid/zgrid.popup.anchor-target.directive.mjs

@@ -5,9 +5,9 @@ export class ZGridPopupAnchorDirective {
         this.element = element;
     }
 }
-ZGridPopupAnchorDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZGridPopupAnchorDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-ZGridPopupAnchorDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.4", type: ZGridPopupAnchorDirective, selector: "[popupAnchor]", exportAs: ["popupAnchor"], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZGridPopupAnchorDirective, decorators: [{
+ZGridPopupAnchorDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZGridPopupAnchorDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+ZGridPopupAnchorDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.6", type: ZGridPopupAnchorDirective, selector: "[popupAnchor]", exportAs: ["popupAnchor"], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZGridPopupAnchorDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[popupAnchor]',

package/esm2020/lib/zimg/zimg.component.mjs

@@ -106,9 +106,9 @@ export class ZimgComponent {
         return iconName;
     }
 }
-ZimgComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZimgComponent, deps: [{ token: i1.AttachmentService }], target: i0.ɵɵFactoryTarget.Component });
-ZimgComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZimgComponent, selector: "app-zimg", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<ion-item>\r\n  <ion-label *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\" position=\"stacked\">{{data.Label}} <ion-text\r\n      *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\" color=\"danger\">*</ion-text>\r\n  </ion-label>\r\n  <img *ngIf=\"!!getGroupValue(data.Value, group)\" [src]=\"onDataSourceChange()\" [width]=\"imgWidth\" [height]=\"imgHeight\" style=\"border-radius: 50%; margin: 5px auto\" />\r\n  <img *ngIf=\"this.Guid !==undefined && this.Guid !==FileName\" [src]=\"this.Image\" [width]=\"imgWidth\" [height]=\"imgHeight\" style=\"border-radius: 50%; margin: 5px auto\" />\r\n \r\n  <div *ngIf=\"!getGroupValue(data.Value, group)\" (click)=\"onIconClick()\">\r\n    <ion-icon  name=\"getIconName()\" style=\"zoom:4.0;\">\r\n    </ion-icon>\r\n  </div>\r\n</ion-item>", styles: [""], components: [{ type: i2.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { type: i2.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i2.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { type: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZimgComponent, decorators: [{
+ZimgComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZimgComponent, deps: [{ token: i1.AttachmentService }], target: i0.ɵɵFactoryTarget.Component });
+ZimgComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZimgComponent, selector: "app-zimg", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<ion-item>\r\n  <ion-label *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\" position=\"stacked\">{{data.Label}} <ion-text\r\n      *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\" color=\"danger\">*</ion-text>\r\n  </ion-label>\r\n  <img *ngIf=\"!!getGroupValue(data.Value, group)\" [src]=\"onDataSourceChange()\" [width]=\"imgWidth\" [height]=\"imgHeight\" style=\"border-radius: 50%; margin: 5px auto\" />\r\n  <img *ngIf=\"this.Guid !==undefined && this.Guid !==FileName\" [src]=\"this.Image\" [width]=\"imgWidth\" [height]=\"imgHeight\" style=\"border-radius: 50%; margin: 5px auto\" />\r\n \r\n  <div *ngIf=\"!getGroupValue(data.Value, group)\" (click)=\"onIconClick()\">\r\n    <ion-icon  name=\"getIconName()\" style=\"zoom:4.0;\">\r\n    </ion-icon>\r\n  </div>\r\n</ion-item>", styles: [""], components: [{ type: i2.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { type: i2.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i2.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { type: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZimgComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-zimg", template: "<ion-item>\r\n  <ion-label *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\" position=\"stacked\">{{data.Label}} <ion-text\r\n      *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\" color=\"danger\">*</ion-text>\r\n  </ion-label>\r\n  <img *ngIf=\"!!getGroupValue(data.Value, group)\" [src]=\"onDataSourceChange()\" [width]=\"imgWidth\" [height]=\"imgHeight\" style=\"border-radius: 50%; margin: 5px auto\" />\r\n  <img *ngIf=\"this.Guid !==undefined && this.Guid !==FileName\" [src]=\"this.Image\" [width]=\"imgWidth\" [height]=\"imgHeight\" style=\"border-radius: 50%; margin: 5px auto\" />\r\n \r\n  <div *ngIf=\"!getGroupValue(data.Value, group)\" (click)=\"onIconClick()\">\r\n    <ion-icon  name=\"getIconName()\" style=\"zoom:4.0;\">\r\n    </ion-icon>\r\n  </div>\r\n</ion-item>", styles: [""] }]
         }], ctorParameters: function () { return [{ type: i1.AttachmentService }]; }, propDecorators: { data: [{

package/esm2020/lib/zkcard/zkcard.component.mjs

@@ -358,9 +358,9 @@ export class ZkcardComponent {
         this.scrollViewCards.total = this.responseData.data.filter(x => event.includes(x.WFS_StatusName)).length;
     }
 }
-ZkcardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZkcardComponent, deps: [{ token: i1.ActivatedRoute }, { token: i2.ResourceApiService }, { token: i2.AuthService }, { token: i2.ZGridStatePersistingService }, { token: i2.WebApiService }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
-ZkcardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZkcardComponent, selector: "app-zkcard", ngImport: i0, template: "<!--<kendo-multiselect [data]=\"filterItems\" [value]=\"value\" [placeholder]=\"'Survey Status'\" [filterable]=\"true\"\r\n                   (valueChange)=\"valueChange($event)\"></kendo-multiselect>\r\n&nbsp;-->\r\n<div class=\"survey-card-list\">\r\n  <div *ngFor=\"let card of scrollViewCards.data\">\r\n    <!--<scrollview-card [card]=\"card\"></scrollview-card>-->\r\n    <kendo-card class=\"custom-card-draft\" *ngIf=\"card.WFS_StatusName == 'Draft'\" [width]=\"'250px'\">\r\n      <kendo-card-header class=\"k-hbox\">\r\n        <div>\r\n          <h1 kendoCardTitle>{{ card.SurveyTemplateName }}</h1>\r\n          <p kendoCardSubtitle>Survey Doc No: {{card.DocumentNo}}</p>\r\n        </div>\r\n      </kendo-card-header>\r\n      <kendo-card-body class=\"card-body\">\r\n        Mill Name:  {{card.PartnerMillName}}\r\n        <br />\r\n        Survey Status: {{card.WFS_StatusName}}\r\n      </kendo-card-body>\r\n      <kendo-card-footer>\r\n        Survey Progression:\r\n        <kendo-progressbar style=\"width: 210px; border-radius:10px\" [value]=\"card.value\" [label]=\"label\" [progressCssStyle]=\"progressStyles\">\r\n        </kendo-progressbar>\r\n\r\n        <kendo-card-actions class=\"k-hbox-actionBtn\" orientation=\"horizontal\" [layout]=\"'end'\">\r\n          <button class=\"k-button k-navigation\"\r\n                  (click)=\"start(card)\">\r\n            <div style=\"justify-content:space-between\">\r\n              <span> Continue &nbsp;</span>\r\n              <fa-icon [icon]=\"getFontAwesome('play')\"></fa-icon>\r\n            </div>\r\n          </button>\r\n        </kendo-card-actions>\r\n      </kendo-card-footer>\r\n    </kendo-card>\r\n\r\n    <kendo-card class=\"custom-card-submit\" *ngIf=\"card.WFS_StatusName == 'Submitted'\" [width]=\"'250px'\">\r\n      <kendo-card-header class=\"k-hbox\">\r\n        <div>\r\n          <h1 kendoCardTitle>{{ card.SurveyTemplateName }}</h1>\r\n          <p kendoCardSubtitle>Survey Doc No: {{card.DocumentNo}}</p>\r\n        </div>\r\n      </kendo-card-header>\r\n      <kendo-card-body class=\"card-body\">\r\n        Mill Name:  {{card.PartnerMillName}}\r\n        <br />\r\n        Survey Status: {{card.WFS_StatusName}}\r\n      </kendo-card-body>\r\n      <kendo-card-footer>\r\n        Survey Progression:\r\n        <kendo-progressbar style=\"width: 210px; border-radius:10px\" [value]=\"card.value\" [label]=\"label\" [progressCssStyle]=\"progressStyles\">\r\n        </kendo-progressbar>\r\n        <kendo-card-actions class=\"k-hbox-actionBtn\" orientation=\"horizontal\" [layout]=\"'end'\">\r\n          <button class=\"k-button k-navigation\"\r\n                  (click)=\"start(card)\">\r\n            <div style=\"justify-content:space-between\">\r\n              <span> View &nbsp;</span>\r\n              <fa-icon [icon]=\"getFontAwesome('file-alt')\"></fa-icon>\r\n            </div>\r\n          </button>\r\n        </kendo-card-actions>\r\n      </kendo-card-footer>\r\n    </kendo-card>\r\n\r\n    <kendo-card class=\"custom-card-new\" *ngIf=\"card.WFS_StatusName == 'New'\" [width]=\"'250px'\">\r\n      <kendo-card-header class=\"k-hbox\">\r\n        <div>\r\n          <h1 kendoCardTitle>{{ card.SurveyTemplateName }}</h1>\r\n          <p kendoCardSubtitle>{{card.DocumentNo}}</p>\r\n        </div>\r\n      </kendo-card-header>\r\n      <kendo-card-body class=\"card-body\">\r\n        Mill Name:  {{card.PartnerMillName}}\r\n        <br />\r\n        Survey Status: {{card.WFS_StatusName}}\r\n      </kendo-card-body>\r\n      <kendo-card-footer>\r\n        Survey Progression: \r\n        <kendo-progressbar style=\"width: 210px; border-radius:10px\" [value]=\"card.value\" [label]=\"label\" [progressCssStyle]=\"progressStyles\">\r\n        </kendo-progressbar>\r\n        <kendo-card-actions class=\"k-hbox-actionBtn\" orientation=\"horizontal\" [layout]=\"'end'\">\r\n          <button class=\"k-button k-navigation\"\r\n                  (click)=\"start(card)\">\r\n            <div style=\"justify-content:space-between\">\r\n              <span> Start &nbsp;</span>\r\n              <fa-icon [icon]=\"getFontAwesome('play')\"></fa-icon>\r\n            </div>\r\n          </button>\r\n        </kendo-card-actions>\r\n      </kendo-card-footer>\r\n    </kendo-card>\r\n  </div>\r\n</div>\r\n", styles: [".survey-card-list{display:flex;flex-wrap:wrap;background-color:#f0dcd9;align-items:center;border-radius:10px}.custom-card-submit{margin:20px;border:3px solid;border-color:green;border-radius:15px}.custom-card-draft,.custom-card-new{margin:20px;border:3px solid;border-color:orange;border-radius:15px}\n"], components: [{ type: i3.CardComponent, selector: "kendo-card", inputs: ["orientation", "width"] }, { type: i3.CardHeaderComponent, selector: "kendo-card-header" }, { type: i3.CardBodyComponent, selector: "kendo-card-body" }, { type: i3.CardFooterComponent, selector: "kendo-card-footer" }, { type: i4.ProgressBarComponent, selector: "kendo-progressbar", inputs: ["label", "animation", "progressCssStyle", "progressCssClass", "emptyCssStyle", "emptyCssClass"], outputs: ["animationEnd"], exportAs: ["kendoProgressBar"] }, { type: i3.CardActionsComponent, selector: "kendo-card-actions", inputs: ["orientation", "layout", "actions"], outputs: ["action"] }, { type: i5.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], directives: [{ type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.CardTitleDirective, selector: "[kendoCardTitle]" }, { type: i3.CardSubtitleDirective, selector: "[kendoCardSubtitle]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZkcardComponent, decorators: [{
+ZkcardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZkcardComponent, deps: [{ token: i1.ActivatedRoute }, { token: i2.ResourceApiService }, { token: i2.AuthService }, { token: i2.ZGridStatePersistingService }, { token: i2.WebApiService }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
+ZkcardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZkcardComponent, selector: "app-zkcard", ngImport: i0, template: "<!--<kendo-multiselect [data]=\"filterItems\" [value]=\"value\" [placeholder]=\"'Survey Status'\" [filterable]=\"true\"\r\n                   (valueChange)=\"valueChange($event)\"></kendo-multiselect>\r\n&nbsp;-->\r\n<div class=\"survey-card-list\">\r\n  <div *ngFor=\"let card of scrollViewCards.data\">\r\n    <!--<scrollview-card [card]=\"card\"></scrollview-card>-->\r\n    <kendo-card class=\"custom-card-draft\" *ngIf=\"card.WFS_StatusName == 'Draft'\" [width]=\"'250px'\">\r\n      <kendo-card-header class=\"k-hbox\">\r\n        <div>\r\n          <h1 kendoCardTitle>{{ card.SurveyTemplateName }}</h1>\r\n          <p kendoCardSubtitle>Survey Doc No: {{card.DocumentNo}}</p>\r\n        </div>\r\n      </kendo-card-header>\r\n      <kendo-card-body class=\"card-body\">\r\n        Mill Name:  {{card.PartnerMillName}}\r\n        <br />\r\n        Survey Status: {{card.WFS_StatusName}}\r\n      </kendo-card-body>\r\n      <kendo-card-footer>\r\n        Survey Progression:\r\n        <kendo-progressbar style=\"width: 210px; border-radius:10px\" [value]=\"card.value\" [label]=\"label\" [progressCssStyle]=\"progressStyles\">\r\n        </kendo-progressbar>\r\n\r\n        <kendo-card-actions class=\"k-hbox-actionBtn\" orientation=\"horizontal\" [layout]=\"'end'\">\r\n          <button class=\"k-button k-navigation\"\r\n                  (click)=\"start(card)\">\r\n            <div style=\"justify-content:space-between\">\r\n              <span> Continue &nbsp;</span>\r\n              <fa-icon [icon]=\"getFontAwesome('play')\"></fa-icon>\r\n            </div>\r\n          </button>\r\n        </kendo-card-actions>\r\n      </kendo-card-footer>\r\n    </kendo-card>\r\n\r\n    <kendo-card class=\"custom-card-submit\" *ngIf=\"card.WFS_StatusName == 'Submitted'\" [width]=\"'250px'\">\r\n      <kendo-card-header class=\"k-hbox\">\r\n        <div>\r\n          <h1 kendoCardTitle>{{ card.SurveyTemplateName }}</h1>\r\n          <p kendoCardSubtitle>Survey Doc No: {{card.DocumentNo}}</p>\r\n        </div>\r\n      </kendo-card-header>\r\n      <kendo-card-body class=\"card-body\">\r\n        Mill Name:  {{card.PartnerMillName}}\r\n        <br />\r\n        Survey Status: {{card.WFS_StatusName}}\r\n      </kendo-card-body>\r\n      <kendo-card-footer>\r\n        Survey Progression:\r\n        <kendo-progressbar style=\"width: 210px; border-radius:10px\" [value]=\"card.value\" [label]=\"label\" [progressCssStyle]=\"progressStyles\">\r\n        </kendo-progressbar>\r\n        <kendo-card-actions class=\"k-hbox-actionBtn\" orientation=\"horizontal\" [layout]=\"'end'\">\r\n          <button class=\"k-button k-navigation\"\r\n                  (click)=\"start(card)\">\r\n            <div style=\"justify-content:space-between\">\r\n              <span> View &nbsp;</span>\r\n              <fa-icon [icon]=\"getFontAwesome('file-alt')\"></fa-icon>\r\n            </div>\r\n          </button>\r\n        </kendo-card-actions>\r\n      </kendo-card-footer>\r\n    </kendo-card>\r\n\r\n    <kendo-card class=\"custom-card-new\" *ngIf=\"card.WFS_StatusName == 'New'\" [width]=\"'250px'\">\r\n      <kendo-card-header class=\"k-hbox\">\r\n        <div>\r\n          <h1 kendoCardTitle>{{ card.SurveyTemplateName }}</h1>\r\n          <p kendoCardSubtitle>{{card.DocumentNo}}</p>\r\n        </div>\r\n      </kendo-card-header>\r\n      <kendo-card-body class=\"card-body\">\r\n        Mill Name:  {{card.PartnerMillName}}\r\n        <br />\r\n        Survey Status: {{card.WFS_StatusName}}\r\n      </kendo-card-body>\r\n      <kendo-card-footer>\r\n        Survey Progression: \r\n        <kendo-progressbar style=\"width: 210px; border-radius:10px\" [value]=\"card.value\" [label]=\"label\" [progressCssStyle]=\"progressStyles\">\r\n        </kendo-progressbar>\r\n        <kendo-card-actions class=\"k-hbox-actionBtn\" orientation=\"horizontal\" [layout]=\"'end'\">\r\n          <button class=\"k-button k-navigation\"\r\n                  (click)=\"start(card)\">\r\n            <div style=\"justify-content:space-between\">\r\n              <span> Start &nbsp;</span>\r\n              <fa-icon [icon]=\"getFontAwesome('play')\"></fa-icon>\r\n            </div>\r\n          </button>\r\n        </kendo-card-actions>\r\n      </kendo-card-footer>\r\n    </kendo-card>\r\n  </div>\r\n</div>\r\n", styles: [".survey-card-list{display:flex;flex-wrap:wrap;background-color:#f0dcd9;align-items:center;border-radius:10px}.custom-card-submit{margin:20px;border:3px solid;border-color:green;border-radius:15px}.custom-card-draft,.custom-card-new{margin:20px;border:3px solid;border-color:orange;border-radius:15px}\n"], components: [{ type: i3.CardComponent, selector: "kendo-card", inputs: ["orientation", "width"] }, { type: i3.CardHeaderComponent, selector: "kendo-card-header" }, { type: i3.CardBodyComponent, selector: "kendo-card-body" }, { type: i3.CardFooterComponent, selector: "kendo-card-footer" }, { type: i4.ProgressBarComponent, selector: "kendo-progressbar", inputs: ["label", "animation", "progressCssStyle", "progressCssClass", "emptyCssStyle", "emptyCssClass"], outputs: ["animationEnd"], exportAs: ["kendoProgressBar"] }, { type: i3.CardActionsComponent, selector: "kendo-card-actions", inputs: ["orientation", "layout", "actions"], outputs: ["action"] }, { type: i5.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], directives: [{ type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.CardTitleDirective, selector: "[kendoCardTitle]" }, { type: i3.CardSubtitleDirective, selector: "[kendoCardSubtitle]" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZkcardComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-zkcard', template: "<!--<kendo-multiselect [data]=\"filterItems\" [value]=\"value\" [placeholder]=\"'Survey Status'\" [filterable]=\"true\"\r\n                   (valueChange)=\"valueChange($event)\"></kendo-multiselect>\r\n&nbsp;-->\r\n<div class=\"survey-card-list\">\r\n  <div *ngFor=\"let card of scrollViewCards.data\">\r\n    <!--<scrollview-card [card]=\"card\"></scrollview-card>-->\r\n    <kendo-card class=\"custom-card-draft\" *ngIf=\"card.WFS_StatusName == 'Draft'\" [width]=\"'250px'\">\r\n      <kendo-card-header class=\"k-hbox\">\r\n        <div>\r\n          <h1 kendoCardTitle>{{ card.SurveyTemplateName }}</h1>\r\n          <p kendoCardSubtitle>Survey Doc No: {{card.DocumentNo}}</p>\r\n        </div>\r\n      </kendo-card-header>\r\n      <kendo-card-body class=\"card-body\">\r\n        Mill Name:  {{card.PartnerMillName}}\r\n        <br />\r\n        Survey Status: {{card.WFS_StatusName}}\r\n      </kendo-card-body>\r\n      <kendo-card-footer>\r\n        Survey Progression:\r\n        <kendo-progressbar style=\"width: 210px; border-radius:10px\" [value]=\"card.value\" [label]=\"label\" [progressCssStyle]=\"progressStyles\">\r\n        </kendo-progressbar>\r\n\r\n        <kendo-card-actions class=\"k-hbox-actionBtn\" orientation=\"horizontal\" [layout]=\"'end'\">\r\n          <button class=\"k-button k-navigation\"\r\n                  (click)=\"start(card)\">\r\n            <div style=\"justify-content:space-between\">\r\n              <span> Continue &nbsp;</span>\r\n              <fa-icon [icon]=\"getFontAwesome('play')\"></fa-icon>\r\n            </div>\r\n          </button>\r\n        </kendo-card-actions>\r\n      </kendo-card-footer>\r\n    </kendo-card>\r\n\r\n    <kendo-card class=\"custom-card-submit\" *ngIf=\"card.WFS_StatusName == 'Submitted'\" [width]=\"'250px'\">\r\n      <kendo-card-header class=\"k-hbox\">\r\n        <div>\r\n          <h1 kendoCardTitle>{{ card.SurveyTemplateName }}</h1>\r\n          <p kendoCardSubtitle>Survey Doc No: {{card.DocumentNo}}</p>\r\n        </div>\r\n      </kendo-card-header>\r\n      <kendo-card-body class=\"card-body\">\r\n        Mill Name:  {{card.PartnerMillName}}\r\n        <br />\r\n        Survey Status: {{card.WFS_StatusName}}\r\n      </kendo-card-body>\r\n      <kendo-card-footer>\r\n        Survey Progression:\r\n        <kendo-progressbar style=\"width: 210px; border-radius:10px\" [value]=\"card.value\" [label]=\"label\" [progressCssStyle]=\"progressStyles\">\r\n        </kendo-progressbar>\r\n        <kendo-card-actions class=\"k-hbox-actionBtn\" orientation=\"horizontal\" [layout]=\"'end'\">\r\n          <button class=\"k-button k-navigation\"\r\n                  (click)=\"start(card)\">\r\n            <div style=\"justify-content:space-between\">\r\n              <span> View &nbsp;</span>\r\n              <fa-icon [icon]=\"getFontAwesome('file-alt')\"></fa-icon>\r\n            </div>\r\n          </button>\r\n        </kendo-card-actions>\r\n      </kendo-card-footer>\r\n    </kendo-card>\r\n\r\n    <kendo-card class=\"custom-card-new\" *ngIf=\"card.WFS_StatusName == 'New'\" [width]=\"'250px'\">\r\n      <kendo-card-header class=\"k-hbox\">\r\n        <div>\r\n          <h1 kendoCardTitle>{{ card.SurveyTemplateName }}</h1>\r\n          <p kendoCardSubtitle>{{card.DocumentNo}}</p>\r\n        </div>\r\n      </kendo-card-header>\r\n      <kendo-card-body class=\"card-body\">\r\n        Mill Name:  {{card.PartnerMillName}}\r\n        <br />\r\n        Survey Status: {{card.WFS_StatusName}}\r\n      </kendo-card-body>\r\n      <kendo-card-footer>\r\n        Survey Progression: \r\n        <kendo-progressbar style=\"width: 210px; border-radius:10px\" [value]=\"card.value\" [label]=\"label\" [progressCssStyle]=\"progressStyles\">\r\n        </kendo-progressbar>\r\n        <kendo-card-actions class=\"k-hbox-actionBtn\" orientation=\"horizontal\" [layout]=\"'end'\">\r\n          <button class=\"k-button k-navigation\"\r\n                  (click)=\"start(card)\">\r\n            <div style=\"justify-content:space-between\">\r\n              <span> Start &nbsp;</span>\r\n              <fa-icon [icon]=\"getFontAwesome('play')\"></fa-icon>\r\n            </div>\r\n          </button>\r\n        </kendo-card-actions>\r\n      </kendo-card-footer>\r\n    </kendo-card>\r\n  </div>\r\n</div>\r\n", styles: [".survey-card-list{display:flex;flex-wrap:wrap;background-color:#f0dcd9;align-items:center;border-radius:10px}.custom-card-submit{margin:20px;border:3px solid;border-color:green;border-radius:15px}.custom-card-draft,.custom-card-new{margin:20px;border:3px solid;border-color:orange;border-radius:15px}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.ActivatedRoute }, { type: i2.ResourceApiService }, { type: i2.AuthService }, { type: i2.ZGridStatePersistingService }, { type: i2.WebApiService }, { type: i1.Router }]; } });

package/esm2020/lib/zlabel/zlabel.component.mjs

@@ -6,12 +6,14 @@ import { Component, Input } from "@angular/core";
 import { ZComponentHelper, ZComponentProperties } from 'mmhglobal-zcore';
 import * as i0 from "@angular/core";
 import * as i1 from "@ionic/angular";
-import * as i2 from "@angular/common";
-import * as i3 from "@angular/forms";
+import * as i2 from "@fortawesome/angular-fontawesome";
+import * as i3 from "@angular/common";
+import * as i4 from "@angular/forms";
 export class ZlabelComponent {
     constructor() {
         this.componentProperties = new ZComponentProperties();
         this.labelText = "";
+        this.labelList = [];
         this.setVisible = (status) => {
             this.componentProperties.isVisible = status;
             this.data.Visible = status;
@@ -19,11 +21,19 @@ export class ZlabelComponent {
         this.setData = (data) => {
             this.labelText = data;
         };
+        this.setLabelList = (data) => {
+            this.labelList = data;
+        };
     }
     ngOnInit() {
         ZComponentHelper.setComponentProperties(this);
         ZComponentHelper.registerComponent(this);
-        this.labelText = ZComponentHelper.getGroupValue(this.data.Label.toString(), this.group);
+        if (this.data['LabelList']) {
+            this.labelList = this.data['LabelList'];
+        }
+        else {
+            this.labelText = ZComponentHelper.getGroupValue(this.data.Label.toString(), this.group);
+        }
     }
     getReadOnlyValue() {
         const readOnlyValue = ZComponentHelper.getGroupEvalValue.call(this, this.data.ReadOnly);
@@ -46,12 +56,21 @@ export class ZlabelComponent {
     getClass(form, data) {
         return `${ZComponentHelper.getIon_InvalidClass(form, data)} ${data.DivClass}`;
     }
+    getFontAwesome(iconName) {
+        return ZComponentHelper.getFontAwesome(iconName);
+    }
+    getLabelData() {
+        return this.labelText;
+    }
+    getLabelList() {
+        return this.labelList;
+    }
 }
-ZlabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZlabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ZlabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZlabelComponent, selector: "app-zlabel", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<ion-item [formGroup]=\"form\" *ngIf=\"componentProperties.isVisible\" [ngClass]=\"getClass(form, data)\">\r\n  <div class=\"ion-row\" style=\"justify-content: space-between; width: 100%\">\r\n    <span style=\"flex: 1;\">\r\n      <ion-label class=\"ion-text-wrap label\" Position=\"Fixed\" [color]=\"data.Color\">{{labelText}}</ion-label>\r\n    </span>\r\n  </div>\r\n</ion-item>\r\n", styles: [".subtitle{font-weight:700;text-decoration:underline}.subtitle .label,.mediumFont .label{font-size:15px}.label{font-size:12px;white-space:pre-wrap!important}.boldFont .label{font-weight:700}.underlineFont .label{text-decoration:underline}\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"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZlabelComponent, decorators: [{
+ZlabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZlabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ZlabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZlabelComponent, selector: "app-zlabel", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<ion-item [formGroup]=\"form\" *ngIf=\"componentProperties.isVisible\" [ngClass]=\"getClass(form, data)\">\r\n  <div class=\"ion-row\" style=\"justify-content: space-between; width: 100%\">\r\n    <div style=\"flex: 1;\">\r\n      <div *ngIf=\"data.Label\">\r\n        <fa-icon *ngIf=\"data.Icon\" [icon]=\"getFontAwesome(data.Icon)\" style=\"padding-right: 5px;\"></fa-icon> \r\n        <ion-label class=\"ion-text-wrap label\" Position=\"Fixed\" [color]=\"data.Color\">{{labelText}}</ion-label>\r\n      </div>\r\n\r\n      <div *ngIf=\"data.LabelList\"> \r\n        <div *ngFor=\"let label of labelList\">\r\n          <div class=\"ion-text-wrap labelList\" [style]=\"label.StyleExpression\"> \r\n            <div *ngIf=\"!data.DisableFrontSpacing\" style=\"padding-left: 5px;\"></div>\r\n            <fa-icon *ngIf=\"label.Icon\" [icon]=\"getFontAwesome(label.Icon)\" style=\"padding-right: 5px;\"></fa-icon>\r\n            <div [innerHTML]=\"label.Label\"></div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</ion-item>\r\n", styles: [".subtitle{font-weight:700;text-decoration:underline}.subtitle .label,.mediumFont .label{font-size:15px}.label{font-size:12px;white-space:pre-wrap!important}.labelList{display:flex;align-items:center;font-size:12px;white-space:pre-wrap!important}.boldFont .label{font-weight:700}.underlineFont .label{text-decoration:underline}\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: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZlabelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-zlabel', template: "<ion-item [formGroup]=\"form\" *ngIf=\"componentProperties.isVisible\" [ngClass]=\"getClass(form, data)\">\r\n  <div class=\"ion-row\" style=\"justify-content: space-between; width: 100%\">\r\n    <span style=\"flex: 1;\">\r\n      <ion-label class=\"ion-text-wrap label\" Position=\"Fixed\" [color]=\"data.Color\">{{labelText}}</ion-label>\r\n    </span>\r\n  </div>\r\n</ion-item>\r\n", styles: [".subtitle{font-weight:700;text-decoration:underline}.subtitle .label,.mediumFont .label{font-size:15px}.label{font-size:12px;white-space:pre-wrap!important}.boldFont .label{font-weight:700}.underlineFont .label{text-decoration:underline}\n"] }]
+            args: [{ selector: 'app-zlabel', template: "<ion-item [formGroup]=\"form\" *ngIf=\"componentProperties.isVisible\" [ngClass]=\"getClass(form, data)\">\r\n  <div class=\"ion-row\" style=\"justify-content: space-between; width: 100%\">\r\n    <div style=\"flex: 1;\">\r\n      <div *ngIf=\"data.Label\">\r\n        <fa-icon *ngIf=\"data.Icon\" [icon]=\"getFontAwesome(data.Icon)\" style=\"padding-right: 5px;\"></fa-icon> \r\n        <ion-label class=\"ion-text-wrap label\" Position=\"Fixed\" [color]=\"data.Color\">{{labelText}}</ion-label>\r\n      </div>\r\n\r\n      <div *ngIf=\"data.LabelList\"> \r\n        <div *ngFor=\"let label of labelList\">\r\n          <div class=\"ion-text-wrap labelList\" [style]=\"label.StyleExpression\"> \r\n            <div *ngIf=\"!data.DisableFrontSpacing\" style=\"padding-left: 5px;\"></div>\r\n            <fa-icon *ngIf=\"label.Icon\" [icon]=\"getFontAwesome(label.Icon)\" style=\"padding-right: 5px;\"></fa-icon>\r\n            <div [innerHTML]=\"label.Label\"></div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</ion-item>\r\n", styles: [".subtitle{font-weight:700;text-decoration:underline}.subtitle .label,.mediumFont .label{font-size:15px}.label{font-size:12px;white-space:pre-wrap!important}.labelList{display:flex;align-items:center;font-size:12px;white-space:pre-wrap!important}.boldFont .label{font-weight:700}.underlineFont .label{text-decoration:underline}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { data: [{
                 type: Input
             }], group: [{
@@ -59,4 +78,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImpor
             }], form: [{
                 type: Input
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiemxhYmVsLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL21taGdsb2JhbC1keW5hbWljZm9ybS9zcmMvbGliL3psYWJlbC96bGFiZWwuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbW1oZ2xvYmFsLWR5bmFtaWNmb3JtL3NyYy9saWIvemxhYmVsL3psYWJlbC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSwrQkFBK0I7QUFDL0IsT0FBTyxFQUFFLFNBQVMsRUFBVSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFHekQsNkJBQTZCO0FBRTdCLDhCQUE4QjtBQUU5QiwyQ0FBMkM7QUFDM0MsT0FBTyxFQUNPLGdCQUFnQixFQUNaLG9CQUFvQixFQUNyQyxNQUFNLGlCQUFpQixDQUFDOzs7OztBQVF6QixNQUFNLE9BQU8sZUFBZTtJQVMxQjtRQUpBLHdCQUFtQixHQUFHLElBQUksb0JBQW9CLEVBQUUsQ0FBQztRQUVqRCxjQUFTLEdBQUcsRUFBRSxDQUFDO1FBMEJSLGVBQVUsR0FBRyxDQUFDLE1BQWUsRUFBRSxFQUFFO1lBQ3RDLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxTQUFTLEdBQUcsTUFBTSxDQUFDO1lBQzVDLElBQUksQ0FBQyxJQUFJLENBQUMsT0FBTyxHQUFHLE1BQU0sQ0FBQztRQUM3QixDQUFDLENBQUE7UUFVTSxZQUFPLEdBQUcsQ0FBQyxJQUFTLEVBQUUsRUFBRTtZQUM3QixJQUFJLENBQUMsU0FBUyxHQUFHLElBQUksQ0FBQztRQUN4QixDQUFDLENBQUE7SUF2Q2UsQ0FBQztJQUVqQixRQUFRO1FBQ04sZ0JBQWdCLENBQUMsc0JBQXNCLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDOUMsZ0JBQWdCLENBQUMsaUJBQWlCLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDekMsSUFBSSxDQUFDLFNBQVMsR0FBRyxnQkFBZ0IsQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsUUFBUSxFQUFFLEVBQUUsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQzFGLENBQUM7SUFFRCxnQkFBZ0I7UUFDZCxNQUFNLGFBQWEsR0FBRyxnQkFBZ0IsQ0FBQyxpQkFBaUIsQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFLElBQUksQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUM7UUFDeEYsSUFBSSxPQUFPLGFBQWEsS0FBSyxVQUFVLEVBQUU7WUFDdkMsT0FBTyxhQUFhLEVBQUUsQ0FBQztTQUN4QjtRQUNELE9BQU8sYUFBYSxDQUFDO0lBQ3ZCLENBQUM7SUFFRCxTQUFTO1FBQ1AsSUFBSSxJQUFJLENBQUMsbUJBQW1CLENBQUMsU0FBUyxLQUFLLElBQUksRUFBRTtZQUMvQyxPQUFPLGdCQUFnQixDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztTQUN6RDthQUFNO1lBQ0wsT0FBTyxJQUFJLENBQUMsbUJBQW1CLENBQUMsU0FBUyxDQUFDO1NBQzNDO0lBQ0gsQ0FBQztJQU9ELG1CQUFtQixDQUFDLElBQWUsRUFBRSxJQUFZO1FBQy9DLE9BQU8sZ0JBQWdCLENBQUMsbUJBQW1CLENBQUMsSUFBSSxFQUFFLElBQUksQ0FBQyxDQUFDO0lBQzFELENBQUM7SUFFRCxRQUFRLENBQUMsSUFBZSxFQUFFLElBQVk7UUFDcEMsT0FBTyxHQUFHLGdCQUFnQixDQUFDLG1CQUFtQixDQUFDLElBQUksRUFBRSxJQUFJLENBQUMsSUFBSSxJQUFJLENBQUMsUUFBUSxFQUFFLENBQUM7SUFDaEYsQ0FBQzs7NEdBNUNVLGVBQWU7Z0dBQWYsZUFBZSwwR0NwQjVCLG9ZQU9BOzJGRGFhLGVBQWU7a0JBTDNCLFNBQVM7K0JBQ0UsWUFBWTswRUFLYixJQUFJO3NCQUFaLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSyIsInNvdXJjZXNDb250ZW50IjpbIi8qKioqKioqKioqIEFuZ3VsYXIgKioqKioqKioqKi9cclxuaW1wb3J0IHsgQ29tcG9uZW50LCBPbkluaXQsIElucHV0IH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcclxuaW1wb3J0IHsgRm9ybUdyb3VwIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xyXG5cclxuLyoqKioqKioqKiogSW9uaWMgKioqKioqKioqKi9cclxuXHJcbi8qKioqKioqKioqIFBsdWdpbiAqKioqKioqKioqL1xyXG5cclxuLyoqKioqKioqKiogQ29tcG9uZW50ICYgU2VydmljZSAqKioqKioqKioqL1xyXG5pbXBvcnQgeyBcclxuICBaQ29tcG9uZW50LCBaQ29tcG9uZW50SGVscGVyLFxyXG4gIFpGaWVsZCwgWkdyb3VwLCBaQ29tcG9uZW50UHJvcGVydGllcyBcclxufSBmcm9tICdtbWhnbG9iYWwtemNvcmUnO1xyXG5cclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnYXBwLXpsYWJlbCcsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL3psYWJlbC5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vemxhYmVsLmNvbXBvbmVudC5zY3NzJ10sXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBabGFiZWxDb21wb25lbnQgaW1wbGVtZW50cyBaQ29tcG9uZW50LCBPbkluaXQge1xyXG4gIEBJbnB1dCgpIGRhdGE6IFpGaWVsZDtcclxuICBASW5wdXQoKSBncm91cDogWkdyb3VwO1xyXG4gIEBJbnB1dCgpIGZvcm06IEZvcm1Hcm91cDtcclxuXHJcbiAgY29tcG9uZW50UHJvcGVydGllcyA9IG5ldyBaQ29tcG9uZW50UHJvcGVydGllcygpO1xyXG5cclxuICBsYWJlbFRleHQgPSBcIlwiO1xyXG5cclxuICBjb25zdHJ1Y3RvcigpIHsgfVxyXG5cclxuICBuZ09uSW5pdCgpIHtcclxuICAgIFpDb21wb25lbnRIZWxwZXIuc2V0Q29tcG9uZW50UHJvcGVydGllcyh0aGlzKTtcclxuICAgIFpDb21wb25lbnRIZWxwZXIucmVnaXN0ZXJDb21wb25lbnQodGhpcyk7XHJcbiAgICB0aGlzLmxhYmVsVGV4dCA9IFpDb21wb25lbnRIZWxwZXIuZ2V0R3JvdXBWYWx1ZSh0aGlzLmRhdGEuTGFiZWwudG9TdHJpbmcoKSwgdGhpcy5ncm91cCk7XHJcbiAgfVxyXG5cclxuICBnZXRSZWFkT25seVZhbHVlKCkge1xyXG4gICAgY29uc3QgcmVhZE9ubHlWYWx1ZSA9IFpDb21wb25lbnRIZWxwZXIuZ2V0R3JvdXBFdmFsVmFsdWUuY2FsbCh0aGlzLCB0aGlzLmRhdGEuUmVhZE9ubHkpO1xyXG4gICAgaWYgKHR5cGVvZiByZWFkT25seVZhbHVlID09PSAnZnVuY3Rpb24nKSB7XHJcbiAgICAgIHJldHVybiByZWFkT25seVZhbHVlKCk7XHJcbiAgICB9XHJcbiAgICByZXR1cm4gcmVhZE9ubHlWYWx1ZTtcclxuICB9XHJcblxyXG4gIGlzVmlzaWJsZSgpIHtcclxuICAgIGlmICh0aGlzLmNvbXBvbmVudFByb3BlcnRpZXMuaXNWaXNpYmxlID09PSBudWxsKSB7XHJcbiAgICAgIHJldHVybiBaQ29tcG9uZW50SGVscGVyLmlzVmlzaWJsZS5jYWxsKHRoaXMsIHRoaXMuZGF0YSk7XHJcbiAgICB9IGVsc2Uge1xyXG4gICAgICByZXR1cm4gdGhpcy5jb21wb25lbnRQcm9wZXJ0aWVzLmlzVmlzaWJsZTtcclxuICAgIH1cclxuICB9XHJcblxyXG4gIHB1YmxpYyBzZXRWaXNpYmxlID0gKHN0YXR1czogYm9vbGVhbikgPT4ge1xyXG4gICAgdGhpcy5jb21wb25lbnRQcm9wZXJ0aWVzLmlzVmlzaWJsZSA9IHN0YXR1cztcclxuICAgIHRoaXMuZGF0YS5WaXNpYmxlID0gc3RhdHVzO1xyXG4gIH1cclxuXHJcbiAgZ2V0SW9uX0ludmFsaWRDbGFzcyhmb3JtOiBGb3JtR3JvdXAsIGRhdGE6IFpGaWVsZCkge1xyXG4gICAgcmV0dXJuIFpDb21wb25lbnRIZWxwZXIuZ2V0SW9uX0ludmFsaWRDbGFzcyhmb3JtLCBkYXRhKTtcclxuICB9XHJcblxyXG4gIGdldENsYXNzKGZvcm06IEZvcm1Hcm91cCwgZGF0YTogWkZpZWxkKSB7XHJcbiAgICByZXR1cm4gYCR7WkNvbXBvbmVudEhlbHBlci5nZXRJb25fSW52YWxpZENsYXNzKGZvcm0sIGRhdGEpfSAke2RhdGEuRGl2Q2xhc3N9YDtcclxuICB9XHJcblxyXG4gIHB1YmxpYyBzZXREYXRhID0gKGRhdGE6IGFueSkgPT4ge1xyXG4gICAgdGhpcy5sYWJlbFRleHQgPSBkYXRhO1xyXG4gIH1cclxufSIsIjxpb24taXRlbSBbZm9ybUdyb3VwXT1cImZvcm1cIiAqbmdJZj1cImNvbXBvbmVudFByb3BlcnRpZXMuaXNWaXNpYmxlXCIgW25nQ2xhc3NdPVwiZ2V0Q2xhc3MoZm9ybSwgZGF0YSlcIj5cclxuICA8ZGl2IGNsYXNzPVwiaW9uLXJvd1wiIHN0eWxlPVwianVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuOyB3aWR0aDogMTAwJVwiPlxyXG4gICAgPHNwYW4gc3R5bGU9XCJmbGV4OiAxO1wiPlxyXG4gICAgICA8aW9uLWxhYmVsIGNsYXNzPVwiaW9uLXRleHQtd3JhcCBsYWJlbFwiIFBvc2l0aW9uPVwiRml4ZWRcIiBbY29sb3JdPVwiZGF0YS5Db2xvclwiPnt7bGFiZWxUZXh0fX08L2lvbi1sYWJlbD5cclxuICAgIDwvc3Bhbj5cclxuICA8L2Rpdj5cclxuPC9pb24taXRlbT5cclxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiemxhYmVsLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL21taGdsb2JhbC1keW5hbWljZm9ybS9zcmMvbGliL3psYWJlbC96bGFiZWwuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbW1oZ2xvYmFsLWR5bmFtaWNmb3JtL3NyYy9saWIvemxhYmVsL3psYWJlbC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSwrQkFBK0I7QUFDL0IsT0FBTyxFQUFFLFNBQVMsRUFBVSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFHekQsNkJBQTZCO0FBRTdCLDhCQUE4QjtBQUU5QiwyQ0FBMkM7QUFDM0MsT0FBTyxFQUNPLGdCQUFnQixFQUNaLG9CQUFvQixFQUNyQyxNQUFNLGlCQUFpQixDQUFDOzs7Ozs7QUFRekIsTUFBTSxPQUFPLGVBQWU7SUFVMUI7UUFMQSx3QkFBbUIsR0FBRyxJQUFJLG9CQUFvQixFQUFFLENBQUM7UUFFakQsY0FBUyxHQUFHLEVBQUUsQ0FBQztRQUNmLGNBQVMsR0FBRyxFQUFFLENBQUM7UUFnQ1IsZUFBVSxHQUFHLENBQUMsTUFBZSxFQUFFLEVBQUU7WUFDdEMsSUFBSSxDQUFDLG1CQUFtQixDQUFDLFNBQVMsR0FBRyxNQUFNLENBQUM7WUFDNUMsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLEdBQUcsTUFBTSxDQUFDO1FBQzdCLENBQUMsQ0FBQTtRQWNNLFlBQU8sR0FBRyxDQUFDLElBQVMsRUFBRSxFQUFFO1lBQzdCLElBQUksQ0FBQyxTQUFTLEdBQUcsSUFBSSxDQUFDO1FBQ3hCLENBQUMsQ0FBQTtRQU1NLGlCQUFZLEdBQUcsQ0FBQyxJQUFTLEVBQUUsRUFBRTtZQUNsQyxJQUFJLENBQUMsU0FBUyxHQUFHLElBQUksQ0FBQztRQUN4QixDQUFDLENBQUE7SUF6RGUsQ0FBQztJQUVqQixRQUFRO1FBQ04sZ0JBQWdCLENBQUMsc0JBQXNCLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDOUMsZ0JBQWdCLENBQUMsaUJBQWlCLENBQUMsSUFBSSxDQUFDLENBQUM7UUFFekMsSUFBSSxJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxFQUFFO1lBQzFCLElBQUksQ0FBQyxTQUFTLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUMsQ0FBQztTQUN6QzthQUNJO1lBQ0gsSUFBSSxDQUFDLFNBQVMsR0FBRyxnQkFBZ0IsQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsUUFBUSxFQUFFLEVBQUUsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO1NBQ3pGO0lBQ0gsQ0FBQztJQUVELGdCQUFnQjtRQUNkLE1BQU0sYUFBYSxHQUFHLGdCQUFnQixDQUFDLGlCQUFpQixDQUFDLElBQUksQ0FBQyxJQUFJLEVBQUUsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQztRQUN4RixJQUFJLE9BQU8sYUFBYSxLQUFLLFVBQVUsRUFBRTtZQUN2QyxPQUFPLGFBQWEsRUFBRSxDQUFDO1NBQ3hCO1FBQ0QsT0FBTyxhQUFhLENBQUM7SUFDdkIsQ0FBQztJQUVELFNBQVM7UUFDUCxJQUFJLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxTQUFTLEtBQUssSUFBSSxFQUFFO1lBQy9DLE9BQU8sZ0JBQWdCLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxJQUFJLEVBQUUsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO1NBQ3pEO2FBQU07WUFDTCxPQUFPLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxTQUFTLENBQUM7U0FDM0M7SUFDSCxDQUFDO0lBT0QsbUJBQW1CLENBQUMsSUFBZSxFQUFFLElBQVk7UUFDL0MsT0FBTyxnQkFBZ0IsQ0FBQyxtQkFBbUIsQ0FBQyxJQUFJLEVBQUUsSUFBSSxDQUFDLENBQUM7SUFDMUQsQ0FBQztJQUVELFFBQVEsQ0FBQyxJQUFlLEVBQUUsSUFBWTtRQUNwQyxPQUFPLEdBQUcsZ0JBQWdCLENBQUMsbUJBQW1CLENBQUMsSUFBSSxFQUFFLElBQUksQ0FBQyxJQUFJLElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUNoRixDQUFDO0lBRUQsY0FBYyxDQUFDLFFBQWE7UUFDMUIsT0FBTyxnQkFBZ0IsQ0FBQyxjQUFjLENBQUMsUUFBUSxDQUFDLENBQUM7SUFDbkQsQ0FBQztJQU1NLFlBQVk7UUFDakIsT0FBTyxJQUFJLENBQUMsU0FBUyxDQUFDO0lBQ3hCLENBQUM7SUFNTSxZQUFZO1FBQ2pCLE9BQU8sSUFBSSxDQUFDLFNBQVMsQ0FBQztJQUN4QixDQUFDOzs0R0F2RVUsZUFBZTtnR0FBZixlQUFlLDBHQ3BCNUIsNGlDQW9CQTsyRkRBYSxlQUFlO2tCQUwzQixTQUFTOytCQUNFLFlBQVk7MEVBS2IsSUFBSTtzQkFBWixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxJQUFJO3NCQUFaLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyIvKioqKioqKioqKiBBbmd1bGFyICoqKioqKioqKiovXHJcbmltcG9ydCB7IENvbXBvbmVudCwgT25Jbml0LCBJbnB1dCB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XHJcbmltcG9ydCB7IEZvcm1Hcm91cCB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuXHJcbi8qKioqKioqKioqIElvbmljICoqKioqKioqKiovXHJcblxyXG4vKioqKioqKioqKiBQbHVnaW4gKioqKioqKioqKi9cclxuXHJcbi8qKioqKioqKioqIENvbXBvbmVudCAmIFNlcnZpY2UgKioqKioqKioqKi9cclxuaW1wb3J0IHsgXHJcbiAgWkNvbXBvbmVudCwgWkNvbXBvbmVudEhlbHBlcixcclxuICBaRmllbGQsIFpHcm91cCwgWkNvbXBvbmVudFByb3BlcnRpZXMgXHJcbn0gZnJvbSAnbW1oZ2xvYmFsLXpjb3JlJztcclxuXHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ2FwcC16bGFiZWwnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi96bGFiZWwuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL3psYWJlbC5jb21wb25lbnQuc2NzcyddLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgWmxhYmVsQ29tcG9uZW50IGltcGxlbWVudHMgWkNvbXBvbmVudCwgT25Jbml0IHtcclxuICBASW5wdXQoKSBkYXRhOiBaRmllbGQ7XHJcbiAgQElucHV0KCkgZ3JvdXA6IFpHcm91cDtcclxuICBASW5wdXQoKSBmb3JtOiBGb3JtR3JvdXA7XHJcblxyXG4gIGNvbXBvbmVudFByb3BlcnRpZXMgPSBuZXcgWkNvbXBvbmVudFByb3BlcnRpZXMoKTtcclxuXHJcbiAgbGFiZWxUZXh0ID0gXCJcIjtcclxuICBsYWJlbExpc3QgPSBbXTtcclxuXHJcbiAgY29uc3RydWN0b3IoKSB7IH1cclxuXHJcbiAgbmdPbkluaXQoKSB7XHJcbiAgICBaQ29tcG9uZW50SGVscGVyLnNldENvbXBvbmVudFByb3BlcnRpZXModGhpcyk7XHJcbiAgICBaQ29tcG9uZW50SGVscGVyLnJlZ2lzdGVyQ29tcG9uZW50KHRoaXMpO1xyXG4gICAgIFxyXG4gICAgaWYgKHRoaXMuZGF0YVsnTGFiZWxMaXN0J10pIHtcclxuICAgICAgdGhpcy5sYWJlbExpc3QgPSB0aGlzLmRhdGFbJ0xhYmVsTGlzdCddO1xyXG4gICAgfVxyXG4gICAgZWxzZSB7XHJcbiAgICAgIHRoaXMubGFiZWxUZXh0ID0gWkNvbXBvbmVudEhlbHBlci5nZXRHcm91cFZhbHVlKHRoaXMuZGF0YS5MYWJlbC50b1N0cmluZygpLCB0aGlzLmdyb3VwKTtcclxuICAgIH0gXHJcbiAgfVxyXG5cclxuICBnZXRSZWFkT25seVZhbHVlKCkge1xyXG4gICAgY29uc3QgcmVhZE9ubHlWYWx1ZSA9IFpDb21wb25lbnRIZWxwZXIuZ2V0R3JvdXBFdmFsVmFsdWUuY2FsbCh0aGlzLCB0aGlzLmRhdGEuUmVhZE9ubHkpO1xyXG4gICAgaWYgKHR5cGVvZiByZWFkT25seVZhbHVlID09PSAnZnVuY3Rpb24nKSB7XHJcbiAgICAgIHJldHVybiByZWFkT25seVZhbHVlKCk7XHJcbiAgICB9XHJcbiAgICByZXR1cm4gcmVhZE9ubHlWYWx1ZTtcclxuICB9XHJcblxyXG4gIGlzVmlzaWJsZSgpIHtcclxuICAgIGlmICh0aGlzLmNvbXBvbmVudFByb3BlcnRpZXMuaXNWaXNpYmxlID09PSBudWxsKSB7XHJcbiAgICAgIHJldHVybiBaQ29tcG9uZW50SGVscGVyLmlzVmlzaWJsZS5jYWxsKHRoaXMsIHRoaXMuZGF0YSk7XHJcbiAgICB9IGVsc2Uge1xyXG4gICAgICByZXR1cm4gdGhpcy5jb21wb25lbnRQcm9wZXJ0aWVzLmlzVmlzaWJsZTtcclxuICAgIH1cclxuICB9XHJcblxyXG4gIHB1YmxpYyBzZXRWaXNpYmxlID0gKHN0YXR1czogYm9vbGVhbikgPT4ge1xyXG4gICAgdGhpcy5jb21wb25lbnRQcm9wZXJ0aWVzLmlzVmlzaWJsZSA9IHN0YXR1cztcclxuICAgIHRoaXMuZGF0YS5WaXNpYmxlID0gc3RhdHVzO1xyXG4gIH1cclxuXHJcbiAgZ2V0SW9uX0ludmFsaWRDbGFzcyhmb3JtOiBGb3JtR3JvdXAsIGRhdGE6IFpGaWVsZCkge1xyXG4gICAgcmV0dXJuIFpDb21wb25lbnRIZWxwZXIuZ2V0SW9uX0ludmFsaWRDbGFzcyhmb3JtLCBkYXRhKTtcclxuICB9XHJcblxyXG4gIGdldENsYXNzKGZvcm06IEZvcm1Hcm91cCwgZGF0YTogWkZpZWxkKSB7XHJcbiAgICByZXR1cm4gYCR7WkNvbXBvbmVudEhlbHBlci5nZXRJb25fSW52YWxpZENsYXNzKGZvcm0sIGRhdGEpfSAke2RhdGEuRGl2Q2xhc3N9YDtcclxuICB9XHJcblxyXG4gIGdldEZvbnRBd2Vzb21lKGljb25OYW1lOiBhbnkpIHtcclxuICAgIHJldHVybiBaQ29tcG9uZW50SGVscGVyLmdldEZvbnRBd2Vzb21lKGljb25OYW1lKTtcclxuICB9XHJcblxyXG4gIHB1YmxpYyBzZXREYXRhID0gKGRhdGE6IGFueSkgPT4ge1xyXG4gICAgdGhpcy5sYWJlbFRleHQgPSBkYXRhO1xyXG4gIH0gXHJcblxyXG4gIHB1YmxpYyBnZXRMYWJlbERhdGEoKSB7XHJcbiAgICByZXR1cm4gdGhpcy5sYWJlbFRleHQ7XHJcbiAgfVxyXG5cclxuICBwdWJsaWMgc2V0TGFiZWxMaXN0ID0gKGRhdGE6IGFueSkgPT4ge1xyXG4gICAgdGhpcy5sYWJlbExpc3QgPSBkYXRhO1xyXG4gIH0gXHJcblxyXG4gIHB1YmxpYyBnZXRMYWJlbExpc3QoKSB7XHJcbiAgICByZXR1cm4gdGhpcy5sYWJlbExpc3Q7XHJcbiAgfVxyXG59XHJcbiIsIjxpb24taXRlbSBbZm9ybUdyb3VwXT1cImZvcm1cIiAqbmdJZj1cImNvbXBvbmVudFByb3BlcnRpZXMuaXNWaXNpYmxlXCIgW25nQ2xhc3NdPVwiZ2V0Q2xhc3MoZm9ybSwgZGF0YSlcIj5cclxuICA8ZGl2IGNsYXNzPVwiaW9uLXJvd1wiIHN0eWxlPVwianVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuOyB3aWR0aDogMTAwJVwiPlxyXG4gICAgPGRpdiBzdHlsZT1cImZsZXg6IDE7XCI+XHJcbiAgICAgIDxkaXYgKm5nSWY9XCJkYXRhLkxhYmVsXCI+XHJcbiAgICAgICAgPGZhLWljb24gKm5nSWY9XCJkYXRhLkljb25cIiBbaWNvbl09XCJnZXRGb250QXdlc29tZShkYXRhLkljb24pXCIgc3R5bGU9XCJwYWRkaW5nLXJpZ2h0OiA1cHg7XCI+PC9mYS1pY29uPiBcclxuICAgICAgICA8aW9uLWxhYmVsIGNsYXNzPVwiaW9uLXRleHQtd3JhcCBsYWJlbFwiIFBvc2l0aW9uPVwiRml4ZWRcIiBbY29sb3JdPVwiZGF0YS5Db2xvclwiPnt7bGFiZWxUZXh0fX08L2lvbi1sYWJlbD5cclxuICAgICAgPC9kaXY+XHJcblxyXG4gICAgICA8ZGl2ICpuZ0lmPVwiZGF0YS5MYWJlbExpc3RcIj4gXHJcbiAgICAgICAgPGRpdiAqbmdGb3I9XCJsZXQgbGFiZWwgb2YgbGFiZWxMaXN0XCI+XHJcbiAgICAgICAgICA8ZGl2IGNsYXNzPVwiaW9uLXRleHQtd3JhcCBsYWJlbExpc3RcIiBbc3R5bGVdPVwibGFiZWwuU3R5bGVFeHByZXNzaW9uXCI+IFxyXG4gICAgICAgICAgICA8ZGl2ICpuZ0lmPVwiIWRhdGEuRGlzYWJsZUZyb250U3BhY2luZ1wiIHN0eWxlPVwicGFkZGluZy1sZWZ0OiA1cHg7XCI+PC9kaXY+XHJcbiAgICAgICAgICAgIDxmYS1pY29uICpuZ0lmPVwibGFiZWwuSWNvblwiIFtpY29uXT1cImdldEZvbnRBd2Vzb21lKGxhYmVsLkljb24pXCIgc3R5bGU9XCJwYWRkaW5nLXJpZ2h0OiA1cHg7XCI+PC9mYS1pY29uPlxyXG4gICAgICAgICAgICA8ZGl2IFtpbm5lckhUTUxdPVwibGFiZWwuTGFiZWxcIj48L2Rpdj5cclxuICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgICA8L2Rpdj5cclxuICAgIDwvZGl2PlxyXG4gIDwvZGl2PlxyXG48L2lvbi1pdGVtPlxyXG4iXX0=

package/esm2020/lib/zmfb/zmfb.component.mjs

@@ -200,9 +200,9 @@ export class ZmfbComponent {
         }
     }
 }
-ZmfbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZmfbComponent, deps: [{ token: i1.FieldService }, { token: i1.ResourceApiService }, { token: i1.WorkflowService }], target: i0.ɵɵFactoryTarget.Component });
-ZmfbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZmfbComponent, selector: "app-zmfb", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<div class=\"zmfb-wrap\">\r\n  <div class=\"k-overlay\" *ngIf=\"dialOpen\"></div>\r\n  <kendo-floatingactionbutton icon=\"plus\"\r\n                              [themeColor]=\"buttonColor\"\r\n                              [positionMode]=\"positionMode\"\r\n                              [align]=\"bottomEnd\"\r\n                              [dialItems]=\"items\"\r\n                              (blur)=\"onBlur()\"\r\n                              (focus)=\"onFocus()\"\r\n                              (open)=\"onOpen($event)\"\r\n                              (close)=\"onClose($event)\"\r\n                              (dialItemClick)=\"onDialItemClick($event)\">\r\n    <ng-template kendoDialItemTemplate let-item let-isFocused=\"isFocused\">\r\n      <span class=\"k-fab-item-text\">\r\n        <span>{{ item.label }}</span>\r\n      </span>\r\n      <kendo-avatar shape=\"circle\" [themeColor]=\"buttonColor\">\r\n        <span class=\"k-icon k-i-{{ item.icon }}\"></span>\r\n      </kendo-avatar> \r\n    </ng-template>\r\n  </kendo-floatingactionbutton>\r\n</div>\r\n", styles: [".button-item{padding:8px 10px;width:100%;display:flex;align-items:center;background-color:#fff}.button-details{margin-left:8px;display:flex;flex-direction:column;align-items:flex-start}.custom-focused-class{box-shadow:inset 0 0 8px #0003}.zmfb-wrap{display:flex;justify-content:center;margin-top:60px}@media only screen and (max-device-width: 768px){.k-bottom-end,.k-pos-bottom-end{padding-bottom:16vh}}\n"], components: [{ type: i2.FloatingActionButtonComponent, selector: "kendo-floatingactionbutton", inputs: ["positionMode", "dialItemAnimation", "tabIndex", "dialItems", "themeColor", "size", "rounded", "shape", "disabled", "align", "offset", "icon", "iconClass", "buttonClass", "dialClass", "text"], outputs: ["blur", "focus", "dialItemClick", "open", "close"] }, { type: i3.AvatarComponent, selector: "kendo-avatar", inputs: ["border", "shape", "rounded", "size", "themeColor", "fillMode", "fill", "iconClass", "width", "height", "cssStyle", "initials", "icon", "imageSrc"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.DialItemTemplateDirective, selector: "[kendoDialItemTemplate]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZmfbComponent, decorators: [{
+ZmfbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZmfbComponent, deps: [{ token: i1.FieldService }, { token: i1.ResourceApiService }, { token: i1.WorkflowService }], target: i0.ɵɵFactoryTarget.Component });
+ZmfbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZmfbComponent, selector: "app-zmfb", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<div class=\"zmfb-wrap\">\r\n  <div class=\"k-overlay\" *ngIf=\"dialOpen\"></div>\r\n  <kendo-floatingactionbutton icon=\"plus\"\r\n                              [themeColor]=\"buttonColor\"\r\n                              [positionMode]=\"positionMode\"\r\n                              [align]=\"bottomEnd\"\r\n                              [dialItems]=\"items\"\r\n                              (blur)=\"onBlur()\"\r\n                              (focus)=\"onFocus()\"\r\n                              (open)=\"onOpen($event)\"\r\n                              (close)=\"onClose($event)\"\r\n                              (dialItemClick)=\"onDialItemClick($event)\">\r\n    <ng-template kendoDialItemTemplate let-item let-isFocused=\"isFocused\">\r\n      <span class=\"k-fab-item-text\">\r\n        <span>{{ item.label }}</span>\r\n      </span>\r\n      <kendo-avatar shape=\"circle\" [themeColor]=\"buttonColor\">\r\n        <span class=\"k-icon k-i-{{ item.icon }}\"></span>\r\n      </kendo-avatar> \r\n    </ng-template>\r\n  </kendo-floatingactionbutton>\r\n</div>\r\n", styles: [".button-item{padding:8px 10px;width:100%;display:flex;align-items:center;background-color:#fff}.button-details{margin-left:8px;display:flex;flex-direction:column;align-items:flex-start}.custom-focused-class{box-shadow:inset 0 0 8px #0003}.zmfb-wrap{display:flex;justify-content:center;margin-top:60px}@media only screen and (max-device-width: 768px){.k-bottom-end,.k-pos-bottom-end{padding-bottom:16vh}}\n"], components: [{ type: i2.FloatingActionButtonComponent, selector: "kendo-floatingactionbutton", inputs: ["positionMode", "dialItemAnimation", "tabIndex", "dialItems", "themeColor", "size", "rounded", "shape", "disabled", "align", "offset", "icon", "iconClass", "buttonClass", "dialClass", "text"], outputs: ["blur", "focus", "dialItemClick", "open", "close"] }, { type: i3.AvatarComponent, selector: "kendo-avatar", inputs: ["border", "shape", "rounded", "size", "themeColor", "fillMode", "fill", "iconClass", "width", "height", "cssStyle", "initials", "icon", "imageSrc"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.DialItemTemplateDirective, selector: "[kendoDialItemTemplate]" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZmfbComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-zmfb', template: "<div class=\"zmfb-wrap\">\r\n  <div class=\"k-overlay\" *ngIf=\"dialOpen\"></div>\r\n  <kendo-floatingactionbutton icon=\"plus\"\r\n                              [themeColor]=\"buttonColor\"\r\n                              [positionMode]=\"positionMode\"\r\n                              [align]=\"bottomEnd\"\r\n                              [dialItems]=\"items\"\r\n                              (blur)=\"onBlur()\"\r\n                              (focus)=\"onFocus()\"\r\n                              (open)=\"onOpen($event)\"\r\n                              (close)=\"onClose($event)\"\r\n                              (dialItemClick)=\"onDialItemClick($event)\">\r\n    <ng-template kendoDialItemTemplate let-item let-isFocused=\"isFocused\">\r\n      <span class=\"k-fab-item-text\">\r\n        <span>{{ item.label }}</span>\r\n      </span>\r\n      <kendo-avatar shape=\"circle\" [themeColor]=\"buttonColor\">\r\n        <span class=\"k-icon k-i-{{ item.icon }}\"></span>\r\n      </kendo-avatar> \r\n    </ng-template>\r\n  </kendo-floatingactionbutton>\r\n</div>\r\n", styles: [".button-item{padding:8px 10px;width:100%;display:flex;align-items:center;background-color:#fff}.button-details{margin-left:8px;display:flex;flex-direction:column;align-items:flex-start}.custom-focused-class{box-shadow:inset 0 0 8px #0003}.zmfb-wrap{display:flex;justify-content:center;margin-top:60px}@media only screen and (max-device-width: 768px){.k-bottom-end,.k-pos-bottom-end{padding-bottom:16vh}}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.FieldService }, { type: i1.ResourceApiService }, { type: i1.WorkflowService }]; }, propDecorators: { data: [{

package/esm2020/lib/zmodal/zmodal-mobile.component.mjs

@@ -109,9 +109,9 @@ export class ZmodalMobileComponent {
         return this.zcoreService.isDebugSession();
     }
 }
-ZmodalMobileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZmodalMobileComponent, deps: [{ token: i1.WebApiService }, { token: i1.ZCoreService }, { token: i1.FieldService }], target: i0.ɵɵFactoryTarget.Component });
-ZmodalMobileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZmodalMobileComponent, selector: "app-zmodal", inputs: { modalParams: "modalParams" }, ngImport: i0, template: "<ion-header *ngIf=\"isMobileScreen()\">\r\n  <ion-toolbar>\r\n    <ion-buttons slot=\"start\">\r\n      <ion-button (click)=\"onCancel()\">\r\n        <!-- <ion-icon name=\"close\"></ion-icon> -->\r\n        <fa-icon [icon]=\"'times'\" size=\"lg\"></fa-icon>\r\n      </ion-button>\r\n    </ion-buttons>\r\n    <ion-title>\r\n      {{ modalParams.formHeader }}\r\n    </ion-title>\r\n    <ion-buttons slot=\"primary\" *ngIf=\"!group.isLoading\">\r\n      <app-uiactionbutton [group]=\"group\"></app-uiactionbutton>\r\n    </ion-buttons>\r\n  </ion-toolbar>\r\n</ion-header>\r\n\r\n<ion-content appScrollbarTheme [ngStyle]=\"getGridStyle()\">\r\n  <ion-grid>\r\n    <ion-row *ngIf=\"group.isLoading\" class=\"ion-text-center\">\r\n      <ion-col class=\"ion-margin ion-padding\">\r\n        <ion-spinner></ion-spinner>\r\n      </ion-col>\r\n    </ion-row>\r\n    <ion-row *ngIf=\"!group.isLoading\">\r\n      <ion-col>\r\n        <app-zform [group]=\"group\"></app-zform>\r\n      </ion-col>\r\n    </ion-row>\r\n    <ion-row *ngIf=\"isSITEnvironment() && !group.isLoading\">\r\n      <ion-col>\r\n        <pre style=\"font-size: x-small;\">{{group.zModel | json}}</pre>\r\n      </ion-col>\r\n    </ion-row>\r\n  </ion-grid>\r\n</ion-content>\r\n\r\n", styles: [""], components: [{ type: i2.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { type: i2.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { type: i2.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { type: i2.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { type: i3.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i2.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { type: i4.UiactionbuttonComponent, selector: "app-uiactionbutton", inputs: ["group"] }, { type: i2.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { type: i2.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { type: i2.IonRow, selector: "ion-row" }, { type: i2.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { type: i2.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { type: i5.ZformComponent, selector: "app-zform", inputs: ["group", "fieldName"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.ScrollbarThemeDirective, selector: "[appScrollbarTheme]" }, { type: i6.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "json": i6.JsonPipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZmodalMobileComponent, decorators: [{
+ZmodalMobileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZmodalMobileComponent, deps: [{ token: i1.WebApiService }, { token: i1.ZCoreService }, { token: i1.FieldService }], target: i0.ɵɵFactoryTarget.Component });
+ZmodalMobileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZmodalMobileComponent, selector: "app-zmodal", inputs: { modalParams: "modalParams" }, ngImport: i0, template: "<ion-header *ngIf=\"isMobileScreen()\">\r\n  <ion-toolbar>\r\n    <ion-buttons slot=\"start\">\r\n      <ion-button (click)=\"onCancel()\">\r\n        <!-- <ion-icon name=\"close\"></ion-icon> -->\r\n        <fa-icon [icon]=\"'times'\" size=\"lg\"></fa-icon>\r\n      </ion-button>\r\n    </ion-buttons>\r\n    <ion-title>\r\n      {{ modalParams.formHeader }}\r\n    </ion-title>\r\n    <ion-buttons slot=\"primary\" *ngIf=\"!group.isLoading\">\r\n      <app-uiactionbutton [group]=\"group\"></app-uiactionbutton>\r\n    </ion-buttons>\r\n  </ion-toolbar>\r\n</ion-header>\r\n\r\n<ion-content appScrollbarTheme [ngStyle]=\"getGridStyle()\">\r\n  <ion-grid>\r\n    <ion-row *ngIf=\"group.isLoading\" class=\"ion-text-center\">\r\n      <ion-col class=\"ion-margin ion-padding\">\r\n        <ion-spinner></ion-spinner>\r\n      </ion-col>\r\n    </ion-row>\r\n    <ion-row *ngIf=\"!group.isLoading\">\r\n      <ion-col>\r\n        <app-zform [group]=\"group\"></app-zform>\r\n      </ion-col>\r\n    </ion-row>\r\n    <ion-row *ngIf=\"isSITEnvironment() && !group.isLoading\">\r\n      <ion-col>\r\n        <pre style=\"font-size: x-small;\">{{group.zModel | json}}</pre>\r\n      </ion-col>\r\n    </ion-row>\r\n  </ion-grid>\r\n</ion-content>\r\n\r\n", styles: [""], components: [{ type: i2.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { type: i2.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { type: i2.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { type: i2.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { type: i3.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i2.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { type: i4.UiactionbuttonComponent, selector: "app-uiactionbutton", inputs: ["group"] }, { type: i2.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { type: i2.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { type: i2.IonRow, selector: "ion-row" }, { type: i2.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { type: i2.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { type: i5.ZformComponent, selector: "app-zform", inputs: ["group", "fieldName"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.ScrollbarThemeDirective, selector: "[appScrollbarTheme]" }, { type: i6.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "json": i6.JsonPipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZmodalMobileComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-zmodal", template: "<ion-header *ngIf=\"isMobileScreen()\">\r\n  <ion-toolbar>\r\n    <ion-buttons slot=\"start\">\r\n      <ion-button (click)=\"onCancel()\">\r\n        <!-- <ion-icon name=\"close\"></ion-icon> -->\r\n        <fa-icon [icon]=\"'times'\" size=\"lg\"></fa-icon>\r\n      </ion-button>\r\n    </ion-buttons>\r\n    <ion-title>\r\n      {{ modalParams.formHeader }}\r\n    </ion-title>\r\n    <ion-buttons slot=\"primary\" *ngIf=\"!group.isLoading\">\r\n      <app-uiactionbutton [group]=\"group\"></app-uiactionbutton>\r\n    </ion-buttons>\r\n  </ion-toolbar>\r\n</ion-header>\r\n\r\n<ion-content appScrollbarTheme [ngStyle]=\"getGridStyle()\">\r\n  <ion-grid>\r\n    <ion-row *ngIf=\"group.isLoading\" class=\"ion-text-center\">\r\n      <ion-col class=\"ion-margin ion-padding\">\r\n        <ion-spinner></ion-spinner>\r\n      </ion-col>\r\n    </ion-row>\r\n    <ion-row *ngIf=\"!group.isLoading\">\r\n      <ion-col>\r\n        <app-zform [group]=\"group\"></app-zform>\r\n      </ion-col>\r\n    </ion-row>\r\n    <ion-row *ngIf=\"isSITEnvironment() && !group.isLoading\">\r\n      <ion-col>\r\n        <pre style=\"font-size: x-small;\">{{group.zModel | json}}</pre>\r\n      </ion-col>\r\n    </ion-row>\r\n  </ion-grid>\r\n</ion-content>\r\n\r\n", styles: [""] }]
         }], ctorParameters: function () { return [{ type: i1.WebApiService }, { type: i1.ZCoreService }, { type: i1.FieldService }]; }, propDecorators: { modalParams: [{

package/esm2020/lib/zmodal/zmodal.component.mjs

@@ -114,9 +114,9 @@ export class ZmodalComponent extends DialogContentBase {
         return v;
     }
 }
-ZmodalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZmodalComponent, deps: [{ token: i1.DialogRef }, { token: i2.ModalController }, { token: i3.ZCoreService }, { token: i3.WebApiService }, { token: i3.ResourceApiService }, { token: i3.FieldService }, { token: i2.Platform }, { token: i3.AlertService }], target: i0.ɵɵFactoryTarget.Component });
-ZmodalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZmodalComponent, selector: "app-zmodal", inputs: { modalParams: "modalParams" }, usesInheritance: true, ngImport: i0, template: "<ion-header *ngIf=\"isMobileScreen()\">\r\n  <ion-toolbar>\r\n    <ion-buttons slot=\"start\">\r\n      <ion-button (click)=\"onCancel()\">\r\n        <!-- <ion-icon name=\"close\"></ion-icon> -->\r\n        <fa-icon [icon]=\"'times'\" size=\"lg\"></fa-icon>\r\n      </ion-button>\r\n    </ion-buttons>\r\n    <ion-title>\r\n      {{ modalParams.formHeader }}\r\n    </ion-title>\r\n    <ion-buttons slot=\"primary\" *ngIf=\"!group.isLoading\">\r\n      <app-uiactionbutton [group]=\"group\"></app-uiactionbutton>\r\n    </ion-buttons>\r\n  </ion-toolbar>\r\n</ion-header>\r\n\r\n<ion-content appScrollbarTheme [ngStyle]=\"getGridStyle()\">\r\n  <ion-grid>\r\n    <ion-row *ngIf=\"group.isLoading\" class=\"ion-text-center\">\r\n      <ion-col class=\"ion-margin ion-padding\">\r\n        <ion-spinner></ion-spinner>\r\n      </ion-col>\r\n    </ion-row>\r\n    <ion-row *ngIf=\"!group.isLoading\">\r\n      <ion-col>\r\n        <app-zform [group]=\"group\"></app-zform>\r\n      </ion-col>\r\n    </ion-row>\r\n    <ion-row *ngIf=\"isSITEnvironment() && !group.isLoading\">\r\n      <ion-col>\r\n        <pre style=\"font-size: x-small;\">{{group.zModel | json}}</pre>\r\n      </ion-col>\r\n    </ion-row>\r\n  </ion-grid>\r\n</ion-content>\r\n\r\n", styles: [""], components: [{ type: i2.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { type: i2.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { type: i2.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { type: i2.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { type: i4.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i2.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { type: i5.UiactionbuttonComponent, selector: "app-uiactionbutton", inputs: ["group"] }, { type: i2.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { type: i2.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { type: i2.IonRow, selector: "ion-row" }, { type: i2.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { type: i2.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { type: i6.ZformComponent, selector: "app-zform", inputs: ["group", "fieldName"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i8.ScrollbarThemeDirective, selector: "[appScrollbarTheme]" }, { type: i7.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "json": i7.JsonPipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZmodalComponent, decorators: [{
+ZmodalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZmodalComponent, deps: [{ token: i1.DialogRef }, { token: i2.ModalController }, { token: i3.ZCoreService }, { token: i3.WebApiService }, { token: i3.ResourceApiService }, { token: i3.FieldService }, { token: i2.Platform }, { token: i3.AlertService }], target: i0.ɵɵFactoryTarget.Component });
+ZmodalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZmodalComponent, selector: "app-zmodal", inputs: { modalParams: "modalParams" }, usesInheritance: true, ngImport: i0, template: "<ion-header *ngIf=\"isMobileScreen()\">\r\n  <ion-toolbar>\r\n    <ion-buttons slot=\"start\">\r\n      <ion-button (click)=\"onCancel()\">\r\n        <!-- <ion-icon name=\"close\"></ion-icon> -->\r\n        <fa-icon [icon]=\"'times'\" size=\"lg\"></fa-icon>\r\n      </ion-button>\r\n    </ion-buttons>\r\n    <ion-title>\r\n      {{ modalParams.formHeader }}\r\n    </ion-title>\r\n    <ion-buttons slot=\"primary\" *ngIf=\"!group.isLoading\">\r\n      <app-uiactionbutton [group]=\"group\"></app-uiactionbutton>\r\n    </ion-buttons>\r\n  </ion-toolbar>\r\n</ion-header>\r\n\r\n<ion-content appScrollbarTheme [ngStyle]=\"getGridStyle()\">\r\n  <ion-grid>\r\n    <ion-row *ngIf=\"group.isLoading\" class=\"ion-text-center\">\r\n      <ion-col class=\"ion-margin ion-padding\">\r\n        <ion-spinner></ion-spinner>\r\n      </ion-col>\r\n    </ion-row>\r\n    <ion-row *ngIf=\"!group.isLoading\">\r\n      <ion-col>\r\n        <app-zform [group]=\"group\"></app-zform>\r\n      </ion-col>\r\n    </ion-row>\r\n    <ion-row *ngIf=\"isSITEnvironment() && !group.isLoading\">\r\n      <ion-col>\r\n        <pre style=\"font-size: x-small;\">{{group.zModel | json}}</pre>\r\n      </ion-col>\r\n    </ion-row>\r\n  </ion-grid>\r\n</ion-content>\r\n\r\n", styles: [""], components: [{ type: i2.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { type: i2.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { type: i2.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { type: i2.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { type: i4.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i2.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { type: i5.UiactionbuttonComponent, selector: "app-uiactionbutton", inputs: ["group"] }, { type: i2.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { type: i2.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { type: i2.IonRow, selector: "ion-row" }, { type: i2.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { type: i2.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { type: i6.ZformComponent, selector: "app-zform", inputs: ["group", "fieldName"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i8.ScrollbarThemeDirective, selector: "[appScrollbarTheme]" }, { type: i7.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "json": i7.JsonPipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZmodalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-zmodal', template: "<ion-header *ngIf=\"isMobileScreen()\">\r\n  <ion-toolbar>\r\n    <ion-buttons slot=\"start\">\r\n      <ion-button (click)=\"onCancel()\">\r\n        <!-- <ion-icon name=\"close\"></ion-icon> -->\r\n        <fa-icon [icon]=\"'times'\" size=\"lg\"></fa-icon>\r\n      </ion-button>\r\n    </ion-buttons>\r\n    <ion-title>\r\n      {{ modalParams.formHeader }}\r\n    </ion-title>\r\n    <ion-buttons slot=\"primary\" *ngIf=\"!group.isLoading\">\r\n      <app-uiactionbutton [group]=\"group\"></app-uiactionbutton>\r\n    </ion-buttons>\r\n  </ion-toolbar>\r\n</ion-header>\r\n\r\n<ion-content appScrollbarTheme [ngStyle]=\"getGridStyle()\">\r\n  <ion-grid>\r\n    <ion-row *ngIf=\"group.isLoading\" class=\"ion-text-center\">\r\n      <ion-col class=\"ion-margin ion-padding\">\r\n        <ion-spinner></ion-spinner>\r\n      </ion-col>\r\n    </ion-row>\r\n    <ion-row *ngIf=\"!group.isLoading\">\r\n      <ion-col>\r\n        <app-zform [group]=\"group\"></app-zform>\r\n      </ion-col>\r\n    </ion-row>\r\n    <ion-row *ngIf=\"isSITEnvironment() && !group.isLoading\">\r\n      <ion-col>\r\n        <pre style=\"font-size: x-small;\">{{group.zModel | json}}</pre>\r\n      </ion-col>\r\n    </ion-row>\r\n  </ion-grid>\r\n</ion-content>\r\n\r\n", styles: [""] }]
         }], ctorParameters: function () { return [{ type: i1.DialogRef }, { type: i2.ModalController }, { type: i3.ZCoreService }, { type: i3.WebApiService }, { type: i3.ResourceApiService }, { type: i3.FieldService }, { type: i2.Platform }, { type: i3.AlertService }]; }, propDecorators: { modalParams: [{

package/esm2020/lib/znumeric/znumeric.component.mjs

@@ -104,9 +104,9 @@ export class ZnumericComponent {
         }
     }
 }
-ZnumericComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZnumericComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ZnumericComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZnumericComponent, selector: "app-znumeric", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<ion-item [formGroup]=\"form\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\" [ngClass]=\"getIon_InvalidClass(form, data)\">\r\n  <ion-label [attr.for]=\"data.Value\" *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\" [position]=\"data.LabelPosition ? data.LabelPosition : '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      <ion-input *ngIf=\"isMobileScreen()\"\r\n                 #znumericField\r\n                 [id]=\"data.Value\"\r\n                 type=\"number\"\r\n                 [autocorrect]=\"autocorrectHandler()\"\r\n                 [min]=\"data.MinValue\"\r\n                 [max]=\"data.MaxValue\"\r\n                 [step]=\"data.StepValue\"\r\n                 [value]=\"valueHandler()\"\r\n                 [inputmode]=\"inputmodeHandler()\"\r\n                 [formControlName]=\"data.Value\"\r\n                 [attr.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                 [placeholder]=\"data.PlaceHolder\"\r\n                 [ngStyle]=\"{'text-align': getStyle(data.RightAlign ? true : false)}\">\r\n      </ion-input>\r\n      <!-- (ionChange)=\"onChange($event)\"\r\n         (keyup)=\"handleMobileKeyUp($event)\"\r\n         (ionInput)=\"handleMobileInput($event)\"-->\r\n      <kendo-numerictextbox *ngIf=\"!isMobileScreen()\"\r\n                            [spinners]=\"data.ShowSpinners\"\r\n                            [autoCorrect]=\"data.AutoCorrect\"\r\n                            [min]=\"data.MinValue\"\r\n                            [max]=\"data.MaxValue\"\r\n                            [step]=\"data.StepValue\"\r\n                            [format]=\"data.FormatOptions\"\r\n                            [id]=\"data.Value\"\r\n                            [placeholder]=\"data.PlaceHolder\"\r\n                            [value]=\"valueHandler()\"\r\n                            [disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                            (valueChange)=\"onChange($event)\"\r\n                            [ngStyle]=\"getKendoStyle()\">\r\n      </kendo-numerictextbox>\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-numerictextbox{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.IonInput, selector: "ion-input", inputs: ["accept", "autocapitalize", "autocomplete", "autocorrect", "autofocus", "clearInput", "clearOnEdit", "color", "debounce", "disabled", "enterkeyhint", "inputmode", "max", "maxlength", "min", "minlength", "mode", "multiple", "name", "pattern", "placeholder", "readonly", "required", "size", "spellcheck", "step", "type", "value"] }, { type: i2.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "decimals", "step", "spinners", "rangeValidation", "tabindex", "changeValueOnScroll", "selectOnFocus", "value", "format", "tabIndex", "size", "rounded", "fillMode", "max", "min", "placeholder", "maxlength"], outputs: ["valueChange", "focus", "blur"], exportAs: ["kendoNumericTextBox"] }, { 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: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NumericValueAccessor, selector: "ion-input[type=number]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZnumericComponent, decorators: [{
+ZnumericComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZnumericComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ZnumericComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZnumericComponent, selector: "app-znumeric", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<ion-item [formGroup]=\"form\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\" [ngClass]=\"getIon_InvalidClass(form, data)\">\r\n  <ion-label [attr.for]=\"data.Value\" *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\" [position]=\"data.LabelPosition ? data.LabelPosition : '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      <ion-input *ngIf=\"isMobileScreen()\"\r\n                 #znumericField\r\n                 [id]=\"data.Value\"\r\n                 type=\"number\"\r\n                 [autocorrect]=\"autocorrectHandler()\"\r\n                 [min]=\"data.MinValue\"\r\n                 [max]=\"data.MaxValue\"\r\n                 [step]=\"data.StepValue\"\r\n                 [value]=\"valueHandler()\"\r\n                 [inputmode]=\"inputmodeHandler()\"\r\n                 [formControlName]=\"data.Value\"\r\n                 [attr.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                 [placeholder]=\"data.PlaceHolder\"\r\n                 [ngStyle]=\"{'text-align': getStyle(data.RightAlign ? true : false)}\">\r\n      </ion-input>\r\n      <!-- (ionChange)=\"onChange($event)\"\r\n         (keyup)=\"handleMobileKeyUp($event)\"\r\n         (ionInput)=\"handleMobileInput($event)\"-->\r\n      <kendo-numerictextbox *ngIf=\"!isMobileScreen()\"\r\n                            [spinners]=\"data.ShowSpinners\"\r\n                            [autoCorrect]=\"data.AutoCorrect\"\r\n                            [min]=\"data.MinValue\"\r\n                            [max]=\"data.MaxValue\"\r\n                            [step]=\"data.StepValue\"\r\n                            [format]=\"data.FormatOptions\"\r\n                            [id]=\"data.Value\"\r\n                            [placeholder]=\"data.PlaceHolder\"\r\n                            [value]=\"valueHandler()\"\r\n                            [disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                            (valueChange)=\"onChange($event)\"\r\n                            [ngStyle]=\"getKendoStyle()\">\r\n      </kendo-numerictextbox>\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-numerictextbox{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.IonInput, selector: "ion-input", inputs: ["accept", "autocapitalize", "autocomplete", "autocorrect", "autofocus", "clearInput", "clearOnEdit", "color", "debounce", "disabled", "enterkeyhint", "inputmode", "max", "maxlength", "min", "minlength", "mode", "multiple", "name", "pattern", "placeholder", "readonly", "required", "size", "spellcheck", "step", "type", "value"] }, { type: i2.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "decimals", "step", "spinners", "rangeValidation", "tabindex", "changeValueOnScroll", "selectOnFocus", "value", "format", "tabIndex", "size", "rounded", "fillMode", "max", "min", "placeholder", "maxlength"], outputs: ["valueChange", "focus", "blur"], exportAs: ["kendoNumericTextBox"] }, { 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: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NumericValueAccessor, selector: "ion-input[type=number]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZnumericComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-znumeric', template: "<ion-item [formGroup]=\"form\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\" [ngClass]=\"getIon_InvalidClass(form, data)\">\r\n  <ion-label [attr.for]=\"data.Value\" *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\" [position]=\"data.LabelPosition ? data.LabelPosition : '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      <ion-input *ngIf=\"isMobileScreen()\"\r\n                 #znumericField\r\n                 [id]=\"data.Value\"\r\n                 type=\"number\"\r\n                 [autocorrect]=\"autocorrectHandler()\"\r\n                 [min]=\"data.MinValue\"\r\n                 [max]=\"data.MaxValue\"\r\n                 [step]=\"data.StepValue\"\r\n                 [value]=\"valueHandler()\"\r\n                 [inputmode]=\"inputmodeHandler()\"\r\n                 [formControlName]=\"data.Value\"\r\n                 [attr.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                 [placeholder]=\"data.PlaceHolder\"\r\n                 [ngStyle]=\"{'text-align': getStyle(data.RightAlign ? true : false)}\">\r\n      </ion-input>\r\n      <!-- (ionChange)=\"onChange($event)\"\r\n         (keyup)=\"handleMobileKeyUp($event)\"\r\n         (ionInput)=\"handleMobileInput($event)\"-->\r\n      <kendo-numerictextbox *ngIf=\"!isMobileScreen()\"\r\n                            [spinners]=\"data.ShowSpinners\"\r\n                            [autoCorrect]=\"data.AutoCorrect\"\r\n                            [min]=\"data.MinValue\"\r\n                            [max]=\"data.MaxValue\"\r\n                            [step]=\"data.StepValue\"\r\n                            [format]=\"data.FormatOptions\"\r\n                            [id]=\"data.Value\"\r\n                            [placeholder]=\"data.PlaceHolder\"\r\n                            [value]=\"valueHandler()\"\r\n                            [disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n                            (valueChange)=\"onChange($event)\"\r\n                            [ngStyle]=\"getKendoStyle()\">\r\n      </kendo-numerictextbox>\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-numerictextbox{color:var(--z-text-color)}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { data: [{

package/esm2020/lib/zpostselectinput/zpostselectinput.component.mjs

@@ -334,9 +334,9 @@ export class ZpostselectinputComponent {
         return;
     }
 }
-ZpostselectinputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZpostselectinputComponent, deps: [{ token: i1.ResourceApiService }, { token: i1.WebApiService }, { token: i1.CacheService }], target: i0.ɵɵFactoryTarget.Component });
-ZpostselectinputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: ZpostselectinputComponent, selector: "app-zpostselectinput", inputs: { data: "data", group: "group", form: "form" }, viewQueries: [{ propertyName: "selectComponent", first: true, predicate: ["selectComponent"], descendants: true, static: true }], ngImport: i0, template: "<ion-item [ngClass]=\"getIon_InvalidClass(form, data)\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible) && isMobileScreen()\">\r\n  <ion-label *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\" position=\"stacked\">\r\n    {{data.Label}}\r\n    <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%\" *ngIf=\"!isLoading\">\r\n    <span style=\"flex-basis: 35%;\">\r\n      <ionic-selectable #selectComponent item-content\r\n        [id]=\"data.CCValue\" headerColor=\"primary\" clearButtonText=\"Clear\"\r\n        [canClear]=\"true\" searchFailText=\"Nothing found :(\" [canSearch]=\"!data['disable-search']\" \r\n        [placeholder]=\"data.CCPlaceHolder\"  [(ngModel)]=\"group.zModel[data.CCValue]\" \r\n        [shouldFocusSearchbar]=\"!data['disable-search']\" [hasInfiniteScroll]=\"!!data.HasInfiniteScroll\"\r\n        (onSearch)=\"onSearch($event)\" (onInfiniteScroll)=\"getInfiniteData($event)\" [isMultiple]=\"data.Multiple\"\r\n        [isEnabled]=\"!(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\" [items]=\"getItemsData()\"\r\n        [itemValueField]=\"itemValueField\" [itemTextField]=\"itemTextField\" [shouldStoreItemValue]=\"true\"\r\n        [canAddItem]=\"!!data.OnAddItem\" (onAddItem)=\"onAddItem($event)\"\r\n        (onChange)=\"onChange($event)\">\r\n\r\n        <ng-template ionicSelectableItemIconTemplate let-item=\"item\" let-isItemSelected=\"isItemSelected\">\r\n          <fa-icon slot=\"start\" class=\"isItemSelected\" [icon]=\"['far', isItemSelected ? 'check-circle': 'circle']\" size=\"sm\" [styles]=\"{'color': isItemSelected ? 'dodgerBlue' : 'lightGray'}\"></fa-icon>\r\n        </ng-template>\r\n\r\n        <ng-template ionicSelectableCloseButtonTemplate>\r\n          <!-- <ion-icon name=\"close-circle\"></ion-icon> -->\r\n          <fa-icon  [icon]=\"'times-circle'\" size=\"md\"></fa-icon>\r\n        </ng-template>\r\n\r\n        <ng-template ionicSelectableTitleTemplate>\r\n          {{data.Label}}\r\n          <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\" color=\"danger\">*</ion-text>\r\n        </ng-template>\r\n\r\n        <ng-template ionicSelectableItemTemplate let-item=\"item\">\r\n          {{ getItemTemplate(item, data, group, itemValueField, itemTextField) }}\r\n          <!-- <ng-template zselectitemelement [item]=\"item\"></ng-template> -->\r\n        </ng-template>\r\n      </ionic-selectable>\r\n    </span>\r\n    <span style=\"flex-basis: 60%; margin-left: 5px;\" [formGroup]=\"form\">\r\n      <ion-input [id]=\"data.Value\" [placeholder]=\"data.PlaceHolder\" [type]=\"'text'\" [formControlName]=\"data.Value\"\r\n        [readonly]=\"data.ReadOnly\" [inputmode]=\"'text'\"></ion-input>\r\n    </span>\r\n    <app-uivalidationmessage style=\"flex-basis: 5%;\" [group]=\"group\" [data]=\"data\" [form]=\"form\"></app-uivalidationmessage>\r\n  </div>\r\n</ion-item>\r\n\r\n\r\n<ion-item [formGroup]=\"form\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible) && !isMobileScreen()\" [ngClass]=\"getIon_InvalidClass(form, data)\">\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-basis: 35%;\">\r\n        <kendo-combobox [id]=\"data.CCValue\"\r\n          [data]=\"getItemsData()\" [valueField]=\"itemValueField\" [textField]=\"itemTextField\"\r\n          [formControlName]=\"data.CCValue\" [valuePrimitive]=\"true\"\r\n          [placeholder]=\"data.CCPlaceHolder\"\r\n          (valueChange)=\"onValueChange($event)\"\r\n          [filterable]=\"!!data.HasInfiniteScroll\"\r\n          [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n          (filterChange)=\"handleFilter($event)\"\r\n          (open)=\"handleOpen()\"\r\n          (close)=\"handleClose()\"\r\n          (blur)=\"handleBlur()\"\r\n          style=\"margin-top: 7px; width: 100%;\"\r\n          [loading]=\"isLoading\">\r\n        </kendo-combobox>\r\n      </span>\r\n      <span style=\"flex-basis: 60%; margin-left: 5px;\" [formGroup]=\"form\">\r\n        <input kendoTextBox [id]=\"data.Value\" [placeholder]=\"data.PlaceHolder\" type=\"text\"\r\n          [formControlName]=\"data.Value\" \r\n          style=\"margin: 7px 0 0 0; width: 100%\"\r\n        />\r\n      </span>\r\n      <app-uivalidationmessage style=\"flex-basis: 5%;\"\r\n        [group]=\"group\" [data]=\"data\" [form]=\"form\">\r\n      </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)}\n"], components: [{ type: i2.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { type: i2.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i2.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { type: i3.IonicSelectableComponent, selector: "ionic-selectable", inputs: ["items", "modalCssClass", "modalEnterAnimation", "modalLeaveAnimation", "isConfirmButtonEnabled", "itemValueField", "itemTextField", "groupValueField", "groupTextField", "canSearch", "hasInfiniteScroll", "hasVirtualScroll", "virtualScrollApproxItemHeight", "searchPlaceholder", "placeholder", "searchFailText", "clearButtonText", "addButtonText", "confirmButtonText", "closeButtonText", "shouldFocusSearchbar", "headerColor", "groupColor", "closeButtonSlot", "itemIconSlot", "searchDebounce", "disabledItems", "shouldStoreItemValue", "canSaveItem", "canDeleteItem", "virtualScrollHeaderFn", "isEnabled", "shouldBackdropClose", "hasConfirmButton", "isOnSearchEnabled", "canClear", "isMultiple", "canAddItem"], outputs: ["itemsChange", "onChange", "onSearch", "onSearchFail", "onSearchSuccess", "onInfiniteScroll", "onOpen", "onClose", "onSelect", "onClear", "onSaveItem", "onDeleteItem", "onAddItem"] }, { type: i4.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i2.IonInput, selector: "ion-input", inputs: ["accept", "autocapitalize", "autocomplete", "autocorrect", "autofocus", "clearInput", "clearOnEdit", "color", "debounce", "disabled", "enterkeyhint", "inputmode", "max", "maxlength", "min", "minlength", "mode", "multiple", "name", "pattern", "placeholder", "readonly", "required", "size", "spellcheck", "step", "type", "value"] }, { type: i5.UivalidationmessageComponent, selector: "app-uivalidationmessage", inputs: ["group", "data", "form"] }, { type: i6.ComboBoxComponent, selector: "kendo-combobox", inputs: ["focusableId", "allowCustom", "valueNormalizer", "placeholder", "listHeight", "suggest", "clearButton", "disabled", "readonly", "tabindex", "filterable", "data", "value", "valuePrimitive", "popupSettings", "itemDisabled", "tabIndex", "virtual", "size", "rounded", "fillMode", "loading", "textField", "valueField", "iconClass"], outputs: ["valueChange", "selectionChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoComboBox"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i3.IonicSelectableItemIconTemplateDirective, selector: "[ionicSelectableItemIconTemplate]" }, { type: i3.IonicSelectableCloseButtonTemplateDirective, selector: "[ionicSelectableCloseButtonTemplate]" }, { type: i3.IonicSelectableTitleTemplateDirective, selector: "[ionicSelectableTitleTemplate]" }, { type: i3.IonicSelectableItemTemplateDirective, selector: "[ionicSelectableItemTemplate]" }, { type: i8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i8.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2.TextValueAccessor, selector: "ion-input:not([type=number]),ion-textarea,ion-searchbar" }, { type: i8.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i9.TextBoxDirective, selector: "input[kendoTextBox]", inputs: ["value"] }, { type: i8.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: ZpostselectinputComponent, decorators: [{
+ZpostselectinputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZpostselectinputComponent, deps: [{ token: i1.ResourceApiService }, { token: i1.WebApiService }, { token: i1.CacheService }], target: i0.ɵɵFactoryTarget.Component });
+ZpostselectinputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.6", type: ZpostselectinputComponent, selector: "app-zpostselectinput", inputs: { data: "data", group: "group", form: "form" }, viewQueries: [{ propertyName: "selectComponent", first: true, predicate: ["selectComponent"], descendants: true, static: true }], ngImport: i0, template: "<ion-item [ngClass]=\"getIon_InvalidClass(form, data)\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible) && isMobileScreen()\">\r\n  <ion-label *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\" position=\"stacked\">\r\n    {{data.Label}}\r\n    <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%\" *ngIf=\"!isLoading\">\r\n    <span style=\"flex-basis: 35%;\">\r\n      <ionic-selectable #selectComponent item-content\r\n        [id]=\"data.CCValue\" headerColor=\"primary\" clearButtonText=\"Clear\"\r\n        [canClear]=\"true\" searchFailText=\"Nothing found :(\" [canSearch]=\"!data['disable-search']\" \r\n        [placeholder]=\"data.CCPlaceHolder\"  [(ngModel)]=\"group.zModel[data.CCValue]\" \r\n        [shouldFocusSearchbar]=\"!data['disable-search']\" [hasInfiniteScroll]=\"!!data.HasInfiniteScroll\"\r\n        (onSearch)=\"onSearch($event)\" (onInfiniteScroll)=\"getInfiniteData($event)\" [isMultiple]=\"data.Multiple\"\r\n        [isEnabled]=\"!(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\" [items]=\"getItemsData()\"\r\n        [itemValueField]=\"itemValueField\" [itemTextField]=\"itemTextField\" [shouldStoreItemValue]=\"true\"\r\n        [canAddItem]=\"!!data.OnAddItem\" (onAddItem)=\"onAddItem($event)\"\r\n        (onChange)=\"onChange($event)\">\r\n\r\n        <ng-template ionicSelectableItemIconTemplate let-item=\"item\" let-isItemSelected=\"isItemSelected\">\r\n          <fa-icon slot=\"start\" class=\"isItemSelected\" [icon]=\"['far', isItemSelected ? 'check-circle': 'circle']\" size=\"sm\" [styles]=\"{'color': isItemSelected ? 'dodgerBlue' : 'lightGray'}\"></fa-icon>\r\n        </ng-template>\r\n\r\n        <ng-template ionicSelectableCloseButtonTemplate>\r\n          <!-- <ion-icon name=\"close-circle\"></ion-icon> -->\r\n          <fa-icon  [icon]=\"'times-circle'\" size=\"md\"></fa-icon>\r\n        </ng-template>\r\n\r\n        <ng-template ionicSelectableTitleTemplate>\r\n          {{data.Label}}\r\n          <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\" color=\"danger\">*</ion-text>\r\n        </ng-template>\r\n\r\n        <ng-template ionicSelectableItemTemplate let-item=\"item\">\r\n          {{ getItemTemplate(item, data, group, itemValueField, itemTextField) }}\r\n          <!-- <ng-template zselectitemelement [item]=\"item\"></ng-template> -->\r\n        </ng-template>\r\n      </ionic-selectable>\r\n    </span>\r\n    <span style=\"flex-basis: 60%; margin-left: 5px;\" [formGroup]=\"form\">\r\n      <ion-input [id]=\"data.Value\" [placeholder]=\"data.PlaceHolder\" [type]=\"'text'\" [formControlName]=\"data.Value\"\r\n        [readonly]=\"data.ReadOnly\" [inputmode]=\"'text'\"></ion-input>\r\n    </span>\r\n    <app-uivalidationmessage style=\"flex-basis: 5%;\" [group]=\"group\" [data]=\"data\" [form]=\"form\"></app-uivalidationmessage>\r\n  </div>\r\n</ion-item>\r\n\r\n\r\n<ion-item [formGroup]=\"form\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible) && !isMobileScreen()\" [ngClass]=\"getIon_InvalidClass(form, data)\">\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-basis: 35%;\">\r\n        <kendo-combobox [id]=\"data.CCValue\"\r\n          [data]=\"getItemsData()\" [valueField]=\"itemValueField\" [textField]=\"itemTextField\"\r\n          [formControlName]=\"data.CCValue\" [valuePrimitive]=\"true\"\r\n          [placeholder]=\"data.CCPlaceHolder\"\r\n          (valueChange)=\"onValueChange($event)\"\r\n          [filterable]=\"!!data.HasInfiniteScroll\"\r\n          [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n          (filterChange)=\"handleFilter($event)\"\r\n          (open)=\"handleOpen()\"\r\n          (close)=\"handleClose()\"\r\n          (blur)=\"handleBlur()\"\r\n          style=\"margin-top: 7px; width: 100%;\"\r\n          [loading]=\"isLoading\">\r\n        </kendo-combobox>\r\n      </span>\r\n      <span style=\"flex-basis: 60%; margin-left: 5px;\" [formGroup]=\"form\">\r\n        <input kendoTextBox [id]=\"data.Value\" [placeholder]=\"data.PlaceHolder\" type=\"text\"\r\n          [formControlName]=\"data.Value\" \r\n          style=\"margin: 7px 0 0 0; width: 100%\"\r\n        />\r\n      </span>\r\n      <app-uivalidationmessage style=\"flex-basis: 5%;\"\r\n        [group]=\"group\" [data]=\"data\" [form]=\"form\">\r\n      </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)}\n"], components: [{ type: i2.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { type: i2.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i2.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { type: i3.IonicSelectableComponent, selector: "ionic-selectable", inputs: ["items", "modalCssClass", "modalEnterAnimation", "modalLeaveAnimation", "isConfirmButtonEnabled", "itemValueField", "itemTextField", "groupValueField", "groupTextField", "canSearch", "hasInfiniteScroll", "hasVirtualScroll", "virtualScrollApproxItemHeight", "searchPlaceholder", "placeholder", "searchFailText", "clearButtonText", "addButtonText", "confirmButtonText", "closeButtonText", "shouldFocusSearchbar", "headerColor", "groupColor", "closeButtonSlot", "itemIconSlot", "searchDebounce", "disabledItems", "shouldStoreItemValue", "canSaveItem", "canDeleteItem", "virtualScrollHeaderFn", "isEnabled", "shouldBackdropClose", "hasConfirmButton", "isOnSearchEnabled", "canClear", "isMultiple", "canAddItem"], outputs: ["itemsChange", "onChange", "onSearch", "onSearchFail", "onSearchSuccess", "onInfiniteScroll", "onOpen", "onClose", "onSelect", "onClear", "onSaveItem", "onDeleteItem", "onAddItem"] }, { type: i4.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i2.IonInput, selector: "ion-input", inputs: ["accept", "autocapitalize", "autocomplete", "autocorrect", "autofocus", "clearInput", "clearOnEdit", "color", "debounce", "disabled", "enterkeyhint", "inputmode", "max", "maxlength", "min", "minlength", "mode", "multiple", "name", "pattern", "placeholder", "readonly", "required", "size", "spellcheck", "step", "type", "value"] }, { type: i5.UivalidationmessageComponent, selector: "app-uivalidationmessage", inputs: ["group", "data", "form"] }, { type: i6.ComboBoxComponent, selector: "kendo-combobox", inputs: ["focusableId", "allowCustom", "valueNormalizer", "placeholder", "listHeight", "suggest", "clearButton", "disabled", "readonly", "tabindex", "filterable", "data", "value", "valuePrimitive", "popupSettings", "itemDisabled", "tabIndex", "virtual", "size", "rounded", "fillMode", "loading", "textField", "valueField", "iconClass"], outputs: ["valueChange", "selectionChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoComboBox"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i3.IonicSelectableItemIconTemplateDirective, selector: "[ionicSelectableItemIconTemplate]" }, { type: i3.IonicSelectableCloseButtonTemplateDirective, selector: "[ionicSelectableCloseButtonTemplate]" }, { type: i3.IonicSelectableTitleTemplateDirective, selector: "[ionicSelectableTitleTemplate]" }, { type: i3.IonicSelectableItemTemplateDirective, selector: "[ionicSelectableItemTemplate]" }, { type: i8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i8.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2.TextValueAccessor, selector: "ion-input:not([type=number]),ion-textarea,ion-searchbar" }, { type: i8.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i9.TextBoxDirective, selector: "input[kendoTextBox]", inputs: ["value"] }, { type: i8.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.6", ngImport: i0, type: ZpostselectinputComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-zpostselectinput", template: "<ion-item [ngClass]=\"getIon_InvalidClass(form, data)\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible) && isMobileScreen()\">\r\n  <ion-label *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\" position=\"stacked\">\r\n    {{data.Label}}\r\n    <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%\" *ngIf=\"!isLoading\">\r\n    <span style=\"flex-basis: 35%;\">\r\n      <ionic-selectable #selectComponent item-content\r\n        [id]=\"data.CCValue\" headerColor=\"primary\" clearButtonText=\"Clear\"\r\n        [canClear]=\"true\" searchFailText=\"Nothing found :(\" [canSearch]=\"!data['disable-search']\" \r\n        [placeholder]=\"data.CCPlaceHolder\"  [(ngModel)]=\"group.zModel[data.CCValue]\" \r\n        [shouldFocusSearchbar]=\"!data['disable-search']\" [hasInfiniteScroll]=\"!!data.HasInfiniteScroll\"\r\n        (onSearch)=\"onSearch($event)\" (onInfiniteScroll)=\"getInfiniteData($event)\" [isMultiple]=\"data.Multiple\"\r\n        [isEnabled]=\"!(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\" [items]=\"getItemsData()\"\r\n        [itemValueField]=\"itemValueField\" [itemTextField]=\"itemTextField\" [shouldStoreItemValue]=\"true\"\r\n        [canAddItem]=\"!!data.OnAddItem\" (onAddItem)=\"onAddItem($event)\"\r\n        (onChange)=\"onChange($event)\">\r\n\r\n        <ng-template ionicSelectableItemIconTemplate let-item=\"item\" let-isItemSelected=\"isItemSelected\">\r\n          <fa-icon slot=\"start\" class=\"isItemSelected\" [icon]=\"['far', isItemSelected ? 'check-circle': 'circle']\" size=\"sm\" [styles]=\"{'color': isItemSelected ? 'dodgerBlue' : 'lightGray'}\"></fa-icon>\r\n        </ng-template>\r\n\r\n        <ng-template ionicSelectableCloseButtonTemplate>\r\n          <!-- <ion-icon name=\"close-circle\"></ion-icon> -->\r\n          <fa-icon  [icon]=\"'times-circle'\" size=\"md\"></fa-icon>\r\n        </ng-template>\r\n\r\n        <ng-template ionicSelectableTitleTemplate>\r\n          {{data.Label}}\r\n          <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\" color=\"danger\">*</ion-text>\r\n        </ng-template>\r\n\r\n        <ng-template ionicSelectableItemTemplate let-item=\"item\">\r\n          {{ getItemTemplate(item, data, group, itemValueField, itemTextField) }}\r\n          <!-- <ng-template zselectitemelement [item]=\"item\"></ng-template> -->\r\n        </ng-template>\r\n      </ionic-selectable>\r\n    </span>\r\n    <span style=\"flex-basis: 60%; margin-left: 5px;\" [formGroup]=\"form\">\r\n      <ion-input [id]=\"data.Value\" [placeholder]=\"data.PlaceHolder\" [type]=\"'text'\" [formControlName]=\"data.Value\"\r\n        [readonly]=\"data.ReadOnly\" [inputmode]=\"'text'\"></ion-input>\r\n    </span>\r\n    <app-uivalidationmessage style=\"flex-basis: 5%;\" [group]=\"group\" [data]=\"data\" [form]=\"form\"></app-uivalidationmessage>\r\n  </div>\r\n</ion-item>\r\n\r\n\r\n<ion-item [formGroup]=\"form\" *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible) && !isMobileScreen()\" [ngClass]=\"getIon_InvalidClass(form, data)\">\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-basis: 35%;\">\r\n        <kendo-combobox [id]=\"data.CCValue\"\r\n          [data]=\"getItemsData()\" [valueField]=\"itemValueField\" [textField]=\"itemTextField\"\r\n          [formControlName]=\"data.CCValue\" [valuePrimitive]=\"true\"\r\n          [placeholder]=\"data.CCPlaceHolder\"\r\n          (valueChange)=\"onValueChange($event)\"\r\n          [filterable]=\"!!data.HasInfiniteScroll\"\r\n          [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n          (filterChange)=\"handleFilter($event)\"\r\n          (open)=\"handleOpen()\"\r\n          (close)=\"handleClose()\"\r\n          (blur)=\"handleBlur()\"\r\n          style=\"margin-top: 7px; width: 100%;\"\r\n          [loading]=\"isLoading\">\r\n        </kendo-combobox>\r\n      </span>\r\n      <span style=\"flex-basis: 60%; margin-left: 5px;\" [formGroup]=\"form\">\r\n        <input kendoTextBox [id]=\"data.Value\" [placeholder]=\"data.PlaceHolder\" type=\"text\"\r\n          [formControlName]=\"data.Value\" \r\n          style=\"margin: 7px 0 0 0; width: 100%\"\r\n        />\r\n      </span>\r\n      <app-uivalidationmessage style=\"flex-basis: 5%;\"\r\n        [group]=\"group\" [data]=\"data\" [form]=\"form\">\r\n      </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)}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.ResourceApiService }, { type: i1.WebApiService }, { type: i1.CacheService }]; }, propDecorators: { data: [{