@jooler/inputs 0.0.48 → 0.0.50

package/fesm2015/inputs.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, forwardRef, Component, Output, Input, Injectable, Inject, Pipe, Directive, HostListener, NgModule } from '@angular/core';
+import { EventEmitter, forwardRef, Component, Input, Output, Injectable, Inject, Pipe, Directive, HostListener, NgModule } from '@angular/core';
 import * as i2$1 from '@angular/forms';
 import { NG_VALUE_ACCESSOR, NgModel, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import * as i1 from '@angular/common';
@@ -17,22 +17,186 @@ import { AppMaterialModule } from '@jooler/app-material';
 import * as i1$2 from '@angular/router';
 import * as i3$1 from '@angular/material/menu';
 
+class CustomTheme {
+}
+CustomTheme.$joolerBlue = [
+    '#e3ecfa',
+    '#b9cff2',
+    '#8aafea',
+    '#5b8ee1',
+    '#3876da',
+    '#155ed4',
+    '#1256cf',
+    '#0f4cc9',
+    '#0c42c3',
+    '#0631b9',
+    '#e3e8ff',
+    '#b0bfff',
+    '#7d95ff',
+    '#6481ff',
+];
+CustomTheme.$joolerTeal = [
+    '#b8dfd8',
+    '#89cabf',
+    '#59b5a5',
+    '#36a591',
+    '#12957e',
+    '#108d76',
+    '#0d826b',
+    '#0a7861',
+    '#05674e',
+    '#97ffe1',
+    '#64ffd2',
+    '#31ffc3',
+    '#18ffbc',
+];
+CustomTheme.$joolerRed = [
+    '#f5e0e1',
+    '#e5b3b3',
+    '#d48081',
+    '#c24d4e',
+    '#b52628',
+    '#a80002',
+    '#a00002',
+    '#970001',
+    '#8d0001',
+    '#7d0001',
+    '#ffaaaa',
+    '#ff7777',
+    '#ff4444',
+    '#ff2a2a',
+];
+CustomTheme.$joolerPink = [
+    '#fdeaf3',
+    '#fbcbe1',
+    '#f8a8ce',
+    '#f585ba',
+    '#f26aab',
+    '#f0509c',
+    '#ee4994',
+    '#ec408a',
+    '#e93780',
+    '#e5276e',
+    '#ffffff',
+    '#ffeef4',
+    '#ffbbd3',
+    '#ffa1c2',
+];
+CustomTheme.$joolerPurple = [
+    '#fcf6fd',
+    '#f7e8f9',
+    '#f1d8f5',
+    '#ebc8f1',
+    '#e7bdee',
+    '#e3b1eb',
+    '#e0aae9',
+    '#dca1e5',
+    '#d898e2',
+    '#d088dd',
+    '#ffffff',
+    '#ffffff',
+    '#ffffff',
+    '#fcecff',
+];
+CustomTheme.$joolerCombo = [
+    '#b9cff2',
+    '#b8dfd8',
+    '#ffaaaa',
+    '#fbcbe1',
+    '#f1d8f5',
+    '#8aafea',
+    '#97ffe1',
+    '#ff7777',
+    '#f585ba',
+    '#e7bdee',
+    '#6481ff',
+    '#18ffbc',
+    '#ff4444',
+    '#ffa1c2',
+    '#e0aae9',
+    '#1256cf',
+    '#108d76',
+    '#df0000',
+    '#ec408a',
+    '#d088dd',
+];
+
+class EnumHelperBaseClass {
+    static getEnumOptionsFromEnumClass(enumClass, customColors, isAllCaps) {
+        let colors = CustomTheme.$joolerCombo;
+        if (customColors && customColors.length > 0) {
+            colors = customColors;
+        }
+        let stringValues = [];
+        let enumOption;
+        let enumOptions = [];
+        for (let item in enumClass) {
+            if (isNaN(Number(item))) {
+                let joinedString;
+                stringValues.push(item);
+                let splitStr = item.toLowerCase().split('_');
+                if (!isAllCaps) {
+                    for (let i = 0; i < splitStr.length; i++) {
+                        splitStr[i] =
+                            splitStr[i].charAt(0).toUpperCase() + splitStr[i].substring(1);
+                    }
+                }
+                else {
+                    for (let i = 0; i < splitStr.length; i++) {
+                        splitStr[i] = splitStr[i].toUpperCase();
+                    }
+                }
+                joinedString = splitStr.join(' ');
+                stringValues.splice(stringValues.indexOf(item), 1, joinedString);
+            }
+        }
+        let repeatedColors = [];
+        let i = 0;
+        for (let label of stringValues) {
+            // in case the array of colors is smaller than the stringValues array, we repeat the the colors so that they are enough
+            repeatedColors.push(colors[stringValues.indexOf(label) % colors.length]);
+            enumOption = {
+                value: Object.keys(enumClass).map(Number)[i],
+                label: label,
+                color: repeatedColors[i],
+            };
+            enumOptions.push(enumOption);
+            i++;
+        }
+        return enumOptions;
+    }
+    static getLabelAndColorFromEnumValue(enumClass, enumValue, customColors) {
+        let enumOptions = EnumHelperBaseClass.getEnumOptionsFromEnumClass(enumClass, customColors);
+        let enumOption;
+        for (let item of enumOptions) {
+            if (enumValue == item.value) {
+                enumOption = enumOptions[enumOptions.indexOf(item)];
+            }
+        }
+        return enumOption;
+    }
+}
+
 class ChooseEnumComponent {
     constructor() {
-        this.change = new EventEmitter();
+        this.appendTo = 'body';
         this.allowAllCapsValues = false;
-        this.width = 20;
-        this.labelTextAlign = 'left';
+        this.clearable = true;
+        this.getValuesArrayFromEnum = EnumHelperBaseClass.getEnumOptionsFromEnumClass;
         this.indexesToDisable = [];
+        this.isChip = true;
         this.isDropdownDisabled = false;
+        this.label = 'label';
+        this.labelTextAlign = 'left';
         this.percentWidth = false;
-        this.colors = [];
+        this.change = new EventEmitter();
+        this.close = new EventEmitter();
         this.propagateChange = (_) => { };
         this.propogateTouch = () => { };
     }
     ngOnChanges() {
         if (this.getValuesArrayFromEnum != null) {
-            this.items = this.getValuesArrayFromEnum(this.enumChoices, this.allowAllCapsValues);
+            this.items = this.getValuesArrayFromEnum(this.enumChoices, this.customColors, this.allowAllCapsValues);
         }
         if (this.isItemDisabled == true) {
             if (this.indexesToDisable.length > 0) {
@@ -44,7 +208,7 @@ class ChooseEnumComponent {
         if (this.isItemHidden == true) {
             if (this.indexesToDisable.length > 0) {
                 for (let index of this.indexesToDisable) {
-                    let itemIndex = this.items.findIndex(item => item.value == index);
+                    let itemIndex = this.items.findIndex((item) => item.value == index);
                     this.items.splice(itemIndex, 1);
                 }
             }
@@ -52,7 +216,7 @@ class ChooseEnumComponent {
     }
     ngOnInit() {
         if (this.getValuesArrayFromEnum != null) {
-            this.items = this.getValuesArrayFromEnum(this.enumChoices, this.allowAllCapsValues);
+            this.items = this.getValuesArrayFromEnum(this.enumChoices, this.customColors, this.allowAllCapsValues);
         }
         if (this.isItemDisabled == true) {
             if (this.indexesToDisable.length > 0) {
@@ -64,7 +228,7 @@ class ChooseEnumComponent {
         if (this.isItemHidden == true) {
             if (this.indexesToDisable.length > 0) {
                 for (let index of this.indexesToDisable) {
-                    let itemIndex = this.items.findIndex(item => item.value == index);
+                    let itemIndex = this.items.findIndex((item) => item.value == index);
                     this.items.splice(itemIndex, 1);
                 }
             }
@@ -86,27 +250,24 @@ class ChooseEnumComponent {
     }
     updateBlur() {
         this.propogateTouch();
+        this.close.emit();
     }
     onSelectedItemChanged() {
         this.propagateChange(this.selectedItem);
         this.change.emit(this.selectedItem);
     }
+    setDisabledState(isDisabled) {
+        this.isDropdownDisabled = isDisabled;
+    }
     clear() {
         this.selectedItem = null;
     }
     setStyles() {
-        let style;
-        if (this.percentWidth) {
-            style = {
-                width: this.width + "%",
-                paddingTop: this.paddingTop + 'rem'
-            };
-        }
-        else {
-            style = {
-                width: this.width + 'rem',
-                paddingTop: this.paddingTop + 'rem'
-            };
+        let style = {
+            paddingTop: this.paddingTop + 'rem',
+        };
+        if (this.width) {
+            style['width'] = this.width + 'rem';
         }
         return style;
     }
@@ -114,19 +275,19 @@ class ChooseEnumComponent {
         let style = {
             textAlign: this.labelTextAlign,
             fontWeight: this.labelTextFontWeight,
-            fontSize: this.labelTextFontSize + 'rem'
+            fontSize: this.labelTextFontSize + 'rem',
         };
         return style;
     }
 }
 ChooseEnumComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ChooseEnumComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ChooseEnumComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ChooseEnumComponent, selector: "choose-enum", inputs: { label: "label", appendTo: "appendTo", allowAllCapsValues: "allowAllCapsValues", isItemHidden: "isItemHidden", isItemDisabled: "isItemDisabled", enumChoices: "enumChoices", getValuesArrayFromEnum: "getValuesArrayFromEnum", isChip: "isChip", isMultiple: "isMultiple", placeholder: "placeholder", width: "width", paddingTop: "paddingTop", labelTextAlign: "labelTextAlign", labelTextFontWeight: "labelTextFontWeight", labelTextFontSize: "labelTextFontSize", selectedItem: "selectedItem", indexesToDisable: "indexesToDisable", isDropdownDisabled: "isDropdownDisabled", percentWidth: "percentWidth" }, outputs: { change: "change" }, providers: [
+ChooseEnumComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ChooseEnumComponent, selector: "choose-enum", inputs: { appendTo: "appendTo", allowAllCapsValues: "allowAllCapsValues", clearable: "clearable", customColors: "customColors", enumChoices: "enumChoices", getValuesArrayFromEnum: "getValuesArrayFromEnum", indexesToDisable: "indexesToDisable", isChip: "isChip", isDropdownDisabled: "isDropdownDisabled", isItemHidden: "isItemHidden", isItemDisabled: "isItemDisabled", isMultiple: "isMultiple", label: "label", labelTextAlign: "labelTextAlign", labelTextFontWeight: "labelTextFontWeight", labelTextFontSize: "labelTextFontSize", paddingTop: "paddingTop", placeholder: "placeholder", percentWidth: "percentWidth", selectedItem: "selectedItem", width: "width" }, outputs: { change: "change", close: "close" }, providers: [
         {
             provide: NG_VALUE_ACCESSOR,
             useExisting: forwardRef(() => ChooseEnumComponent),
             multi: true,
         },
-    ], usesOnChanges: true, ngImport: i0, template: "<div class=\"select\">\r\n    <ng-select [ngStyle]=\"setStyles()\" (blur)=\"updateBlur()\" bindLabel=\"label\" bindValue=\"value\" [items]=\"items\"\r\n        [placeholder]=\"placeholder\" (change)=\"onSelectedItemChanged()\" [(ngModel)]=\"selectedItem\"\r\n        [multiple]=\"isMultiple\" [disabled]=\"isDropdownDisabled\" [appendTo]=\"appendTo\" dropdownPosition=\"bottom\">\r\n        <ng-template class=\"template\" ng-option-tmp ng-label-tmp let-item=\"item\" let-index=\"index\"\r\n            let-search=\"searchTerm\">\r\n            <div *ngIf=\"isChip\">\r\n                <ng-chip class=\"chip\" [backgroundColor]=\"item.color\" [label]=\"item.label\" [width]=\"110\">\r\n                </ng-chip>\r\n            </div>\r\n            <div [ngStyle]=\"setLabelStyle()\" *ngIf=\"!isChip\">{{item.label}}\r\n            </div>\r\n        </ng-template>\r\n    </ng-select>\r\n</div>", styles: [".select{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i2.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.NgChipComponent, selector: "ng-chip", inputs: ["backgroundColor", "size", "clear", "enumClass", "enumValue", "inputType", "item", "isClickable", "label", "width", "withCross"] }] });
+    ], usesOnChanges: true, ngImport: i0, template: "<div class=\"select\">\r\n  <ng-select\r\n    [ngStyle]=\"setStyles()\"\r\n    (blur)=\"updateBlur()\"\r\n    bindLabel=\"label\"\r\n    bindValue=\"value\"\r\n    [items]=\"items\"\r\n    [placeholder]=\"placeholder\"\r\n    (change)=\"onSelectedItemChanged()\"\r\n    [(ngModel)]=\"selectedItem\"\r\n    [multiple]=\"isMultiple\"\r\n    [disabled]=\"isDropdownDisabled\"\r\n    [clearable]=\"clearable\"\r\n    [clearAllText]=\"'clear everything'\"\r\n    (clear)=\"clear()\"\r\n    [appendTo]=\"appendTo\"\r\n    dropdownPosition=\"bottom\">\r\n    <ng-template\r\n      class=\"template\"\r\n      ng-option-tmp\r\n      ng-label-tmp\r\n      let-item=\"item\"\r\n      let-index=\"index\"\r\n      let-search=\"searchTerm\">\r\n      <div *ngIf=\"isChip\">\r\n        <ng-chip [enumClass]=\"enumChoices\" [enumValue]=\"item.value\" [customColors]=\"customColors\">\r\n        </ng-chip>\r\n      </div>\r\n      <div [ngStyle]=\"setLabelStyle()\" *ngIf=\"!isChip\">{{ item.label }}</div>\r\n    </ng-template>\r\n  </ng-select>\r\n</div>\r\n", styles: [".select{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i2.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.NgChipComponent, selector: "ng-chip", inputs: ["backgroundColor", "size", "clear", "customColors", "enumClass", "enumValue", "inputType", "item", "isClickable", "label", "width", "withCross"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ChooseEnumComponent, decorators: [{
             type: Component,
             args: [{ selector: 'choose-enum', providers: [
@@ -135,32 +296,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                             useExisting: forwardRef(() => ChooseEnumComponent),
                             multi: true,
                         },
-                    ], template: "<div class=\"select\">\r\n    <ng-select [ngStyle]=\"setStyles()\" (blur)=\"updateBlur()\" bindLabel=\"label\" bindValue=\"value\" [items]=\"items\"\r\n        [placeholder]=\"placeholder\" (change)=\"onSelectedItemChanged()\" [(ngModel)]=\"selectedItem\"\r\n        [multiple]=\"isMultiple\" [disabled]=\"isDropdownDisabled\" [appendTo]=\"appendTo\" dropdownPosition=\"bottom\">\r\n        <ng-template class=\"template\" ng-option-tmp ng-label-tmp let-item=\"item\" let-index=\"index\"\r\n            let-search=\"searchTerm\">\r\n            <div *ngIf=\"isChip\">\r\n                <ng-chip class=\"chip\" [backgroundColor]=\"item.color\" [label]=\"item.label\" [width]=\"110\">\r\n                </ng-chip>\r\n            </div>\r\n            <div [ngStyle]=\"setLabelStyle()\" *ngIf=\"!isChip\">{{item.label}}\r\n            </div>\r\n        </ng-template>\r\n    </ng-select>\r\n</div>", styles: [".select{width:100%}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { change: [{
-                type: Output
-            }], label: [{
-                type: Input
-            }], appendTo: [{
+                    ], template: "<div class=\"select\">\r\n  <ng-select\r\n    [ngStyle]=\"setStyles()\"\r\n    (blur)=\"updateBlur()\"\r\n    bindLabel=\"label\"\r\n    bindValue=\"value\"\r\n    [items]=\"items\"\r\n    [placeholder]=\"placeholder\"\r\n    (change)=\"onSelectedItemChanged()\"\r\n    [(ngModel)]=\"selectedItem\"\r\n    [multiple]=\"isMultiple\"\r\n    [disabled]=\"isDropdownDisabled\"\r\n    [clearable]=\"clearable\"\r\n    [clearAllText]=\"'clear everything'\"\r\n    (clear)=\"clear()\"\r\n    [appendTo]=\"appendTo\"\r\n    dropdownPosition=\"bottom\">\r\n    <ng-template\r\n      class=\"template\"\r\n      ng-option-tmp\r\n      ng-label-tmp\r\n      let-item=\"item\"\r\n      let-index=\"index\"\r\n      let-search=\"searchTerm\">\r\n      <div *ngIf=\"isChip\">\r\n        <ng-chip [enumClass]=\"enumChoices\" [enumValue]=\"item.value\" [customColors]=\"customColors\">\r\n        </ng-chip>\r\n      </div>\r\n      <div [ngStyle]=\"setLabelStyle()\" *ngIf=\"!isChip\">{{ item.label }}</div>\r\n    </ng-template>\r\n  </ng-select>\r\n</div>\r\n", styles: [".select{width:100%}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { appendTo: [{
                 type: Input
             }], allowAllCapsValues: [{
                 type: Input
-            }], isItemHidden: [{
+            }], clearable: [{
                 type: Input
-            }], isItemDisabled: [{
+            }], customColors: [{
                 type: Input
             }], enumChoices: [{
                 type: Input
             }], getValuesArrayFromEnum: [{
                 type: Input
+            }], indexesToDisable: [{
+                type: Input
             }], isChip: [{
                 type: Input
-            }], isMultiple: [{
+            }], isDropdownDisabled: [{
                 type: Input
-            }], placeholder: [{
+            }], isItemHidden: [{
                 type: Input
-            }], width: [{
+            }], isItemDisabled: [{
                 type: Input
-            }], paddingTop: [{
+            }], isMultiple: [{
+                type: Input
+            }], label: [{
                 type: Input
             }], labelTextAlign: [{
                 type: Input
@@ -168,14 +329,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                 type: Input
             }], labelTextFontSize: [{
                 type: Input
-            }], selectedItem: [{
-                type: Input
-            }], indexesToDisable: [{
+            }], paddingTop: [{
                 type: Input
-            }], isDropdownDisabled: [{
+            }], placeholder: [{
                 type: Input
             }], percentWidth: [{
                 type: Input
+            }], selectedItem: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], change: [{
+                type: Output
+            }], close: [{
+                type: Output
             }] } });
 
 class ShowTableErrorsComponent {
@@ -215,7 +382,7 @@ class ChooseEnumRendererComponent {
     }
 }
 ChooseEnumRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ChooseEnumRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ChooseEnumRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ChooseEnumRendererComponent, selector: "choose-enum-renderer", ngImport: i0, template: "<choose-enum [label]=\"params.label\" [appendTo]=\"'body'\" [isItemHidden]=\"params.isItemHidden\"\r\n    [isItemDisabled]=\"params.isItemDisabled\" [labelTextAlign]=\"params.labelTextAlign\"\r\n    [labelTextFontWeight]=\"params.labelTextFontWeight\" [labelTextFontSize]=\"params.labelTextFontSize\"\r\n    [selectedItem]=\"params.value\" [indexesToDisable]=\"params.indexesToDisable\"\r\n    [isDropdownDisabled]=\"params.isDropdownDisabled\" [getValuesArrayFromEnum]=\"params.getLabelAndColorFromEnumValue\"\r\n    [enumChoices]=\"params.enumChoices\" [placeholder]=\"params.placeholder\" [width]=\"params.width\"\r\n    [isChip]=\"params.isChip\" [paddingTop]=\"params.paddingTop\" [allowAllCapsValues]=\"params.allowAllCapsValues\"\r\n    (change)=\"onCellDataChanged($event)\">\r\n</choose-enum>", styles: [""], dependencies: [{ kind: "component", type: ChooseEnumComponent, selector: "choose-enum", inputs: ["label", "appendTo", "allowAllCapsValues", "isItemHidden", "isItemDisabled", "enumChoices", "getValuesArrayFromEnum", "isChip", "isMultiple", "placeholder", "width", "paddingTop", "labelTextAlign", "labelTextFontWeight", "labelTextFontSize", "selectedItem", "indexesToDisable", "isDropdownDisabled", "percentWidth"], outputs: ["change"] }] });
+ChooseEnumRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ChooseEnumRendererComponent, selector: "choose-enum-renderer", ngImport: i0, template: "<choose-enum [label]=\"params.label\" [appendTo]=\"'body'\" [isItemHidden]=\"params.isItemHidden\"\r\n    [isItemDisabled]=\"params.isItemDisabled\" [labelTextAlign]=\"params.labelTextAlign\"\r\n    [labelTextFontWeight]=\"params.labelTextFontWeight\" [labelTextFontSize]=\"params.labelTextFontSize\"\r\n    [selectedItem]=\"params.value\" [indexesToDisable]=\"params.indexesToDisable\"\r\n    [isDropdownDisabled]=\"params.isDropdownDisabled\" [getValuesArrayFromEnum]=\"params.getLabelAndColorFromEnumValue\"\r\n    [enumChoices]=\"params.enumChoices\" [placeholder]=\"params.placeholder\" [width]=\"params.width\"\r\n    [isChip]=\"params.isChip\" [paddingTop]=\"params.paddingTop\" [allowAllCapsValues]=\"params.allowAllCapsValues\"\r\n    (change)=\"onCellDataChanged($event)\">\r\n</choose-enum>", styles: [""], dependencies: [{ kind: "component", type: ChooseEnumComponent, selector: "choose-enum", inputs: ["appendTo", "allowAllCapsValues", "clearable", "customColors", "enumChoices", "getValuesArrayFromEnum", "indexesToDisable", "isChip", "isDropdownDisabled", "isItemHidden", "isItemDisabled", "isMultiple", "label", "labelTextAlign", "labelTextFontWeight", "labelTextFontSize", "paddingTop", "placeholder", "percentWidth", "selectedItem", "width"], outputs: ["change", "close"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ChooseEnumRendererComponent, decorators: [{
             type: Component,
             args: [{ selector: 'choose-enum-renderer', template: "<choose-enum [label]=\"params.label\" [appendTo]=\"'body'\" [isItemHidden]=\"params.isItemHidden\"\r\n    [isItemDisabled]=\"params.isItemDisabled\" [labelTextAlign]=\"params.labelTextAlign\"\r\n    [labelTextFontWeight]=\"params.labelTextFontWeight\" [labelTextFontSize]=\"params.labelTextFontSize\"\r\n    [selectedItem]=\"params.value\" [indexesToDisable]=\"params.indexesToDisable\"\r\n    [isDropdownDisabled]=\"params.isDropdownDisabled\" [getValuesArrayFromEnum]=\"params.getLabelAndColorFromEnumValue\"\r\n    [enumChoices]=\"params.enumChoices\" [placeholder]=\"params.placeholder\" [width]=\"params.width\"\r\n    [isChip]=\"params.isChip\" [paddingTop]=\"params.paddingTop\" [allowAllCapsValues]=\"params.allowAllCapsValues\"\r\n    (change)=\"onCellDataChanged($event)\">\r\n</choose-enum>" }]
@@ -331,7 +498,7 @@ ChooseGeneralItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0
             useExisting: forwardRef(() => ChooseGeneralItemComponent),
             multi: true,
         },
-    ], ngImport: i0, template: "<div class=\"select\">\r\n    <ng-select [hideSelected]=\"hideSelectedItem\" [closeOnSelect]=\"!isMultiple\" [ngStyle]=\"setWidth()\" class=\"component\"\r\n        [disabled]=\"disabled\" [appendTo]=\"appendTo\" dropdownPosition=\"bottom\" (blur)=\"updateBlur()\" [bindLabel]=\"label\"\r\n        bindValue=\"id\" [compareWith]=\"\" [items]=\"items\" [placeholder]=\"placeholder\"\r\n        (change)=\"onSelectedItemChanged($event)\" [(ngModel)]=\"selectedItemId\" [multiple]=\"isMultiple\">\r\n        <ng-template *ngIf=\"!isChip\" class=\"template\" ng-option-tmp ng-label-tmp let-item=\"item\" let-index=\"index\"\r\n            let-search=\"searchTerm\">\r\n            <span [ngStyle]=\"setFontStyles()\" *ngFor=\"let object of objects let isLast = last\">\r\n                <span *ngIf=\"showLabel && !isTypeDate\">\r\n                    {{object.label}}: {{item[object.field]}} {{isLast ? \"\" : separator}}\r\n                </span>\r\n                <span *ngIf=\"showLabel && isTypeDate\">\r\n                    {{object.label}}: {{item[object.field]| date: 'mediumDate'}} {{isLast ? \"\" : separator}}\r\n                </span>\r\n                <span *ngIf=\"!showLabel && isTypeDate\">\r\n                    {{item[object.field]| date: 'mediumDate'}} {{isLast ? \"\" : separator}}\r\n                </span>\r\n                <span *ngIf=\"!showLabel && !isTypeDate\">{{item[object.field]}}{{isLast ? \"\" : separator}}\r\n                </span>\r\n            </span>\r\n        </ng-template>\r\n        <ng-template *ngIf=\"isChip\" ng-label-tmp let-item=\"item\" let-clear=\"clear\">\r\n            <ng-chip (mousedown)=\"$event.stopPropagation()\" [clear]=\"clear\" [withCross]=\"isMultiple\" [item]=\"item\"\r\n                class=\"chip\" [backgroundColor]=\"chipColor\" [label]=\"item[objects[0].field]\"\r\n                [width]=\"chipWidth\">\r\n            </ng-chip>\r\n        </ng-template>\r\n        <ng-template *ngIf=\"isChip\" ng-option-tmp let-clear=\"clear\" let-item=\"item\">\r\n            <ng-chip (mousedown)=\"$event.stopPropagation()\" [clear]=\"clear\" [withCross]=\"false\" [item]=\"item\"\r\n                class=\"chip\" [backgroundColor]=\"chipColor\" [label]=\"item[objects[0].field]\"\r\n                [width]=\"chipWidth\">\r\n            </ng-chip>\r\n        </ng-template>\r\n    </ng-select>\r\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i2.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.NgChipComponent, selector: "ng-chip", inputs: ["backgroundColor", "size", "clear", "enumClass", "enumValue", "inputType", "item", "isClickable", "label", "width", "withCross"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }] });
+    ], ngImport: i0, template: "<div class=\"select\">\r\n    <ng-select [hideSelected]=\"hideSelectedItem\" [closeOnSelect]=\"!isMultiple\" [ngStyle]=\"setWidth()\" class=\"component\"\r\n        [disabled]=\"disabled\" [appendTo]=\"appendTo\" dropdownPosition=\"bottom\" (blur)=\"updateBlur()\" [bindLabel]=\"label\"\r\n        bindValue=\"id\" [compareWith]=\"\" [items]=\"items\" [placeholder]=\"placeholder\"\r\n        (change)=\"onSelectedItemChanged($event)\" [(ngModel)]=\"selectedItemId\" [multiple]=\"isMultiple\">\r\n        <ng-template *ngIf=\"!isChip\" class=\"template\" ng-option-tmp ng-label-tmp let-item=\"item\" let-index=\"index\"\r\n            let-search=\"searchTerm\">\r\n            <span [ngStyle]=\"setFontStyles()\" *ngFor=\"let object of objects let isLast = last\">\r\n                <span *ngIf=\"showLabel && !isTypeDate\">\r\n                    {{object.label}}: {{item[object.field]}} {{isLast ? \"\" : separator}}\r\n                </span>\r\n                <span *ngIf=\"showLabel && isTypeDate\">\r\n                    {{object.label}}: {{item[object.field]| date: 'mediumDate'}} {{isLast ? \"\" : separator}}\r\n                </span>\r\n                <span *ngIf=\"!showLabel && isTypeDate\">\r\n                    {{item[object.field]| date: 'mediumDate'}} {{isLast ? \"\" : separator}}\r\n                </span>\r\n                <span *ngIf=\"!showLabel && !isTypeDate\">{{item[object.field]}}{{isLast ? \"\" : separator}}\r\n                </span>\r\n            </span>\r\n        </ng-template>\r\n        <ng-template *ngIf=\"isChip\" ng-label-tmp let-item=\"item\" let-clear=\"clear\">\r\n            <ng-chip (mousedown)=\"$event.stopPropagation()\" [clear]=\"clear\" [withCross]=\"isMultiple\" [item]=\"item\"\r\n                class=\"chip\" [backgroundColor]=\"chipColor\" [label]=\"item[objects[0].field]\"\r\n                [width]=\"chipWidth\">\r\n            </ng-chip>\r\n        </ng-template>\r\n        <ng-template *ngIf=\"isChip\" ng-option-tmp let-clear=\"clear\" let-item=\"item\">\r\n            <ng-chip (mousedown)=\"$event.stopPropagation()\" [clear]=\"clear\" [withCross]=\"false\" [item]=\"item\"\r\n                class=\"chip\" [backgroundColor]=\"chipColor\" [label]=\"item[objects[0].field]\"\r\n                [width]=\"chipWidth\">\r\n            </ng-chip>\r\n        </ng-template>\r\n    </ng-select>\r\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i2.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.NgChipComponent, selector: "ng-chip", inputs: ["backgroundColor", "size", "clear", "customColors", "enumClass", "enumValue", "inputType", "item", "isClickable", "label", "width", "withCross"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ChooseGeneralItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'choose-general-item', providers: [