@indice/ng-components 0.2.173-beta.17 → 0.2.173-beta.18
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/_styles.scss +13 -1
- package/esm2020/lib/controls/advanced-search/advanced-search.component.mjs +43 -5
- package/esm2020/lib/controls/advanced-search/models.mjs +22 -3
- package/esm2020/lib/controls/drop-down-menu/drop-down-menu.component.mjs +2 -2
- package/esm2020/lib/controls/list-view/list-view.component.mjs +1 -1
- package/esm2020/lib/controls/toggle-buttons-list/toggle-buttons-list.component.mjs +6 -3
- package/esm2020/lib/pipes/short-number.pipe.mjs +2 -2
- package/fesm2015/indice-ng-components.mjs +73 -10
- package/fesm2015/indice-ng-components.mjs.map +1 -1
- package/fesm2020/indice-ng-components.mjs +70 -10
- package/fesm2020/indice-ng-components.mjs.map +1 -1
- package/lib/controls/advanced-search/advanced-search.component.d.ts +15 -1
- package/lib/controls/advanced-search/models.d.ts +8 -0
- package/lib/controls/toggle-buttons-list/toggle-buttons-list.component.d.ts +2 -1
- package/package.json +1 -1
|
@@ -5,6 +5,7 @@ import * as i2 from "../drop-down-menu/drop-down-menu.component";
|
|
|
5
5
|
export class ToggleButtonsListComponent {
|
|
6
6
|
constructor() {
|
|
7
7
|
this.icon = undefined;
|
|
8
|
+
this.compact = true;
|
|
8
9
|
this.valueChange = new EventEmitter(undefined);
|
|
9
10
|
}
|
|
10
11
|
ngOnInit() {
|
|
@@ -15,17 +16,19 @@ export class ToggleButtonsListComponent {
|
|
|
15
16
|
}
|
|
16
17
|
}
|
|
17
18
|
ToggleButtonsListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.3", ngImport: i0, type: ToggleButtonsListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
18
|
-
ToggleButtonsListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.3", type: ToggleButtonsListComponent, selector: "lib-toggle-buttons-list", inputs: { icon: "icon", options: "options", value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"relative items-center inline-flex\">\n <div class=\"toggle-buttons-list-icon-container\" *ngIf=\"icon\">\n <i [class]=\"icon\"></i>\n </div>\n <div class=\"toggle-buttons-list-drop-down-contaner\">\n <lib-drop-down-menu class=\"toggle-buttons-list-drop-down\" [(selected)]=\"value\" (selectedChange)=\"selectOption($event)\" [options]=\"options\">\n </lib-drop-down-menu>\n </div>\n <div class=\"toggle-buttons-list\">\n <ng-template ngFor let-option [ngForOf]=\"options\" let-i=\"index\">\n <!-- [tooltip]=\"option.description\" -->\n <button type=\"button\"\n [disabled]=\"option.value === value\"\n [class.toggle-buttons-list-button-selected]=\"option.value === value\"\n class=\"toggle-buttons-list-button\"\n (click)=\"selectOption(option.value)\">\n <div class=\"toggle-buttons-list-button-icon-container\" *ngIf=\"option.icon\">\n <i [class]=\"option.icon\"></i>\n </div>\n <span class=\"toggle-buttons-list-button-button-text\">{{option.text}}</span>\n <span *ngIf=\"option.data && option.data.count\"\n
|
|
19
|
+
ToggleButtonsListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.3", type: ToggleButtonsListComponent, selector: "lib-toggle-buttons-list", inputs: { icon: "icon", options: "options", value: "value", compact: "compact" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"relative items-center inline-flex\">\n <div class=\"toggle-buttons-list-icon-container\" *ngIf=\"icon\">\n <i [class]=\"icon\"></i>\n </div>\n <div class=\"toggle-buttons-list-drop-down-compact-container\" *ngIf=\"compact\">\n <lib-drop-down-menu class=\"toggle-buttons-list-drop-down\" [(selected)]=\"value\" (selectedChange)=\"selectOption($event)\" [options]=\"options\">\n </lib-drop-down-menu>\n </div>\n\n <div class=\"toggle-buttons-list-drop-down-contaner\" *ngIf=\"!compact\">\n <lib-drop-down-menu class=\"toggle-buttons-list-drop-down\" [(selected)]=\"value\" (selectedChange)=\"selectOption($event)\" [options]=\"options\">\n </lib-drop-down-menu>\n </div>\n <div class=\"toggle-buttons-list\" *ngIf=\"!compact\">\n <ng-template ngFor let-option [ngForOf]=\"options\" let-i=\"index\">\n <!-- [tooltip]=\"option.description\" -->\n <button type=\"button\"\n [disabled]=\"option.value === value\"\n [class.toggle-buttons-list-button-selected]=\"option.value === value\"\n class=\"toggle-buttons-list-button\"\n (click)=\"selectOption(option.value)\">\n <div class=\"toggle-buttons-list-button-icon-container\" *ngIf=\"option.icon\">\n <i [class]=\"option.icon\"></i>\n </div>\n <span class=\"toggle-buttons-list-button-button-text\">{{option.text}}</span>\n <span *ngIf=\"option.data && option.data.count\"\n class=\"toggle-buttons-list-button-button-count\">{{option.data.count}}\n </span>\n </button>\n </ng-template>\n </div>\n</div>", 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: "component", type: i2.DropDownMenuComponent, selector: "lib-drop-down-menu", inputs: ["options", "selected", "multiple", "placeholder", "show-icons"], outputs: ["selectedChange", "selectedChanged"] }] });
|
|
19
20
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.3", ngImport: i0, type: ToggleButtonsListComponent, decorators: [{
|
|
20
21
|
type: Component,
|
|
21
|
-
args: [{ selector: 'lib-toggle-buttons-list', template: "<div class=\"relative items-center inline-flex\">\n <div class=\"toggle-buttons-list-icon-container\" *ngIf=\"icon\">\n <i [class]=\"icon\"></i>\n </div>\n <div class=\"toggle-buttons-list-drop-down-contaner\">\n <lib-drop-down-menu class=\"toggle-buttons-list-drop-down\" [(selected)]=\"value\" (selectedChange)=\"selectOption($event)\" [options]=\"options\">\n </lib-drop-down-menu>\n </div>\n <div class=\"toggle-buttons-list\">\n <ng-template ngFor let-option [ngForOf]=\"options\" let-i=\"index\">\n <!-- [tooltip]=\"option.description\" -->\n <button type=\"button\"\n [disabled]=\"option.value === value\"\n [class.toggle-buttons-list-button-selected]=\"option.value === value\"\n class=\"toggle-buttons-list-button\"\n (click)=\"selectOption(option.value)\">\n <div class=\"toggle-buttons-list-button-icon-container\" *ngIf=\"option.icon\">\n <i [class]=\"option.icon\"></i>\n </div>\n <span class=\"toggle-buttons-list-button-button-text\">{{option.text}}</span>\n <span *ngIf=\"option.data && option.data.count\"\n
|
|
22
|
+
args: [{ selector: 'lib-toggle-buttons-list', template: "<div class=\"relative items-center inline-flex\">\n <div class=\"toggle-buttons-list-icon-container\" *ngIf=\"icon\">\n <i [class]=\"icon\"></i>\n </div>\n <div class=\"toggle-buttons-list-drop-down-compact-container\" *ngIf=\"compact\">\n <lib-drop-down-menu class=\"toggle-buttons-list-drop-down\" [(selected)]=\"value\" (selectedChange)=\"selectOption($event)\" [options]=\"options\">\n </lib-drop-down-menu>\n </div>\n\n <div class=\"toggle-buttons-list-drop-down-contaner\" *ngIf=\"!compact\">\n <lib-drop-down-menu class=\"toggle-buttons-list-drop-down\" [(selected)]=\"value\" (selectedChange)=\"selectOption($event)\" [options]=\"options\">\n </lib-drop-down-menu>\n </div>\n <div class=\"toggle-buttons-list\" *ngIf=\"!compact\">\n <ng-template ngFor let-option [ngForOf]=\"options\" let-i=\"index\">\n <!-- [tooltip]=\"option.description\" -->\n <button type=\"button\"\n [disabled]=\"option.value === value\"\n [class.toggle-buttons-list-button-selected]=\"option.value === value\"\n class=\"toggle-buttons-list-button\"\n (click)=\"selectOption(option.value)\">\n <div class=\"toggle-buttons-list-button-icon-container\" *ngIf=\"option.icon\">\n <i [class]=\"option.icon\"></i>\n </div>\n <span class=\"toggle-buttons-list-button-button-text\">{{option.text}}</span>\n <span *ngIf=\"option.data && option.data.count\"\n class=\"toggle-buttons-list-button-button-count\">{{option.data.count}}\n </span>\n </button>\n </ng-template>\n </div>\n</div>" }]
|
|
22
23
|
}], ctorParameters: function () { return []; }, propDecorators: { icon: [{
|
|
23
24
|
type: Input
|
|
24
25
|
}], options: [{
|
|
25
26
|
type: Input
|
|
26
27
|
}], value: [{
|
|
27
28
|
type: Input
|
|
29
|
+
}], compact: [{
|
|
30
|
+
type: Input
|
|
28
31
|
}], valueChange: [{
|
|
29
32
|
type: Output
|
|
30
33
|
}] } });
|
|
31
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
34
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9nZ2xlLWJ1dHRvbnMtbGlzdC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy1jb21wb25lbnRzL3NyYy9saWIvY29udHJvbHMvdG9nZ2xlLWJ1dHRvbnMtbGlzdC90b2dnbGUtYnV0dG9ucy1saXN0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLWNvbXBvbmVudHMvc3JjL2xpYi9jb250cm9scy90b2dnbGUtYnV0dG9ucy1saXN0L3RvZ2dsZS1idXR0b25zLWxpc3QuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBVSxLQUFLLEVBQUUsTUFBTSxFQUFFLFlBQVksRUFBRSxNQUFNLGVBQWUsQ0FBQzs7OztBQVEvRSxNQUFNLE9BQU8sMEJBQTBCO0lBTXJDO1FBTFMsU0FBSSxHQUF1QixTQUFTLENBQUM7UUFHckMsWUFBTyxHQUFZLElBQUksQ0FBQztRQUN2QixnQkFBVyxHQUFzQixJQUFJLFlBQVksQ0FBQyxTQUFTLENBQUMsQ0FBQztJQUN2RCxDQUFDO0lBRWpCLFFBQVE7SUFDUixDQUFDO0lBRU0sWUFBWSxDQUFDLFdBQWdCO1FBQ2xDLElBQUksQ0FBQyxLQUFLLEdBQUcsV0FBVyxDQUFDO1FBQ3pCLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDO0lBQ3JDLENBQUM7O3VIQWRVLDBCQUEwQjsyR0FBMUIsMEJBQTBCLDBMQ1J2Qyxnc0RBK0JNOzJGRHZCTywwQkFBMEI7a0JBSnRDLFNBQVM7K0JBQ0UseUJBQXlCOzBFQUkxQixJQUFJO3NCQUFaLEtBQUs7Z0JBQ0csT0FBTztzQkFBZixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0ksV0FBVztzQkFBcEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgT25Jbml0LCBJbnB1dCwgT3V0cHV0LCBFdmVudEVtaXR0ZXIgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE1lbnVPcHRpb24gfSBmcm9tICcuLi8uLi90eXBlcyc7XG5cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnbGliLXRvZ2dsZS1idXR0b25zLWxpc3QnLFxuICB0ZW1wbGF0ZVVybDogJy4vdG9nZ2xlLWJ1dHRvbnMtbGlzdC5jb21wb25lbnQuaHRtbCdcbn0pXG5leHBvcnQgY2xhc3MgVG9nZ2xlQnV0dG9uc0xpc3RDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICBASW5wdXQoKSBpY29uOiBzdHJpbmcgfCB1bmRlZmluZWQgPSB1bmRlZmluZWQ7XG4gIEBJbnB1dCgpIG9wdGlvbnM6IE1lbnVPcHRpb25bXSB8IHVuZGVmaW5lZDtcbiAgQElucHV0KCkgdmFsdWU6IGFueSB8IHVuZGVmaW5lZDtcbiAgQElucHV0KCkgY29tcGFjdDogYm9vbGVhbiA9IHRydWU7XG4gIEBPdXRwdXQoKSB2YWx1ZUNoYW5nZTogRXZlbnRFbWl0dGVyPGFueT4gPSBuZXcgRXZlbnRFbWl0dGVyKHVuZGVmaW5lZCk7XG4gIGNvbnN0cnVjdG9yKCkgeyB9XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gIH1cblxuICBwdWJsaWMgc2VsZWN0T3B0aW9uKG9wdGlvblZhbHVlOiBhbnkpOiB2b2lkIHtcbiAgICB0aGlzLnZhbHVlID0gb3B0aW9uVmFsdWU7XG4gICAgdGhpcy52YWx1ZUNoYW5nZS5lbWl0KG9wdGlvblZhbHVlKTtcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cInJlbGF0aXZlIGl0ZW1zLWNlbnRlciBpbmxpbmUtZmxleFwiPlxuICAgIDxkaXYgY2xhc3M9XCJ0b2dnbGUtYnV0dG9ucy1saXN0LWljb24tY29udGFpbmVyXCIgKm5nSWY9XCJpY29uXCI+XG4gICAgICAgIDxpIFtjbGFzc109XCJpY29uXCI+PC9pPlxuICAgIDwvZGl2PlxuICAgIDxkaXYgY2xhc3M9XCJ0b2dnbGUtYnV0dG9ucy1saXN0LWRyb3AtZG93bi1jb21wYWN0LWNvbnRhaW5lclwiICpuZ0lmPVwiY29tcGFjdFwiPlxuICAgICAgICA8bGliLWRyb3AtZG93bi1tZW51IGNsYXNzPVwidG9nZ2xlLWJ1dHRvbnMtbGlzdC1kcm9wLWRvd25cIiBbKHNlbGVjdGVkKV09XCJ2YWx1ZVwiIChzZWxlY3RlZENoYW5nZSk9XCJzZWxlY3RPcHRpb24oJGV2ZW50KVwiIFtvcHRpb25zXT1cIm9wdGlvbnNcIj5cbiAgICAgICAgPC9saWItZHJvcC1kb3duLW1lbnU+XG4gICAgPC9kaXY+XG5cbiAgICA8ZGl2IGNsYXNzPVwidG9nZ2xlLWJ1dHRvbnMtbGlzdC1kcm9wLWRvd24tY29udGFuZXJcIiAqbmdJZj1cIiFjb21wYWN0XCI+XG4gICAgICAgIDxsaWItZHJvcC1kb3duLW1lbnUgY2xhc3M9XCJ0b2dnbGUtYnV0dG9ucy1saXN0LWRyb3AtZG93blwiIFsoc2VsZWN0ZWQpXT1cInZhbHVlXCIgKHNlbGVjdGVkQ2hhbmdlKT1cInNlbGVjdE9wdGlvbigkZXZlbnQpXCIgW29wdGlvbnNdPVwib3B0aW9uc1wiPlxuICAgICAgICA8L2xpYi1kcm9wLWRvd24tbWVudT5cbiAgICA8L2Rpdj5cbiAgICA8ZGl2IGNsYXNzPVwidG9nZ2xlLWJ1dHRvbnMtbGlzdFwiICpuZ0lmPVwiIWNvbXBhY3RcIj5cbiAgICAgICAgPG5nLXRlbXBsYXRlIG5nRm9yIGxldC1vcHRpb24gW25nRm9yT2ZdPVwib3B0aW9uc1wiIGxldC1pPVwiaW5kZXhcIj5cbiAgICAgICAgICAgIDwhLS0gW3Rvb2x0aXBdPVwib3B0aW9uLmRlc2NyaXB0aW9uXCIgLS0+XG4gICAgICAgICAgICA8YnV0dG9uIHR5cGU9XCJidXR0b25cIlxuICAgICAgICAgICAgICAgICAgICBbZGlzYWJsZWRdPVwib3B0aW9uLnZhbHVlID09PSB2YWx1ZVwiXG4gICAgICAgICAgICAgICAgICAgIFtjbGFzcy50b2dnbGUtYnV0dG9ucy1saXN0LWJ1dHRvbi1zZWxlY3RlZF09XCJvcHRpb24udmFsdWUgPT09IHZhbHVlXCJcbiAgICAgICAgICAgICAgICAgICAgY2xhc3M9XCJ0b2dnbGUtYnV0dG9ucy1saXN0LWJ1dHRvblwiXG4gICAgICAgICAgICAgICAgICAgIChjbGljayk9XCJzZWxlY3RPcHRpb24ob3B0aW9uLnZhbHVlKVwiPlxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cInRvZ2dsZS1idXR0b25zLWxpc3QtYnV0dG9uLWljb24tY29udGFpbmVyXCIgKm5nSWY9XCJvcHRpb24uaWNvblwiPlxuICAgICAgICAgICAgICAgIDxpIFtjbGFzc109XCJvcHRpb24uaWNvblwiPjwvaT5cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJ0b2dnbGUtYnV0dG9ucy1saXN0LWJ1dHRvbi1idXR0b24tdGV4dFwiPnt7b3B0aW9uLnRleHR9fTwvc3Bhbj5cbiAgICAgICAgICAgIDxzcGFuICpuZ0lmPVwib3B0aW9uLmRhdGEgJiYgb3B0aW9uLmRhdGEuY291bnRcIlxuICAgICAgICAgICAgICAgIGNsYXNzPVwidG9nZ2xlLWJ1dHRvbnMtbGlzdC1idXR0b24tYnV0dG9uLWNvdW50XCI+e3tvcHRpb24uZGF0YS5jb3VudH19XG4gICAgICAgICAgICA8L3NwYW4+XG4gICAgICAgICAgICA8L2J1dHRvbj5cbiAgICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICA8L2Rpdj5cbjwvZGl2PiJdfQ==
|
|
@@ -22,7 +22,7 @@ export class ShortNumberPipe {
|
|
|
22
22
|
for (let i = 0; i < powers.length; i++) {
|
|
23
23
|
let reduced = abs / powers[i].value;
|
|
24
24
|
reduced = Math.round(reduced * rounder) / rounder;
|
|
25
|
-
if (reduced
|
|
25
|
+
if (reduced >= 1) {
|
|
26
26
|
abs = reduced;
|
|
27
27
|
key = powers[i].key;
|
|
28
28
|
break;
|
|
@@ -40,4 +40,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.3", ngImpor
|
|
|
40
40
|
pure: false
|
|
41
41
|
}]
|
|
42
42
|
}] });
|
|
43
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
43
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2hvcnQtbnVtYmVyLnBpcGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy1jb21wb25lbnRzL3NyYy9saWIvcGlwZXMvc2hvcnQtbnVtYmVyLnBpcGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLElBQUksRUFBaUIsTUFBTSxlQUFlLENBQUM7O0FBTXBELE1BQU0sT0FBTyxlQUFlO0lBRXhCLFNBQVMsQ0FBQyxNQUFjLEVBQUUsSUFBVTtRQUNoQyxJQUFJLEtBQUssQ0FBQyxNQUFNLENBQUM7WUFBRSxPQUFPLElBQUksQ0FBQyxDQUFDLG1DQUFtQztRQUNuRSxJQUFJLE1BQU0sS0FBSyxJQUFJO1lBQUUsT0FBTyxJQUFJLENBQUM7UUFDakMsSUFBSSxNQUFNLEtBQUssQ0FBQztZQUFFLE9BQU8sSUFBSSxDQUFDO1FBQzlCLElBQUksR0FBRyxHQUFHLElBQUksQ0FBQyxHQUFHLENBQUMsTUFBTSxDQUFDLENBQUM7UUFDM0IsTUFBTSxPQUFPLEdBQUcsSUFBSSxDQUFDLEdBQUcsQ0FBQyxFQUFFLEVBQUUsQ0FBQyxDQUFDLENBQUM7UUFDaEMsTUFBTSxVQUFVLEdBQUcsTUFBTSxHQUFHLENBQUMsQ0FBQyxDQUFDLHNDQUFzQztRQUNyRSxJQUFJLEdBQUcsR0FBRyxFQUFFLENBQUM7UUFFYixNQUFNLE1BQU0sR0FBRztZQUNYLEVBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxLQUFLLEVBQUUsSUFBSSxDQUFDLEdBQUcsQ0FBQyxFQUFFLEVBQUUsRUFBRSxDQUFDLEVBQUM7WUFDbkMsRUFBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEtBQUssRUFBRSxJQUFJLENBQUMsR0FBRyxDQUFDLEVBQUUsRUFBRSxFQUFFLENBQUMsRUFBQztZQUNuQyxFQUFDLEdBQUcsRUFBRSxHQUFHLEVBQUUsS0FBSyxFQUFFLElBQUksQ0FBQyxHQUFHLENBQUMsRUFBRSxFQUFFLENBQUMsQ0FBQyxFQUFDO1lBQ2xDLEVBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxLQUFLLEVBQUUsSUFBSSxDQUFDLEdBQUcsQ0FBQyxFQUFFLEVBQUUsQ0FBQyxDQUFDLEVBQUM7WUFDbEMsRUFBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEtBQUssRUFBRSxJQUFJLEVBQUM7U0FDMUIsQ0FBQztRQUVGLEtBQUssSUFBSSxDQUFDLEdBQUcsQ0FBQyxFQUFFLENBQUMsR0FBRyxNQUFNLENBQUMsTUFBTSxFQUFFLENBQUMsRUFBRSxFQUFFO1lBQ3BDLElBQUksT0FBTyxHQUFHLEdBQUcsR0FBRyxNQUFNLENBQUMsQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDO1lBQ3BDLE9BQU8sR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLE9BQU8sR0FBRyxPQUFPLENBQUMsR0FBRyxPQUFPLENBQUM7WUFDbEQsSUFBSSxPQUFPLElBQUksQ0FBQyxFQUFFO2dCQUNkLEdBQUcsR0FBRyxPQUFPLENBQUM7Z0JBQ2QsR0FBRyxHQUFHLE1BQU0sQ0FBQyxDQUFDLENBQUMsQ0FBQyxHQUFHLENBQUM7Z0JBQ3BCLE1BQU07YUFDVDtTQUNKO1FBQ0QsT0FBTyxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUMsR0FBRyxHQUFHLEdBQUcsR0FBRyxDQUFDO0lBQy9DLENBQUM7OzRHQTdCUSxlQUFlOzBHQUFmLGVBQWU7MkZBQWYsZUFBZTtrQkFKM0IsSUFBSTttQkFBQztvQkFDRixJQUFJLEVBQUUsYUFBYTtvQkFDbkIsSUFBSSxFQUFFLEtBQUs7aUJBQ1oiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBQaXBlLCBQaXBlVHJhbnNmb3JtIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcblxyXG5AUGlwZSh7XHJcbiAgICBuYW1lOiAnc2hvcnROdW1iZXInLFxyXG4gICAgcHVyZTogZmFsc2VcclxuICB9KVxyXG5leHBvcnQgY2xhc3MgU2hvcnROdW1iZXJQaXBlIGltcGxlbWVudHMgUGlwZVRyYW5zZm9ybSB7XHJcblxyXG4gICAgdHJhbnNmb3JtKG51bWJlcjogbnVtYmVyLCBhcmdzPzogYW55KTogYW55IHtcclxuICAgICAgICBpZiAoaXNOYU4obnVtYmVyKSkgcmV0dXJuIG51bGw7IC8vIHdpbGwgb25seSB3b3JrIHZhbHVlIGlzIGEgbnVtYmVyXHJcbiAgICAgICAgaWYgKG51bWJlciA9PT0gbnVsbCkgcmV0dXJuIG51bGw7XHJcbiAgICAgICAgaWYgKG51bWJlciA9PT0gMCkgcmV0dXJuIG51bGw7XHJcbiAgICAgICAgbGV0IGFicyA9IE1hdGguYWJzKG51bWJlcik7XHJcbiAgICAgICAgY29uc3Qgcm91bmRlciA9IE1hdGgucG93KDEwLCAxKTtcclxuICAgICAgICBjb25zdCBpc05lZ2F0aXZlID0gbnVtYmVyIDwgMDsgLy8gd2lsbCBhbHNvIHdvcmsgZm9yIE5lZ2F0aXZlIG51bWJlcnNcclxuICAgICAgICBsZXQga2V5ID0gJyc7XHJcblxyXG4gICAgICAgIGNvbnN0IHBvd2VycyA9IFtcclxuICAgICAgICAgICAge2tleTogJ1EnLCB2YWx1ZTogTWF0aC5wb3coMTAsIDE1KX0sXHJcbiAgICAgICAgICAgIHtrZXk6ICdUJywgdmFsdWU6IE1hdGgucG93KDEwLCAxMil9LFxyXG4gICAgICAgICAgICB7a2V5OiAnQicsIHZhbHVlOiBNYXRoLnBvdygxMCwgOSl9LFxyXG4gICAgICAgICAgICB7a2V5OiAnTScsIHZhbHVlOiBNYXRoLnBvdygxMCwgNil9LFxyXG4gICAgICAgICAgICB7a2V5OiAnSycsIHZhbHVlOiAxMDAwfVxyXG4gICAgICAgIF07XHJcblxyXG4gICAgICAgIGZvciAobGV0IGkgPSAwOyBpIDwgcG93ZXJzLmxlbmd0aDsgaSsrKSB7XHJcbiAgICAgICAgICAgIGxldCByZWR1Y2VkID0gYWJzIC8gcG93ZXJzW2ldLnZhbHVlO1xyXG4gICAgICAgICAgICByZWR1Y2VkID0gTWF0aC5yb3VuZChyZWR1Y2VkICogcm91bmRlcikgLyByb3VuZGVyO1xyXG4gICAgICAgICAgICBpZiAocmVkdWNlZCA+PSAxKSB7XHJcbiAgICAgICAgICAgICAgICBhYnMgPSByZWR1Y2VkO1xyXG4gICAgICAgICAgICAgICAga2V5ID0gcG93ZXJzW2ldLmtleTtcclxuICAgICAgICAgICAgICAgIGJyZWFrO1xyXG4gICAgICAgICAgICB9XHJcbiAgICAgICAgfVxyXG4gICAgICAgIHJldHVybiAoaXNOZWdhdGl2ZSA/ICctJyA6ICcnKSArIGFicyArIGtleTtcclxuICAgIH1cclxufSJdfQ==
|
|
@@ -204,7 +204,7 @@ class DropDownMenuComponent {
|
|
|
204
204
|
this.selectedValue = null;
|
|
205
205
|
this.multiple = false;
|
|
206
206
|
this.placeholder = 'Παρακαλώ επιλέξτε...';
|
|
207
|
-
this.showIcons =
|
|
207
|
+
this.showIcons = true;
|
|
208
208
|
this.selectedOption$ = null;
|
|
209
209
|
this.selectedChange = new EventEmitter();
|
|
210
210
|
this.selectedChanged = new EventEmitter();
|
|
@@ -895,6 +895,10 @@ var QueryParameters;
|
|
|
895
895
|
QueryParameters["FILTER_FROM"] = "from";
|
|
896
896
|
QueryParameters["FILTER_TO"] = "to";
|
|
897
897
|
})(QueryParameters || (QueryParameters = {}));
|
|
898
|
+
const OperatorOptions = {
|
|
899
|
+
'string': [Operators.EQUALS, Operators.NOT_EQUALS, Operators.CONTAINS],
|
|
900
|
+
'array': [Operators.EQUALS, Operators.NOT_EQUALS]
|
|
901
|
+
};
|
|
898
902
|
class FilterClause {
|
|
899
903
|
constructor(member, value, operator, dataType, searchOptions) {
|
|
900
904
|
var _a;
|
|
@@ -918,8 +922,23 @@ class FilterClause {
|
|
|
918
922
|
this.uiName = fo.name;
|
|
919
923
|
}
|
|
920
924
|
}
|
|
921
|
-
// uiOperator
|
|
922
|
-
|
|
925
|
+
// We don't want a uiOperator for the datetime dataType. For strings and arrays we have the equals/not-equals/contains operators. The switch case can be expanded for more data types/operators when needed.
|
|
926
|
+
if (this.dataType === 'datetime') {
|
|
927
|
+
this.uiOperator = '';
|
|
928
|
+
}
|
|
929
|
+
else {
|
|
930
|
+
switch (this.operator) {
|
|
931
|
+
case (Operators.EQUALS.value):
|
|
932
|
+
this.uiOperator = Operators.EQUALS.label;
|
|
933
|
+
break;
|
|
934
|
+
case (Operators.NOT_EQUALS.value):
|
|
935
|
+
this.uiOperator = Operators.NOT_EQUALS.label;
|
|
936
|
+
break;
|
|
937
|
+
case (Operators.CONTAINS.value):
|
|
938
|
+
this.uiOperator = Operators.CONTAINS.label;
|
|
939
|
+
break;
|
|
940
|
+
}
|
|
941
|
+
}
|
|
923
942
|
// uiValue
|
|
924
943
|
this.uiValue = this.value;
|
|
925
944
|
if ((this.dataType === 'datetime')) {
|
|
@@ -1259,8 +1278,12 @@ class AdvancedSearchComponent {
|
|
|
1259
1278
|
constructor() {
|
|
1260
1279
|
this.advancedSearchChanged = new EventEmitter();
|
|
1261
1280
|
this.searchOptions = [];
|
|
1281
|
+
this.operatorsDisabled = false;
|
|
1262
1282
|
this.filters = [];
|
|
1263
1283
|
this.menuOptions = [];
|
|
1284
|
+
this.operatorMenuOptions = [];
|
|
1285
|
+
this.operatorOptions = OperatorOptions;
|
|
1286
|
+
this.operators = {};
|
|
1264
1287
|
this.menuOptionsDictionary = {};
|
|
1265
1288
|
}
|
|
1266
1289
|
ngOnInit() {
|
|
@@ -1289,13 +1312,37 @@ class AdvancedSearchComponent {
|
|
|
1289
1312
|
});
|
|
1290
1313
|
}
|
|
1291
1314
|
selectedFieldChanged(field) {
|
|
1315
|
+
var _a, _b, _c;
|
|
1292
1316
|
this.selectedField = this.searchOptions.find((searchOption) => searchOption.field === field);
|
|
1317
|
+
this.selectedOperator = undefined;
|
|
1318
|
+
// Since we have special UI handling for the daterange, we don't need to fill the operatorMenuOptions in that case.
|
|
1319
|
+
if (((_a = this.selectedField) === null || _a === void 0 ? void 0 : _a.dataType) != 'daterange') {
|
|
1320
|
+
let operatorMenuOpts = [];
|
|
1321
|
+
// based on the data type that we are filtering, fill the operator dropdown with the correct operators. The default is the string with equals/not-equals/contains
|
|
1322
|
+
this.operatorOptions[(_c = (_b = this.selectedField) === null || _b === void 0 ? void 0 : _b.dataType) !== null && _c !== void 0 ? _c : 'string'].forEach(x => {
|
|
1323
|
+
var _a;
|
|
1324
|
+
operatorMenuOpts.push({
|
|
1325
|
+
text: (_a = x.description) !== null && _a !== void 0 ? _a : x.label,
|
|
1326
|
+
value: x.value,
|
|
1327
|
+
data: undefined,
|
|
1328
|
+
description: x.description,
|
|
1329
|
+
icon: undefined
|
|
1330
|
+
});
|
|
1331
|
+
});
|
|
1332
|
+
this.operatorMenuOptions = operatorMenuOpts;
|
|
1333
|
+
// Preselect the first option from the operators menu so there will always be a default value, which is the 'equals' operator for all data types for now.
|
|
1334
|
+
this.selectedOperator = this.operatorMenuOptions[0].value;
|
|
1335
|
+
}
|
|
1293
1336
|
this.fieldValue = undefined;
|
|
1294
1337
|
}
|
|
1338
|
+
selectedOperatorChanged(operator) {
|
|
1339
|
+
this.selectedOperator = operator;
|
|
1340
|
+
}
|
|
1295
1341
|
selectedFieldValueChanged(fieldValue) {
|
|
1296
1342
|
this.fieldValue = fieldValue;
|
|
1297
1343
|
}
|
|
1298
1344
|
search() {
|
|
1345
|
+
var _a;
|
|
1299
1346
|
if (!this.selectedField || !this.selectedField.dataType) {
|
|
1300
1347
|
return;
|
|
1301
1348
|
}
|
|
@@ -1320,8 +1367,10 @@ class AdvancedSearchComponent {
|
|
|
1320
1367
|
if (this.fieldValue === undefined) { // handle empty field value
|
|
1321
1368
|
return;
|
|
1322
1369
|
}
|
|
1370
|
+
// if no operator was provided, it falls back to the default 'equals' operator
|
|
1371
|
+
this.selectedOperator = (_a = this.selectedOperator) !== null && _a !== void 0 ? _a : Operators.EQUALS.value;
|
|
1323
1372
|
// create the filterClause
|
|
1324
|
-
const filterClause = new FilterClause(this.selectedField.field, this.fieldValue,
|
|
1373
|
+
const filterClause = new FilterClause(this.selectedField.field, this.fieldValue, this.selectedOperator, this.selectedField.dataType, this.searchOptions);
|
|
1325
1374
|
if (!this.selectedField.multiTerm) { // multiTerm means that we can have multiple filter values of the SAME filter clause (eg "filter case types that are Phone OR Address")
|
|
1326
1375
|
this.filters = this.filters.filter((f) => {
|
|
1327
1376
|
return f.member !== this.selectedField.field;
|
|
@@ -1344,25 +1393,36 @@ class AdvancedSearchComponent {
|
|
|
1344
1393
|
this.advancedSearchChanged.emit(this.filters);
|
|
1345
1394
|
}
|
|
1346
1395
|
}
|
|
1396
|
+
isDateValueUnpicked() {
|
|
1397
|
+
return this.fieldValueDateFrom === undefined && this.fieldValueDateTo === undefined;
|
|
1398
|
+
}
|
|
1399
|
+
isFieldAndOperatorUnpicked() {
|
|
1400
|
+
// if the operators are enabled we need to check for both the field value and the operator value
|
|
1401
|
+
return this.operatorsDisabled ? this.fieldValue === undefined : (this.fieldValue === undefined || this.selectedOperator === undefined);
|
|
1402
|
+
}
|
|
1347
1403
|
clear() {
|
|
1348
1404
|
this.fieldValueDateFrom = undefined;
|
|
1349
1405
|
this.fieldValueDateTo = undefined;
|
|
1350
1406
|
this.selectedField = undefined;
|
|
1351
1407
|
this.fieldValue = undefined;
|
|
1408
|
+
this.selectedOperator = undefined;
|
|
1352
1409
|
this.filters = [];
|
|
1353
1410
|
this.advancedSearchChanged.emit(this.filters);
|
|
1354
1411
|
}
|
|
1355
1412
|
}
|
|
1356
1413
|
AdvancedSearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.3", ngImport: i0, type: AdvancedSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1357
|
-
AdvancedSearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.3", type: AdvancedSearchComponent, selector: "lib-advanced-search", inputs: { searchOptions: ["search-options", "searchOptions"], filters: "filters" }, outputs: { advancedSearchChanged: "advancedSearchChanged" }, ngImport: i0, template: "<div class=\"advanced-search-container\">\r\n <div class=\"advanced-search-filter\">\r\n <!--SEARCH FIELDS-->\r\n <div class=\"advanced-search-filter-field-container\">\r\n <label class=\"advanced-search-filter-field-label\"\r\n for=\"selectedField\">\r\n \u0391\u03BD\u03B1\u03B6\u03AE\u03C4\u03B7\u03C3\u03B7 \u03B1\u03BD\u03AC:\r\n </label>\r\n <lib-drop-down-menu [options]=\"menuOptions\"\r\n (selectedChanged)=\"selectedFieldChanged($event)\"></lib-drop-down-menu>\r\n </div>\r\n <!--SEARCH FIELDS INPUT-->\r\n <div *ngIf=\"selectedField\"\r\n class=\"advanced-search-filter-value-container\">\r\n <div *ngIf=\"selectedField.dataType === 'array'\">\r\n <label class=\"advanced-search-filter-value-label\"\r\n for=\"fieldValue\">\r\n \r\n </label>\r\n <lib-drop-down-menu [options]=\"menuOptionsDictionary[selectedField.field]\"\r\n [selected]=\"fieldValue\"\r\n (selectedChanged)=\"selectedFieldValueChanged($event)\"></lib-drop-down-menu>\r\n </div>\r\n <div *ngIf=\"selectedField.dataType === 'string'\">\r\n <label class=\"advanced-search-filter-value-label\"\r\n for=\"fieldValue\">\r\n \r\n </label>\r\n <input (keyup.enter)=\"search()\"\r\n [(ngModel)]=\"fieldValue\"\r\n name=\"fieldValue\"\r\n type=\"text\"\r\n placeholder=\"\u0391\u03BD\u03B1\u03B6\u03AE\u03C4\u03B7\u03C3\u03B7\"\r\n maxlength=\"300\"\r\n class=\"advanced-search-filter-value-input\">\r\n </div>\r\n <ng-container *ngIf=\"selectedField.dataType === 'daterange'\">\r\n <div>\r\n <span class=\"advanced-search-filter-value-input-daterange-from\">\r\n \u0391\u03C0\u03CC:\r\n </span>\r\n <lib-date-picker [maxDate]=\"fieldValueDateTo\"\r\n [(ngModel)]=\"fieldValueDateFrom\"\r\n [placeholder]=\"'01/01/2022'\"></lib-date-picker>\r\n </div>\r\n <div *ngIf=\"selectedField.dataType === 'daterange'\">\r\n <span class=\"advanced-search-filter-value-input-daterange-to\">\r\n \u0388\u03C9\u03C2:\r\n </span>\r\n <lib-date-picker [minDate]=\"fieldValueDateFrom\"\r\n [(ngModel)]=\"fieldValueDateTo\"\r\n [placeholder]=\"'01/01/2022'\"></lib-date-picker>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <ng-container *ngIf=\"selectedField\">\r\n <!--DO SEARCH-->\r\n <button type=\"button\"\r\n [ngClass]=\"{'opacity-50 cursor-not-allowed':
|
|
1414
|
+
AdvancedSearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.3", type: AdvancedSearchComponent, selector: "lib-advanced-search", inputs: { searchOptions: ["search-options", "searchOptions"], operatorsDisabled: ["operators-disabled", "operatorsDisabled"], filters: "filters" }, outputs: { advancedSearchChanged: "advancedSearchChanged" }, ngImport: i0, template: "<div class=\"advanced-search-container\">\r\n <div class=\"advanced-search-filter\">\r\n <!--SEARCH FIELDS-->\r\n <div class=\"advanced-search-filter-field-container\">\r\n <label class=\"advanced-search-filter-field-label\"\r\n for=\"selectedField\">\r\n \u0391\u03BD\u03B1\u03B6\u03AE\u03C4\u03B7\u03C3\u03B7 \u03B1\u03BD\u03AC:\r\n </label>\r\n <lib-drop-down-menu [options]=\"menuOptions\"\r\n (selectedChanged)=\"selectedFieldChanged($event)\"></lib-drop-down-menu>\r\n </div>\r\n <!--SEARCH FIELDS OPERATOR MENU-->\r\n <div *ngIf=\"!operatorsDisabled && selectedField\"\r\n class=\"advanced-search-filter-operator-container\">\r\n <div *ngIf=\"selectedField.dataType === 'array' || selectedField.dataType === 'string'\">\r\n <label class=\"advanced-search-filter-operator-label\"\r\n for=\"selectedOperator\">\r\n \r\n </label>\r\n <lib-drop-down-menu [options]=\"operatorMenuOptions\"\r\n [selected]=\"selectedOperator\"\r\n (selectedChanged)=\"selectedOperatorChanged($event)\"></lib-drop-down-menu>\r\n </div>\r\n </div>\r\n <!--SEARCH FIELDS INPUT-->\r\n <div *ngIf=\"selectedField\"\r\n class=\"advanced-search-filter-value-container\">\r\n <div *ngIf=\"selectedField.dataType === 'array'\">\r\n <label class=\"advanced-search-filter-value-label\"\r\n for=\"fieldValue\">\r\n \r\n </label>\r\n <lib-drop-down-menu [options]=\"menuOptionsDictionary[selectedField.field]\"\r\n [selected]=\"fieldValue\"\r\n (selectedChanged)=\"selectedFieldValueChanged($event)\"></lib-drop-down-menu>\r\n </div>\r\n <div *ngIf=\"selectedField.dataType === 'string'\">\r\n <label class=\"advanced-search-filter-value-label\"\r\n for=\"fieldValue\">\r\n \r\n </label>\r\n <input (keyup.enter)=\"search()\"\r\n [(ngModel)]=\"fieldValue\"\r\n name=\"fieldValue\"\r\n type=\"text\"\r\n placeholder=\"\u0391\u03BD\u03B1\u03B6\u03AE\u03C4\u03B7\u03C3\u03B7\"\r\n maxlength=\"300\"\r\n class=\"advanced-search-filter-value-input\">\r\n </div>\r\n <ng-container *ngIf=\"selectedField.dataType === 'daterange'\">\r\n <div>\r\n <span class=\"advanced-search-filter-value-input-daterange-from\">\r\n \u0391\u03C0\u03CC:\r\n </span>\r\n <lib-date-picker [maxDate]=\"fieldValueDateTo\"\r\n [(ngModel)]=\"fieldValueDateFrom\"\r\n [placeholder]=\"'01/01/2022'\"></lib-date-picker>\r\n </div>\r\n <div *ngIf=\"selectedField.dataType === 'daterange'\">\r\n <span class=\"advanced-search-filter-value-input-daterange-to\">\r\n \u0388\u03C9\u03C2:\r\n </span>\r\n <lib-date-picker [minDate]=\"fieldValueDateFrom\"\r\n [(ngModel)]=\"fieldValueDateTo\"\r\n [placeholder]=\"'01/01/2022'\"></lib-date-picker>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <ng-container *ngIf=\"selectedField\">\r\n <!--DO SEARCH-->\r\n <button type=\"button\"\r\n [ngClass]=\"{'opacity-50 cursor-not-allowed': isDateValueUnpicked() && isFieldAndOperatorUnpicked()}\"\r\n [disabled]=\"isDateValueUnpicked() && isFieldAndOperatorUnpicked()\"\r\n (click)=\"search()\">\r\n <i [class]=\"'ms-Icon ms-Icon--Search'\"></i>\r\n </button>\r\n <!--CLEAR-->\r\n <button type=\"button\"\r\n (click)=\"clear()\">\r\n <i [class]=\"'ms-Icon ms-Icon--Cancel'\"></i>\r\n </button>\r\n </ng-container>\r\n </div>\r\n <!--FILTER CHIPS-->\r\n <!-- This example requires Tailwind CSS v2.0+ -->\r\n <ng-container *ngFor=\"let filter of filters; let i = index\">\r\n <span *ngIf=\"filter && filter.member\"\r\n class=\"advanced-search-chips\">\r\n {{ filter.uiName }} {{ filter.uiOperator }} '{{ filter.uiValue }}'\r\n <button (click)=\"removeFilter(i)\"\r\n type=\"button\"\r\n class=\"advanced-search-chips-remove-filter\">\r\n <span class=\"sr-only\">Remove large option</span>\r\n <svg class=\"h-2 w-2\"\r\n stroke=\"currentColor\"\r\n fill=\"none\"\r\n viewBox=\"0 0 8 8\">\r\n <path stroke-linecap=\"round\"\r\n stroke-width=\"1.5\"\r\n d=\"M1 1l6 6m0-6L1 7\" />\r\n </svg>\r\n </button>\r\n </span>\r\n </ng-container>\r\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: DatepickerComponent, selector: "lib-date-picker", inputs: ["readonly", "disabled", "inline", "display-format", "placeholder", "value", "minDate", "maxDate"], outputs: ["valueChange"] }, { kind: "component", type: DropDownMenuComponent, selector: "lib-drop-down-menu", inputs: ["options", "selected", "multiple", "placeholder", "show-icons"], outputs: ["selectedChange", "selectedChanged"] }] });
|
|
1358
1415
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.3", ngImport: i0, type: AdvancedSearchComponent, decorators: [{
|
|
1359
1416
|
type: Component,
|
|
1360
|
-
args: [{ selector: 'lib-advanced-search', template: "<div class=\"advanced-search-container\">\r\n <div class=\"advanced-search-filter\">\r\n <!--SEARCH FIELDS-->\r\n <div class=\"advanced-search-filter-field-container\">\r\n <label class=\"advanced-search-filter-field-label\"\r\n for=\"selectedField\">\r\n \u0391\u03BD\u03B1\u03B6\u03AE\u03C4\u03B7\u03C3\u03B7 \u03B1\u03BD\u03AC:\r\n </label>\r\n <lib-drop-down-menu [options]=\"menuOptions\"\r\n (selectedChanged)=\"selectedFieldChanged($event)\"></lib-drop-down-menu>\r\n </div>\r\n <!--SEARCH FIELDS INPUT-->\r\n <div *ngIf=\"selectedField\"\r\n class=\"advanced-search-filter-value-container\">\r\n <div *ngIf=\"selectedField.dataType === 'array'\">\r\n <label class=\"advanced-search-filter-value-label\"\r\n for=\"fieldValue\">\r\n \r\n </label>\r\n <lib-drop-down-menu [options]=\"menuOptionsDictionary[selectedField.field]\"\r\n [selected]=\"fieldValue\"\r\n (selectedChanged)=\"selectedFieldValueChanged($event)\"></lib-drop-down-menu>\r\n </div>\r\n <div *ngIf=\"selectedField.dataType === 'string'\">\r\n <label class=\"advanced-search-filter-value-label\"\r\n for=\"fieldValue\">\r\n \r\n </label>\r\n <input (keyup.enter)=\"search()\"\r\n [(ngModel)]=\"fieldValue\"\r\n name=\"fieldValue\"\r\n type=\"text\"\r\n placeholder=\"\u0391\u03BD\u03B1\u03B6\u03AE\u03C4\u03B7\u03C3\u03B7\"\r\n maxlength=\"300\"\r\n class=\"advanced-search-filter-value-input\">\r\n </div>\r\n <ng-container *ngIf=\"selectedField.dataType === 'daterange'\">\r\n <div>\r\n <span class=\"advanced-search-filter-value-input-daterange-from\">\r\n \u0391\u03C0\u03CC:\r\n </span>\r\n <lib-date-picker [maxDate]=\"fieldValueDateTo\"\r\n [(ngModel)]=\"fieldValueDateFrom\"\r\n [placeholder]=\"'01/01/2022'\"></lib-date-picker>\r\n </div>\r\n <div *ngIf=\"selectedField.dataType === 'daterange'\">\r\n <span class=\"advanced-search-filter-value-input-daterange-to\">\r\n \u0388\u03C9\u03C2:\r\n </span>\r\n <lib-date-picker [minDate]=\"fieldValueDateFrom\"\r\n [(ngModel)]=\"fieldValueDateTo\"\r\n [placeholder]=\"'01/01/2022'\"></lib-date-picker>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <ng-container *ngIf=\"selectedField\">\r\n <!--DO SEARCH-->\r\n <button type=\"button\"\r\n [ngClass]=\"{'opacity-50 cursor-not-allowed':
|
|
1417
|
+
args: [{ selector: 'lib-advanced-search', template: "<div class=\"advanced-search-container\">\r\n <div class=\"advanced-search-filter\">\r\n <!--SEARCH FIELDS-->\r\n <div class=\"advanced-search-filter-field-container\">\r\n <label class=\"advanced-search-filter-field-label\"\r\n for=\"selectedField\">\r\n \u0391\u03BD\u03B1\u03B6\u03AE\u03C4\u03B7\u03C3\u03B7 \u03B1\u03BD\u03AC:\r\n </label>\r\n <lib-drop-down-menu [options]=\"menuOptions\"\r\n (selectedChanged)=\"selectedFieldChanged($event)\"></lib-drop-down-menu>\r\n </div>\r\n <!--SEARCH FIELDS OPERATOR MENU-->\r\n <div *ngIf=\"!operatorsDisabled && selectedField\"\r\n class=\"advanced-search-filter-operator-container\">\r\n <div *ngIf=\"selectedField.dataType === 'array' || selectedField.dataType === 'string'\">\r\n <label class=\"advanced-search-filter-operator-label\"\r\n for=\"selectedOperator\">\r\n \r\n </label>\r\n <lib-drop-down-menu [options]=\"operatorMenuOptions\"\r\n [selected]=\"selectedOperator\"\r\n (selectedChanged)=\"selectedOperatorChanged($event)\"></lib-drop-down-menu>\r\n </div>\r\n </div>\r\n <!--SEARCH FIELDS INPUT-->\r\n <div *ngIf=\"selectedField\"\r\n class=\"advanced-search-filter-value-container\">\r\n <div *ngIf=\"selectedField.dataType === 'array'\">\r\n <label class=\"advanced-search-filter-value-label\"\r\n for=\"fieldValue\">\r\n \r\n </label>\r\n <lib-drop-down-menu [options]=\"menuOptionsDictionary[selectedField.field]\"\r\n [selected]=\"fieldValue\"\r\n (selectedChanged)=\"selectedFieldValueChanged($event)\"></lib-drop-down-menu>\r\n </div>\r\n <div *ngIf=\"selectedField.dataType === 'string'\">\r\n <label class=\"advanced-search-filter-value-label\"\r\n for=\"fieldValue\">\r\n \r\n </label>\r\n <input (keyup.enter)=\"search()\"\r\n [(ngModel)]=\"fieldValue\"\r\n name=\"fieldValue\"\r\n type=\"text\"\r\n placeholder=\"\u0391\u03BD\u03B1\u03B6\u03AE\u03C4\u03B7\u03C3\u03B7\"\r\n maxlength=\"300\"\r\n class=\"advanced-search-filter-value-input\">\r\n </div>\r\n <ng-container *ngIf=\"selectedField.dataType === 'daterange'\">\r\n <div>\r\n <span class=\"advanced-search-filter-value-input-daterange-from\">\r\n \u0391\u03C0\u03CC:\r\n </span>\r\n <lib-date-picker [maxDate]=\"fieldValueDateTo\"\r\n [(ngModel)]=\"fieldValueDateFrom\"\r\n [placeholder]=\"'01/01/2022'\"></lib-date-picker>\r\n </div>\r\n <div *ngIf=\"selectedField.dataType === 'daterange'\">\r\n <span class=\"advanced-search-filter-value-input-daterange-to\">\r\n \u0388\u03C9\u03C2:\r\n </span>\r\n <lib-date-picker [minDate]=\"fieldValueDateFrom\"\r\n [(ngModel)]=\"fieldValueDateTo\"\r\n [placeholder]=\"'01/01/2022'\"></lib-date-picker>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <ng-container *ngIf=\"selectedField\">\r\n <!--DO SEARCH-->\r\n <button type=\"button\"\r\n [ngClass]=\"{'opacity-50 cursor-not-allowed': isDateValueUnpicked() && isFieldAndOperatorUnpicked()}\"\r\n [disabled]=\"isDateValueUnpicked() && isFieldAndOperatorUnpicked()\"\r\n (click)=\"search()\">\r\n <i [class]=\"'ms-Icon ms-Icon--Search'\"></i>\r\n </button>\r\n <!--CLEAR-->\r\n <button type=\"button\"\r\n (click)=\"clear()\">\r\n <i [class]=\"'ms-Icon ms-Icon--Cancel'\"></i>\r\n </button>\r\n </ng-container>\r\n </div>\r\n <!--FILTER CHIPS-->\r\n <!-- This example requires Tailwind CSS v2.0+ -->\r\n <ng-container *ngFor=\"let filter of filters; let i = index\">\r\n <span *ngIf=\"filter && filter.member\"\r\n class=\"advanced-search-chips\">\r\n {{ filter.uiName }} {{ filter.uiOperator }} '{{ filter.uiValue }}'\r\n <button (click)=\"removeFilter(i)\"\r\n type=\"button\"\r\n class=\"advanced-search-chips-remove-filter\">\r\n <span class=\"sr-only\">Remove large option</span>\r\n <svg class=\"h-2 w-2\"\r\n stroke=\"currentColor\"\r\n fill=\"none\"\r\n viewBox=\"0 0 8 8\">\r\n <path stroke-linecap=\"round\"\r\n stroke-width=\"1.5\"\r\n d=\"M1 1l6 6m0-6L1 7\" />\r\n </svg>\r\n </button>\r\n </span>\r\n </ng-container>\r\n</div>" }]
|
|
1361
1418
|
}], ctorParameters: function () { return []; }, propDecorators: { advancedSearchChanged: [{
|
|
1362
1419
|
type: Output
|
|
1363
1420
|
}], searchOptions: [{
|
|
1364
1421
|
type: Input,
|
|
1365
1422
|
args: ['search-options']
|
|
1423
|
+
}], operatorsDisabled: [{
|
|
1424
|
+
type: Input,
|
|
1425
|
+
args: ['operators-disabled']
|
|
1366
1426
|
}], filters: [{
|
|
1367
1427
|
type: Input
|
|
1368
1428
|
}] } });
|
|
@@ -1541,7 +1601,7 @@ class ListViewComponent {
|
|
|
1541
1601
|
}
|
|
1542
1602
|
}
|
|
1543
1603
|
ListViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.3", ngImport: i0, type: ListViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1544
|
-
ListViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.3", type: ListViewComponent, selector: "lib-list-view", inputs: { searchOptions: ["search-options", "searchOptions"], filters: "filters", busy: "busy", items: "items", count: "count", page: "page", view: "view", sort: "sort", pageSize: ["page-size", "pageSize"], pageSizeOptions: ["page-size-options", "pageSizeOptions"], sortOptions: ["sort-options", "sortOptions"], sortdir: ["sort-dir", "sortdir"], tilesCount: ["tiles-count", "tilesCount"], showPager: ["show-pager", "showPager"], pagerPosition: ["pager-position", "pagerPosition"], detailsSectionPropertyCount: ["details-section-property-count", "detailsSectionPropertyCount"] }, outputs: { pageChanged: "pageChanged", pageSizeChanged: "pageSizeChanged", detailsOpened: "detailsOpened", sortChanged: "sortChanged", sortdirChanged: "sortdirChanged", advancedSearchChanged: "advancedSearchChanged" }, queries: [{ propertyName: "tiles", first: true, predicate: ListTileComponent, descendants: true, read: ListTileComponent }, { propertyName: "details", first: true, predicate: ListDetailsSectionComponent, descendants: true, read: ListDetailsSectionComponent }, { propertyName: "cols", predicate: ListColumnComponent, read: ListColumnComponent }], usesOnChanges: true, ngImport: i0, template: "<div>\r\n <lib-advanced-search *ngIf=\"searchOptions && searchOptions.length > 0\"\r\n [search-options]=\"searchOptions\"\r\n [filters]=\"filters\"\r\n (advancedSearchChanged)=\"emitAdvancedSearchChanged($event)\">\r\n </lib-advanced-search>\r\n\r\n <lib-pager *ngIf=\"showPager && (pagerPosition == 'top' || pagerPosition == 'both')\"\r\n [page]=\"page\"\r\n [page-size]=\"pageSize\"\r\n [count]=\"count\"\r\n [sort-options]=\"sortOptions\"\r\n [sort]=\"sort\"\r\n [sort-dir]=\"sortdir\"\r\n [busy]=\"busy\"\r\n (pageChanged)=\"emitPageChanged($event)\"\r\n (pageSizeChanged)=\"emitPageSizeChanged($event)\"\r\n (sortChanged)=\"emitSortChanged($event)\"\r\n (sortdirChanged)=\"emitSortdirChanged($event)\">\r\n <ng-content select=\"[pager-near-content]\" ngProjectAs=\"[pager-near-content]\"></ng-content>\r\n </lib-pager>\r\n</div>\r\n\r\n<ng-container [ngSwitch]=\"view\">\r\n\r\n <ng-container *ngSwitchCase=\"'tiles'\">\r\n <div [class]=\"tilesDeckClass\">\r\n\r\n <lib-skeleton-loader *ngIf=\"busy\"\r\n [count]=\"5\"\r\n [type]=\"'tiles'\"></lib-skeleton-loader>\r\n\r\n <ng-container *ngIf=\"items && items.length > 0\">\r\n <ng-container *ngFor=\"let item of items\">\r\n <span *ngIf=\"!tileTemplate || !tileTemplate.template\">template missing..</span>\r\n <ng-template [ngTemplateOutlet]=\"tileTemplate.template\"\r\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\r\n </ng-container>\r\n </ng-container>\r\n\r\n </div>\r\n </ng-container>\r\n\r\n\r\n <!-- *ngSwitchCase=\"'gallery'\" -->\r\n <ng-container *ngSwitchCase=\"'gallery'\">\r\n <ul role=\"list\"\r\n [class]=\"tilesDeckClass\">\r\n\r\n <lib-skeleton-loader *ngIf=\"busy\"\r\n [count]=\"5\"\r\n [type]=\"'tiles'\"></lib-skeleton-loader>\r\n\r\n <ng-container *ngIf=\"!busy && items && items.length > 0\">\r\n <ng-container *ngFor=\"let item of items\">\r\n <span *ngIf=\"!tileTemplate || !tileTemplate.template\">template missing..</span>\r\n <ng-template [ngTemplateOutlet]=\"tileTemplate.template\"\r\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\r\n </ng-container>\r\n </ng-container>\r\n </ul>\r\n </ng-container>\r\n\r\n <!-- *ngSwitchCase=\"'table'\" -->\r\n <ng-container *ngSwitchDefault>\r\n\r\n <div class=\"list-view-container\">\r\n <div class=\"list-view-container-inner\">\r\n <table class=\"list-view-table\">\r\n <thead class=\"list-view-thead\">\r\n <tr>\r\n <ng-container *ngIf=\"detailsSectionSupported\">\r\n <th class=\"list-view-th-details\"></th>\r\n </ng-container>\r\n <ng-container *ngFor=\"let col of columns\">\r\n <th scope=\"col\"\r\n [class]=\"col.fullWidth ? fullWidthTHClass : 'list-view-th'\">\r\n {{col.title}}\r\n </th>\r\n </ng-container>\r\n </tr>\r\n </thead>\r\n <tbody class=\"list-view-tbody\"\r\n *ngIf=\"busy\">\r\n <ng-container *ngFor=\"let item of loaderItems;let i=index\">\r\n <tr class=\"list-view-tr\">\r\n <ng-container *ngIf=\"detailsSectionSupported\">\r\n <td class=\"list-view-td-details\"\r\n *ngIf=\"detailsSectionPropertyCount !== null ? item[detailsSectionPropertyCount] !== 0 : true; else hiddenDetailsButton\">\r\n <button disabled\r\n type=\"button\"\r\n class=\"expand-collapse-button\">\r\n <!-- Heroicon name: solid/plus -->\r\n <i [class]=\"item.detailsExpanded ? collapseIcon : expandIcon\"></i>\r\n </button>\r\n </td>\r\n <ng-template #hiddenDetailsButton>\r\n <td class=\"list-view-td-details\"></td>\r\n </ng-template>\r\n </ng-container>\r\n <td *ngFor=\"let col of columns\"\r\n [class]=\"col.fullWidth ? fullWidthTDClass : 'list-view-td'\">\r\n <div class=\"w-full animate-pulse h-8 bg-gray-200 rounded\"></div>\r\n </td>\r\n </tr>\r\n <ng-container *ngIf=\"detailsSectionSupported\">\r\n <tr *ngIf=\"item.detailsExpanded\">\r\n <td [colSpan]=\"columns.length + 1\"\r\n class=\"list-view-td bg-gray-100\">\r\n <ng-template [ngTemplateOutlet]=\"detailsTemplate.template\"\r\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </ng-container>\r\n </tbody>\r\n <tbody class=\"list-view-tbody\"\r\n *ngIf=\"!busy\">\r\n <ng-container *ngFor=\"let item of items;let i=index\">\r\n <tr class=\"list-view-tr\">\r\n <ng-container *ngIf=\"detailsSectionSupported\">\r\n <td class=\"list-view-td-details\"\r\n *ngIf=\"detailsSectionPropertyCount !== null ? item[detailsSectionPropertyCount] !== 0 : true; else hiddenDetailsButton\">\r\n <button (click)=\"toggleDetails(item)\"\r\n type=\"button\"\r\n class=\"expand-collapse-button\">\r\n <!-- Heroicon name: solid/plus -->\r\n <i [class]=\"item.detailsExpanded ? collapseIcon : expandIcon\"></i>\r\n </button>\r\n </td>\r\n <ng-template #hiddenDetailsButton>\r\n <td class=\"list-view-td-details\"></td>\r\n </ng-template>\r\n </ng-container>\r\n <td *ngFor=\"let col of columns\"\r\n [class]=\"col.fullWidth ? fullWidthTDClass : 'list-view-td'\">\r\n <ng-template [ngTemplateOutlet]=\"col.template\"\r\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\r\n </td>\r\n </tr>\r\n <ng-container *ngIf=\"detailsSectionSupported\">\r\n <tr *ngIf=\"item.detailsExpanded\">\r\n <td [colSpan]=\"columns.length + 1\"\r\n class=\"list-view-td bg-gray-100\">\r\n <ng-template [ngTemplateOutlet]=\"detailsTemplate.template\"\r\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!busy && items && items.length === 0\">\r\n <div class=\"cards-deck-1\">\r\n <lib-list-view-empty-state></lib-list-view-empty-state>\r\n </div>\r\n </ng-container>\r\n</ng-container>\r\n\r\n<ng-content></ng-content>\r\n\r\n<div class=\"px-2 mt-2\"\r\n *ngIf=\"items && items.length !== 0 && showPager && (pagerPosition == 'bottom' || pagerPosition == 'both')\">\r\n <lib-pager [page]=\"page\"\r\n [page-size]=\"pageSize\"\r\n [count]=\"count\"\r\n [sort-options]=\"sortOptions\"\r\n [sort]=\"sort\"\r\n [sort-dir]=\"sortdir\"\r\n [busy]=\"busy\"\r\n (pageChanged)=\"emitPageChanged($event)\"\r\n (pageSizeChanged)=\"emitPageSizeChanged($event)\"\r\n (sortChanged)=\"emitSortChanged($event)\"\r\n (sortdirChanged)=\"emitSortdirChanged($event)\">\r\n </lib-pager>\r\n</div>", 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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: AdvancedSearchComponent, selector: "lib-advanced-search", inputs: ["search-options", "filters"], outputs: ["advancedSearchChanged"] }, { kind: "component", type: ListViewEmptyStateComponent, selector: "lib-list-view-empty-state", inputs: ["title", "sub-title", "new-item-label"] }, { kind: "component", type: PagerComponent, selector: "lib-pager", inputs: ["busy", "count", "page", "page-size", "page-size-options", "sort-options", "sort", "sort-dir"], outputs: ["pageChanged", "pageSizeChanged", "sortChanged", "sortdirChanged"] }, { kind: "component", type: SkeletonLoaderComponent, selector: "lib-skeleton-loader", inputs: ["count", "type"] }] });
|
|
1604
|
+
ListViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.3", type: ListViewComponent, selector: "lib-list-view", inputs: { searchOptions: ["search-options", "searchOptions"], filters: "filters", busy: "busy", items: "items", count: "count", page: "page", view: "view", sort: "sort", pageSize: ["page-size", "pageSize"], pageSizeOptions: ["page-size-options", "pageSizeOptions"], sortOptions: ["sort-options", "sortOptions"], sortdir: ["sort-dir", "sortdir"], tilesCount: ["tiles-count", "tilesCount"], showPager: ["show-pager", "showPager"], pagerPosition: ["pager-position", "pagerPosition"], detailsSectionPropertyCount: ["details-section-property-count", "detailsSectionPropertyCount"] }, outputs: { pageChanged: "pageChanged", pageSizeChanged: "pageSizeChanged", detailsOpened: "detailsOpened", sortChanged: "sortChanged", sortdirChanged: "sortdirChanged", advancedSearchChanged: "advancedSearchChanged" }, queries: [{ propertyName: "tiles", first: true, predicate: ListTileComponent, descendants: true, read: ListTileComponent }, { propertyName: "details", first: true, predicate: ListDetailsSectionComponent, descendants: true, read: ListDetailsSectionComponent }, { propertyName: "cols", predicate: ListColumnComponent, read: ListColumnComponent }], usesOnChanges: true, ngImport: i0, template: "<div>\r\n <lib-advanced-search *ngIf=\"searchOptions && searchOptions.length > 0\"\r\n [search-options]=\"searchOptions\"\r\n [filters]=\"filters\"\r\n (advancedSearchChanged)=\"emitAdvancedSearchChanged($event)\">\r\n </lib-advanced-search>\r\n\r\n <lib-pager *ngIf=\"showPager && (pagerPosition == 'top' || pagerPosition == 'both')\"\r\n [page]=\"page\"\r\n [page-size]=\"pageSize\"\r\n [count]=\"count\"\r\n [sort-options]=\"sortOptions\"\r\n [sort]=\"sort\"\r\n [sort-dir]=\"sortdir\"\r\n [busy]=\"busy\"\r\n (pageChanged)=\"emitPageChanged($event)\"\r\n (pageSizeChanged)=\"emitPageSizeChanged($event)\"\r\n (sortChanged)=\"emitSortChanged($event)\"\r\n (sortdirChanged)=\"emitSortdirChanged($event)\">\r\n <ng-content select=\"[pager-near-content]\" ngProjectAs=\"[pager-near-content]\"></ng-content>\r\n </lib-pager>\r\n</div>\r\n\r\n<ng-container [ngSwitch]=\"view\">\r\n\r\n <ng-container *ngSwitchCase=\"'tiles'\">\r\n <div [class]=\"tilesDeckClass\">\r\n\r\n <lib-skeleton-loader *ngIf=\"busy\"\r\n [count]=\"5\"\r\n [type]=\"'tiles'\"></lib-skeleton-loader>\r\n\r\n <ng-container *ngIf=\"items && items.length > 0\">\r\n <ng-container *ngFor=\"let item of items\">\r\n <span *ngIf=\"!tileTemplate || !tileTemplate.template\">template missing..</span>\r\n <ng-template [ngTemplateOutlet]=\"tileTemplate.template\"\r\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\r\n </ng-container>\r\n </ng-container>\r\n\r\n </div>\r\n </ng-container>\r\n\r\n\r\n <!-- *ngSwitchCase=\"'gallery'\" -->\r\n <ng-container *ngSwitchCase=\"'gallery'\">\r\n <ul role=\"list\"\r\n [class]=\"tilesDeckClass\">\r\n\r\n <lib-skeleton-loader *ngIf=\"busy\"\r\n [count]=\"5\"\r\n [type]=\"'tiles'\"></lib-skeleton-loader>\r\n\r\n <ng-container *ngIf=\"!busy && items && items.length > 0\">\r\n <ng-container *ngFor=\"let item of items\">\r\n <span *ngIf=\"!tileTemplate || !tileTemplate.template\">template missing..</span>\r\n <ng-template [ngTemplateOutlet]=\"tileTemplate.template\"\r\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\r\n </ng-container>\r\n </ng-container>\r\n </ul>\r\n </ng-container>\r\n\r\n <!-- *ngSwitchCase=\"'table'\" -->\r\n <ng-container *ngSwitchDefault>\r\n\r\n <div class=\"list-view-container\">\r\n <div class=\"list-view-container-inner\">\r\n <table class=\"list-view-table\">\r\n <thead class=\"list-view-thead\">\r\n <tr>\r\n <ng-container *ngIf=\"detailsSectionSupported\">\r\n <th class=\"list-view-th-details\"></th>\r\n </ng-container>\r\n <ng-container *ngFor=\"let col of columns\">\r\n <th scope=\"col\"\r\n [class]=\"col.fullWidth ? fullWidthTHClass : 'list-view-th'\">\r\n {{col.title}}\r\n </th>\r\n </ng-container>\r\n </tr>\r\n </thead>\r\n <tbody class=\"list-view-tbody\"\r\n *ngIf=\"busy\">\r\n <ng-container *ngFor=\"let item of loaderItems;let i=index\">\r\n <tr class=\"list-view-tr\">\r\n <ng-container *ngIf=\"detailsSectionSupported\">\r\n <td class=\"list-view-td-details\"\r\n *ngIf=\"detailsSectionPropertyCount !== null ? item[detailsSectionPropertyCount] !== 0 : true; else hiddenDetailsButton\">\r\n <button disabled\r\n type=\"button\"\r\n class=\"expand-collapse-button\">\r\n <!-- Heroicon name: solid/plus -->\r\n <i [class]=\"item.detailsExpanded ? collapseIcon : expandIcon\"></i>\r\n </button>\r\n </td>\r\n <ng-template #hiddenDetailsButton>\r\n <td class=\"list-view-td-details\"></td>\r\n </ng-template>\r\n </ng-container>\r\n <td *ngFor=\"let col of columns\"\r\n [class]=\"col.fullWidth ? fullWidthTDClass : 'list-view-td'\">\r\n <div class=\"w-full animate-pulse h-8 bg-gray-200 rounded\"></div>\r\n </td>\r\n </tr>\r\n <ng-container *ngIf=\"detailsSectionSupported\">\r\n <tr *ngIf=\"item.detailsExpanded\">\r\n <td [colSpan]=\"columns.length + 1\"\r\n class=\"list-view-td bg-gray-100\">\r\n <ng-template [ngTemplateOutlet]=\"detailsTemplate.template\"\r\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </ng-container>\r\n </tbody>\r\n <tbody class=\"list-view-tbody\"\r\n *ngIf=\"!busy\">\r\n <ng-container *ngFor=\"let item of items;let i=index\">\r\n <tr class=\"list-view-tr\">\r\n <ng-container *ngIf=\"detailsSectionSupported\">\r\n <td class=\"list-view-td-details\"\r\n *ngIf=\"detailsSectionPropertyCount !== null ? item[detailsSectionPropertyCount] !== 0 : true; else hiddenDetailsButton\">\r\n <button (click)=\"toggleDetails(item)\"\r\n type=\"button\"\r\n class=\"expand-collapse-button\">\r\n <!-- Heroicon name: solid/plus -->\r\n <i [class]=\"item.detailsExpanded ? collapseIcon : expandIcon\"></i>\r\n </button>\r\n </td>\r\n <ng-template #hiddenDetailsButton>\r\n <td class=\"list-view-td-details\"></td>\r\n </ng-template>\r\n </ng-container>\r\n <td *ngFor=\"let col of columns\"\r\n [class]=\"col.fullWidth ? fullWidthTDClass : 'list-view-td'\">\r\n <ng-template [ngTemplateOutlet]=\"col.template\"\r\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\r\n </td>\r\n </tr>\r\n <ng-container *ngIf=\"detailsSectionSupported\">\r\n <tr *ngIf=\"item.detailsExpanded\">\r\n <td [colSpan]=\"columns.length + 1\"\r\n class=\"list-view-td bg-gray-100\">\r\n <ng-template [ngTemplateOutlet]=\"detailsTemplate.template\"\r\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!busy && items && items.length === 0\">\r\n <div class=\"cards-deck-1\">\r\n <lib-list-view-empty-state></lib-list-view-empty-state>\r\n </div>\r\n </ng-container>\r\n</ng-container>\r\n\r\n<ng-content></ng-content>\r\n\r\n<div class=\"px-2 mt-2\"\r\n *ngIf=\"items && items.length !== 0 && showPager && (pagerPosition == 'bottom' || pagerPosition == 'both')\">\r\n <lib-pager [page]=\"page\"\r\n [page-size]=\"pageSize\"\r\n [count]=\"count\"\r\n [sort-options]=\"sortOptions\"\r\n [sort]=\"sort\"\r\n [sort-dir]=\"sortdir\"\r\n [busy]=\"busy\"\r\n (pageChanged)=\"emitPageChanged($event)\"\r\n (pageSizeChanged)=\"emitPageSizeChanged($event)\"\r\n (sortChanged)=\"emitSortChanged($event)\"\r\n (sortdirChanged)=\"emitSortdirChanged($event)\">\r\n </lib-pager>\r\n</div>", 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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: AdvancedSearchComponent, selector: "lib-advanced-search", inputs: ["search-options", "operators-disabled", "filters"], outputs: ["advancedSearchChanged"] }, { kind: "component", type: ListViewEmptyStateComponent, selector: "lib-list-view-empty-state", inputs: ["title", "sub-title", "new-item-label"] }, { kind: "component", type: PagerComponent, selector: "lib-pager", inputs: ["busy", "count", "page", "page-size", "page-size-options", "sort-options", "sort", "sort-dir"], outputs: ["pageChanged", "pageSizeChanged", "sortChanged", "sortdirChanged"] }, { kind: "component", type: SkeletonLoaderComponent, selector: "lib-skeleton-loader", inputs: ["count", "type"] }] });
|
|
1545
1605
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.3", ngImport: i0, type: ListViewComponent, decorators: [{
|
|
1546
1606
|
type: Component,
|
|
1547
1607
|
args: [{ selector: 'lib-list-view', template: "<div>\r\n <lib-advanced-search *ngIf=\"searchOptions && searchOptions.length > 0\"\r\n [search-options]=\"searchOptions\"\r\n [filters]=\"filters\"\r\n (advancedSearchChanged)=\"emitAdvancedSearchChanged($event)\">\r\n </lib-advanced-search>\r\n\r\n <lib-pager *ngIf=\"showPager && (pagerPosition == 'top' || pagerPosition == 'both')\"\r\n [page]=\"page\"\r\n [page-size]=\"pageSize\"\r\n [count]=\"count\"\r\n [sort-options]=\"sortOptions\"\r\n [sort]=\"sort\"\r\n [sort-dir]=\"sortdir\"\r\n [busy]=\"busy\"\r\n (pageChanged)=\"emitPageChanged($event)\"\r\n (pageSizeChanged)=\"emitPageSizeChanged($event)\"\r\n (sortChanged)=\"emitSortChanged($event)\"\r\n (sortdirChanged)=\"emitSortdirChanged($event)\">\r\n <ng-content select=\"[pager-near-content]\" ngProjectAs=\"[pager-near-content]\"></ng-content>\r\n </lib-pager>\r\n</div>\r\n\r\n<ng-container [ngSwitch]=\"view\">\r\n\r\n <ng-container *ngSwitchCase=\"'tiles'\">\r\n <div [class]=\"tilesDeckClass\">\r\n\r\n <lib-skeleton-loader *ngIf=\"busy\"\r\n [count]=\"5\"\r\n [type]=\"'tiles'\"></lib-skeleton-loader>\r\n\r\n <ng-container *ngIf=\"items && items.length > 0\">\r\n <ng-container *ngFor=\"let item of items\">\r\n <span *ngIf=\"!tileTemplate || !tileTemplate.template\">template missing..</span>\r\n <ng-template [ngTemplateOutlet]=\"tileTemplate.template\"\r\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\r\n </ng-container>\r\n </ng-container>\r\n\r\n </div>\r\n </ng-container>\r\n\r\n\r\n <!-- *ngSwitchCase=\"'gallery'\" -->\r\n <ng-container *ngSwitchCase=\"'gallery'\">\r\n <ul role=\"list\"\r\n [class]=\"tilesDeckClass\">\r\n\r\n <lib-skeleton-loader *ngIf=\"busy\"\r\n [count]=\"5\"\r\n [type]=\"'tiles'\"></lib-skeleton-loader>\r\n\r\n <ng-container *ngIf=\"!busy && items && items.length > 0\">\r\n <ng-container *ngFor=\"let item of items\">\r\n <span *ngIf=\"!tileTemplate || !tileTemplate.template\">template missing..</span>\r\n <ng-template [ngTemplateOutlet]=\"tileTemplate.template\"\r\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\r\n </ng-container>\r\n </ng-container>\r\n </ul>\r\n </ng-container>\r\n\r\n <!-- *ngSwitchCase=\"'table'\" -->\r\n <ng-container *ngSwitchDefault>\r\n\r\n <div class=\"list-view-container\">\r\n <div class=\"list-view-container-inner\">\r\n <table class=\"list-view-table\">\r\n <thead class=\"list-view-thead\">\r\n <tr>\r\n <ng-container *ngIf=\"detailsSectionSupported\">\r\n <th class=\"list-view-th-details\"></th>\r\n </ng-container>\r\n <ng-container *ngFor=\"let col of columns\">\r\n <th scope=\"col\"\r\n [class]=\"col.fullWidth ? fullWidthTHClass : 'list-view-th'\">\r\n {{col.title}}\r\n </th>\r\n </ng-container>\r\n </tr>\r\n </thead>\r\n <tbody class=\"list-view-tbody\"\r\n *ngIf=\"busy\">\r\n <ng-container *ngFor=\"let item of loaderItems;let i=index\">\r\n <tr class=\"list-view-tr\">\r\n <ng-container *ngIf=\"detailsSectionSupported\">\r\n <td class=\"list-view-td-details\"\r\n *ngIf=\"detailsSectionPropertyCount !== null ? item[detailsSectionPropertyCount] !== 0 : true; else hiddenDetailsButton\">\r\n <button disabled\r\n type=\"button\"\r\n class=\"expand-collapse-button\">\r\n <!-- Heroicon name: solid/plus -->\r\n <i [class]=\"item.detailsExpanded ? collapseIcon : expandIcon\"></i>\r\n </button>\r\n </td>\r\n <ng-template #hiddenDetailsButton>\r\n <td class=\"list-view-td-details\"></td>\r\n </ng-template>\r\n </ng-container>\r\n <td *ngFor=\"let col of columns\"\r\n [class]=\"col.fullWidth ? fullWidthTDClass : 'list-view-td'\">\r\n <div class=\"w-full animate-pulse h-8 bg-gray-200 rounded\"></div>\r\n </td>\r\n </tr>\r\n <ng-container *ngIf=\"detailsSectionSupported\">\r\n <tr *ngIf=\"item.detailsExpanded\">\r\n <td [colSpan]=\"columns.length + 1\"\r\n class=\"list-view-td bg-gray-100\">\r\n <ng-template [ngTemplateOutlet]=\"detailsTemplate.template\"\r\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </ng-container>\r\n </tbody>\r\n <tbody class=\"list-view-tbody\"\r\n *ngIf=\"!busy\">\r\n <ng-container *ngFor=\"let item of items;let i=index\">\r\n <tr class=\"list-view-tr\">\r\n <ng-container *ngIf=\"detailsSectionSupported\">\r\n <td class=\"list-view-td-details\"\r\n *ngIf=\"detailsSectionPropertyCount !== null ? item[detailsSectionPropertyCount] !== 0 : true; else hiddenDetailsButton\">\r\n <button (click)=\"toggleDetails(item)\"\r\n type=\"button\"\r\n class=\"expand-collapse-button\">\r\n <!-- Heroicon name: solid/plus -->\r\n <i [class]=\"item.detailsExpanded ? collapseIcon : expandIcon\"></i>\r\n </button>\r\n </td>\r\n <ng-template #hiddenDetailsButton>\r\n <td class=\"list-view-td-details\"></td>\r\n </ng-template>\r\n </ng-container>\r\n <td *ngFor=\"let col of columns\"\r\n [class]=\"col.fullWidth ? fullWidthTDClass : 'list-view-td'\">\r\n <ng-template [ngTemplateOutlet]=\"col.template\"\r\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\r\n </td>\r\n </tr>\r\n <ng-container *ngIf=\"detailsSectionSupported\">\r\n <tr *ngIf=\"item.detailsExpanded\">\r\n <td [colSpan]=\"columns.length + 1\"\r\n class=\"list-view-td bg-gray-100\">\r\n <ng-template [ngTemplateOutlet]=\"detailsTemplate.template\"\r\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!busy && items && items.length === 0\">\r\n <div class=\"cards-deck-1\">\r\n <lib-list-view-empty-state></lib-list-view-empty-state>\r\n </div>\r\n </ng-container>\r\n</ng-container>\r\n\r\n<ng-content></ng-content>\r\n\r\n<div class=\"px-2 mt-2\"\r\n *ngIf=\"items && items.length !== 0 && showPager && (pagerPosition == 'bottom' || pagerPosition == 'both')\">\r\n <lib-pager [page]=\"page\"\r\n [page-size]=\"pageSize\"\r\n [count]=\"count\"\r\n [sort-options]=\"sortOptions\"\r\n [sort]=\"sort\"\r\n [sort-dir]=\"sortdir\"\r\n [busy]=\"busy\"\r\n (pageChanged)=\"emitPageChanged($event)\"\r\n (pageSizeChanged)=\"emitPageSizeChanged($event)\"\r\n (sortChanged)=\"emitSortChanged($event)\"\r\n (sortdirChanged)=\"emitSortdirChanged($event)\">\r\n </lib-pager>\r\n</div>" }]
|
|
@@ -2524,6 +2584,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.3", ngImpor
|
|
|
2524
2584
|
class ToggleButtonsListComponent {
|
|
2525
2585
|
constructor() {
|
|
2526
2586
|
this.icon = undefined;
|
|
2587
|
+
this.compact = true;
|
|
2527
2588
|
this.valueChange = new EventEmitter(undefined);
|
|
2528
2589
|
}
|
|
2529
2590
|
ngOnInit() {
|
|
@@ -2534,16 +2595,18 @@ class ToggleButtonsListComponent {
|
|
|
2534
2595
|
}
|
|
2535
2596
|
}
|
|
2536
2597
|
ToggleButtonsListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.3", ngImport: i0, type: ToggleButtonsListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2537
|
-
ToggleButtonsListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.3", type: ToggleButtonsListComponent, selector: "lib-toggle-buttons-list", inputs: { icon: "icon", options: "options", value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"relative items-center inline-flex\">\n <div class=\"toggle-buttons-list-icon-container\" *ngIf=\"icon\">\n <i [class]=\"icon\"></i>\n </div>\n <div class=\"toggle-buttons-list-drop-down-contaner\">\n <lib-drop-down-menu class=\"toggle-buttons-list-drop-down\" [(selected)]=\"value\" (selectedChange)=\"selectOption($event)\" [options]=\"options\">\n </lib-drop-down-menu>\n </div>\n <div class=\"toggle-buttons-list\">\n <ng-template ngFor let-option [ngForOf]=\"options\" let-i=\"index\">\n <!-- [tooltip]=\"option.description\" -->\n <button type=\"button\"\n [disabled]=\"option.value === value\"\n [class.toggle-buttons-list-button-selected]=\"option.value === value\"\n class=\"toggle-buttons-list-button\"\n (click)=\"selectOption(option.value)\">\n <div class=\"toggle-buttons-list-button-icon-container\" *ngIf=\"option.icon\">\n <i [class]=\"option.icon\"></i>\n </div>\n <span class=\"toggle-buttons-list-button-button-text\">{{option.text}}</span>\n <span *ngIf=\"option.data && option.data.count\"\n
|
|
2598
|
+
ToggleButtonsListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.3", type: ToggleButtonsListComponent, selector: "lib-toggle-buttons-list", inputs: { icon: "icon", options: "options", value: "value", compact: "compact" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"relative items-center inline-flex\">\n <div class=\"toggle-buttons-list-icon-container\" *ngIf=\"icon\">\n <i [class]=\"icon\"></i>\n </div>\n <div class=\"toggle-buttons-list-drop-down-compact-container\" *ngIf=\"compact\">\n <lib-drop-down-menu class=\"toggle-buttons-list-drop-down\" [(selected)]=\"value\" (selectedChange)=\"selectOption($event)\" [options]=\"options\">\n </lib-drop-down-menu>\n </div>\n\n <div class=\"toggle-buttons-list-drop-down-contaner\" *ngIf=\"!compact\">\n <lib-drop-down-menu class=\"toggle-buttons-list-drop-down\" [(selected)]=\"value\" (selectedChange)=\"selectOption($event)\" [options]=\"options\">\n </lib-drop-down-menu>\n </div>\n <div class=\"toggle-buttons-list\" *ngIf=\"!compact\">\n <ng-template ngFor let-option [ngForOf]=\"options\" let-i=\"index\">\n <!-- [tooltip]=\"option.description\" -->\n <button type=\"button\"\n [disabled]=\"option.value === value\"\n [class.toggle-buttons-list-button-selected]=\"option.value === value\"\n class=\"toggle-buttons-list-button\"\n (click)=\"selectOption(option.value)\">\n <div class=\"toggle-buttons-list-button-icon-container\" *ngIf=\"option.icon\">\n <i [class]=\"option.icon\"></i>\n </div>\n <span class=\"toggle-buttons-list-button-button-text\">{{option.text}}</span>\n <span *ngIf=\"option.data && option.data.count\"\n class=\"toggle-buttons-list-button-button-count\">{{option.data.count}}\n </span>\n </button>\n </ng-template>\n </div>\n</div>", 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: "component", type: DropDownMenuComponent, selector: "lib-drop-down-menu", inputs: ["options", "selected", "multiple", "placeholder", "show-icons"], outputs: ["selectedChange", "selectedChanged"] }] });
|
|
2538
2599
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.3", ngImport: i0, type: ToggleButtonsListComponent, decorators: [{
|
|
2539
2600
|
type: Component,
|
|
2540
|
-
args: [{ selector: 'lib-toggle-buttons-list', template: "<div class=\"relative items-center inline-flex\">\n <div class=\"toggle-buttons-list-icon-container\" *ngIf=\"icon\">\n <i [class]=\"icon\"></i>\n </div>\n <div class=\"toggle-buttons-list-drop-down-contaner\">\n <lib-drop-down-menu class=\"toggle-buttons-list-drop-down\" [(selected)]=\"value\" (selectedChange)=\"selectOption($event)\" [options]=\"options\">\n </lib-drop-down-menu>\n </div>\n <div class=\"toggle-buttons-list\">\n <ng-template ngFor let-option [ngForOf]=\"options\" let-i=\"index\">\n <!-- [tooltip]=\"option.description\" -->\n <button type=\"button\"\n [disabled]=\"option.value === value\"\n [class.toggle-buttons-list-button-selected]=\"option.value === value\"\n class=\"toggle-buttons-list-button\"\n (click)=\"selectOption(option.value)\">\n <div class=\"toggle-buttons-list-button-icon-container\" *ngIf=\"option.icon\">\n <i [class]=\"option.icon\"></i>\n </div>\n <span class=\"toggle-buttons-list-button-button-text\">{{option.text}}</span>\n <span *ngIf=\"option.data && option.data.count\"\n
|
|
2601
|
+
args: [{ selector: 'lib-toggle-buttons-list', template: "<div class=\"relative items-center inline-flex\">\n <div class=\"toggle-buttons-list-icon-container\" *ngIf=\"icon\">\n <i [class]=\"icon\"></i>\n </div>\n <div class=\"toggle-buttons-list-drop-down-compact-container\" *ngIf=\"compact\">\n <lib-drop-down-menu class=\"toggle-buttons-list-drop-down\" [(selected)]=\"value\" (selectedChange)=\"selectOption($event)\" [options]=\"options\">\n </lib-drop-down-menu>\n </div>\n\n <div class=\"toggle-buttons-list-drop-down-contaner\" *ngIf=\"!compact\">\n <lib-drop-down-menu class=\"toggle-buttons-list-drop-down\" [(selected)]=\"value\" (selectedChange)=\"selectOption($event)\" [options]=\"options\">\n </lib-drop-down-menu>\n </div>\n <div class=\"toggle-buttons-list\" *ngIf=\"!compact\">\n <ng-template ngFor let-option [ngForOf]=\"options\" let-i=\"index\">\n <!-- [tooltip]=\"option.description\" -->\n <button type=\"button\"\n [disabled]=\"option.value === value\"\n [class.toggle-buttons-list-button-selected]=\"option.value === value\"\n class=\"toggle-buttons-list-button\"\n (click)=\"selectOption(option.value)\">\n <div class=\"toggle-buttons-list-button-icon-container\" *ngIf=\"option.icon\">\n <i [class]=\"option.icon\"></i>\n </div>\n <span class=\"toggle-buttons-list-button-button-text\">{{option.text}}</span>\n <span *ngIf=\"option.data && option.data.count\"\n class=\"toggle-buttons-list-button-button-count\">{{option.data.count}}\n </span>\n </button>\n </ng-template>\n </div>\n</div>" }]
|
|
2541
2602
|
}], ctorParameters: function () { return []; }, propDecorators: { icon: [{
|
|
2542
2603
|
type: Input
|
|
2543
2604
|
}], options: [{
|
|
2544
2605
|
type: Input
|
|
2545
2606
|
}], value: [{
|
|
2546
2607
|
type: Input
|
|
2608
|
+
}], compact: [{
|
|
2609
|
+
type: Input
|
|
2547
2610
|
}], valueChange: [{
|
|
2548
2611
|
type: Output
|
|
2549
2612
|
}] } });
|
|
@@ -4084,7 +4147,7 @@ class ShortNumberPipe {
|
|
|
4084
4147
|
for (let i = 0; i < powers.length; i++) {
|
|
4085
4148
|
let reduced = abs / powers[i].value;
|
|
4086
4149
|
reduced = Math.round(reduced * rounder) / rounder;
|
|
4087
|
-
if (reduced
|
|
4150
|
+
if (reduced >= 1) {
|
|
4088
4151
|
abs = reduced;
|
|
4089
4152
|
key = powers[i].key;
|
|
4090
4153
|
break;
|