@jooler/inputs 0.0.43 → 0.0.44
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/add-asterisk.directive.mjs +41 -0
- package/esm2020/lib/choose-enum/choose-enum.component.mjs +6 -6
- package/esm2020/lib/choose-general-item/choose-general-item.component.mjs +3 -3
- package/esm2020/lib/choose-general-item/choose-general-item.service.mjs +2 -2
- package/esm2020/lib/dropdown-actions/dropdown-action-type.model.mjs +6 -0
- package/esm2020/lib/dropdown-actions/dropdown-actions.component.mjs +72 -0
- package/esm2020/lib/dropdown-actions/label-and-route.model.mjs +2 -0
- package/esm2020/lib/inputs.module.mjs +8 -3
- package/esm2020/lib/models/line-type-model-helper.mjs +1 -1
- package/esm2020/lib/primary-colors.mjs +12 -0
- package/esm2020/public-api.mjs +6 -2
- package/fesm2015/inputs.mjs +138 -11
- package/fesm2015/inputs.mjs.map +1 -1
- package/fesm2020/inputs.mjs +138 -11
- package/fesm2020/inputs.mjs.map +1 -1
- package/lib/add-asterisk.directive.d.ts +12 -0
- package/lib/choose-enum/choose-enum.component.d.ts +1 -4
- package/lib/dropdown-actions/dropdown-action-type.model.d.ts +4 -0
- package/lib/dropdown-actions/dropdown-actions.component.d.ts +22 -0
- package/lib/dropdown-actions/label-and-route.model.d.ts +4 -0
- package/lib/inputs.module.d.ts +8 -7
- package/lib/models/line-type-model-helper.d.ts +1 -1
- package/lib/primary-colors.d.ts +11 -0
- package/package.json +10 -10
- package/public-api.d.ts +5 -1
- package/esm2020/lib/models/enum-helper.model.mjs +0 -2
- package/lib/models/enum-helper.model.d.ts +0 -6
package/fesm2020/inputs.mjs
CHANGED
|
@@ -14,6 +14,8 @@ import * as i1$1 from '@angular/common/http';
|
|
|
14
14
|
import { HttpHeaders } from '@angular/common/http';
|
|
15
15
|
import * as i3 from '@angular/material/button';
|
|
16
16
|
import { AppMaterialModule } from '@jooler/app-material';
|
|
17
|
+
import * as i1$2 from '@angular/router';
|
|
18
|
+
import * as i3$1 from '@angular/material/menu';
|
|
17
19
|
|
|
18
20
|
class ChooseEnumComponent {
|
|
19
21
|
constructor() {
|
|
@@ -93,20 +95,20 @@ class ChooseEnumComponent {
|
|
|
93
95
|
this.selectedItem = null;
|
|
94
96
|
}
|
|
95
97
|
setStyles() {
|
|
98
|
+
let style;
|
|
96
99
|
if (this.percentWidth) {
|
|
97
|
-
|
|
100
|
+
style = {
|
|
98
101
|
width: this.width + "%",
|
|
99
102
|
paddingTop: this.paddingTop + 'rem'
|
|
100
103
|
};
|
|
101
|
-
return style;
|
|
102
104
|
}
|
|
103
105
|
else {
|
|
104
|
-
|
|
106
|
+
style = {
|
|
105
107
|
width: this.width + 'rem',
|
|
106
108
|
paddingTop: this.paddingTop + 'rem'
|
|
107
109
|
};
|
|
108
|
-
return style;
|
|
109
110
|
}
|
|
111
|
+
return style;
|
|
110
112
|
}
|
|
111
113
|
setLabelStyle() {
|
|
112
114
|
let style = {
|
|
@@ -124,7 +126,7 @@ ChooseEnumComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
|
|
|
124
126
|
useExisting: forwardRef(() => ChooseEnumComponent),
|
|
125
127
|
multi: true,
|
|
126
128
|
},
|
|
127
|
-
], 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: ["
|
|
129
|
+
], 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"] }] });
|
|
128
130
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ChooseEnumComponent, decorators: [{
|
|
129
131
|
type: Component,
|
|
130
132
|
args: [{ selector: 'choose-enum', providers: [
|
|
@@ -224,7 +226,7 @@ class ChooseGeneralItemService {
|
|
|
224
226
|
constructor(http, env) {
|
|
225
227
|
this.http = http;
|
|
226
228
|
this.env = env;
|
|
227
|
-
}
|
|
229
|
+
} //we have an issue with this line of code...can we meet to resolve it!
|
|
228
230
|
getHeaders() {
|
|
229
231
|
const token = localStorage.getItem("token");
|
|
230
232
|
const httpHeaders = new HttpHeaders({
|
|
@@ -326,7 +328,7 @@ ChooseGeneralItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0
|
|
|
326
328
|
useExisting: forwardRef(() => ChooseGeneralItemComponent),
|
|
327
329
|
multi: true,
|
|
328
330
|
},
|
|
329
|
-
], 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\" [
|
|
331
|
+
], 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" }] });
|
|
330
332
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ChooseGeneralItemComponent, decorators: [{
|
|
331
333
|
type: Component,
|
|
332
334
|
args: [{ selector: 'choose-general-item', providers: [
|
|
@@ -335,7 +337,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
335
337
|
useExisting: forwardRef(() => ChooseGeneralItemComponent),
|
|
336
338
|
multi: true,
|
|
337
339
|
},
|
|
338
|
-
], 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\" [
|
|
340
|
+
], 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>" }]
|
|
339
341
|
}], ctorParameters: function () { return [{ type: ChooseGeneralItemService }]; }, propDecorators: { change: [{
|
|
340
342
|
type: Output
|
|
341
343
|
}], items: [{
|
|
@@ -1071,6 +1073,77 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
1071
1073
|
class LabelAndField {
|
|
1072
1074
|
}
|
|
1073
1075
|
|
|
1076
|
+
var DropdownActionType;
|
|
1077
|
+
(function (DropdownActionType) {
|
|
1078
|
+
DropdownActionType[DropdownActionType["ADD"] = 0] = "ADD";
|
|
1079
|
+
DropdownActionType[DropdownActionType["MENU"] = 1] = "MENU";
|
|
1080
|
+
})(DropdownActionType || (DropdownActionType = {}));
|
|
1081
|
+
|
|
1082
|
+
class DropdownActionsComponent {
|
|
1083
|
+
constructor(_Router) {
|
|
1084
|
+
this._Router = _Router;
|
|
1085
|
+
this.dropdownActionTypes = DropdownActionType;
|
|
1086
|
+
this.canRoute = true;
|
|
1087
|
+
this.labelsAndRoutes = [];
|
|
1088
|
+
this.dropdownActionType = this.dropdownActionTypes.ADD;
|
|
1089
|
+
this.addClicked = new EventEmitter();
|
|
1090
|
+
}
|
|
1091
|
+
ngOnInit() {
|
|
1092
|
+
this.validateActions();
|
|
1093
|
+
}
|
|
1094
|
+
validateActions() {
|
|
1095
|
+
if (this.dropdownActionType == this.dropdownActionTypes.ADD) {
|
|
1096
|
+
if (this.canRoute) {
|
|
1097
|
+
if (this.route == "" || this.route == undefined || this.route == null) {
|
|
1098
|
+
throw Error("Route needs to be provided.");
|
|
1099
|
+
}
|
|
1100
|
+
}
|
|
1101
|
+
else {
|
|
1102
|
+
if (this.route) {
|
|
1103
|
+
throw Error("Route shouldn't be provided since canRoute is false");
|
|
1104
|
+
}
|
|
1105
|
+
}
|
|
1106
|
+
}
|
|
1107
|
+
else if (this.dropdownActionType == this.dropdownActionTypes.MENU) {
|
|
1108
|
+
if (!this.labelsAndRoutes.length) {
|
|
1109
|
+
throw Error("A list of labels & Routes need to be provided for the actions menu.");
|
|
1110
|
+
}
|
|
1111
|
+
}
|
|
1112
|
+
else {
|
|
1113
|
+
throw Error("Dropdown Action Type is not recognized.");
|
|
1114
|
+
}
|
|
1115
|
+
}
|
|
1116
|
+
onClickAdd($event) {
|
|
1117
|
+
$event.preventDefault();
|
|
1118
|
+
if (this.canRoute && this.route) {
|
|
1119
|
+
this._Router.navigate([this.route]);
|
|
1120
|
+
}
|
|
1121
|
+
this.addClicked.emit();
|
|
1122
|
+
}
|
|
1123
|
+
onClickLabel(route, $event) {
|
|
1124
|
+
$event.preventDefault();
|
|
1125
|
+
this._Router.navigate([route]);
|
|
1126
|
+
}
|
|
1127
|
+
}
|
|
1128
|
+
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 });
|
|
1129
|
+
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"] }] });
|
|
1130
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DropdownActionsComponent, decorators: [{
|
|
1131
|
+
type: Component,
|
|
1132
|
+
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"] }]
|
|
1133
|
+
}], ctorParameters: function () { return [{ type: i1$2.Router }]; }, propDecorators: { canRoute: [{
|
|
1134
|
+
type: Input
|
|
1135
|
+
}], disabled: [{
|
|
1136
|
+
type: Input
|
|
1137
|
+
}], labelsAndRoutes: [{
|
|
1138
|
+
type: Input
|
|
1139
|
+
}], route: [{
|
|
1140
|
+
type: Input
|
|
1141
|
+
}], dropdownActionType: [{
|
|
1142
|
+
type: Input
|
|
1143
|
+
}], addClicked: [{
|
|
1144
|
+
type: Output
|
|
1145
|
+
}] } });
|
|
1146
|
+
|
|
1074
1147
|
class InputsModule {
|
|
1075
1148
|
static forRoot(environment) {
|
|
1076
1149
|
return {
|
|
@@ -1098,7 +1171,8 @@ InputsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
|
1098
1171
|
ChooseGeneralItemRendererComponent,
|
|
1099
1172
|
CustomDecimalPointTwoDigitsDirective,
|
|
1100
1173
|
ShowTableErrorsComponent,
|
|
1101
|
-
FormControlValidationMsgDirectiveForInput
|
|
1174
|
+
FormControlValidationMsgDirectiveForInput,
|
|
1175
|
+
DropdownActionsComponent], imports: [CommonModule,
|
|
1102
1176
|
NgSelectModule,
|
|
1103
1177
|
FormsModule,
|
|
1104
1178
|
ReactiveFormsModule,
|
|
@@ -1112,6 +1186,7 @@ InputsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
|
1112
1186
|
ChooseYesOrNoComponent,
|
|
1113
1187
|
ChooseYesOrNoRendererComponent,
|
|
1114
1188
|
EditableSavableInputComponent,
|
|
1189
|
+
DropdownActionsComponent,
|
|
1115
1190
|
DynamicPipe] });
|
|
1116
1191
|
InputsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: InputsModule, imports: [CommonModule,
|
|
1117
1192
|
NgSelectModule,
|
|
@@ -1136,7 +1211,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
1136
1211
|
ChooseGeneralItemRendererComponent,
|
|
1137
1212
|
CustomDecimalPointTwoDigitsDirective,
|
|
1138
1213
|
ShowTableErrorsComponent,
|
|
1139
|
-
FormControlValidationMsgDirectiveForInput
|
|
1214
|
+
FormControlValidationMsgDirectiveForInput,
|
|
1215
|
+
DropdownActionsComponent
|
|
1140
1216
|
],
|
|
1141
1217
|
imports: [
|
|
1142
1218
|
CommonModule,
|
|
@@ -1156,11 +1232,62 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
1156
1232
|
ChooseYesOrNoComponent,
|
|
1157
1233
|
ChooseYesOrNoRendererComponent,
|
|
1158
1234
|
EditableSavableInputComponent,
|
|
1235
|
+
DropdownActionsComponent,
|
|
1159
1236
|
DynamicPipe
|
|
1160
1237
|
]
|
|
1161
1238
|
}]
|
|
1162
1239
|
}] });
|
|
1163
1240
|
|
|
1241
|
+
class PrimaryColors {
|
|
1242
|
+
}
|
|
1243
|
+
PrimaryColors.$primaryBlueColor = '#155ED4';
|
|
1244
|
+
PrimaryColors.$primaryPinkColor = '#F0509C';
|
|
1245
|
+
PrimaryColors.$primaryTealColor = '#12957E';
|
|
1246
|
+
PrimaryColors.$primaryCarbonColor = '#32353B';
|
|
1247
|
+
PrimaryColors.$primaryPurpleColor = '#E3B1EB';
|
|
1248
|
+
PrimaryColors.$primaryRedColor = '#A80002';
|
|
1249
|
+
PrimaryColors.$primaryLightRedColor = '#FFDBDB';
|
|
1250
|
+
PrimaryColors.$primaryLightGrayBlueColor = '#f7f8f9';
|
|
1251
|
+
PrimaryColors.$primaryLightGrayColor = '#f0f0f0';
|
|
1252
|
+
|
|
1253
|
+
class AddAsteriskDirective {
|
|
1254
|
+
constructor(elem) {
|
|
1255
|
+
this.elem = elem;
|
|
1256
|
+
this.show = true;
|
|
1257
|
+
}
|
|
1258
|
+
ngOnInit() {
|
|
1259
|
+
this.toggleAsterisk();
|
|
1260
|
+
}
|
|
1261
|
+
ngOnChanges(changes) {
|
|
1262
|
+
this.toggleAsterisk();
|
|
1263
|
+
}
|
|
1264
|
+
toggleAsterisk() {
|
|
1265
|
+
const existingAsterisk = this.elem.nativeElement.querySelector('.custom-asterisk');
|
|
1266
|
+
if (this.show) {
|
|
1267
|
+
if (!existingAsterisk) {
|
|
1268
|
+
const customAsterisk = `<span class="custom-asterisk" style="color:${PrimaryColors.$primaryRedColor};"> *</span> `;
|
|
1269
|
+
this.elem.nativeElement.insertAdjacentHTML('beforeend', customAsterisk);
|
|
1270
|
+
}
|
|
1271
|
+
}
|
|
1272
|
+
else {
|
|
1273
|
+
if (existingAsterisk) {
|
|
1274
|
+
existingAsterisk.remove();
|
|
1275
|
+
}
|
|
1276
|
+
}
|
|
1277
|
+
}
|
|
1278
|
+
}
|
|
1279
|
+
AddAsteriskDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AddAsteriskDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1280
|
+
AddAsteriskDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: AddAsteriskDirective, selector: "[addAsterisk]", inputs: { show: "show" }, usesOnChanges: true, ngImport: i0 });
|
|
1281
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AddAsteriskDirective, decorators: [{
|
|
1282
|
+
type: Directive,
|
|
1283
|
+
args: [{
|
|
1284
|
+
selector: '[addAsterisk]'
|
|
1285
|
+
}]
|
|
1286
|
+
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { show: [{
|
|
1287
|
+
type: Input,
|
|
1288
|
+
args: ['show']
|
|
1289
|
+
}] } });
|
|
1290
|
+
|
|
1164
1291
|
/*
|
|
1165
1292
|
* Public API Surface of inputs
|
|
1166
1293
|
*/
|
|
@@ -1169,5 +1296,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
1169
1296
|
* Generated bundle index. Do not edit.
|
|
1170
1297
|
*/
|
|
1171
1298
|
|
|
1172
|
-
export { ChooseEnumComponent, ChooseEnumRendererComponent, ChooseGeneralItemComponent, ChooseGeneralItemRendererComponent, ChooseGeneralItemService, ChooseLineTypeComponent, ChooseYesOrNoComponent, ChooseYesOrNoRendererComponent, DynamicPipe, EditableSavableInputComponent, FormControlValidationMsgDirectiveForInput, GeneralInputRendererComponent, InputsModule, LabelAndField, ShowTableErrorsComponent };
|
|
1299
|
+
export { AddAsteriskDirective, ChooseEnumComponent, ChooseEnumRendererComponent, ChooseGeneralItemComponent, ChooseGeneralItemRendererComponent, ChooseGeneralItemService, ChooseLineTypeComponent, ChooseYesOrNoComponent, ChooseYesOrNoRendererComponent, DropdownActionType, DropdownActionsComponent, DynamicPipe, EditableSavableInputComponent, FormControlValidationMsgDirectiveForInput, GeneralInputRendererComponent, InputsModule, LabelAndField, PrimaryColors, ShowTableErrorsComponent };
|
|
1173
1300
|
//# sourceMappingURL=inputs.mjs.map
|