onshore-forms 0.0.36 → 0.0.37

package/fesm2020/onshore-forms.mjs

@@ -324,6 +324,7 @@ class OnshoreFormItemContainer {
     constructor(cdr) {
         this.cdr = cdr;
         this.actionButtonClick = new EventEmitter();
+        this.disabled = false;
         this.OnshoreFormTemplateLayout = OnshoreFormTemplateLayout;
         this.layout = OnshoreFormTemplateLayout.auto;
     }
@@ -335,15 +336,18 @@ class OnshoreFormItemContainer {
             else {
                 this.ngControl?.control.disable();
             }
+            this.disabled = !enable;
             this.cdr.markForCheck();
         }, 100);
     }
     lockChanged(unlocked) {
         if (unlocked && this.formTemplate.enabled) {
             this.enabled(true);
+            this.disabled = false;
         }
         else {
             this.enabled(false);
+            this.disabled = true;
         }
         this.cdr.markForCheck();
     }
@@ -366,8 +370,10 @@ class OnshoreFormItemContainer {
             this.cdr.markForCheck();
         });
         this.enabled(this.formTemplate.enabled);
+        this.disabled = !this.formTemplate.enabled;
         if (this.formTemplate.locked) {
             this.enabled(false);
+            this.disabled = true;
         }
         this.layout = this.formTemplate.layout;
         this.onWindowResize();
@@ -378,13 +384,16 @@ class OnshoreFormItemContainer {
         if (currentValue) {
             if (previousValue?.enabled !== currentValue?.enabled) {
                 this.enabled(currentValue?.enabled);
+                this.disabled = !currentValue?.enabled;
             }
             if (previousValue?.locked !== currentValue?.locked) {
                 if (currentValue.locked) {
                     this.enabled(false);
+                    this.disabled = true;
                 }
                 else {
                     this.enabled(currentValue.enabled);
+                    this.disabled = currentValue.enabled;
                 }
             }
             if (previousValue?.layout !== currentValue?.layout) {
@@ -396,10 +405,10 @@ class OnshoreFormItemContainer {
     }
 }
 OnshoreFormItemContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: OnshoreFormItemContainer, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-OnshoreFormItemContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: OnshoreFormItemContainer, selector: "onshore-form-item-container", inputs: { formTemplate: "formTemplate", ngControl: "ngControl" }, outputs: { actionButtonClick: "actionButtonClick" }, host: { listeners: { "window:resize": "onWindowResize($event)" } }, viewQueries: [{ propertyName: "formContainer", first: true, predicate: ["formContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div [class.mb-4]=\"!formTemplate.noGap\" #formContainer>\n  <div class=\"flex w-full\"\n       [class.flex-column]=\"layout == OnshoreFormTemplateLayout.vertical\"\n       [class.flex-row]=\"layout == OnshoreFormTemplateLayout.horizontal\"\n       [class.justify-content-between]=\"layout == OnshoreFormTemplateLayout.horizontal\">\n\n    <div #formLabel\n         [hidden]=\"!formTemplate.label || formTemplate.label == ''\"\n         class=\"flex justify-content-between\"\n         [style]=\"formTemplate.labelStyle ?? 'min-width: 200px'\">\n\n      <b *ngIf=\"formTemplate.label && formTemplate.label != ''\" [class.mr-2]=\"layout == OnshoreFormTemplateLayout.horizontal\"\n         [class.mt-2]=\"layout == OnshoreFormTemplateLayout.horizontal\"\n         [class.mb-2]=\"layout == OnshoreFormTemplateLayout.vertical\">\n        {{formTemplate.label}}\n        <small *ngIf=\"formTemplate.required\" class=\"onshore-color-danger\">*</small>\n      </b>\n\n      <div *ngIf=\"formTemplate.tooltip && layout == OnshoreFormTemplateLayout.vertical\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\" appendTo=\"body\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n\n    </div>\n\n    <div class=\"flex w-full\">\n      <p-toggleButton\n        *ngIf=\"formTemplate.locked\"\n        (onChange)=\"lockChanged($event.checked)\"\n        onIcon=\"fa fa-lock-open\"\n        offIcon=\"fa fa-lock\"\n        class=\"mr-2\"\n        [style]=\"{'height': '36px'}\"\n        [disabled]=\"!formTemplate.enabled\">\n      </p-toggleButton>\n\n      <div class=\"w-full overflow-hidden\">\n        <ng-content></ng-content>\n      </div>\n\n\n      <button *ngIf=\"formTemplate.actionButton\"\n              class=\"ml-2\"\n              [style]=\"{'height': '36px', 'width': '48px', 'margin-top': '1px'}\"\n              pButton\n              [disabled]=\"!formTemplate.enabled\"\n              [icon]=\"formTemplate.actionButtonIcon\"\n              (click)=\"actionButtonClick.emit()\">\n      </button>\n    </div>\n\n    <div *ngIf=\"formTemplate.tooltip && layout == OnshoreFormTemplateLayout.horizontal\" class=\"ml-2 align-self-center\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n  </div>\n\n  <div *ngIf=\"ngControl.control.touched || ngControl.control.dirty\" [style]=\"{'margin-left': layout == OnshoreFormTemplateLayout.horizontal ? formLabel?.clientWidth + 'px' : '0px'}\">\n    <onshore-form-validation-output\n      [validationItems]=\"formTemplate.validationItems\"\n      [validationErrors]=\"ngControl.control.errors\">\n    </onshore-form-validation-output>\n  </div>\n\n  <div [style]=\"{'margin-left': layout == OnshoreFormTemplateLayout.horizontal ? formLabel?.clientWidth + 'px' : '0px'}\">\n    <small *ngIf=\"formTemplate.description\" class=\"mt-2 onshore-color-gray-5\"><i class=\"fa fa-info-circle\"></i> {{formTemplate.description}}</small>\n  </div>\n\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "directive", type: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i4.ToggleButton, selector: "p-toggleButton", inputs: ["onLabel", "offLabel", "onIcon", "offIcon", "ariaLabelledBy", "disabled", "style", "styleClass", "inputId", "tabindex", "iconPos"], outputs: ["onChange"] }, { kind: "component", type: OnshoreFormValidationOutputComponent, selector: "onshore-form-validation-output", inputs: ["validationErrors", "validationItems"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+OnshoreFormItemContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: OnshoreFormItemContainer, selector: "onshore-form-item-container", inputs: { formTemplate: "formTemplate", ngControl: "ngControl" }, outputs: { actionButtonClick: "actionButtonClick" }, host: { listeners: { "window:resize": "onWindowResize($event)" } }, viewQueries: [{ propertyName: "formContainer", first: true, predicate: ["formContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div [class.mb-4]=\"!formTemplate.noGap\" #formContainer>\n  <div class=\"flex w-full\"\n       [class.flex-column]=\"layout == OnshoreFormTemplateLayout.vertical\"\n       [class.flex-row]=\"layout == OnshoreFormTemplateLayout.horizontal\"\n       [class.justify-content-between]=\"layout == OnshoreFormTemplateLayout.horizontal\">\n\n    <div #formLabel\n         [hidden]=\"!formTemplate.label || formTemplate.label == ''\"\n         class=\"flex justify-content-between\"\n         [style]=\"formTemplate.labelStyle ?? 'min-width: 200px'\">\n\n      <b *ngIf=\"formTemplate.label && formTemplate.label != ''\" [class.mr-2]=\"layout == OnshoreFormTemplateLayout.horizontal\"\n         [class.mt-2]=\"layout == OnshoreFormTemplateLayout.horizontal\"\n         [class.mb-2]=\"layout == OnshoreFormTemplateLayout.vertical\">\n        {{formTemplate.label}}\n        <small *ngIf=\"formTemplate.required\" class=\"onshore-color-danger\">*</small>\n      </b>\n\n      <div *ngIf=\"formTemplate.tooltip && layout == OnshoreFormTemplateLayout.vertical\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\" appendTo=\"body\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n\n    </div>\n\n    <div class=\"flex w-full\">\n      <p-toggleButton\n        *ngIf=\"formTemplate.locked\"\n        (onChange)=\"lockChanged($event.checked)\"\n        onIcon=\"fa fa-lock-open\"\n        offIcon=\"fa fa-lock\"\n        class=\"mr-2\"\n        [style]=\"{'height': '36px'}\"\n        [disabled]=\"!formTemplate.enabled\">\n      </p-toggleButton>\n\n      <div class=\"w-full overflow-hidden align-self-center\">\n        <ng-content></ng-content>\n      </div>\n\n      <button *ngIf=\"formTemplate.actionButton\"\n              class=\"ml-2\"\n              [style]=\"{'height': '36px', 'width': '40px', 'margin-top': '1px'}\"\n              pButton\n              [disabled]=\"disabled\"\n              [icon]=\"formTemplate.actionButtonIcon\"\n              (click)=\"actionButtonClick.emit()\">\n      </button>\n    </div>\n\n    <div *ngIf=\"formTemplate.tooltip && layout == OnshoreFormTemplateLayout.horizontal\" class=\"ml-2 align-self-center\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n  </div>\n\n  <div *ngIf=\"ngControl.control.touched || ngControl.control.dirty\" [style]=\"{'margin-left': layout == OnshoreFormTemplateLayout.horizontal ? formLabel?.clientWidth + 'px' : '0px'}\">\n    <onshore-form-validation-output\n      [validationItems]=\"formTemplate.validationItems\"\n      [validationErrors]=\"ngControl.control.errors\">\n    </onshore-form-validation-output>\n  </div>\n\n  <div [style]=\"{'margin-left': layout == OnshoreFormTemplateLayout.horizontal ? formLabel?.clientWidth + 'px' : '0px'}\">\n    <small *ngIf=\"formTemplate.description\" class=\"mt-2 onshore-color-gray-5\"><i class=\"fa fa-info-circle\"></i> {{formTemplate.description}}</small>\n  </div>\n\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "directive", type: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i4.ToggleButton, selector: "p-toggleButton", inputs: ["onLabel", "offLabel", "onIcon", "offIcon", "ariaLabelledBy", "disabled", "style", "styleClass", "inputId", "tabindex", "iconPos"], outputs: ["onChange"] }, { kind: "component", type: OnshoreFormValidationOutputComponent, selector: "onshore-form-validation-output", inputs: ["validationErrors", "validationItems"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: OnshoreFormItemContainer, decorators: [{
             type: Component,
-            args: [{ selector: 'onshore-form-item-container', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class.mb-4]=\"!formTemplate.noGap\" #formContainer>\n  <div class=\"flex w-full\"\n       [class.flex-column]=\"layout == OnshoreFormTemplateLayout.vertical\"\n       [class.flex-row]=\"layout == OnshoreFormTemplateLayout.horizontal\"\n       [class.justify-content-between]=\"layout == OnshoreFormTemplateLayout.horizontal\">\n\n    <div #formLabel\n         [hidden]=\"!formTemplate.label || formTemplate.label == ''\"\n         class=\"flex justify-content-between\"\n         [style]=\"formTemplate.labelStyle ?? 'min-width: 200px'\">\n\n      <b *ngIf=\"formTemplate.label && formTemplate.label != ''\" [class.mr-2]=\"layout == OnshoreFormTemplateLayout.horizontal\"\n         [class.mt-2]=\"layout == OnshoreFormTemplateLayout.horizontal\"\n         [class.mb-2]=\"layout == OnshoreFormTemplateLayout.vertical\">\n        {{formTemplate.label}}\n        <small *ngIf=\"formTemplate.required\" class=\"onshore-color-danger\">*</small>\n      </b>\n\n      <div *ngIf=\"formTemplate.tooltip && layout == OnshoreFormTemplateLayout.vertical\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\" appendTo=\"body\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n\n    </div>\n\n    <div class=\"flex w-full\">\n      <p-toggleButton\n        *ngIf=\"formTemplate.locked\"\n        (onChange)=\"lockChanged($event.checked)\"\n        onIcon=\"fa fa-lock-open\"\n        offIcon=\"fa fa-lock\"\n        class=\"mr-2\"\n        [style]=\"{'height': '36px'}\"\n        [disabled]=\"!formTemplate.enabled\">\n      </p-toggleButton>\n\n      <div class=\"w-full overflow-hidden\">\n        <ng-content></ng-content>\n      </div>\n\n\n      <button *ngIf=\"formTemplate.actionButton\"\n              class=\"ml-2\"\n              [style]=\"{'height': '36px', 'width': '48px', 'margin-top': '1px'}\"\n              pButton\n              [disabled]=\"!formTemplate.enabled\"\n              [icon]=\"formTemplate.actionButtonIcon\"\n              (click)=\"actionButtonClick.emit()\">\n      </button>\n    </div>\n\n    <div *ngIf=\"formTemplate.tooltip && layout == OnshoreFormTemplateLayout.horizontal\" class=\"ml-2 align-self-center\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n  </div>\n\n  <div *ngIf=\"ngControl.control.touched || ngControl.control.dirty\" [style]=\"{'margin-left': layout == OnshoreFormTemplateLayout.horizontal ? formLabel?.clientWidth + 'px' : '0px'}\">\n    <onshore-form-validation-output\n      [validationItems]=\"formTemplate.validationItems\"\n      [validationErrors]=\"ngControl.control.errors\">\n    </onshore-form-validation-output>\n  </div>\n\n  <div [style]=\"{'margin-left': layout == OnshoreFormTemplateLayout.horizontal ? formLabel?.clientWidth + 'px' : '0px'}\">\n    <small *ngIf=\"formTemplate.description\" class=\"mt-2 onshore-color-gray-5\"><i class=\"fa fa-info-circle\"></i> {{formTemplate.description}}</small>\n  </div>\n\n</div>\n" }]
+            args: [{ selector: 'onshore-form-item-container', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class.mb-4]=\"!formTemplate.noGap\" #formContainer>\n  <div class=\"flex w-full\"\n       [class.flex-column]=\"layout == OnshoreFormTemplateLayout.vertical\"\n       [class.flex-row]=\"layout == OnshoreFormTemplateLayout.horizontal\"\n       [class.justify-content-between]=\"layout == OnshoreFormTemplateLayout.horizontal\">\n\n    <div #formLabel\n         [hidden]=\"!formTemplate.label || formTemplate.label == ''\"\n         class=\"flex justify-content-between\"\n         [style]=\"formTemplate.labelStyle ?? 'min-width: 200px'\">\n\n      <b *ngIf=\"formTemplate.label && formTemplate.label != ''\" [class.mr-2]=\"layout == OnshoreFormTemplateLayout.horizontal\"\n         [class.mt-2]=\"layout == OnshoreFormTemplateLayout.horizontal\"\n         [class.mb-2]=\"layout == OnshoreFormTemplateLayout.vertical\">\n        {{formTemplate.label}}\n        <small *ngIf=\"formTemplate.required\" class=\"onshore-color-danger\">*</small>\n      </b>\n\n      <div *ngIf=\"formTemplate.tooltip && layout == OnshoreFormTemplateLayout.vertical\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\" appendTo=\"body\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n\n    </div>\n\n    <div class=\"flex w-full\">\n      <p-toggleButton\n        *ngIf=\"formTemplate.locked\"\n        (onChange)=\"lockChanged($event.checked)\"\n        onIcon=\"fa fa-lock-open\"\n        offIcon=\"fa fa-lock\"\n        class=\"mr-2\"\n        [style]=\"{'height': '36px'}\"\n        [disabled]=\"!formTemplate.enabled\">\n      </p-toggleButton>\n\n      <div class=\"w-full overflow-hidden align-self-center\">\n        <ng-content></ng-content>\n      </div>\n\n      <button *ngIf=\"formTemplate.actionButton\"\n              class=\"ml-2\"\n              [style]=\"{'height': '36px', 'width': '40px', 'margin-top': '1px'}\"\n              pButton\n              [disabled]=\"disabled\"\n              [icon]=\"formTemplate.actionButtonIcon\"\n              (click)=\"actionButtonClick.emit()\">\n      </button>\n    </div>\n\n    <div *ngIf=\"formTemplate.tooltip && layout == OnshoreFormTemplateLayout.horizontal\" class=\"ml-2 align-self-center\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n  </div>\n\n  <div *ngIf=\"ngControl.control.touched || ngControl.control.dirty\" [style]=\"{'margin-left': layout == OnshoreFormTemplateLayout.horizontal ? formLabel?.clientWidth + 'px' : '0px'}\">\n    <onshore-form-validation-output\n      [validationItems]=\"formTemplate.validationItems\"\n      [validationErrors]=\"ngControl.control.errors\">\n    </onshore-form-validation-output>\n  </div>\n\n  <div [style]=\"{'margin-left': layout == OnshoreFormTemplateLayout.horizontal ? formLabel?.clientWidth + 'px' : '0px'}\">\n    <small *ngIf=\"formTemplate.description\" class=\"mt-2 onshore-color-gray-5\"><i class=\"fa fa-info-circle\"></i> {{formTemplate.description}}</small>\n  </div>\n\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { formTemplate: [{
                 type: Input
             }], ngControl: [{
@@ -858,8 +867,8 @@ class OnshoreFormDropdownItemComponent {
         this.ngControl.control?.disable();
     }
     ngOnChanges(changes) {
-        const currentFormTemplate = changes['formTemplate'].currentValue;
-        const previousFormTemplate = changes['formTemplate'].previousValue;
+        const currentFormTemplate = changes['formTemplate']?.currentValue;
+        const previousFormTemplate = changes['formTemplate']?.previousValue;
         if (currentFormTemplate?.options?.length > 0 && currentFormTemplate?.options != previousFormTemplate?.options && !this.multiple) {
             this.ngControl.control?.setValue(this.formTemplate.options[0].value);
         }
@@ -867,10 +876,10 @@ class OnshoreFormDropdownItemComponent {
     }
 }
 OnshoreFormDropdownItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: OnshoreFormDropdownItemComponent, deps: [{ token: i1$1.NgControl, optional: true, self: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-OnshoreFormDropdownItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: OnshoreFormDropdownItemComponent, selector: "onshore-form-dropdown-item", inputs: { formTemplate: "formTemplate", multiple: "multiple", showClear: "showClear", group: "group", selectionLimit: "selectionLimit", minLength: "minLength", optionLabel: "optionLabel", optionGroupLabel: "optionGroupLabel", dataKey: "dataKey" }, outputs: { actionButtonClick: "actionButtonClick" }, usesOnChanges: true, ngImport: i0, template: "<onshore-form-item-container [formTemplate]=\"formTemplate\" [ngControl]=\"ngControl\" (actionButtonClick)=\"actionButtonClick.emit()\">\n  <p-dropdown *ngIf=\"!multiple\"\n              class=\"w-full\"\n              [options]=\"formTemplate?.options\"\n              [formControl]=\"ngControl.control\"\n              [name]=\"formTemplate?.name\"\n              [placeholder]=\"formTemplate?.placeholder\"\n              [disabled]=\"disabled\"\n              [optionLabel]=\"optionLabel\"\n              [dataKey]=\"dataKey\"\n              [optionGroupLabel]=\"optionGroupLabel\"\n              [group]=\"group\"\n              [showClear]=\"showClear && formTemplate?.placeholder\"\n              (onClear)=\"clearSelection()\"\n              optionDisabled=\"disabled\"\n              appendTo=\"body\">\n  </p-dropdown>\n\n  <p-multiSelect *ngIf=\"multiple\"\n                 class=\"w-full\"\n                 [options]=\"formTemplate?.options\"\n                 [formControl]=\"ngControl.control\"\n                 [name]=\"formTemplate?.name\"\n                 [placeholder]=\"formTemplate?.placeholder\"\n                 [disabled]=\"disabled\"\n                 [showClear]=\"showClear\"\n                 [selectionLimit]=\"selectionLimit\"\n                 [minlength]=\"minLength\"\n                 [optionLabel]=\"optionLabel\"\n                 [dataKey]=\"dataKey\"\n                 [optionGroupLabel]=\"optionGroupLabel\"\n                 [group]=\"group\"\n                 (onClear)=\"clearSelection()\"\n                 [selectedItemsLabel]=\"'form.dropdownControl.selectedItems' | translate\"\n                 optionDisabled=\"disabled\"\n                 appendTo=\"body\"></p-multiSelect>\n</onshore-form-item-container>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3$3.Dropdown, selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "selectId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "disabled", "itemSize", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i4$3.MultiSelect, selector: "p-multiSelect", inputs: ["style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "label", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "autoZIndex", "baseZIndex", "filterBy", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "defaultLabel", "placeholder", "options", "filterValue", "itemSize"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad"] }, { kind: "component", type: OnshoreFormItemContainer, selector: "onshore-form-item-container", inputs: ["formTemplate", "ngControl"], outputs: ["actionButtonClick"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+OnshoreFormDropdownItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: OnshoreFormDropdownItemComponent, selector: "onshore-form-dropdown-item", inputs: { formTemplate: "formTemplate", multiple: "multiple", showClear: "showClear", group: "group", selectionLimit: "selectionLimit", minLength: "minLength", optionLabel: "optionLabel", optionGroupLabel: "optionGroupLabel", dataKey: "dataKey" }, outputs: { actionButtonClick: "actionButtonClick" }, usesOnChanges: true, ngImport: i0, template: "<onshore-form-item-container [formTemplate]=\"formTemplate\" [ngControl]=\"ngControl\" (actionButtonClick)=\"actionButtonClick.emit()\">\n\n  <p-dropdown *ngIf=\"!multiple\"\n              class=\"w-full\"\n              [options]=\"formTemplate?.options\"\n              [formControl]=\"ngControl.control\"\n              [name]=\"formTemplate?.name\"\n              [placeholder]=\"formTemplate?.placeholder\"\n              [disabled]=\"disabled\"\n              [optionLabel]=\"optionLabel\"\n              [dataKey]=\"dataKey\"\n              [optionGroupLabel]=\"optionGroupLabel\"\n              [group]=\"group\"\n              [showClear]=\"showClear && formTemplate?.placeholder\"\n              (onClear)=\"clearSelection()\"\n              optionDisabled=\"disabled\"\n              appendTo=\"body\">\n  </p-dropdown>\n\n  <p-multiSelect *ngIf=\"multiple\"\n                 class=\"w-full\"\n                 [options]=\"formTemplate?.options\"\n                 [formControl]=\"ngControl.control\"\n                 [name]=\"formTemplate?.name\"\n                 [placeholder]=\"formTemplate?.placeholder\"\n                 [disabled]=\"disabled\"\n                 [showClear]=\"showClear\"\n                 [selectionLimit]=\"selectionLimit\"\n                 [minlength]=\"minLength\"\n                 [optionLabel]=\"optionLabel\"\n                 [dataKey]=\"dataKey\"\n                 [optionGroupLabel]=\"optionGroupLabel\"\n                 [group]=\"group\"\n                 (onClear)=\"clearSelection()\"\n                 [selectedItemsLabel]=\"'form.dropdownControl.selectedItems' | translate\"\n                 optionDisabled=\"disabled\"\n                 appendTo=\"body\"></p-multiSelect>\n\n</onshore-form-item-container>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3$3.Dropdown, selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "selectId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "disabled", "itemSize", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i4$3.MultiSelect, selector: "p-multiSelect", inputs: ["style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "label", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "autoZIndex", "baseZIndex", "filterBy", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "defaultLabel", "placeholder", "options", "filterValue", "itemSize"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad"] }, { kind: "component", type: OnshoreFormItemContainer, selector: "onshore-form-item-container", inputs: ["formTemplate", "ngControl"], outputs: ["actionButtonClick"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: OnshoreFormDropdownItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'onshore-form-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<onshore-form-item-container [formTemplate]=\"formTemplate\" [ngControl]=\"ngControl\" (actionButtonClick)=\"actionButtonClick.emit()\">\n  <p-dropdown *ngIf=\"!multiple\"\n              class=\"w-full\"\n              [options]=\"formTemplate?.options\"\n              [formControl]=\"ngControl.control\"\n              [name]=\"formTemplate?.name\"\n              [placeholder]=\"formTemplate?.placeholder\"\n              [disabled]=\"disabled\"\n              [optionLabel]=\"optionLabel\"\n              [dataKey]=\"dataKey\"\n              [optionGroupLabel]=\"optionGroupLabel\"\n              [group]=\"group\"\n              [showClear]=\"showClear && formTemplate?.placeholder\"\n              (onClear)=\"clearSelection()\"\n              optionDisabled=\"disabled\"\n              appendTo=\"body\">\n  </p-dropdown>\n\n  <p-multiSelect *ngIf=\"multiple\"\n                 class=\"w-full\"\n                 [options]=\"formTemplate?.options\"\n                 [formControl]=\"ngControl.control\"\n                 [name]=\"formTemplate?.name\"\n                 [placeholder]=\"formTemplate?.placeholder\"\n                 [disabled]=\"disabled\"\n                 [showClear]=\"showClear\"\n                 [selectionLimit]=\"selectionLimit\"\n                 [minlength]=\"minLength\"\n                 [optionLabel]=\"optionLabel\"\n                 [dataKey]=\"dataKey\"\n                 [optionGroupLabel]=\"optionGroupLabel\"\n                 [group]=\"group\"\n                 (onClear)=\"clearSelection()\"\n                 [selectedItemsLabel]=\"'form.dropdownControl.selectedItems' | translate\"\n                 optionDisabled=\"disabled\"\n                 appendTo=\"body\"></p-multiSelect>\n</onshore-form-item-container>\n" }]
+            args: [{ selector: 'onshore-form-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<onshore-form-item-container [formTemplate]=\"formTemplate\" [ngControl]=\"ngControl\" (actionButtonClick)=\"actionButtonClick.emit()\">\n\n  <p-dropdown *ngIf=\"!multiple\"\n              class=\"w-full\"\n              [options]=\"formTemplate?.options\"\n              [formControl]=\"ngControl.control\"\n              [name]=\"formTemplate?.name\"\n              [placeholder]=\"formTemplate?.placeholder\"\n              [disabled]=\"disabled\"\n              [optionLabel]=\"optionLabel\"\n              [dataKey]=\"dataKey\"\n              [optionGroupLabel]=\"optionGroupLabel\"\n              [group]=\"group\"\n              [showClear]=\"showClear && formTemplate?.placeholder\"\n              (onClear)=\"clearSelection()\"\n              optionDisabled=\"disabled\"\n              appendTo=\"body\">\n  </p-dropdown>\n\n  <p-multiSelect *ngIf=\"multiple\"\n                 class=\"w-full\"\n                 [options]=\"formTemplate?.options\"\n                 [formControl]=\"ngControl.control\"\n                 [name]=\"formTemplate?.name\"\n                 [placeholder]=\"formTemplate?.placeholder\"\n                 [disabled]=\"disabled\"\n                 [showClear]=\"showClear\"\n                 [selectionLimit]=\"selectionLimit\"\n                 [minlength]=\"minLength\"\n                 [optionLabel]=\"optionLabel\"\n                 [dataKey]=\"dataKey\"\n                 [optionGroupLabel]=\"optionGroupLabel\"\n                 [group]=\"group\"\n                 (onClear)=\"clearSelection()\"\n                 [selectedItemsLabel]=\"'form.dropdownControl.selectedItems' | translate\"\n                 optionDisabled=\"disabled\"\n                 appendTo=\"body\"></p-multiSelect>\n\n</onshore-form-item-container>\n" }]
         }], ctorParameters: function () { return [{ type: i1$1.NgControl, decorators: [{
                     type: Self
                 }, {