ngx-kit 7.3.1 → 7.3.3
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/fesm2022/ngx-kit-data-table.mjs +39 -33
- package/fesm2022/ngx-kit-data-table.mjs.map +1 -1
- package/fesm2022/ngx-kit-dropzone.mjs +5 -5
- package/fesm2022/ngx-kit-dropzone.mjs.map +1 -1
- package/fesm2022/ngx-kit-image-editor.mjs +14 -26
- package/fesm2022/ngx-kit-image-editor.mjs.map +1 -1
- package/package.json +1 -1
- package/types/ngx-kit-data-table.d.ts +25 -26
- package/types/ngx-kit-dropzone.d.ts +4 -4
- package/types/ngx-kit-image-editor.d.ts +10 -27
|
@@ -33,6 +33,10 @@ function defineFields(_renderers, fields) {
|
|
|
33
33
|
return fields;
|
|
34
34
|
}
|
|
35
35
|
|
|
36
|
+
const NGX_PAGINATION_CONFIG_DEFAULT = {
|
|
37
|
+
defaultPageSize: 10,
|
|
38
|
+
pageSizeOptions: [5, 10, 20, 30, 50, 100],
|
|
39
|
+
};
|
|
36
40
|
const NGX_TABLE_CONFIG_DEFAULT = {
|
|
37
41
|
showRecordNumber: false,
|
|
38
42
|
hoverable: true,
|
|
@@ -41,38 +45,42 @@ const NGX_TABLE_CONFIG_DEFAULT = {
|
|
|
41
45
|
stickyHeader: true,
|
|
42
46
|
stripedRows: true,
|
|
43
47
|
column: { minWidth: 60, maxWidth: 600, defaultWidth: 150 },
|
|
44
|
-
labels: {
|
|
45
|
-
noData: 'There is no data to display!',
|
|
46
|
-
loading: 'Loading...',
|
|
47
|
-
operation: 'Operation',
|
|
48
|
-
},
|
|
49
48
|
renderers: {},
|
|
50
49
|
formatters: {},
|
|
51
50
|
lazy: false,
|
|
52
51
|
};
|
|
53
|
-
|
|
54
|
-
|
|
52
|
+
|
|
53
|
+
class TableLocalization {
|
|
54
|
+
noData = 'There is no data to display!';
|
|
55
|
+
loading = 'Loading...';
|
|
56
|
+
operation = 'Operation';
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
const NGX_TABLE_CONFIG = new InjectionToken('NGX_TABLE_CONFIG', {
|
|
55
60
|
factory: () => NGX_TABLE_CONFIG_DEFAULT,
|
|
56
61
|
});
|
|
62
|
+
const NGX_TABLE_I18N = new InjectionToken('NGX_TABLE_I18N', {
|
|
63
|
+
factory: () => new TableLocalization(),
|
|
64
|
+
});
|
|
57
65
|
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
},
|
|
72
|
-
};
|
|
73
|
-
const NGX_PAGINATION_CONFIG = new InjectionToken('ngx-pagination-config', {
|
|
66
|
+
class PaginationLocalization {
|
|
67
|
+
first = 'First';
|
|
68
|
+
last = 'Last';
|
|
69
|
+
next = 'Next';
|
|
70
|
+
previous = 'Previous';
|
|
71
|
+
showing = 'Showing';
|
|
72
|
+
to = 'to';
|
|
73
|
+
of = 'of';
|
|
74
|
+
results = 'results';
|
|
75
|
+
pageSize = 'Page Size';
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
const NGX_PAGINATION_CONFIG = new InjectionToken('NGX_PAGINATION_CONFIG', {
|
|
74
79
|
factory: () => NGX_PAGINATION_CONFIG_DEFAULT,
|
|
75
80
|
});
|
|
81
|
+
const NGX_PAGINATION_I18N = new InjectionToken('NGX_PAGINATION_I18N', {
|
|
82
|
+
factory: () => new PaginationLocalization(),
|
|
83
|
+
});
|
|
76
84
|
|
|
77
85
|
function mergeTableConfig(base, override) {
|
|
78
86
|
if (!override)
|
|
@@ -81,7 +89,6 @@ function mergeTableConfig(base, override) {
|
|
|
81
89
|
...base,
|
|
82
90
|
...override,
|
|
83
91
|
column: { ...base.column, ...override.column },
|
|
84
|
-
labels: { ...base.labels, ...override.labels },
|
|
85
92
|
renderers: { ...base.renderers, ...override.renderers },
|
|
86
93
|
formatters: { ...base.formatters, ...override.formatters },
|
|
87
94
|
};
|
|
@@ -108,7 +115,6 @@ function mergePaginationConfig(base, override) {
|
|
|
108
115
|
return {
|
|
109
116
|
...base,
|
|
110
117
|
...override,
|
|
111
|
-
labels: { ...base.labels, ...override.labels },
|
|
112
118
|
};
|
|
113
119
|
}
|
|
114
120
|
function providePagination(options) {
|
|
@@ -234,6 +240,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImpor
|
|
|
234
240
|
|
|
235
241
|
class NgxPagination {
|
|
236
242
|
config = inject(NGX_PAGINATION_CONFIG);
|
|
243
|
+
lables = inject(NGX_PAGINATION_I18N);
|
|
237
244
|
total = input.required(/* @ts-ignore */
|
|
238
245
|
...(ngDevMode ? [{ debugName: "total" }] : /* istanbul ignore next */ []));
|
|
239
246
|
page = model(1, /* @ts-ignore */
|
|
@@ -242,8 +249,6 @@ class NgxPagination {
|
|
|
242
249
|
...(ngDevMode ? [{ debugName: "pageSize" }] : /* istanbul ignore next */ []));
|
|
243
250
|
pageSizeOptions = input(this.config.pageSizeOptions, /* @ts-ignore */
|
|
244
251
|
...(ngDevMode ? [{ debugName: "pageSizeOptions" }] : /* istanbul ignore next */ []));
|
|
245
|
-
labels = input(this.config.labels, /* @ts-ignore */
|
|
246
|
-
...(ngDevMode ? [{ debugName: "labels" }] : /* istanbul ignore next */ []));
|
|
247
252
|
siblingCount = input(1, /* @ts-ignore */
|
|
248
253
|
...(ngDevMode ? [{ debugName: "siblingCount" }] : /* istanbul ignore next */ []));
|
|
249
254
|
boundaryCount = input(1, /* @ts-ignore */
|
|
@@ -314,12 +319,12 @@ class NgxPagination {
|
|
|
314
319
|
this.page.set(1);
|
|
315
320
|
}
|
|
316
321
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: NgxPagination, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
317
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: NgxPagination, isStandalone: true, selector: "ngx-pagination", inputs: { total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: true, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null },
|
|
322
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: NgxPagination, isStandalone: true, selector: "ngx-pagination", inputs: { total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: true, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, siblingCount: { classPropertyName: "siblingCount", publicName: "siblingCount", isSignal: true, isRequired: false, transformFunction: null }, boundaryCount: { classPropertyName: "boundaryCount", publicName: "boundaryCount", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { page: "pageChange", pageSize: "pageSizeChange", paginate: "paginate" }, ngImport: i0, template: "<nav class=\"ngx-pagination\">\n <div class=\"ngx-pagination__summary\">\n {{ lables.showing }}\n <span class=\"fw-semibold\">{{ firstItem() }}</span>\n {{ lables.to }}\n <span class=\"fw-semibold\">{{ lastItem() }}</span>\n {{ lables.of }}\n <span class=\"fw-semibold\">{{ total() }}</span>\n {{ lables.results }}\n </div>\n\n <div class=\"ngx-pagination__controls\">\n <ul class=\"ngx-pagination__list\">\n <li [class.disabled]=\"page() === 1\" [title]=\"lables.first\">\n <a (click)=\"first()\" class=\"icon\">\u00AB</a>\n </li>\n <li [class.disabled]=\"page() === 1\" [title]=\"lables.previous\">\n <a (click)=\"previous()\" class=\"icon\">\u2039</a>\n </li>\n\n @for (item of pages(); track $index) {\n <li class=\"ngx-pagination__page-num\" [class.active]=\"item === page()\">\n @if (item !== page() && item !== '...') {\n <a (click)=\"goto(+item)\">{{ item }}</a>\n }\n @if (item === page() || item === '...') {\n <span>{{ item }}</span>\n }\n </li>\n }\n\n <li [class.disabled]=\"page() === totalPages()\" [title]=\"lables.next\">\n <a (click)=\"next()\" class=\"icon\">\u203A</a>\n </li>\n <li [class.disabled]=\"page() === totalPages()\" [title]=\"lables.last\">\n <a (click)=\"last()\" class=\"icon\">\u00BB</a>\n </li>\n </ul>\n\n <div class=\"ngx-pagination__page-size\">\n <span>{{ lables.pageSize }}:</span>\n <select [ngModel]=\"pageSize()\" (ngModelChange)=\"onPageSizeChange($event)\">\n @for (opt of pageSizeOptions(); track opt) {\n <option [value]=\"opt\" [selected]=\"opt === pageSize()\">{{ opt }}</option>\n }\n </select>\n </div>\n </div>\n</nav>\n", styles: [".ngx-pagination{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem;padding:.625rem 1rem;font-size:.8125rem}.ngx-pagination__controls{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.ngx-pagination__list{display:flex;align-items:center;gap:.25rem;list-style:none;margin:0;padding:0}.ngx-pagination__list li{min-width:1.75rem;height:1.75rem;display:inline-flex;align-items:center;justify-content:center;border-radius:6px}.ngx-pagination__list li a,.ngx-pagination__list li span{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;cursor:pointer;border-radius:6px;-webkit-user-select:none;user-select:none}.ngx-pagination__list li a.icon,.ngx-pagination__list li span.icon{font-size:20px;font-family:Courier New,Courier,monospace}.ngx-pagination__list li.active a,.ngx-pagination__list li.active span{background:var(--ngx-table-accent, #4f46e5);color:#fff;cursor:default}.ngx-pagination__list li.disabled{opacity:.4;pointer-events:none}.ngx-pagination__list li:hover:not(.active):not(.disabled) a{background:color-mix(in srgb,var(--ngx-table-accent, #4f46e5) 12%,transparent)}.ngx-pagination__page-size{display:flex;align-items:center;gap:.5rem}.ngx-pagination__page-size select{border-radius:6px;padding:.25rem .5rem;font-size:.8125rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple]):not([ngNoCva])[formControlName],select:not([multiple]):not([ngNoCva])[formControl],select:not([multiple]):not([ngNoCva])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
318
323
|
}
|
|
319
324
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: NgxPagination, decorators: [{
|
|
320
325
|
type: Component,
|
|
321
|
-
args: [{ selector: 'ngx-pagination', standalone: true, imports: [FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav class=\"ngx-pagination\">\n <div class=\"ngx-pagination__summary\">\n {{
|
|
322
|
-
}], ctorParameters: () => [], propDecorators: { total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: true }] }], page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: false }] }, { type: i0.Output, args: ["pageChange"] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }, { type: i0.Output, args: ["pageSizeChange"] }], pageSizeOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSizeOptions", required: false }] }],
|
|
326
|
+
args: [{ selector: 'ngx-pagination', standalone: true, imports: [FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav class=\"ngx-pagination\">\n <div class=\"ngx-pagination__summary\">\n {{ lables.showing }}\n <span class=\"fw-semibold\">{{ firstItem() }}</span>\n {{ lables.to }}\n <span class=\"fw-semibold\">{{ lastItem() }}</span>\n {{ lables.of }}\n <span class=\"fw-semibold\">{{ total() }}</span>\n {{ lables.results }}\n </div>\n\n <div class=\"ngx-pagination__controls\">\n <ul class=\"ngx-pagination__list\">\n <li [class.disabled]=\"page() === 1\" [title]=\"lables.first\">\n <a (click)=\"first()\" class=\"icon\">\u00AB</a>\n </li>\n <li [class.disabled]=\"page() === 1\" [title]=\"lables.previous\">\n <a (click)=\"previous()\" class=\"icon\">\u2039</a>\n </li>\n\n @for (item of pages(); track $index) {\n <li class=\"ngx-pagination__page-num\" [class.active]=\"item === page()\">\n @if (item !== page() && item !== '...') {\n <a (click)=\"goto(+item)\">{{ item }}</a>\n }\n @if (item === page() || item === '...') {\n <span>{{ item }}</span>\n }\n </li>\n }\n\n <li [class.disabled]=\"page() === totalPages()\" [title]=\"lables.next\">\n <a (click)=\"next()\" class=\"icon\">\u203A</a>\n </li>\n <li [class.disabled]=\"page() === totalPages()\" [title]=\"lables.last\">\n <a (click)=\"last()\" class=\"icon\">\u00BB</a>\n </li>\n </ul>\n\n <div class=\"ngx-pagination__page-size\">\n <span>{{ lables.pageSize }}:</span>\n <select [ngModel]=\"pageSize()\" (ngModelChange)=\"onPageSizeChange($event)\">\n @for (opt of pageSizeOptions(); track opt) {\n <option [value]=\"opt\" [selected]=\"opt === pageSize()\">{{ opt }}</option>\n }\n </select>\n </div>\n </div>\n</nav>\n", styles: [".ngx-pagination{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem;padding:.625rem 1rem;font-size:.8125rem}.ngx-pagination__controls{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.ngx-pagination__list{display:flex;align-items:center;gap:.25rem;list-style:none;margin:0;padding:0}.ngx-pagination__list li{min-width:1.75rem;height:1.75rem;display:inline-flex;align-items:center;justify-content:center;border-radius:6px}.ngx-pagination__list li a,.ngx-pagination__list li span{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;cursor:pointer;border-radius:6px;-webkit-user-select:none;user-select:none}.ngx-pagination__list li a.icon,.ngx-pagination__list li span.icon{font-size:20px;font-family:Courier New,Courier,monospace}.ngx-pagination__list li.active a,.ngx-pagination__list li.active span{background:var(--ngx-table-accent, #4f46e5);color:#fff;cursor:default}.ngx-pagination__list li.disabled{opacity:.4;pointer-events:none}.ngx-pagination__list li:hover:not(.active):not(.disabled) a{background:color-mix(in srgb,var(--ngx-table-accent, #4f46e5) 12%,transparent)}.ngx-pagination__page-size{display:flex;align-items:center;gap:.5rem}.ngx-pagination__page-size select{border-radius:6px;padding:.25rem .5rem;font-size:.8125rem}\n"] }]
|
|
327
|
+
}], ctorParameters: () => [], propDecorators: { total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: true }] }], page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: false }] }, { type: i0.Output, args: ["pageChange"] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }, { type: i0.Output, args: ["pageSizeChange"] }], pageSizeOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSizeOptions", required: false }] }], siblingCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "siblingCount", required: false }] }], boundaryCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "boundaryCount", required: false }] }], paginate: [{ type: i0.Output, args: ["paginate"] }] } });
|
|
323
328
|
|
|
324
329
|
/**
|
|
325
330
|
* جدول دادهی جنریک و Type-Safe.
|
|
@@ -337,6 +342,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImpor
|
|
|
337
342
|
*/
|
|
338
343
|
class NgxTable {
|
|
339
344
|
config = inject(NGX_TABLE_CONFIG);
|
|
345
|
+
labels = inject(NGX_TABLE_I18N);
|
|
340
346
|
paginationConfig = inject(NGX_PAGINATION_CONFIG);
|
|
341
347
|
// ---------------------------------------------------------------- inputs
|
|
342
348
|
fields = input.required(/* @ts-ignore */
|
|
@@ -646,13 +652,13 @@ class NgxTable {
|
|
|
646
652
|
return inputs;
|
|
647
653
|
}
|
|
648
654
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: NgxTable, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
649
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: NgxTable, isStandalone: true, selector: "ngx-table", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: true, isRequired: true, transformFunction: null }, showRecordNumber: { classPropertyName: "showRecordNumber", publicName: "showRecordNumber", isSignal: true, isRequired: false, transformFunction: null }, operations: { classPropertyName: "operations", publicName: "operations", isSignal: true, isRequired: false, transformFunction: null }, operationWidth: { classPropertyName: "operationWidth", publicName: "operationWidth", isSignal: true, isRequired: false, transformFunction: null }, numWidth: { classPropertyName: "numWidth", publicName: "numWidth", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, multiSort: { classPropertyName: "multiSort", publicName: "multiSort", isSignal: true, isRequired: false, transformFunction: null }, lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, trackBy: { classPropertyName: "trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pageChange: "pageChange", lazyLoad: "lazyLoad", sortChange: "sortChange", columnResize: "columnResize" }, host: { classAttribute: "ngx-table-host" }, queries: [{ propertyName: "cellTemplates", predicate: TableCell }], ngImport: i0, template: "<div class=\"ngx-table-wrapper\" [class.ngx-table--loading]=\"loading()\">\n <div class=\"ngx-table-scroll\">\n <div\n class=\"ngx-table\"\n [class.ngx-table--striped]=\"config.stripedRows\"\n [class.ngx-table--hover]=\"config.hoverable\"\n role=\"table\">\n <div class=\"thead-mrs\" [class.thead-mrs--sticky]=\"config.stickyHeader\" role=\"rowgroup\">\n <div class=\"tr-mrs\" role=\"row\">\n @if (operations()) {\n <div\n class=\"th-mrs operations\"\n role=\"columnheader\"\n [style.flex]=\"'0 0 ' + operationWidth() + 'px'\">\n {{ config.labels.operation }}\n </div>\n }\n @if (showRecordNumber()) {\n <div\n class=\"th-mrs operations\"\n role=\"columnheader\"\n [style.flex]=\"'0 0 ' + numWidth() + 'px'\">\n #\n </div>\n }\n\n @for (f of fields(); track f.column) {\n <div\n class=\"th-mrs\"\n role=\"columnheader\"\n [class.th-mrs--sortable]=\"f.sortable\"\n [style.flex]=\"columnFlex(f)\"\n [attr.aria-sort]=\"\n sortDirectionFor(f.column) === 'asc'\n ? 'ascending'\n : sortDirectionFor(f.column) === 'desc'\n ? 'descending'\n : null\n \"\n (click)=\"onHeaderClick(f, $event)\">\n <span class=\"th-mrs__title\">{{ f.title }}</span>\n\n @if (f.sortable) {\n <span class=\"sort-icon\" [class.active]=\"sortDirectionFor(f.column) !== null\">\n @if (sortDirectionFor(f.column) === 'asc') {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\n <path\n fill=\"currentColor\"\n d=\"M182.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H96V448c0 17.7 14.3 32 32 32s32-14.3 32-32V224h64c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z\" />\n </svg>\n } @else if (sortDirectionFor(f.column) === 'desc') {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\n <path\n fill=\"currentColor\"\n d=\"M137.4 470.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H224V64c0-17.7-14.3-32-32-32s-32 14.3-32 32V288H96c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\" />\n </svg>\n } @else {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\n <path\n fill=\"currentColor\"\n d=\"M137.4 41.4c12.5-12.5 32.8-12.5 45.3 0l96 96c9.2 9.2 11.9 22.9 6.9 34.9s-16.6 19.8-29.6 19.8H224v96c0 17.7-14.3 32-32 32s-32-14.3-32-32V192H96c-12.9 0-24.6-7.8-29.6-19.8s-2.3-25.7 6.9-34.9l96-96zM32 400c0-17.7 14.3-32 32-32H256c17.7 0 32 14.3 32 32s-14.3 32-32 32H64c-17.7 0-32-14.3-32-32z\"\n opacity=\".35\" />\n </svg>\n }\n </span>\n }\n\n @if (isResizable(f)) {\n <span\n ngxColumnResize\n [ngxColumnResizeWidth]=\"columnWidth(f.column)\"\n [ngxColumnResizeMin]=\"columnMin(f)\"\n [ngxColumnResizeMax]=\"columnMax(f)\"\n [ngxColumnResizeDir]=\"resolvedDirection()\"\n (resizing)=\"onColumnResizing(f.column, $event)\"\n (resizeEnd)=\"onColumnResizeEnd(f.column, $event)\"\n (click)=\"$event.stopPropagation()\"></span>\n }\n </div>\n }\n </div>\n </div>\n\n <div class=\"tbody-mrs\" role=\"rowgroup\">\n @if (!loading() && pagedData().length === 0) {\n <div class=\"no-data\">{{ config.labels.noData }}</div>\n }\n\n @for (row of pagedData(); track trackBy()($index, row); let rowIndex = $index) {\n <div class=\"tr-mrs\" role=\"row\">\n @if (operations()) {\n <div\n class=\"td-mrs operations\"\n role=\"cell\"\n [style.flex]=\"'0 0 ' + operationWidth() + 'px'\">\n <div class=\"cel\">\n <span class=\"cell-title\">{{ config.labels.operation }}:</span>\n <ng-container\n [ngTemplateOutlet]=\"operations()!\"\n [ngTemplateOutletContext]=\"{ $implicit: row }\"></ng-container>\n </div>\n </div>\n }\n\n @if (showRecordNumber()) {\n <div class=\"td-mrs operations\" role=\"cell\" [style.flex]=\"'0 0 ' + numWidth() + 'px'\">\n <div class=\"cel\">{{ recordNumber(rowIndex) }}</div>\n </div>\n }\n\n @for (f of fields(); track f.column) {\n @let template = getTemplate(f.column);\n @let renderer = getRenderer(f);\n\n <div class=\"td-mrs\" role=\"cell\" [style.flex]=\"columnFlex(f)\">\n <div class=\"cel\" [class.wrap]=\"f.wrap\">\n <span class=\"cell-title\">{{ f.title }}</span>\n\n @if (template) {\n <ng-container\n [ngTemplateOutlet]=\"template\"\n [ngTemplateOutletContext]=\"{\n $implicit: row,\n row: row,\n value: getCellValue(row, f),\n rowIndex: rowIndex,\n field: f,\n }\"></ng-container>\n } @else if (renderer) {\n <ng-container\n *ngComponentOutlet=\"\n renderer;\n inputs: getRendererInputs(row, f)\n \"></ng-container>\n } @else {\n {{ formatCellValue(row, f) }}\n }\n\n @if (f.prefix) {\n <span>{{ f.prefix }}</span>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n </div>\n\n @if (loading()) {\n <div class=\"loading-container\">\n <div class=\"loading\">{{ config.labels.loading }}</div>\n </div>\n }\n </div>\n</div>\n\n<ngx-pagination\n [page]=\"page()\"\n [pageSize]=\"pageSizeS()\"\n [total]=\"totalCount()\"\n (paginate)=\"onPaginate($event)\"></ngx-pagination>\n", styles: ["@charset \"UTF-8\";:host{--ngx-table-accent: light-dark(#4f46e5, #818cf8);--ngx-table-border: light-dark(#e5e7eb, #27272a);--ngx-table-header-bg: light-dark(#f8fafc, #1a1a26);--ngx-table-header-fg: light-dark(#334155, #d4d4d8);--ngx-table-row-bg: light-dark(#ffffff, #111118);--ngx-table-row-alt-bg: light-dark(#f9fafb, #17171b);--ngx-table-row-hover-bg: light-dark(#eef2ff, #7dc4fb27);--ngx-table-text: light-dark(#1e293b, #e4e4e7);--ngx-table-radius: 12px;display:block;color:var(--ngx-table-text)}.ngx-table-wrapper{position:relative;border:1px solid var(--ngx-table-border);border-radius:var(--ngx-table-radius);overflow:hidden;background:var(--ngx-table-row-bg)}.ngx-table-scroll{overflow:auto;max-height:75vh}.ngx-table-scroll::-webkit-scrollbar{height:10px;width:10px}.ngx-table-scroll::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--ngx-table-border) 60%,gray);border-radius:8px}.ngx-table{display:flex;flex-direction:column;min-width:100%;width:max-content}.thead-mrs{display:flex;flex-direction:column;z-index:2;background:var(--ngx-table-header-bg);color:var(--ngx-table-header-fg)}.thead-mrs--sticky{position:sticky;top:0}.tr-mrs{display:flex;align-items:stretch}.th-mrs,.td-mrs{position:relative;box-sizing:border-box;overflow:hidden;min-inline-size:0;border-bottom:1px solid var(--ngx-table-border);border-inline-end:1px solid var(--ngx-table-border)}.th-mrs:last-child,.td-mrs:last-child{border-inline-end:none}.th-mrs{display:flex;align-items:center;gap:.375rem;font-weight:600;font-size:.8125rem;letter-spacing:.02em;padding:.75rem 1rem;-webkit-user-select:none;user-select:none;white-space:nowrap;text-overflow:ellipsis}.th-mrs--sortable{cursor:pointer}.th-mrs--sortable:hover{color:var(--ngx-table-accent)}.th-mrs.operations{justify-content:center}.th-mrs__title{overflow:hidden;text-overflow:ellipsis}.sort-icon{width:.75rem;height:.75rem;flex:none;opacity:.4;display:inline-flex}.sort-icon svg{width:100%;height:100%}.sort-icon.active{opacity:1}.ngx-table__resize-handle,[ngxColumnResize]{position:absolute;top:0;bottom:0;inset-inline-end:-3px;width:6px;cursor:col-resize;touch-action:none;z-index:3}.ngx-table__resize-handle:hover,.ngx-table__resize-handle:active,[ngxColumnResize]:hover,[ngxColumnResize]:active{background:var(--ngx-table-accent);opacity:.5}.td-mrs{display:flex;align-items:center;padding:.75rem 1rem;font-size:.875rem}.td-mrs.operations{justify-content:center}.cel{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;gap:.25rem}.cel.wrap{white-space:normal}.cell-title{display:none;font-weight:600;color:var(--ngx-table-header-fg)}.ngx-table--striped .tbody-mrs .tr-mrs:nth-child(2n){background:var(--ngx-table-row-alt-bg)}.ngx-table--hover .tbody-mrs .tr-mrs:hover{background:var(--ngx-table-row-hover-bg)}.tr-mrs{transition:background-color .15s ease}.no-data{padding:2.5rem 1rem;text-align:center;color:#94a3b8;font-size:.875rem}.loading-container{-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.loading-container .loading{border:5px rgba(88,84,84,.82) solid;border-radius:10px;padding:18px 25px;background:#3b3b3bab;color:#fff}.loading{font-size:.875rem;color:var(--ngx-table-accent)}@media(max-width:768px){.ngx-table-scroll{overflow:visible;max-height:none}.ngx-table{width:100%}.thead-mrs{display:none}.tbody-mrs{display:flex;flex-direction:column;gap:.75rem;padding:.75rem}.tr-mrs{flex-direction:column;border:1px solid var(--ngx-table-border);border-radius:10px;overflow:hidden}.td-mrs{flex:1 1 auto!important;width:100%;border-inline-end:none;justify-content:space-between}.cel{justify-content:flex-end;white-space:normal;text-align:end}.cell-title{display:inline}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NgxPagination, selector: "ngx-pagination", inputs: ["total", "page", "pageSize", "pageSizeOptions", "labels", "siblingCount", "boundaryCount"], outputs: ["pageChange", "pageSizeChange", "paginate"] }, { kind: "directive", type: ColumnResize, selector: "[ngxColumnResize]", inputs: ["ngxColumnResizeWidth", "ngxColumnResizeMin", "ngxColumnResizeMax", "ngxColumnResizeDir"], outputs: ["resizing", "resizeEnd"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
655
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: NgxTable, isStandalone: true, selector: "ngx-table", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: true, isRequired: true, transformFunction: null }, showRecordNumber: { classPropertyName: "showRecordNumber", publicName: "showRecordNumber", isSignal: true, isRequired: false, transformFunction: null }, operations: { classPropertyName: "operations", publicName: "operations", isSignal: true, isRequired: false, transformFunction: null }, operationWidth: { classPropertyName: "operationWidth", publicName: "operationWidth", isSignal: true, isRequired: false, transformFunction: null }, numWidth: { classPropertyName: "numWidth", publicName: "numWidth", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, multiSort: { classPropertyName: "multiSort", publicName: "multiSort", isSignal: true, isRequired: false, transformFunction: null }, lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, trackBy: { classPropertyName: "trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pageChange: "pageChange", lazyLoad: "lazyLoad", sortChange: "sortChange", columnResize: "columnResize" }, host: { classAttribute: "ngx-table-host" }, queries: [{ propertyName: "cellTemplates", predicate: TableCell }], ngImport: i0, template: "<div class=\"ngx-table-wrapper\" [class.ngx-table--loading]=\"loading()\">\n <div class=\"ngx-table-scroll\">\n <div\n class=\"ngx-table\"\n [class.ngx-table--striped]=\"config.stripedRows\"\n [class.ngx-table--hover]=\"config.hoverable\"\n role=\"table\">\n <div class=\"thead-mrs\" [class.thead-mrs--sticky]=\"config.stickyHeader\" role=\"rowgroup\">\n <div class=\"tr-mrs\" role=\"row\">\n @if (operations()) {\n <div\n class=\"th-mrs operations\"\n role=\"columnheader\"\n [style.flex]=\"'0 0 ' + operationWidth() + 'px'\">\n {{ labels.operation }}\n </div>\n }\n @if (showRecordNumber()) {\n <div\n class=\"th-mrs operations\"\n role=\"columnheader\"\n [style.flex]=\"'0 0 ' + numWidth() + 'px'\">\n #\n </div>\n }\n\n @for (f of fields(); track f.column) {\n <div\n class=\"th-mrs\"\n role=\"columnheader\"\n [class.th-mrs--sortable]=\"f.sortable\"\n [style.flex]=\"columnFlex(f)\"\n [attr.aria-sort]=\"\n sortDirectionFor(f.column) === 'asc'\n ? 'ascending'\n : sortDirectionFor(f.column) === 'desc'\n ? 'descending'\n : null\n \"\n (click)=\"onHeaderClick(f, $event)\">\n <span class=\"th-mrs__title\">{{ f.title }}</span>\n\n @if (f.sortable) {\n <span class=\"sort-icon\" [class.active]=\"sortDirectionFor(f.column) !== null\">\n @if (sortDirectionFor(f.column) === 'asc') {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\n <path\n fill=\"currentColor\"\n d=\"M182.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H96V448c0 17.7 14.3 32 32 32s32-14.3 32-32V224h64c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z\" />\n </svg>\n } @else if (sortDirectionFor(f.column) === 'desc') {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\n <path\n fill=\"currentColor\"\n d=\"M137.4 470.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H224V64c0-17.7-14.3-32-32-32s-32 14.3-32 32V288H96c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\" />\n </svg>\n } @else {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\n <path\n fill=\"currentColor\"\n d=\"M137.4 41.4c12.5-12.5 32.8-12.5 45.3 0l96 96c9.2 9.2 11.9 22.9 6.9 34.9s-16.6 19.8-29.6 19.8H224v96c0 17.7-14.3 32-32 32s-32-14.3-32-32V192H96c-12.9 0-24.6-7.8-29.6-19.8s-2.3-25.7 6.9-34.9l96-96zM32 400c0-17.7 14.3-32 32-32H256c17.7 0 32 14.3 32 32s-14.3 32-32 32H64c-17.7 0-32-14.3-32-32z\"\n opacity=\".35\" />\n </svg>\n }\n </span>\n }\n\n @if (isResizable(f)) {\n <span\n ngxColumnResize\n [ngxColumnResizeWidth]=\"columnWidth(f.column)\"\n [ngxColumnResizeMin]=\"columnMin(f)\"\n [ngxColumnResizeMax]=\"columnMax(f)\"\n [ngxColumnResizeDir]=\"resolvedDirection()\"\n (resizing)=\"onColumnResizing(f.column, $event)\"\n (resizeEnd)=\"onColumnResizeEnd(f.column, $event)\"\n (click)=\"$event.stopPropagation()\"></span>\n }\n </div>\n }\n </div>\n </div>\n\n <div class=\"tbody-mrs\" role=\"rowgroup\">\n @if (!loading() && pagedData().length === 0) {\n <div class=\"no-data\">{{ labels.noData }}</div>\n }\n\n @for (row of pagedData(); track trackBy()($index, row); let rowIndex = $index) {\n <div class=\"tr-mrs\" role=\"row\">\n @if (operations()) {\n <div\n class=\"td-mrs operations\"\n role=\"cell\"\n [style.flex]=\"'0 0 ' + operationWidth() + 'px'\">\n <div class=\"cel\">\n <span class=\"cell-title\">{{ labels.operation }}:</span>\n <ng-container\n [ngTemplateOutlet]=\"operations()!\"\n [ngTemplateOutletContext]=\"{ $implicit: row }\"></ng-container>\n </div>\n </div>\n }\n\n @if (showRecordNumber()) {\n <div class=\"td-mrs operations\" role=\"cell\" [style.flex]=\"'0 0 ' + numWidth() + 'px'\">\n <div class=\"cel\">{{ recordNumber(rowIndex) }}</div>\n </div>\n }\n\n @for (f of fields(); track f.column) {\n @let template = getTemplate(f.column);\n @let renderer = getRenderer(f);\n\n <div class=\"td-mrs\" role=\"cell\" [style.flex]=\"columnFlex(f)\">\n <div class=\"cel\" [class.wrap]=\"f.wrap\">\n <span class=\"cell-title\">{{ f.title }}</span>\n\n @if (template) {\n <ng-container\n [ngTemplateOutlet]=\"template\"\n [ngTemplateOutletContext]=\"{\n $implicit: row,\n row: row,\n value: getCellValue(row, f),\n rowIndex: rowIndex,\n field: f,\n }\"></ng-container>\n } @else if (renderer) {\n <ng-container\n *ngComponentOutlet=\"\n renderer;\n inputs: getRendererInputs(row, f)\n \"></ng-container>\n } @else {\n {{ formatCellValue(row, f) }}\n }\n\n @if (f.prefix) {\n <span>{{ f.prefix }}</span>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n </div>\n\n @if (loading()) {\n <div class=\"loading-container\">\n <div class=\"loading\">{{ labels.loading }}</div>\n </div>\n }\n </div>\n</div>\n\n<ngx-pagination\n [page]=\"page()\"\n [pageSize]=\"pageSizeS()\"\n [total]=\"totalCount()\"\n (paginate)=\"onPaginate($event)\"></ngx-pagination>\n", styles: ["@charset \"UTF-8\";:host{--ngx-table-accent: light-dark(#4f46e5, #818cf8);--ngx-table-border: light-dark(#e5e7eb, #27272a);--ngx-table-header-bg: light-dark(#f8fafc, #1a1a26);--ngx-table-header-fg: light-dark(#334155, #d4d4d8);--ngx-table-row-bg: light-dark(#ffffff, #111118);--ngx-table-row-alt-bg: light-dark(#f9fafb, #17171b);--ngx-table-row-hover-bg: light-dark(#eef2ff, #7dc4fb27);--ngx-table-text: light-dark(#1e293b, #e4e4e7);--ngx-table-radius: 12px;display:block;color:var(--ngx-table-text)}.ngx-table-wrapper{position:relative;border:1px solid var(--ngx-table-border);border-radius:var(--ngx-table-radius);overflow:hidden;background:var(--ngx-table-row-bg)}.ngx-table-scroll{overflow:auto;max-height:75vh}.ngx-table-scroll::-webkit-scrollbar{height:10px;width:10px}.ngx-table-scroll::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--ngx-table-border) 60%,gray);border-radius:8px}.ngx-table{display:flex;flex-direction:column;min-width:100%;width:max-content}.thead-mrs{display:flex;flex-direction:column;z-index:2;background:var(--ngx-table-header-bg);color:var(--ngx-table-header-fg)}.thead-mrs--sticky{position:sticky;top:0}.tr-mrs{display:flex;align-items:stretch}.th-mrs,.td-mrs{position:relative;box-sizing:border-box;overflow:hidden;min-inline-size:0;border-bottom:1px solid var(--ngx-table-border);border-inline-end:1px solid var(--ngx-table-border)}.th-mrs:last-child,.td-mrs:last-child{border-inline-end:none}.th-mrs{display:flex;align-items:center;gap:.375rem;font-weight:600;font-size:.8125rem;letter-spacing:.02em;padding:.75rem 1rem;-webkit-user-select:none;user-select:none;white-space:nowrap;text-overflow:ellipsis}.th-mrs--sortable{cursor:pointer}.th-mrs--sortable:hover{color:var(--ngx-table-accent)}.th-mrs.operations{justify-content:center}.th-mrs__title{overflow:hidden;text-overflow:ellipsis}.sort-icon{width:.75rem;height:.75rem;flex:none;opacity:.4;display:inline-flex}.sort-icon svg{width:100%;height:100%}.sort-icon.active{opacity:1}.ngx-table__resize-handle,[ngxColumnResize]{position:absolute;top:0;bottom:0;inset-inline-end:-3px;width:6px;cursor:col-resize;touch-action:none;z-index:3}.ngx-table__resize-handle:hover,.ngx-table__resize-handle:active,[ngxColumnResize]:hover,[ngxColumnResize]:active{background:var(--ngx-table-accent);opacity:.5}.td-mrs{display:flex;align-items:center;padding:.75rem 1rem;font-size:.875rem}.td-mrs.operations{justify-content:center}.cel{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;gap:.25rem}.cel.wrap{white-space:normal}.cell-title{display:none;font-weight:600;color:var(--ngx-table-header-fg)}.ngx-table--striped .tbody-mrs .tr-mrs:nth-child(2n){background:var(--ngx-table-row-alt-bg)}.ngx-table--hover .tbody-mrs .tr-mrs:hover{background:var(--ngx-table-row-hover-bg)}.tr-mrs{transition:background-color .15s ease}.no-data{padding:2.5rem 1rem;text-align:center;color:#94a3b8;font-size:.875rem}.loading-container{-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.loading-container .loading{border:5px rgba(88,84,84,.82) solid;border-radius:10px;padding:18px 25px;background:#3b3b3bab;color:#fff}.loading{font-size:.875rem;color:var(--ngx-table-accent)}@media(max-width:768px){.ngx-table-scroll{overflow:visible;max-height:none}.ngx-table{width:100%}.thead-mrs{display:none}.tbody-mrs{display:flex;flex-direction:column;gap:.75rem;padding:.75rem}.tr-mrs{flex-direction:column;border:1px solid var(--ngx-table-border);border-radius:10px;overflow:hidden}.td-mrs{flex:1 1 auto!important;width:100%;border-inline-end:none;justify-content:space-between}.cel{justify-content:flex-end;white-space:normal;text-align:end}.cell-title{display:inline}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NgxPagination, selector: "ngx-pagination", inputs: ["total", "page", "pageSize", "pageSizeOptions", "siblingCount", "boundaryCount"], outputs: ["pageChange", "pageSizeChange", "paginate"] }, { kind: "directive", type: ColumnResize, selector: "[ngxColumnResize]", inputs: ["ngxColumnResizeWidth", "ngxColumnResizeMin", "ngxColumnResizeMax", "ngxColumnResizeDir"], outputs: ["resizing", "resizeEnd"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
650
656
|
}
|
|
651
657
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: NgxTable, decorators: [{
|
|
652
658
|
type: Component,
|
|
653
659
|
args: [{ selector: 'ngx-table', standalone: true, imports: [CommonModule, NgxPagination, ColumnResize], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
654
660
|
class: 'ngx-table-host',
|
|
655
|
-
}, template: "<div class=\"ngx-table-wrapper\" [class.ngx-table--loading]=\"loading()\">\n <div class=\"ngx-table-scroll\">\n <div\n class=\"ngx-table\"\n [class.ngx-table--striped]=\"config.stripedRows\"\n [class.ngx-table--hover]=\"config.hoverable\"\n role=\"table\">\n <div class=\"thead-mrs\" [class.thead-mrs--sticky]=\"config.stickyHeader\" role=\"rowgroup\">\n <div class=\"tr-mrs\" role=\"row\">\n @if (operations()) {\n <div\n class=\"th-mrs operations\"\n role=\"columnheader\"\n [style.flex]=\"'0 0 ' + operationWidth() + 'px'\">\n {{ config.labels.operation }}\n </div>\n }\n @if (showRecordNumber()) {\n <div\n class=\"th-mrs operations\"\n role=\"columnheader\"\n [style.flex]=\"'0 0 ' + numWidth() + 'px'\">\n #\n </div>\n }\n\n @for (f of fields(); track f.column) {\n <div\n class=\"th-mrs\"\n role=\"columnheader\"\n [class.th-mrs--sortable]=\"f.sortable\"\n [style.flex]=\"columnFlex(f)\"\n [attr.aria-sort]=\"\n sortDirectionFor(f.column) === 'asc'\n ? 'ascending'\n : sortDirectionFor(f.column) === 'desc'\n ? 'descending'\n : null\n \"\n (click)=\"onHeaderClick(f, $event)\">\n <span class=\"th-mrs__title\">{{ f.title }}</span>\n\n @if (f.sortable) {\n <span class=\"sort-icon\" [class.active]=\"sortDirectionFor(f.column) !== null\">\n @if (sortDirectionFor(f.column) === 'asc') {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\n <path\n fill=\"currentColor\"\n d=\"M182.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H96V448c0 17.7 14.3 32 32 32s32-14.3 32-32V224h64c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z\" />\n </svg>\n } @else if (sortDirectionFor(f.column) === 'desc') {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\n <path\n fill=\"currentColor\"\n d=\"M137.4 470.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H224V64c0-17.7-14.3-32-32-32s-32 14.3-32 32V288H96c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\" />\n </svg>\n } @else {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\n <path\n fill=\"currentColor\"\n d=\"M137.4 41.4c12.5-12.5 32.8-12.5 45.3 0l96 96c9.2 9.2 11.9 22.9 6.9 34.9s-16.6 19.8-29.6 19.8H224v96c0 17.7-14.3 32-32 32s-32-14.3-32-32V192H96c-12.9 0-24.6-7.8-29.6-19.8s-2.3-25.7 6.9-34.9l96-96zM32 400c0-17.7 14.3-32 32-32H256c17.7 0 32 14.3 32 32s-14.3 32-32 32H64c-17.7 0-32-14.3-32-32z\"\n opacity=\".35\" />\n </svg>\n }\n </span>\n }\n\n @if (isResizable(f)) {\n <span\n ngxColumnResize\n [ngxColumnResizeWidth]=\"columnWidth(f.column)\"\n [ngxColumnResizeMin]=\"columnMin(f)\"\n [ngxColumnResizeMax]=\"columnMax(f)\"\n [ngxColumnResizeDir]=\"resolvedDirection()\"\n (resizing)=\"onColumnResizing(f.column, $event)\"\n (resizeEnd)=\"onColumnResizeEnd(f.column, $event)\"\n (click)=\"$event.stopPropagation()\"></span>\n }\n </div>\n }\n </div>\n </div>\n\n <div class=\"tbody-mrs\" role=\"rowgroup\">\n @if (!loading() && pagedData().length === 0) {\n <div class=\"no-data\">{{ config.labels.noData }}</div>\n }\n\n @for (row of pagedData(); track trackBy()($index, row); let rowIndex = $index) {\n <div class=\"tr-mrs\" role=\"row\">\n @if (operations()) {\n <div\n class=\"td-mrs operations\"\n role=\"cell\"\n [style.flex]=\"'0 0 ' + operationWidth() + 'px'\">\n <div class=\"cel\">\n <span class=\"cell-title\">{{ config.labels.operation }}:</span>\n <ng-container\n [ngTemplateOutlet]=\"operations()!\"\n [ngTemplateOutletContext]=\"{ $implicit: row }\"></ng-container>\n </div>\n </div>\n }\n\n @if (showRecordNumber()) {\n <div class=\"td-mrs operations\" role=\"cell\" [style.flex]=\"'0 0 ' + numWidth() + 'px'\">\n <div class=\"cel\">{{ recordNumber(rowIndex) }}</div>\n </div>\n }\n\n @for (f of fields(); track f.column) {\n @let template = getTemplate(f.column);\n @let renderer = getRenderer(f);\n\n <div class=\"td-mrs\" role=\"cell\" [style.flex]=\"columnFlex(f)\">\n <div class=\"cel\" [class.wrap]=\"f.wrap\">\n <span class=\"cell-title\">{{ f.title }}</span>\n\n @if (template) {\n <ng-container\n [ngTemplateOutlet]=\"template\"\n [ngTemplateOutletContext]=\"{\n $implicit: row,\n row: row,\n value: getCellValue(row, f),\n rowIndex: rowIndex,\n field: f,\n }\"></ng-container>\n } @else if (renderer) {\n <ng-container\n *ngComponentOutlet=\"\n renderer;\n inputs: getRendererInputs(row, f)\n \"></ng-container>\n } @else {\n {{ formatCellValue(row, f) }}\n }\n\n @if (f.prefix) {\n <span>{{ f.prefix }}</span>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n </div>\n\n @if (loading()) {\n <div class=\"loading-container\">\n <div class=\"loading\">{{ config.labels.loading }}</div>\n </div>\n }\n </div>\n</div>\n\n<ngx-pagination\n [page]=\"page()\"\n [pageSize]=\"pageSizeS()\"\n [total]=\"totalCount()\"\n (paginate)=\"onPaginate($event)\"></ngx-pagination>\n", styles: ["@charset \"UTF-8\";:host{--ngx-table-accent: light-dark(#4f46e5, #818cf8);--ngx-table-border: light-dark(#e5e7eb, #27272a);--ngx-table-header-bg: light-dark(#f8fafc, #1a1a26);--ngx-table-header-fg: light-dark(#334155, #d4d4d8);--ngx-table-row-bg: light-dark(#ffffff, #111118);--ngx-table-row-alt-bg: light-dark(#f9fafb, #17171b);--ngx-table-row-hover-bg: light-dark(#eef2ff, #7dc4fb27);--ngx-table-text: light-dark(#1e293b, #e4e4e7);--ngx-table-radius: 12px;display:block;color:var(--ngx-table-text)}.ngx-table-wrapper{position:relative;border:1px solid var(--ngx-table-border);border-radius:var(--ngx-table-radius);overflow:hidden;background:var(--ngx-table-row-bg)}.ngx-table-scroll{overflow:auto;max-height:75vh}.ngx-table-scroll::-webkit-scrollbar{height:10px;width:10px}.ngx-table-scroll::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--ngx-table-border) 60%,gray);border-radius:8px}.ngx-table{display:flex;flex-direction:column;min-width:100%;width:max-content}.thead-mrs{display:flex;flex-direction:column;z-index:2;background:var(--ngx-table-header-bg);color:var(--ngx-table-header-fg)}.thead-mrs--sticky{position:sticky;top:0}.tr-mrs{display:flex;align-items:stretch}.th-mrs,.td-mrs{position:relative;box-sizing:border-box;overflow:hidden;min-inline-size:0;border-bottom:1px solid var(--ngx-table-border);border-inline-end:1px solid var(--ngx-table-border)}.th-mrs:last-child,.td-mrs:last-child{border-inline-end:none}.th-mrs{display:flex;align-items:center;gap:.375rem;font-weight:600;font-size:.8125rem;letter-spacing:.02em;padding:.75rem 1rem;-webkit-user-select:none;user-select:none;white-space:nowrap;text-overflow:ellipsis}.th-mrs--sortable{cursor:pointer}.th-mrs--sortable:hover{color:var(--ngx-table-accent)}.th-mrs.operations{justify-content:center}.th-mrs__title{overflow:hidden;text-overflow:ellipsis}.sort-icon{width:.75rem;height:.75rem;flex:none;opacity:.4;display:inline-flex}.sort-icon svg{width:100%;height:100%}.sort-icon.active{opacity:1}.ngx-table__resize-handle,[ngxColumnResize]{position:absolute;top:0;bottom:0;inset-inline-end:-3px;width:6px;cursor:col-resize;touch-action:none;z-index:3}.ngx-table__resize-handle:hover,.ngx-table__resize-handle:active,[ngxColumnResize]:hover,[ngxColumnResize]:active{background:var(--ngx-table-accent);opacity:.5}.td-mrs{display:flex;align-items:center;padding:.75rem 1rem;font-size:.875rem}.td-mrs.operations{justify-content:center}.cel{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;gap:.25rem}.cel.wrap{white-space:normal}.cell-title{display:none;font-weight:600;color:var(--ngx-table-header-fg)}.ngx-table--striped .tbody-mrs .tr-mrs:nth-child(2n){background:var(--ngx-table-row-alt-bg)}.ngx-table--hover .tbody-mrs .tr-mrs:hover{background:var(--ngx-table-row-hover-bg)}.tr-mrs{transition:background-color .15s ease}.no-data{padding:2.5rem 1rem;text-align:center;color:#94a3b8;font-size:.875rem}.loading-container{-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.loading-container .loading{border:5px rgba(88,84,84,.82) solid;border-radius:10px;padding:18px 25px;background:#3b3b3bab;color:#fff}.loading{font-size:.875rem;color:var(--ngx-table-accent)}@media(max-width:768px){.ngx-table-scroll{overflow:visible;max-height:none}.ngx-table{width:100%}.thead-mrs{display:none}.tbody-mrs{display:flex;flex-direction:column;gap:.75rem;padding:.75rem}.tr-mrs{flex-direction:column;border:1px solid var(--ngx-table-border);border-radius:10px;overflow:hidden}.td-mrs{flex:1 1 auto!important;width:100%;border-inline-end:none;justify-content:space-between}.cel{justify-content:flex-end;white-space:normal;text-align:end}.cell-title{display:inline}}\n"] }]
|
|
661
|
+
}, template: "<div class=\"ngx-table-wrapper\" [class.ngx-table--loading]=\"loading()\">\n <div class=\"ngx-table-scroll\">\n <div\n class=\"ngx-table\"\n [class.ngx-table--striped]=\"config.stripedRows\"\n [class.ngx-table--hover]=\"config.hoverable\"\n role=\"table\">\n <div class=\"thead-mrs\" [class.thead-mrs--sticky]=\"config.stickyHeader\" role=\"rowgroup\">\n <div class=\"tr-mrs\" role=\"row\">\n @if (operations()) {\n <div\n class=\"th-mrs operations\"\n role=\"columnheader\"\n [style.flex]=\"'0 0 ' + operationWidth() + 'px'\">\n {{ labels.operation }}\n </div>\n }\n @if (showRecordNumber()) {\n <div\n class=\"th-mrs operations\"\n role=\"columnheader\"\n [style.flex]=\"'0 0 ' + numWidth() + 'px'\">\n #\n </div>\n }\n\n @for (f of fields(); track f.column) {\n <div\n class=\"th-mrs\"\n role=\"columnheader\"\n [class.th-mrs--sortable]=\"f.sortable\"\n [style.flex]=\"columnFlex(f)\"\n [attr.aria-sort]=\"\n sortDirectionFor(f.column) === 'asc'\n ? 'ascending'\n : sortDirectionFor(f.column) === 'desc'\n ? 'descending'\n : null\n \"\n (click)=\"onHeaderClick(f, $event)\">\n <span class=\"th-mrs__title\">{{ f.title }}</span>\n\n @if (f.sortable) {\n <span class=\"sort-icon\" [class.active]=\"sortDirectionFor(f.column) !== null\">\n @if (sortDirectionFor(f.column) === 'asc') {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\n <path\n fill=\"currentColor\"\n d=\"M182.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H96V448c0 17.7 14.3 32 32 32s32-14.3 32-32V224h64c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z\" />\n </svg>\n } @else if (sortDirectionFor(f.column) === 'desc') {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\n <path\n fill=\"currentColor\"\n d=\"M137.4 470.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H224V64c0-17.7-14.3-32-32-32s-32 14.3-32 32V288H96c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\" />\n </svg>\n } @else {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\n <path\n fill=\"currentColor\"\n d=\"M137.4 41.4c12.5-12.5 32.8-12.5 45.3 0l96 96c9.2 9.2 11.9 22.9 6.9 34.9s-16.6 19.8-29.6 19.8H224v96c0 17.7-14.3 32-32 32s-32-14.3-32-32V192H96c-12.9 0-24.6-7.8-29.6-19.8s-2.3-25.7 6.9-34.9l96-96zM32 400c0-17.7 14.3-32 32-32H256c17.7 0 32 14.3 32 32s-14.3 32-32 32H64c-17.7 0-32-14.3-32-32z\"\n opacity=\".35\" />\n </svg>\n }\n </span>\n }\n\n @if (isResizable(f)) {\n <span\n ngxColumnResize\n [ngxColumnResizeWidth]=\"columnWidth(f.column)\"\n [ngxColumnResizeMin]=\"columnMin(f)\"\n [ngxColumnResizeMax]=\"columnMax(f)\"\n [ngxColumnResizeDir]=\"resolvedDirection()\"\n (resizing)=\"onColumnResizing(f.column, $event)\"\n (resizeEnd)=\"onColumnResizeEnd(f.column, $event)\"\n (click)=\"$event.stopPropagation()\"></span>\n }\n </div>\n }\n </div>\n </div>\n\n <div class=\"tbody-mrs\" role=\"rowgroup\">\n @if (!loading() && pagedData().length === 0) {\n <div class=\"no-data\">{{ labels.noData }}</div>\n }\n\n @for (row of pagedData(); track trackBy()($index, row); let rowIndex = $index) {\n <div class=\"tr-mrs\" role=\"row\">\n @if (operations()) {\n <div\n class=\"td-mrs operations\"\n role=\"cell\"\n [style.flex]=\"'0 0 ' + operationWidth() + 'px'\">\n <div class=\"cel\">\n <span class=\"cell-title\">{{ labels.operation }}:</span>\n <ng-container\n [ngTemplateOutlet]=\"operations()!\"\n [ngTemplateOutletContext]=\"{ $implicit: row }\"></ng-container>\n </div>\n </div>\n }\n\n @if (showRecordNumber()) {\n <div class=\"td-mrs operations\" role=\"cell\" [style.flex]=\"'0 0 ' + numWidth() + 'px'\">\n <div class=\"cel\">{{ recordNumber(rowIndex) }}</div>\n </div>\n }\n\n @for (f of fields(); track f.column) {\n @let template = getTemplate(f.column);\n @let renderer = getRenderer(f);\n\n <div class=\"td-mrs\" role=\"cell\" [style.flex]=\"columnFlex(f)\">\n <div class=\"cel\" [class.wrap]=\"f.wrap\">\n <span class=\"cell-title\">{{ f.title }}</span>\n\n @if (template) {\n <ng-container\n [ngTemplateOutlet]=\"template\"\n [ngTemplateOutletContext]=\"{\n $implicit: row,\n row: row,\n value: getCellValue(row, f),\n rowIndex: rowIndex,\n field: f,\n }\"></ng-container>\n } @else if (renderer) {\n <ng-container\n *ngComponentOutlet=\"\n renderer;\n inputs: getRendererInputs(row, f)\n \"></ng-container>\n } @else {\n {{ formatCellValue(row, f) }}\n }\n\n @if (f.prefix) {\n <span>{{ f.prefix }}</span>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n </div>\n\n @if (loading()) {\n <div class=\"loading-container\">\n <div class=\"loading\">{{ labels.loading }}</div>\n </div>\n }\n </div>\n</div>\n\n<ngx-pagination\n [page]=\"page()\"\n [pageSize]=\"pageSizeS()\"\n [total]=\"totalCount()\"\n (paginate)=\"onPaginate($event)\"></ngx-pagination>\n", styles: ["@charset \"UTF-8\";:host{--ngx-table-accent: light-dark(#4f46e5, #818cf8);--ngx-table-border: light-dark(#e5e7eb, #27272a);--ngx-table-header-bg: light-dark(#f8fafc, #1a1a26);--ngx-table-header-fg: light-dark(#334155, #d4d4d8);--ngx-table-row-bg: light-dark(#ffffff, #111118);--ngx-table-row-alt-bg: light-dark(#f9fafb, #17171b);--ngx-table-row-hover-bg: light-dark(#eef2ff, #7dc4fb27);--ngx-table-text: light-dark(#1e293b, #e4e4e7);--ngx-table-radius: 12px;display:block;color:var(--ngx-table-text)}.ngx-table-wrapper{position:relative;border:1px solid var(--ngx-table-border);border-radius:var(--ngx-table-radius);overflow:hidden;background:var(--ngx-table-row-bg)}.ngx-table-scroll{overflow:auto;max-height:75vh}.ngx-table-scroll::-webkit-scrollbar{height:10px;width:10px}.ngx-table-scroll::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--ngx-table-border) 60%,gray);border-radius:8px}.ngx-table{display:flex;flex-direction:column;min-width:100%;width:max-content}.thead-mrs{display:flex;flex-direction:column;z-index:2;background:var(--ngx-table-header-bg);color:var(--ngx-table-header-fg)}.thead-mrs--sticky{position:sticky;top:0}.tr-mrs{display:flex;align-items:stretch}.th-mrs,.td-mrs{position:relative;box-sizing:border-box;overflow:hidden;min-inline-size:0;border-bottom:1px solid var(--ngx-table-border);border-inline-end:1px solid var(--ngx-table-border)}.th-mrs:last-child,.td-mrs:last-child{border-inline-end:none}.th-mrs{display:flex;align-items:center;gap:.375rem;font-weight:600;font-size:.8125rem;letter-spacing:.02em;padding:.75rem 1rem;-webkit-user-select:none;user-select:none;white-space:nowrap;text-overflow:ellipsis}.th-mrs--sortable{cursor:pointer}.th-mrs--sortable:hover{color:var(--ngx-table-accent)}.th-mrs.operations{justify-content:center}.th-mrs__title{overflow:hidden;text-overflow:ellipsis}.sort-icon{width:.75rem;height:.75rem;flex:none;opacity:.4;display:inline-flex}.sort-icon svg{width:100%;height:100%}.sort-icon.active{opacity:1}.ngx-table__resize-handle,[ngxColumnResize]{position:absolute;top:0;bottom:0;inset-inline-end:-3px;width:6px;cursor:col-resize;touch-action:none;z-index:3}.ngx-table__resize-handle:hover,.ngx-table__resize-handle:active,[ngxColumnResize]:hover,[ngxColumnResize]:active{background:var(--ngx-table-accent);opacity:.5}.td-mrs{display:flex;align-items:center;padding:.75rem 1rem;font-size:.875rem}.td-mrs.operations{justify-content:center}.cel{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;gap:.25rem}.cel.wrap{white-space:normal}.cell-title{display:none;font-weight:600;color:var(--ngx-table-header-fg)}.ngx-table--striped .tbody-mrs .tr-mrs:nth-child(2n){background:var(--ngx-table-row-alt-bg)}.ngx-table--hover .tbody-mrs .tr-mrs:hover{background:var(--ngx-table-row-hover-bg)}.tr-mrs{transition:background-color .15s ease}.no-data{padding:2.5rem 1rem;text-align:center;color:#94a3b8;font-size:.875rem}.loading-container{-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.loading-container .loading{border:5px rgba(88,84,84,.82) solid;border-radius:10px;padding:18px 25px;background:#3b3b3bab;color:#fff}.loading{font-size:.875rem;color:var(--ngx-table-accent)}@media(max-width:768px){.ngx-table-scroll{overflow:visible;max-height:none}.ngx-table{width:100%}.thead-mrs{display:none}.tbody-mrs{display:flex;flex-direction:column;gap:.75rem;padding:.75rem}.tr-mrs{flex-direction:column;border:1px solid var(--ngx-table-border);border-radius:10px;overflow:hidden}.td-mrs{flex:1 1 auto!important;width:100%;border-inline-end:none;justify-content:space-between}.cel{justify-content:flex-end;white-space:normal;text-align:end}.cell-title{display:inline}}\n"] }]
|
|
656
662
|
}], ctorParameters: () => [], propDecorators: { fields: [{ type: i0.Input, args: [{ isSignal: true, alias: "fields", required: true }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }], totalRecords: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalRecords", required: true }] }], showRecordNumber: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRecordNumber", required: false }] }], operations: [{ type: i0.Input, args: [{ isSignal: true, alias: "operations", required: false }] }], operationWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "operationWidth", required: false }] }], numWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "numWidth", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }], page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: false }] }], pageChange: [{ type: i0.Output, args: ["pageChange"] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], multiSort: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiSort", required: false }] }], lazy: [{ type: i0.Input, args: [{ isSignal: true, alias: "lazy", required: false }] }], resizable: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizable", required: false }] }], trackBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "trackBy", required: false }] }], lazyLoad: [{ type: i0.Output, args: ["lazyLoad"] }], sortChange: [{ type: i0.Output, args: ["sortChange"] }], columnResize: [{ type: i0.Output, args: ["columnResize"] }], cellTemplates: [{
|
|
657
663
|
type: ContentChildren,
|
|
658
664
|
args: [TableCell]
|
|
@@ -664,5 +670,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImpor
|
|
|
664
670
|
* Generated bundle index. Do not edit.
|
|
665
671
|
*/
|
|
666
672
|
|
|
667
|
-
export { ColumnResize, NGX_PAGINATION_CONFIG,
|
|
673
|
+
export { ColumnResize, NGX_PAGINATION_CONFIG, NGX_PAGINATION_I18N, NGX_TABLE_CONFIG, NGX_TABLE_I18N, NgxPagination, NgxTable, PaginationLocalization, TableCell, TableLocalization, defineFields, defineRenderers, providePagination, provideTable };
|
|
668
674
|
//# sourceMappingURL=ngx-kit-data-table.mjs.map
|