@angular-generic-table/core 5.0.0-rc.10 → 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.
Files changed (39) hide show
  1. package/esm2020/lib/core.component.mjs +98 -30
  2. package/esm2020/lib/core.module.mjs +24 -7
  3. package/esm2020/lib/core.service.mjs +5 -5
  4. package/esm2020/lib/enums/order.enum.mjs +1 -1
  5. package/esm2020/lib/gt-delta/gt-delta.component.mjs +104 -0
  6. package/esm2020/lib/models/gt-pagination.mjs +2 -0
  7. package/esm2020/lib/models/table-column.interface.mjs +1 -1
  8. package/esm2020/lib/models/table-config.interface.mjs +1 -1
  9. package/esm2020/lib/models/table-events.interface.mjs +2 -0
  10. package/esm2020/lib/pagination/pagination.component.mjs +47 -12
  11. package/esm2020/lib/pagination/pagination.module.mjs +5 -5
  12. package/esm2020/lib/pipes/capital-case.pipe.mjs +3 -3
  13. package/esm2020/lib/pipes/dash-case.pipe.mjs +5 -5
  14. package/esm2020/lib/pipes/dynamic.pipe.mjs +3 -3
  15. package/esm2020/lib/pipes/highlight.pipe.mjs +6 -6
  16. package/esm2020/lib/pipes/sort-class.pipe.mjs +12 -6
  17. package/esm2020/lib/utilities/utilities.mjs +20 -6
  18. package/esm2020/public-api.mjs +3 -1
  19. package/fesm2015/angular-generic-table-core.mjs +331 -88
  20. package/fesm2015/angular-generic-table-core.mjs.map +1 -1
  21. package/fesm2020/angular-generic-table-core.mjs +328 -88
  22. package/fesm2020/angular-generic-table-core.mjs.map +1 -1
  23. package/{angular-generic-table-core.d.ts → index.d.ts} +0 -0
  24. package/lib/core.component.d.ts +18 -6
  25. package/lib/core.module.d.ts +3 -2
  26. package/lib/gt-delta/gt-delta.component.d.ts +20 -0
  27. package/lib/models/gt-pagination.d.ts +10 -0
  28. package/lib/models/table-column.interface.d.ts +4 -0
  29. package/lib/models/table-config.interface.d.ts +6 -0
  30. package/lib/models/table-events.interface.d.ts +11 -0
  31. package/lib/pagination/pagination.component.d.ts +11 -1
  32. package/lib/pipes/capital-case.pipe.d.ts +1 -1
  33. package/lib/pipes/dash-case.pipe.d.ts +1 -1
  34. package/lib/pipes/dynamic.pipe.d.ts +1 -1
  35. package/lib/pipes/highlight.pipe.d.ts +1 -1
  36. package/lib/pipes/sort-class.pipe.d.ts +2 -2
  37. package/package.json +5 -5
  38. package/public-api.d.ts +2 -0
  39. package/scss/index.scss +170 -13
@@ -1,19 +1,19 @@
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, shareReplay, withLatestFrom, pluck } from 'rxjs/operators';
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: "13.0.3", ngImport: i0, type: CoreService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
12
- CoreService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: CoreService, providedIn: 'root' });
13
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: CoreService, decorators: [{
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
- providedIn: 'root'
16
+ providedIn: 'root',
17
17
  }]
18
18
  }], ctorParameters: function () { return []; } });
19
19
 
@@ -51,11 +51,28 @@ search = (text, caseSensitive, data, config) => {
51
51
  if (config.columns) {
52
52
  const searchColumns = Object.keys(config.columns).filter(
53
53
  // @ts-ignore
54
- (key) => !config.columns[key].hidden && config.columns[key].search !== false);
55
- return data.filter((row) => Object.entries(row)
56
- .filter(([key, value]) => searchColumns.indexOf(key) !== -1)
57
- .reduce((prev, [key, value]) => prev + (prev === '' ? '' : ' & ') + (caseSensitive ? value + '' : (value + '').toLowerCase()), '')
58
- .indexOf(text) !== -1);
54
+ (key) => {
55
+ var _a, _b;
56
+ return config.columns &&
57
+ !((_a = config.columns[key]) === null || _a === void 0 ? void 0 : _a.hidden) &&
58
+ ((_b = config.columns[key]) === null || _b === void 0 ? void 0 : _b.search) !== false;
59
+ });
60
+ const FILTERED = [];
61
+ for (let i = 0; i < data.length; i++) {
62
+ const row = data[i];
63
+ const match = Object.entries(row)
64
+ .filter(([key, value]) => searchColumns.indexOf(key) !== -1)
65
+ .reduce((acc, [key, value], index) => {
66
+ return (acc +
67
+ (index === 0 ? '' : ' ? ') +
68
+ (caseSensitive ? value + '' : (value + '').toLowerCase()));
69
+ }, '')
70
+ .indexOf(text) !== -1;
71
+ if (match) {
72
+ FILTERED[FILTERED.length] = row;
73
+ }
74
+ }
75
+ return FILTERED;
59
76
  }
60
77
  else {
61
78
  return data;
@@ -63,13 +80,19 @@ search = (text, caseSensitive, data, config) => {
63
80
  };
64
81
 
65
82
  class SortClassPipe {
66
- transform(selection, property) {
67
- return (selection === null || selection === void 0 ? void 0 : selection.sortBy) === property ? 'sort-' + selection.sortByOrder : '';
83
+ transform(selection, property, aria = false) {
84
+ return (selection === null || selection === void 0 ? void 0 : selection.sortBy) === property
85
+ ? !aria
86
+ ? 'gt-sort-' + selection.sortByOrder
87
+ : selection.sortByOrder + 'ending'
88
+ : !aria
89
+ ? ''
90
+ : null;
68
91
  }
69
92
  }
70
- SortClassPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: SortClassPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
71
- SortClassPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: SortClassPipe, name: "sortClass" });
72
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: SortClassPipe, decorators: [{
93
+ SortClassPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: SortClassPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
94
+ SortClassPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: SortClassPipe, name: "sortClass" });
95
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: SortClassPipe, decorators: [{
73
96
  type: Pipe,
74
97
  args: [{
75
98
  name: 'sortClass',
@@ -81,26 +104,12 @@ class DashCasePipe {
81
104
  return dashed(s);
82
105
  }
83
106
  }
84
- DashCasePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: DashCasePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
85
- DashCasePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: DashCasePipe, name: "dashCase" });
86
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: DashCasePipe, decorators: [{
87
- type: Pipe,
88
- args: [{
89
- name: 'dashCase'
90
- }]
91
- }] });
92
-
93
- class CapitalCasePipe {
94
- transform(s) {
95
- return capitalize(s);
96
- }
97
- }
98
- CapitalCasePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: CapitalCasePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
99
- CapitalCasePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: CapitalCasePipe, name: "capitalCase" });
100
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: CapitalCasePipe, decorators: [{
107
+ DashCasePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: DashCasePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
108
+ DashCasePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: DashCasePipe, name: "dashCase" });
109
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: DashCasePipe, decorators: [{
101
110
  type: Pipe,
102
111
  args: [{
103
- name: 'capitalCase',
112
+ name: 'dashCase',
104
113
  }]
105
114
  }] });
106
115
 
@@ -118,7 +127,7 @@ class HighlightPipe {
118
127
  searchTerm
119
128
  .toLowerCase()
120
129
  .match(/".*?"|[^ ]+/g) // extract words
121
- .map(needle => needle.replace(/"(.*?)"/, '$1') // strip away '"'
130
+ .map((needle) => needle.replace(/"(.*?)"/, '$1') // strip away '"'
122
131
  )
123
132
  .join('|') + // combine words
124
133
  ')', 'ig');
@@ -141,12 +150,26 @@ class HighlightPipe {
141
150
  return highlightedText;
142
151
  }
143
152
  }
144
- HighlightPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: HighlightPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
145
- HighlightPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: HighlightPipe, name: "highlight" });
146
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: HighlightPipe, decorators: [{
153
+ HighlightPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: HighlightPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
154
+ HighlightPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: HighlightPipe, name: "highlight" });
155
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: HighlightPipe, decorators: [{
147
156
  type: Pipe,
148
157
  args: [{
149
- name: 'highlight'
158
+ name: 'highlight',
159
+ }]
160
+ }] });
161
+
162
+ class CapitalCasePipe {
163
+ transform(s) {
164
+ return capitalize(s);
165
+ }
166
+ }
167
+ CapitalCasePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CapitalCasePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
168
+ CapitalCasePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: CapitalCasePipe, name: "capitalCase" });
169
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CapitalCasePipe, decorators: [{
170
+ type: Pipe,
171
+ args: [{
172
+ name: 'capitalCase',
150
173
  }]
151
174
  }] });
152
175
 
@@ -164,9 +187,9 @@ class DynamicPipe {
164
187
  return pipe.transform(value, ...(pipeArgs || []));
165
188
  }
166
189
  }
167
- DynamicPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: DynamicPipe, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Pipe });
168
- DynamicPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: DynamicPipe, name: "dynamicPipe" });
169
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: DynamicPipe, decorators: [{
190
+ DynamicPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: DynamicPipe, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Pipe });
191
+ DynamicPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: DynamicPipe, name: "dynamicPipe" });
192
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: DynamicPipe, decorators: [{
170
193
  type: Pipe,
171
194
  args: [{
172
195
  name: 'dynamicPipe',
@@ -175,6 +198,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImpor
175
198
 
176
199
  class CoreComponent {
177
200
  constructor() {
201
+ this.rowClick = new EventEmitter();
202
+ this._rowHover$ = new ReplaySubject(1);
203
+ this.rowHover = new EventEmitter();
204
+ this.rowHover$ = this._rowHover$.asObservable().pipe(debounceTime(50), distinctUntilChanged((p, q) => p.index === q.index), tap((event) => this.rowHover.emit(event)), shareReplay(1));
178
205
  this._loading$ = new ReplaySubject(1);
179
206
  this.sortBy$ = new Subject();
180
207
  // tslint:disable-next-line:variable-name
@@ -183,17 +210,43 @@ class CoreComponent {
183
210
  // tslint:disable-next-line:variable-name
184
211
  this._tableConfig$ = new ReplaySubject(1);
185
212
  this.tableConfig$ = this._tableConfig$.pipe(map((value) => (isObservable(value) ? value : of(value))), switchMap((obs) => obs), shareReplay(1));
186
- // tslint:disable-next-line:variable-name
187
213
  this._data$ = new ReplaySubject(1);
188
- this.data$ = this._data$.pipe(map((value) => (isObservable(value) ? value : of(value))), switchMap((obs) => combineLatest([obs, this.sortBy$.pipe(startWith(EMPTY)), this.searchBy$])), withLatestFrom(this.tableConfig$), map(([[data, sortBy, searchBy], config]) => {
214
+ this.data$ = this._data$.pipe(map((value) => (isObservable(value) ? value : of(value))), switchMap((obs) => combineLatest([obs])), withLatestFrom(this.tableConfig$), map(([[data], config]) => {
215
+ // if columns or rows contains config for mapTo...
216
+ if ((config.columns &&
217
+ !!Object.values(config.columns).find((column) => !!column.mapTo)) ||
218
+ (config.rows &&
219
+ !!Object.values(config.rows).find((column) => !!column.mapTo))) {
220
+ // ...map data to new keys on row...
221
+ const newData = [];
222
+ for (let i = 0; i < data.length; i++) {
223
+ const row = data[i];
224
+ const newKeys = Object.entries(config.columns || config.rows || [])
225
+ .filter(([key, value]) => !!value.mapTo) // add keys for columns with mapTo config...
226
+ .reduce((previousValue, [key, value]) => {
227
+ var _a;
228
+ return (Object.assign(Object.assign({}, previousValue), { [key]: this.nestedValue(row, value.mapTo.path, (_a = value.mapTo) === null || _a === void 0 ? void 0 : _a.missingValue) }));
229
+ }, {});
230
+ newData[i] = Object.assign(Object.assign({}, row), newKeys);
231
+ }
232
+ data = newData;
233
+ }
234
+ return { data, config };
235
+ }), switchMap((obs) => combineLatest([
236
+ of(obs),
237
+ this.sortBy$.pipe(startWith(EMPTY)),
238
+ this.searchBy$,
239
+ ])), map(([table, sortBy, searchBy]) => {
189
240
  var _a;
190
241
  // create a new array reference and sort new array (prevent mutating existing state)
191
- data = [...data];
242
+ table.data = [...table.data];
192
243
  return !sortBy
193
244
  ? searchBy
194
- ? search(searchBy, false, data, config)
195
- : data
196
- : (_a = (searchBy ? search(searchBy, false, data, config) : data)) === null || _a === void 0 ? void 0 : _a.sort((a, b) => {
245
+ ? search(searchBy, false, table.data, table.config)
246
+ : table.data
247
+ : (_a = (searchBy
248
+ ? search(searchBy, false, table.data, table.config)
249
+ : table.data)) === null || _a === void 0 ? void 0 : _a.sort((a, b) => {
197
250
  // TODO: improve logic
198
251
  const typed = sortBy;
199
252
  return a[typed.sortBy] > b[typed.sortBy]
@@ -207,11 +260,18 @@ class CoreComponent {
207
260
  : 0;
208
261
  });
209
262
  }), shareReplay(1));
210
- this.table$ = combineLatest([this.data$, this.tableConfig$]).pipe(map(([sorted, config]) => {
263
+ this.table$ = combineLatest([
264
+ this.data$,
265
+ this.tableConfig$,
266
+ ]).pipe(map(([sorted, config]) => {
211
267
  // if pagination is disabled...
212
268
  if (!config.pagination || config.pagination.length === 0) {
213
269
  // ...return unaltered array
214
- return { data: [sorted], config, info: { records: sorted.length, pageTotal: 1 } };
270
+ return {
271
+ data: [sorted],
272
+ config,
273
+ info: { records: sorted.length, pageTotal: 1 },
274
+ };
215
275
  }
216
276
  // return record set
217
277
  return {
@@ -227,7 +287,8 @@ class CoreComponent {
227
287
  this.currentPage$ = combineLatest([this._currentPage$, this.table$]).pipe(map(([page, table]) => {
228
288
  var _a, _b;
229
289
  // determine last page
230
- const lastPage = Math.ceil(table.info.records / (((_b = (_a = table.config) === null || _a === void 0 ? void 0 : _a.pagination) === null || _b === void 0 ? void 0 : _b.length) || table.info.records)) - 1;
290
+ const lastPage = Math.ceil(table.info.records /
291
+ (((_b = (_a = table.config) === null || _a === void 0 ? void 0 : _a.pagination) === null || _b === void 0 ? void 0 : _b.length) || table.info.records)) - 1;
231
292
  // determine max/min position
232
293
  return +page < 0 ? 0 : +page > lastPage ? lastPage : +page;
233
294
  }), shareReplay(1));
@@ -238,27 +299,48 @@ class CoreComponent {
238
299
  return (a.value.order || 0) - (b.value.order || 0);
239
300
  };
240
301
  }
241
- set loading(value) {
242
- this._loading$.next(value);
302
+ set loading(isLoading) {
303
+ this._loading$.next(isLoading);
243
304
  }
244
- set page(value) {
245
- this._currentPage$.next(value);
305
+ set page(page) {
306
+ this._currentPage$.next(page);
246
307
  }
247
- set search(value) {
248
- this._searchBy$.next(value);
308
+ set search(string) {
309
+ this._searchBy$.next(string);
249
310
  }
250
- set config(value) {
251
- this._tableConfig$.next(value);
311
+ set config(config) {
312
+ this._tableConfig$.next(config);
252
313
  }
253
- set data(value) {
254
- this._data$.next(value);
314
+ set data(data) {
315
+ this._data$.next(data);
316
+ }
317
+ _rowClick(row, index, event) {
318
+ this.rowClick.emit({ row, index, event });
319
+ }
320
+ hoverRow(arg) {
321
+ if (typeof arg === 'number') {
322
+ this.data$
323
+ .pipe(map((data) => data[arg]), take(1))
324
+ .subscribe((row) => this._hoverRow(row, arg));
325
+ }
326
+ else if (typeof arg === 'string') {
327
+ // TODO: implement hover by id
328
+ }
329
+ else {
330
+ this._hoverRow(null, null);
331
+ }
332
+ }
333
+ _hoverRow(row, index, event) {
334
+ this._rowHover$.next({ row, index, event });
255
335
  }
256
336
  get loading$() {
257
337
  return this._loading$.pipe(startWith(false), map((value) => (isObservable(value) ? value : of(value))), switchMap((obs) => obs), shareReplay(1));
258
338
  }
259
339
  sort(property) {
260
340
  var _a, _b;
261
- const newSortOrder = ((_a = this._sortBy) === null || _a === void 0 ? void 0 : _a.sortBy) !== property || ((_b = this._sortBy) === null || _b === void 0 ? void 0 : _b.sortByOrder) === Order.DESC || !this._sortBy.sortByOrder
341
+ const newSortOrder = ((_a = this._sortBy) === null || _a === void 0 ? void 0 : _a.sortBy) !== property ||
342
+ ((_b = this._sortBy) === null || _b === void 0 ? void 0 : _b.sortByOrder) === Order.DESC ||
343
+ !this._sortBy.sortByOrder
262
344
  ? Order.ASC
263
345
  : Order.DESC;
264
346
  const newSortBy = {
@@ -268,12 +350,17 @@ class CoreComponent {
268
350
  this.sortBy$.next(newSortBy);
269
351
  this._sortBy = newSortBy;
270
352
  }
353
+ nestedValue(object, mapTo, missingValue = null) {
354
+ const levels = mapTo.split('.');
355
+ return levels.reduce((previousValue, currentValue, index) => previousValue[currentValue] ||
356
+ (index === levels.length - 1 ? missingValue : {}), object);
357
+ }
271
358
  }
272
- CoreComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: CoreComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
273
- CoreComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: CoreComponent, selector: "angular-generic-table", inputs: { loading: "loading", page: "page", search: "search", config: "config", data: "data" }, ngImport: i0, template: "<table [ngClass]=\"(tableConfig$ | async)?.class || 'table'\" [class.table-mobile]=\"(tableConfig$ | async)?.mobileLayout\">\n <thead>\n <tr *ngIf=\"{\n config:(tableConfig$ | async)!,\n loading: loading$ | async\n } as table\">\n <ng-container *ngFor=\"let column of table?.config?.columns | keyvalue: columnOrder\">\n <th\n *ngIf=\"!column.value?.hidden\"\n ngClass=\"{{ column.value?.sortable ? 'sort ' : '' }} {{ sortBy$ | async | sortClass: column.key }} {{\n (column.key | dashCase) + '-column'\n }} {{column.value.class}}\"\n [class.disabled]=\"table.loading\"\n (click)=\"table.loading || !column.value?.sortable || sort(column.key)\"\n >\n <span *ngIf=\"column.value?.header !== false\">{{ column.value?.header || column.key | capitalCase }}</span>\n </th>\n </ng-container>\n <ng-container *ngIf=\"((table?.config?.rows | keyvalue: columnOrder)||[])[0] as headerRow\">\n <th class=\"row-header\"\n ngClass=\"{{ headerRow.value?.sortable ? 'sort ' : '' }} {{ sortBy$ | async | sortClass: headerRow.key }} {{\n (headerRow.key | dashCase) + '-column'\n }}\"\n (click)=\"table.loading || !headerRow.value?.sortable || sort(headerRow.key)\">\n <ng-container *ngIf=\"headerRow?.value?.header !== false\">{{headerRow?.value?.header || headerRow.key | capitalCase }}</ng-container>\n </th>\n <th *ngFor=\"let column of ((table$ | async)?.data || [])[0]\" ngClass=\"{{headerRow.value?.class}}\">\n <ng-container [ngTemplateOutlet]=\"(table.config?.rows || {})[headerRow.key].templateRef ? templateRef : (table.config?.rows || {})[headerRow.key].transform ? transformData:\n rawData\" [ngTemplateOutletContext]=\"{row: column, column: headerRow, transform: (table.config?.rows || {})[headerRow.key].transform, templateRef: (table.config?.rows || {})[headerRow.key].templateRef, index: 0}\">\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\n *ngIf=\"(table$ | async)! as table\"\n >\n <tbody *ngIf=\"(table!.data![0] || table!.data!).length > 0; else noData\">\n <ng-container *ngIf=\"table.config.columns\">\n <tr *ngFor=\"let row of table!.data![(currentPage$ | async) || 0]; let i = index\" [attr.id]=\"'tableRow_' + i\">\n <ng-container *ngFor=\"let column of table.config?.columns | keyvalue: columnOrder\">\n <td *ngIf=\"!column.value?.hidden\" ngClass=\"{{(column.key | dashCase) + '-column'}} {{column.value?.class}}\">\n <span *ngIf=\"column.value?.mobileHeader && table.config?.mobileLayout\" class=\"mobile-header\">{{ column.value?.mobileHeader !== true ? column.value?.mobileHeader : column.value?.header || column.key | capitalCase }}</span>\n <ng-container [ngTemplateOutlet]=\"(searchBy$ | async) && !(table.config?.columns || {})[column.key].templateRef ? highlighted:\n (table.config?.columns || {})[column.key].templateRef ? templateRef : (table.config?.columns || {})[column.key].transform ? transformData:\n rawData\" [ngTemplateOutletContext]=\"{row: row, column: column, search: (searchBy$ | async), transform: (table.config?.columns || {})[column.key].transform, templateRef: (table.config?.columns || {})[column.key].templateRef, index: i}\"></ng-container></td>\n </ng-container>\n </tr>\n </ng-container>\n <ng-container *ngIf=\"table.config.rows\">\n <ng-container *ngFor=\"let row of table?.config?.rows | keyvalue: columnOrder | slice:1; let i = index\">\n <tr *ngIf=\"!row.value?.hidden\" [attr.id]=\"'tableRow_' + i\" ngClass=\"{{(row.key | dashCase) + '-row'}}\">\n <th class=\"row-header\">\n <span *ngIf=\"row.value.mobileHeader\" class=\"mobile-header\">{{ row.value?.mobileHeader !== true ? row.value?.mobileHeader : row.value?.header || row.key | capitalCase }}</span>\n {{row.value?.header || row.key | capitalCase}}\n </th>\n <td *ngFor=\"let column of (table?.data || [])[0]\" ngClass=\"{{row.value?.class}}\">\n <ng-container [ngTemplateOutlet]=\"(table.config?.rows || {})[row.key].templateRef ? templateRef : (table.config?.rows || {})[row.key].transform ? transformData:\n rawData\" [ngTemplateOutletContext]=\"{row: column, column: row, transform: (table.config?.rows || {})[row.key].transform, templateRef: (table.config?.rows || {})[row.key].templateRef, index: i}\">\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 #transformData let-row=\"row\" let-column=\"column\" let-transform=\"transform\">\n {{row[column.key] | dynamicPipe:transform.pipe:transform?.args}}\n</ng-template>\n<ng-template #templateRef let-row=\"row\" let-column=\"column\" let-index=\"index\" let-templateRef=\"templateRef\">\n <ng-container [ngTemplateOutlet]=\"templateRef\" [ngTemplateOutletContext]=\"{row: row, col: column, index: index}\"></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, "sortClass": SortClassPipe, "dashCase": DashCasePipe, "capitalCase": CapitalCasePipe, "slice": i1.SlicePipe, "highlight": HighlightPipe, "dynamicPipe": DynamicPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
274
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: CoreComponent, decorators: [{
359
+ CoreComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CoreComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
360
+ 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 });
361
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CoreComponent, decorators: [{
275
362
  type: Component,
276
- args: [{ selector: 'angular-generic-table', styles: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<table [ngClass]=\"(tableConfig$ | async)?.class || 'table'\" [class.table-mobile]=\"(tableConfig$ | async)?.mobileLayout\">\n <thead>\n <tr *ngIf=\"{\n config:(tableConfig$ | async)!,\n loading: loading$ | async\n } as table\">\n <ng-container *ngFor=\"let column of table?.config?.columns | keyvalue: columnOrder\">\n <th\n *ngIf=\"!column.value?.hidden\"\n ngClass=\"{{ column.value?.sortable ? 'sort ' : '' }} {{ sortBy$ | async | sortClass: column.key }} {{\n (column.key | dashCase) + '-column'\n }} {{column.value.class}}\"\n [class.disabled]=\"table.loading\"\n (click)=\"table.loading || !column.value?.sortable || sort(column.key)\"\n >\n <span *ngIf=\"column.value?.header !== false\">{{ column.value?.header || column.key | capitalCase }}</span>\n </th>\n </ng-container>\n <ng-container *ngIf=\"((table?.config?.rows | keyvalue: columnOrder)||[])[0] as headerRow\">\n <th class=\"row-header\"\n ngClass=\"{{ headerRow.value?.sortable ? 'sort ' : '' }} {{ sortBy$ | async | sortClass: headerRow.key }} {{\n (headerRow.key | dashCase) + '-column'\n }}\"\n (click)=\"table.loading || !headerRow.value?.sortable || sort(headerRow.key)\">\n <ng-container *ngIf=\"headerRow?.value?.header !== false\">{{headerRow?.value?.header || headerRow.key | capitalCase }}</ng-container>\n </th>\n <th *ngFor=\"let column of ((table$ | async)?.data || [])[0]\" ngClass=\"{{headerRow.value?.class}}\">\n <ng-container [ngTemplateOutlet]=\"(table.config?.rows || {})[headerRow.key].templateRef ? templateRef : (table.config?.rows || {})[headerRow.key].transform ? transformData:\n rawData\" [ngTemplateOutletContext]=\"{row: column, column: headerRow, transform: (table.config?.rows || {})[headerRow.key].transform, templateRef: (table.config?.rows || {})[headerRow.key].templateRef, index: 0}\">\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\n *ngIf=\"(table$ | async)! as table\"\n >\n <tbody *ngIf=\"(table!.data![0] || table!.data!).length > 0; else noData\">\n <ng-container *ngIf=\"table.config.columns\">\n <tr *ngFor=\"let row of table!.data![(currentPage$ | async) || 0]; let i = index\" [attr.id]=\"'tableRow_' + i\">\n <ng-container *ngFor=\"let column of table.config?.columns | keyvalue: columnOrder\">\n <td *ngIf=\"!column.value?.hidden\" ngClass=\"{{(column.key | dashCase) + '-column'}} {{column.value?.class}}\">\n <span *ngIf=\"column.value?.mobileHeader && table.config?.mobileLayout\" class=\"mobile-header\">{{ column.value?.mobileHeader !== true ? column.value?.mobileHeader : column.value?.header || column.key | capitalCase }}</span>\n <ng-container [ngTemplateOutlet]=\"(searchBy$ | async) && !(table.config?.columns || {})[column.key].templateRef ? highlighted:\n (table.config?.columns || {})[column.key].templateRef ? templateRef : (table.config?.columns || {})[column.key].transform ? transformData:\n rawData\" [ngTemplateOutletContext]=\"{row: row, column: column, search: (searchBy$ | async), transform: (table.config?.columns || {})[column.key].transform, templateRef: (table.config?.columns || {})[column.key].templateRef, index: i}\"></ng-container></td>\n </ng-container>\n </tr>\n </ng-container>\n <ng-container *ngIf=\"table.config.rows\">\n <ng-container *ngFor=\"let row of table?.config?.rows | keyvalue: columnOrder | slice:1; let i = index\">\n <tr *ngIf=\"!row.value?.hidden\" [attr.id]=\"'tableRow_' + i\" ngClass=\"{{(row.key | dashCase) + '-row'}}\">\n <th class=\"row-header\">\n <span *ngIf=\"row.value.mobileHeader\" class=\"mobile-header\">{{ row.value?.mobileHeader !== true ? row.value?.mobileHeader : row.value?.header || row.key | capitalCase }}</span>\n {{row.value?.header || row.key | capitalCase}}\n </th>\n <td *ngFor=\"let column of (table?.data || [])[0]\" ngClass=\"{{row.value?.class}}\">\n <ng-container [ngTemplateOutlet]=\"(table.config?.rows || {})[row.key].templateRef ? templateRef : (table.config?.rows || {})[row.key].transform ? transformData:\n rawData\" [ngTemplateOutletContext]=\"{row: column, column: row, transform: (table.config?.rows || {})[row.key].transform, templateRef: (table.config?.rows || {})[row.key].templateRef, index: i}\">\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 #transformData let-row=\"row\" let-column=\"column\" let-transform=\"transform\">\n {{row[column.key] | dynamicPipe:transform.pipe:transform?.args}}\n</ng-template>\n<ng-template #templateRef let-row=\"row\" let-column=\"column\" let-index=\"index\" let-templateRef=\"templateRef\">\n <ng-container [ngTemplateOutlet]=\"templateRef\" [ngTemplateOutletContext]=\"{row: row, col: column, index: index}\"></ng-container>\n</ng-template>\n" }]
363
+ 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" }]
277
364
  }], propDecorators: { loading: [{
278
365
  type: Input
279
366
  }], page: [{
@@ -284,27 +371,176 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImpor
284
371
  type: Input
285
372
  }], data: [{
286
373
  type: Input
374
+ }], rowClick: [{
375
+ type: Output
376
+ }], rowHover: [{
377
+ type: Output
378
+ }] } });
379
+
380
+ class GtDeltaComponent {
381
+ constructor() {
382
+ this.Math = Math;
383
+ this.Number = Number;
384
+ this.data = [];
385
+ this.index = 0;
386
+ this.classes = {
387
+ span: 'gt-delta',
388
+ positive: 'text-success',
389
+ negative: 'text-danger',
390
+ };
391
+ this.key = 'value';
392
+ this.notApplicableValue = 'n/a';
393
+ this.initialValue = '-';
394
+ }
395
+ }
396
+ GtDeltaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GtDeltaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
397
+ 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
398
+ *ngIf="{
399
+ value:
400
+ index === 0
401
+ ? initialValue
402
+ : ((baseIndex === undefined
403
+ ? data[index - 1][key]
404
+ : data[baseIndex][key]) -
405
+ data[index][key]) /
406
+ -Math.abs(
407
+ baseIndex === undefined
408
+ ? data[index - 1][key]
409
+ : data[baseIndex][key]
410
+ )
411
+ } as delta"
412
+ [class]="[
413
+ classes.span,
414
+ !delta.value || !Number.isFinite(delta.value)
415
+ ? null
416
+ : delta.value > 0
417
+ ? classes.positive
418
+ : classes.negative
419
+ ]"
420
+ [class.gt-delta-positive]="delta.value > 0 && Number.isFinite(delta.value)"
421
+ [class.gt-delta-negative]="delta.value < 0"
422
+ >{{
423
+ Number.isFinite(delta.value)
424
+ ? (delta.value | percent)
425
+ : delta.value === initialValue
426
+ ? initialValue
427
+ : notApplicableValue
428
+ }}</span
429
+ >`, 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 });
430
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GtDeltaComponent, decorators: [{
431
+ type: Component,
432
+ args: [{ selector: 'gt-delta', template: `<span
433
+ *ngIf="{
434
+ value:
435
+ index === 0
436
+ ? initialValue
437
+ : ((baseIndex === undefined
438
+ ? data[index - 1][key]
439
+ : data[baseIndex][key]) -
440
+ data[index][key]) /
441
+ -Math.abs(
442
+ baseIndex === undefined
443
+ ? data[index - 1][key]
444
+ : data[baseIndex][key]
445
+ )
446
+ } as delta"
447
+ [class]="[
448
+ classes.span,
449
+ !delta.value || !Number.isFinite(delta.value)
450
+ ? null
451
+ : delta.value > 0
452
+ ? classes.positive
453
+ : classes.negative
454
+ ]"
455
+ [class.gt-delta-positive]="delta.value > 0 && Number.isFinite(delta.value)"
456
+ [class.gt-delta-negative]="delta.value < 0"
457
+ >{{
458
+ Number.isFinite(delta.value)
459
+ ? (delta.value | percent)
460
+ : delta.value === initialValue
461
+ ? initialValue
462
+ : notApplicableValue
463
+ }}</span
464
+ >`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block}\n"] }]
465
+ }], ctorParameters: function () { return []; }, propDecorators: { data: [{
466
+ type: Input
467
+ }], index: [{
468
+ type: Input
469
+ }], baseIndex: [{
470
+ type: Input
471
+ }], classes: [{
472
+ type: Input
473
+ }], key: [{
474
+ type: Input
475
+ }], notApplicableValue: [{
476
+ type: Input
477
+ }], initialValue: [{
478
+ type: Input
287
479
  }] } });
288
480
 
289
481
  class GenericTableCoreModule {
290
482
  }
291
- GenericTableCoreModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: GenericTableCoreModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
292
- GenericTableCoreModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: GenericTableCoreModule, declarations: [CoreComponent, SortClassPipe, DashCasePipe, HighlightPipe, CapitalCasePipe, CapitalCasePipe, DynamicPipe], imports: [CommonModule], exports: [CoreComponent] });
293
- GenericTableCoreModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: GenericTableCoreModule, imports: [[CommonModule]] });
294
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: GenericTableCoreModule, decorators: [{
483
+ GenericTableCoreModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GenericTableCoreModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
484
+ GenericTableCoreModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: GenericTableCoreModule, declarations: [CoreComponent,
485
+ SortClassPipe,
486
+ DashCasePipe,
487
+ HighlightPipe,
488
+ CapitalCasePipe,
489
+ CapitalCasePipe,
490
+ DynamicPipe,
491
+ GtDeltaComponent], imports: [CommonModule], exports: [CoreComponent, GtDeltaComponent] });
492
+ GenericTableCoreModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GenericTableCoreModule, imports: [CommonModule] });
493
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GenericTableCoreModule, decorators: [{
295
494
  type: NgModule,
296
495
  args: [{
297
- declarations: [CoreComponent, SortClassPipe, DashCasePipe, HighlightPipe, CapitalCasePipe, CapitalCasePipe, DynamicPipe],
496
+ declarations: [
497
+ CoreComponent,
498
+ SortClassPipe,
499
+ DashCasePipe,
500
+ HighlightPipe,
501
+ CapitalCasePipe,
502
+ CapitalCasePipe,
503
+ DynamicPipe,
504
+ GtDeltaComponent,
505
+ ],
298
506
  imports: [CommonModule],
299
- exports: [CoreComponent],
507
+ exports: [CoreComponent, GtDeltaComponent],
300
508
  }]
301
509
  }] });
302
510
 
303
511
  class PaginationComponent {
304
512
  constructor() {
305
513
  this.table$ = new ReplaySubject(1);
514
+ this._ariaLabels = {
515
+ nav: 'Table pagination',
516
+ button: 'Go to page ',
517
+ };
518
+ this._classes = {
519
+ ul: 'pagination',
520
+ li: 'page-item',
521
+ button: 'page-link',
522
+ };
523
+ this._paginationLength = 5;
306
524
  this.pagination$ = this.table$.pipe(switchMap((core) => combineLatest([core === null || core === void 0 ? void 0 : core.table$.pipe(pluck('info')), core === null || core === void 0 ? void 0 : core.currentPage$])), map(([info, currentPage]) => this.generateList(info.pageTotal, currentPage)));
307
525
  }
526
+ get paginationLength() {
527
+ return this._paginationLength;
528
+ }
529
+ set paginationLength(value) {
530
+ this._paginationLength = +value;
531
+ }
532
+ get classes() {
533
+ return this._classes;
534
+ }
535
+ set classes(value) {
536
+ this._classes = value;
537
+ }
538
+ get ariaLabels() {
539
+ return this._ariaLabels;
540
+ }
541
+ set ariaLabels(value) {
542
+ this._ariaLabels = value;
543
+ }
308
544
  get table() {
309
545
  return this._table;
310
546
  }
@@ -313,14 +549,13 @@ class PaginationComponent {
313
549
  this.table$.next(value);
314
550
  }
315
551
  generateList(pages, currentPosition) {
316
- const paginationLength = 5;
317
- const middle = Math.floor(paginationLength / 2);
318
- const length = pages < paginationLength ? pages : paginationLength;
552
+ const middle = Math.floor(this.paginationLength / 2);
553
+ const length = pages < this.paginationLength ? pages : this.paginationLength;
319
554
  return Array.from({ length }, (_, i) => {
320
555
  if (i === 0) {
321
556
  return 1;
322
557
  }
323
- else if (pages < paginationLength) {
558
+ else if (pages < this.paginationLength) {
324
559
  return i + 1;
325
560
  }
326
561
  else if (i + 1 === length) {
@@ -329,10 +564,12 @@ class PaginationComponent {
329
564
  else if (currentPosition > middle && currentPosition < pages - middle) {
330
565
  return i + currentPosition - (middle - 1);
331
566
  }
332
- else if (currentPosition > middle && currentPosition < pages - (middle - 1)) {
567
+ else if (currentPosition > middle &&
568
+ currentPosition < pages - (middle - 1)) {
333
569
  return i + currentPosition - middle;
334
570
  }
335
- else if (currentPosition > middle && currentPosition === pages - (middle - 1)) {
571
+ else if (currentPosition > middle &&
572
+ currentPosition === pages - (middle - 1)) {
336
573
  return i + currentPosition - (middle + 1);
337
574
  }
338
575
  else if (currentPosition > middle && currentPosition === pages - 1) {
@@ -349,21 +586,27 @@ class PaginationComponent {
349
586
  }
350
587
  }
351
588
  }
352
- PaginationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
353
- PaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: PaginationComponent, selector: "angular-generic-table-pagination", inputs: { table: "table" }, ngImport: i0, template: "<ng-container *ngIf=\"{\n links: pagination$ | async,\n currentPosition: table?.currentPage$ | async\n } as pagination\">\n <nav *ngIf=\"pagination.links && pagination.links.length > 1\" role=\"navigation\" aria-label=\"Table Pagination Navigation\" class=\"gt-pagination\">\n <ul>\n <li *ngFor=\"let position of pagination!.links; let i = index; let last = last\"\n [class.ellipsis]=\"position + 1 !== pagination!.links![i+1] && !last\"\n [class.active]=\"position === (pagination!.currentPosition || 0) + 1\"\n >\n <button class=\"btn btn-link\" [attr.aria-label]=\"'Goto Page ' + position\" (click)=\"goto(position)\">{{position}}</button>\n </li>\n </ul>\n</nav>\n</ng-container>\n", directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "async": i1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
354
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: PaginationComponent, decorators: [{
589
+ PaginationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
590
+ 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 });
591
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: PaginationComponent, decorators: [{
355
592
  type: Component,
356
- args: [{ selector: 'angular-generic-table-pagination', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"{\n links: pagination$ | async,\n currentPosition: table?.currentPage$ | async\n } as pagination\">\n <nav *ngIf=\"pagination.links && pagination.links.length > 1\" role=\"navigation\" aria-label=\"Table Pagination Navigation\" class=\"gt-pagination\">\n <ul>\n <li *ngFor=\"let position of pagination!.links; let i = index; let last = last\"\n [class.ellipsis]=\"position + 1 !== pagination!.links![i+1] && !last\"\n [class.active]=\"position === (pagination!.currentPosition || 0) + 1\"\n >\n <button class=\"btn btn-link\" [attr.aria-label]=\"'Goto Page ' + position\" (click)=\"goto(position)\">{{position}}</button>\n </li>\n </ul>\n</nav>\n</ng-container>\n" }]
357
- }], propDecorators: { table: [{
593
+ 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" }]
594
+ }], propDecorators: { paginationLength: [{
595
+ type: Input
596
+ }], classes: [{
597
+ type: Input
598
+ }], ariaLabels: [{
599
+ type: Input
600
+ }], table: [{
358
601
  type: Input
359
602
  }] } });
360
603
 
361
604
  class GenericTablePaginationModule {
362
605
  }
363
- GenericTablePaginationModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: GenericTablePaginationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
364
- GenericTablePaginationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: GenericTablePaginationModule, declarations: [PaginationComponent], imports: [CommonModule], exports: [PaginationComponent] });
365
- GenericTablePaginationModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: GenericTablePaginationModule, imports: [[CommonModule]] });
366
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: GenericTablePaginationModule, decorators: [{
606
+ GenericTablePaginationModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GenericTablePaginationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
607
+ GenericTablePaginationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: GenericTablePaginationModule, declarations: [PaginationComponent], imports: [CommonModule], exports: [PaginationComponent] });
608
+ GenericTablePaginationModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GenericTablePaginationModule, imports: [CommonModule] });
609
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: GenericTablePaginationModule, decorators: [{
367
610
  type: NgModule,
368
611
  args: [{
369
612
  declarations: [PaginationComponent],
@@ -380,5 +623,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImpor
380
623
  * Generated bundle index. Do not edit.
381
624
  */
382
625
 
383
- export { CoreComponent, CoreService, GenericTableCoreModule, GenericTablePaginationModule, PaginationComponent };
626
+ export { CoreComponent, CoreService, GenericTableCoreModule, GenericTablePaginationModule, GtDeltaComponent, PaginationComponent };
384
627
  //# sourceMappingURL=angular-generic-table-core.mjs.map