@angular-generic-table/core 5.0.0-rc.12 → 5.0.0-rc.13
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/core.component.mjs +46 -17
- package/esm2020/lib/core.module.mjs +5 -5
- package/esm2020/lib/core.service.mjs +4 -4
- package/esm2020/lib/gt-delta/gt-delta.component.mjs +7 -18
- package/esm2020/lib/models/table-config.interface.mjs +1 -1
- package/esm2020/lib/models/table-events.interface.mjs +2 -0
- package/esm2020/lib/pagination/pagination.component.mjs +4 -4
- package/esm2020/lib/pagination/pagination.module.mjs +5 -5
- package/esm2020/lib/pipes/capital-case.pipe.mjs +4 -4
- package/esm2020/lib/pipes/dash-case.pipe.mjs +4 -4
- package/esm2020/lib/pipes/dynamic.pipe.mjs +4 -4
- package/esm2020/lib/pipes/highlight.pipe.mjs +4 -4
- package/esm2020/lib/pipes/sort-class.pipe.mjs +4 -4
- package/esm2020/public-api.mjs +2 -1
- package/fesm2015/angular-generic-table-core.mjs +90 -73
- package/fesm2015/angular-generic-table-core.mjs.map +1 -1
- package/fesm2020/angular-generic-table-core.mjs +90 -72
- package/fesm2020/angular-generic-table-core.mjs.map +1 -1
- package/{angular-generic-table-core.d.ts → index.d.ts} +0 -0
- package/lib/core.component.d.ts +12 -1
- package/lib/gt-delta/gt-delta.component.d.ts +1 -1
- package/lib/models/table-config.interface.d.ts +2 -0
- package/lib/models/table-events.interface.d.ts +11 -0
- package/lib/pagination/pagination.component.d.ts +1 -1
- package/lib/pipes/capital-case.pipe.d.ts +1 -1
- package/lib/pipes/dash-case.pipe.d.ts +1 -1
- package/lib/pipes/dynamic.pipe.d.ts +1 -1
- package/lib/pipes/highlight.pipe.d.ts +1 -1
- package/lib/pipes/sort-class.pipe.d.ts +1 -1
- package/package.json +5 -5
- package/public-api.d.ts +1 -0
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, Pipe, Injector, Component, ChangeDetectionStrategy, Input, NgModule } from '@angular/core';
|
|
2
|
+
import { Injectable, Pipe, Injector, EventEmitter, Component, ChangeDetectionStrategy, Input, Output, NgModule } from '@angular/core';
|
|
3
3
|
import { ReplaySubject, Subject, isObservable, of, combineLatest, EMPTY, BehaviorSubject } from 'rxjs';
|
|
4
|
-
import { startWith, map, switchMap,
|
|
4
|
+
import { debounceTime, distinctUntilChanged, tap, shareReplay, startWith, map, switchMap, withLatestFrom, take, pluck } from 'rxjs/operators';
|
|
5
5
|
import * as i1 from '@angular/common';
|
|
6
6
|
import { CommonModule } from '@angular/common';
|
|
7
7
|
|
|
8
8
|
class CoreService {
|
|
9
9
|
constructor() { }
|
|
10
10
|
}
|
|
11
|
-
CoreService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
12
|
-
CoreService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
13
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
11
|
+
CoreService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CoreService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
12
|
+
CoreService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CoreService, providedIn: 'root' });
|
|
13
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CoreService, decorators: [{
|
|
14
14
|
type: Injectable,
|
|
15
15
|
args: [{
|
|
16
16
|
providedIn: 'root',
|
|
@@ -76,20 +76,6 @@ search = (text, caseSensitive, data, config) => {
|
|
|
76
76
|
}
|
|
77
77
|
};
|
|
78
78
|
|
|
79
|
-
class DashCasePipe {
|
|
80
|
-
transform(s) {
|
|
81
|
-
return dashed(s);
|
|
82
|
-
}
|
|
83
|
-
}
|
|
84
|
-
DashCasePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DashCasePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
85
|
-
DashCasePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DashCasePipe, name: "dashCase" });
|
|
86
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DashCasePipe, decorators: [{
|
|
87
|
-
type: Pipe,
|
|
88
|
-
args: [{
|
|
89
|
-
name: 'dashCase',
|
|
90
|
-
}]
|
|
91
|
-
}] });
|
|
92
|
-
|
|
93
79
|
class SortClassPipe {
|
|
94
80
|
transform(selection, property, aria = false) {
|
|
95
81
|
return selection?.sortBy === property
|
|
@@ -101,26 +87,26 @@ class SortClassPipe {
|
|
|
101
87
|
: null;
|
|
102
88
|
}
|
|
103
89
|
}
|
|
104
|
-
SortClassPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
105
|
-
SortClassPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "
|
|
106
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
90
|
+
SortClassPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: SortClassPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
91
|
+
SortClassPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: SortClassPipe, name: "sortClass" });
|
|
92
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: SortClassPipe, decorators: [{
|
|
107
93
|
type: Pipe,
|
|
108
94
|
args: [{
|
|
109
95
|
name: 'sortClass',
|
|
110
96
|
}]
|
|
111
97
|
}] });
|
|
112
98
|
|
|
113
|
-
class
|
|
99
|
+
class DashCasePipe {
|
|
114
100
|
transform(s) {
|
|
115
|
-
return
|
|
101
|
+
return dashed(s);
|
|
116
102
|
}
|
|
117
103
|
}
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
104
|
+
DashCasePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: DashCasePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
105
|
+
DashCasePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: DashCasePipe, name: "dashCase" });
|
|
106
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: DashCasePipe, decorators: [{
|
|
121
107
|
type: Pipe,
|
|
122
108
|
args: [{
|
|
123
|
-
name: '
|
|
109
|
+
name: 'dashCase',
|
|
124
110
|
}]
|
|
125
111
|
}] });
|
|
126
112
|
|
|
@@ -161,15 +147,29 @@ class HighlightPipe {
|
|
|
161
147
|
return highlightedText;
|
|
162
148
|
}
|
|
163
149
|
}
|
|
164
|
-
HighlightPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
165
|
-
HighlightPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "
|
|
166
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
150
|
+
HighlightPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: HighlightPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
151
|
+
HighlightPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: HighlightPipe, name: "highlight" });
|
|
152
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: HighlightPipe, decorators: [{
|
|
167
153
|
type: Pipe,
|
|
168
154
|
args: [{
|
|
169
155
|
name: 'highlight',
|
|
170
156
|
}]
|
|
171
157
|
}] });
|
|
172
158
|
|
|
159
|
+
class CapitalCasePipe {
|
|
160
|
+
transform(s) {
|
|
161
|
+
return capitalize(s);
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
CapitalCasePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CapitalCasePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
165
|
+
CapitalCasePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: CapitalCasePipe, name: "capitalCase" });
|
|
166
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CapitalCasePipe, decorators: [{
|
|
167
|
+
type: Pipe,
|
|
168
|
+
args: [{
|
|
169
|
+
name: 'capitalCase',
|
|
170
|
+
}]
|
|
171
|
+
}] });
|
|
172
|
+
|
|
173
173
|
class DynamicPipe {
|
|
174
174
|
constructor(injector) {
|
|
175
175
|
this.injector = injector;
|
|
@@ -184,9 +184,9 @@ class DynamicPipe {
|
|
|
184
184
|
return pipe.transform(value, ...(pipeArgs || []));
|
|
185
185
|
}
|
|
186
186
|
}
|
|
187
|
-
DynamicPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
188
|
-
DynamicPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "
|
|
189
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
187
|
+
DynamicPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: DynamicPipe, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Pipe });
|
|
188
|
+
DynamicPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: DynamicPipe, name: "dynamicPipe" });
|
|
189
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: DynamicPipe, decorators: [{
|
|
190
190
|
type: Pipe,
|
|
191
191
|
args: [{
|
|
192
192
|
name: 'dynamicPipe',
|
|
@@ -195,6 +195,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
195
195
|
|
|
196
196
|
class CoreComponent {
|
|
197
197
|
constructor() {
|
|
198
|
+
this.rowClick = new EventEmitter();
|
|
199
|
+
this._rowHover$ = new ReplaySubject(1);
|
|
200
|
+
this.rowHover = new EventEmitter();
|
|
201
|
+
this.rowHover$ = this._rowHover$.asObservable().pipe(debounceTime(50), distinctUntilChanged((p, q) => p.index === q.index), tap((event) => this.rowHover.emit(event)), shareReplay(1));
|
|
198
202
|
this._loading$ = new ReplaySubject(1);
|
|
199
203
|
this.sortBy$ = new Subject();
|
|
200
204
|
// tslint:disable-next-line:variable-name
|
|
@@ -211,16 +215,18 @@ class CoreComponent {
|
|
|
211
215
|
(config.rows &&
|
|
212
216
|
!!Object.values(config.rows).find((column) => !!column.mapTo))) {
|
|
213
217
|
// ...map data to new keys on row...
|
|
214
|
-
|
|
218
|
+
const newData = [];
|
|
219
|
+
for (let i = 0; i < data.length; i++) {
|
|
220
|
+
const row = data[i];
|
|
215
221
|
const newKeys = Object.entries(config.columns || config.rows || [])
|
|
216
222
|
.filter(([key, value]) => !!value.mapTo) // add keys for columns with mapTo config...
|
|
217
|
-
.reduce((previousValue,
|
|
223
|
+
.reduce((previousValue, [key, value]) => ({
|
|
218
224
|
...previousValue,
|
|
219
|
-
|
|
220
|
-
[currentValue[0]]: this.nestedValue(row, currentValue[1].mapTo.path, currentValue[1].mapTo?.missingValue),
|
|
225
|
+
[key]: this.nestedValue(row, value.mapTo.path, value.mapTo?.missingValue),
|
|
221
226
|
}), {});
|
|
222
|
-
|
|
223
|
-
}
|
|
227
|
+
newData[i] = { ...row, ...newKeys };
|
|
228
|
+
}
|
|
229
|
+
data = newData;
|
|
224
230
|
}
|
|
225
231
|
return { data, config };
|
|
226
232
|
}), switchMap((obs) => combineLatest([
|
|
@@ -303,6 +309,25 @@ class CoreComponent {
|
|
|
303
309
|
set data(data) {
|
|
304
310
|
this._data$.next(data);
|
|
305
311
|
}
|
|
312
|
+
_rowClick(row, index, event) {
|
|
313
|
+
this.rowClick.emit({ row, index, event });
|
|
314
|
+
}
|
|
315
|
+
hoverRow(arg) {
|
|
316
|
+
if (typeof arg === 'number') {
|
|
317
|
+
this.data$
|
|
318
|
+
.pipe(map((data) => data[arg]), take(1))
|
|
319
|
+
.subscribe((row) => this._hoverRow(row, arg));
|
|
320
|
+
}
|
|
321
|
+
else if (typeof arg === 'string') {
|
|
322
|
+
// TODO: implement hover by id
|
|
323
|
+
}
|
|
324
|
+
else {
|
|
325
|
+
this._hoverRow(null, null);
|
|
326
|
+
}
|
|
327
|
+
}
|
|
328
|
+
_hoverRow(row, index, event) {
|
|
329
|
+
this._rowHover$.next({ row, index, event });
|
|
330
|
+
}
|
|
306
331
|
get loading$() {
|
|
307
332
|
return this._loading$.pipe(startWith(false), map((value) => (isObservable(value) ? value : of(value))), switchMap((obs) => obs), shareReplay(1));
|
|
308
333
|
}
|
|
@@ -325,11 +350,11 @@ class CoreComponent {
|
|
|
325
350
|
(index === levels.length - 1 ? missingValue : {}), object);
|
|
326
351
|
}
|
|
327
352
|
}
|
|
328
|
-
CoreComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
329
|
-
CoreComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: CoreComponent, selector: "angular-generic-table", inputs: { loading: "loading", page: "page", search: "search", config: "config", data: "data" }, ngImport: i0, template: "<table\n [ngClass]=\"(tableConfig$ | async)?.class || 'table'\"\n [class.table-mobile]=\"(tableConfig$ | async)?.mobileLayout\"\n [class.table-horizontal]=\"(tableConfig$ | async)?.rows\"\n [class.table-loading]=\"loading$ | async\"\n [class.gt-sticky-row-header]=\"\n (tableConfig$ | async)?.stickyHeaders?.row && (tableConfig$ | async)?.rows\n \"\n [class.gt-sticky-column-header]=\"\n (tableConfig$ | async)?.stickyHeaders?.column\n \"\n [attr.aria-busy]=\"(loading$ | async) === true ? true : null\"\n>\n <thead>\n <tr\n *ngIf=\"{\n config: (tableConfig$ | async)!,\n isLoading: loading$ | async\n } as table\"\n >\n <ng-container\n *ngFor=\"let column of table?.config?.columns | keyvalue: columnOrder\"\n >\n <th\n *ngIf=\"!column.value?.hidden\"\n ngClass=\"{{ (column.key | dashCase) + '-column' }} {{\n column.value.class\n }}\"\n [class.disabled]=\"table.isLoading\"\n [attr.aria-sort]=\"sortBy$ | async | sortClass: column.key:true\"\n [class.gt-sortable]=\"true\"\n scope=\"col\"\n >\n <button\n *ngIf=\"column.value?.sortable\"\n class=\"gt-sort\"\n (click)=\"\n table.isLoading || !column.value?.sortable || sort(column.key)\n \"\n >\n <span *ngIf=\"column.value?.header !== false\">{{\n column.value?.header || column.key | capitalCase\n }}</span>\n </button>\n <span\n *ngIf=\"!column.value?.sortable && column.value?.header !== false\"\n >{{ column.value?.header || column.key | capitalCase }}</span\n >\n </th>\n </ng-container>\n <ng-container\n *ngIf=\"\n ((table?.config?.rows | keyvalue: columnOrder) || [])[0] as headerRow\n \"\n >\n <th\n class=\"row-header\"\n [attr.aria-sort]=\"sortBy$ | async | sortClass: headerRow.key:true\"\n ngClass=\"{{ headerRow.value?.sortable ? 'sort ' : '' }} {{\n sortBy$ | async | sortClass: headerRow.key\n }} {{ (headerRow.key | dashCase) + '-column' }}\"\n (click)=\"\n table.isLoading || !headerRow.value?.sortable || sort(headerRow.key)\n \"\n scope=\"col\"\n >\n <ng-container *ngIf=\"headerRow?.value?.header !== false\">{{\n headerRow?.value?.header || headerRow.key | capitalCase\n }}</ng-container>\n </th>\n <th\n *ngFor=\"let column of ((table$ | async)?.data || [])[0]\"\n ngClass=\"{{ headerRow.value?.class }}\"\n >\n <ng-container\n [ngTemplateOutlet]=\"\n (table.config?.rows || {})[headerRow.key].templateRef\n ? templateRef\n : (table.config?.rows || {})[headerRow.key].transform\n ? transformData\n : rawData\n \"\n [ngTemplateOutletContext]=\"{\n row: column,\n column: headerRow,\n transform: (table.config?.rows || {})[headerRow.key].transform,\n templateRef: (table.config?.rows || {})[headerRow.key]\n .templateRef,\n index: 0\n }\"\n >\n </ng-container>\n </th>\n </ng-container>\n </tr>\n </thead>\n <tbody *ngIf=\"loading$ | async; else tableContent\">\n <tr>\n <td class=\"p-0\" [colSpan]=\"colspan$ | async\">\n <ng-content select=\".table-loading\"></ng-content>\n </td>\n </tr>\n </tbody>\n</table>\n<ng-template #tableContent>\n <ng-container *ngIf=\"(table$ | async)! as table\">\n <tbody *ngIf=\"(table!.data![0] || table!.data!).length > 0; else noData\">\n <ng-container *ngIf=\"table.config.columns\">\n <tr\n *ngFor=\"\n let row of table!.data![(currentPage$ | async) || 0];\n let i = index\n \"\n [attr.id]=\"'tableRow_' + i\"\n >\n <ng-container\n *ngFor=\"let column of table.config?.columns | keyvalue: columnOrder\"\n >\n <td\n *ngIf=\"!column.value?.hidden\"\n ngClass=\"{{ (column.key | dashCase) + '-column' }} {{\n column.value?.class\n }}\"\n [attr.data-label]=\"\n table.config?.mobileLayout && column.value?.mobileHeader\n ? column.value?.mobileHeader !== true\n ? column.value?.mobileHeader\n : (column.value?.header || column.key | capitalCase)\n : null\n \"\n >\n <ng-container\n [ngTemplateOutlet]=\"\n (searchBy$ | async) &&\n !(table.config?.columns || {})[column.key].templateRef\n ? highlighted\n : (table.config?.columns || {})[column.key].templateRef\n ? templateRef\n : (table.config?.columns || {})[column.key].transform\n ? transformData\n : rawData\n \"\n [ngTemplateOutletContext]=\"{\n row: row,\n column: column,\n search: (searchBy$ | async),\n transform: (table.config?.columns || {})[column.key]\n .transform,\n templateRef: (table.config?.columns || {})[column.key]\n .templateRef,\n index: i,\n data: table.data[(currentPage$ | async) || 0]\n }\"\n ></ng-container>\n </td>\n </ng-container>\n </tr>\n </ng-container>\n <ng-container *ngIf=\"table.config.rows\">\n <ng-container\n *ngFor=\"\n let row of table?.config?.rows | keyvalue: columnOrder | slice: 1;\n let i = index\n \"\n >\n <tr\n *ngIf=\"!row.value?.hidden\"\n [attr.id]=\"'tableRow_' + i\"\n ngClass=\"{{ (row.key | dashCase) + '-row' }}\"\n >\n <th class=\"row-header\" scope=\"row\">\n {{ row.value?.header || row.key | capitalCase }}\n </th>\n <td\n *ngFor=\"let column of (table?.data || [])[0]; let y = index\"\n ngClass=\"{{ row.value?.class }}\"\n >\n <ng-container\n [ngTemplateOutlet]=\"\n (table.config?.rows || {})[row.key].templateRef\n ? templateRef\n : (table.config?.rows || {})[row.key].transform\n ? transformData\n : rawData\n \"\n [ngTemplateOutletContext]=\"{\n row: column,\n column: row,\n transform: (table.config?.rows || {})[row.key].transform,\n templateRef: (table.config?.rows || {})[row.key].templateRef,\n index: table.config?.rows ? y : i,\n data: table.data[(currentPage$ | async) || 0]\n }\"\n >\n </ng-container>\n </td>\n </tr>\n </ng-container>\n </ng-container>\n </tbody>\n </ng-container>\n</ng-template>\n<ng-template #noData>\n <tbody>\n <tr>\n <td class=\"p-0\" [colSpan]=\"colspan$ | async\">\n <ng-content select=\".table-no-data\"></ng-content>\n </td>\n </tr>\n </tbody>\n</ng-template>\n<ng-template #highlighted let-row=\"row\" let-column=\"column\" let-search=\"search\">\n <div [innerHTML]=\"row[column.key] | highlight: search\"></div>\n</ng-template>\n<ng-template #rawData let-row=\"row\" let-column=\"column\">\n {{ row[column.key] }}\n</ng-template>\n<ng-template\n #transformData\n let-row=\"row\"\n let-column=\"column\"\n let-transform=\"transform\"\n let-data=\"data\"\n>\n {{ row[column.key] | dynamicPipe: transform.pipe:transform?.args }}\n</ng-template>\n<ng-template\n #templateRef\n let-row=\"row\"\n let-column=\"column\"\n let-index=\"index\"\n let-templateRef=\"templateRef\"\n let-data=\"data\"\n>\n <ng-container\n [ngTemplateOutlet]=\"templateRef\"\n [ngTemplateOutletContext]=\"{\n row: row,\n col: column,\n index: index,\n data: data\n }\"\n ></ng-container>\n</ng-template>\n", directives: [{ type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i1.AsyncPipe, "keyvalue": i1.KeyValuePipe, "dashCase": DashCasePipe, "sortClass": SortClassPipe, "capitalCase": CapitalCasePipe, "slice": i1.SlicePipe, "highlight": HighlightPipe, "dynamicPipe": DynamicPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
330
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
353
|
+
CoreComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CoreComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
354
|
+
CoreComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: CoreComponent, selector: "angular-generic-table", inputs: { loading: "loading", page: "page", search: "search", config: "config", data: "data" }, outputs: { rowClick: "rowClick", rowHover: "rowHover" }, ngImport: i0, template: "<table\n [ngClass]=\"(tableConfig$ | async)?.class || 'table'\"\n [class.table-mobile]=\"(tableConfig$ | async)?.mobileLayout\"\n [class.table-horizontal]=\"(tableConfig$ | async)?.rows\"\n [class.table-loading]=\"loading$ | async\"\n [class.gt-sticky-row-header]=\"\n (tableConfig$ | async)?.stickyHeaders?.row && (tableConfig$ | async)?.rows\n \"\n [class.gt-sticky-column-header]=\"\n (tableConfig$ | async)?.stickyHeaders?.column\n \"\n [attr.aria-busy]=\"(loading$ | async) === true ? true : null\"\n>\n <thead>\n <tr\n *ngIf=\"{\n config: (tableConfig$ | async)!,\n isLoading: loading$ | async\n } as table\"\n >\n <ng-container\n *ngFor=\"let column of table?.config?.columns | keyvalue: columnOrder\"\n >\n <th\n *ngIf=\"!column.value?.hidden\"\n ngClass=\"{{ (column.key | dashCase) + '-column' }} {{\n column.value.class\n }}\"\n [class.disabled]=\"table.isLoading\"\n [attr.aria-sort]=\"sortBy$ | async | sortClass: column.key:true\"\n [class.gt-sortable]=\"true\"\n scope=\"col\"\n >\n <button\n *ngIf=\"column.value?.sortable\"\n class=\"gt-sort\"\n (click)=\"\n table.isLoading || !column.value?.sortable || sort(column.key)\n \"\n >\n <span *ngIf=\"column.value?.header !== false\">{{\n column.value?.header || column.key | capitalCase\n }}</span>\n </button>\n <span\n *ngIf=\"!column.value?.sortable && column.value?.header !== false\"\n >{{ column.value?.header || column.key | capitalCase }}</span\n >\n </th>\n </ng-container>\n <ng-container\n *ngIf=\"\n ((table?.config?.rows | keyvalue: columnOrder) || [])[0] as headerRow\n \"\n >\n <th\n class=\"row-header\"\n [attr.aria-sort]=\"sortBy$ | async | sortClass: headerRow.key:true\"\n ngClass=\"{{ headerRow.value?.sortable ? 'sort ' : '' }} {{\n sortBy$ | async | sortClass: headerRow.key\n }} {{ (headerRow.key | dashCase) + '-column' }}\"\n (click)=\"\n table.isLoading || !headerRow.value?.sortable || sort(headerRow.key)\n \"\n scope=\"col\"\n >\n <ng-container *ngIf=\"headerRow?.value?.header !== false\">{{\n headerRow?.value?.header || headerRow.key | capitalCase\n }}</ng-container>\n </th>\n <th\n *ngFor=\"let column of ((table$ | async)?.data || [])[0]\"\n ngClass=\"{{ headerRow.value?.class }}\"\n >\n <ng-container\n [ngTemplateOutlet]=\"\n (table.config?.rows || {})[headerRow.key].templateRef\n ? templateRef\n : (table.config?.rows || {})[headerRow.key].transform\n ? transformData\n : rawData\n \"\n [ngTemplateOutletContext]=\"{\n row: column,\n column: headerRow,\n transform: (table.config?.rows || {})[headerRow.key].transform,\n templateRef: (table.config?.rows || {})[headerRow.key]\n .templateRef,\n index: 0\n }\"\n >\n </ng-container>\n </th>\n </ng-container>\n </tr>\n </thead>\n <tbody *ngIf=\"loading$ | async; else tableContent\">\n <tr>\n <td class=\"p-0\" [colSpan]=\"colspan$ | async\">\n <ng-content select=\".table-loading\"></ng-content>\n </td>\n </tr>\n </tbody>\n</table>\n<ng-template #tableContent>\n <ng-container *ngIf=\"(table$ | async)! as table\">\n <tbody *ngIf=\"(table!.data![0] || table!.data!).length > 0; else noData\">\n <ng-container *ngIf=\"table.config.columns\">\n <tr\n *ngFor=\"\n let row of table!.data![(currentPage$ | async) || 0];\n let i = index\n \"\n [attr.id]=\"'tableRow_' + i\"\n (click)=\"table?.config?.rowClick && _rowClick(row, i, $event)\"\n (mouseover)=\"table?.config?.rowHover && _hoverRow(row, i, $event)\"\n (mouseout)=\"table?.config?.rowHover && _hoverRow(null, null, $event)\"\n [class.gt-hover]=\"(rowHover$ | async)?.index === i\"\n >\n <ng-container\n *ngFor=\"let column of table.config?.columns | keyvalue: columnOrder\"\n >\n <td\n *ngIf=\"!column.value?.hidden\"\n ngClass=\"{{ (column.key | dashCase) + '-column' }} {{\n column.value?.class\n }}\"\n [attr.data-label]=\"\n table.config?.mobileLayout && column.value?.mobileHeader\n ? column.value?.mobileHeader !== true\n ? column.value?.mobileHeader\n : (column.value?.header || column.key | capitalCase)\n : null\n \"\n >\n <ng-container\n [ngTemplateOutlet]=\"\n (searchBy$ | async) &&\n !(table.config?.columns || {})[column.key].templateRef\n ? highlighted\n : (table.config?.columns || {})[column.key].templateRef\n ? templateRef\n : (table.config?.columns || {})[column.key].transform\n ? transformData\n : rawData\n \"\n [ngTemplateOutletContext]=\"{\n row: row,\n column: column,\n search: (searchBy$ | async),\n transform: (table.config?.columns || {})[column.key]\n .transform,\n templateRef: (table.config?.columns || {})[column.key]\n .templateRef,\n index: i,\n data: table.data[(currentPage$ | async) || 0]\n }\"\n ></ng-container>\n </td>\n </ng-container>\n </tr>\n </ng-container>\n <ng-container *ngIf=\"table.config.rows\">\n <ng-container\n *ngFor=\"\n let row of table?.config?.rows | keyvalue: columnOrder | slice: 1;\n let i = index\n \"\n >\n <tr\n *ngIf=\"!row.value?.hidden\"\n [attr.id]=\"'tableRow_' + i\"\n ngClass=\"{{ (row.key | dashCase) + '-row' }}\"\n (click)=\"table?.config?.rowClick && _rowClick(row, i, $event)\"\n (mouseover)=\"table?.config?.rowHover && _hoverRow(row, i, $event)\"\n (mouseout)=\"\n table?.config?.rowHover && _hoverRow(null, null, $event)\n \"\n [class.gt-hover]=\"(rowHover$ | async)?.index === i\"\n >\n <th class=\"row-header\" scope=\"row\">\n {{ row.value?.header || row.key | capitalCase }}\n </th>\n <td\n *ngFor=\"let column of (table?.data || [])[0]; let y = index\"\n ngClass=\"{{ row.value?.class }}\"\n >\n <ng-container\n [ngTemplateOutlet]=\"\n (table.config?.rows || {})[row.key].templateRef\n ? templateRef\n : (table.config?.rows || {})[row.key].transform\n ? transformData\n : rawData\n \"\n [ngTemplateOutletContext]=\"{\n row: column,\n column: row,\n transform: (table.config?.rows || {})[row.key].transform,\n templateRef: (table.config?.rows || {})[row.key].templateRef,\n index: table.config?.rows ? y : i,\n data: table.data[(currentPage$ | async) || 0]\n }\"\n >\n </ng-container>\n </td>\n </tr>\n </ng-container>\n </ng-container>\n </tbody>\n </ng-container>\n</ng-template>\n<ng-template #noData>\n <tbody>\n <tr>\n <td class=\"p-0\" [colSpan]=\"colspan$ | async\">\n <ng-content select=\".table-no-data\"></ng-content>\n </td>\n </tr>\n </tbody>\n</ng-template>\n<ng-template #highlighted let-row=\"row\" let-column=\"column\" let-search=\"search\">\n <div [innerHTML]=\"row[column.key] | highlight: search\"></div>\n</ng-template>\n<ng-template #rawData let-row=\"row\" let-column=\"column\">\n {{ row[column.key] }}\n</ng-template>\n<ng-template\n #transformData\n let-row=\"row\"\n let-column=\"column\"\n let-transform=\"transform\"\n let-data=\"data\"\n>\n {{ row[column.key] | dynamicPipe: transform.pipe:transform?.args }}\n</ng-template>\n<ng-template\n #templateRef\n let-row=\"row\"\n let-column=\"column\"\n let-index=\"index\"\n let-templateRef=\"templateRef\"\n let-data=\"data\"\n>\n <ng-container\n [ngTemplateOutlet]=\"templateRef\"\n [ngTemplateOutletContext]=\"{\n row: row,\n col: column,\n index: index,\n data: data\n }\"\n ></ng-container>\n</ng-template>\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: SortClassPipe, name: "sortClass" }, { kind: "pipe", type: DashCasePipe, name: "dashCase" }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: CapitalCasePipe, name: "capitalCase" }, { kind: "pipe", type: DynamicPipe, name: "dynamicPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
355
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CoreComponent, decorators: [{
|
|
331
356
|
type: Component,
|
|
332
|
-
args: [{ selector: 'angular-generic-table',
|
|
357
|
+
args: [{ selector: 'angular-generic-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<table\n [ngClass]=\"(tableConfig$ | async)?.class || 'table'\"\n [class.table-mobile]=\"(tableConfig$ | async)?.mobileLayout\"\n [class.table-horizontal]=\"(tableConfig$ | async)?.rows\"\n [class.table-loading]=\"loading$ | async\"\n [class.gt-sticky-row-header]=\"\n (tableConfig$ | async)?.stickyHeaders?.row && (tableConfig$ | async)?.rows\n \"\n [class.gt-sticky-column-header]=\"\n (tableConfig$ | async)?.stickyHeaders?.column\n \"\n [attr.aria-busy]=\"(loading$ | async) === true ? true : null\"\n>\n <thead>\n <tr\n *ngIf=\"{\n config: (tableConfig$ | async)!,\n isLoading: loading$ | async\n } as table\"\n >\n <ng-container\n *ngFor=\"let column of table?.config?.columns | keyvalue: columnOrder\"\n >\n <th\n *ngIf=\"!column.value?.hidden\"\n ngClass=\"{{ (column.key | dashCase) + '-column' }} {{\n column.value.class\n }}\"\n [class.disabled]=\"table.isLoading\"\n [attr.aria-sort]=\"sortBy$ | async | sortClass: column.key:true\"\n [class.gt-sortable]=\"true\"\n scope=\"col\"\n >\n <button\n *ngIf=\"column.value?.sortable\"\n class=\"gt-sort\"\n (click)=\"\n table.isLoading || !column.value?.sortable || sort(column.key)\n \"\n >\n <span *ngIf=\"column.value?.header !== false\">{{\n column.value?.header || column.key | capitalCase\n }}</span>\n </button>\n <span\n *ngIf=\"!column.value?.sortable && column.value?.header !== false\"\n >{{ column.value?.header || column.key | capitalCase }}</span\n >\n </th>\n </ng-container>\n <ng-container\n *ngIf=\"\n ((table?.config?.rows | keyvalue: columnOrder) || [])[0] as headerRow\n \"\n >\n <th\n class=\"row-header\"\n [attr.aria-sort]=\"sortBy$ | async | sortClass: headerRow.key:true\"\n ngClass=\"{{ headerRow.value?.sortable ? 'sort ' : '' }} {{\n sortBy$ | async | sortClass: headerRow.key\n }} {{ (headerRow.key | dashCase) + '-column' }}\"\n (click)=\"\n table.isLoading || !headerRow.value?.sortable || sort(headerRow.key)\n \"\n scope=\"col\"\n >\n <ng-container *ngIf=\"headerRow?.value?.header !== false\">{{\n headerRow?.value?.header || headerRow.key | capitalCase\n }}</ng-container>\n </th>\n <th\n *ngFor=\"let column of ((table$ | async)?.data || [])[0]\"\n ngClass=\"{{ headerRow.value?.class }}\"\n >\n <ng-container\n [ngTemplateOutlet]=\"\n (table.config?.rows || {})[headerRow.key].templateRef\n ? templateRef\n : (table.config?.rows || {})[headerRow.key].transform\n ? transformData\n : rawData\n \"\n [ngTemplateOutletContext]=\"{\n row: column,\n column: headerRow,\n transform: (table.config?.rows || {})[headerRow.key].transform,\n templateRef: (table.config?.rows || {})[headerRow.key]\n .templateRef,\n index: 0\n }\"\n >\n </ng-container>\n </th>\n </ng-container>\n </tr>\n </thead>\n <tbody *ngIf=\"loading$ | async; else tableContent\">\n <tr>\n <td class=\"p-0\" [colSpan]=\"colspan$ | async\">\n <ng-content select=\".table-loading\"></ng-content>\n </td>\n </tr>\n </tbody>\n</table>\n<ng-template #tableContent>\n <ng-container *ngIf=\"(table$ | async)! as table\">\n <tbody *ngIf=\"(table!.data![0] || table!.data!).length > 0; else noData\">\n <ng-container *ngIf=\"table.config.columns\">\n <tr\n *ngFor=\"\n let row of table!.data![(currentPage$ | async) || 0];\n let i = index\n \"\n [attr.id]=\"'tableRow_' + i\"\n (click)=\"table?.config?.rowClick && _rowClick(row, i, $event)\"\n (mouseover)=\"table?.config?.rowHover && _hoverRow(row, i, $event)\"\n (mouseout)=\"table?.config?.rowHover && _hoverRow(null, null, $event)\"\n [class.gt-hover]=\"(rowHover$ | async)?.index === i\"\n >\n <ng-container\n *ngFor=\"let column of table.config?.columns | keyvalue: columnOrder\"\n >\n <td\n *ngIf=\"!column.value?.hidden\"\n ngClass=\"{{ (column.key | dashCase) + '-column' }} {{\n column.value?.class\n }}\"\n [attr.data-label]=\"\n table.config?.mobileLayout && column.value?.mobileHeader\n ? column.value?.mobileHeader !== true\n ? column.value?.mobileHeader\n : (column.value?.header || column.key | capitalCase)\n : null\n \"\n >\n <ng-container\n [ngTemplateOutlet]=\"\n (searchBy$ | async) &&\n !(table.config?.columns || {})[column.key].templateRef\n ? highlighted\n : (table.config?.columns || {})[column.key].templateRef\n ? templateRef\n : (table.config?.columns || {})[column.key].transform\n ? transformData\n : rawData\n \"\n [ngTemplateOutletContext]=\"{\n row: row,\n column: column,\n search: (searchBy$ | async),\n transform: (table.config?.columns || {})[column.key]\n .transform,\n templateRef: (table.config?.columns || {})[column.key]\n .templateRef,\n index: i,\n data: table.data[(currentPage$ | async) || 0]\n }\"\n ></ng-container>\n </td>\n </ng-container>\n </tr>\n </ng-container>\n <ng-container *ngIf=\"table.config.rows\">\n <ng-container\n *ngFor=\"\n let row of table?.config?.rows | keyvalue: columnOrder | slice: 1;\n let i = index\n \"\n >\n <tr\n *ngIf=\"!row.value?.hidden\"\n [attr.id]=\"'tableRow_' + i\"\n ngClass=\"{{ (row.key | dashCase) + '-row' }}\"\n (click)=\"table?.config?.rowClick && _rowClick(row, i, $event)\"\n (mouseover)=\"table?.config?.rowHover && _hoverRow(row, i, $event)\"\n (mouseout)=\"\n table?.config?.rowHover && _hoverRow(null, null, $event)\n \"\n [class.gt-hover]=\"(rowHover$ | async)?.index === i\"\n >\n <th class=\"row-header\" scope=\"row\">\n {{ row.value?.header || row.key | capitalCase }}\n </th>\n <td\n *ngFor=\"let column of (table?.data || [])[0]; let y = index\"\n ngClass=\"{{ row.value?.class }}\"\n >\n <ng-container\n [ngTemplateOutlet]=\"\n (table.config?.rows || {})[row.key].templateRef\n ? templateRef\n : (table.config?.rows || {})[row.key].transform\n ? transformData\n : rawData\n \"\n [ngTemplateOutletContext]=\"{\n row: column,\n column: row,\n transform: (table.config?.rows || {})[row.key].transform,\n templateRef: (table.config?.rows || {})[row.key].templateRef,\n index: table.config?.rows ? y : i,\n data: table.data[(currentPage$ | async) || 0]\n }\"\n >\n </ng-container>\n </td>\n </tr>\n </ng-container>\n </ng-container>\n </tbody>\n </ng-container>\n</ng-template>\n<ng-template #noData>\n <tbody>\n <tr>\n <td class=\"p-0\" [colSpan]=\"colspan$ | async\">\n <ng-content select=\".table-no-data\"></ng-content>\n </td>\n </tr>\n </tbody>\n</ng-template>\n<ng-template #highlighted let-row=\"row\" let-column=\"column\" let-search=\"search\">\n <div [innerHTML]=\"row[column.key] | highlight: search\"></div>\n</ng-template>\n<ng-template #rawData let-row=\"row\" let-column=\"column\">\n {{ row[column.key] }}\n</ng-template>\n<ng-template\n #transformData\n let-row=\"row\"\n let-column=\"column\"\n let-transform=\"transform\"\n let-data=\"data\"\n>\n {{ row[column.key] | dynamicPipe: transform.pipe:transform?.args }}\n</ng-template>\n<ng-template\n #templateRef\n let-row=\"row\"\n let-column=\"column\"\n let-index=\"index\"\n let-templateRef=\"templateRef\"\n let-data=\"data\"\n>\n <ng-container\n [ngTemplateOutlet]=\"templateRef\"\n [ngTemplateOutletContext]=\"{\n row: row,\n col: column,\n index: index,\n data: data\n }\"\n ></ng-container>\n</ng-template>\n" }]
|
|
333
358
|
}], propDecorators: { loading: [{
|
|
334
359
|
type: Input
|
|
335
360
|
}], page: [{
|
|
@@ -340,6 +365,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
340
365
|
type: Input
|
|
341
366
|
}], data: [{
|
|
342
367
|
type: Input
|
|
368
|
+
}], rowClick: [{
|
|
369
|
+
type: Output
|
|
370
|
+
}], rowHover: [{
|
|
371
|
+
type: Output
|
|
343
372
|
}] } });
|
|
344
373
|
|
|
345
374
|
class GtDeltaComponent {
|
|
@@ -358,8 +387,8 @@ class GtDeltaComponent {
|
|
|
358
387
|
this.initialValue = '-';
|
|
359
388
|
}
|
|
360
389
|
}
|
|
361
|
-
GtDeltaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
362
|
-
GtDeltaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
390
|
+
GtDeltaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GtDeltaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
391
|
+
GtDeltaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: GtDeltaComponent, selector: "gt-delta", inputs: { data: "data", index: "index", baseIndex: "baseIndex", classes: "classes", key: "key", notApplicableValue: "notApplicableValue", initialValue: "initialValue" }, ngImport: i0, template: `<span
|
|
363
392
|
*ngIf="{
|
|
364
393
|
value:
|
|
365
394
|
index === 0
|
|
@@ -391,12 +420,10 @@ GtDeltaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versi
|
|
|
391
420
|
? initialValue
|
|
392
421
|
: notApplicableValue
|
|
393
422
|
}}</span
|
|
394
|
-
>`, isInline: true, styles: [":host{display:inline-block}\n"],
|
|
395
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
423
|
+
>`, isInline: true, styles: [":host{display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.PercentPipe, name: "percent" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
424
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GtDeltaComponent, decorators: [{
|
|
396
425
|
type: Component,
|
|
397
|
-
args: [{
|
|
398
|
-
selector: 'gt-delta',
|
|
399
|
-
template: `<span
|
|
426
|
+
args: [{ selector: 'gt-delta', template: `<span
|
|
400
427
|
*ngIf="{
|
|
401
428
|
value:
|
|
402
429
|
index === 0
|
|
@@ -428,16 +455,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
428
455
|
? initialValue
|
|
429
456
|
: notApplicableValue
|
|
430
457
|
}}</span
|
|
431
|
-
>`,
|
|
432
|
-
styles: [
|
|
433
|
-
`
|
|
434
|
-
:host {
|
|
435
|
-
display: inline-block;
|
|
436
|
-
}
|
|
437
|
-
`,
|
|
438
|
-
],
|
|
439
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
440
|
-
}]
|
|
458
|
+
>`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}\n"] }]
|
|
441
459
|
}], ctorParameters: function () { return []; }, propDecorators: { data: [{
|
|
442
460
|
type: Input
|
|
443
461
|
}], index: [{
|
|
@@ -456,8 +474,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
456
474
|
|
|
457
475
|
class GenericTableCoreModule {
|
|
458
476
|
}
|
|
459
|
-
GenericTableCoreModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
460
|
-
GenericTableCoreModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "
|
|
477
|
+
GenericTableCoreModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GenericTableCoreModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
478
|
+
GenericTableCoreModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: GenericTableCoreModule, declarations: [CoreComponent,
|
|
461
479
|
SortClassPipe,
|
|
462
480
|
DashCasePipe,
|
|
463
481
|
HighlightPipe,
|
|
@@ -465,8 +483,8 @@ GenericTableCoreModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0",
|
|
|
465
483
|
CapitalCasePipe,
|
|
466
484
|
DynamicPipe,
|
|
467
485
|
GtDeltaComponent], imports: [CommonModule], exports: [CoreComponent, GtDeltaComponent] });
|
|
468
|
-
GenericTableCoreModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
469
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
486
|
+
GenericTableCoreModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GenericTableCoreModule, imports: [CommonModule] });
|
|
487
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GenericTableCoreModule, decorators: [{
|
|
470
488
|
type: NgModule,
|
|
471
489
|
args: [{
|
|
472
490
|
declarations: [
|
|
@@ -562,9 +580,9 @@ class PaginationComponent {
|
|
|
562
580
|
}
|
|
563
581
|
}
|
|
564
582
|
}
|
|
565
|
-
PaginationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
566
|
-
PaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
567
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
583
|
+
PaginationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
584
|
+
PaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: PaginationComponent, selector: "angular-generic-table-pagination", inputs: { paginationLength: "paginationLength", classes: "classes", ariaLabels: "ariaLabels", table: "table" }, ngImport: i0, template: "<ng-container\n *ngIf=\"{\n links: pagination$ | async,\n currentPosition: table?.currentPage$ | async\n } as pagination\"\n>\n <nav\n *ngIf=\"pagination.links && pagination.links.length > 1\"\n role=\"navigation\"\n [attr.aria-label]=\"ariaLabels?.nav\"\n class=\"gt-pagination\"\n [class]=\"classes?.nav\"\n >\n <ul [class]=\"classes?.ul\">\n <ng-container\n *ngFor=\"\n let position of pagination!.links;\n let i = index;\n let last = last\n \"\n >\n <li\n [class]=\"classes?.li\"\n [class.active]=\"position === (pagination!.currentPosition || 0) + 1\"\n >\n <button\n [class]=\"classes?.button\"\n [attr.aria-label]=\"ariaLabels.button + position\"\n (click)=\"goto(position)\"\n >\n {{ position }}\n </button>\n </li>\n <li\n [class]=\"classes?.li\"\n class=\"gt-ellipsis\"\n *ngIf=\"position + 1 !== pagination!.links![i + 1] && !last\"\n >\n <button [class]=\"classes?.button\" disabled tabindex=\"-1\"></button>\n </li>\n </ng-container>\n </ul>\n </nav>\n</ng-container>\n", 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: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
585
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: PaginationComponent, decorators: [{
|
|
568
586
|
type: Component,
|
|
569
587
|
args: [{ selector: 'angular-generic-table-pagination', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container\n *ngIf=\"{\n links: pagination$ | async,\n currentPosition: table?.currentPage$ | async\n } as pagination\"\n>\n <nav\n *ngIf=\"pagination.links && pagination.links.length > 1\"\n role=\"navigation\"\n [attr.aria-label]=\"ariaLabels?.nav\"\n class=\"gt-pagination\"\n [class]=\"classes?.nav\"\n >\n <ul [class]=\"classes?.ul\">\n <ng-container\n *ngFor=\"\n let position of pagination!.links;\n let i = index;\n let last = last\n \"\n >\n <li\n [class]=\"classes?.li\"\n [class.active]=\"position === (pagination!.currentPosition || 0) + 1\"\n >\n <button\n [class]=\"classes?.button\"\n [attr.aria-label]=\"ariaLabels.button + position\"\n (click)=\"goto(position)\"\n >\n {{ position }}\n </button>\n </li>\n <li\n [class]=\"classes?.li\"\n class=\"gt-ellipsis\"\n *ngIf=\"position + 1 !== pagination!.links![i + 1] && !last\"\n >\n <button [class]=\"classes?.button\" disabled tabindex=\"-1\"></button>\n </li>\n </ng-container>\n </ul>\n </nav>\n</ng-container>\n" }]
|
|
570
588
|
}], propDecorators: { paginationLength: [{
|
|
@@ -579,10 +597,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
579
597
|
|
|
580
598
|
class GenericTablePaginationModule {
|
|
581
599
|
}
|
|
582
|
-
GenericTablePaginationModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
583
|
-
GenericTablePaginationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "
|
|
584
|
-
GenericTablePaginationModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
585
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
600
|
+
GenericTablePaginationModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GenericTablePaginationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
601
|
+
GenericTablePaginationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: GenericTablePaginationModule, declarations: [PaginationComponent], imports: [CommonModule], exports: [PaginationComponent] });
|
|
602
|
+
GenericTablePaginationModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GenericTablePaginationModule, imports: [CommonModule] });
|
|
603
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GenericTablePaginationModule, decorators: [{
|
|
586
604
|
type: NgModule,
|
|
587
605
|
args: [{
|
|
588
606
|
declarations: [PaginationComponent],
|