@jooler/inputs 0.0.43 → 0.0.44

package/fesm2015/inputs.mjs

@@ -14,6 +14,8 @@ import * as i1$1 from '@angular/common/http';
 import { HttpHeaders } from '@angular/common/http';
 import * as i3 from '@angular/material/button';
 import { AppMaterialModule } from '@jooler/app-material';
+import * as i1$2 from '@angular/router';
+import * as i3$1 from '@angular/material/menu';
 
 class ChooseEnumComponent {
     constructor() {
@@ -93,20 +95,20 @@ class ChooseEnumComponent {
         this.selectedItem = null;
     }
     setStyles() {
+        let style;
         if (this.percentWidth) {
-            let style = {
+            style = {
                 width: this.width + "%",
                 paddingTop: this.paddingTop + 'rem'
             };
-            return style;
         }
         else {
-            let style = {
+            style = {
                 width: this.width + 'rem',
                 paddingTop: this.paddingTop + 'rem'
             };
-            return style;
         }
+        return style;
     }
     setLabelStyle() {
         let style = {
@@ -124,7 +126,7 @@ ChooseEnumComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
             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: ["value", "label", "backgroundColor", "textColor", "width", "item", "clear", "withCross", "isClickable"] }] });
+    ], 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"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ChooseEnumComponent, decorators: [{
             type: Component,
             args: [{ selector: 'choose-enum', providers: [
@@ -225,7 +227,7 @@ class ChooseGeneralItemService {
     constructor(http, env) {
         this.http = http;
         this.env = env;
-    }
+    } //we have an issue with this line of code...can we meet to resolve it!
     getHeaders() {
         const token = localStorage.getItem("token");
         const httpHeaders = new HttpHeaders({
@@ -329,7 +331,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\" [textColor]=\"chipTextColor\" [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\" [textColor]=\"chipTextColor\" [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: ["value", "label", "backgroundColor", "textColor", "width", "item", "clear", "withCross", "isClickable"] }, { 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", "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: [
@@ -338,7 +340,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                             useExisting: forwardRef(() => ChooseGeneralItemComponent),
                             multi: true,
                         },
-                    ], 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\" [textColor]=\"chipTextColor\" [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\" [textColor]=\"chipTextColor\" [label]=\"item[objects[0].field]\"\r\n                [width]=\"chipWidth\">\r\n            </ng-chip>\r\n        </ng-template>\r\n    </ng-select>\r\n</div>" }]
+                    ], 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>" }]
         }], ctorParameters: function () { return [{ type: ChooseGeneralItemService }]; }, propDecorators: { change: [{
                 type: Output
             }], items: [{
@@ -1075,6 +1077,77 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
 class LabelAndField {
 }
 
+var DropdownActionType;
+(function (DropdownActionType) {
+    DropdownActionType[DropdownActionType["ADD"] = 0] = "ADD";
+    DropdownActionType[DropdownActionType["MENU"] = 1] = "MENU";
+})(DropdownActionType || (DropdownActionType = {}));
+
+class DropdownActionsComponent {
+    constructor(_Router) {
+        this._Router = _Router;
+        this.dropdownActionTypes = DropdownActionType;
+        this.canRoute = true;
+        this.labelsAndRoutes = [];
+        this.dropdownActionType = this.dropdownActionTypes.ADD;
+        this.addClicked = new EventEmitter();
+    }
+    ngOnInit() {
+        this.validateActions();
+    }
+    validateActions() {
+        if (this.dropdownActionType == this.dropdownActionTypes.ADD) {
+            if (this.canRoute) {
+                if (this.route == "" || this.route == undefined || this.route == null) {
+                    throw Error("Route needs to be provided.");
+                }
+            }
+            else {
+                if (this.route) {
+                    throw Error("Route shouldn't be provided since canRoute is false");
+                }
+            }
+        }
+        else if (this.dropdownActionType == this.dropdownActionTypes.MENU) {
+            if (!this.labelsAndRoutes.length) {
+                throw Error("A list of labels & Routes need to be provided for the actions menu.");
+            }
+        }
+        else {
+            throw Error("Dropdown Action Type is not recognized.");
+        }
+    }
+    onClickAdd($event) {
+        $event.preventDefault();
+        if (this.canRoute && this.route) {
+            this._Router.navigate([this.route]);
+        }
+        this.addClicked.emit();
+    }
+    onClickLabel(route, $event) {
+        $event.preventDefault();
+        this._Router.navigate([route]);
+    }
+}
+DropdownActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DropdownActionsComponent, deps: [{ token: i1$2.Router }], target: i0.ɵɵFactoryTarget.Component });
+DropdownActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DropdownActionsComponent, selector: "dropdown-actions", inputs: { canRoute: "canRoute", disabled: "disabled", labelsAndRoutes: "labelsAndRoutes", route: "route", dropdownActionType: "dropdownActionType" }, outputs: { addClicked: "addClicked" }, ngImport: i0, template: "<div [ngSwitch]=\"dropdownActionType\">\r\n    <a *ngSwitchCase=\"dropdownActionTypes.ADD\" [href]=\"route\"\r\n        [ngClass]=\"{'action-enabled':!disabled, 'disabled': disabled}\"\r\n        (click)=\"onClickAdd($event)\">\r\n        <fa-icon icon=\"plus\"></fa-icon>\r\n    </a>\r\n    <fa-icon *ngSwitchCase=\"dropdownActionTypes.MENU\"\r\n        [ngClass]=\"{'action-enabled':!disabled, 'disabled': disabled}\"\r\n        class=\"menu\" [matMenuTriggerFor]=\"menu\"\r\n        icon=\"ellipsis-vertical\"></fa-icon>\r\n    <mat-menu #menu=\"matMenu\">\r\n        <button *ngFor=\"let labelAndRoute of labelsAndRoutes\" mat-menu-item>\r\n            <a [href]=\"labelAndRoute.route\"\r\n                (click)=\"onClickLabel(labelAndRoute.route, $event)\">{{labelAndRoute.label}}</a>\r\n        </button>\r\n    </mat-menu>\r\n</div>", styles: [".action-enabled{cursor:pointer;color:#155ed4}.action-enabled:hover{color:#3178eb}.disabled{color:#676767;cursor:initial;pointer-events:none}.menu{font-size:1.8rem;display:flex;align-items:center}\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.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i3$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i3$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i3$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i2$2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DropdownActionsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'dropdown-actions', template: "<div [ngSwitch]=\"dropdownActionType\">\r\n    <a *ngSwitchCase=\"dropdownActionTypes.ADD\" [href]=\"route\"\r\n        [ngClass]=\"{'action-enabled':!disabled, 'disabled': disabled}\"\r\n        (click)=\"onClickAdd($event)\">\r\n        <fa-icon icon=\"plus\"></fa-icon>\r\n    </a>\r\n    <fa-icon *ngSwitchCase=\"dropdownActionTypes.MENU\"\r\n        [ngClass]=\"{'action-enabled':!disabled, 'disabled': disabled}\"\r\n        class=\"menu\" [matMenuTriggerFor]=\"menu\"\r\n        icon=\"ellipsis-vertical\"></fa-icon>\r\n    <mat-menu #menu=\"matMenu\">\r\n        <button *ngFor=\"let labelAndRoute of labelsAndRoutes\" mat-menu-item>\r\n            <a [href]=\"labelAndRoute.route\"\r\n                (click)=\"onClickLabel(labelAndRoute.route, $event)\">{{labelAndRoute.label}}</a>\r\n        </button>\r\n    </mat-menu>\r\n</div>", styles: [".action-enabled{cursor:pointer;color:#155ed4}.action-enabled:hover{color:#3178eb}.disabled{color:#676767;cursor:initial;pointer-events:none}.menu{font-size:1.8rem;display:flex;align-items:center}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1$2.Router }]; }, propDecorators: { canRoute: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], labelsAndRoutes: [{
+                type: Input
+            }], route: [{
+                type: Input
+            }], dropdownActionType: [{
+                type: Input
+            }], addClicked: [{
+                type: Output
+            }] } });
+
 class InputsModule {
     static forRoot(environment) {
         return {
@@ -1102,7 +1175,8 @@ InputsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
         ChooseGeneralItemRendererComponent,
         CustomDecimalPointTwoDigitsDirective,
         ShowTableErrorsComponent,
-        FormControlValidationMsgDirectiveForInput], imports: [CommonModule,
+        FormControlValidationMsgDirectiveForInput,
+        DropdownActionsComponent], imports: [CommonModule,
         NgSelectModule,
         FormsModule,
         ReactiveFormsModule,
@@ -1116,6 +1190,7 @@ InputsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
         ChooseYesOrNoComponent,
         ChooseYesOrNoRendererComponent,
         EditableSavableInputComponent,
+        DropdownActionsComponent,
         DynamicPipe] });
 InputsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: InputsModule, imports: [CommonModule,
         NgSelectModule,
@@ -1140,7 +1215,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                         ChooseGeneralItemRendererComponent,
                         CustomDecimalPointTwoDigitsDirective,
                         ShowTableErrorsComponent,
-                        FormControlValidationMsgDirectiveForInput
+                        FormControlValidationMsgDirectiveForInput,
+                        DropdownActionsComponent
                     ],
                     imports: [
                         CommonModule,
@@ -1160,11 +1236,62 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                         ChooseYesOrNoComponent,
                         ChooseYesOrNoRendererComponent,
                         EditableSavableInputComponent,
+                        DropdownActionsComponent,
                         DynamicPipe
                     ]
                 }]
         }] });
 
+class PrimaryColors {
+}
+PrimaryColors.$primaryBlueColor = '#155ED4';
+PrimaryColors.$primaryPinkColor = '#F0509C';
+PrimaryColors.$primaryTealColor = '#12957E';
+PrimaryColors.$primaryCarbonColor = '#32353B';
+PrimaryColors.$primaryPurpleColor = '#E3B1EB';
+PrimaryColors.$primaryRedColor = '#A80002';
+PrimaryColors.$primaryLightRedColor = '#FFDBDB';
+PrimaryColors.$primaryLightGrayBlueColor = '#f7f8f9';
+PrimaryColors.$primaryLightGrayColor = '#f0f0f0';
+
+class AddAsteriskDirective {
+    constructor(elem) {
+        this.elem = elem;
+        this.show = true;
+    }
+    ngOnInit() {
+        this.toggleAsterisk();
+    }
+    ngOnChanges(changes) {
+        this.toggleAsterisk();
+    }
+    toggleAsterisk() {
+        const existingAsterisk = this.elem.nativeElement.querySelector('.custom-asterisk');
+        if (this.show) {
+            if (!existingAsterisk) {
+                const customAsterisk = `<span class="custom-asterisk" style="color:${PrimaryColors.$primaryRedColor};"> *</span> `;
+                this.elem.nativeElement.insertAdjacentHTML('beforeend', customAsterisk);
+            }
+        }
+        else {
+            if (existingAsterisk) {
+                existingAsterisk.remove();
+            }
+        }
+    }
+}
+AddAsteriskDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AddAsteriskDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+AddAsteriskDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: AddAsteriskDirective, selector: "[addAsterisk]", inputs: { show: "show" }, usesOnChanges: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AddAsteriskDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[addAsterisk]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { show: [{
+                type: Input,
+                args: ['show']
+            }] } });
+
 /*
  * Public API Surface of inputs
  */
@@ -1173,5 +1300,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ChooseEnumComponent, ChooseEnumRendererComponent, ChooseGeneralItemComponent, ChooseGeneralItemRendererComponent, ChooseGeneralItemService, ChooseLineTypeComponent, ChooseYesOrNoComponent, ChooseYesOrNoRendererComponent, DynamicPipe, EditableSavableInputComponent, FormControlValidationMsgDirectiveForInput, GeneralInputRendererComponent, InputsModule, LabelAndField, ShowTableErrorsComponent };
+export { AddAsteriskDirective, ChooseEnumComponent, ChooseEnumRendererComponent, ChooseGeneralItemComponent, ChooseGeneralItemRendererComponent, ChooseGeneralItemService, ChooseLineTypeComponent, ChooseYesOrNoComponent, ChooseYesOrNoRendererComponent, DropdownActionType, DropdownActionsComponent, DynamicPipe, EditableSavableInputComponent, FormControlValidationMsgDirectiveForInput, GeneralInputRendererComponent, InputsModule, LabelAndField, PrimaryColors, ShowTableErrorsComponent };
 //# sourceMappingURL=inputs.mjs.map