@pepperi-addons/ngx-lib 0.4.0-angular14.2 → 0.4.0-angular14.3

package/esm2020/form/field-generator.component.mjs

@@ -116,9 +116,9 @@ export class PepFieldGeneratorComponent {
         // this.field.disabled = this.field.readonly = false;
     }
 }
-PepFieldGeneratorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepFieldGeneratorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-PepFieldGeneratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.1", type: PepFieldGeneratorComponent, selector: "pep-field-generator", inputs: { field: "field", isActive: "isActive", uid: "uid", form: "form", layoutType: "layoutType", showTitle: "showTitle", checkForChanges: "checkForChanges" }, outputs: { valueChange: "valueChange", formValidationChange: "formValidationChange", elementClick: "elementClick", internalFormFieldChange: "internalFormFieldChange", internalFormFieldClick: "internalFormFieldClick", formValueChange: "formValueChange", formFieldClick: "formFieldClick" }, usesOnChanges: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"field.controlType\" [formGroup]=\"form\">\n\n    <pep-address *ngSwitchCase=\"'address'\" [form]=\"form\" [key]=\"field.key\" [formattedValue]=\"field.formattedValue\"\n        [label]=\"field.label\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [groupFields]=\"field.groupFields\"\n        [layoutType]=\"layoutType\" [visible]=\"field.visible\" (addressValueChange)=\"onAddressValueChanged($event, field)\">\n    </pep-address>\n\n    <pep-attachment *ngSwitchCase=\"'attachment'\" [form]=\"form\" [key]=\"field.key\" [src]=\"field.value\"\n        [label]=\"field.label\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [isActive]=\"isActive\" [showTitle]=\"showTitle\"\n        [layoutType]=\"layoutType\" [visible]=\"field.visible\" (elementClick)=\"onClick($event)\"\n        (fileChange)=\"onFileChanged($event, field)\">\n    </pep-attachment>\n\n    <pep-checkbox *ngSwitchCase=\"'checkbox'\" [form]=\"form\" [key]=\"field.key\"\n        [value]=\"(field.value | lowercase) == 'true' || field.value == '1' ? true : false\" [label]=\"field.label\"\n        [type]=\"field.type\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [additionalValue]=\"field.additionalValue\"\n        [showTitle]=\"showTitle\" [layoutType]=\"layoutType\" [visible]=\"field.visible\"\n        (valueChange)=\"onValueChanged($event, field)\" [isActive]=\"isActive\">\n    </pep-checkbox>\n\n    <pep-date *ngSwitchCase=\"'date'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [type]=\"field.type\" [mandatory]=\"field.mandatory\"\n        [disabled]=\"field.disabled\" [readonly]=\"field.readonly\" [textColor]=\"field.textColor\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [minValue]=\"field.minValue\"\n        [maxValue]=\"field.maxValue\" [showTitle]=\"showTitle\" [layoutType]=\"layoutType\" [visible]=\"field.visible\"\n        (valueChange)=\"onValueChanged($event, field)\" [isActive]=\"isActive\">\n    </pep-date>\n\n    <pep-images-filmstrip *ngSwitchCase=\"'images'\" [uid]=\"uid\" [form]=\"form\" [key]=\"field.key\" [label]=\"field.label\"\n        [showTitle]=\"showTitle\" [rowSpan]=\"field.rowSpan\" [value]=\"field.value\" [layoutType]=\"layoutType\">\n    </pep-images-filmstrip>\n\n    <pep-image *ngSwitchCase=\"'image'\" [uid]=\"uid\" [form]=\"form\" [key]=\"field.key\" [src]=\"field.formattedValue\"\n        [srcLarge]=\"field.value\" [options]=\"field.options\" [label]=\"field.label\" [mandatory]=\"field.mandatory\"\n        [disabled]=\"field.disabled\" [readonly]=\"field.readonly\" [xAlignment]=\"field.xAlignment\"\n        [rowSpan]=\"field.rowSpan\" [indicatorsField]=\"field.indicatorsField\" [menuField]=\"field.menuField\"\n        [hasCampaignField]=\"field.hasCampaignField\" [sizeLimitMB]=\"field.sizeLimitMB\" [isActive]=\"isActive\"\n        [layoutType]=\"layoutType\" [visible]=\"field.visible\" (elementClick)=\"onClick($event)\"\n        (fileChange)=\"onFileChanged($event, field)\">\n    </pep-image>\n\n    <pep-quantity-selector *ngSwitchCase=\"'qs'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [type]=\"field.type\" [mandatory]=\"field.mandatory\"\n        [disabled]=\"field.disabled\" [readonly]=\"field.readonly\" [textColor]=\"field.textColor\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [allowDecimal]=\"field.allowDecimal\"\n        [additionalValue]=\"field.additionalValue\" [notificationInfo]=\"field.notificationInfo\" [isActive]=\"isActive\"\n        [layoutType]=\"layoutType\" [showTitle]=\"showTitle\" [visible]=\"field.visible\"\n        (valueChange)=\"onValueChanged($event, field)\" (formValidationChange)=\"onFormValidationChanged($event)\"\n        (elementClick)=\"onClick($event)\">\n    </pep-quantity-selector>\n\n    <pep-rich-html-textarea *ngSwitchCase=\"'richhtmltextarea'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [label]=\"field.label\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [maxFieldCharacters]=\"field.maxFieldCharacters\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n        [showTitle]=\"showTitle\" [layoutType]=\"layoutType\" [visible]=\"field.visible\"\n        (valueChange)=\"onValueChanged($event, field)\" [isActive]=\"isActive\">\n    </pep-rich-html-textarea>\n\n    <pep-select *ngSwitchCase=\"'select'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\" [label]=\"field.label\"\n        [type]=\"field.type\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [options]=\"field.options\" [showTitle]=\"showTitle\"\n        [layoutType]=\"layoutType\" [visible]=\"field.visible\" (valueChange)=\"onValueChanged($event, field)\"\n        (formValidationChange)=\"onFormValidationChanged($event)\" [isActive]=\"isActive\">\n    </pep-select>\n\n    <pep-separator *ngSwitchCase=\"'separator'\" [form]=\"form\" [key]=\"field.key\" [label]=\"field.label\"\n        [xAlignment]=\"field.xAlignment\" [layoutType]=\"layoutType\" [visible]=\"field.visible\">\n    </pep-separator>\n\n    <pep-signature *ngSwitchCase=\"'signature'\" [form]=\"form\" [key]=\"field.key\" [src]=\"field.value\" [label]=\"field.label\"\n        [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [isActive]=\"isActive\" [layoutType]=\"layoutType\"\n        [visible]=\"field.visible\" (fileChange)=\"onFileChanged($event, field)\">\n    </pep-signature>\n\n    <pep-textarea *ngSwitchCase=\"'textarea'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\" [label]=\"field.label\"\n        [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [maxFieldCharacters]=\"field.maxFieldCharacters\" [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\"\n        [rowSpan]=\"field.rowSpan\" [showTitle]=\"showTitle\" [layoutType]=\"layoutType\" [visible]=\"field.visible\"\n        (valueChange)=\"onValueChanged($event, field)\" [isActive]=\"isActive\">\n    </pep-textarea>\n\n    <pep-textbox *ngSwitchCase=\"'textbox'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [formattedValue]=\"field.formattedValue\" [accessory]=\"field.accessory\" [label]=\"field.label\" [placeholder]=\"field.placeholder\"\n        [type]=\"field.type\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [maxFieldCharacters]=\"field.maxFieldCharacters\" [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\"\n        [rowSpan]=\"field.rowSpan\" [showTitle]=\"showTitle\" [layoutType]=\"layoutType\"\n        (valueChange)=\"onValueChanged($event, field)\" (formValidationChange)=\"onFormValidationChanged($event)\"\n        [isActive]=\"isActive\" [visible]=\"field.visible\">\n    </pep-textbox>\n\n    <pep-link *ngSwitchCase=\"'link'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [placeholder]=\"field.placeholder\"\n        [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [maxFieldCharacters]=\"field.maxFieldCharacters\" [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\"\n        [rowSpan]=\"field.rowSpan\" [showTitle]=\"showTitle\" [layoutType]=\"layoutType\"\n        (valueChange)=\"onValueChanged($event, field)\" [isActive]=\"isActive\" [visible]=\"field.visible\"\n        (formValidationChange)=\"onFormValidationChanged($event)\" (elementClick)=\"onClick($event)\">\n    </pep-link>\n\n    <pep-indicators *ngSwitchCase=\"'indicators'\" [key]=\"field.key\" [value]=\"field.value\" [layoutType]=\"layoutType\">\n    </pep-indicators>\n    <pep-internal-button *ngSwitchCase=\"'button'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [formattedValue]=\"field.formattedValue\" [label]=\"field.label\"\n        [referenceObjectInternalType]=\"field.referenceObjectInternalType\" [type]=\"field.type\"\n        [disabled]=\"field.disabled\" [readonly]=\"field.readonly\" [xAlignment]=\"field.xAlignment\"\n        [layoutType]=\"layoutType\" [visible]=\"field.visible\" (elementClick)=\"onClick($event)\"\n        (valueChange)=\"onValueChanged($event, field)\">\n    </pep-internal-button>\n    <pep-internal-menu *ngSwitchCase=\"'menu'\" [key]=\"field.key\" [label]=\"field.label\" [disabled]=\"field.disabled\"\n        [xAlignment]=\"field.xAlignment\" [options]=\"field.options\" [layoutType]=\"layoutType\"\n        (elementClick)=\"onClick($event)\">\n    </pep-internal-menu>\n    <pep-internal-page *ngSwitchCase=\"'internalPage'\" [field]=\"field\" [layoutType]=\"layoutType\"\n        (internalFormFieldClick)=\"onInternalFormFieldClick($event)\"\n        (internalFormFieldChange)=\"onInternalFormFieldChanged($event)\">\n    </pep-internal-page>\n\n    <pep-internal-carusel *ngSwitchCase=\"'internalCarusel'\" [field]=\"field\"\n        (internalFormFieldClick)=\"onInternalFormFieldClick($event)\"\n        (internalFormFieldChange)=\"onInternalFormFieldChanged($event)\">\n    </pep-internal-carusel>\n\n    <ng-container *ngSwitchCase=\"'placeholder'\">\n    </ng-container>\n</ng-container>", styles: [":host{width:100%;height:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3.PepAddressComponent, selector: "pep-address", inputs: ["key", "formattedValue", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "groupFields", "form", "layoutType", "visible"], outputs: ["addressValueChange"] }, { kind: "component", type: i4.PepAttachmentComponent, selector: "pep-attachment", inputs: ["key", "src", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "visible", "form", "showTitle", "renderTitle", "layoutType", "isActive"], outputs: ["fileChange", "elementClick"] }, { kind: "component", type: i5.PepCheckboxComponent, selector: "pep-checkbox", inputs: ["key", "value", "label", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "additionalValue", "form", "isActive", "showTitle", "renderTitle", "layoutType", "visible"], outputs: ["valueChange"] }, { kind: "component", type: i6.PepDateComponent, selector: "pep-date", inputs: ["key", "value", "formattedValue", "label", "type", "mandatory", "disabled", "readonly", "textColor", "xAlignment", "rowSpan", "visible", "minValue", "maxValue", "minDateValue", "maxDateValue", "form", "isActive", "showTitle", "renderTitle", "renderError", "renderSymbol", "layoutType"], outputs: ["valueChange"] }, { kind: "component", type: i7.PepImageComponent, selector: "pep-image", inputs: ["key", "srcLarge", "src", "options", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "indicatorsField", "menuField", "hasCampaignField", "visible", "form", "uid", "showTitle", "renderTitle", "layoutType", "isActive", "sizeLimitMB", "acceptImagesType"], outputs: ["fileChange", "elementClick"] }, { kind: "component", type: i8.PepImagesFilmstripComponent, selector: "pep-images-filmstrip", inputs: ["key", "value", "label", "xAlignment", "rowSpan", "form", "uid", "showTitle", "renderTitle", "layoutType", "currIndex", "showThumbnails"] }, { kind: "component", type: i9.PepQuantitySelectorComponent, selector: "pep-quantity-selector", inputs: ["key", "value", "formattedValue", "label", "type", "mandatory", "disabled", "readonly", "textColor", "xAlignment", "rowSpan", "allowDecimal", "additionalValue", "notificationInfo", "visible", "form", "showTitle", "renderTitle", "layoutType", "isActive", "styleType"], outputs: ["valueChange", "elementClick"] }, { kind: "component", type: i10.PepRichHtmlTextareaComponent, selector: "pep-rich-html-textarea", inputs: ["key", "value", "label", "mandatory", "disabled", "readonly", "maxFieldCharacters", "xAlignment", "rowSpan", "visible", "form", "isActive", "showTitle", "renderTitle", "layoutType", "inlineMode", "toolbarOptions"], outputs: ["valueChange"] }, { kind: "component", type: i11.PepSelectComponent, selector: "pep-select", inputs: ["key", "value", "label", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "options", "visible", "form", "layoutType", "parentFieldKey", "isActive", "showTitle", "emptyOption", "renderTitle"], outputs: ["valueChange", "formValidationChange"] }, { kind: "component", type: i12.PepSeparatorComponent, selector: "pep-separator", inputs: ["key", "label", "xAlignment", "form", "layoutType", "visible"] }, { kind: "component", type: i13.PepSignatureComponent, selector: "pep-signature", inputs: ["key", "src", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "signatureURL", "visible", "form", "showTitle", "renderTitle", "layoutType", "isActive"], outputs: ["fileChange"] }, { kind: "component", type: i14.PepTextareaComponent, selector: "pep-textarea", inputs: ["key", "value", "label", "mandatory", "disabled", "readonly", "maxFieldCharacters", "textColor", "xAlignment", "rowSpan", "visible", "form", "isActive", "showTitle", "renderTitle", "layoutType"], outputs: ["valueChange"] }, { kind: "component", type: i15.PepTextboxComponent, selector: "pep-textbox", inputs: ["key", "value", "formattedValue", "accessory", "label", "placeholder", "type", "mandatory", "disabled", "readonly", "maxFieldCharacters", "hint", "textColor", "xAlignment", "rowSpan", "minValue", "maxValue", "visible", "form", "isActive", "showTitle", "renderTitle", "renderError", "renderSymbol", "layoutType", "parentFieldKey"], outputs: ["valueChange", "formValidationChange"] }, { kind: "component", type: i16.PepLinkComponent, selector: "pep-link", inputs: ["key", "value", "formattedValue", "label", "placeholder", "mandatory", "disabled", "readonly", "maxFieldCharacters", "textColor", "xAlignment", "rowSpan", "visible", "form", "isActive", "showTitle", "renderTitle", "renderError", "renderSymbol", "layoutType"], outputs: ["valueChange", "formValidationChange", "elementClick"] }, { kind: "component", type: i17.PepIndicatorsComponent, selector: "pep-indicators", inputs: ["key", "value", "layoutType"] }, { kind: "component", type: i18.PepInternalButtonComponent, selector: "pep-internal-button", inputs: ["key", "value", "formattedValue", "label", "referenceObjectInternalType", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "visible", "form", "showTitle", "layoutType"], outputs: ["elementClick", "valueChange"] }, { kind: "component", type: i19.PepInternalMenuComponent, selector: "pep-internal-menu", inputs: ["key", "label", "disabled", "xAlignment", "options", "invertClass", "layoutType"], outputs: ["elementClick"] }, { kind: "component", type: i20.PepInternalPageComponent, selector: "pep-internal-page", inputs: ["field", "layoutType"], outputs: ["internalFormFieldChange", "internalFormFieldClick"] }, { kind: "component", type: i21.PepInternalCaruselComponent, selector: "pep-internal-carusel", inputs: ["field", "layoutType"], outputs: ["internalFormFieldChange", "internalFormFieldClick"] }, { kind: "pipe", type: i1.LowerCasePipe, name: "lowercase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepFieldGeneratorComponent, decorators: [{
+PepFieldGeneratorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepFieldGeneratorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+PepFieldGeneratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PepFieldGeneratorComponent, selector: "pep-field-generator", inputs: { field: "field", isActive: "isActive", uid: "uid", form: "form", layoutType: "layoutType", showTitle: "showTitle", checkForChanges: "checkForChanges" }, outputs: { valueChange: "valueChange", formValidationChange: "formValidationChange", elementClick: "elementClick", internalFormFieldChange: "internalFormFieldChange", internalFormFieldClick: "internalFormFieldClick", formValueChange: "formValueChange", formFieldClick: "formFieldClick" }, usesOnChanges: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"field.controlType\" [formGroup]=\"form\">\n\n    <pep-address *ngSwitchCase=\"'address'\" [form]=\"form\" [key]=\"field.key\" [formattedValue]=\"field.formattedValue\"\n        [label]=\"field.label\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [groupFields]=\"field.groupFields\"\n        [layoutType]=\"layoutType\" [visible]=\"field.visible\" (addressValueChange)=\"onAddressValueChanged($event, field)\">\n    </pep-address>\n\n    <pep-attachment *ngSwitchCase=\"'attachment'\" [form]=\"form\" [key]=\"field.key\" [src]=\"field.value\"\n        [label]=\"field.label\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [isActive]=\"isActive\" [showTitle]=\"showTitle\"\n        [layoutType]=\"layoutType\" [visible]=\"field.visible\" (elementClick)=\"onClick($event)\"\n        (fileChange)=\"onFileChanged($event, field)\">\n    </pep-attachment>\n\n    <pep-checkbox *ngSwitchCase=\"'checkbox'\" [form]=\"form\" [key]=\"field.key\"\n        [value]=\"(field.value | lowercase) == 'true' || field.value == '1' ? true : false\" [label]=\"field.label\"\n        [type]=\"field.type\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [additionalValue]=\"field.additionalValue\"\n        [showTitle]=\"showTitle\" [layoutType]=\"layoutType\" [visible]=\"field.visible\"\n        (valueChange)=\"onValueChanged($event, field)\" [isActive]=\"isActive\">\n    </pep-checkbox>\n\n    <pep-date *ngSwitchCase=\"'date'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [type]=\"field.type\" [mandatory]=\"field.mandatory\"\n        [disabled]=\"field.disabled\" [readonly]=\"field.readonly\" [textColor]=\"field.textColor\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [minValue]=\"field.minValue\"\n        [maxValue]=\"field.maxValue\" [showTitle]=\"showTitle\" [layoutType]=\"layoutType\" [visible]=\"field.visible\"\n        (valueChange)=\"onValueChanged($event, field)\" [isActive]=\"isActive\">\n    </pep-date>\n\n    <pep-images-filmstrip *ngSwitchCase=\"'images'\" [uid]=\"uid\" [form]=\"form\" [key]=\"field.key\" [label]=\"field.label\"\n        [showTitle]=\"showTitle\" [rowSpan]=\"field.rowSpan\" [value]=\"field.value\" [layoutType]=\"layoutType\">\n    </pep-images-filmstrip>\n\n    <pep-image *ngSwitchCase=\"'image'\" [uid]=\"uid\" [form]=\"form\" [key]=\"field.key\" [src]=\"field.formattedValue\"\n        [srcLarge]=\"field.value\" [options]=\"field.options\" [label]=\"field.label\" [mandatory]=\"field.mandatory\"\n        [disabled]=\"field.disabled\" [readonly]=\"field.readonly\" [xAlignment]=\"field.xAlignment\"\n        [rowSpan]=\"field.rowSpan\" [indicatorsField]=\"field.indicatorsField\" [menuField]=\"field.menuField\"\n        [hasCampaignField]=\"field.hasCampaignField\" [sizeLimitMB]=\"field.sizeLimitMB\" [isActive]=\"isActive\"\n        [layoutType]=\"layoutType\" [visible]=\"field.visible\" (elementClick)=\"onClick($event)\"\n        (fileChange)=\"onFileChanged($event, field)\">\n    </pep-image>\n\n    <pep-quantity-selector *ngSwitchCase=\"'qs'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [type]=\"field.type\" [mandatory]=\"field.mandatory\"\n        [disabled]=\"field.disabled\" [readonly]=\"field.readonly\" [textColor]=\"field.textColor\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [allowDecimal]=\"field.allowDecimal\"\n        [additionalValue]=\"field.additionalValue\" [notificationInfo]=\"field.notificationInfo\" [isActive]=\"isActive\"\n        [layoutType]=\"layoutType\" [showTitle]=\"showTitle\" [visible]=\"field.visible\"\n        (valueChange)=\"onValueChanged($event, field)\" (formValidationChange)=\"onFormValidationChanged($event)\"\n        (elementClick)=\"onClick($event)\">\n    </pep-quantity-selector>\n\n    <pep-rich-html-textarea *ngSwitchCase=\"'richhtmltextarea'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [label]=\"field.label\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [maxFieldCharacters]=\"field.maxFieldCharacters\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n        [showTitle]=\"showTitle\" [layoutType]=\"layoutType\" [visible]=\"field.visible\"\n        (valueChange)=\"onValueChanged($event, field)\" [isActive]=\"isActive\">\n    </pep-rich-html-textarea>\n\n    <pep-select *ngSwitchCase=\"'select'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\" [label]=\"field.label\"\n        [type]=\"field.type\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [options]=\"field.options\" [showTitle]=\"showTitle\"\n        [layoutType]=\"layoutType\" [visible]=\"field.visible\" (valueChange)=\"onValueChanged($event, field)\"\n        (formValidationChange)=\"onFormValidationChanged($event)\" [isActive]=\"isActive\">\n    </pep-select>\n\n    <pep-separator *ngSwitchCase=\"'separator'\" [form]=\"form\" [key]=\"field.key\" [label]=\"field.label\"\n        [xAlignment]=\"field.xAlignment\" [layoutType]=\"layoutType\" [visible]=\"field.visible\">\n    </pep-separator>\n\n    <pep-signature *ngSwitchCase=\"'signature'\" [form]=\"form\" [key]=\"field.key\" [src]=\"field.value\" [label]=\"field.label\"\n        [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [isActive]=\"isActive\" [layoutType]=\"layoutType\"\n        [visible]=\"field.visible\" (fileChange)=\"onFileChanged($event, field)\">\n    </pep-signature>\n\n    <pep-textarea *ngSwitchCase=\"'textarea'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\" [label]=\"field.label\"\n        [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [maxFieldCharacters]=\"field.maxFieldCharacters\" [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\"\n        [rowSpan]=\"field.rowSpan\" [showTitle]=\"showTitle\" [layoutType]=\"layoutType\" [visible]=\"field.visible\"\n        (valueChange)=\"onValueChanged($event, field)\" [isActive]=\"isActive\">\n    </pep-textarea>\n\n    <pep-textbox *ngSwitchCase=\"'textbox'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [formattedValue]=\"field.formattedValue\" [accessory]=\"field.accessory\" [label]=\"field.label\" [placeholder]=\"field.placeholder\"\n        [type]=\"field.type\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [maxFieldCharacters]=\"field.maxFieldCharacters\" [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\"\n        [rowSpan]=\"field.rowSpan\" [showTitle]=\"showTitle\" [layoutType]=\"layoutType\"\n        (valueChange)=\"onValueChanged($event, field)\" (formValidationChange)=\"onFormValidationChanged($event)\"\n        [isActive]=\"isActive\" [visible]=\"field.visible\">\n    </pep-textbox>\n\n    <pep-link *ngSwitchCase=\"'link'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [placeholder]=\"field.placeholder\"\n        [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [maxFieldCharacters]=\"field.maxFieldCharacters\" [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\"\n        [rowSpan]=\"field.rowSpan\" [showTitle]=\"showTitle\" [layoutType]=\"layoutType\"\n        (valueChange)=\"onValueChanged($event, field)\" [isActive]=\"isActive\" [visible]=\"field.visible\"\n        (formValidationChange)=\"onFormValidationChanged($event)\" (elementClick)=\"onClick($event)\">\n    </pep-link>\n\n    <pep-indicators *ngSwitchCase=\"'indicators'\" [key]=\"field.key\" [value]=\"field.value\" [layoutType]=\"layoutType\">\n    </pep-indicators>\n    <pep-internal-button *ngSwitchCase=\"'button'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [formattedValue]=\"field.formattedValue\" [label]=\"field.label\"\n        [referenceObjectInternalType]=\"field.referenceObjectInternalType\" [type]=\"field.type\"\n        [disabled]=\"field.disabled\" [readonly]=\"field.readonly\" [xAlignment]=\"field.xAlignment\"\n        [layoutType]=\"layoutType\" [visible]=\"field.visible\" (elementClick)=\"onClick($event)\"\n        (valueChange)=\"onValueChanged($event, field)\">\n    </pep-internal-button>\n    <pep-internal-menu *ngSwitchCase=\"'menu'\" [key]=\"field.key\" [label]=\"field.label\" [disabled]=\"field.disabled\"\n        [xAlignment]=\"field.xAlignment\" [options]=\"field.options\" [layoutType]=\"layoutType\"\n        (elementClick)=\"onClick($event)\">\n    </pep-internal-menu>\n    <pep-internal-page *ngSwitchCase=\"'internalPage'\" [field]=\"field\" [layoutType]=\"layoutType\"\n        (internalFormFieldClick)=\"onInternalFormFieldClick($event)\"\n        (internalFormFieldChange)=\"onInternalFormFieldChanged($event)\">\n    </pep-internal-page>\n\n    <pep-internal-carusel *ngSwitchCase=\"'internalCarusel'\" [field]=\"field\"\n        (internalFormFieldClick)=\"onInternalFormFieldClick($event)\"\n        (internalFormFieldChange)=\"onInternalFormFieldChanged($event)\">\n    </pep-internal-carusel>\n\n    <ng-container *ngSwitchCase=\"'placeholder'\">\n    </ng-container>\n</ng-container>", styles: [":host{width:100%;height:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3.PepAddressComponent, selector: "pep-address", inputs: ["key", "formattedValue", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "groupFields", "form", "layoutType", "visible"], outputs: ["addressValueChange"] }, { kind: "component", type: i4.PepAttachmentComponent, selector: "pep-attachment", inputs: ["key", "src", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "visible", "form", "showTitle", "renderTitle", "layoutType", "isActive"], outputs: ["fileChange", "elementClick"] }, { kind: "component", type: i5.PepCheckboxComponent, selector: "pep-checkbox", inputs: ["key", "value", "label", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "additionalValue", "form", "isActive", "showTitle", "renderTitle", "layoutType", "visible"], outputs: ["valueChange"] }, { kind: "component", type: i6.PepDateComponent, selector: "pep-date", inputs: ["key", "value", "formattedValue", "label", "type", "mandatory", "disabled", "readonly", "textColor", "xAlignment", "rowSpan", "visible", "minValue", "maxValue", "minDateValue", "maxDateValue", "form", "isActive", "showTitle", "renderTitle", "renderError", "renderSymbol", "layoutType"], outputs: ["valueChange"] }, { kind: "component", type: i7.PepImageComponent, selector: "pep-image", inputs: ["key", "srcLarge", "src", "options", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "indicatorsField", "menuField", "hasCampaignField", "visible", "form", "uid", "showTitle", "renderTitle", "layoutType", "isActive", "sizeLimitMB", "acceptImagesType"], outputs: ["fileChange", "elementClick"] }, { kind: "component", type: i8.PepImagesFilmstripComponent, selector: "pep-images-filmstrip", inputs: ["key", "value", "label", "xAlignment", "rowSpan", "form", "uid", "showTitle", "renderTitle", "layoutType", "currIndex", "showThumbnails"] }, { kind: "component", type: i9.PepQuantitySelectorComponent, selector: "pep-quantity-selector", inputs: ["key", "value", "formattedValue", "label", "type", "mandatory", "disabled", "readonly", "textColor", "xAlignment", "rowSpan", "allowDecimal", "additionalValue", "notificationInfo", "visible", "form", "showTitle", "renderTitle", "layoutType", "isActive", "styleType"], outputs: ["valueChange", "elementClick"] }, { kind: "component", type: i10.PepRichHtmlTextareaComponent, selector: "pep-rich-html-textarea", inputs: ["key", "value", "label", "mandatory", "disabled", "readonly", "maxFieldCharacters", "xAlignment", "rowSpan", "visible", "form", "isActive", "showTitle", "renderTitle", "layoutType", "inlineMode", "toolbarOptions"], outputs: ["valueChange"] }, { kind: "component", type: i11.PepSelectComponent, selector: "pep-select", inputs: ["key", "value", "label", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "options", "visible", "form", "layoutType", "parentFieldKey", "isActive", "showTitle", "emptyOption", "renderTitle"], outputs: ["valueChange", "formValidationChange"] }, { kind: "component", type: i12.PepSeparatorComponent, selector: "pep-separator", inputs: ["key", "label", "xAlignment", "form", "layoutType", "visible"] }, { kind: "component", type: i13.PepSignatureComponent, selector: "pep-signature", inputs: ["key", "src", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "signatureURL", "visible", "form", "showTitle", "renderTitle", "layoutType", "isActive"], outputs: ["fileChange"] }, { kind: "component", type: i14.PepTextareaComponent, selector: "pep-textarea", inputs: ["key", "value", "label", "mandatory", "disabled", "readonly", "maxFieldCharacters", "textColor", "xAlignment", "rowSpan", "visible", "form", "isActive", "showTitle", "renderTitle", "layoutType"], outputs: ["valueChange"] }, { kind: "component", type: i15.PepTextboxComponent, selector: "pep-textbox", inputs: ["key", "value", "formattedValue", "accessory", "label", "placeholder", "type", "mandatory", "disabled", "readonly", "maxFieldCharacters", "hint", "textColor", "xAlignment", "rowSpan", "minValue", "maxValue", "visible", "form", "isActive", "showTitle", "renderTitle", "renderError", "renderSymbol", "layoutType", "parentFieldKey"], outputs: ["valueChange", "formValidationChange"] }, { kind: "component", type: i16.PepLinkComponent, selector: "pep-link", inputs: ["key", "value", "formattedValue", "label", "placeholder", "mandatory", "disabled", "readonly", "maxFieldCharacters", "textColor", "xAlignment", "rowSpan", "visible", "form", "isActive", "showTitle", "renderTitle", "renderError", "renderSymbol", "layoutType"], outputs: ["valueChange", "formValidationChange", "elementClick"] }, { kind: "component", type: i17.PepIndicatorsComponent, selector: "pep-indicators", inputs: ["key", "value", "layoutType"] }, { kind: "component", type: i18.PepInternalButtonComponent, selector: "pep-internal-button", inputs: ["key", "value", "formattedValue", "label", "referenceObjectInternalType", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "visible", "form", "showTitle", "layoutType"], outputs: ["elementClick", "valueChange"] }, { kind: "component", type: i19.PepInternalMenuComponent, selector: "pep-internal-menu", inputs: ["key", "label", "disabled", "xAlignment", "options", "invertClass", "layoutType"], outputs: ["elementClick"] }, { kind: "component", type: i20.PepInternalPageComponent, selector: "pep-internal-page", inputs: ["field", "layoutType"], outputs: ["internalFormFieldChange", "internalFormFieldClick"] }, { kind: "component", type: i21.PepInternalCaruselComponent, selector: "pep-internal-carusel", inputs: ["field", "layoutType"], outputs: ["internalFormFieldChange", "internalFormFieldClick"] }, { kind: "pipe", type: i1.LowerCasePipe, name: "lowercase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepFieldGeneratorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'pep-field-generator', encapsulation: ViewEncapsulation.Emulated, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [ngSwitch]=\"field.controlType\" [formGroup]=\"form\">\n\n    <pep-address *ngSwitchCase=\"'address'\" [form]=\"form\" [key]=\"field.key\" [formattedValue]=\"field.formattedValue\"\n        [label]=\"field.label\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [groupFields]=\"field.groupFields\"\n        [layoutType]=\"layoutType\" [visible]=\"field.visible\" (addressValueChange)=\"onAddressValueChanged($event, field)\">\n    </pep-address>\n\n    <pep-attachment *ngSwitchCase=\"'attachment'\" [form]=\"form\" [key]=\"field.key\" [src]=\"field.value\"\n        [label]=\"field.label\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [isActive]=\"isActive\" [showTitle]=\"showTitle\"\n        [layoutType]=\"layoutType\" [visible]=\"field.visible\" (elementClick)=\"onClick($event)\"\n        (fileChange)=\"onFileChanged($event, field)\">\n    </pep-attachment>\n\n    <pep-checkbox *ngSwitchCase=\"'checkbox'\" [form]=\"form\" [key]=\"field.key\"\n        [value]=\"(field.value | lowercase) == 'true' || field.value == '1' ? true : false\" [label]=\"field.label\"\n        [type]=\"field.type\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [additionalValue]=\"field.additionalValue\"\n        [showTitle]=\"showTitle\" [layoutType]=\"layoutType\" [visible]=\"field.visible\"\n        (valueChange)=\"onValueChanged($event, field)\" [isActive]=\"isActive\">\n    </pep-checkbox>\n\n    <pep-date *ngSwitchCase=\"'date'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [type]=\"field.type\" [mandatory]=\"field.mandatory\"\n        [disabled]=\"field.disabled\" [readonly]=\"field.readonly\" [textColor]=\"field.textColor\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [minValue]=\"field.minValue\"\n        [maxValue]=\"field.maxValue\" [showTitle]=\"showTitle\" [layoutType]=\"layoutType\" [visible]=\"field.visible\"\n        (valueChange)=\"onValueChanged($event, field)\" [isActive]=\"isActive\">\n    </pep-date>\n\n    <pep-images-filmstrip *ngSwitchCase=\"'images'\" [uid]=\"uid\" [form]=\"form\" [key]=\"field.key\" [label]=\"field.label\"\n        [showTitle]=\"showTitle\" [rowSpan]=\"field.rowSpan\" [value]=\"field.value\" [layoutType]=\"layoutType\">\n    </pep-images-filmstrip>\n\n    <pep-image *ngSwitchCase=\"'image'\" [uid]=\"uid\" [form]=\"form\" [key]=\"field.key\" [src]=\"field.formattedValue\"\n        [srcLarge]=\"field.value\" [options]=\"field.options\" [label]=\"field.label\" [mandatory]=\"field.mandatory\"\n        [disabled]=\"field.disabled\" [readonly]=\"field.readonly\" [xAlignment]=\"field.xAlignment\"\n        [rowSpan]=\"field.rowSpan\" [indicatorsField]=\"field.indicatorsField\" [menuField]=\"field.menuField\"\n        [hasCampaignField]=\"field.hasCampaignField\" [sizeLimitMB]=\"field.sizeLimitMB\" [isActive]=\"isActive\"\n        [layoutType]=\"layoutType\" [visible]=\"field.visible\" (elementClick)=\"onClick($event)\"\n        (fileChange)=\"onFileChanged($event, field)\">\n    </pep-image>\n\n    <pep-quantity-selector *ngSwitchCase=\"'qs'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [type]=\"field.type\" [mandatory]=\"field.mandatory\"\n        [disabled]=\"field.disabled\" [readonly]=\"field.readonly\" [textColor]=\"field.textColor\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [allowDecimal]=\"field.allowDecimal\"\n        [additionalValue]=\"field.additionalValue\" [notificationInfo]=\"field.notificationInfo\" [isActive]=\"isActive\"\n        [layoutType]=\"layoutType\" [showTitle]=\"showTitle\" [visible]=\"field.visible\"\n        (valueChange)=\"onValueChanged($event, field)\" (formValidationChange)=\"onFormValidationChanged($event)\"\n        (elementClick)=\"onClick($event)\">\n    </pep-quantity-selector>\n\n    <pep-rich-html-textarea *ngSwitchCase=\"'richhtmltextarea'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [label]=\"field.label\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [maxFieldCharacters]=\"field.maxFieldCharacters\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n        [showTitle]=\"showTitle\" [layoutType]=\"layoutType\" [visible]=\"field.visible\"\n        (valueChange)=\"onValueChanged($event, field)\" [isActive]=\"isActive\">\n    </pep-rich-html-textarea>\n\n    <pep-select *ngSwitchCase=\"'select'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\" [label]=\"field.label\"\n        [type]=\"field.type\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [options]=\"field.options\" [showTitle]=\"showTitle\"\n        [layoutType]=\"layoutType\" [visible]=\"field.visible\" (valueChange)=\"onValueChanged($event, field)\"\n        (formValidationChange)=\"onFormValidationChanged($event)\" [isActive]=\"isActive\">\n    </pep-select>\n\n    <pep-separator *ngSwitchCase=\"'separator'\" [form]=\"form\" [key]=\"field.key\" [label]=\"field.label\"\n        [xAlignment]=\"field.xAlignment\" [layoutType]=\"layoutType\" [visible]=\"field.visible\">\n    </pep-separator>\n\n    <pep-signature *ngSwitchCase=\"'signature'\" [form]=\"form\" [key]=\"field.key\" [src]=\"field.value\" [label]=\"field.label\"\n        [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [isActive]=\"isActive\" [layoutType]=\"layoutType\"\n        [visible]=\"field.visible\" (fileChange)=\"onFileChanged($event, field)\">\n    </pep-signature>\n\n    <pep-textarea *ngSwitchCase=\"'textarea'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\" [label]=\"field.label\"\n        [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [maxFieldCharacters]=\"field.maxFieldCharacters\" [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\"\n        [rowSpan]=\"field.rowSpan\" [showTitle]=\"showTitle\" [layoutType]=\"layoutType\" [visible]=\"field.visible\"\n        (valueChange)=\"onValueChanged($event, field)\" [isActive]=\"isActive\">\n    </pep-textarea>\n\n    <pep-textbox *ngSwitchCase=\"'textbox'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [formattedValue]=\"field.formattedValue\" [accessory]=\"field.accessory\" [label]=\"field.label\" [placeholder]=\"field.placeholder\"\n        [type]=\"field.type\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [maxFieldCharacters]=\"field.maxFieldCharacters\" [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\"\n        [rowSpan]=\"field.rowSpan\" [showTitle]=\"showTitle\" [layoutType]=\"layoutType\"\n        (valueChange)=\"onValueChanged($event, field)\" (formValidationChange)=\"onFormValidationChanged($event)\"\n        [isActive]=\"isActive\" [visible]=\"field.visible\">\n    </pep-textbox>\n\n    <pep-link *ngSwitchCase=\"'link'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [placeholder]=\"field.placeholder\"\n        [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n        [maxFieldCharacters]=\"field.maxFieldCharacters\" [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\"\n        [rowSpan]=\"field.rowSpan\" [showTitle]=\"showTitle\" [layoutType]=\"layoutType\"\n        (valueChange)=\"onValueChanged($event, field)\" [isActive]=\"isActive\" [visible]=\"field.visible\"\n        (formValidationChange)=\"onFormValidationChanged($event)\" (elementClick)=\"onClick($event)\">\n    </pep-link>\n\n    <pep-indicators *ngSwitchCase=\"'indicators'\" [key]=\"field.key\" [value]=\"field.value\" [layoutType]=\"layoutType\">\n    </pep-indicators>\n    <pep-internal-button *ngSwitchCase=\"'button'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n        [formattedValue]=\"field.formattedValue\" [label]=\"field.label\"\n        [referenceObjectInternalType]=\"field.referenceObjectInternalType\" [type]=\"field.type\"\n        [disabled]=\"field.disabled\" [readonly]=\"field.readonly\" [xAlignment]=\"field.xAlignment\"\n        [layoutType]=\"layoutType\" [visible]=\"field.visible\" (elementClick)=\"onClick($event)\"\n        (valueChange)=\"onValueChanged($event, field)\">\n    </pep-internal-button>\n    <pep-internal-menu *ngSwitchCase=\"'menu'\" [key]=\"field.key\" [label]=\"field.label\" [disabled]=\"field.disabled\"\n        [xAlignment]=\"field.xAlignment\" [options]=\"field.options\" [layoutType]=\"layoutType\"\n        (elementClick)=\"onClick($event)\">\n    </pep-internal-menu>\n    <pep-internal-page *ngSwitchCase=\"'internalPage'\" [field]=\"field\" [layoutType]=\"layoutType\"\n        (internalFormFieldClick)=\"onInternalFormFieldClick($event)\"\n        (internalFormFieldChange)=\"onInternalFormFieldChanged($event)\">\n    </pep-internal-page>\n\n    <pep-internal-carusel *ngSwitchCase=\"'internalCarusel'\" [field]=\"field\"\n        (internalFormFieldClick)=\"onInternalFormFieldClick($event)\"\n        (internalFormFieldChange)=\"onInternalFormFieldChanged($event)\">\n    </pep-internal-carusel>\n\n    <ng-container *ngSwitchCase=\"'placeholder'\">\n    </ng-container>\n</ng-container>", styles: [":host{width:100%;height:100%}\n"] }]
         }], propDecorators: { field: [{

package/esm2020/form/form.component.mjs

@@ -1169,9 +1169,9 @@ export class PepFormComponent {
         this.fieldClick.emit(event);
     }
 }
-PepFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepFormComponent, deps: [{ token: i1.PepDialogService }, { token: i2.PepCustomizationService }, { token: i2.PepLayoutService }, { token: i3.FormBuilder }, { token: i0.KeyValueDiffers }, { token: i4.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-PepFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.1", type: PepFormComponent, selector: "pep-form", inputs: { isInternal: "isInternal", isReport: "isReport", layout: "layout", lockEvents: "lockEvents", canEditObject: "canEditObject", data: "data", lockFields: "lockFields", isActive: "isActive", layoutType: "layoutType", objectId: "objectId", parentId: "parentId", searchCode: "searchCode", showTitle: "showTitle", firstFieldAsLink: "firstFieldAsLink", checkForChanges: "checkForChanges" }, outputs: { valueChange: "valueChange", formValidationChange: "formValidationChange", fieldClick: "fieldClick", internalFormFieldClick: "internalFormFieldClick", internalFormFieldChange: "internalFormFieldChange" }, usesOnChanges: true, ngImport: i0, template: "<fieldset *ngIf=\"form\" [formGroup]=\"form\" [disabled]=\"isLocked\" class=\"pep-form\"\n    [ngStyle]=\"{ 'background-color': layoutType == 'card' && data?.BackgroundColor }\">\n    <!-- New Form -->\n    <mat-grid-list *ngIf=\"layoutType == 'form'\" [cols]=\"columns\" [rowHeight]=\"rowHeight + 'rem'\"\n        [gutterSize]=\"formGutterSize\">\n        <mat-grid-tile *ngFor=\"let field of fields$ | async\" [rowspan]=\"field.rowSpan\" [colspan]=\"field.colSpan\">\n            <pep-field-generator *ngIf=\"field.controlType != 'placeholder'\" [form]=\"form\" [layoutType]=\"layoutType\"\n                [checkForChanges]=\"checkForChanges\" [uid]=\"data?.UID\" [field]=\"field\" [showTitle]=\"showTitle\"\n                (valueChange)=\"onValueChanged($event)\" (elementClick)=\"onClick($event)\"\n                (internalFormFieldClick)=\"onInternalFormFieldClicked($event)\"\n                (internalFormFieldChange)=\"onInternalFormFieldChanged($event)\"\n                (formValueChange)=\"onFormValueChanged($event)\" (formFieldClick)=\"onFormFieldClick($event)\"\n                (formValidationChange)=\"onFormValidationChanged($event)\">\n            </pep-field-generator>\n        </mat-grid-tile>\n    </mat-grid-list>\n\n    <!-- Thumbnails -->\n    <mat-grid-list *ngIf=\"layoutType == 'card'\" [cols]=\"columns\" [rowHeight]=\"rowHeight + 'rem'\"\n        [gutterSize]=\"cardGutterSize\" class=\"card-spacing\">\n        <mat-grid-tile *ngFor=\"let field of fields$ | async\" [rowspan]=\"field.rowSpan\" [colspan]=\"field.colSpan\"\n            [ngStyle]=\"{ overflow: field.type == 'qs' ? 'unset' : 'hidden' }\">\n            <pep-field-generator *ngIf=\"field.controlType != 'placeholder'\" [form]=\"form\" [layoutType]=\"layoutType\"\n                [ngClass]=\"{ 'lock-events': lockEvents }\" [isActive]=\"isActive\" [checkForChanges]=\"checkForChanges\"\n                [uid]=\"data?.UID\" [field]=\"field\" [showTitle]=\"showTitle\" (valueChange)=\"onValueChanged($event)\"\n                (elementClick)=\"onClick($event)\" (internalFormFieldClick)=\"onInternalFormFieldClicked($event)\"\n                (internalFormFieldChange)=\"onInternalFormFieldChanged($event)\"\n                (formValueChange)=\"onFormValueChanged($event)\" (formFieldClick)=\"onFormFieldClick($event)\">\n            </pep-field-generator>\n        </mat-grid-tile>\n    </mat-grid-list>\n\n    <ng-container *ngIf=\"layoutType == 'table'\">\n        <ng-container *ngIf=\"isReport; then reportBlock; else notReportBlock\"></ng-container>\n        <ng-template #reportBlock>\n            <ng-container *ngTemplateOutlet=\"report\"></ng-container>\n        </ng-template>\n        <ng-template #notReportBlock>\n            <div *ngFor=\"let field of fields$ | async; let j = index\" class=\"pull-left flip table-cell \"\n                [ngClass]=\"['text-align-' + field.xAlignment]\" style=\"height: 100%\"\n                [ngStyle]=\"{ width: (layout?.ControlFields)[j]?.calcColumnWidthString}\">\n                <pep-field-generator *ngIf=\"field.controlType != 'placeholder'\" [checkForChanges]=\"checkForChanges\"\n                    [uid]=\"data?.UID\" [field]=\"field\" [form]=\"form\" [layoutType]=\"layoutType\" [showTitle]=\"false\"\n                    (elementClick)=\"onClick($event)\" (valueChange)=\"onValueChanged($event)\"\n                    (formValueChange)=\"onFormValueChanged($event)\" (formFieldClick)=\"onFormFieldClick($event)\"\n                    [isActive]=\"isActive\">\n                </pep-field-generator>\n            </div>\n        </ng-template>\n    </ng-container>\n\n    <!------- For testing ------------\n    {{ form.value | json }}\n    {{ form.valid }}\n    ---------------------------------->\n</fieldset>\n\n<ng-template #report>\n    <div *ngFor=\"let field of fields$ | async; let j = index\" class=\"pull-left flip pep-report-fields\"\n        [ngStyle]=\"{ width: (layout?.ControlFields)[j]?.calcColumnWidthString }\"\n        [ngClass]=\"['text-align-' + field.xAlignment]\">\n        <ng-container [ngSwitch]=\"field.controlType\">\n            <pep-image *ngSwitchCase=\"'image'\" [uid]=\"data?.UID\" [form]=\"form\" [key]=\"field.key\"\n                [src]=\"field.formattedValue\" [srcLarge]=\"field.value\" [options]=\"field.options\" [label]=\"field.label\"\n                [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n                [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [layoutType]=\"layoutType\"\n                (elementClick)=\"onClick($event)\">\n            </pep-image>\n\n            <pep-signature *ngSwitchCase=\"'signature'\" [form]=\"form\" [key]=\"field.key\" [src]=\"field.value\"\n                [label]=\"field.label\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\"\n                [readonly]=\"field.readonly\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n                [layoutType]=\"layoutType\">\n            </pep-signature>\n\n            <pep-checkbox *ngSwitchCase=\"'checkbox'\" [form]=\"form\" [key]=\"field.key\"\n                [value]=\"(field.value | lowercase) == 'true' || field.value == '1' ? true : false\" [label]=\"field.label\"\n                [type]=\"field.type\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\"\n                [readonly]=\"field.readonly\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n                [additionalValue]=\"field.additionalValue\" [layoutType]=\"layoutType\">\n            </pep-checkbox>\n\n            <pep-date *ngSwitchCase=\"'date'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n                [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [type]=\"field.type\"\n                [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n                [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n                [minValue]=\"field.minValue\" [maxValue]=\"field.maxValue\" [layoutType]=\"layoutType\">\n            </pep-date>\n\n            <pep-internal-button *ngSwitchCase=\"'button'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n                [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [type]=\"field.type\"\n                [disabled]=\"field.disabled\" [readonly]=\"field.readonly\" [xAlignment]=\"field.xAlignment\"\n                [layoutType]=\"layoutType\" (elementClick)=\"onClick($event)\">\n            </pep-internal-button>\n\n            <pep-textarea *ngSwitchCase=\"'textarea'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n                [label]=\"field.label\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\"\n                [readonly]=\"field.readonly\" [maxFieldCharacters]=\"field.maxFieldCharacters\"\n                [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n                [layoutType]=\"layoutType\">\n            </pep-textarea>\n\n            <pep-quantity-selector *ngSwitchCase=\"'qs'\" [id]=\"field.key\" [form]=\"form\" [key]=\"field.key\"\n                [value]=\"field.value\" [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [type]=\"field.type\"\n                [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n                [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n                [layoutType]=\"layoutType\" (valueChange)=\"onValueChanged($event)\" (elementClick)=\"onClick($event)\">\n            </pep-quantity-selector>\n\n            <ng-container *ngSwitchDefault>\n                <ng-container *ngIf=\"field.formattedValue?.length > 0; then notEmptyBlock; else emptyBlock\">\n                </ng-container>\n                <ng-template #notEmptyBlock>\n                    <ng-container\n                        *ngIf=\"field.controlType === 'attachment' || field.type === 'link'; then linkBlock; else notLinkBlock\">\n                    </ng-container>\n                    <ng-template #linkBlock>\n                        <a [id]=\"field.key\" class=\"color-link body-sm pep-report-input readonly\"\n                            *ngIf=\"field.formattedValue != null\" title=\"{{ field.formattedValue }}\" target=\"_blank\"\n                            href=\"{{ field.value }}\">{{ field.formattedValue }}</a>\n                    </ng-template>\n                    <ng-template #notLinkBlock>\n                        <span [id]=\"field.key\" class=\"body-sm pep-report-input readonly\"\n                            title=\"{{ field.formattedValue }}\" [ngStyle]=\"{ color: field.textColor }\">{{\n                            field.formattedValue }}</span>\n                    </ng-template>\n                </ng-template>\n                <ng-template #emptyBlock>\n                    <span>&nbsp;</span>\n                </ng-template>\n            </ng-container>\n        </ng-container>\n    </div>\n</ng-template>", styles: [":host{display:grid}\n"], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i5.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i6.MatGridList, selector: "mat-grid-list", inputs: ["cols", "gutterSize", "rowHeight"], exportAs: ["matGridList"] }, { kind: "component", type: i6.MatGridTile, selector: "mat-grid-tile", inputs: ["rowspan", "colspan"], exportAs: ["matGridTile"] }, { kind: "component", type: i7.PepCheckboxComponent, selector: "pep-checkbox", inputs: ["key", "value", "label", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "additionalValue", "form", "isActive", "showTitle", "renderTitle", "layoutType", "visible"], outputs: ["valueChange"] }, { kind: "component", type: i8.PepDateComponent, selector: "pep-date", inputs: ["key", "value", "formattedValue", "label", "type", "mandatory", "disabled", "readonly", "textColor", "xAlignment", "rowSpan", "visible", "minValue", "maxValue", "minDateValue", "maxDateValue", "form", "isActive", "showTitle", "renderTitle", "renderError", "renderSymbol", "layoutType"], outputs: ["valueChange"] }, { kind: "component", type: i9.PepImageComponent, selector: "pep-image", inputs: ["key", "srcLarge", "src", "options", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "indicatorsField", "menuField", "hasCampaignField", "visible", "form", "uid", "showTitle", "renderTitle", "layoutType", "isActive", "sizeLimitMB", "acceptImagesType"], outputs: ["fileChange", "elementClick"] }, { kind: "component", type: i10.PepQuantitySelectorComponent, selector: "pep-quantity-selector", inputs: ["key", "value", "formattedValue", "label", "type", "mandatory", "disabled", "readonly", "textColor", "xAlignment", "rowSpan", "allowDecimal", "additionalValue", "notificationInfo", "visible", "form", "showTitle", "renderTitle", "layoutType", "isActive", "styleType"], outputs: ["valueChange", "elementClick"] }, { kind: "component", type: i11.PepSignatureComponent, selector: "pep-signature", inputs: ["key", "src", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "signatureURL", "visible", "form", "showTitle", "renderTitle", "layoutType", "isActive"], outputs: ["fileChange"] }, { kind: "component", type: i12.PepTextareaComponent, selector: "pep-textarea", inputs: ["key", "value", "label", "mandatory", "disabled", "readonly", "maxFieldCharacters", "textColor", "xAlignment", "rowSpan", "visible", "form", "isActive", "showTitle", "renderTitle", "layoutType"], outputs: ["valueChange"] }, { kind: "component", type: i13.PepFieldGeneratorComponent, selector: "pep-field-generator", inputs: ["field", "isActive", "uid", "form", "layoutType", "showTitle", "checkForChanges"], outputs: ["valueChange", "formValidationChange", "elementClick", "internalFormFieldChange", "internalFormFieldClick", "formValueChange", "formFieldClick"] }, { kind: "component", type: i14.PepInternalButtonComponent, selector: "pep-internal-button", inputs: ["key", "value", "formattedValue", "label", "referenceObjectInternalType", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "visible", "form", "showTitle", "layoutType"], outputs: ["elementClick", "valueChange"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.LowerCasePipe, name: "lowercase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepFormComponent, decorators: [{
+PepFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepFormComponent, deps: [{ token: i1.PepDialogService }, { token: i2.PepCustomizationService }, { token: i2.PepLayoutService }, { token: i3.FormBuilder }, { token: i0.KeyValueDiffers }, { token: i4.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
+PepFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PepFormComponent, selector: "pep-form", inputs: { isInternal: "isInternal", isReport: "isReport", layout: "layout", lockEvents: "lockEvents", canEditObject: "canEditObject", data: "data", lockFields: "lockFields", isActive: "isActive", layoutType: "layoutType", objectId: "objectId", parentId: "parentId", searchCode: "searchCode", showTitle: "showTitle", firstFieldAsLink: "firstFieldAsLink", checkForChanges: "checkForChanges" }, outputs: { valueChange: "valueChange", formValidationChange: "formValidationChange", fieldClick: "fieldClick", internalFormFieldClick: "internalFormFieldClick", internalFormFieldChange: "internalFormFieldChange" }, usesOnChanges: true, ngImport: i0, template: "<fieldset *ngIf=\"form\" [formGroup]=\"form\" [disabled]=\"isLocked\" class=\"pep-form\"\n    [ngStyle]=\"{ 'background-color': layoutType == 'card' && data?.BackgroundColor }\">\n    <!-- New Form -->\n    <mat-grid-list *ngIf=\"layoutType == 'form'\" [cols]=\"columns\" [rowHeight]=\"rowHeight + 'rem'\"\n        [gutterSize]=\"formGutterSize\">\n        <mat-grid-tile *ngFor=\"let field of fields$ | async\" [rowspan]=\"field.rowSpan\" [colspan]=\"field.colSpan\">\n            <pep-field-generator *ngIf=\"field.controlType != 'placeholder'\" [form]=\"form\" [layoutType]=\"layoutType\"\n                [checkForChanges]=\"checkForChanges\" [uid]=\"data?.UID\" [field]=\"field\" [showTitle]=\"showTitle\"\n                (valueChange)=\"onValueChanged($event)\" (elementClick)=\"onClick($event)\"\n                (internalFormFieldClick)=\"onInternalFormFieldClicked($event)\"\n                (internalFormFieldChange)=\"onInternalFormFieldChanged($event)\"\n                (formValueChange)=\"onFormValueChanged($event)\" (formFieldClick)=\"onFormFieldClick($event)\"\n                (formValidationChange)=\"onFormValidationChanged($event)\">\n            </pep-field-generator>\n        </mat-grid-tile>\n    </mat-grid-list>\n\n    <!-- Thumbnails -->\n    <mat-grid-list *ngIf=\"layoutType == 'card'\" [cols]=\"columns\" [rowHeight]=\"rowHeight + 'rem'\"\n        [gutterSize]=\"cardGutterSize\" class=\"card-spacing\">\n        <mat-grid-tile *ngFor=\"let field of fields$ | async\" [rowspan]=\"field.rowSpan\" [colspan]=\"field.colSpan\"\n            [ngStyle]=\"{ overflow: field.type == 'qs' ? 'unset' : 'hidden' }\">\n            <pep-field-generator *ngIf=\"field.controlType != 'placeholder'\" [form]=\"form\" [layoutType]=\"layoutType\"\n                [ngClass]=\"{ 'lock-events': lockEvents }\" [isActive]=\"isActive\" [checkForChanges]=\"checkForChanges\"\n                [uid]=\"data?.UID\" [field]=\"field\" [showTitle]=\"showTitle\" (valueChange)=\"onValueChanged($event)\"\n                (elementClick)=\"onClick($event)\" (internalFormFieldClick)=\"onInternalFormFieldClicked($event)\"\n                (internalFormFieldChange)=\"onInternalFormFieldChanged($event)\"\n                (formValueChange)=\"onFormValueChanged($event)\" (formFieldClick)=\"onFormFieldClick($event)\">\n            </pep-field-generator>\n        </mat-grid-tile>\n    </mat-grid-list>\n\n    <ng-container *ngIf=\"layoutType == 'table'\">\n        <ng-container *ngIf=\"isReport; then reportBlock; else notReportBlock\"></ng-container>\n        <ng-template #reportBlock>\n            <ng-container *ngTemplateOutlet=\"report\"></ng-container>\n        </ng-template>\n        <ng-template #notReportBlock>\n            <div *ngFor=\"let field of fields$ | async; let j = index\" class=\"pull-left flip table-cell \"\n                [ngClass]=\"['text-align-' + field.xAlignment]\" style=\"height: 100%\"\n                [ngStyle]=\"{ width: (layout?.ControlFields)[j]?.calcColumnWidthString}\">\n                <pep-field-generator *ngIf=\"field.controlType != 'placeholder'\" [checkForChanges]=\"checkForChanges\"\n                    [uid]=\"data?.UID\" [field]=\"field\" [form]=\"form\" [layoutType]=\"layoutType\" [showTitle]=\"false\"\n                    (elementClick)=\"onClick($event)\" (valueChange)=\"onValueChanged($event)\"\n                    (formValueChange)=\"onFormValueChanged($event)\" (formFieldClick)=\"onFormFieldClick($event)\"\n                    [isActive]=\"isActive\">\n                </pep-field-generator>\n            </div>\n        </ng-template>\n    </ng-container>\n\n    <!------- For testing ------------\n    {{ form.value | json }}\n    {{ form.valid }}\n    ---------------------------------->\n</fieldset>\n\n<ng-template #report>\n    <div *ngFor=\"let field of fields$ | async; let j = index\" class=\"pull-left flip pep-report-fields\"\n        [ngStyle]=\"{ width: (layout?.ControlFields)[j]?.calcColumnWidthString }\"\n        [ngClass]=\"['text-align-' + field.xAlignment]\">\n        <ng-container [ngSwitch]=\"field.controlType\">\n            <pep-image *ngSwitchCase=\"'image'\" [uid]=\"data?.UID\" [form]=\"form\" [key]=\"field.key\"\n                [src]=\"field.formattedValue\" [srcLarge]=\"field.value\" [options]=\"field.options\" [label]=\"field.label\"\n                [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n                [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [layoutType]=\"layoutType\"\n                (elementClick)=\"onClick($event)\">\n            </pep-image>\n\n            <pep-signature *ngSwitchCase=\"'signature'\" [form]=\"form\" [key]=\"field.key\" [src]=\"field.value\"\n                [label]=\"field.label\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\"\n                [readonly]=\"field.readonly\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n                [layoutType]=\"layoutType\">\n            </pep-signature>\n\n            <pep-checkbox *ngSwitchCase=\"'checkbox'\" [form]=\"form\" [key]=\"field.key\"\n                [value]=\"(field.value | lowercase) == 'true' || field.value == '1' ? true : false\" [label]=\"field.label\"\n                [type]=\"field.type\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\"\n                [readonly]=\"field.readonly\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n                [additionalValue]=\"field.additionalValue\" [layoutType]=\"layoutType\">\n            </pep-checkbox>\n\n            <pep-date *ngSwitchCase=\"'date'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n                [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [type]=\"field.type\"\n                [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n                [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n                [minValue]=\"field.minValue\" [maxValue]=\"field.maxValue\" [layoutType]=\"layoutType\">\n            </pep-date>\n\n            <pep-internal-button *ngSwitchCase=\"'button'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n                [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [type]=\"field.type\"\n                [disabled]=\"field.disabled\" [readonly]=\"field.readonly\" [xAlignment]=\"field.xAlignment\"\n                [layoutType]=\"layoutType\" (elementClick)=\"onClick($event)\">\n            </pep-internal-button>\n\n            <pep-textarea *ngSwitchCase=\"'textarea'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n                [label]=\"field.label\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\"\n                [readonly]=\"field.readonly\" [maxFieldCharacters]=\"field.maxFieldCharacters\"\n                [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n                [layoutType]=\"layoutType\">\n            </pep-textarea>\n\n            <pep-quantity-selector *ngSwitchCase=\"'qs'\" [id]=\"field.key\" [form]=\"form\" [key]=\"field.key\"\n                [value]=\"field.value\" [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [type]=\"field.type\"\n                [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n                [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n                [layoutType]=\"layoutType\" (valueChange)=\"onValueChanged($event)\" (elementClick)=\"onClick($event)\">\n            </pep-quantity-selector>\n\n            <ng-container *ngSwitchDefault>\n                <ng-container *ngIf=\"field.formattedValue?.length > 0; then notEmptyBlock; else emptyBlock\">\n                </ng-container>\n                <ng-template #notEmptyBlock>\n                    <ng-container\n                        *ngIf=\"field.controlType === 'attachment' || field.type === 'link'; then linkBlock; else notLinkBlock\">\n                    </ng-container>\n                    <ng-template #linkBlock>\n                        <a [id]=\"field.key\" class=\"color-link body-sm pep-report-input readonly\"\n                            *ngIf=\"field.formattedValue != null\" title=\"{{ field.formattedValue }}\" target=\"_blank\"\n                            href=\"{{ field.value }}\">{{ field.formattedValue }}</a>\n                    </ng-template>\n                    <ng-template #notLinkBlock>\n                        <span [id]=\"field.key\" class=\"body-sm pep-report-input readonly\"\n                            title=\"{{ field.formattedValue }}\" [ngStyle]=\"{ color: field.textColor }\">{{\n                            field.formattedValue }}</span>\n                    </ng-template>\n                </ng-template>\n                <ng-template #emptyBlock>\n                    <span>&nbsp;</span>\n                </ng-template>\n            </ng-container>\n        </ng-container>\n    </div>\n</ng-template>", styles: [":host{display:grid}\n"], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i5.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i6.MatGridList, selector: "mat-grid-list", inputs: ["cols", "gutterSize", "rowHeight"], exportAs: ["matGridList"] }, { kind: "component", type: i6.MatGridTile, selector: "mat-grid-tile", inputs: ["rowspan", "colspan"], exportAs: ["matGridTile"] }, { kind: "component", type: i7.PepCheckboxComponent, selector: "pep-checkbox", inputs: ["key", "value", "label", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "additionalValue", "form", "isActive", "showTitle", "renderTitle", "layoutType", "visible"], outputs: ["valueChange"] }, { kind: "component", type: i8.PepDateComponent, selector: "pep-date", inputs: ["key", "value", "formattedValue", "label", "type", "mandatory", "disabled", "readonly", "textColor", "xAlignment", "rowSpan", "visible", "minValue", "maxValue", "minDateValue", "maxDateValue", "form", "isActive", "showTitle", "renderTitle", "renderError", "renderSymbol", "layoutType"], outputs: ["valueChange"] }, { kind: "component", type: i9.PepImageComponent, selector: "pep-image", inputs: ["key", "srcLarge", "src", "options", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "indicatorsField", "menuField", "hasCampaignField", "visible", "form", "uid", "showTitle", "renderTitle", "layoutType", "isActive", "sizeLimitMB", "acceptImagesType"], outputs: ["fileChange", "elementClick"] }, { kind: "component", type: i10.PepQuantitySelectorComponent, selector: "pep-quantity-selector", inputs: ["key", "value", "formattedValue", "label", "type", "mandatory", "disabled", "readonly", "textColor", "xAlignment", "rowSpan", "allowDecimal", "additionalValue", "notificationInfo", "visible", "form", "showTitle", "renderTitle", "layoutType", "isActive", "styleType"], outputs: ["valueChange", "elementClick"] }, { kind: "component", type: i11.PepSignatureComponent, selector: "pep-signature", inputs: ["key", "src", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "signatureURL", "visible", "form", "showTitle", "renderTitle", "layoutType", "isActive"], outputs: ["fileChange"] }, { kind: "component", type: i12.PepTextareaComponent, selector: "pep-textarea", inputs: ["key", "value", "label", "mandatory", "disabled", "readonly", "maxFieldCharacters", "textColor", "xAlignment", "rowSpan", "visible", "form", "isActive", "showTitle", "renderTitle", "layoutType"], outputs: ["valueChange"] }, { kind: "component", type: i13.PepFieldGeneratorComponent, selector: "pep-field-generator", inputs: ["field", "isActive", "uid", "form", "layoutType", "showTitle", "checkForChanges"], outputs: ["valueChange", "formValidationChange", "elementClick", "internalFormFieldChange", "internalFormFieldClick", "formValueChange", "formFieldClick"] }, { kind: "component", type: i14.PepInternalButtonComponent, selector: "pep-internal-button", inputs: ["key", "value", "formattedValue", "label", "referenceObjectInternalType", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "visible", "form", "showTitle", "layoutType"], outputs: ["elementClick", "valueChange"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.LowerCasePipe, name: "lowercase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepFormComponent, decorators: [{
             type: Component,
             args: [{ selector: 'pep-form', changeDetection: ChangeDetectionStrategy.OnPush, template: "<fieldset *ngIf=\"form\" [formGroup]=\"form\" [disabled]=\"isLocked\" class=\"pep-form\"\n    [ngStyle]=\"{ 'background-color': layoutType == 'card' && data?.BackgroundColor }\">\n    <!-- New Form -->\n    <mat-grid-list *ngIf=\"layoutType == 'form'\" [cols]=\"columns\" [rowHeight]=\"rowHeight + 'rem'\"\n        [gutterSize]=\"formGutterSize\">\n        <mat-grid-tile *ngFor=\"let field of fields$ | async\" [rowspan]=\"field.rowSpan\" [colspan]=\"field.colSpan\">\n            <pep-field-generator *ngIf=\"field.controlType != 'placeholder'\" [form]=\"form\" [layoutType]=\"layoutType\"\n                [checkForChanges]=\"checkForChanges\" [uid]=\"data?.UID\" [field]=\"field\" [showTitle]=\"showTitle\"\n                (valueChange)=\"onValueChanged($event)\" (elementClick)=\"onClick($event)\"\n                (internalFormFieldClick)=\"onInternalFormFieldClicked($event)\"\n                (internalFormFieldChange)=\"onInternalFormFieldChanged($event)\"\n                (formValueChange)=\"onFormValueChanged($event)\" (formFieldClick)=\"onFormFieldClick($event)\"\n                (formValidationChange)=\"onFormValidationChanged($event)\">\n            </pep-field-generator>\n        </mat-grid-tile>\n    </mat-grid-list>\n\n    <!-- Thumbnails -->\n    <mat-grid-list *ngIf=\"layoutType == 'card'\" [cols]=\"columns\" [rowHeight]=\"rowHeight + 'rem'\"\n        [gutterSize]=\"cardGutterSize\" class=\"card-spacing\">\n        <mat-grid-tile *ngFor=\"let field of fields$ | async\" [rowspan]=\"field.rowSpan\" [colspan]=\"field.colSpan\"\n            [ngStyle]=\"{ overflow: field.type == 'qs' ? 'unset' : 'hidden' }\">\n            <pep-field-generator *ngIf=\"field.controlType != 'placeholder'\" [form]=\"form\" [layoutType]=\"layoutType\"\n                [ngClass]=\"{ 'lock-events': lockEvents }\" [isActive]=\"isActive\" [checkForChanges]=\"checkForChanges\"\n                [uid]=\"data?.UID\" [field]=\"field\" [showTitle]=\"showTitle\" (valueChange)=\"onValueChanged($event)\"\n                (elementClick)=\"onClick($event)\" (internalFormFieldClick)=\"onInternalFormFieldClicked($event)\"\n                (internalFormFieldChange)=\"onInternalFormFieldChanged($event)\"\n                (formValueChange)=\"onFormValueChanged($event)\" (formFieldClick)=\"onFormFieldClick($event)\">\n            </pep-field-generator>\n        </mat-grid-tile>\n    </mat-grid-list>\n\n    <ng-container *ngIf=\"layoutType == 'table'\">\n        <ng-container *ngIf=\"isReport; then reportBlock; else notReportBlock\"></ng-container>\n        <ng-template #reportBlock>\n            <ng-container *ngTemplateOutlet=\"report\"></ng-container>\n        </ng-template>\n        <ng-template #notReportBlock>\n            <div *ngFor=\"let field of fields$ | async; let j = index\" class=\"pull-left flip table-cell \"\n                [ngClass]=\"['text-align-' + field.xAlignment]\" style=\"height: 100%\"\n                [ngStyle]=\"{ width: (layout?.ControlFields)[j]?.calcColumnWidthString}\">\n                <pep-field-generator *ngIf=\"field.controlType != 'placeholder'\" [checkForChanges]=\"checkForChanges\"\n                    [uid]=\"data?.UID\" [field]=\"field\" [form]=\"form\" [layoutType]=\"layoutType\" [showTitle]=\"false\"\n                    (elementClick)=\"onClick($event)\" (valueChange)=\"onValueChanged($event)\"\n                    (formValueChange)=\"onFormValueChanged($event)\" (formFieldClick)=\"onFormFieldClick($event)\"\n                    [isActive]=\"isActive\">\n                </pep-field-generator>\n            </div>\n        </ng-template>\n    </ng-container>\n\n    <!------- For testing ------------\n    {{ form.value | json }}\n    {{ form.valid }}\n    ---------------------------------->\n</fieldset>\n\n<ng-template #report>\n    <div *ngFor=\"let field of fields$ | async; let j = index\" class=\"pull-left flip pep-report-fields\"\n        [ngStyle]=\"{ width: (layout?.ControlFields)[j]?.calcColumnWidthString }\"\n        [ngClass]=\"['text-align-' + field.xAlignment]\">\n        <ng-container [ngSwitch]=\"field.controlType\">\n            <pep-image *ngSwitchCase=\"'image'\" [uid]=\"data?.UID\" [form]=\"form\" [key]=\"field.key\"\n                [src]=\"field.formattedValue\" [srcLarge]=\"field.value\" [options]=\"field.options\" [label]=\"field.label\"\n                [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n                [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\" [layoutType]=\"layoutType\"\n                (elementClick)=\"onClick($event)\">\n            </pep-image>\n\n            <pep-signature *ngSwitchCase=\"'signature'\" [form]=\"form\" [key]=\"field.key\" [src]=\"field.value\"\n                [label]=\"field.label\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\"\n                [readonly]=\"field.readonly\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n                [layoutType]=\"layoutType\">\n            </pep-signature>\n\n            <pep-checkbox *ngSwitchCase=\"'checkbox'\" [form]=\"form\" [key]=\"field.key\"\n                [value]=\"(field.value | lowercase) == 'true' || field.value == '1' ? true : false\" [label]=\"field.label\"\n                [type]=\"field.type\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\"\n                [readonly]=\"field.readonly\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n                [additionalValue]=\"field.additionalValue\" [layoutType]=\"layoutType\">\n            </pep-checkbox>\n\n            <pep-date *ngSwitchCase=\"'date'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n                [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [type]=\"field.type\"\n                [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n                [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n                [minValue]=\"field.minValue\" [maxValue]=\"field.maxValue\" [layoutType]=\"layoutType\">\n            </pep-date>\n\n            <pep-internal-button *ngSwitchCase=\"'button'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n                [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [type]=\"field.type\"\n                [disabled]=\"field.disabled\" [readonly]=\"field.readonly\" [xAlignment]=\"field.xAlignment\"\n                [layoutType]=\"layoutType\" (elementClick)=\"onClick($event)\">\n            </pep-internal-button>\n\n            <pep-textarea *ngSwitchCase=\"'textarea'\" [form]=\"form\" [key]=\"field.key\" [value]=\"field.value\"\n                [label]=\"field.label\" [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\"\n                [readonly]=\"field.readonly\" [maxFieldCharacters]=\"field.maxFieldCharacters\"\n                [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n                [layoutType]=\"layoutType\">\n            </pep-textarea>\n\n            <pep-quantity-selector *ngSwitchCase=\"'qs'\" [id]=\"field.key\" [form]=\"form\" [key]=\"field.key\"\n                [value]=\"field.value\" [formattedValue]=\"field.formattedValue\" [label]=\"field.label\" [type]=\"field.type\"\n                [mandatory]=\"field.mandatory\" [disabled]=\"field.disabled\" [readonly]=\"field.readonly\"\n                [textColor]=\"field.textColor\" [xAlignment]=\"field.xAlignment\" [rowSpan]=\"field.rowSpan\"\n                [layoutType]=\"layoutType\" (valueChange)=\"onValueChanged($event)\" (elementClick)=\"onClick($event)\">\n            </pep-quantity-selector>\n\n            <ng-container *ngSwitchDefault>\n                <ng-container *ngIf=\"field.formattedValue?.length > 0; then notEmptyBlock; else emptyBlock\">\n                </ng-container>\n                <ng-template #notEmptyBlock>\n                    <ng-container\n                        *ngIf=\"field.controlType === 'attachment' || field.type === 'link'; then linkBlock; else notLinkBlock\">\n                    </ng-container>\n                    <ng-template #linkBlock>\n                        <a [id]=\"field.key\" class=\"color-link body-sm pep-report-input readonly\"\n                            *ngIf=\"field.formattedValue != null\" title=\"{{ field.formattedValue }}\" target=\"_blank\"\n                            href=\"{{ field.value }}\">{{ field.formattedValue }}</a>\n                    </ng-template>\n                    <ng-template #notLinkBlock>\n                        <span [id]=\"field.key\" class=\"body-sm pep-report-input readonly\"\n                            title=\"{{ field.formattedValue }}\" [ngStyle]=\"{ color: field.textColor }\">{{\n                            field.formattedValue }}</span>\n                    </ng-template>\n                </ng-template>\n                <ng-template #emptyBlock>\n                    <span>&nbsp;</span>\n                </ng-template>\n            </ng-container>\n        </ng-container>\n    </div>\n</ng-template>", styles: [":host{display:grid}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.PepDialogService }, { type: i2.PepCustomizationService }, { type: i2.PepLayoutService }, { type: i3.FormBuilder }, { type: i0.KeyValueDiffers }, { type: i4.TranslateService }]; }, propDecorators: { isInternal: [{

package/esm2020/form/form.module.mjs

@@ -71,8 +71,8 @@ export class PepFormModule {
         ]);
     }
 }
-PepFormModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepFormModule, deps: [{ token: i1.PepIconRegistry }], target: i0.ɵɵFactoryTarget.NgModule });
-PepFormModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.1", ngImport: i0, type: PepFormModule, declarations: [PepFormComponent,
+PepFormModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepFormModule, deps: [{ token: i1.PepIconRegistry }], target: i0.ɵɵFactoryTarget.NgModule });
+PepFormModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.2", ngImport: i0, type: PepFormModule, declarations: [PepFormComponent,
         PepInternalFormComponent,
         PepFieldGeneratorComponent,
         PepInternalFieldGeneratorComponent,
@@ -112,7 +112,7 @@ PepFormModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version:
         PepTextboxModule,
         PepLinkModule, PepFieldTitleModule,
         PepGroupButtonsModule], exports: [PepFormComponent] });
-PepFormModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepFormModule, imports: [CommonModule,
+PepFormModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepFormModule, imports: [CommonModule,
         ReactiveFormsModule,
         // Material modules,
         MatCommonModule,
@@ -130,7 +130,7 @@ PepFormModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version:
         pepComponentsModules,
         PepFieldTitleModule,
         PepGroupButtonsModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepFormModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepFormModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/esm2020/form/indicators.component.mjs

@@ -8,9 +8,9 @@ export class PepIndicatorsComponent {
         this.layoutType = 'table';
     }
 }
-PepIndicatorsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepIndicatorsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-PepIndicatorsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.1", type: PepIndicatorsComponent, selector: "pep-indicators", inputs: { key: "key", value: "value", layoutType: "layoutType" }, ngImport: i0, template: "<div class=\"indicators-container\" [ngClass]=\"{ 'is-inside-table': layoutType === 'table' }\">\n    <ng-container *ngFor=\"let value of value?.split(';')\">\n        <pep-icon name=\"indicator_dot_placeholder\" class=\"pull-left flip\" [fill]=\"value\"></pep-icon>\n    </ng-container>\n    <ng-container *ngIf=\"key != 'ItemIndicatorsWithoutCampaign' && value?.split(';').length < 4\">\n        <pep-icon name=\"indicator_dot_placeholder\" class=\"pull-left flip\"></pep-icon>\n    </ng-container>\n</div>", styles: [":host{height:inherit;display:grid}:host>*{align-self:center}.indicators-container{height:2.5rem}.indicators-container pep-icon{height:1rem;width:1rem;margin:.05rem}.indicators-container.is-inside-table{height:1rem;display:flex;justify-content:center;align-items:center}\n", ".indicators-container .svg-icon{fill:hsla(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%),.5)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepIndicatorsComponent, decorators: [{
+PepIndicatorsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepIndicatorsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+PepIndicatorsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PepIndicatorsComponent, selector: "pep-indicators", inputs: { key: "key", value: "value", layoutType: "layoutType" }, ngImport: i0, template: "<div class=\"indicators-container\" [ngClass]=\"{ 'is-inside-table': layoutType === 'table' }\">\n    <ng-container *ngFor=\"let value of value?.split(';')\">\n        <pep-icon name=\"indicator_dot_placeholder\" class=\"pull-left flip\" [fill]=\"value\"></pep-icon>\n    </ng-container>\n    <ng-container *ngIf=\"key != 'ItemIndicatorsWithoutCampaign' && value?.split(';').length < 4\">\n        <pep-icon name=\"indicator_dot_placeholder\" class=\"pull-left flip\"></pep-icon>\n    </ng-container>\n</div>", styles: [":host{height:inherit;display:grid}:host>*{align-self:center}.indicators-container{height:2.5rem}.indicators-container pep-icon{height:1rem;width:1rem;margin:.05rem}.indicators-container.is-inside-table{height:1rem;display:flex;justify-content:center;align-items:center}\n", ".indicators-container .svg-icon{fill:hsla(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%),.5)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepIndicatorsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'pep-indicators', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"indicators-container\" [ngClass]=\"{ 'is-inside-table': layoutType === 'table' }\">\n    <ng-container *ngFor=\"let value of value?.split(';')\">\n        <pep-icon name=\"indicator_dot_placeholder\" class=\"pull-left flip\" [fill]=\"value\"></pep-icon>\n    </ng-container>\n    <ng-container *ngIf=\"key != 'ItemIndicatorsWithoutCampaign' && value?.split(';').length < 4\">\n        <pep-icon name=\"indicator_dot_placeholder\" class=\"pull-left flip\"></pep-icon>\n    </ng-container>\n</div>", styles: [":host{height:inherit;display:grid}:host>*{align-self:center}.indicators-container{height:2.5rem}.indicators-container pep-icon{height:1rem;width:1rem;margin:.05rem}.indicators-container.is-inside-table{height:1rem;display:flex;justify-content:center;align-items:center}\n", ".indicators-container .svg-icon{fill:hsla(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%),.5)}\n"] }]
         }], propDecorators: { key: [{

package/esm2020/form/internal-button.component.mjs

@@ -141,9 +141,9 @@ export class PepInternalButtonComponent {
         this.valueChange.emit(this.value);
     }
 }
-PepInternalButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepInternalButtonComponent, deps: [{ token: i1.PepCustomizationService }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-PepInternalButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.1", type: PepInternalButtonComponent, selector: "pep-internal-button", inputs: { key: "key", value: "value", formattedValue: "formattedValue", label: "label", referenceObjectInternalType: "referenceObjectInternalType", type: "type", mandatory: "mandatory", disabled: "disabled", readonly: "readonly", xAlignment: "xAlignment", rowSpan: "rowSpan", visible: "visible", form: "form", showTitle: "showTitle", layoutType: "layoutType" }, outputs: { elementClick: "elementClick", valueChange: "valueChange" }, usesOnChanges: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"type\">\n    <ng-container *ngSwitchCase=\"'reference'\">\n        <ng-container *ngIf=\"layoutType === 'form'; then formBlock; else notFormBlock\"></ng-container>\n        <ng-template #formBlock>\n            <div class=\"pep-button-container reference-button\">\n                <pep-field-title [label]=\"label\" [mandatory]=\"mandatory\" [disabled]=\"disabled\" [xAlignment]=\"xAlignment\"\n                    [showTitle]=\"showTitle\">\n                </pep-field-title>\n                <ng-container *ngIf=\"createNewReference; then newBlock; else existingBlock\"></ng-container>\n                <ng-template #newBlock>\n                    <button mat-button [id]=\"key\" title=\"{{ formattedValue }}\" class=\"pep-button md regular\"\n                        (click)=\"onButtonClicked($event)\" [ngClass]=\"{\n                            disabled: disabled,\n                            'pull-left': xAlignment == 'left',\n                            'pull-right': xAlignment == 'right',\n                            'center-alignment': xAlignment == 'center'\n                        }\">\n                        <span class=\"ellipsis pull-left flip button-title-with-icon\">{{ 'ACTIONS.CREATE_NEW' | translate\n                            }}</span>\n                        <mat-icon class=\"pull-right flip\" pepRtlClass>\n                            <pep-icon name=\"number_plus\" (click)=\"onButtonClicked($event)\">\n                            </pep-icon>\n                        </mat-icon>\n                    </button>\n                </ng-template>\n                <ng-template #existingBlock>\n                    <pep-group-buttons [buttons]=\"referenceButtons\" styleType=\"regular\" viewType=\"split\">\n                    </pep-group-buttons>\n                </ng-template>\n            </div>\n        </ng-template>\n        <ng-template #notFormBlock>\n            <ng-container *ngTemplateOutlet=\"linkTemplate\"></ng-container>\n        </ng-template>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"'listofobjects'\">\n        <ng-container *ngIf=\"layoutType === 'form'; then formBlock; else notFormBlock\"></ng-container>\n        <ng-template #formBlock>\n            <ng-container *ngTemplateOutlet=\"buttonTemplate; context: {internal: true}\"></ng-container>\n        </ng-template>\n        <ng-template #notFormBlock>\n            <ng-container *ngTemplateOutlet=\"linkTemplate\"></ng-container>\n        </ng-template>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"'button'\">\n        <ng-container [ngSwitch]=\"key\">\n            <ng-container *ngSwitchCase=\"'ObjectMenu'\">\n                <span (click)=\"onButtonClicked($event)\" title=\"{{ key }}\">\n                    <mat-icon>\n                        <pep-icon *ngIf=\"key == 'ObjectMenu'\" name=\"system_menu\">\n                        </pep-icon>\n                    </mat-icon>\n                </span>\n            </ng-container>\n\n            <ng-container *ngSwitchCase=\"'Agents' || 'ContactPersons' || 'Buyers'\">\n                <ng-container *ngIf=\"layoutType === 'table'; then tableBlock; else nonTableBlock\">\n                </ng-container>\n                <ng-template #nonTableBlock>\n                    <ng-container *ngTemplateOutlet=\"buttonTemplate; context: {internal: true}\"></ng-container>\n                </ng-template>\n                <ng-template #tableBlock>\n                    <span [id]=\"key\" title=\"{{ formattedValue }}\" class=\"pep-report-input readonly body-sm\">{{\n                        formattedValue }}</span>\n                </ng-template>\n            </ng-container>\n\n            <ng-container *ngSwitchDefault>\n                <ng-container *ngIf=\"layoutType === 'form'; then buttonBlock; else linkBlock\">\n                </ng-container>\n\n                <ng-template #buttonBlock>\n                    <ng-container *ngTemplateOutlet=\"buttonTemplate; context: {internal: false}\"></ng-container>\n                </ng-template>\n                <ng-template #linkBlock>\n                    <ng-container *ngTemplateOutlet=\"linkTemplate\"></ng-container>\n                </ng-template>\n            </ng-container>\n        </ng-container>\n    </ng-container>\n</ng-container>\n\n<ng-template #buttonTemplate let-internal=\"internal\">\n    <div class=\"pep-button-container\">\n        <pep-field-title [label]=\"label\" [mandatory]=\"mandatory\" [disabled]=\"disabled\" [xAlignment]=\"xAlignment\"\n            [showTitle]=\"showTitle\">\n        </pep-field-title>\n\n        <ng-container *ngIf=\"internal; then internalButtonTemplate; else regularButtonTemplate\"></ng-container>\n        <ng-template #regularButtonTemplate>\n            <button [id]=\"key\" title=\"{{ formattedValue }}\" mat-button class=\"pep-button md regular\"\n                dir=\"{{ xAlignment == 'right' ? 'rtl' : 'ltr' }}\" (click)=\"onButtonClicked($event)\"\n                [disabled]=\"disabled\"\n                [ngClass]=\"{disabled: disabled, 'pull-left': xAlignment == 'left', 'pull-right': xAlignment == 'right', 'center-alignment': xAlignment == 'center'}\">\n                {{ formattedValue }}\n            </button>\n        </ng-template>\n\n        <ng-template #internalButtonTemplate>\n            <button [id]=\"key\" title=\"{{ formattedValue }}\" mat-button class=\"pep-button md regular\"\n                dir=\"{{ xAlignment == 'right' ? 'rtl' : 'ltr' }}\" (click)=\"openReferenceObjectInternal($event)\"\n                [disabled]=\"disabled\"\n                [ngClass]=\"{disabled: disabled, 'pull-left': xAlignment == 'left', 'pull-right': xAlignment == 'right', 'center-alignment': xAlignment == 'center'}\">\n                <ng-container *ngIf=\"formattedValue == '0' || formattedValue == ''; then newBlock; else existingBlock\">\n                </ng-container>\n                <ng-template #newBlock>\n                    <span class=\"pull-left flip button-title-with-icon\">{{ 'LIST.SELECT' | translate }}&nbsp;</span>\n                    <mat-icon>\n                        <pep-icon name=\"number_plus\">\n                        </pep-icon>\n                    </mat-icon>\n                </ng-template>\n                <ng-template #existingBlock>\n                    <span class=\"pull-left flip button-title-with-icon\">{{ formattedValue }}&nbsp;{{ 'LIST.SELECTED' |\n                        translate\n                        }}&nbsp;</span>\n                    <mat-icon>\n                        <pep-icon name=\"system_edit\">\n                        </pep-icon>\n                    </mat-icon>\n                </ng-template>\n            </button>\n        </ng-template>\n    </div>\n</ng-template>\n\n<ng-template #linkTemplate>\n    <ng-container *ngIf=\"formattedValue?.length > 0; then notEmptyBlock; else emptyBlock\"></ng-container>\n    <ng-template #notEmptyBlock>\n        <a href=\"{{ value }}\" (mousedown)=\"hrefFunction($event)\" class=\"color-link\">\n            <span *ngIf=\"layoutType === 'table'\" [id]=\"key\" title=\"{{ formattedValue }}\"\n                class=\"body-sm pep-report-input readonly\">\n                {{ formattedValue }}\n            </span>\n            <span *ngIf=\"layoutType !== 'table'\" [id]=\"key\" title=\"{{ formattedValue }}\" class=\"body-sm pep-card-input\"\n                style=\"display: block;\">\n                {{ formattedValue }}\n            </span>\n        </a>\n    </ng-template>\n    <ng-template #emptyBlock>\n        <span>&nbsp;</span>\n    </ng-template>\n</ng-template>", styles: [":host{height:inherit;display:grid}:host>*{align-self:center}.pepperi-button-container,.pep-button-container{height:-moz-fit-content;height:fit-content}.pepperi-button-container .center-alignment,.pep-button-container .center-alignment{position:absolute;left:50%;transform:translate(-50%)}.pepperi-button-container.reference-button ::ng-deep .split-buttons,.pepperi-button-container.reference-button .split-buttons,.pep-button-container.reference-button ::ng-deep .split-buttons,.pep-button-container.reference-button .split-buttons{float:left}.pepperi-button-container.reference-button ::ng-deep .split-buttons button:last-of-type,.pepperi-button-container.reference-button .split-buttons button:last-of-type,.pep-button-container.reference-button ::ng-deep .split-buttons button:last-of-type,.pep-button-container.reference-button .split-buttons button:last-of-type{width:1.5rem;padding:0}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i3.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1.PepRtlClassDirective, selector: "[pepRtlClass]" }, { kind: "component", type: i6.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }, { kind: "component", type: i7.PepFieldTitleComponent, selector: "pep-field-title", inputs: ["label", "mandatory", "disabled", "maxFieldCharacters", "hint", "xAlignment", "showTitle", "inputLength"] }, { kind: "component", type: i8.PepGroupButtonsComponent, selector: "pep-group-buttons", inputs: ["viewType", "styleType", "sizeType", "buttons", "buttonsDisabled", "selectedButtonKey", "stretch"], outputs: ["buttonClick"] }, { kind: "pipe", type: i9.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepInternalButtonComponent, decorators: [{
+PepInternalButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepInternalButtonComponent, deps: [{ token: i1.PepCustomizationService }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+PepInternalButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PepInternalButtonComponent, selector: "pep-internal-button", inputs: { key: "key", value: "value", formattedValue: "formattedValue", label: "label", referenceObjectInternalType: "referenceObjectInternalType", type: "type", mandatory: "mandatory", disabled: "disabled", readonly: "readonly", xAlignment: "xAlignment", rowSpan: "rowSpan", visible: "visible", form: "form", showTitle: "showTitle", layoutType: "layoutType" }, outputs: { elementClick: "elementClick", valueChange: "valueChange" }, usesOnChanges: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"type\">\n    <ng-container *ngSwitchCase=\"'reference'\">\n        <ng-container *ngIf=\"layoutType === 'form'; then formBlock; else notFormBlock\"></ng-container>\n        <ng-template #formBlock>\n            <div class=\"pep-button-container reference-button\">\n                <pep-field-title [label]=\"label\" [mandatory]=\"mandatory\" [disabled]=\"disabled\" [xAlignment]=\"xAlignment\"\n                    [showTitle]=\"showTitle\">\n                </pep-field-title>\n                <ng-container *ngIf=\"createNewReference; then newBlock; else existingBlock\"></ng-container>\n                <ng-template #newBlock>\n                    <button mat-button [id]=\"key\" title=\"{{ formattedValue }}\" class=\"pep-button md regular\"\n                        (click)=\"onButtonClicked($event)\" [ngClass]=\"{\n                            disabled: disabled,\n                            'pull-left': xAlignment == 'left',\n                            'pull-right': xAlignment == 'right',\n                            'center-alignment': xAlignment == 'center'\n                        }\">\n                        <span class=\"ellipsis pull-left flip button-title-with-icon\">{{ 'ACTIONS.CREATE_NEW' | translate\n                            }}</span>\n                        <mat-icon class=\"pull-right flip\" pepRtlClass>\n                            <pep-icon name=\"number_plus\" (click)=\"onButtonClicked($event)\">\n                            </pep-icon>\n                        </mat-icon>\n                    </button>\n                </ng-template>\n                <ng-template #existingBlock>\n                    <pep-group-buttons [buttons]=\"referenceButtons\" styleType=\"regular\" viewType=\"split\">\n                    </pep-group-buttons>\n                </ng-template>\n            </div>\n        </ng-template>\n        <ng-template #notFormBlock>\n            <ng-container *ngTemplateOutlet=\"linkTemplate\"></ng-container>\n        </ng-template>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"'listofobjects'\">\n        <ng-container *ngIf=\"layoutType === 'form'; then formBlock; else notFormBlock\"></ng-container>\n        <ng-template #formBlock>\n            <ng-container *ngTemplateOutlet=\"buttonTemplate; context: {internal: true}\"></ng-container>\n        </ng-template>\n        <ng-template #notFormBlock>\n            <ng-container *ngTemplateOutlet=\"linkTemplate\"></ng-container>\n        </ng-template>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"'button'\">\n        <ng-container [ngSwitch]=\"key\">\n            <ng-container *ngSwitchCase=\"'ObjectMenu'\">\n                <span (click)=\"onButtonClicked($event)\" title=\"{{ key }}\">\n                    <mat-icon>\n                        <pep-icon *ngIf=\"key == 'ObjectMenu'\" name=\"system_menu\">\n                        </pep-icon>\n                    </mat-icon>\n                </span>\n            </ng-container>\n\n            <ng-container *ngSwitchCase=\"'Agents' || 'ContactPersons' || 'Buyers'\">\n                <ng-container *ngIf=\"layoutType === 'table'; then tableBlock; else nonTableBlock\">\n                </ng-container>\n                <ng-template #nonTableBlock>\n                    <ng-container *ngTemplateOutlet=\"buttonTemplate; context: {internal: true}\"></ng-container>\n                </ng-template>\n                <ng-template #tableBlock>\n                    <span [id]=\"key\" title=\"{{ formattedValue }}\" class=\"pep-report-input readonly body-sm\">{{\n                        formattedValue }}</span>\n                </ng-template>\n            </ng-container>\n\n            <ng-container *ngSwitchDefault>\n                <ng-container *ngIf=\"layoutType === 'form'; then buttonBlock; else linkBlock\">\n                </ng-container>\n\n                <ng-template #buttonBlock>\n                    <ng-container *ngTemplateOutlet=\"buttonTemplate; context: {internal: false}\"></ng-container>\n                </ng-template>\n                <ng-template #linkBlock>\n                    <ng-container *ngTemplateOutlet=\"linkTemplate\"></ng-container>\n                </ng-template>\n            </ng-container>\n        </ng-container>\n    </ng-container>\n</ng-container>\n\n<ng-template #buttonTemplate let-internal=\"internal\">\n    <div class=\"pep-button-container\">\n        <pep-field-title [label]=\"label\" [mandatory]=\"mandatory\" [disabled]=\"disabled\" [xAlignment]=\"xAlignment\"\n            [showTitle]=\"showTitle\">\n        </pep-field-title>\n\n        <ng-container *ngIf=\"internal; then internalButtonTemplate; else regularButtonTemplate\"></ng-container>\n        <ng-template #regularButtonTemplate>\n            <button [id]=\"key\" title=\"{{ formattedValue }}\" mat-button class=\"pep-button md regular\"\n                dir=\"{{ xAlignment == 'right' ? 'rtl' : 'ltr' }}\" (click)=\"onButtonClicked($event)\"\n                [disabled]=\"disabled\"\n                [ngClass]=\"{disabled: disabled, 'pull-left': xAlignment == 'left', 'pull-right': xAlignment == 'right', 'center-alignment': xAlignment == 'center'}\">\n                {{ formattedValue }}\n            </button>\n        </ng-template>\n\n        <ng-template #internalButtonTemplate>\n            <button [id]=\"key\" title=\"{{ formattedValue }}\" mat-button class=\"pep-button md regular\"\n                dir=\"{{ xAlignment == 'right' ? 'rtl' : 'ltr' }}\" (click)=\"openReferenceObjectInternal($event)\"\n                [disabled]=\"disabled\"\n                [ngClass]=\"{disabled: disabled, 'pull-left': xAlignment == 'left', 'pull-right': xAlignment == 'right', 'center-alignment': xAlignment == 'center'}\">\n                <ng-container *ngIf=\"formattedValue == '0' || formattedValue == ''; then newBlock; else existingBlock\">\n                </ng-container>\n                <ng-template #newBlock>\n                    <span class=\"pull-left flip button-title-with-icon\">{{ 'LIST.SELECT' | translate }}&nbsp;</span>\n                    <mat-icon>\n                        <pep-icon name=\"number_plus\">\n                        </pep-icon>\n                    </mat-icon>\n                </ng-template>\n                <ng-template #existingBlock>\n                    <span class=\"pull-left flip button-title-with-icon\">{{ formattedValue }}&nbsp;{{ 'LIST.SELECTED' |\n                        translate\n                        }}&nbsp;</span>\n                    <mat-icon>\n                        <pep-icon name=\"system_edit\">\n                        </pep-icon>\n                    </mat-icon>\n                </ng-template>\n            </button>\n        </ng-template>\n    </div>\n</ng-template>\n\n<ng-template #linkTemplate>\n    <ng-container *ngIf=\"formattedValue?.length > 0; then notEmptyBlock; else emptyBlock\"></ng-container>\n    <ng-template #notEmptyBlock>\n        <a href=\"{{ value }}\" (mousedown)=\"hrefFunction($event)\" class=\"color-link\">\n            <span *ngIf=\"layoutType === 'table'\" [id]=\"key\" title=\"{{ formattedValue }}\"\n                class=\"body-sm pep-report-input readonly\">\n                {{ formattedValue }}\n            </span>\n            <span *ngIf=\"layoutType !== 'table'\" [id]=\"key\" title=\"{{ formattedValue }}\" class=\"body-sm pep-card-input\"\n                style=\"display: block;\">\n                {{ formattedValue }}\n            </span>\n        </a>\n    </ng-template>\n    <ng-template #emptyBlock>\n        <span>&nbsp;</span>\n    </ng-template>\n</ng-template>", styles: [":host{height:inherit;display:grid}:host>*{align-self:center}.pepperi-button-container,.pep-button-container{height:-moz-fit-content;height:fit-content}.pepperi-button-container .center-alignment,.pep-button-container .center-alignment{position:absolute;left:50%;transform:translate(-50%)}.pepperi-button-container.reference-button ::ng-deep .split-buttons,.pepperi-button-container.reference-button .split-buttons,.pep-button-container.reference-button ::ng-deep .split-buttons,.pep-button-container.reference-button .split-buttons{float:left}.pepperi-button-container.reference-button ::ng-deep .split-buttons button:last-of-type,.pepperi-button-container.reference-button .split-buttons button:last-of-type,.pep-button-container.reference-button ::ng-deep .split-buttons button:last-of-type,.pep-button-container.reference-button .split-buttons button:last-of-type{width:1.5rem;padding:0}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i3.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1.PepRtlClassDirective, selector: "[pepRtlClass]" }, { kind: "component", type: i6.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }, { kind: "component", type: i7.PepFieldTitleComponent, selector: "pep-field-title", inputs: ["label", "mandatory", "disabled", "maxFieldCharacters", "hint", "xAlignment", "showTitle", "inputLength"] }, { kind: "component", type: i8.PepGroupButtonsComponent, selector: "pep-group-buttons", inputs: ["viewType", "styleType", "sizeType", "buttons", "buttonsDisabled", "selectedButtonKey", "stretch"], outputs: ["buttonClick"] }, { kind: "pipe", type: i9.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepInternalButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'pep-internal-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [ngSwitch]=\"type\">\n    <ng-container *ngSwitchCase=\"'reference'\">\n        <ng-container *ngIf=\"layoutType === 'form'; then formBlock; else notFormBlock\"></ng-container>\n        <ng-template #formBlock>\n            <div class=\"pep-button-container reference-button\">\n                <pep-field-title [label]=\"label\" [mandatory]=\"mandatory\" [disabled]=\"disabled\" [xAlignment]=\"xAlignment\"\n                    [showTitle]=\"showTitle\">\n                </pep-field-title>\n                <ng-container *ngIf=\"createNewReference; then newBlock; else existingBlock\"></ng-container>\n                <ng-template #newBlock>\n                    <button mat-button [id]=\"key\" title=\"{{ formattedValue }}\" class=\"pep-button md regular\"\n                        (click)=\"onButtonClicked($event)\" [ngClass]=\"{\n                            disabled: disabled,\n                            'pull-left': xAlignment == 'left',\n                            'pull-right': xAlignment == 'right',\n                            'center-alignment': xAlignment == 'center'\n                        }\">\n                        <span class=\"ellipsis pull-left flip button-title-with-icon\">{{ 'ACTIONS.CREATE_NEW' | translate\n                            }}</span>\n                        <mat-icon class=\"pull-right flip\" pepRtlClass>\n                            <pep-icon name=\"number_plus\" (click)=\"onButtonClicked($event)\">\n                            </pep-icon>\n                        </mat-icon>\n                    </button>\n                </ng-template>\n                <ng-template #existingBlock>\n                    <pep-group-buttons [buttons]=\"referenceButtons\" styleType=\"regular\" viewType=\"split\">\n                    </pep-group-buttons>\n                </ng-template>\n            </div>\n        </ng-template>\n        <ng-template #notFormBlock>\n            <ng-container *ngTemplateOutlet=\"linkTemplate\"></ng-container>\n        </ng-template>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"'listofobjects'\">\n        <ng-container *ngIf=\"layoutType === 'form'; then formBlock; else notFormBlock\"></ng-container>\n        <ng-template #formBlock>\n            <ng-container *ngTemplateOutlet=\"buttonTemplate; context: {internal: true}\"></ng-container>\n        </ng-template>\n        <ng-template #notFormBlock>\n            <ng-container *ngTemplateOutlet=\"linkTemplate\"></ng-container>\n        </ng-template>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"'button'\">\n        <ng-container [ngSwitch]=\"key\">\n            <ng-container *ngSwitchCase=\"'ObjectMenu'\">\n                <span (click)=\"onButtonClicked($event)\" title=\"{{ key }}\">\n                    <mat-icon>\n                        <pep-icon *ngIf=\"key == 'ObjectMenu'\" name=\"system_menu\">\n                        </pep-icon>\n                    </mat-icon>\n                </span>\n            </ng-container>\n\n            <ng-container *ngSwitchCase=\"'Agents' || 'ContactPersons' || 'Buyers'\">\n                <ng-container *ngIf=\"layoutType === 'table'; then tableBlock; else nonTableBlock\">\n                </ng-container>\n                <ng-template #nonTableBlock>\n                    <ng-container *ngTemplateOutlet=\"buttonTemplate; context: {internal: true}\"></ng-container>\n                </ng-template>\n                <ng-template #tableBlock>\n                    <span [id]=\"key\" title=\"{{ formattedValue }}\" class=\"pep-report-input readonly body-sm\">{{\n                        formattedValue }}</span>\n                </ng-template>\n            </ng-container>\n\n            <ng-container *ngSwitchDefault>\n                <ng-container *ngIf=\"layoutType === 'form'; then buttonBlock; else linkBlock\">\n                </ng-container>\n\n                <ng-template #buttonBlock>\n                    <ng-container *ngTemplateOutlet=\"buttonTemplate; context: {internal: false}\"></ng-container>\n                </ng-template>\n                <ng-template #linkBlock>\n                    <ng-container *ngTemplateOutlet=\"linkTemplate\"></ng-container>\n                </ng-template>\n            </ng-container>\n        </ng-container>\n    </ng-container>\n</ng-container>\n\n<ng-template #buttonTemplate let-internal=\"internal\">\n    <div class=\"pep-button-container\">\n        <pep-field-title [label]=\"label\" [mandatory]=\"mandatory\" [disabled]=\"disabled\" [xAlignment]=\"xAlignment\"\n            [showTitle]=\"showTitle\">\n        </pep-field-title>\n\n        <ng-container *ngIf=\"internal; then internalButtonTemplate; else regularButtonTemplate\"></ng-container>\n        <ng-template #regularButtonTemplate>\n            <button [id]=\"key\" title=\"{{ formattedValue }}\" mat-button class=\"pep-button md regular\"\n                dir=\"{{ xAlignment == 'right' ? 'rtl' : 'ltr' }}\" (click)=\"onButtonClicked($event)\"\n                [disabled]=\"disabled\"\n                [ngClass]=\"{disabled: disabled, 'pull-left': xAlignment == 'left', 'pull-right': xAlignment == 'right', 'center-alignment': xAlignment == 'center'}\">\n                {{ formattedValue }}\n            </button>\n        </ng-template>\n\n        <ng-template #internalButtonTemplate>\n            <button [id]=\"key\" title=\"{{ formattedValue }}\" mat-button class=\"pep-button md regular\"\n                dir=\"{{ xAlignment == 'right' ? 'rtl' : 'ltr' }}\" (click)=\"openReferenceObjectInternal($event)\"\n                [disabled]=\"disabled\"\n                [ngClass]=\"{disabled: disabled, 'pull-left': xAlignment == 'left', 'pull-right': xAlignment == 'right', 'center-alignment': xAlignment == 'center'}\">\n                <ng-container *ngIf=\"formattedValue == '0' || formattedValue == ''; then newBlock; else existingBlock\">\n                </ng-container>\n                <ng-template #newBlock>\n                    <span class=\"pull-left flip button-title-with-icon\">{{ 'LIST.SELECT' | translate }}&nbsp;</span>\n                    <mat-icon>\n                        <pep-icon name=\"number_plus\">\n                        </pep-icon>\n                    </mat-icon>\n                </ng-template>\n                <ng-template #existingBlock>\n                    <span class=\"pull-left flip button-title-with-icon\">{{ formattedValue }}&nbsp;{{ 'LIST.SELECTED' |\n                        translate\n                        }}&nbsp;</span>\n                    <mat-icon>\n                        <pep-icon name=\"system_edit\">\n                        </pep-icon>\n                    </mat-icon>\n                </ng-template>\n            </button>\n        </ng-template>\n    </div>\n</ng-template>\n\n<ng-template #linkTemplate>\n    <ng-container *ngIf=\"formattedValue?.length > 0; then notEmptyBlock; else emptyBlock\"></ng-container>\n    <ng-template #notEmptyBlock>\n        <a href=\"{{ value }}\" (mousedown)=\"hrefFunction($event)\" class=\"color-link\">\n            <span *ngIf=\"layoutType === 'table'\" [id]=\"key\" title=\"{{ formattedValue }}\"\n                class=\"body-sm pep-report-input readonly\">\n                {{ formattedValue }}\n            </span>\n            <span *ngIf=\"layoutType !== 'table'\" [id]=\"key\" title=\"{{ formattedValue }}\" class=\"body-sm pep-card-input\"\n                style=\"display: block;\">\n                {{ formattedValue }}\n            </span>\n        </a>\n    </ng-template>\n    <ng-template #emptyBlock>\n        <span>&nbsp;</span>\n    </ng-template>\n</ng-template>", styles: [":host{height:inherit;display:grid}:host>*{align-self:center}.pepperi-button-container,.pep-button-container{height:-moz-fit-content;height:fit-content}.pepperi-button-container .center-alignment,.pep-button-container .center-alignment{position:absolute;left:50%;transform:translate(-50%)}.pepperi-button-container.reference-button ::ng-deep .split-buttons,.pepperi-button-container.reference-button .split-buttons,.pep-button-container.reference-button ::ng-deep .split-buttons,.pep-button-container.reference-button .split-buttons{float:left}.pepperi-button-container.reference-button ::ng-deep .split-buttons button:last-of-type,.pepperi-button-container.reference-button .split-buttons button:last-of-type,.pep-button-container.reference-button ::ng-deep .split-buttons button:last-of-type,.pep-button-container.reference-button .split-buttons button:last-of-type{width:1.5rem;padding:0}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.PepCustomizationService }, { type: i0.Renderer2 }, { type: i0.ElementRef }]; }, propDecorators: { key: [{

package/esm2020/form/internal-carusel.component.mjs

@@ -99,9 +99,9 @@ export class PepInternalCaruselComponent {
         this.nextDisabled = event;
     }
 }
-PepInternalCaruselComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepInternalCaruselComponent, deps: [{ token: i1.FormBuilder }, { token: i2.PepLayoutService }, { token: i3.PepInternalCaruselService }], target: i0.ɵɵFactoryTarget.Component });
-PepInternalCaruselComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.1", type: PepInternalCaruselComponent, selector: "pep-internal-carusel", inputs: { field: "field", layoutType: "layoutType" }, outputs: { internalFormFieldChange: "internalFormFieldChange", internalFormFieldClick: "internalFormFieldClick" }, providers: [PepInternalCaruselService], viewQueries: [{ propertyName: "carousel", first: true, predicate: ["carousel"], descendants: true, read: PepCarouselComponent }], ngImport: i0, template: "<div class=\"carousel-container\">\n    <ng-container *ngIf=\"items?.length > 0; then carouselBlock; else emptyBlock\"></ng-container>\n    <ng-template #emptyBlock>\n        <!-- No items -->\n    </ng-template>\n    <ng-template #carouselBlock>\n        <pep-button *ngIf=\"screenSize <= PepScreenSizeType.SM\" [iconName]=\"'arrow_left_alt'\" [styleType]=\"'regular'\"\n            [disabled]=\"prevDisabled\" (click)=\"moveLeft()\" class=\"carousel-arrow start-arrow\">\n        </pep-button>\n        <pep-carousel #carousel [xWheelEnabled]=\"false\" [snapDuration]=\"duration\"\n            (reachesLeftBound)=\"onReachesLeftBound($event)\" (reachesRightBound)=\"onReachesRightBound($event)\">\n            <ng-container *ngFor=\"let item of items\">\n                <pep-internal-form pepCarouselItem [layout]=\"layout\" [data]=\"item\" [layoutType]=\"'card'\" class=\"card-view \"\n                    (valueChange)=\"onCustomizeObjectChanged($event)\" (fieldClick)=\"onCustomizeFieldClick($event)\">\n                </pep-internal-form>\n            </ng-container>\n        </pep-carousel>\n        <pep-button *ngIf=\"screenSize <= PepScreenSizeType.SM\" [iconName]=\"'arrow_right_alt'\" [styleType]=\"'regular'\"\n            [disabled]=\"nextDisabled\" (click)=\"moveRight()\" class=\"carousel-arrow end-arrow\">\n        </pep-button>\n    </ng-template>\n</div>", styles: [".carousel-container{position:relative;margin:0;display:grid}.carousel-container .carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:1}.carousel-container .carousel-arrow.start-arrow{left:0}.carousel-container .carousel-arrow.end-arrow{right:0}.carousel-container ::ng-deep .carousel-content .card-view{padding:var(--pep-spacing-sm, .5rem) 0!important}.carousel-container ::ng-deep .carousel-content .card-view:first-child{padding-inline-start:var(--pep-spacing-sm, .5rem)!important}.carousel-container ::ng-deep .carousel-content .card-view:last-child{padding-inline-end:var(--pep-spacing-sm, .5rem)!important}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.PepButtonComponent, selector: "pep-button", inputs: ["key", "value", "styleType", "styleStateType", "sizeType", "classNames", "disabled", "iconName", "iconPosition", "visible"], outputs: ["buttonClick"] }, { kind: "component", type: i6.PepCarouselComponent, selector: "pep-carousel", inputs: ["scrollbarHidden", "disabled", "xDisabled", "yDisabled", "xWheelEnabled", "dragDisabled", "snapDisabled", "snapOffset", "snapDuration"], outputs: ["dsInitialized", "indexChanged", "reachesLeftBound", "reachesRightBound", "snapAnimationFinished", "dragStart", "dragEnd"] }, { kind: "directive", type: i6.PepCarouselItemDirective, selector: "[pepCarouselItem]", inputs: ["dragDisabled"] }, { kind: "component", type: i7.PepInternalFormComponent, selector: "pep-internal-form", inputs: ["isInternal", "isReport", "layout", "lockEvents", "canEditObject", "data", "lockFields", "isActive", "layoutType", "objectId", "parentId", "searchCode", "showTitle", "firstFieldAsLink", "checkForChanges"], outputs: ["valueChange", "formValidationChange", "fieldClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepInternalCaruselComponent, decorators: [{
+PepInternalCaruselComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepInternalCaruselComponent, deps: [{ token: i1.FormBuilder }, { token: i2.PepLayoutService }, { token: i3.PepInternalCaruselService }], target: i0.ɵɵFactoryTarget.Component });
+PepInternalCaruselComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PepInternalCaruselComponent, selector: "pep-internal-carusel", inputs: { field: "field", layoutType: "layoutType" }, outputs: { internalFormFieldChange: "internalFormFieldChange", internalFormFieldClick: "internalFormFieldClick" }, providers: [PepInternalCaruselService], viewQueries: [{ propertyName: "carousel", first: true, predicate: ["carousel"], descendants: true, read: PepCarouselComponent }], ngImport: i0, template: "<div class=\"carousel-container\">\n    <ng-container *ngIf=\"items?.length > 0; then carouselBlock; else emptyBlock\"></ng-container>\n    <ng-template #emptyBlock>\n        <!-- No items -->\n    </ng-template>\n    <ng-template #carouselBlock>\n        <pep-button *ngIf=\"screenSize <= PepScreenSizeType.SM\" [iconName]=\"'arrow_left_alt'\" [styleType]=\"'regular'\"\n            [disabled]=\"prevDisabled\" (click)=\"moveLeft()\" class=\"carousel-arrow start-arrow\">\n        </pep-button>\n        <pep-carousel #carousel [xWheelEnabled]=\"false\" [snapDuration]=\"duration\"\n            (reachesLeftBound)=\"onReachesLeftBound($event)\" (reachesRightBound)=\"onReachesRightBound($event)\">\n            <ng-container *ngFor=\"let item of items\">\n                <pep-internal-form pepCarouselItem [layout]=\"layout\" [data]=\"item\" [layoutType]=\"'card'\" class=\"card-view \"\n                    (valueChange)=\"onCustomizeObjectChanged($event)\" (fieldClick)=\"onCustomizeFieldClick($event)\">\n                </pep-internal-form>\n            </ng-container>\n        </pep-carousel>\n        <pep-button *ngIf=\"screenSize <= PepScreenSizeType.SM\" [iconName]=\"'arrow_right_alt'\" [styleType]=\"'regular'\"\n            [disabled]=\"nextDisabled\" (click)=\"moveRight()\" class=\"carousel-arrow end-arrow\">\n        </pep-button>\n    </ng-template>\n</div>", styles: [".carousel-container{position:relative;margin:0;display:grid}.carousel-container .carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:1}.carousel-container .carousel-arrow.start-arrow{left:0}.carousel-container .carousel-arrow.end-arrow{right:0}.carousel-container ::ng-deep .carousel-content .card-view{padding:var(--pep-spacing-sm, .5rem) 0!important}.carousel-container ::ng-deep .carousel-content .card-view:first-child{padding-inline-start:var(--pep-spacing-sm, .5rem)!important}.carousel-container ::ng-deep .carousel-content .card-view:last-child{padding-inline-end:var(--pep-spacing-sm, .5rem)!important}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.PepButtonComponent, selector: "pep-button", inputs: ["key", "value", "styleType", "styleStateType", "sizeType", "classNames", "disabled", "iconName", "iconPosition", "visible"], outputs: ["buttonClick"] }, { kind: "component", type: i6.PepCarouselComponent, selector: "pep-carousel", inputs: ["scrollbarHidden", "disabled", "xDisabled", "yDisabled", "xWheelEnabled", "dragDisabled", "snapDisabled", "snapOffset", "snapDuration"], outputs: ["dsInitialized", "indexChanged", "reachesLeftBound", "reachesRightBound", "snapAnimationFinished", "dragStart", "dragEnd"] }, { kind: "directive", type: i6.PepCarouselItemDirective, selector: "[pepCarouselItem]", inputs: ["dragDisabled"] }, { kind: "component", type: i7.PepInternalFormComponent, selector: "pep-internal-form", inputs: ["isInternal", "isReport", "layout", "lockEvents", "canEditObject", "data", "lockFields", "isActive", "layoutType", "objectId", "parentId", "searchCode", "showTitle", "firstFieldAsLink", "checkForChanges"], outputs: ["valueChange", "formValidationChange", "fieldClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepInternalCaruselComponent, decorators: [{
             type: Component,
             args: [{ selector: 'pep-internal-carusel', providers: [PepInternalCaruselService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"carousel-container\">\n    <ng-container *ngIf=\"items?.length > 0; then carouselBlock; else emptyBlock\"></ng-container>\n    <ng-template #emptyBlock>\n        <!-- No items -->\n    </ng-template>\n    <ng-template #carouselBlock>\n        <pep-button *ngIf=\"screenSize <= PepScreenSizeType.SM\" [iconName]=\"'arrow_left_alt'\" [styleType]=\"'regular'\"\n            [disabled]=\"prevDisabled\" (click)=\"moveLeft()\" class=\"carousel-arrow start-arrow\">\n        </pep-button>\n        <pep-carousel #carousel [xWheelEnabled]=\"false\" [snapDuration]=\"duration\"\n            (reachesLeftBound)=\"onReachesLeftBound($event)\" (reachesRightBound)=\"onReachesRightBound($event)\">\n            <ng-container *ngFor=\"let item of items\">\n                <pep-internal-form pepCarouselItem [layout]=\"layout\" [data]=\"item\" [layoutType]=\"'card'\" class=\"card-view \"\n                    (valueChange)=\"onCustomizeObjectChanged($event)\" (fieldClick)=\"onCustomizeFieldClick($event)\">\n                </pep-internal-form>\n            </ng-container>\n        </pep-carousel>\n        <pep-button *ngIf=\"screenSize <= PepScreenSizeType.SM\" [iconName]=\"'arrow_right_alt'\" [styleType]=\"'regular'\"\n            [disabled]=\"nextDisabled\" (click)=\"moveRight()\" class=\"carousel-arrow end-arrow\">\n        </pep-button>\n    </ng-template>\n</div>", styles: [".carousel-container{position:relative;margin:0;display:grid}.carousel-container .carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:1}.carousel-container .carousel-arrow.start-arrow{left:0}.carousel-container .carousel-arrow.end-arrow{right:0}.carousel-container ::ng-deep .carousel-content .card-view{padding:var(--pep-spacing-sm, .5rem) 0!important}.carousel-container ::ng-deep .carousel-content .card-view:first-child{padding-inline-start:var(--pep-spacing-sm, .5rem)!important}.carousel-container ::ng-deep .carousel-content .card-view:last-child{padding-inline-end:var(--pep-spacing-sm, .5rem)!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.FormBuilder }, { type: i2.PepLayoutService }, { type: i3.PepInternalCaruselService }]; }, propDecorators: { carousel: [{

package/esm2020/form/internal-carusel.service.mjs

@@ -24,9 +24,9 @@ export class PepInternalCaruselService {
         );
     }
 }
-PepInternalCaruselService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepInternalCaruselService, deps: [{ token: i1.PepHttpService }], target: i0.ɵɵFactoryTarget.Injectable });
-PepInternalCaruselService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepInternalCaruselService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: PepInternalCaruselService, decorators: [{
+PepInternalCaruselService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepInternalCaruselService, deps: [{ token: i1.PepHttpService }], target: i0.ɵɵFactoryTarget.Injectable });
+PepInternalCaruselService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepInternalCaruselService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepInternalCaruselService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i1.PepHttpService }]; } });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW50ZXJuYWwtY2FydXNlbC5zZXJ2aWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWxpYi9mb3JtL2ludGVybmFsLWNhcnVzZWwuc2VydmljZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFJM0MsTUFBTSxPQUFPLHlCQUF5QjtJQUdsQyxZQUFvQixXQUEyQjtRQUEzQixnQkFBVyxHQUFYLFdBQVcsQ0FBZ0I7UUFDM0MsSUFBSSxDQUFDLFFBQVEsR0FBRywyQkFBMkIsQ0FBQztJQUNoRCxDQUFDO0lBRUQsU0FBUyxDQUFDLFdBQW1CLEVBQUUsUUFBZ0IsRUFBRSxVQUFrQixFQUFFLFNBQWlCLEVBQUUsWUFBaUI7UUFDckcsTUFBTSxJQUFJLEdBQUc7WUFDVCxVQUFVLEVBQUUsU0FBUztZQUNyQixXQUFXLEVBQUUsSUFBSSxDQUFDLFNBQVMsQ0FBQztnQkFDeEIsV0FBVyxFQUFFLFdBQVc7Z0JBQ3hCLE9BQU8sRUFBRSxRQUFRO2dCQUNqQixLQUFLLEVBQUUsVUFBVTthQUNwQixDQUFDO1NBQ0wsQ0FBQztRQUVGLElBQUksQ0FBQyxXQUFXLENBQUMsZUFBZSxDQUFDLEdBQUcsSUFBSSxDQUFDLFFBQVEsRUFBRSxFQUFFLElBQUksQ0FBQyxDQUFDLFNBQVMsQ0FDaEUsQ0FBQyxHQUFHLEVBQUUsRUFBRTtZQUNKLE9BQU8sQ0FBQyxHQUFHLENBQUMsR0FBRyxDQUFDLENBQUM7WUFDakIsWUFBWSxDQUFDLEdBQUcsQ0FBQyxDQUFDO1FBQ3RCLENBQUM7UUFDRCxpQkFBaUI7UUFDakIsV0FBVztTQUNkLENBQUM7SUFDTixDQUFDOztzSEF6QlEseUJBQXlCOzBIQUF6Qix5QkFBeUI7MkZBQXpCLHlCQUF5QjtrQkFEckMsVUFBVSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEluamVjdGFibGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFBlcEh0dHBTZXJ2aWNlIH0gZnJvbSAnQHBlcHBlcmktYWRkb25zL25neC1saWInO1xuXG5ASW5qZWN0YWJsZSgpXG5leHBvcnQgY2xhc3MgUGVwSW50ZXJuYWxDYXJ1c2VsU2VydmljZSB7XG4gICAgcHJpdmF0ZSBldmVudFVybDogc3RyaW5nO1xuXG4gICAgY29uc3RydWN0b3IocHJpdmF0ZSBodHRwU2VydmljZTogUGVwSHR0cFNlcnZpY2UpIHtcbiAgICAgICAgdGhpcy5ldmVudFVybCA9ICdTZXJ2aWNlMS5zdmMvdjEvRW1pdEV2ZW50JztcbiAgICB9XG5cbiAgICBlbWl0RXZlbnQodWlPYmplY3RLZXk6IHN0cmluZywgZmllbGRLZXk6IHN0cmluZywgZmllbGRWYWx1ZTogc3RyaW5nLCBldmVudE5hbWU6IHN0cmluZywgY2FsbGJhY2tGdW5jOiBhbnkpIHtcbiAgICAgICAgY29uc3QgYm9keSA9IHtcbiAgICAgICAgICAgICdFdmVudEtleSc6IGV2ZW50TmFtZSxcbiAgICAgICAgICAgICdFdmVudERhdGEnOiBKU09OLnN0cmluZ2lmeSh7XG4gICAgICAgICAgICAgICAgVUlPYmplY3RLZXk6IHVpT2JqZWN0S2V5LFxuICAgICAgICAgICAgICAgIEZpZWxkSUQ6IGZpZWxkS2V5LFxuICAgICAgICAgICAgICAgIFZhbHVlOiBmaWVsZFZhbHVlXG4gICAgICAgICAgICB9KVxuICAgICAgICB9O1xuXG4gICAgICAgIHRoaXMuaHR0cFNlcnZpY2UucG9zdFdhcGlBcGlDYWxsKGAke3RoaXMuZXZlbnRVcmx9YCwgYm9keSkuc3Vic2NyaWJlKFxuICAgICAgICAgICAgKHJlcykgPT4ge1xuICAgICAgICAgICAgICAgIGNvbnNvbGUubG9nKHJlcyk7XG4gICAgICAgICAgICAgICAgY2FsbGJhY2tGdW5jKHJlcyk7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgICAvLyAoZXJyb3IpID0+IHt9LFxuICAgICAgICAgICAgLy8gKCkgPT4ge31cbiAgICAgICAgKTtcbiAgICB9XG59XG4iXX0=