@den4ik92/ng2-smart-table 20.7.1 → 21.7.1
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.
|
@@ -3,9 +3,8 @@ import { input, computed, ChangeDetectionStrategy, Component, effect, untracked,
|
|
|
3
3
|
import * as i1 from '@angular/forms';
|
|
4
4
|
import { UntypedFormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
5
5
|
import { debounceTime, takeUntil, switchMap, take, finalize } from 'rxjs/operators';
|
|
6
|
-
import * as i1$
|
|
6
|
+
import * as i1$1 from '@angular/cdk/overlay';
|
|
7
7
|
import { Overlay, OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
|
|
8
|
-
import * as i1$1 from '@angular/cdk/portal';
|
|
9
8
|
import { ComponentPortal, CdkPortal, PortalModule } from '@angular/cdk/portal';
|
|
10
9
|
import { Subject } from 'rxjs';
|
|
11
10
|
import { moveItemInArray, CdkDropList, CdkDrag, CdkDragPlaceholder } from '@angular/cdk/drag-drop';
|
|
@@ -13,25 +12,25 @@ import { NgTemplateOutlet, NgComponentOutlet } from '@angular/common';
|
|
|
13
12
|
|
|
14
13
|
class BaseEditorComponent {
|
|
15
14
|
constructor() {
|
|
16
|
-
this.cell = input.required(...(ngDevMode ? [{ debugName: "cell" }] : []));
|
|
17
|
-
this.inputClass = computed(() => this.cell().column.editorInputClass, ...(ngDevMode ? [{ debugName: "inputClass" }] : []));
|
|
15
|
+
this.cell = input.required(...(ngDevMode ? [{ debugName: "cell" }] : /* istanbul ignore next */ []));
|
|
16
|
+
this.inputClass = computed(() => this.cell().column.editorInputClass, ...(ngDevMode ? [{ debugName: "inputClass" }] : /* istanbul ignore next */ []));
|
|
18
17
|
}
|
|
19
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
20
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
18
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BaseEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
19
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: BaseEditorComponent, isStandalone: true, selector: "ng2-editor-base-component", inputs: { cell: { classPropertyName: "cell", publicName: "cell", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
21
20
|
}
|
|
22
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
21
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BaseEditorComponent, decorators: [{
|
|
23
22
|
type: Component,
|
|
24
23
|
args: [{ template: '', selector: 'ng2-editor-base-component', changeDetection: ChangeDetectionStrategy.OnPush }]
|
|
25
|
-
}] });
|
|
24
|
+
}], propDecorators: { cell: [{ type: i0.Input, args: [{ isSignal: true, alias: "cell", required: true }] }] } });
|
|
26
25
|
|
|
27
26
|
class BaseFilterComponent {
|
|
28
27
|
constructor() {
|
|
29
28
|
this.delay = 300;
|
|
30
|
-
this.query = input(null, ...(ngDevMode ? [{ debugName: "query" }] : []));
|
|
31
|
-
this.inputClass = input('', ...(ngDevMode ? [{ debugName: "inputClass" }] : []));
|
|
32
|
-
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : []));
|
|
33
|
-
this.column = input.required(...(ngDevMode ? [{ debugName: "column" }] : []));
|
|
34
|
-
this.filterEmitter = input.required(...(ngDevMode ? [{ debugName: "filterEmitter" }] : []));
|
|
29
|
+
this.query = input(null, ...(ngDevMode ? [{ debugName: "query" }] : /* istanbul ignore next */ []));
|
|
30
|
+
this.inputClass = input('', ...(ngDevMode ? [{ debugName: "inputClass" }] : /* istanbul ignore next */ []));
|
|
31
|
+
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : /* istanbul ignore next */ []));
|
|
32
|
+
this.column = input.required(...(ngDevMode ? [{ debugName: "column" }] : /* istanbul ignore next */ []));
|
|
33
|
+
this.filterEmitter = input.required(...(ngDevMode ? [{ debugName: "filterEmitter" }] : /* istanbul ignore next */ []));
|
|
35
34
|
this.inputControl = new UntypedFormControl();
|
|
36
35
|
this.placeholder = '';
|
|
37
36
|
effect(() => {
|
|
@@ -57,13 +56,13 @@ class BaseFilterComponent {
|
|
|
57
56
|
setFilter(query) {
|
|
58
57
|
this.filterEmitter().emit(query);
|
|
59
58
|
}
|
|
60
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
61
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
59
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BaseFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
60
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: BaseFilterComponent, isStandalone: true, selector: "ng2-base-filter-component", inputs: { query: { classPropertyName: "query", publicName: "query", isSignal: true, isRequired: false, transformFunction: null }, inputClass: { classPropertyName: "inputClass", publicName: "inputClass", isSignal: true, isRequired: false, transformFunction: null }, source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: true, transformFunction: null }, filterEmitter: { classPropertyName: "filterEmitter", publicName: "filterEmitter", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
62
61
|
}
|
|
63
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
62
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BaseFilterComponent, decorators: [{
|
|
64
63
|
type: Component,
|
|
65
64
|
args: [{ template: '', selector: 'ng2-base-filter-component', changeDetection: ChangeDetectionStrategy.OnPush }]
|
|
66
|
-
}], ctorParameters: () => [] });
|
|
65
|
+
}], ctorParameters: () => [], propDecorators: { query: [{ type: i0.Input, args: [{ isSignal: true, alias: "query", required: false }] }], inputClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputClass", required: false }] }], source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: true }] }], column: [{ type: i0.Input, args: [{ isSignal: true, alias: "column", required: true }] }], filterEmitter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterEmitter", required: true }] }] } });
|
|
67
66
|
|
|
68
67
|
/**
|
|
69
68
|
* Extending object that entered in first argument.
|
|
@@ -212,10 +211,10 @@ function CheckParentElementClassRecursive(element, className) {
|
|
|
212
211
|
class TableColumnsEditorComponent {
|
|
213
212
|
constructor() {
|
|
214
213
|
this.infoText = 'You can drag and drop columns as you wish and also disable unnecessary ones.';
|
|
215
|
-
this.grid = input(...(ngDevMode ? [undefined, { debugName: "grid" }] : []));
|
|
216
|
-
this.close = input.required(...(ngDevMode ? [{ debugName: "close" }] : []));
|
|
214
|
+
this.grid = input(...(ngDevMode ? [undefined, { debugName: "grid" }] : /* istanbul ignore next */ []));
|
|
215
|
+
this.close = input.required(...(ngDevMode ? [{ debugName: "close" }] : /* istanbul ignore next */ []));
|
|
217
216
|
this.currentState = [];
|
|
218
|
-
this.stateHasChanged = signal(false, ...(ngDevMode ? [{ debugName: "stateHasChanged" }] : []));
|
|
217
|
+
this.stateHasChanged = signal(false, ...(ngDevMode ? [{ debugName: "stateHasChanged" }] : /* istanbul ignore next */ []));
|
|
219
218
|
effect(() => {
|
|
220
219
|
this.currentState = cloneArrayOfObject(this.grid()?.currentColumnsSortState || []);
|
|
221
220
|
});
|
|
@@ -240,20 +239,20 @@ class TableColumnsEditorComponent {
|
|
|
240
239
|
updateChangedState() {
|
|
241
240
|
this.stateHasChanged.set(JSON.stringify(this.grid()?.currentColumnsSortState) !== JSON.stringify(this.currentState));
|
|
242
241
|
}
|
|
243
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
244
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
242
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TableColumnsEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
243
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: TableColumnsEditorComponent, isStandalone: true, selector: "ng2-table-columns-editor", inputs: { grid: { classPropertyName: "grid", publicName: "grid", isSignal: true, isRequired: false, transformFunction: null }, close: { classPropertyName: "close", publicName: "close", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"sort-card\">\n <div class=\"sort-card-header\">\n <h6>Table columns setup</h6>\n </div>\n <div class=\"sort-card-body\">\n <div class=\"list\" cdkDropList [cdkDropListData]=\"currentState\" (cdkDropListDropped)=\"drop($event)\">\n @for (column of currentState; track column.key + i; let i = $index) {\n <div\n cdkDrag\n [cdkDragLockAxis]=\"'y'\"\n [cdkDragStartDelay]=\"grid()?.columnSortDragDelay() || 0\"\n [cdkDragDisabled]=\"column.moveDisabled\"\n class=\"drag-row\"\n #dragRow\n [style.--drag-row-height]=\"50\">\n <div class=\"drag-placeholder\" *cdkDragPlaceholder></div>\n <div class=\"index-cell\">\n {{ i + 1 }}\n </div>\n <label class=\"sort-column-checkbox-wrap\" [for]=\"'sort-column-checkbox-' + i\">\n <span></span>\n <input\n [disabled]=\"column.moveDisabled\"\n [id]=\"'sort-column-checkbox-' + i\"\n title=\"Active state. If checked the column will be displayed\"\n type=\"checkbox\"\n class=\"sort-column-checkbox-input\"\n [checked]=\"!column.hide\"\n (change)=\"setVisibility(i)\" />\n <span></span>\n </label>\n {{ column.title }}\n </div>\n }\n </div>\n </div>\n @if (stateHasChanged()) {\n <div class=\"sort-card-footer\">\n <button class=\"reset-button\" (click)=\"resetChanges()\">reset</button>\n <button class=\"update-button\" (click)=\"setAndUpdate()\">Update</button>\n </div>\n }\n</div>\n", styles: [".list{overflow:auto;display:flex;flex-direction:column;gap:.3rem;max-height:100%}.drag-row{border:solid 1px var(--drag-row-border-color, #ccc);border-radius:.3rem;display:flex;align-items:center;box-sizing:border-box;cursor:grab;background:var(--smart-table-bg-even, #ffffff);box-shadow:0 0 6px 1px #ebebeb33}.drag-row.cdk-drag-disabled{filter:opacity(.5);cursor:not-allowed}.drag-row .index-cell{min-width:2.2rem;border-right:1px solid var(--drag-row-border-color, #ccc)}.drag-row>div{padding:.3rem}.drag-row .sort-column-checkbox-wrap{margin:0 .5rem}.cdk-drag-preview{box-sizing:border-box;border-radius:.3rem;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.list.cdk-drop-list-dragging .drag-row:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.drag-placeholder{background:var(--drag-placeholder-background, #ccc);border:dotted 3px #999;min-height:var(--drag-row-heightpx, 2.5rem);transition:transform .25s cubic-bezier(0,0,.2,1)}.overlay-card nb-card-body{padding:.25rem;max-height:100%}.sort-card{box-shadow:0 0 6px 1px #0003;min-width:18rem;padding:.25rem;background:var(--smart-table-bg, #ffffff);border-radius:.5rem}.sort-card .sort-card-header{display:flex;align-items:center;gap:1rem;padding:.5rem 1rem;border-bottom:1px solid var(--sort-card-header-divider-color, #edf1f7)}.sort-card .sort-card-header h6{margin:0}.sort-card .sort-card-body{max-height:54dvh;overflow:auto;padding:.5rem 0}.sort-card .sort-card-footer{border-top:1px solid var(--sort-card-header-divider-color, #edf1f7);display:flex;align-items:center;justify-content:end;gap:1rem;padding:.5rem 1rem}.sort-card .sort-card-footer .update-button,.sort-card .sort-card-footer .reset-button{border-radius:.3rem;padding:.4rem 1rem;border:none;color:#fff;font-size:.875rem;font-weight:700;text-transform:uppercase}.sort-card .sort-card-footer .update-button{background-color:#36f}.sort-card .sort-card-footer .update-button:hover{background-color:#598bff}.sort-card .sort-card-footer .reset-button{background-color:#ff3d71}.sort-card .sort-card-footer .reset-button:hover{background-color:#ff708d}\n"], dependencies: [{ kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
245
244
|
}
|
|
246
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
245
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TableColumnsEditorComponent, decorators: [{
|
|
247
246
|
type: Component,
|
|
248
247
|
args: [{ selector: 'ng2-table-columns-editor', imports: [CdkDropList, CdkDrag, CdkDragPlaceholder], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sort-card\">\n <div class=\"sort-card-header\">\n <h6>Table columns setup</h6>\n </div>\n <div class=\"sort-card-body\">\n <div class=\"list\" cdkDropList [cdkDropListData]=\"currentState\" (cdkDropListDropped)=\"drop($event)\">\n @for (column of currentState; track column.key + i; let i = $index) {\n <div\n cdkDrag\n [cdkDragLockAxis]=\"'y'\"\n [cdkDragStartDelay]=\"grid()?.columnSortDragDelay() || 0\"\n [cdkDragDisabled]=\"column.moveDisabled\"\n class=\"drag-row\"\n #dragRow\n [style.--drag-row-height]=\"50\">\n <div class=\"drag-placeholder\" *cdkDragPlaceholder></div>\n <div class=\"index-cell\">\n {{ i + 1 }}\n </div>\n <label class=\"sort-column-checkbox-wrap\" [for]=\"'sort-column-checkbox-' + i\">\n <span></span>\n <input\n [disabled]=\"column.moveDisabled\"\n [id]=\"'sort-column-checkbox-' + i\"\n title=\"Active state. If checked the column will be displayed\"\n type=\"checkbox\"\n class=\"sort-column-checkbox-input\"\n [checked]=\"!column.hide\"\n (change)=\"setVisibility(i)\" />\n <span></span>\n </label>\n {{ column.title }}\n </div>\n }\n </div>\n </div>\n @if (stateHasChanged()) {\n <div class=\"sort-card-footer\">\n <button class=\"reset-button\" (click)=\"resetChanges()\">reset</button>\n <button class=\"update-button\" (click)=\"setAndUpdate()\">Update</button>\n </div>\n }\n</div>\n", styles: [".list{overflow:auto;display:flex;flex-direction:column;gap:.3rem;max-height:100%}.drag-row{border:solid 1px var(--drag-row-border-color, #ccc);border-radius:.3rem;display:flex;align-items:center;box-sizing:border-box;cursor:grab;background:var(--smart-table-bg-even, #ffffff);box-shadow:0 0 6px 1px #ebebeb33}.drag-row.cdk-drag-disabled{filter:opacity(.5);cursor:not-allowed}.drag-row .index-cell{min-width:2.2rem;border-right:1px solid var(--drag-row-border-color, #ccc)}.drag-row>div{padding:.3rem}.drag-row .sort-column-checkbox-wrap{margin:0 .5rem}.cdk-drag-preview{box-sizing:border-box;border-radius:.3rem;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.list.cdk-drop-list-dragging .drag-row:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.drag-placeholder{background:var(--drag-placeholder-background, #ccc);border:dotted 3px #999;min-height:var(--drag-row-heightpx, 2.5rem);transition:transform .25s cubic-bezier(0,0,.2,1)}.overlay-card nb-card-body{padding:.25rem;max-height:100%}.sort-card{box-shadow:0 0 6px 1px #0003;min-width:18rem;padding:.25rem;background:var(--smart-table-bg, #ffffff);border-radius:.5rem}.sort-card .sort-card-header{display:flex;align-items:center;gap:1rem;padding:.5rem 1rem;border-bottom:1px solid var(--sort-card-header-divider-color, #edf1f7)}.sort-card .sort-card-header h6{margin:0}.sort-card .sort-card-body{max-height:54dvh;overflow:auto;padding:.5rem 0}.sort-card .sort-card-footer{border-top:1px solid var(--sort-card-header-divider-color, #edf1f7);display:flex;align-items:center;justify-content:end;gap:1rem;padding:.5rem 1rem}.sort-card .sort-card-footer .update-button,.sort-card .sort-card-footer .reset-button{border-radius:.3rem;padding:.4rem 1rem;border:none;color:#fff;font-size:.875rem;font-weight:700;text-transform:uppercase}.sort-card .sort-card-footer .update-button{background-color:#36f}.sort-card .sort-card-footer .update-button:hover{background-color:#598bff}.sort-card .sort-card-footer .reset-button{background-color:#ff3d71}.sort-card .sort-card-footer .reset-button:hover{background-color:#ff708d}\n"] }]
|
|
249
|
-
}], ctorParameters: () => [] });
|
|
248
|
+
}], ctorParameters: () => [], propDecorators: { grid: [{ type: i0.Input, args: [{ isSignal: true, alias: "grid", required: false }] }], close: [{ type: i0.Input, args: [{ isSignal: true, alias: "close", required: true }] }] } });
|
|
250
249
|
|
|
251
250
|
class SmartTableColumnEditorDirective {
|
|
252
251
|
constructor() {
|
|
253
|
-
this.tableComponent = input(...(ngDevMode ? [undefined, { debugName: "tableComponent" }] : []));
|
|
252
|
+
this.tableComponent = input(...(ngDevMode ? [undefined, { debugName: "tableComponent" }] : /* istanbul ignore next */ []));
|
|
254
253
|
this.grid = computed(() => {
|
|
255
254
|
return this.tableComponent()?.grid;
|
|
256
|
-
}, ...(ngDevMode ? [{ debugName: "grid" }] : []));
|
|
255
|
+
}, ...(ngDevMode ? [{ debugName: "grid" }] : /* istanbul ignore next */ []));
|
|
257
256
|
this.overlay = inject(Overlay);
|
|
258
257
|
this.elementRef = inject(ElementRef);
|
|
259
258
|
this.destroy$ = new Subject();
|
|
@@ -331,10 +330,10 @@ class SmartTableColumnEditorDirective {
|
|
|
331
330
|
backdropClass: 'cdk-overlay-transparent-backdrop',
|
|
332
331
|
});
|
|
333
332
|
}
|
|
334
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
335
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
333
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: SmartTableColumnEditorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
334
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: SmartTableColumnEditorDirective, isStandalone: true, selector: "[ng2SmartTableColumnEditor]", inputs: { tableComponent: { classPropertyName: "tableComponent", publicName: "tableComponent", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "buttonClicked()" } }, ngImport: i0 }); }
|
|
336
335
|
}
|
|
337
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
336
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: SmartTableColumnEditorDirective, decorators: [{
|
|
338
337
|
type: Directive,
|
|
339
338
|
args: [{
|
|
340
339
|
selector: '[ng2SmartTableColumnEditor]',
|
|
@@ -342,7 +341,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
342
341
|
'(click)': 'buttonClicked()',
|
|
343
342
|
},
|
|
344
343
|
}]
|
|
345
|
-
}] });
|
|
344
|
+
}], propDecorators: { tableComponent: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableComponent", required: false }] }] } });
|
|
346
345
|
|
|
347
346
|
class Cell {
|
|
348
347
|
constructor(value, row, column, cellEmptyText = '') {
|
|
@@ -350,7 +349,7 @@ class Cell {
|
|
|
350
349
|
this.row = row;
|
|
351
350
|
this.column = column;
|
|
352
351
|
this.cellEmptyText = cellEmptyText;
|
|
353
|
-
this.newValue = signal(null, ...(ngDevMode ? [{ debugName: "newValue" }] : []));
|
|
352
|
+
this.newValue = signal(null, ...(ngDevMode ? [{ debugName: "newValue" }] : /* istanbul ignore next */ []));
|
|
354
353
|
this.columnClass = '';
|
|
355
354
|
this.styles = '';
|
|
356
355
|
this.title = '';
|
|
@@ -450,13 +449,13 @@ class Row {
|
|
|
450
449
|
this.rowDataObj = rowDataObj;
|
|
451
450
|
this.columnsList = columnsList;
|
|
452
451
|
this.cellEmptyText = cellEmptyText;
|
|
453
|
-
this.pending = signal(false, ...(ngDevMode ? [{ debugName: "pending" }] : []));
|
|
454
|
-
this.isSelected = signal(false, ...(ngDevMode ? [{ debugName: "isSelected" }] : []));
|
|
455
|
-
this.isInEditing = signal(false, ...(ngDevMode ? [{ debugName: "isInEditing" }] : []));
|
|
456
|
-
this.cells = computed(() => this.columns().map((column) => this.createCell(column, this.rowData())), ...(ngDevMode ? [{ debugName: "cells" }] : []));
|
|
457
|
-
this.rowData = signal({}, ...(ngDevMode ? [{ debugName: "rowData" }] : []));
|
|
458
|
-
this.columns = signal([], ...(ngDevMode ? [{ debugName: "columns" }] : []));
|
|
459
|
-
this.visibleCells = computed(() => this.cells().filter((cell) => !cell.column.hide), ...(ngDevMode ? [{ debugName: "visibleCells" }] : []));
|
|
452
|
+
this.pending = signal(false, ...(ngDevMode ? [{ debugName: "pending" }] : /* istanbul ignore next */ []));
|
|
453
|
+
this.isSelected = signal(false, ...(ngDevMode ? [{ debugName: "isSelected" }] : /* istanbul ignore next */ []));
|
|
454
|
+
this.isInEditing = signal(false, ...(ngDevMode ? [{ debugName: "isInEditing" }] : /* istanbul ignore next */ []));
|
|
455
|
+
this.cells = computed(() => this.columns().map((column) => this.createCell(column, this.rowData())), ...(ngDevMode ? [{ debugName: "cells" }] : /* istanbul ignore next */ []));
|
|
456
|
+
this.rowData = signal({}, ...(ngDevMode ? [{ debugName: "rowData" }] : /* istanbul ignore next */ []));
|
|
457
|
+
this.columns = signal([], ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
|
|
458
|
+
this.visibleCells = computed(() => this.cells().filter((cell) => !cell.column.hide), ...(ngDevMode ? [{ debugName: "visibleCells" }] : /* istanbul ignore next */ []));
|
|
460
459
|
this.rowData.set(rowDataObj);
|
|
461
460
|
this.columns.set(columnsList);
|
|
462
461
|
}
|
|
@@ -494,16 +493,16 @@ var SmartTableOnChangedEventName;
|
|
|
494
493
|
class DataSource {
|
|
495
494
|
constructor() {
|
|
496
495
|
this.onChangedSource = new Subject();
|
|
497
|
-
this.sortConf = signal(null, ...(ngDevMode ? [{ debugName: "sortConf" }] : []));
|
|
498
|
-
this.filters = signal([], ...(ngDevMode ? [{ debugName: "filters" }] : []));
|
|
496
|
+
this.sortConf = signal(null, ...(ngDevMode ? [{ debugName: "sortConf" }] : /* istanbul ignore next */ []));
|
|
497
|
+
this.filters = signal([], ...(ngDevMode ? [{ debugName: "filters" }] : /* istanbul ignore next */ []));
|
|
499
498
|
this.pagingConf = signal({
|
|
500
499
|
page: 1,
|
|
501
500
|
perPage: 100,
|
|
502
501
|
total: 0,
|
|
503
502
|
display: false,
|
|
504
503
|
perPageSelect: [],
|
|
505
|
-
}, ...(ngDevMode ? [{ debugName: "pagingConf" }] : []));
|
|
506
|
-
this.data = signal([], ...(ngDevMode ? [{ debugName: "data" }] : []));
|
|
504
|
+
}, ...(ngDevMode ? [{ debugName: "pagingConf" }] : /* istanbul ignore next */ []));
|
|
505
|
+
this.data = signal([], ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
|
|
507
506
|
this.getSort = this.sortConf;
|
|
508
507
|
this.getFilters = this.filters;
|
|
509
508
|
}
|
|
@@ -694,11 +693,11 @@ class LocalDataSource extends DataSource {
|
|
|
694
693
|
list = localSort(list, field, direction, compare);
|
|
695
694
|
}
|
|
696
695
|
return list;
|
|
697
|
-
}, ...(ngDevMode ? [{ debugName: "filteredAndSorted" }] : []));
|
|
696
|
+
}, ...(ngDevMode ? [{ debugName: "filteredAndSorted" }] : /* istanbul ignore next */ []));
|
|
698
697
|
this.paginatedList = computed(() => {
|
|
699
698
|
return this.paginate(this.filteredAndSorted());
|
|
700
|
-
}, ...(ngDevMode ? [{ debugName: "paginatedList" }] : []));
|
|
701
|
-
this.count = computed(() => this.filteredAndSorted().length, ...(ngDevMode ? [{ debugName: "count" }] : []));
|
|
699
|
+
}, ...(ngDevMode ? [{ debugName: "paginatedList" }] : /* istanbul ignore next */ []));
|
|
700
|
+
this.count = computed(() => this.filteredAndSorted().length, ...(ngDevMode ? [{ debugName: "count" }] : /* istanbul ignore next */ []));
|
|
702
701
|
this.data.set(data);
|
|
703
702
|
}
|
|
704
703
|
async load(data) {
|
|
@@ -757,8 +756,8 @@ class ServerDataSource extends DataSource {
|
|
|
757
756
|
constructor(paramPrepareFunction, requestFunction, initPagingConf) {
|
|
758
757
|
super();
|
|
759
758
|
this.initPagingConf = initPagingConf;
|
|
760
|
-
this.count = computed(() => this.pagingConf().total, ...(ngDevMode ? [{ debugName: "count" }] : []));
|
|
761
|
-
this.pending = signal(false, ...(ngDevMode ? [{ debugName: "pending" }] : []));
|
|
759
|
+
this.count = computed(() => this.pagingConf().total, ...(ngDevMode ? [{ debugName: "count" }] : /* istanbul ignore next */ []));
|
|
760
|
+
this.pending = signal(false, ...(ngDevMode ? [{ debugName: "pending" }] : /* istanbul ignore next */ []));
|
|
762
761
|
this.pagingConf.update((old) => ({ ...old, ...this.initPagingConf }));
|
|
763
762
|
this.paramPrepareFunction = paramPrepareFunction;
|
|
764
763
|
this.requestFunction = requestFunction;
|
|
@@ -798,17 +797,17 @@ class ServerDataSource extends DataSource {
|
|
|
798
797
|
|
|
799
798
|
class PagerComponent {
|
|
800
799
|
constructor() {
|
|
801
|
-
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : []));
|
|
802
|
-
this.content = input(...(ngDevMode ? [undefined, { debugName: "content" }] : []));
|
|
803
|
-
this.pagingConf = computed(() => this.source().pagingConf(), ...(ngDevMode ? [{ debugName: "pagingConf" }] : []));
|
|
804
|
-
this.currentPerPage = computed(() => this.pagingConf().perPage, ...(ngDevMode ? [{ debugName: "currentPerPage" }] : []));
|
|
805
|
-
this.currentPage = computed(() => this.pagingConf().page, ...(ngDevMode ? [{ debugName: "currentPage" }] : []));
|
|
806
|
-
this.isShowTotal = computed(() => !!this.pagingConf().showTotal, ...(ngDevMode ? [{ debugName: "isShowTotal" }] : []));
|
|
807
|
-
this.count = computed(() => this.source().count(), ...(ngDevMode ? [{ debugName: "count" }] : []));
|
|
808
|
-
this.nextButtonText = computed(() => this.pagingConf().nextButtonText, ...(ngDevMode ? [{ debugName: "nextButtonText" }] : []));
|
|
809
|
-
this.prevButtonText = computed(() => this.pagingConf().nextButtonText, ...(ngDevMode ? [{ debugName: "prevButtonText" }] : []));
|
|
810
|
-
this.lastPage = computed(() => Math.ceil(this.count() / this.currentPerPage()) || 1, ...(ngDevMode ? [{ debugName: "lastPage" }] : []));
|
|
811
|
-
this.pages = computed(() => this.getPages(this.currentPage(), this.lastPage(), this.count()), ...(ngDevMode ? [{ debugName: "pages" }] : []));
|
|
800
|
+
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : /* istanbul ignore next */ []));
|
|
801
|
+
this.content = input(...(ngDevMode ? [undefined, { debugName: "content" }] : /* istanbul ignore next */ []));
|
|
802
|
+
this.pagingConf = computed(() => this.source().pagingConf(), ...(ngDevMode ? [{ debugName: "pagingConf" }] : /* istanbul ignore next */ []));
|
|
803
|
+
this.currentPerPage = computed(() => this.pagingConf().perPage, ...(ngDevMode ? [{ debugName: "currentPerPage" }] : /* istanbul ignore next */ []));
|
|
804
|
+
this.currentPage = computed(() => this.pagingConf().page, ...(ngDevMode ? [{ debugName: "currentPage" }] : /* istanbul ignore next */ []));
|
|
805
|
+
this.isShowTotal = computed(() => !!this.pagingConf().showTotal, ...(ngDevMode ? [{ debugName: "isShowTotal" }] : /* istanbul ignore next */ []));
|
|
806
|
+
this.count = computed(() => this.source().count(), ...(ngDevMode ? [{ debugName: "count" }] : /* istanbul ignore next */ []));
|
|
807
|
+
this.nextButtonText = computed(() => this.pagingConf().nextButtonText, ...(ngDevMode ? [{ debugName: "nextButtonText" }] : /* istanbul ignore next */ []));
|
|
808
|
+
this.prevButtonText = computed(() => this.pagingConf().nextButtonText, ...(ngDevMode ? [{ debugName: "prevButtonText" }] : /* istanbul ignore next */ []));
|
|
809
|
+
this.lastPage = computed(() => Math.ceil(this.count() / this.currentPerPage()) || 1, ...(ngDevMode ? [{ debugName: "lastPage" }] : /* istanbul ignore next */ []));
|
|
810
|
+
this.pages = computed(() => this.getPages(this.currentPage(), this.lastPage(), this.count()), ...(ngDevMode ? [{ debugName: "pages" }] : /* istanbul ignore next */ []));
|
|
812
811
|
}
|
|
813
812
|
paginate(page) {
|
|
814
813
|
this.source().setPage(page);
|
|
@@ -859,13 +858,13 @@ class PagerComponent {
|
|
|
859
858
|
}
|
|
860
859
|
this.source().setPaging(1, +target.value);
|
|
861
860
|
}
|
|
862
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
863
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
861
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: PagerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
862
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: PagerComponent, isStandalone: true, selector: "ng2-smart-table-pager", inputs: { source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"ng2-smart-table-pagination__wrap\">\n <div class=\"total-wrap\">\n <ng-content>\n @if (content()) {\n <ng-template [ngTemplateOutlet]=\"content()!\"></ng-template>\n } @else {\n @if (isShowTotal()) {\n <span class=\"total-count\"> Total: {{ count() }} </span>\n }\n }\n </ng-content>\n </div>\n <nav class=\"ng2-smart-table-pagination__nav\">\n <ul class=\"ng2-smart-table-pagination__list\">\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() <= 1\">\n <a tabindex=\"0\" (keyup)=\"prev()\" (click)=\"prev()\" aria-label=\"Prev\">\n @if (prevButtonText(); as text) {\n {{ text }}\n } @else {\n « Previous\n }\n </a>\n </li>\n @for (page of pages(); track $index) {\n <li class=\"ng2-smart-table-pagination__list-item\" [class.active]=\"currentPage() === page\">\n @if (isString(page) || currentPage() === page) {\n <span>\n {{ page }}\n </span>\n } @else {\n <a [tabindex]=\"page\" (keyup)=\"paginate(page)\" (click)=\"paginate(page)\">{{ page }}</a>\n }\n </li>\n }\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() >= lastPage()\">\n <a tabindex=\"10\" (keyup)=\"next()\" (click)=\"next()\" aria-label=\"Next\">\n @if (nextButtonText(); as text) {\n {{ text }}\n } @else {\n Next »\n }\n </a>\n </li>\n </ul>\n </nav>\n <div>\n @if ((pagingConf().perPageSelect?.length || 0) > 0) {\n <nav class=\"ng2-smart-pagination-per-page\">\n <label for=\"per-page\"> Per Page: </label>\n <select\n (change)=\"onChangePerPage($any($event.target))\"\n [ngModel]=\"currentPerPage()\"\n id=\"ng2-smart-pagination-per-page\">\n @for (item of pagingConf().perPageSelect; track $index) {\n <option [value]=\"item\">{{ item }}</option>\n }\n </select>\n </nav>\n }\n </div>\n</div>\n", styles: [".ng2-smart-table-pagination__wrap{width:100%;display:inline-flex;align-items:center;font-size:.875em;padding:1rem}.ng2-smart-table-pagination__nav{margin:0 auto}.ng2-smart-table-pagination__list{margin:0;list-style:none;display:flex}.ng2-smart-table-pagination__list-item span,.ng2-smart-table-pagination__list-item a{color:var(--layout-text-color);padding:.2rem .5rem}.ng2-smart-table-pagination__list-item:not(.disabled) a{cursor:pointer}.ng2-smart-table-pagination__list-item:not(.disabled) a:hover{background-color:var(--layout-background-color);color:var(--layout-text-color)}.ng2-smart-table-pagination__list-item.active span{background-color:var(--card-header-primary-background-color);color:var(--card-header-primary-text-color)}.ng2-smart-table-pagination__list-item.disabled{opacity:.5}\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])[formControlName],select:not([multiple])[formControl],select:not([multiple])[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"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
864
863
|
}
|
|
865
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
864
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: PagerComponent, decorators: [{
|
|
866
865
|
type: Component,
|
|
867
866
|
args: [{ selector: 'ng2-smart-table-pager', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormsModule, NgTemplateOutlet], template: "<div class=\"ng2-smart-table-pagination__wrap\">\n <div class=\"total-wrap\">\n <ng-content>\n @if (content()) {\n <ng-template [ngTemplateOutlet]=\"content()!\"></ng-template>\n } @else {\n @if (isShowTotal()) {\n <span class=\"total-count\"> Total: {{ count() }} </span>\n }\n }\n </ng-content>\n </div>\n <nav class=\"ng2-smart-table-pagination__nav\">\n <ul class=\"ng2-smart-table-pagination__list\">\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() <= 1\">\n <a tabindex=\"0\" (keyup)=\"prev()\" (click)=\"prev()\" aria-label=\"Prev\">\n @if (prevButtonText(); as text) {\n {{ text }}\n } @else {\n « Previous\n }\n </a>\n </li>\n @for (page of pages(); track $index) {\n <li class=\"ng2-smart-table-pagination__list-item\" [class.active]=\"currentPage() === page\">\n @if (isString(page) || currentPage() === page) {\n <span>\n {{ page }}\n </span>\n } @else {\n <a [tabindex]=\"page\" (keyup)=\"paginate(page)\" (click)=\"paginate(page)\">{{ page }}</a>\n }\n </li>\n }\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() >= lastPage()\">\n <a tabindex=\"10\" (keyup)=\"next()\" (click)=\"next()\" aria-label=\"Next\">\n @if (nextButtonText(); as text) {\n {{ text }}\n } @else {\n Next »\n }\n </a>\n </li>\n </ul>\n </nav>\n <div>\n @if ((pagingConf().perPageSelect?.length || 0) > 0) {\n <nav class=\"ng2-smart-pagination-per-page\">\n <label for=\"per-page\"> Per Page: </label>\n <select\n (change)=\"onChangePerPage($any($event.target))\"\n [ngModel]=\"currentPerPage()\"\n id=\"ng2-smart-pagination-per-page\">\n @for (item of pagingConf().perPageSelect; track $index) {\n <option [value]=\"item\">{{ item }}</option>\n }\n </select>\n </nav>\n }\n </div>\n</div>\n", styles: [".ng2-smart-table-pagination__wrap{width:100%;display:inline-flex;align-items:center;font-size:.875em;padding:1rem}.ng2-smart-table-pagination__nav{margin:0 auto}.ng2-smart-table-pagination__list{margin:0;list-style:none;display:flex}.ng2-smart-table-pagination__list-item span,.ng2-smart-table-pagination__list-item a{color:var(--layout-text-color);padding:.2rem .5rem}.ng2-smart-table-pagination__list-item:not(.disabled) a{cursor:pointer}.ng2-smart-table-pagination__list-item:not(.disabled) a:hover{background-color:var(--layout-background-color);color:var(--layout-text-color)}.ng2-smart-table-pagination__list-item.active span{background-color:var(--card-header-primary-background-color);color:var(--card-header-primary-text-color)}.ng2-smart-table-pagination__list-item.disabled{opacity:.5}\n"] }]
|
|
868
|
-
}] });
|
|
867
|
+
}], propDecorators: { source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: true }] }], content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }] } });
|
|
869
868
|
|
|
870
869
|
class CheckboxEditorComponent extends BaseEditorComponent {
|
|
871
870
|
constructor() {
|
|
@@ -880,8 +879,8 @@ class CheckboxEditorComponent extends BaseEditorComponent {
|
|
|
880
879
|
onChange(event) {
|
|
881
880
|
this.cell().setNewValue(event.target.checked ? this.trueVal : this.falseVal);
|
|
882
881
|
}
|
|
883
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
884
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
882
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CheckboxEditorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
883
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: CheckboxEditorComponent, isStandalone: true, selector: "ng2-checkbox-editor", usesInheritance: true, ngImport: i0, template: `
|
|
885
884
|
<input
|
|
886
885
|
[class]="inputClass()"
|
|
887
886
|
type="checkbox"
|
|
@@ -892,7 +891,7 @@ class CheckboxEditorComponent extends BaseEditorComponent {
|
|
|
892
891
|
[checked]="cell().getValue() === trueVal" />
|
|
893
892
|
`, isInline: true, styles: [":host input,:host textarea{width:100%;line-height:normal;padding:.375em .75em}:host .ng2-input-number-editor{-moz-appearance:textfield}:host .ng2-input-number-editor::-webkit-outer-spin-button,:host .ng2-input-number-editor::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
894
893
|
}
|
|
895
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
894
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CheckboxEditorComponent, decorators: [{
|
|
896
895
|
type: Component,
|
|
897
896
|
args: [{ selector: 'ng2-checkbox-editor', template: `
|
|
898
897
|
<input
|
|
@@ -907,8 +906,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
907
906
|
}] });
|
|
908
907
|
|
|
909
908
|
class InputEditorComponent extends BaseEditorComponent {
|
|
910
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
911
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
909
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InputEditorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
910
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: InputEditorComponent, isStandalone: true, selector: "ng2-input-editor", usesInheritance: true, ngImport: i0, template: `
|
|
912
911
|
<input
|
|
913
912
|
type="text"
|
|
914
913
|
[class]="inputClass()"
|
|
@@ -920,7 +919,7 @@ class InputEditorComponent extends BaseEditorComponent {
|
|
|
920
919
|
[disabled]="!cell().isEditable()" />
|
|
921
920
|
`, isInline: true, styles: [":host input,:host textarea{width:100%;line-height:normal;padding:.375em .75em}:host .ng2-input-number-editor{-moz-appearance:textfield}:host .ng2-input-number-editor::-webkit-outer-spin-button,:host .ng2-input-number-editor::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: 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 }); }
|
|
922
921
|
}
|
|
923
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
922
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InputEditorComponent, decorators: [{
|
|
924
923
|
type: Component,
|
|
925
924
|
args: [{ selector: 'ng2-input-editor', template: `
|
|
926
925
|
<input
|
|
@@ -936,8 +935,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
936
935
|
}] });
|
|
937
936
|
|
|
938
937
|
class InputNumberEditorComponent extends BaseEditorComponent {
|
|
939
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
940
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
938
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InputNumberEditorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
939
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: InputNumberEditorComponent, isStandalone: true, selector: "ng2-input-number-editor", usesInheritance: true, ngImport: i0, template: `
|
|
941
940
|
<input
|
|
942
941
|
type="number"
|
|
943
942
|
class="form-control ng2-input-number-editor"
|
|
@@ -949,7 +948,7 @@ class InputNumberEditorComponent extends BaseEditorComponent {
|
|
|
949
948
|
[disabled]="!cell().isEditable()" />
|
|
950
949
|
`, isInline: true, styles: [":host input,:host textarea{width:100%;line-height:normal;padding:.375em .75em}:host .ng2-input-number-editor{-moz-appearance:textfield}:host .ng2-input-number-editor::-webkit-outer-spin-button,:host .ng2-input-number-editor::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { 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 }); }
|
|
951
950
|
}
|
|
952
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
951
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InputNumberEditorComponent, decorators: [{
|
|
953
952
|
type: Component,
|
|
954
953
|
args: [{ selector: 'ng2-input-number-editor', template: `
|
|
955
954
|
<input
|
|
@@ -965,8 +964,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
965
964
|
}] });
|
|
966
965
|
|
|
967
966
|
class SelectEditorComponent extends BaseEditorComponent {
|
|
968
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
969
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
967
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: SelectEditorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
968
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: SelectEditorComponent, isStandalone: true, selector: "ng2-select-editor", usesInheritance: true, ngImport: i0, template: `
|
|
970
969
|
<select
|
|
971
970
|
[class]="inputClass()"
|
|
972
971
|
class="form-control"
|
|
@@ -982,7 +981,7 @@ class SelectEditorComponent extends BaseEditorComponent {
|
|
|
982
981
|
</select>
|
|
983
982
|
`, isInline: true, 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])[formControlName],select:not([multiple])[formControl],select:not([multiple])[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 }); }
|
|
984
983
|
}
|
|
985
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
984
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: SelectEditorComponent, decorators: [{
|
|
986
985
|
type: Component,
|
|
987
986
|
args: [{
|
|
988
987
|
selector: 'ng2-select-editor',
|
|
@@ -1007,8 +1006,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1007
1006
|
}] });
|
|
1008
1007
|
|
|
1009
1008
|
class TextareaEditorComponent extends BaseEditorComponent {
|
|
1010
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1011
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1009
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TextareaEditorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1010
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: TextareaEditorComponent, isStandalone: true, selector: "ng2-textarea-editor", usesInheritance: true, ngImport: i0, template: `
|
|
1012
1011
|
<textarea
|
|
1013
1012
|
[class]="inputClass()"
|
|
1014
1013
|
class="form-control"
|
|
@@ -1020,7 +1019,7 @@ class TextareaEditorComponent extends BaseEditorComponent {
|
|
|
1020
1019
|
</textarea>
|
|
1021
1020
|
`, isInline: true, styles: [":host input,:host textarea{width:100%;line-height:normal;padding:.375em .75em}:host .ng2-input-number-editor{-moz-appearance:textfield}:host .ng2-input-number-editor::-webkit-outer-spin-button,:host .ng2-input-number-editor::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: 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 }); }
|
|
1022
1021
|
}
|
|
1023
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1022
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TextareaEditorComponent, decorators: [{
|
|
1024
1023
|
type: Component,
|
|
1025
1024
|
args: [{ selector: 'ng2-textarea-editor', template: `
|
|
1026
1025
|
<textarea
|
|
@@ -1045,12 +1044,12 @@ class BuildInEditorComponent extends BaseEditorComponent {
|
|
|
1045
1044
|
return editor.type || columnType;
|
|
1046
1045
|
}
|
|
1047
1046
|
return columnType;
|
|
1048
|
-
}, ...(ngDevMode ? [{ debugName: "editorType" }] : []));
|
|
1047
|
+
}, ...(ngDevMode ? [{ debugName: "editorType" }] : /* istanbul ignore next */ []));
|
|
1049
1048
|
}
|
|
1050
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1051
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1049
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BuildInEditorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1050
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: BuildInEditorComponent, isStandalone: true, selector: "ng2-table-cell-build-in-editor", usesInheritance: true, ngImport: i0, template: "<div role=\"none\" (click)=\"$event.stopPropagation()\">\n @switch (editorType()) {\n @case ('list') {\n <ng2-select-editor [cell]=\"cell()\"> </ng2-select-editor>\n }\n @case ('textarea') {\n <ng2-textarea-editor [cell]=\"cell()\"> </ng2-textarea-editor>\n }\n @case ('checkbox') {\n <ng2-checkbox-editor [cell]=\"cell()\"> </ng2-checkbox-editor>\n }\n @case ('number') {\n <ng2-input-number-editor [cell]=\"cell()\"> </ng2-input-number-editor>\n }\n @default {\n <ng2-input-editor [cell]=\"cell()\"> </ng2-input-editor>\n }\n }\n</div>\n", dependencies: [{ kind: "component", type: SelectEditorComponent, selector: "ng2-select-editor" }, { kind: "component", type: TextareaEditorComponent, selector: "ng2-textarea-editor" }, { kind: "component", type: CheckboxEditorComponent, selector: "ng2-checkbox-editor" }, { kind: "component", type: InputEditorComponent, selector: "ng2-input-editor" }, { kind: "component", type: InputNumberEditorComponent, selector: "ng2-input-number-editor" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1052
1051
|
}
|
|
1053
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1052
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BuildInEditorComponent, decorators: [{
|
|
1054
1053
|
type: Component,
|
|
1055
1054
|
args: [{ selector: 'ng2-table-cell-build-in-editor', imports: [
|
|
1056
1055
|
SelectEditorComponent,
|
|
@@ -1086,10 +1085,10 @@ class CustomEditComponent extends BaseEditorComponent {
|
|
|
1086
1085
|
this.customComponent.destroy();
|
|
1087
1086
|
}
|
|
1088
1087
|
}
|
|
1089
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1090
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1088
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CustomEditComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1089
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: CustomEditComponent, isStandalone: true, selector: "ng2-table-cell-custom-editor", viewQueries: [{ propertyName: "dynamicTarget", first: true, predicate: ["dynamicTarget"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: ` <ng-template #dynamicTarget></ng-template> `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1091
1090
|
}
|
|
1092
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1091
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CustomEditComponent, decorators: [{
|
|
1093
1092
|
type: Component,
|
|
1094
1093
|
args: [{
|
|
1095
1094
|
selector: 'ng2-table-cell-custom-editor',
|
|
@@ -1103,7 +1102,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1103
1102
|
|
|
1104
1103
|
class EditCellComponent {
|
|
1105
1104
|
constructor() {
|
|
1106
|
-
this.cell = input.required(...(ngDevMode ? [{ debugName: "cell" }] : []));
|
|
1105
|
+
this.cell = input.required(...(ngDevMode ? [{ debugName: "cell" }] : /* istanbul ignore next */ []));
|
|
1107
1106
|
}
|
|
1108
1107
|
getEditorType() {
|
|
1109
1108
|
const editor = this.cell().column.editor;
|
|
@@ -1112,8 +1111,8 @@ class EditCellComponent {
|
|
|
1112
1111
|
}
|
|
1113
1112
|
return 'text';
|
|
1114
1113
|
}
|
|
1115
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1116
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1114
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: EditCellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1115
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: EditCellComponent, isStandalone: true, selector: "ng2-table-cell-edit-mode", inputs: { cell: { classPropertyName: "cell", publicName: "cell", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
|
|
1117
1116
|
<div>
|
|
1118
1117
|
@switch (getEditorType()) {
|
|
1119
1118
|
@case ('custom') {
|
|
@@ -1126,7 +1125,7 @@ class EditCellComponent {
|
|
|
1126
1125
|
</div>
|
|
1127
1126
|
`, isInline: true, dependencies: [{ kind: "component", type: CustomEditComponent, selector: "ng2-table-cell-custom-editor" }, { kind: "component", type: BuildInEditorComponent, selector: "ng2-table-cell-build-in-editor" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1128
1127
|
}
|
|
1129
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1128
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: EditCellComponent, decorators: [{
|
|
1130
1129
|
type: Component,
|
|
1131
1130
|
args: [{
|
|
1132
1131
|
selector: 'ng2-table-cell-edit-mode',
|
|
@@ -1145,21 +1144,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1145
1144
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1146
1145
|
imports: [CustomEditComponent, BuildInEditorComponent],
|
|
1147
1146
|
}]
|
|
1148
|
-
}] });
|
|
1147
|
+
}], propDecorators: { cell: [{ type: i0.Input, args: [{ isSignal: true, alias: "cell", required: true }] }] } });
|
|
1149
1148
|
|
|
1150
1149
|
class CustomViewComponent {
|
|
1151
1150
|
constructor() {
|
|
1152
|
-
this.cell = input.required(...(ngDevMode ? [{ debugName: "cell" }] : []));
|
|
1151
|
+
this.cell = input.required(...(ngDevMode ? [{ debugName: "cell" }] : /* istanbul ignore next */ []));
|
|
1153
1152
|
this.inputs = computed(() => ({
|
|
1154
1153
|
rowData: this.cell().row.rowData(),
|
|
1155
1154
|
value: this.cell().getValue(),
|
|
1156
1155
|
...this.cell().column.renderComponentInputs,
|
|
1157
|
-
}), ...(ngDevMode ? [{ debugName: "inputs" }] : []));
|
|
1156
|
+
}), ...(ngDevMode ? [{ debugName: "inputs" }] : /* istanbul ignore next */ []));
|
|
1158
1157
|
}
|
|
1159
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1160
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
1158
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CustomViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1159
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: CustomViewComponent, isStandalone: true, selector: "ng2-custom-view-component", inputs: { cell: { classPropertyName: "cell", publicName: "cell", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `<ng-template *ngComponentOutlet="cell().column.renderComponent!; inputs: inputs()"></ng-template>`, isInline: true, dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1161
1160
|
}
|
|
1162
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1161
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CustomViewComponent, decorators: [{
|
|
1163
1162
|
type: Component,
|
|
1164
1163
|
args: [{
|
|
1165
1164
|
selector: 'ng2-custom-view-component',
|
|
@@ -1167,14 +1166,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1167
1166
|
imports: [NgComponentOutlet],
|
|
1168
1167
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1169
1168
|
}]
|
|
1170
|
-
}] });
|
|
1169
|
+
}], propDecorators: { cell: [{ type: i0.Input, args: [{ isSignal: true, alias: "cell", required: true }] }] } });
|
|
1171
1170
|
|
|
1172
1171
|
class ViewCellComponent {
|
|
1173
1172
|
constructor() {
|
|
1174
|
-
this.cell = input.required(...(ngDevMode ? [{ debugName: "cell" }] : []));
|
|
1173
|
+
this.cell = input.required(...(ngDevMode ? [{ debugName: "cell" }] : /* istanbul ignore next */ []));
|
|
1175
1174
|
}
|
|
1176
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1177
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1175
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ViewCellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1176
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ViewCellComponent, isStandalone: true, selector: "ng2-table-cell-view-mode", inputs: { cell: { classPropertyName: "cell", publicName: "cell", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
|
|
1178
1177
|
<div>
|
|
1179
1178
|
@switch (cell().column.type) {
|
|
1180
1179
|
@case ('custom') {
|
|
@@ -1190,7 +1189,7 @@ class ViewCellComponent {
|
|
|
1190
1189
|
</div>
|
|
1191
1190
|
`, isInline: true, dependencies: [{ kind: "component", type: CustomViewComponent, selector: "ng2-custom-view-component", inputs: ["cell"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1192
1191
|
}
|
|
1193
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1192
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ViewCellComponent, decorators: [{
|
|
1194
1193
|
type: Component,
|
|
1195
1194
|
args: [{
|
|
1196
1195
|
selector: 'ng2-table-cell-view-mode',
|
|
@@ -1212,15 +1211,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1212
1211
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1213
1212
|
imports: [CustomViewComponent],
|
|
1214
1213
|
}]
|
|
1215
|
-
}] });
|
|
1214
|
+
}], propDecorators: { cell: [{ type: i0.Input, args: [{ isSignal: true, alias: "cell", required: true }] }] } });
|
|
1216
1215
|
|
|
1217
1216
|
class CellComponent {
|
|
1218
1217
|
constructor() {
|
|
1219
|
-
this.cell = input.required(...(ngDevMode ? [{ debugName: "cell" }] : []));
|
|
1220
|
-
this.isInEditing = input(false, ...(ngDevMode ? [{ debugName: "isInEditing" }] : []));
|
|
1218
|
+
this.cell = input.required(...(ngDevMode ? [{ debugName: "cell" }] : /* istanbul ignore next */ []));
|
|
1219
|
+
this.isInEditing = input(false, ...(ngDevMode ? [{ debugName: "isInEditing" }] : /* istanbul ignore next */ []));
|
|
1221
1220
|
}
|
|
1222
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1223
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1221
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1222
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CellComponent, isStandalone: true, selector: "ng2-smart-table-cell", inputs: { cell: { classPropertyName: "cell", publicName: "cell", isSignal: true, isRequired: true, transformFunction: null }, isInEditing: { classPropertyName: "isInEditing", publicName: "isInEditing", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
1224
1223
|
@if (!isInEditing()) {
|
|
1225
1224
|
<ng2-table-cell-view-mode [cell]="cell()"></ng2-table-cell-view-mode>
|
|
1226
1225
|
} @else {
|
|
@@ -1228,7 +1227,7 @@ class CellComponent {
|
|
|
1228
1227
|
}
|
|
1229
1228
|
`, isInline: true, dependencies: [{ kind: "component", type: ViewCellComponent, selector: "ng2-table-cell-view-mode", inputs: ["cell"] }, { kind: "component", type: EditCellComponent, selector: "ng2-table-cell-edit-mode", inputs: ["cell"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1230
1229
|
}
|
|
1231
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1230
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CellComponent, decorators: [{
|
|
1232
1231
|
type: Component,
|
|
1233
1232
|
args: [{
|
|
1234
1233
|
selector: 'ng2-smart-table-cell',
|
|
@@ -1242,36 +1241,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1242
1241
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1243
1242
|
imports: [ViewCellComponent, EditCellComponent],
|
|
1244
1243
|
}]
|
|
1245
|
-
}] });
|
|
1244
|
+
}], propDecorators: { cell: [{ type: i0.Input, args: [{ isSignal: true, alias: "cell", required: true }] }], isInEditing: [{ type: i0.Input, args: [{ isSignal: true, alias: "isInEditing", required: false }] }] } });
|
|
1246
1245
|
|
|
1247
1246
|
class TbodyCreateCancelComponent {
|
|
1248
1247
|
constructor() {
|
|
1249
|
-
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : []));
|
|
1250
|
-
this.rowIndex = input(...(ngDevMode ? [undefined, { debugName: "rowIndex" }] : []));
|
|
1251
|
-
this.rowPending = input(false, ...(ngDevMode ? [{ debugName: "rowPending" }] : []));
|
|
1248
|
+
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : /* istanbul ignore next */ []));
|
|
1249
|
+
this.rowIndex = input(...(ngDevMode ? [undefined, { debugName: "rowIndex" }] : /* istanbul ignore next */ []));
|
|
1250
|
+
this.rowPending = input(false, ...(ngDevMode ? [{ debugName: "rowPending" }] : /* istanbul ignore next */ []));
|
|
1252
1251
|
this.save = output();
|
|
1253
1252
|
this.cancelEdit = output();
|
|
1254
1253
|
this.cancelButtonContent = computed(() => {
|
|
1255
1254
|
const edit = this.grid().settings().edit;
|
|
1256
1255
|
return edit ? edit.cancelButtonContent || 'Cancel' : 'Cancel';
|
|
1257
|
-
}, ...(ngDevMode ? [{ debugName: "cancelButtonContent" }] : []));
|
|
1256
|
+
}, ...(ngDevMode ? [{ debugName: "cancelButtonContent" }] : /* istanbul ignore next */ []));
|
|
1258
1257
|
this.saveButtonContent = computed(() => {
|
|
1259
1258
|
const edit = this.grid().settings().edit;
|
|
1260
1259
|
return edit ? edit.saveButtonContent || 'Save' : 'Save';
|
|
1261
|
-
}, ...(ngDevMode ? [{ debugName: "saveButtonContent" }] : []));
|
|
1260
|
+
}, ...(ngDevMode ? [{ debugName: "saveButtonContent" }] : /* istanbul ignore next */ []));
|
|
1262
1261
|
}
|
|
1263
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1264
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1262
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TbodyCreateCancelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1263
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: TbodyCreateCancelComponent, isStandalone: true, selector: "ng2-st-tbody-create-cancel", inputs: { grid: { classPropertyName: "grid", publicName: "grid", isSignal: true, isRequired: true, transformFunction: null }, rowIndex: { classPropertyName: "rowIndex", publicName: "rowIndex", isSignal: true, isRequired: false, transformFunction: null }, rowPending: { classPropertyName: "rowPending", publicName: "rowPending", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { save: "save", cancelEdit: "cancelEdit" }, ngImport: i0, template: "<div class=\"buttons-wrap\">\n @if (!rowPending()) {\n <a\n href=\"#\"\n [id]=\"'row-' + rowIndex() + '_editing-confirm-button'\"\n class=\"ng2-smart-action ng2-smart-action-edit-save\"\n [innerHTML]=\"saveButtonContent()\"\n (click)=\"$event.preventDefault(); save.emit($event)\"></a>\n <a\n href=\"#\"\n [id]=\"'row-' + rowIndex() + '_editing-cancel-button'\"\n class=\"ng2-smart-action ng2-smart-action-edit-cancel\"\n [innerHTML]=\"cancelButtonContent()\"\n (click)=\"$event.preventDefault(); cancelEdit.emit($event)\"></a>\n } @else {\n <a class=\"ng2-smart-action ng2-smart-action-edit-save\">\n <ng-container [ngTemplateOutlet]=\"spinner\"></ng-container>\n </a>\n <a class=\"ng2-smart-action ng2-smart-action-edit-save\">\n <ng-container [ngTemplateOutlet]=\"spinner\"></ng-container>\n </a>\n }\n</div>\n\n<ng-template #spinner>\n <svg\n role=\"none\"\n (click)=\"$event.stopPropagation()\"\n style=\"height: 2rem; width: 2rem\"\n version=\"1.1\"\n id=\"L9\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 100 100\"\n enable-background=\"new 0 0 0 0\"\n xml:space=\"preserve\">\n <path\n fill=\"#e9e9e9\"\n d=\"M73,50c0-12.7-10.3-23-23-23S27,37.3,27,50 M30.9,50c0-10.5,8.5-19.1,19.1-19.1S69.1,39.5,69.1,50\">\n <animateTransform\n attributeName=\"transform\"\n attributeType=\"XML\"\n type=\"rotate\"\n dur=\"1s\"\n from=\"0 50 50\"\n to=\"360 50 50\"\n repeatCount=\"indefinite\" />\n </path>\n </svg>\n</ng-template>\n", styles: [".buttons-wrap{display:flex;gap:.5rem}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1265
1264
|
}
|
|
1266
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1265
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TbodyCreateCancelComponent, decorators: [{
|
|
1267
1266
|
type: Component,
|
|
1268
1267
|
args: [{ selector: 'ng2-st-tbody-create-cancel', imports: [NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"buttons-wrap\">\n @if (!rowPending()) {\n <a\n href=\"#\"\n [id]=\"'row-' + rowIndex() + '_editing-confirm-button'\"\n class=\"ng2-smart-action ng2-smart-action-edit-save\"\n [innerHTML]=\"saveButtonContent()\"\n (click)=\"$event.preventDefault(); save.emit($event)\"></a>\n <a\n href=\"#\"\n [id]=\"'row-' + rowIndex() + '_editing-cancel-button'\"\n class=\"ng2-smart-action ng2-smart-action-edit-cancel\"\n [innerHTML]=\"cancelButtonContent()\"\n (click)=\"$event.preventDefault(); cancelEdit.emit($event)\"></a>\n } @else {\n <a class=\"ng2-smart-action ng2-smart-action-edit-save\">\n <ng-container [ngTemplateOutlet]=\"spinner\"></ng-container>\n </a>\n <a class=\"ng2-smart-action ng2-smart-action-edit-save\">\n <ng-container [ngTemplateOutlet]=\"spinner\"></ng-container>\n </a>\n }\n</div>\n\n<ng-template #spinner>\n <svg\n role=\"none\"\n (click)=\"$event.stopPropagation()\"\n style=\"height: 2rem; width: 2rem\"\n version=\"1.1\"\n id=\"L9\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 100 100\"\n enable-background=\"new 0 0 0 0\"\n xml:space=\"preserve\">\n <path\n fill=\"#e9e9e9\"\n d=\"M73,50c0-12.7-10.3-23-23-23S27,37.3,27,50 M30.9,50c0-10.5,8.5-19.1,19.1-19.1S69.1,39.5,69.1,50\">\n <animateTransform\n attributeName=\"transform\"\n attributeType=\"XML\"\n type=\"rotate\"\n dur=\"1s\"\n from=\"0 50 50\"\n to=\"360 50 50\"\n repeatCount=\"indefinite\" />\n </path>\n </svg>\n</ng-template>\n", styles: [".buttons-wrap{display:flex;gap:.5rem}\n"] }]
|
|
1269
|
-
}] });
|
|
1268
|
+
}], propDecorators: { grid: [{ type: i0.Input, args: [{ isSignal: true, alias: "grid", required: true }] }], rowIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowIndex", required: false }] }], rowPending: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowPending", required: false }] }], save: [{ type: i0.Output, args: ["save"] }], cancelEdit: [{ type: i0.Output, args: ["cancelEdit"] }] } });
|
|
1270
1269
|
|
|
1271
1270
|
class RowActionsComponent {
|
|
1272
1271
|
constructor() {
|
|
1273
|
-
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : []));
|
|
1274
|
-
this.row = input.required(...(ngDevMode ? [{ debugName: "row" }] : []));
|
|
1272
|
+
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : /* istanbul ignore next */ []));
|
|
1273
|
+
this.row = input.required(...(ngDevMode ? [{ debugName: "row" }] : /* istanbul ignore next */ []));
|
|
1275
1274
|
this.editEmitter = output();
|
|
1276
1275
|
this.deleteEmitter = output();
|
|
1277
1276
|
this.customActionEmitter = output();
|
|
@@ -1282,7 +1281,7 @@ class RowActionsComponent {
|
|
|
1282
1281
|
}
|
|
1283
1282
|
const list = actions.custom.filter((action) => !action.hasPermissionFunction ? true : action.hasPermissionFunction(this.row().rowData()));
|
|
1284
1283
|
return list;
|
|
1285
|
-
}, ...(ngDevMode ? [{ debugName: "customActions" }] : []));
|
|
1284
|
+
}, ...(ngDevMode ? [{ debugName: "customActions" }] : /* istanbul ignore next */ []));
|
|
1286
1285
|
this.isActionEditActive = computed(() => {
|
|
1287
1286
|
const actions = this.grid().settings().actions;
|
|
1288
1287
|
const editConfig = this.grid().settings().edit;
|
|
@@ -1293,7 +1292,7 @@ class RowActionsComponent {
|
|
|
1293
1292
|
return true;
|
|
1294
1293
|
}
|
|
1295
1294
|
return editConfig.hasPermissionFunction(this.row().rowData());
|
|
1296
|
-
}, ...(ngDevMode ? [{ debugName: "isActionEditActive" }] : []));
|
|
1295
|
+
}, ...(ngDevMode ? [{ debugName: "isActionEditActive" }] : /* istanbul ignore next */ []));
|
|
1297
1296
|
this.isActionDeleteActive = computed(() => {
|
|
1298
1297
|
const actions = this.grid().settings().actions;
|
|
1299
1298
|
const deleteConfig = this.grid().settings().delete;
|
|
@@ -1304,24 +1303,24 @@ class RowActionsComponent {
|
|
|
1304
1303
|
return true;
|
|
1305
1304
|
}
|
|
1306
1305
|
return deleteConfig.hasPermissionFunction(this.row().rowData());
|
|
1307
|
-
}, ...(ngDevMode ? [{ debugName: "isActionDeleteActive" }] : []));
|
|
1306
|
+
}, ...(ngDevMode ? [{ debugName: "isActionDeleteActive" }] : /* istanbul ignore next */ []));
|
|
1308
1307
|
this.isExternalMode = computed(() => {
|
|
1309
1308
|
return this.grid().settings().mode === 'external';
|
|
1310
|
-
}, ...(ngDevMode ? [{ debugName: "isExternalMode" }] : []));
|
|
1309
|
+
}, ...(ngDevMode ? [{ debugName: "isExternalMode" }] : /* istanbul ignore next */ []));
|
|
1311
1310
|
this.editRowButtonContent = computed(() => {
|
|
1312
1311
|
const edit = this.grid().settings().edit;
|
|
1313
1312
|
return edit ? edit.editButtonContent || 'Edit' : 'Edit';
|
|
1314
|
-
}, ...(ngDevMode ? [{ debugName: "editRowButtonContent" }] : []));
|
|
1313
|
+
}, ...(ngDevMode ? [{ debugName: "editRowButtonContent" }] : /* istanbul ignore next */ []));
|
|
1315
1314
|
this.deleteRowButtonContent = computed(() => {
|
|
1316
1315
|
const deleteConfig = this.grid().settings().delete;
|
|
1317
1316
|
return deleteConfig ? deleteConfig.deleteButtonContent || 'Delete' : 'Delete';
|
|
1318
|
-
}, ...(ngDevMode ? [{ debugName: "deleteRowButtonContent" }] : []));
|
|
1317
|
+
}, ...(ngDevMode ? [{ debugName: "deleteRowButtonContent" }] : /* istanbul ignore next */ []));
|
|
1319
1318
|
this.allActionsCountArray = computed(() => {
|
|
1320
1319
|
let length = this.customActions().length;
|
|
1321
1320
|
length += this.isActionDeleteActive() ? 1 : 0;
|
|
1322
1321
|
length += this.isActionEditActive() ? 1 : 0;
|
|
1323
1322
|
return new Array(length).fill('');
|
|
1324
|
-
}, ...(ngDevMode ? [{ debugName: "allActionsCountArray" }] : []));
|
|
1323
|
+
}, ...(ngDevMode ? [{ debugName: "allActionsCountArray" }] : /* istanbul ignore next */ []));
|
|
1325
1324
|
}
|
|
1326
1325
|
onCustom(action) {
|
|
1327
1326
|
this.customActionEmitter.emit(action.name);
|
|
@@ -1336,21 +1335,21 @@ class RowActionsComponent {
|
|
|
1336
1335
|
event.stopPropagation();
|
|
1337
1336
|
this.deleteEmitter.emit();
|
|
1338
1337
|
}
|
|
1339
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1340
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1338
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RowActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1339
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: RowActionsComponent, isStandalone: true, selector: "ng2-row-actions", inputs: { grid: { classPropertyName: "grid", publicName: "grid", isSignal: true, isRequired: true, transformFunction: null }, row: { classPropertyName: "row", publicName: "row", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { editEmitter: "editEmitter", deleteEmitter: "deleteEmitter", customActionEmitter: "customActionEmitter" }, ngImport: i0, template: "@if (!row().pending()) {\n @if (isActionEditActive()) {\n <a\n href=\"#\"\n [id]=\"'row-' + row().index + '_action-edit-button'\"\n class=\"ng2-smart-action ng2-smart-action-edit-edit\"\n [innerHTML]=\"editRowButtonContent()\"\n (click)=\"$event.stopPropagation(); $event.preventDefault(); onEdit($event)\"></a>\n }\n @if (isActionDeleteActive()) {\n <a\n href=\"#\"\n [id]=\"'row-' + row().index + '_action-delete-button'\"\n class=\"ng2-smart-action ng2-smart-action-delete-delete\"\n [innerHTML]=\"deleteRowButtonContent()\"\n (click)=\"$event.stopPropagation(); $event.preventDefault(); onDelete($event)\"></a>\n }\n @for (action of customActions(); track action.name) {\n <a\n [id]=\"'row-' + row().index + '_action-' + action.name + '-button'\"\n href=\"#\"\n class=\"ng2-smart-action ng2-smart-action-custom-custom\"\n [innerHTML]=\"action.title\"\n (click)=\"$event.stopPropagation(); $event.preventDefault(); onCustom(action)\"></a>\n }\n} @else {\n @for (item of allActionsCountArray(); track $index) {\n <ng-container [ngTemplateOutlet]=\"spinner\"></ng-container>\n }\n}\n\n<ng-template #spinner>\n <svg\n role=\"none\"\n (click)=\"$event.stopPropagation()\"\n style=\"height: 2rem; width: 2rem\"\n version=\"1.1\"\n id=\"L9\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 100 100\"\n enable-background=\"new 0 0 0 0\"\n xml:space=\"preserve\">\n <path\n fill=\"#e9e9e9\"\n d=\"M73,50c0-12.7-10.3-23-23-23S27,37.3,27,50 M30.9,50c0-10.5,8.5-19.1,19.1-19.1S69.1,39.5,69.1,50\">\n <animateTransform\n attributeName=\"transform\"\n attributeType=\"XML\"\n type=\"rotate\"\n dur=\"1s\"\n from=\"0 50 50\"\n to=\"360 50 50\"\n repeatCount=\"indefinite\" />\n </path>\n </svg>\n</ng-template>\n", styles: [":host{display:flex}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1341
1340
|
}
|
|
1342
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1341
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RowActionsComponent, decorators: [{
|
|
1343
1342
|
type: Component,
|
|
1344
1343
|
args: [{ selector: 'ng2-row-actions', imports: [NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (!row().pending()) {\n @if (isActionEditActive()) {\n <a\n href=\"#\"\n [id]=\"'row-' + row().index + '_action-edit-button'\"\n class=\"ng2-smart-action ng2-smart-action-edit-edit\"\n [innerHTML]=\"editRowButtonContent()\"\n (click)=\"$event.stopPropagation(); $event.preventDefault(); onEdit($event)\"></a>\n }\n @if (isActionDeleteActive()) {\n <a\n href=\"#\"\n [id]=\"'row-' + row().index + '_action-delete-button'\"\n class=\"ng2-smart-action ng2-smart-action-delete-delete\"\n [innerHTML]=\"deleteRowButtonContent()\"\n (click)=\"$event.stopPropagation(); $event.preventDefault(); onDelete($event)\"></a>\n }\n @for (action of customActions(); track action.name) {\n <a\n [id]=\"'row-' + row().index + '_action-' + action.name + '-button'\"\n href=\"#\"\n class=\"ng2-smart-action ng2-smart-action-custom-custom\"\n [innerHTML]=\"action.title\"\n (click)=\"$event.stopPropagation(); $event.preventDefault(); onCustom(action)\"></a>\n }\n} @else {\n @for (item of allActionsCountArray(); track $index) {\n <ng-container [ngTemplateOutlet]=\"spinner\"></ng-container>\n }\n}\n\n<ng-template #spinner>\n <svg\n role=\"none\"\n (click)=\"$event.stopPropagation()\"\n style=\"height: 2rem; width: 2rem\"\n version=\"1.1\"\n id=\"L9\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 100 100\"\n enable-background=\"new 0 0 0 0\"\n xml:space=\"preserve\">\n <path\n fill=\"#e9e9e9\"\n d=\"M73,50c0-12.7-10.3-23-23-23S27,37.3,27,50 M30.9,50c0-10.5,8.5-19.1,19.1-19.1S69.1,39.5,69.1,50\">\n <animateTransform\n attributeName=\"transform\"\n attributeType=\"XML\"\n type=\"rotate\"\n dur=\"1s\"\n from=\"0 50 50\"\n to=\"360 50 50\"\n repeatCount=\"indefinite\" />\n </path>\n </svg>\n</ng-template>\n", styles: [":host{display:flex}\n"] }]
|
|
1345
|
-
}] });
|
|
1344
|
+
}], propDecorators: { grid: [{ type: i0.Input, args: [{ isSignal: true, alias: "grid", required: true }] }], row: [{ type: i0.Input, args: [{ isSignal: true, alias: "row", required: true }] }], editEmitter: [{ type: i0.Output, args: ["editEmitter"] }], deleteEmitter: [{ type: i0.Output, args: ["deleteEmitter"] }], customActionEmitter: [{ type: i0.Output, args: ["customActionEmitter"] }] } });
|
|
1346
1345
|
|
|
1347
1346
|
class TrowComponent {
|
|
1348
1347
|
constructor() {
|
|
1349
|
-
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : []));
|
|
1350
|
-
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : []));
|
|
1351
|
-
this.row = input.required(...(ngDevMode ? [{ debugName: "row" }] : []));
|
|
1352
|
-
this.isMobileView = input(false, ...(ngDevMode ? [{ debugName: "isMobileView" }] : []));
|
|
1353
|
-
this.isCreateRow = input(false, ...(ngDevMode ? [{ debugName: "isCreateRow" }] : []));
|
|
1348
|
+
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : /* istanbul ignore next */ []));
|
|
1349
|
+
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : /* istanbul ignore next */ []));
|
|
1350
|
+
this.row = input.required(...(ngDevMode ? [{ debugName: "row" }] : /* istanbul ignore next */ []));
|
|
1351
|
+
this.isMobileView = input(false, ...(ngDevMode ? [{ debugName: "isMobileView" }] : /* istanbul ignore next */ []));
|
|
1352
|
+
this.isCreateRow = input(false, ...(ngDevMode ? [{ debugName: "isCreateRow" }] : /* istanbul ignore next */ []));
|
|
1354
1353
|
this.edit = output();
|
|
1355
1354
|
this.editCancel = output();
|
|
1356
1355
|
this.editConfirmed = output();
|
|
@@ -1376,22 +1375,22 @@ class TrowComponent {
|
|
|
1376
1375
|
this.editCancel.emit();
|
|
1377
1376
|
this.row()?.isInEditing.set(false);
|
|
1378
1377
|
}
|
|
1379
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1380
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1378
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TrowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1379
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: TrowComponent, isStandalone: true, selector: "[ng2-st-trow]", inputs: { grid: { classPropertyName: "grid", publicName: "grid", isSignal: true, isRequired: true, transformFunction: null }, source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, row: { classPropertyName: "row", publicName: "row", isSignal: true, isRequired: true, transformFunction: null }, isMobileView: { classPropertyName: "isMobileView", publicName: "isMobileView", isSignal: true, isRequired: false, transformFunction: null }, isCreateRow: { classPropertyName: "isCreateRow", publicName: "isCreateRow", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { edit: "edit", editCancel: "editCancel", editConfirmed: "editConfirmed", deleteEmitter: "deleteEmitter", createConfirmed: "createConfirmed", customActionEmitter: "customActionEmitter", userClickedRow: "userClickedRow", multipleSelectRow: "multipleSelectRow" }, host: { properties: { "class.ng2-smart-card": "isMobileView()" } }, ngImport: i0, template: "@if (isMobileView()) {\n <td colspan=\"50\">\n <div class=\"ng2-smart-card-header\">\n <ng-container [ngTemplateOutlet]=\"multiselectCheckbox\"></ng-container>\n <div class=\"ng2-smart-card-actions\">\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n </div>\n </div>\n <div class=\"ng2-smart-card-content\">\n @for (cell of row().visibleCells(); track cell.id + $index) {\n <div class=\"ng2-smart-card-field\">\n <div class=\"ng2-smart-card-field-label\">{{ cell.title }}</div>\n <div class=\"ng2-smart-card-field-value\">\n <ng2-smart-table-cell [cell]=\"cell\" [isInEditing]=\"!!row().isInEditing()\"> </ng2-smart-table-cell>\n </div>\n </div>\n }\n </div>\n </td>\n} @else {\n <ng-container [ngTemplateOutlet]=\"multiselectCheckbox\"></ng-container>\n @if (grid().actionIsOnLeft()) {\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n }\n @for (cell of row().visibleCells(); track cell.id + $index) {\n <td [class]=\"cell.columnClass\" [style]=\"cell.styles\">\n <ng2-smart-table-cell [cell]=\"cell\" [isInEditing]=\"!!row().isInEditing()\"> </ng2-smart-table-cell>\n </td>\n }\n @if (grid().actionIsOnRight()) {\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n }\n}\n\n<ng-template #actions>\n @if (isCreateRow() || row().isInEditing()) {\n <td class=\"ng2-smart-actions\" (click)=\"$event.stopPropagation()\">\n <ng2-st-tbody-create-cancel\n [grid]=\"grid()\"\n [rowIndex]=\"row().index || 0\"\n (cancelEdit)=\"onCancelEdit()\"\n (save)=\"onSave()\"\n [rowPending]=\"!!row().pending()\"></ng2-st-tbody-create-cancel>\n </td>\n } @else {\n @if (grid().isActionsVisible()) {\n <td class=\"ng2-smart-actions\" (click)=\"$event.stopPropagation()\">\n <ng2-row-actions\n [grid]=\"grid()\"\n [row]=\"row()\"\n (customActionEmitter)=\"customActionEmitter.emit($event)\"\n (editEmitter)=\"edit.emit()\"\n (deleteEmitter)=\"deleteEmitter.emit()\"></ng2-row-actions>\n </td>\n }\n }\n</ng-template>\n\n<ng-template #multiselectCheckbox>\n @if (grid().isMultiSelectVisible() && !isCreateRow()) {\n <td\n class=\"ng2-smart-actions ng2-smart-action-multiple-select\"\n (click)=\"$event.stopPropagation(); multipleSelectRow.emit(row())\">\n <input\n type=\"checkbox\"\n [id]=\"'row-' + row().index + '_select-checkbox'\"\n class=\"form-control\"\n [ngModel]=\"row().isSelected()\" />\n </td>\n }\n</ng-template>\n", styles: [":host .ng2-smart-action-multiple-select{margin-right:.5rem;text-align:center}:host.ng2-smart-card{display:block;margin-bottom:1rem;border-radius:.5rem;overflow:hidden;box-shadow:var(--table-card-shadow, 0 0 8px 5px color-mix(in oklab, var(--smart-table-bg, #d7d7d7) 30%, transparent 50%));background-color:var(--smart-table-bg, #ffffff)}:host.ng2-smart-card td{display:block;padding:0;border:none}:host.ng2-smart-card td .ng2-smart-actions{margin:.5rem}:host.ng2-smart-card td .ng2-smart-card-header{display:flex;align-items:center;gap:.5rem;justify-content:space-between}:host.ng2-smart-card td .ng2-smart-card-content{padding:1rem;display:grid;gap:.75rem}@media(min-width:400px){:host.ng2-smart-card td .ng2-smart-card-content{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}:host.ng2-smart-card td .ng2-smart-card-content .ng2-smart-card-field .ng2-smart-card-field-label{font-weight:600;color:inherit;margin-bottom:.35rem;font-size:.9em}:host.ng2-smart-card td .ng2-smart-card-content .ng2-smart-card-field .ng2-smart-card-field-value{word-break:break-word}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { 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"] }, { kind: "component", type: CellComponent, selector: "ng2-smart-table-cell", inputs: ["cell", "isInEditing"] }, { kind: "component", type: RowActionsComponent, selector: "ng2-row-actions", inputs: ["grid", "row"], outputs: ["editEmitter", "deleteEmitter", "customActionEmitter"] }, { kind: "component", type: TbodyCreateCancelComponent, selector: "ng2-st-tbody-create-cancel", inputs: ["grid", "rowIndex", "rowPending"], outputs: ["save", "cancelEdit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1381
1380
|
}
|
|
1382
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1381
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TrowComponent, decorators: [{
|
|
1383
1382
|
type: Component,
|
|
1384
1383
|
args: [{ selector: '[ng2-st-trow]', imports: [NgTemplateOutlet, FormsModule, CellComponent, RowActionsComponent, TbodyCreateCancelComponent], host: {
|
|
1385
1384
|
'[class.ng2-smart-card]': 'isMobileView()',
|
|
1386
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isMobileView()) {\n <td colspan=\"50\">\n <div class=\"ng2-smart-card-header\">\n <ng-container [ngTemplateOutlet]=\"multiselectCheckbox\"></ng-container>\n <div class=\"ng2-smart-card-actions\">\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n </div>\n </div>\n <div class=\"ng2-smart-card-content\">\n @for (cell of row().visibleCells(); track cell.id + $index) {\n <div class=\"ng2-smart-card-field\">\n <div class=\"ng2-smart-card-field-label\">{{ cell.title }}</div>\n <div class=\"ng2-smart-card-field-value\">\n <ng2-smart-table-cell [cell]=\"cell\" [isInEditing]=\"!!row().isInEditing()\"> </ng2-smart-table-cell>\n </div>\n </div>\n }\n </div>\n </td>\n} @else {\n <ng-container [ngTemplateOutlet]=\"multiselectCheckbox\"></ng-container>\n @if (grid().actionIsOnLeft()) {\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n }\n @for (cell of row().visibleCells(); track cell.id + $index) {\n <td [class]=\"cell.columnClass\" [style]=\"cell.styles\">\n <ng2-smart-table-cell [cell]=\"cell\" [isInEditing]=\"!!row().isInEditing()\"> </ng2-smart-table-cell>\n </td>\n }\n @if (grid().actionIsOnRight()) {\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n }\n}\n\n<ng-template #actions>\n @if (isCreateRow() || row().isInEditing()) {\n <td class=\"ng2-smart-actions\" (click)=\"$event.stopPropagation()\">\n <ng2-st-tbody-create-cancel\n [grid]=\"grid()\"\n [rowIndex]=\"row().index || 0\"\n (cancelEdit)=\"onCancelEdit()\"\n (save)=\"onSave()\"\n [rowPending]=\"!!row().pending()\"></ng2-st-tbody-create-cancel>\n </td>\n } @else {\n @if (grid().isActionsVisible()) {\n <td class=\"ng2-smart-actions\" (click)=\"$event.stopPropagation()\">\n <ng2-row-actions\n [grid]=\"grid()\"\n [row]=\"row()\"\n (customActionEmitter)=\"customActionEmitter.emit($event)\"\n (editEmitter)=\"edit.emit()\"\n (deleteEmitter)=\"deleteEmitter.emit()\"></ng2-row-actions>\n </td>\n }\n }\n</ng-template>\n\n<ng-template #multiselectCheckbox>\n @if (grid().isMultiSelectVisible() && !isCreateRow()) {\n <td\n class=\"ng2-smart-actions ng2-smart-action-multiple-select\"\n (click)=\"$event.stopPropagation(); multipleSelectRow.emit(row())\">\n <input\n type=\"checkbox\"\n [id]=\"'row-' + row().index + '_select-checkbox'\"\n class=\"form-control\"\n [ngModel]=\"row().isSelected()\" />\n </td>\n }\n</ng-template>\n", styles: [":host .ng2-smart-action-multiple-select{margin-right:.5rem;text-align:center}:host.ng2-smart-card{display:block;margin-bottom:1rem;border-radius:.5rem;overflow:hidden;box-shadow:var(--table-card-shadow, 0 0 8px 5px color-mix(in oklab, var(--smart-table-bg, #d7d7d7) 30%, transparent 50%));background-color:var(--smart-table-bg, #ffffff)}:host.ng2-smart-card td{display:block;padding:0;border:none}:host.ng2-smart-card td .ng2-smart-actions{margin:.5rem}:host.ng2-smart-card td .ng2-smart-card-header{display:flex;align-items:center;gap:.5rem;justify-content:space-between}:host.ng2-smart-card td .ng2-smart-card-content{padding:1rem;display:grid;gap:.75rem}@media
|
|
1387
|
-
}] });
|
|
1385
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isMobileView()) {\n <td colspan=\"50\">\n <div class=\"ng2-smart-card-header\">\n <ng-container [ngTemplateOutlet]=\"multiselectCheckbox\"></ng-container>\n <div class=\"ng2-smart-card-actions\">\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n </div>\n </div>\n <div class=\"ng2-smart-card-content\">\n @for (cell of row().visibleCells(); track cell.id + $index) {\n <div class=\"ng2-smart-card-field\">\n <div class=\"ng2-smart-card-field-label\">{{ cell.title }}</div>\n <div class=\"ng2-smart-card-field-value\">\n <ng2-smart-table-cell [cell]=\"cell\" [isInEditing]=\"!!row().isInEditing()\"> </ng2-smart-table-cell>\n </div>\n </div>\n }\n </div>\n </td>\n} @else {\n <ng-container [ngTemplateOutlet]=\"multiselectCheckbox\"></ng-container>\n @if (grid().actionIsOnLeft()) {\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n }\n @for (cell of row().visibleCells(); track cell.id + $index) {\n <td [class]=\"cell.columnClass\" [style]=\"cell.styles\">\n <ng2-smart-table-cell [cell]=\"cell\" [isInEditing]=\"!!row().isInEditing()\"> </ng2-smart-table-cell>\n </td>\n }\n @if (grid().actionIsOnRight()) {\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n }\n}\n\n<ng-template #actions>\n @if (isCreateRow() || row().isInEditing()) {\n <td class=\"ng2-smart-actions\" (click)=\"$event.stopPropagation()\">\n <ng2-st-tbody-create-cancel\n [grid]=\"grid()\"\n [rowIndex]=\"row().index || 0\"\n (cancelEdit)=\"onCancelEdit()\"\n (save)=\"onSave()\"\n [rowPending]=\"!!row().pending()\"></ng2-st-tbody-create-cancel>\n </td>\n } @else {\n @if (grid().isActionsVisible()) {\n <td class=\"ng2-smart-actions\" (click)=\"$event.stopPropagation()\">\n <ng2-row-actions\n [grid]=\"grid()\"\n [row]=\"row()\"\n (customActionEmitter)=\"customActionEmitter.emit($event)\"\n (editEmitter)=\"edit.emit()\"\n (deleteEmitter)=\"deleteEmitter.emit()\"></ng2-row-actions>\n </td>\n }\n }\n</ng-template>\n\n<ng-template #multiselectCheckbox>\n @if (grid().isMultiSelectVisible() && !isCreateRow()) {\n <td\n class=\"ng2-smart-actions ng2-smart-action-multiple-select\"\n (click)=\"$event.stopPropagation(); multipleSelectRow.emit(row())\">\n <input\n type=\"checkbox\"\n [id]=\"'row-' + row().index + '_select-checkbox'\"\n class=\"form-control\"\n [ngModel]=\"row().isSelected()\" />\n </td>\n }\n</ng-template>\n", styles: [":host .ng2-smart-action-multiple-select{margin-right:.5rem;text-align:center}:host.ng2-smart-card{display:block;margin-bottom:1rem;border-radius:.5rem;overflow:hidden;box-shadow:var(--table-card-shadow, 0 0 8px 5px color-mix(in oklab, var(--smart-table-bg, #d7d7d7) 30%, transparent 50%));background-color:var(--smart-table-bg, #ffffff)}:host.ng2-smart-card td{display:block;padding:0;border:none}:host.ng2-smart-card td .ng2-smart-actions{margin:.5rem}:host.ng2-smart-card td .ng2-smart-card-header{display:flex;align-items:center;gap:.5rem;justify-content:space-between}:host.ng2-smart-card td .ng2-smart-card-content{padding:1rem;display:grid;gap:.75rem}@media(min-width:400px){:host.ng2-smart-card td .ng2-smart-card-content{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}:host.ng2-smart-card td .ng2-smart-card-content .ng2-smart-card-field .ng2-smart-card-field-label{font-weight:600;color:inherit;margin-bottom:.35rem;font-size:.9em}:host.ng2-smart-card td .ng2-smart-card-content .ng2-smart-card-field .ng2-smart-card-field-value{word-break:break-word}\n"] }]
|
|
1386
|
+
}], propDecorators: { grid: [{ type: i0.Input, args: [{ isSignal: true, alias: "grid", required: true }] }], source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: true }] }], row: [{ type: i0.Input, args: [{ isSignal: true, alias: "row", required: true }] }], isMobileView: [{ type: i0.Input, args: [{ isSignal: true, alias: "isMobileView", required: false }] }], isCreateRow: [{ type: i0.Input, args: [{ isSignal: true, alias: "isCreateRow", required: false }] }], edit: [{ type: i0.Output, args: ["edit"] }], editCancel: [{ type: i0.Output, args: ["editCancel"] }], editConfirmed: [{ type: i0.Output, args: ["editConfirmed"] }], deleteEmitter: [{ type: i0.Output, args: ["deleteEmitter"] }], createConfirmed: [{ type: i0.Output, args: ["createConfirmed"] }], customActionEmitter: [{ type: i0.Output, args: ["customActionEmitter"] }], userClickedRow: [{ type: i0.Output, args: ["userClickedRow"] }], multipleSelectRow: [{ type: i0.Output, args: ["multipleSelectRow"] }] } });
|
|
1388
1387
|
|
|
1389
1388
|
class Ng2SmartTableTbodyComponent {
|
|
1390
1389
|
constructor() {
|
|
1391
|
-
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : []));
|
|
1392
|
-
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : []));
|
|
1393
|
-
this.rowClassFunction = input(() => '', ...(ngDevMode ? [{ debugName: "rowClassFunction" }] : []));
|
|
1394
|
-
this.isMobileView = input(false, ...(ngDevMode ? [{ debugName: "isMobileView" }] : []));
|
|
1390
|
+
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : /* istanbul ignore next */ []));
|
|
1391
|
+
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : /* istanbul ignore next */ []));
|
|
1392
|
+
this.rowClassFunction = input(() => '', ...(ngDevMode ? [{ debugName: "rowClassFunction" }] : /* istanbul ignore next */ []));
|
|
1393
|
+
this.isMobileView = input(false, ...(ngDevMode ? [{ debugName: "isMobileView" }] : /* istanbul ignore next */ []));
|
|
1395
1394
|
this.edit = output();
|
|
1396
1395
|
this.editConfirmed = output();
|
|
1397
1396
|
this.editCancel = output();
|
|
@@ -1409,7 +1408,7 @@ class Ng2SmartTableTbodyComponent {
|
|
|
1409
1408
|
// });
|
|
1410
1409
|
this.noDataMessage = computed(() => {
|
|
1411
1410
|
return this.grid().settings().noDataMessage || 'No data found';
|
|
1412
|
-
}, ...(ngDevMode ? [{ debugName: "noDataMessage" }] : []));
|
|
1411
|
+
}, ...(ngDevMode ? [{ debugName: "noDataMessage" }] : /* istanbul ignore next */ []));
|
|
1413
1412
|
}
|
|
1414
1413
|
rowClicked(row, event) {
|
|
1415
1414
|
if (row.isInEditing()) {
|
|
@@ -1427,17 +1426,17 @@ class Ng2SmartTableTbodyComponent {
|
|
|
1427
1426
|
trackByIdOrIndex(index, item) {
|
|
1428
1427
|
return item?.id || index;
|
|
1429
1428
|
}
|
|
1430
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1431
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1429
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: Ng2SmartTableTbodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1430
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: Ng2SmartTableTbodyComponent, isStandalone: true, selector: "[ng2-st-tbody]", inputs: { grid: { classPropertyName: "grid", publicName: "grid", isSignal: true, isRequired: true, transformFunction: null }, source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, rowClassFunction: { classPropertyName: "rowClassFunction", publicName: "rowClassFunction", isSignal: true, isRequired: false, transformFunction: null }, isMobileView: { classPropertyName: "isMobileView", publicName: "isMobileView", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { edit: "edit", editConfirmed: "editConfirmed", editCancel: "editCancel", createConfirmed: "createConfirmed", deleteEmitter: "deleteEmitter", customActionEmitter: "customActionEmitter", userClickedRow: "userClickedRow", multipleSelectRow: "multipleSelectRow" }, ngImport: i0, template: "@if (grid().createFormShown()) {\n <tr\n ng2-st-trow\n class=\"ng2-smart-row\"\n [grid]=\"grid()\"\n [row]=\"grid().getNewRow()\"\n [isCreateRow]=\"true\"\n [source]=\"source()\"\n [isMobileView]=\"isMobileView()\"\n (createConfirmed)=\"createConfirmed.emit()\"></tr>\n}\n@for (row of grid().dataSet.getRows(); track trackByIdOrIndex($index, row)) {\n <tr\n ng2-st-trow\n class=\"ng2-smart-row\"\n [grid]=\"grid()\"\n [source]=\"source()\"\n [row]=\"row\"\n [class]=\"rowClassFunction()(row.rowData())\"\n [isMobileView]=\"isMobileView()\"\n [class.selected]=\"row.isSelected()\"\n (click)=\"rowClicked(row, $event)\"\n (edit)=\"edit.emit(row)\"\n (editConfirmed)=\"editConfirmed.emit(row)\"\n (editCancel)=\"editCancel.emit(row)\"\n (deleteEmitter)=\"deleteEmitter.emit(row)\"\n (customActionEmitter)=\"customActionEmitted($event, row)\"\n (multipleSelectRow)=\"multipleSelectRow.emit($event)\"></tr>\n} @empty {\n <tr>\n <td colspan=\"50\">\n {{ noDataMessage() }}\n </td>\n </tr>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: TrowComponent, selector: "[ng2-st-trow]", inputs: ["grid", "source", "row", "isMobileView", "isCreateRow"], outputs: ["edit", "editCancel", "editConfirmed", "deleteEmitter", "createConfirmed", "customActionEmitter", "userClickedRow", "multipleSelectRow"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1432
1431
|
}
|
|
1433
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1432
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: Ng2SmartTableTbodyComponent, decorators: [{
|
|
1434
1433
|
type: Component,
|
|
1435
1434
|
args: [{ selector: '[ng2-st-tbody]', imports: [FormsModule, TrowComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (grid().createFormShown()) {\n <tr\n ng2-st-trow\n class=\"ng2-smart-row\"\n [grid]=\"grid()\"\n [row]=\"grid().getNewRow()\"\n [isCreateRow]=\"true\"\n [source]=\"source()\"\n [isMobileView]=\"isMobileView()\"\n (createConfirmed)=\"createConfirmed.emit()\"></tr>\n}\n@for (row of grid().dataSet.getRows(); track trackByIdOrIndex($index, row)) {\n <tr\n ng2-st-trow\n class=\"ng2-smart-row\"\n [grid]=\"grid()\"\n [source]=\"source()\"\n [row]=\"row\"\n [class]=\"rowClassFunction()(row.rowData())\"\n [isMobileView]=\"isMobileView()\"\n [class.selected]=\"row.isSelected()\"\n (click)=\"rowClicked(row, $event)\"\n (edit)=\"edit.emit(row)\"\n (editConfirmed)=\"editConfirmed.emit(row)\"\n (editCancel)=\"editCancel.emit(row)\"\n (deleteEmitter)=\"deleteEmitter.emit(row)\"\n (customActionEmitter)=\"customActionEmitted($event, row)\"\n (multipleSelectRow)=\"multipleSelectRow.emit($event)\"></tr>\n} @empty {\n <tr>\n <td colspan=\"50\">\n {{ noDataMessage() }}\n </td>\n </tr>\n}\n" }]
|
|
1436
|
-
}] });
|
|
1435
|
+
}], propDecorators: { grid: [{ type: i0.Input, args: [{ isSignal: true, alias: "grid", required: true }] }], source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: true }] }], rowClassFunction: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowClassFunction", required: false }] }], isMobileView: [{ type: i0.Input, args: [{ isSignal: true, alias: "isMobileView", required: false }] }], edit: [{ type: i0.Output, args: ["edit"] }], editConfirmed: [{ type: i0.Output, args: ["editConfirmed"] }], editCancel: [{ type: i0.Output, args: ["editCancel"] }], createConfirmed: [{ type: i0.Output, args: ["createConfirmed"] }], deleteEmitter: [{ type: i0.Output, args: ["deleteEmitter"] }], customActionEmitter: [{ type: i0.Output, args: ["customActionEmitter"] }], userClickedRow: [{ type: i0.Output, args: ["userClickedRow"] }], multipleSelectRow: [{ type: i0.Output, args: ["multipleSelectRow"] }] } });
|
|
1437
1436
|
|
|
1438
1437
|
class AddButtonComponent {
|
|
1439
1438
|
constructor() {
|
|
1440
|
-
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : []));
|
|
1439
|
+
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : /* istanbul ignore next */ []));
|
|
1441
1440
|
this.create = output();
|
|
1442
1441
|
this.isActionAdd = computed(() => {
|
|
1443
1442
|
const actions = this.grid().settings().actions;
|
|
@@ -1445,22 +1444,22 @@ class AddButtonComponent {
|
|
|
1445
1444
|
return false;
|
|
1446
1445
|
}
|
|
1447
1446
|
return !!actions.add;
|
|
1448
|
-
}, ...(ngDevMode ? [{ debugName: "isActionAdd" }] : []));
|
|
1447
|
+
}, ...(ngDevMode ? [{ debugName: "isActionAdd" }] : /* istanbul ignore next */ []));
|
|
1449
1448
|
this.addNewButtonContent = computed(() => {
|
|
1450
1449
|
const addParams = this.grid().settings()?.add;
|
|
1451
1450
|
if (!addParams) {
|
|
1452
1451
|
return 'Add New';
|
|
1453
1452
|
}
|
|
1454
1453
|
return addParams?.addButtonContent || 'Add New';
|
|
1455
|
-
}, ...(ngDevMode ? [{ debugName: "addNewButtonContent" }] : []));
|
|
1454
|
+
}, ...(ngDevMode ? [{ debugName: "addNewButtonContent" }] : /* istanbul ignore next */ []));
|
|
1456
1455
|
}
|
|
1457
1456
|
onAdd(event) {
|
|
1458
1457
|
event.preventDefault();
|
|
1459
1458
|
event.stopPropagation();
|
|
1460
1459
|
this.create.emit();
|
|
1461
1460
|
}
|
|
1462
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1463
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1461
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AddButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1462
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AddButtonComponent, isStandalone: true, selector: "[ng2-st-add-button]", inputs: { grid: { classPropertyName: "grid", publicName: "grid", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { create: "create" }, host: { classAttribute: "ng2-smart-actions-title ng2-smart-actions-title-add" }, ngImport: i0, template: `
|
|
1464
1463
|
@if (isActionAdd()) {
|
|
1465
1464
|
<a
|
|
1466
1465
|
href="#"
|
|
@@ -1470,7 +1469,7 @@ class AddButtonComponent {
|
|
|
1470
1469
|
}
|
|
1471
1470
|
`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1472
1471
|
}
|
|
1473
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1472
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AddButtonComponent, decorators: [{
|
|
1474
1473
|
type: Component,
|
|
1475
1474
|
args: [{
|
|
1476
1475
|
selector: '[ng2-st-add-button]',
|
|
@@ -1488,12 +1487,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1488
1487
|
},
|
|
1489
1488
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1490
1489
|
}]
|
|
1491
|
-
}] });
|
|
1490
|
+
}], propDecorators: { grid: [{ type: i0.Input, args: [{ isSignal: true, alias: "grid", required: true }] }], create: [{ type: i0.Output, args: ["create"] }] } });
|
|
1492
1491
|
|
|
1493
1492
|
class ColumnTitleComponent {
|
|
1494
1493
|
constructor() {
|
|
1495
|
-
this.currentSort = input.required(...(ngDevMode ? [{ debugName: "currentSort" }] : []));
|
|
1496
|
-
this.column = input.required(...(ngDevMode ? [{ debugName: "column" }] : []));
|
|
1494
|
+
this.currentSort = input.required(...(ngDevMode ? [{ debugName: "currentSort" }] : /* istanbul ignore next */ []));
|
|
1495
|
+
this.column = input.required(...(ngDevMode ? [{ debugName: "column" }] : /* istanbul ignore next */ []));
|
|
1497
1496
|
this.sortEmit = output();
|
|
1498
1497
|
this.currentSortDirection = computed(() => {
|
|
1499
1498
|
const sort = this.currentSort();
|
|
@@ -1502,10 +1501,10 @@ class ColumnTitleComponent {
|
|
|
1502
1501
|
}
|
|
1503
1502
|
const { field, direction, title } = sort;
|
|
1504
1503
|
return this.column().id === field && this.column().title === title ? direction : null;
|
|
1505
|
-
}, ...(ngDevMode ? [{ debugName: "currentSortDirection" }] : []));
|
|
1504
|
+
}, ...(ngDevMode ? [{ debugName: "currentSortDirection" }] : /* istanbul ignore next */ []));
|
|
1506
1505
|
this.currentSortDirectionSymbol = computed(() => {
|
|
1507
1506
|
return !this.currentSortDirection() ? '' : this.currentSortDirection() === 'asc' ? '↑' : '↓';
|
|
1508
|
-
}, ...(ngDevMode ? [{ debugName: "currentSortDirectionSymbol" }] : []));
|
|
1507
|
+
}, ...(ngDevMode ? [{ debugName: "currentSortDirectionSymbol" }] : /* istanbul ignore next */ []));
|
|
1509
1508
|
}
|
|
1510
1509
|
_sort(event) {
|
|
1511
1510
|
event.preventDefault();
|
|
@@ -1518,8 +1517,8 @@ class ColumnTitleComponent {
|
|
|
1518
1517
|
// compare: this.column().compareFunction,
|
|
1519
1518
|
// });
|
|
1520
1519
|
}
|
|
1521
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1522
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1520
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ColumnTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1521
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ColumnTitleComponent, isStandalone: true, selector: "ng2-st-column-title", inputs: { currentSort: { classPropertyName: "currentSort", publicName: "currentSort", isSignal: true, isRequired: true, transformFunction: null }, column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { sortEmit: "sortEmit" }, ngImport: i0, template: `
|
|
1523
1522
|
@if (column().isSortable) {
|
|
1524
1523
|
<a href="#" (click)="_sort($event)" class="ng2-smart-sort-link sort">
|
|
1525
1524
|
{{ column().title }}
|
|
@@ -1530,7 +1529,7 @@ class ColumnTitleComponent {
|
|
|
1530
1529
|
}
|
|
1531
1530
|
`, isInline: true, styles: ["a.sort{white-space:nowrap}a.sort.asc,a.sort.desc{font-weight:700}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1532
1531
|
}
|
|
1533
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1532
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ColumnTitleComponent, decorators: [{
|
|
1534
1533
|
type: Component,
|
|
1535
1534
|
args: [{ selector: 'ng2-st-column-title', template: `
|
|
1536
1535
|
@if (column().isSortable) {
|
|
@@ -1542,16 +1541,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1542
1541
|
<span class="ng2-smart-sort">{{ column().title }}</span>
|
|
1543
1542
|
}
|
|
1544
1543
|
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["a.sort{white-space:nowrap}a.sort.asc,a.sort.desc{font-weight:700}\n"] }]
|
|
1545
|
-
}] });
|
|
1544
|
+
}], propDecorators: { currentSort: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentSort", required: true }] }], column: [{ type: i0.Input, args: [{ isSignal: true, alias: "column", required: true }] }], sortEmit: [{ type: i0.Output, args: ["sortEmit"] }] } });
|
|
1546
1545
|
|
|
1547
1546
|
class CheckboxFilterComponent extends BaseFilterComponent {
|
|
1548
1547
|
constructor() {
|
|
1549
1548
|
super(...arguments);
|
|
1550
|
-
this.filterIsActive = computed(() => this.query() !== null, ...(ngDevMode ? [{ debugName: "filterIsActive" }] : []));
|
|
1549
|
+
this.filterIsActive = computed(() => this.query() !== null, ...(ngDevMode ? [{ debugName: "filterIsActive" }] : /* istanbul ignore next */ []));
|
|
1551
1550
|
this.currentState = computed(() => {
|
|
1552
1551
|
const valuesConfig = this.getValuesConfig(this.column().getFilterConfig());
|
|
1553
1552
|
return this.query() === valuesConfig.trueVal ? true : this.query() === valuesConfig.falseVal ? false : false;
|
|
1554
|
-
}, ...(ngDevMode ? [{ debugName: "currentState" }] : []));
|
|
1553
|
+
}, ...(ngDevMode ? [{ debugName: "currentState" }] : /* istanbul ignore next */ []));
|
|
1555
1554
|
}
|
|
1556
1555
|
getValuesConfig(filterConfig) {
|
|
1557
1556
|
try {
|
|
@@ -1572,8 +1571,8 @@ class CheckboxFilterComponent extends BaseFilterComponent {
|
|
|
1572
1571
|
event.stopPropagation();
|
|
1573
1572
|
this.setFilter(null);
|
|
1574
1573
|
}
|
|
1575
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1576
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1574
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CheckboxFilterComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1575
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CheckboxFilterComponent, isStandalone: true, selector: "ng2-checkbox-filter", usesInheritance: true, ngImport: i0, template: `
|
|
1577
1576
|
<div class="checkbox-filter-wrapper">
|
|
1578
1577
|
<input
|
|
1579
1578
|
[id]="column().id"
|
|
@@ -1590,7 +1589,7 @@ class CheckboxFilterComponent extends BaseFilterComponent {
|
|
|
1590
1589
|
</div>
|
|
1591
1590
|
`, isInline: true, styles: [".checkbox-filter-wrapper{display:flex;align-items:center;justify-content:flex-start;gap:.5rem}.checkbox-filter-wrapper input{width:auto}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { 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 }); }
|
|
1592
1591
|
}
|
|
1593
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1592
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CheckboxFilterComponent, decorators: [{
|
|
1594
1593
|
type: Component,
|
|
1595
1594
|
args: [{ selector: 'ng2-checkbox-filter', template: `
|
|
1596
1595
|
<div class="checkbox-filter-wrapper">
|
|
@@ -1611,8 +1610,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1611
1610
|
}] });
|
|
1612
1611
|
|
|
1613
1612
|
class InputFilterComponent extends BaseFilterComponent {
|
|
1614
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1615
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1613
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InputFilterComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1614
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: InputFilterComponent, isStandalone: true, selector: "ng2-input-filter", usesInheritance: true, ngImport: i0, template: `
|
|
1616
1615
|
<input
|
|
1617
1616
|
[class]="inputClass()"
|
|
1618
1617
|
[formControl]="inputControl"
|
|
@@ -1621,7 +1620,7 @@ class InputFilterComponent extends BaseFilterComponent {
|
|
|
1621
1620
|
placeholder="{{ placeholder || column().title }}" />
|
|
1622
1621
|
`, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1623
1622
|
}
|
|
1624
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1623
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InputFilterComponent, decorators: [{
|
|
1625
1624
|
type: Component,
|
|
1626
1625
|
args: [{
|
|
1627
1626
|
selector: 'ng2-input-filter',
|
|
@@ -1639,8 +1638,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1639
1638
|
}] });
|
|
1640
1639
|
|
|
1641
1640
|
class InputNumberFilterComponent extends BaseFilterComponent {
|
|
1642
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1643
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1641
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InputNumberFilterComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1642
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: InputNumberFilterComponent, isStandalone: true, selector: "ng2-input-number-filter", usesInheritance: true, ngImport: i0, template: `
|
|
1644
1643
|
<input
|
|
1645
1644
|
class="form-control ng2-input-number-filter"
|
|
1646
1645
|
[class]="inputClass()"
|
|
@@ -1649,7 +1648,7 @@ class InputNumberFilterComponent extends BaseFilterComponent {
|
|
|
1649
1648
|
placeholder="{{ placeholder || column().title }}" />
|
|
1650
1649
|
`, isInline: true, styles: [".ng2-input-number-filter{-moz-appearance:textfield}.ng2-input-number-filter::-webkit-outer-spin-button,.ng2-input-number-filter::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1651
1650
|
}
|
|
1652
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1651
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InputNumberFilterComponent, decorators: [{
|
|
1653
1652
|
type: Component,
|
|
1654
1653
|
args: [{ selector: 'ng2-input-number-filter', template: `
|
|
1655
1654
|
<input
|
|
@@ -1664,15 +1663,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1664
1663
|
class SelectFilterComponent extends BaseFilterComponent {
|
|
1665
1664
|
constructor() {
|
|
1666
1665
|
super(...arguments);
|
|
1667
|
-
this.optionsList = signal([], ...(ngDevMode ? [{ debugName: "optionsList" }] : []));
|
|
1666
|
+
this.optionsList = signal([], ...(ngDevMode ? [{ debugName: "optionsList" }] : /* istanbul ignore next */ []));
|
|
1668
1667
|
}
|
|
1669
1668
|
ngOnInit() {
|
|
1670
1669
|
super.ngOnInit();
|
|
1671
1670
|
const config = this.column().getFilterConfig();
|
|
1672
1671
|
this.optionsList.set(config?.list || []);
|
|
1673
1672
|
}
|
|
1674
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1675
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1673
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: SelectFilterComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1674
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: SelectFilterComponent, isStandalone: true, selector: "ng2-select-filter", usesInheritance: true, ngImport: i0, template: `
|
|
1676
1675
|
<select [class]="inputClass()" class="form-control" [formControl]="inputControl">
|
|
1677
1676
|
<option [value]="null">{{ placeholder || 'all' }}</option>
|
|
1678
1677
|
@for (option of optionsList(); track $index) {
|
|
@@ -1683,7 +1682,7 @@ class SelectFilterComponent extends BaseFilterComponent {
|
|
|
1683
1682
|
</select>
|
|
1684
1683
|
`, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { 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])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1685
1684
|
}
|
|
1686
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1685
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: SelectFilterComponent, decorators: [{
|
|
1687
1686
|
type: Component,
|
|
1688
1687
|
args: [{
|
|
1689
1688
|
selector: 'ng2-select-filter',
|
|
@@ -1704,14 +1703,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1704
1703
|
|
|
1705
1704
|
class BuildInFilterComponent {
|
|
1706
1705
|
constructor() {
|
|
1707
|
-
this.query = input(null, ...(ngDevMode ? [{ debugName: "query" }] : []));
|
|
1708
|
-
this.inputClass = input('', ...(ngDevMode ? [{ debugName: "inputClass" }] : []));
|
|
1709
|
-
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : []));
|
|
1710
|
-
this.column = input.required(...(ngDevMode ? [{ debugName: "column" }] : []));
|
|
1706
|
+
this.query = input(null, ...(ngDevMode ? [{ debugName: "query" }] : /* istanbul ignore next */ []));
|
|
1707
|
+
this.inputClass = input('', ...(ngDevMode ? [{ debugName: "inputClass" }] : /* istanbul ignore next */ []));
|
|
1708
|
+
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : /* istanbul ignore next */ []));
|
|
1709
|
+
this.column = input.required(...(ngDevMode ? [{ debugName: "column" }] : /* istanbul ignore next */ []));
|
|
1711
1710
|
this.filter = output();
|
|
1712
1711
|
}
|
|
1713
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1714
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1712
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BuildInFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1713
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: BuildInFilterComponent, isStandalone: true, selector: "ng2-build-in-table-filter", inputs: { query: { classPropertyName: "query", publicName: "query", isSignal: true, isRequired: false, transformFunction: null }, inputClass: { classPropertyName: "inputClass", publicName: "inputClass", isSignal: true, isRequired: false, transformFunction: null }, source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { filter: "filter" }, ngImport: i0, template: `
|
|
1715
1714
|
@switch (column().getFilterType()) {
|
|
1716
1715
|
@case ('list') {
|
|
1717
1716
|
<ng2-select-filter
|
|
@@ -1753,7 +1752,7 @@ class BuildInFilterComponent {
|
|
|
1753
1752
|
}
|
|
1754
1753
|
`, isInline: true, dependencies: [{ kind: "component", type: SelectFilterComponent, selector: "ng2-select-filter" }, { kind: "component", type: CheckboxFilterComponent, selector: "ng2-checkbox-filter" }, { kind: "component", type: InputFilterComponent, selector: "ng2-input-filter" }, { kind: "component", type: InputNumberFilterComponent, selector: "ng2-input-number-filter" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1755
1754
|
}
|
|
1756
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1755
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BuildInFilterComponent, decorators: [{
|
|
1757
1756
|
type: Component,
|
|
1758
1757
|
args: [{
|
|
1759
1758
|
selector: 'ng2-build-in-table-filter',
|
|
@@ -1801,14 +1800,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1801
1800
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1802
1801
|
imports: [SelectFilterComponent, CheckboxFilterComponent, InputFilterComponent, InputNumberFilterComponent],
|
|
1803
1802
|
}]
|
|
1804
|
-
}] });
|
|
1803
|
+
}], propDecorators: { query: [{ type: i0.Input, args: [{ isSignal: true, alias: "query", required: false }] }], inputClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputClass", required: false }] }], source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: true }] }], column: [{ type: i0.Input, args: [{ isSignal: true, alias: "column", required: true }] }], filter: [{ type: i0.Output, args: ["filter"] }] } });
|
|
1805
1804
|
|
|
1806
1805
|
class CustomFilterComponent {
|
|
1807
1806
|
constructor() {
|
|
1808
|
-
this.query = input(null, ...(ngDevMode ? [{ debugName: "query" }] : []));
|
|
1809
|
-
this.inputClass = input('', ...(ngDevMode ? [{ debugName: "inputClass" }] : []));
|
|
1810
|
-
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : []));
|
|
1811
|
-
this.column = input.required(...(ngDevMode ? [{ debugName: "column" }] : []));
|
|
1807
|
+
this.query = input(null, ...(ngDevMode ? [{ debugName: "query" }] : /* istanbul ignore next */ []));
|
|
1808
|
+
this.inputClass = input('', ...(ngDevMode ? [{ debugName: "inputClass" }] : /* istanbul ignore next */ []));
|
|
1809
|
+
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : /* istanbul ignore next */ []));
|
|
1810
|
+
this.column = input.required(...(ngDevMode ? [{ debugName: "column" }] : /* istanbul ignore next */ []));
|
|
1812
1811
|
this.filter = output();
|
|
1813
1812
|
this.componentInputs = computed(() => {
|
|
1814
1813
|
let inputs = {
|
|
@@ -1825,7 +1824,7 @@ class CustomFilterComponent {
|
|
|
1825
1824
|
}
|
|
1826
1825
|
}
|
|
1827
1826
|
return inputs;
|
|
1828
|
-
}, ...(ngDevMode ? [{ debugName: "componentInputs" }] : []));
|
|
1827
|
+
}, ...(ngDevMode ? [{ debugName: "componentInputs" }] : /* istanbul ignore next */ []));
|
|
1829
1828
|
}
|
|
1830
1829
|
ngOnInit() {
|
|
1831
1830
|
const columnFilter = this.column().filter;
|
|
@@ -1833,14 +1832,14 @@ class CustomFilterComponent {
|
|
|
1833
1832
|
this.customFilterComponent = columnFilter.component;
|
|
1834
1833
|
}
|
|
1835
1834
|
}
|
|
1836
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1837
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1835
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CustomFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1836
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CustomFilterComponent, isStandalone: true, selector: "ng2-custom-table-filter", inputs: { query: { classPropertyName: "query", publicName: "query", isSignal: true, isRequired: false, transformFunction: null }, inputClass: { classPropertyName: "inputClass", publicName: "inputClass", isSignal: true, isRequired: false, transformFunction: null }, source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { filter: "filter" }, ngImport: i0, template: `
|
|
1838
1837
|
@if (customFilterComponent) {
|
|
1839
1838
|
<ng-template *ngComponentOutlet="customFilterComponent; inputs: componentInputs()"></ng-template>
|
|
1840
1839
|
}
|
|
1841
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"
|
|
1840
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1842
1841
|
}
|
|
1843
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1842
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CustomFilterComponent, decorators: [{
|
|
1844
1843
|
type: Component,
|
|
1845
1844
|
args: [{
|
|
1846
1845
|
selector: 'ng2-custom-table-filter',
|
|
@@ -1852,19 +1851,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1852
1851
|
`,
|
|
1853
1852
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1854
1853
|
}]
|
|
1855
|
-
}] });
|
|
1854
|
+
}], propDecorators: { query: [{ type: i0.Input, args: [{ isSignal: true, alias: "query", required: false }] }], inputClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputClass", required: false }] }], source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: true }] }], column: [{ type: i0.Input, args: [{ isSignal: true, alias: "column", required: true }] }], filter: [{ type: i0.Output, args: ["filter"] }] } });
|
|
1856
1855
|
|
|
1857
1856
|
class FilterComponent {
|
|
1858
1857
|
constructor() {
|
|
1859
|
-
this.column = input.required(...(ngDevMode ? [{ debugName: "column" }] : []));
|
|
1860
|
-
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : []));
|
|
1861
|
-
this.inputClass = input('', ...(ngDevMode ? [{ debugName: "inputClass" }] : []));
|
|
1858
|
+
this.column = input.required(...(ngDevMode ? [{ debugName: "column" }] : /* istanbul ignore next */ []));
|
|
1859
|
+
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : /* istanbul ignore next */ []));
|
|
1860
|
+
this.inputClass = input('', ...(ngDevMode ? [{ debugName: "inputClass" }] : /* istanbul ignore next */ []));
|
|
1862
1861
|
this.query = computed(() => {
|
|
1863
1862
|
const columnFilter = this.source()
|
|
1864
1863
|
.getFilters()
|
|
1865
1864
|
.find((filter) => filter.field === this.column().id);
|
|
1866
1865
|
return columnFilter?.search ?? null;
|
|
1867
|
-
}, ...(ngDevMode ? [{ debugName: "query" }] : []));
|
|
1866
|
+
}, ...(ngDevMode ? [{ debugName: "query" }] : /* istanbul ignore next */ []));
|
|
1868
1867
|
}
|
|
1869
1868
|
onFilter(query) {
|
|
1870
1869
|
const columnFilter = this.column().filter;
|
|
@@ -1875,8 +1874,8 @@ class FilterComponent {
|
|
|
1875
1874
|
filter: this.column().filterFunction,
|
|
1876
1875
|
});
|
|
1877
1876
|
}
|
|
1878
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1879
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1877
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: FilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1878
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: FilterComponent, isStandalone: true, selector: "ng2-smart-table-filter", inputs: { column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: true, transformFunction: null }, source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, inputClass: { classPropertyName: "inputClass", publicName: "inputClass", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
1880
1879
|
@if (column().isFilterable) {
|
|
1881
1880
|
<div class="ng2-smart-filter">
|
|
1882
1881
|
@switch (column().getFilterType()) {
|
|
@@ -1903,7 +1902,7 @@ class FilterComponent {
|
|
|
1903
1902
|
}
|
|
1904
1903
|
`, isInline: true, styles: [":host .ng2-smart-filter ::ng-deep input,:host .ng2-smart-filter ::ng-deep select{width:100%;line-height:normal;padding:.375em .75em;font-weight:400}:host .ng2-smart-filter ::ng-deep input[type=search]{box-sizing:inherit}:host .ng2-smart-filter ::ng-deep .completer-dropdown-holder{font-weight:400}:host .ng2-smart-filter ::ng-deep a{font-weight:400}\n"], dependencies: [{ kind: "component", type: CustomFilterComponent, selector: "ng2-custom-table-filter", inputs: ["query", "inputClass", "source", "column"], outputs: ["filter"] }, { kind: "component", type: BuildInFilterComponent, selector: "ng2-build-in-table-filter", inputs: ["query", "inputClass", "source", "column"], outputs: ["filter"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1905
1904
|
}
|
|
1906
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1905
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: FilterComponent, decorators: [{
|
|
1907
1906
|
type: Component,
|
|
1908
1907
|
args: [{ selector: 'ng2-smart-table-filter', template: `
|
|
1909
1908
|
@if (column().isFilterable) {
|
|
@@ -1931,16 +1930,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
1931
1930
|
</div>
|
|
1932
1931
|
}
|
|
1933
1932
|
`, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CustomFilterComponent, BuildInFilterComponent], styles: [":host .ng2-smart-filter ::ng-deep input,:host .ng2-smart-filter ::ng-deep select{width:100%;line-height:normal;padding:.375em .75em;font-weight:400}:host .ng2-smart-filter ::ng-deep input[type=search]{box-sizing:inherit}:host .ng2-smart-filter ::ng-deep .completer-dropdown-holder{font-weight:400}:host .ng2-smart-filter ::ng-deep a{font-weight:400}\n"] }]
|
|
1934
|
-
}] });
|
|
1933
|
+
}], propDecorators: { column: [{ type: i0.Input, args: [{ isSignal: true, alias: "column", required: true }] }], source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: true }] }], inputClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputClass", required: false }] }] } });
|
|
1935
1934
|
|
|
1936
1935
|
class MobileFiltersComponent {
|
|
1937
1936
|
constructor() {
|
|
1938
1937
|
this.overlay = inject(Overlay);
|
|
1939
1938
|
this.contentTemplate = viewChild.required(CdkPortal);
|
|
1940
1939
|
this.reference = viewChild.required('reference');
|
|
1941
|
-
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : []));
|
|
1942
|
-
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : []));
|
|
1943
|
-
this.filterInputClass = input.required(...(ngDevMode ? [{ debugName: "filterInputClass" }] : []));
|
|
1940
|
+
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : /* istanbul ignore next */ []));
|
|
1941
|
+
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : /* istanbul ignore next */ []));
|
|
1942
|
+
this.filterInputClass = input.required(...(ngDevMode ? [{ debugName: "filterInputClass" }] : /* istanbul ignore next */ []));
|
|
1944
1943
|
}
|
|
1945
1944
|
clearAllFilters() {
|
|
1946
1945
|
this.source().setFilters([]);
|
|
@@ -1973,24 +1972,24 @@ class MobileFiltersComponent {
|
|
|
1973
1972
|
backdropClass: 'cdk-overlay-transparent-backdrop',
|
|
1974
1973
|
});
|
|
1975
1974
|
}
|
|
1976
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1977
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1975
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: MobileFiltersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1976
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: MobileFiltersComponent, isStandalone: true, selector: "ng2-mobile-filters", inputs: { grid: { classPropertyName: "grid", publicName: "grid", isSignal: true, isRequired: true, transformFunction: null }, source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, filterInputClass: { classPropertyName: "filterInputClass", publicName: "filterInputClass", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "contentTemplate", first: true, predicate: CdkPortal, descendants: true, isSignal: true }, { propertyName: "reference", first: true, predicate: ["reference"], descendants: true, isSignal: true }], ngImport: i0, template: "<button #reference class=\"filter-toggle\" (click)=\"show()\" aria-label=\"Toggle filters\">\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\">\n <g id=\"SVGRepo_bgCarrier\" stroke-width=\"0\"></g>\n <g id=\"SVGRepo_tracerCarrier\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></g>\n <g id=\"SVGRepo_iconCarrier\">\n <path stroke=\"#000000\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M20 4H4v2l6 6v8.5l4-2.5v-6l6-6V4z\"></path>\n </g>\n </svg>\n</button>\n\n<ng-template cdk-portal>\n <div class=\"dropdown table-filter-dropdown\">\n <div class=\"dropdown-header\">\n <button type=\"button\" class=\"clear-filters-button\" (click)=\"clearAllFilters()\" aria-label=\"Close filters\">\n reset all\n </button>\n <button type=\"button\" class=\"close-dialog-button\" (click)=\"hide()\" aria-label=\"Close dropdown\">\n <span></span>\n </button>\n </div>\n <div class=\"dropdown-content\">\n <div class=\"ng2-smart-mobil-filters\">\n @for (column of grid().dataSet.getVisibleColumns(); track column.id + $index) {\n @if (column.isFilterable) {\n <div class=\"ng2-smart-filter\">\n <label for=\"\" class=\"ng2-smart-filter-label\">{{ column.title }}</label>\n <ng2-smart-table-filter [source]=\"source()\" [column]=\"column\" [inputClass]=\"filterInputClass()\">\n </ng2-smart-table-filter>\n </div>\n }\n }\n </div>\n </div>\n </div>\n</ng-template>\n", styles: [".dropdown{z-index:1;padding:.8rem 1rem;border:none;border-radius:.5rem;background:var(--smart-table-bg, #fff);box-shadow:var(--table-card-shadow, 0 0 8px 5px color-mix(in oklab, var(--smart-table-bg, #d7d7d7) 30%, transparent 50%));max-height:var(--table-header-dropdown-max-height, 60dvh);width:var(--table-header-dropdown-width, 80dvw);max-width:30rem;overflow:auto}.filter-toggle svg{height:1rem;width:1rem}.dropdown-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.dropdown-content{display:flex;flex-direction:column}.dropdown-content ::ng-deep tr{display:flex;flex-direction:column;gap:.3rem}.dropdown-content ::ng-deep th.titles a{display:block;width:100%;padding:.3rem;color:inherit;border-bottom:1px solid var(--smart-table-separator, #d5d5d5)}.close-dialog-button{display:flex;align-items:center;justify-content:center;border:none;background:none;width:2rem;height:2rem;padding:.5rem;border-radius:50%}.close-dialog-button:hover{box-shadow:0 0 5px 4px #dadada91}.close-dialog-button:after,.close-dialog-button:before{content:\"\";display:block;background-color:var(--smart-table-fg, #000);height:2px;width:1rem;border-radius:2px}.close-dialog-button:before{rotate:45deg}.close-dialog-button:after{position:absolute;rotate:-45deg}\n"], dependencies: [{ kind: "component", type: FilterComponent, selector: "ng2-smart-table-filter", inputs: ["column", "source", "inputClass"] }, { kind: "ngmodule", type: PortalModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1978
1977
|
}
|
|
1979
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1978
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: MobileFiltersComponent, decorators: [{
|
|
1980
1979
|
type: Component,
|
|
1981
1980
|
args: [{ selector: 'ng2-mobile-filters', imports: [FilterComponent, PortalModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button #reference class=\"filter-toggle\" (click)=\"show()\" aria-label=\"Toggle filters\">\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\">\n <g id=\"SVGRepo_bgCarrier\" stroke-width=\"0\"></g>\n <g id=\"SVGRepo_tracerCarrier\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></g>\n <g id=\"SVGRepo_iconCarrier\">\n <path stroke=\"#000000\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M20 4H4v2l6 6v8.5l4-2.5v-6l6-6V4z\"></path>\n </g>\n </svg>\n</button>\n\n<ng-template cdk-portal>\n <div class=\"dropdown table-filter-dropdown\">\n <div class=\"dropdown-header\">\n <button type=\"button\" class=\"clear-filters-button\" (click)=\"clearAllFilters()\" aria-label=\"Close filters\">\n reset all\n </button>\n <button type=\"button\" class=\"close-dialog-button\" (click)=\"hide()\" aria-label=\"Close dropdown\">\n <span></span>\n </button>\n </div>\n <div class=\"dropdown-content\">\n <div class=\"ng2-smart-mobil-filters\">\n @for (column of grid().dataSet.getVisibleColumns(); track column.id + $index) {\n @if (column.isFilterable) {\n <div class=\"ng2-smart-filter\">\n <label for=\"\" class=\"ng2-smart-filter-label\">{{ column.title }}</label>\n <ng2-smart-table-filter [source]=\"source()\" [column]=\"column\" [inputClass]=\"filterInputClass()\">\n </ng2-smart-table-filter>\n </div>\n }\n }\n </div>\n </div>\n </div>\n</ng-template>\n", styles: [".dropdown{z-index:1;padding:.8rem 1rem;border:none;border-radius:.5rem;background:var(--smart-table-bg, #fff);box-shadow:var(--table-card-shadow, 0 0 8px 5px color-mix(in oklab, var(--smart-table-bg, #d7d7d7) 30%, transparent 50%));max-height:var(--table-header-dropdown-max-height, 60dvh);width:var(--table-header-dropdown-width, 80dvw);max-width:30rem;overflow:auto}.filter-toggle svg{height:1rem;width:1rem}.dropdown-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.dropdown-content{display:flex;flex-direction:column}.dropdown-content ::ng-deep tr{display:flex;flex-direction:column;gap:.3rem}.dropdown-content ::ng-deep th.titles a{display:block;width:100%;padding:.3rem;color:inherit;border-bottom:1px solid var(--smart-table-separator, #d5d5d5)}.close-dialog-button{display:flex;align-items:center;justify-content:center;border:none;background:none;width:2rem;height:2rem;padding:.5rem;border-radius:50%}.close-dialog-button:hover{box-shadow:0 0 5px 4px #dadada91}.close-dialog-button:after,.close-dialog-button:before{content:\"\";display:block;background-color:var(--smart-table-fg, #000);height:2px;width:1rem;border-radius:2px}.close-dialog-button:before{rotate:45deg}.close-dialog-button:after{position:absolute;rotate:-45deg}\n"] }]
|
|
1982
|
-
}] });
|
|
1981
|
+
}], propDecorators: { contentTemplate: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkPortal), { isSignal: true }] }], reference: [{ type: i0.ViewChild, args: ['reference', { isSignal: true }] }], grid: [{ type: i0.Input, args: [{ isSignal: true, alias: "grid", required: true }] }], source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: true }] }], filterInputClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterInputClass", required: true }] }] } });
|
|
1983
1982
|
|
|
1984
1983
|
class TheadFiltersRowComponent {
|
|
1985
1984
|
constructor() {
|
|
1986
|
-
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : []));
|
|
1987
|
-
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : []));
|
|
1988
|
-
this.withoutCreateButton = input(false, ...(ngDevMode ? [{ debugName: "withoutCreateButton" }] : []));
|
|
1989
|
-
this.inputClass = input('', ...(ngDevMode ? [{ debugName: "inputClass" }] : []));
|
|
1985
|
+
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : /* istanbul ignore next */ []));
|
|
1986
|
+
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : /* istanbul ignore next */ []));
|
|
1987
|
+
this.withoutCreateButton = input(false, ...(ngDevMode ? [{ debugName: "withoutCreateButton" }] : /* istanbul ignore next */ []));
|
|
1988
|
+
this.inputClass = input('', ...(ngDevMode ? [{ debugName: "inputClass" }] : /* istanbul ignore next */ []));
|
|
1990
1989
|
this.create = output();
|
|
1991
1990
|
}
|
|
1992
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1993
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1991
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TheadFiltersRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1992
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: TheadFiltersRowComponent, isStandalone: true, selector: "[ng2-st-thead-filters-row]", inputs: { grid: { classPropertyName: "grid", publicName: "grid", isSignal: true, isRequired: true, transformFunction: null }, source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, withoutCreateButton: { classPropertyName: "withoutCreateButton", publicName: "withoutCreateButton", isSignal: true, isRequired: false, transformFunction: null }, inputClass: { classPropertyName: "inputClass", publicName: "inputClass", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { create: "create" }, ngImport: i0, template: `
|
|
1994
1993
|
@if (grid().isMultiSelectVisible()) {
|
|
1995
1994
|
<th></th>
|
|
1996
1995
|
}
|
|
@@ -2008,7 +2007,7 @@ class TheadFiltersRowComponent {
|
|
|
2008
2007
|
}
|
|
2009
2008
|
`, isInline: true, dependencies: [{ kind: "component", type: AddButtonComponent, selector: "[ng2-st-add-button]", inputs: ["grid"], outputs: ["create"] }, { kind: "component", type: FilterComponent, selector: "ng2-smart-table-filter", inputs: ["column", "source", "inputClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2010
2009
|
}
|
|
2011
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2010
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TheadFiltersRowComponent, decorators: [{
|
|
2012
2011
|
type: Component,
|
|
2013
2012
|
args: [{
|
|
2014
2013
|
selector: '[ng2-st-thead-filters-row]',
|
|
@@ -2032,23 +2031,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
2032
2031
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
2033
2032
|
imports: [AddButtonComponent, FilterComponent],
|
|
2034
2033
|
}]
|
|
2035
|
-
}] });
|
|
2034
|
+
}], propDecorators: { grid: [{ type: i0.Input, args: [{ isSignal: true, alias: "grid", required: true }] }], source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: true }] }], withoutCreateButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "withoutCreateButton", required: false }] }], inputClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputClass", required: false }] }], create: [{ type: i0.Output, args: ["create"] }] } });
|
|
2036
2035
|
|
|
2037
2036
|
class ActionsTitleComponent {
|
|
2038
2037
|
constructor() {
|
|
2039
|
-
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : []));
|
|
2038
|
+
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : /* istanbul ignore next */ []));
|
|
2040
2039
|
this.actionsColumnTitle = computed(() => {
|
|
2041
2040
|
const actions = this.grid().settings().actions;
|
|
2042
2041
|
if (!actions) {
|
|
2043
2042
|
return 'Actions';
|
|
2044
2043
|
}
|
|
2045
2044
|
return actions.columnTitle || 'Actions';
|
|
2046
|
-
}, ...(ngDevMode ? [{ debugName: "actionsColumnTitle" }] : []));
|
|
2045
|
+
}, ...(ngDevMode ? [{ debugName: "actionsColumnTitle" }] : /* istanbul ignore next */ []));
|
|
2047
2046
|
}
|
|
2048
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2049
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
2047
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ActionsTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2048
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: ActionsTitleComponent, isStandalone: true, selector: "[ng2-st-actions-title]", inputs: { grid: { classPropertyName: "grid", publicName: "grid", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "ng2-smart-actions" }, ngImport: i0, template: ` <div class="ng2-smart-title">{{ actionsColumnTitle() }}</div> `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2050
2049
|
}
|
|
2051
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2050
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ActionsTitleComponent, decorators: [{
|
|
2052
2051
|
type: Component,
|
|
2053
2052
|
args: [{
|
|
2054
2053
|
selector: '[ng2-st-actions-title]',
|
|
@@ -2058,16 +2057,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
2058
2057
|
class: 'ng2-smart-actions',
|
|
2059
2058
|
},
|
|
2060
2059
|
}]
|
|
2061
|
-
}] });
|
|
2060
|
+
}], propDecorators: { grid: [{ type: i0.Input, args: [{ isSignal: true, alias: "grid", required: true }] }] } });
|
|
2062
2061
|
|
|
2063
2062
|
class CheckboxSelectAllComponent {
|
|
2064
2063
|
constructor() {
|
|
2065
|
-
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : []));
|
|
2064
|
+
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : /* istanbul ignore next */ []));
|
|
2066
2065
|
}
|
|
2067
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2068
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
2066
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CheckboxSelectAllComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2067
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: CheckboxSelectAllComponent, isStandalone: true, selector: "[ng2-st-checkbox-select-all]", inputs: { grid: { classPropertyName: "grid", publicName: "grid", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: ` <input type="checkbox" [ngModel]="this.grid().dataSet.isAllSelected()" /> `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { 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 }); }
|
|
2069
2068
|
}
|
|
2070
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2069
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CheckboxSelectAllComponent, decorators: [{
|
|
2071
2070
|
type: Component,
|
|
2072
2071
|
args: [{
|
|
2073
2072
|
selector: '[ng2-st-checkbox-select-all]',
|
|
@@ -2075,17 +2074,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
2075
2074
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
2076
2075
|
imports: [FormsModule],
|
|
2077
2076
|
}]
|
|
2078
|
-
}] });
|
|
2077
|
+
}], propDecorators: { grid: [{ type: i0.Input, args: [{ isSignal: true, alias: "grid", required: true }] }] } });
|
|
2079
2078
|
|
|
2080
2079
|
class TheadTitlesRowComponent {
|
|
2081
2080
|
constructor() {
|
|
2082
|
-
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : []));
|
|
2083
|
-
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : []));
|
|
2081
|
+
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : /* istanbul ignore next */ []));
|
|
2082
|
+
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : /* istanbul ignore next */ []));
|
|
2084
2083
|
this.sortEmit = output();
|
|
2085
2084
|
this.selectAllRows = output();
|
|
2086
2085
|
}
|
|
2087
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2088
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2086
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TheadTitlesRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2087
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: TheadTitlesRowComponent, isStandalone: true, selector: "[ng2-st-thead-titles-row]", inputs: { grid: { classPropertyName: "grid", publicName: "grid", isSignal: true, isRequired: true, transformFunction: null }, source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { sortEmit: "sortEmit", selectAllRows: "selectAllRows" }, ngImport: i0, template: `
|
|
2089
2088
|
@if (grid().isMultiSelectVisible()) {
|
|
2090
2089
|
<th ng2-st-checkbox-select-all [grid]="grid()" (click)="selectAllRows.emit()"></th>
|
|
2091
2090
|
}
|
|
@@ -2105,7 +2104,7 @@ class TheadTitlesRowComponent {
|
|
|
2105
2104
|
}
|
|
2106
2105
|
`, isInline: true, dependencies: [{ kind: "component", type: CheckboxSelectAllComponent, selector: "[ng2-st-checkbox-select-all]", inputs: ["grid"] }, { kind: "component", type: ActionsTitleComponent, selector: "[ng2-st-actions-title]", inputs: ["grid"] }, { kind: "component", type: ColumnTitleComponent, selector: "ng2-st-column-title", inputs: ["currentSort", "column"], outputs: ["sortEmit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2107
2106
|
}
|
|
2108
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2107
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TheadTitlesRowComponent, decorators: [{
|
|
2109
2108
|
type: Component,
|
|
2110
2109
|
args: [{
|
|
2111
2110
|
selector: '[ng2-st-thead-titles-row]',
|
|
@@ -2131,37 +2130,37 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
2131
2130
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
2132
2131
|
imports: [CheckboxSelectAllComponent, ActionsTitleComponent, ColumnTitleComponent],
|
|
2133
2132
|
}]
|
|
2134
|
-
}] });
|
|
2133
|
+
}], propDecorators: { grid: [{ type: i0.Input, args: [{ isSignal: true, alias: "grid", required: true }] }], source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: true }] }], sortEmit: [{ type: i0.Output, args: ["sortEmit"] }], selectAllRows: [{ type: i0.Output, args: ["selectAllRows"] }] } });
|
|
2135
2134
|
|
|
2136
2135
|
class Ng2SmartTableTheadComponent {
|
|
2137
2136
|
constructor() {
|
|
2138
|
-
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : []));
|
|
2139
|
-
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : []));
|
|
2140
|
-
this.isMobileView = input(false, ...(ngDevMode ? [{ debugName: "isMobileView" }] : []));
|
|
2137
|
+
this.grid = input.required(...(ngDevMode ? [{ debugName: "grid" }] : /* istanbul ignore next */ []));
|
|
2138
|
+
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : /* istanbul ignore next */ []));
|
|
2139
|
+
this.isMobileView = input(false, ...(ngDevMode ? [{ debugName: "isMobileView" }] : /* istanbul ignore next */ []));
|
|
2141
2140
|
this.selectAllRows = output();
|
|
2142
2141
|
this.create = output();
|
|
2143
2142
|
this.isHideHeader = computed(() => {
|
|
2144
2143
|
return this.grid().settings()?.hideHeader || false;
|
|
2145
|
-
}, ...(ngDevMode ? [{ debugName: "isHideHeader" }] : []));
|
|
2144
|
+
}, ...(ngDevMode ? [{ debugName: "isHideHeader" }] : /* istanbul ignore next */ []));
|
|
2146
2145
|
this.isHideSubHeader = computed(() => {
|
|
2147
2146
|
return this.grid().settings()?.hideSubHeader || false;
|
|
2148
|
-
}, ...(ngDevMode ? [{ debugName: "isHideSubHeader" }] : []));
|
|
2147
|
+
}, ...(ngDevMode ? [{ debugName: "isHideSubHeader" }] : /* istanbul ignore next */ []));
|
|
2149
2148
|
this.columnsWithSort = computed(() => this.grid()
|
|
2150
2149
|
.dataSet.getColumns()
|
|
2151
|
-
.filter((column) => column.isSortable), ...(ngDevMode ? [{ debugName: "columnsWithSort" }] : []));
|
|
2152
|
-
this.columnsWithSortLength = computed(() => this.columnsWithSort().length, ...(ngDevMode ? [{ debugName: "columnsWithSortLength" }] : []));
|
|
2150
|
+
.filter((column) => column.isSortable), ...(ngDevMode ? [{ debugName: "columnsWithSort" }] : /* istanbul ignore next */ []));
|
|
2151
|
+
this.columnsWithSortLength = computed(() => this.columnsWithSort().length, ...(ngDevMode ? [{ debugName: "columnsWithSortLength" }] : /* istanbul ignore next */ []));
|
|
2153
2152
|
this.columnsWithFiltersLength = computed(() => this.grid()
|
|
2154
2153
|
.dataSet.getColumns()
|
|
2155
|
-
.filter((column) => column.isFilterable).length, ...(ngDevMode ? [{ debugName: "columnsWithFiltersLength" }] : []));
|
|
2156
|
-
this.currentSortConfig = computed(() => this.source().getSort(), ...(ngDevMode ? [{ debugName: "currentSortConfig" }] : []));
|
|
2157
|
-
this.filterDropdownIsOpen = signal(false, ...(ngDevMode ? [{ debugName: "filterDropdownIsOpen" }] : []));
|
|
2154
|
+
.filter((column) => column.isFilterable).length, ...(ngDevMode ? [{ debugName: "columnsWithFiltersLength" }] : /* istanbul ignore next */ []));
|
|
2155
|
+
this.currentSortConfig = computed(() => this.source().getSort(), ...(ngDevMode ? [{ debugName: "currentSortConfig" }] : /* istanbul ignore next */ []));
|
|
2156
|
+
this.filterDropdownIsOpen = signal(false, ...(ngDevMode ? [{ debugName: "filterDropdownIsOpen" }] : /* istanbul ignore next */ []));
|
|
2158
2157
|
this.filterInputClass = computed(() => {
|
|
2159
2158
|
const filterOptions = this.grid().settings()?.filter;
|
|
2160
2159
|
if (!filterOptions) {
|
|
2161
2160
|
return '';
|
|
2162
2161
|
}
|
|
2163
2162
|
return filterOptions.inputClass || '';
|
|
2164
|
-
}, ...(ngDevMode ? [{ debugName: "filterInputClass" }] : []));
|
|
2163
|
+
}, ...(ngDevMode ? [{ debugName: "filterInputClass" }] : /* istanbul ignore next */ []));
|
|
2165
2164
|
this.lastColumnSort = null;
|
|
2166
2165
|
}
|
|
2167
2166
|
toggleDropdown(state) {
|
|
@@ -2215,10 +2214,10 @@ class Ng2SmartTableTheadComponent {
|
|
|
2215
2214
|
this.lastColumnSort.count++;
|
|
2216
2215
|
return newSort;
|
|
2217
2216
|
}
|
|
2218
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2219
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2217
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: Ng2SmartTableTheadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2218
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: Ng2SmartTableTheadComponent, isStandalone: true, selector: "[ng2-st-thead]", inputs: { grid: { classPropertyName: "grid", publicName: "grid", isSignal: true, isRequired: true, transformFunction: null }, source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, isMobileView: { classPropertyName: "isMobileView", publicName: "isMobileView", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectAllRows: "selectAllRows", create: "create" }, ngImport: i0, template: "@if (isMobileView()) {\n <tr class=\"ng2-smart-titles mobile-header mobile-header-top-row\">\n <th colspan=\"50\">\n <div class=\"mobile-header-content\">\n <div ng2-st-add-button [grid]=\"grid()\" (create)=\"create.emit($event)\"></div>\n @if (columnsWithSortLength()) {\n <div class=\"current-column-title\">\n @if (currentSortConfig(); as sortConfig) {\n <a href=\"#\" (click)=\"$event.preventDefault(); sortByColumn()\" class=\"ng2-smart-sort-link sort\">\n {{ sortConfig.title }}\n <span class=\"sort-direction\">{{ sortConfig.direction === 'asc' ? '\u2191' : '\u2193' }}</span>\n </a>\n }\n\n @if (columnsWithSortLength() > 1) {\n <button\n #sortTrigger=\"cdkOverlayOrigin\"\n cdkOverlayOrigin\n class=\"sort-dropdown-toggle-button\"\n (click)=\"toggleDropdown()\"\n [class.active]=\"filterDropdownIsOpen()\"\n aria-label=\"Toggle sort options\">\n <span class=\"sort-icon\">\u25BC</span>\n </button>\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"sortTrigger\"\n [cdkConnectedOverlayOpen]=\"filterDropdownIsOpen()\"\n [cdkConnectedOverlayWidth]=\"300\"\n [cdkConnectedOverlayPositions]=\"[\n {\n originX: 'center',\n originY: 'bottom',\n overlayX: 'center',\n overlayY: 'top',\n },\n ]\"\n (overlayOutsideClick)=\"toggleDropdown(false)\">\n <div class=\"dropdown\">\n <div class=\"dropdown-header\">\n <p></p>\n <button\n type=\"button\"\n class=\"close-dialog-button\"\n (click)=\"toggleDropdown(false)\"\n aria-label=\"Close filters\">\n <span></span>\n </button>\n </div>\n <div class=\"dropdown-content\">\n @for (column of columnsWithSort(); track $index) {\n <th class=\"titles\">\n <ng2-st-column-title\n class=\"sort-option\"\n [column]=\"column\"\n (sortEmit)=\"sortByColumn(column)\"\n [currentSort]=\"currentSortConfig()\"></ng2-st-column-title>\n </th>\n }\n </div>\n </div>\n </ng-template>\n }\n </div>\n }\n\n <div class=\"header-actions\">\n @if (columnsWithFiltersLength()) {\n <ng2-mobile-filters [grid]=\"grid()\" [source]=\"source()\" [filterInputClass]=\"filterInputClass()\">\n </ng2-mobile-filters>\n }\n </div>\n </div>\n </th>\n </tr>\n} @else {\n <!-- Desktop view header -->\n @if (!isHideHeader()) {\n <tr\n ng2-st-thead-titles-row\n class=\"ng2-smart-titles\"\n [grid]=\"grid()\"\n [source]=\"source()\"\n (sortEmit)=\"sortByColumn($event)\"\n (selectAllRows)=\"selectAllRows.emit()\"></tr>\n }\n\n @if (!isHideSubHeader()) {\n <ng-container [ngTemplateOutlet]=\"filtersRow\"></ng-container>\n }\n}\n\n<ng-template #filtersRow>\n <tr\n ng2-st-thead-filters-row\n class=\"ng2-smart-filters\"\n [grid]=\"grid()\"\n [inputClass]=\"filterInputClass()\"\n [withoutCreateButton]=\"isMobileView()\"\n [source]=\"source()\"\n (create)=\"create.emit()\"></tr>\n</ng-template>\n", styles: ["tr.mobile-header-top-row .mobile-header-content{display:flex;align-items:center;justify-content:space-between}tr.mobile-header-top-row .mobile-header-content .current-column-title{font-weight:700;flex:1;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}tr.mobile-header-top-row .mobile-header-content button.sort-dropdown-toggle-button{transition:transform .2s ease}tr.mobile-header-top-row .mobile-header-content button.sort-dropdown-toggle-button.active{transform:rotate(180deg)}.dropdown{z-index:1;padding:.8rem 1rem;border:none;border-radius:.5rem;background:var(--smart-table-bg, #fff);box-shadow:var(--table-card-shadow, 0 0 8px 5px color-mix(in oklab, var(--smart-table-bg, #d7d7d7) 30%, transparent 50%));max-height:var(--table-header-dropdown-max-height, 60dvh);width:var(--table-header-dropdown-width, 80dvw);max-width:30rem;overflow:auto}.dropdown-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.dropdown-content{display:flex;flex-direction:column}.dropdown-content ::ng-deep tr{display:flex;flex-direction:column;gap:.3rem}.dropdown-content ::ng-deep th.titles a{display:block;width:100%;padding:.3rem;color:inherit;border-bottom:1px solid var(--smart-table-separator, #d5d5d5)}.close-dialog-button{display:flex;align-items:center;justify-content:center;border:none;background:none;width:2rem;height:2rem;padding:.5rem;border-radius:50%}.close-dialog-button:hover{box-shadow:0 0 5px 4px #dadada91}.close-dialog-button:after,.close-dialog-button:before{content:\"\";display:block;background-color:var(--smart-table-fg, #000);height:2px;width:1rem;border-radius:2px}.close-dialog-button:before{rotate:45deg}.close-dialog-button:after{position:absolute;rotate:-45deg}\n"], dependencies: [{ kind: "component", type: TheadTitlesRowComponent, selector: "[ng2-st-thead-titles-row]", inputs: ["grid", "source"], outputs: ["sortEmit", "selectAllRows"] }, { kind: "component", type: AddButtonComponent, selector: "[ng2-st-add-button]", inputs: ["grid"], outputs: ["create"] }, { kind: "component", type: MobileFiltersComponent, selector: "ng2-mobile-filters", inputs: ["grid", "source", "filterInputClass"] }, { kind: "component", type: ColumnTitleComponent, selector: "ng2-st-column-title", inputs: ["currentSort", "column"], outputs: ["sortEmit"] }, { kind: "component", type: TheadFiltersRowComponent, selector: "[ng2-st-thead-filters-row]", inputs: ["grid", "source", "withoutCreateButton", "inputClass"], outputs: ["create"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2220
2219
|
}
|
|
2221
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2220
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: Ng2SmartTableTheadComponent, decorators: [{
|
|
2222
2221
|
type: Component,
|
|
2223
2222
|
args: [{ selector: '[ng2-st-thead]', imports: [
|
|
2224
2223
|
TheadTitlesRowComponent,
|
|
@@ -2229,23 +2228,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
2229
2228
|
NgTemplateOutlet,
|
|
2230
2229
|
OverlayModule,
|
|
2231
2230
|
], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isMobileView()) {\n <tr class=\"ng2-smart-titles mobile-header mobile-header-top-row\">\n <th colspan=\"50\">\n <div class=\"mobile-header-content\">\n <div ng2-st-add-button [grid]=\"grid()\" (create)=\"create.emit($event)\"></div>\n @if (columnsWithSortLength()) {\n <div class=\"current-column-title\">\n @if (currentSortConfig(); as sortConfig) {\n <a href=\"#\" (click)=\"$event.preventDefault(); sortByColumn()\" class=\"ng2-smart-sort-link sort\">\n {{ sortConfig.title }}\n <span class=\"sort-direction\">{{ sortConfig.direction === 'asc' ? '\u2191' : '\u2193' }}</span>\n </a>\n }\n\n @if (columnsWithSortLength() > 1) {\n <button\n #sortTrigger=\"cdkOverlayOrigin\"\n cdkOverlayOrigin\n class=\"sort-dropdown-toggle-button\"\n (click)=\"toggleDropdown()\"\n [class.active]=\"filterDropdownIsOpen()\"\n aria-label=\"Toggle sort options\">\n <span class=\"sort-icon\">\u25BC</span>\n </button>\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"sortTrigger\"\n [cdkConnectedOverlayOpen]=\"filterDropdownIsOpen()\"\n [cdkConnectedOverlayWidth]=\"300\"\n [cdkConnectedOverlayPositions]=\"[\n {\n originX: 'center',\n originY: 'bottom',\n overlayX: 'center',\n overlayY: 'top',\n },\n ]\"\n (overlayOutsideClick)=\"toggleDropdown(false)\">\n <div class=\"dropdown\">\n <div class=\"dropdown-header\">\n <p></p>\n <button\n type=\"button\"\n class=\"close-dialog-button\"\n (click)=\"toggleDropdown(false)\"\n aria-label=\"Close filters\">\n <span></span>\n </button>\n </div>\n <div class=\"dropdown-content\">\n @for (column of columnsWithSort(); track $index) {\n <th class=\"titles\">\n <ng2-st-column-title\n class=\"sort-option\"\n [column]=\"column\"\n (sortEmit)=\"sortByColumn(column)\"\n [currentSort]=\"currentSortConfig()\"></ng2-st-column-title>\n </th>\n }\n </div>\n </div>\n </ng-template>\n }\n </div>\n }\n\n <div class=\"header-actions\">\n @if (columnsWithFiltersLength()) {\n <ng2-mobile-filters [grid]=\"grid()\" [source]=\"source()\" [filterInputClass]=\"filterInputClass()\">\n </ng2-mobile-filters>\n }\n </div>\n </div>\n </th>\n </tr>\n} @else {\n <!-- Desktop view header -->\n @if (!isHideHeader()) {\n <tr\n ng2-st-thead-titles-row\n class=\"ng2-smart-titles\"\n [grid]=\"grid()\"\n [source]=\"source()\"\n (sortEmit)=\"sortByColumn($event)\"\n (selectAllRows)=\"selectAllRows.emit()\"></tr>\n }\n\n @if (!isHideSubHeader()) {\n <ng-container [ngTemplateOutlet]=\"filtersRow\"></ng-container>\n }\n}\n\n<ng-template #filtersRow>\n <tr\n ng2-st-thead-filters-row\n class=\"ng2-smart-filters\"\n [grid]=\"grid()\"\n [inputClass]=\"filterInputClass()\"\n [withoutCreateButton]=\"isMobileView()\"\n [source]=\"source()\"\n (create)=\"create.emit()\"></tr>\n</ng-template>\n", styles: ["tr.mobile-header-top-row .mobile-header-content{display:flex;align-items:center;justify-content:space-between}tr.mobile-header-top-row .mobile-header-content .current-column-title{font-weight:700;flex:1;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}tr.mobile-header-top-row .mobile-header-content button.sort-dropdown-toggle-button{transition:transform .2s ease}tr.mobile-header-top-row .mobile-header-content button.sort-dropdown-toggle-button.active{transform:rotate(180deg)}.dropdown{z-index:1;padding:.8rem 1rem;border:none;border-radius:.5rem;background:var(--smart-table-bg, #fff);box-shadow:var(--table-card-shadow, 0 0 8px 5px color-mix(in oklab, var(--smart-table-bg, #d7d7d7) 30%, transparent 50%));max-height:var(--table-header-dropdown-max-height, 60dvh);width:var(--table-header-dropdown-width, 80dvw);max-width:30rem;overflow:auto}.dropdown-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.dropdown-content{display:flex;flex-direction:column}.dropdown-content ::ng-deep tr{display:flex;flex-direction:column;gap:.3rem}.dropdown-content ::ng-deep th.titles a{display:block;width:100%;padding:.3rem;color:inherit;border-bottom:1px solid var(--smart-table-separator, #d5d5d5)}.close-dialog-button{display:flex;align-items:center;justify-content:center;border:none;background:none;width:2rem;height:2rem;padding:.5rem;border-radius:50%}.close-dialog-button:hover{box-shadow:0 0 5px 4px #dadada91}.close-dialog-button:after,.close-dialog-button:before{content:\"\";display:block;background-color:var(--smart-table-fg, #000);height:2px;width:1rem;border-radius:2px}.close-dialog-button:before{rotate:45deg}.close-dialog-button:after{position:absolute;rotate:-45deg}\n"] }]
|
|
2232
|
-
}] });
|
|
2231
|
+
}], propDecorators: { grid: [{ type: i0.Input, args: [{ isSignal: true, alias: "grid", required: true }] }], source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: true }] }], isMobileView: [{ type: i0.Input, args: [{ isSignal: true, alias: "isMobileView", required: false }] }], selectAllRows: [{ type: i0.Output, args: ["selectAllRows"] }], create: [{ type: i0.Output, args: ["create"] }] } });
|
|
2233
2232
|
|
|
2234
2233
|
class DataSet {
|
|
2235
2234
|
constructor(dataList = [], columnSettings, editorInputClass, cellEmptyText) {
|
|
2236
2235
|
this.columnSettings = columnSettings;
|
|
2237
2236
|
this.editorInputClass = editorInputClass;
|
|
2238
2237
|
this.cellEmptyText = cellEmptyText;
|
|
2239
|
-
this.data = signal([], ...(ngDevMode ? [{ debugName: "data" }] : []));
|
|
2240
|
-
this.columns = signal([], ...(ngDevMode ? [{ debugName: "columns" }] : []));
|
|
2241
|
-
this.rows = signal([], ...(ngDevMode ? [{ debugName: "rows" }] : []));
|
|
2238
|
+
this.data = signal([], ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
|
|
2239
|
+
this.columns = signal([], ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
|
|
2240
|
+
this.rows = signal([], ...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
|
|
2242
2241
|
this.selectedRowsData = [];
|
|
2243
|
-
this.getColumns = computed(() => this.columns(), ...(ngDevMode ? [{ debugName: "getColumns" }] : []));
|
|
2244
|
-
this.getVisibleColumns = computed(() => this.columns().filter((column) => !column.hide), ...(ngDevMode ? [{ debugName: "getVisibleColumns" }] : []));
|
|
2242
|
+
this.getColumns = computed(() => this.columns(), ...(ngDevMode ? [{ debugName: "getColumns" }] : /* istanbul ignore next */ []));
|
|
2243
|
+
this.getVisibleColumns = computed(() => this.columns().filter((column) => !column.hide), ...(ngDevMode ? [{ debugName: "getVisibleColumns" }] : /* istanbul ignore next */ []));
|
|
2245
2244
|
this.getRows = computed(() => {
|
|
2246
2245
|
return this.rows();
|
|
2247
|
-
}, ...(ngDevMode ? [{ debugName: "getRows" }] : []));
|
|
2248
|
-
this.isAllSelected = computed(() => this.rows().every((row) => row.isSelected()), ...(ngDevMode ? [{ debugName: "isAllSelected" }] : []));
|
|
2246
|
+
}, ...(ngDevMode ? [{ debugName: "getRows" }] : /* istanbul ignore next */ []));
|
|
2247
|
+
this.isAllSelected = computed(() => this.rows().every((row) => row.isSelected()), ...(ngDevMode ? [{ debugName: "isAllSelected" }] : /* istanbul ignore next */ []));
|
|
2249
2248
|
this.createColumns(columnSettings);
|
|
2250
2249
|
this.setData(dataList);
|
|
2251
2250
|
this.createNewRow();
|
|
@@ -2335,29 +2334,29 @@ class DataSet {
|
|
|
2335
2334
|
class Grid {
|
|
2336
2335
|
constructor(source, settings) {
|
|
2337
2336
|
this.currentColumnsSortState = [];
|
|
2338
|
-
this.settings = signal({}, ...(ngDevMode ? [{ debugName: "settings" }] : []));
|
|
2339
|
-
this.createFormShown = signal(false, ...(ngDevMode ? [{ debugName: "createFormShown" }] : []));
|
|
2337
|
+
this.settings = signal({}, ...(ngDevMode ? [{ debugName: "settings" }] : /* istanbul ignore next */ []));
|
|
2338
|
+
this.createFormShown = signal(false, ...(ngDevMode ? [{ debugName: "createFormShown" }] : /* istanbul ignore next */ []));
|
|
2340
2339
|
this.isMultiSelectVisible = computed(() => {
|
|
2341
2340
|
return this.settings().selectMode === 'multi';
|
|
2342
|
-
}, ...(ngDevMode ? [{ debugName: "isMultiSelectVisible" }] : []));
|
|
2341
|
+
}, ...(ngDevMode ? [{ debugName: "isMultiSelectVisible" }] : /* istanbul ignore next */ []));
|
|
2343
2342
|
this.isActionsVisible = computed(() => {
|
|
2344
2343
|
const actions = this.settings().actions;
|
|
2345
2344
|
if (!actions)
|
|
2346
2345
|
return false;
|
|
2347
2346
|
return actions.edit || actions.delete || !!actions?.custom?.length;
|
|
2348
|
-
}, ...(ngDevMode ? [{ debugName: "isActionsVisible" }] : []));
|
|
2347
|
+
}, ...(ngDevMode ? [{ debugName: "isActionsVisible" }] : /* istanbul ignore next */ []));
|
|
2349
2348
|
this.actionIsOnLeft = computed(() => {
|
|
2350
2349
|
return (this.settings().actionsPosition || 'left') === 'left';
|
|
2351
|
-
}, ...(ngDevMode ? [{ debugName: "actionIsOnLeft" }] : []));
|
|
2350
|
+
}, ...(ngDevMode ? [{ debugName: "actionIsOnLeft" }] : /* istanbul ignore next */ []));
|
|
2352
2351
|
this.actionIsOnRight = computed(() => {
|
|
2353
2352
|
return this.settings().actionsPosition === 'right';
|
|
2354
|
-
}, ...(ngDevMode ? [{ debugName: "actionIsOnRight" }] : []));
|
|
2353
|
+
}, ...(ngDevMode ? [{ debugName: "actionIsOnRight" }] : /* istanbul ignore next */ []));
|
|
2355
2354
|
this.columnSortDragDelay = computed(() => {
|
|
2356
2355
|
return this.settings().columnSort?.dragDelay || 0;
|
|
2357
|
-
}, ...(ngDevMode ? [{ debugName: "columnSortDragDelay" }] : []));
|
|
2356
|
+
}, ...(ngDevMode ? [{ debugName: "columnSortDragDelay" }] : /* istanbul ignore next */ []));
|
|
2358
2357
|
this.columnStateStorageKey = computed(() => {
|
|
2359
2358
|
return this.settings().columnSort?.stateStorageKey;
|
|
2360
|
-
}, ...(ngDevMode ? [{ debugName: "columnStateStorageKey" }] : []));
|
|
2359
|
+
}, ...(ngDevMode ? [{ debugName: "columnStateStorageKey" }] : /* istanbul ignore next */ []));
|
|
2361
2360
|
this.setSource(source, settings);
|
|
2362
2361
|
this.setSettings(settings);
|
|
2363
2362
|
}
|
|
@@ -2620,8 +2619,8 @@ class Ng2SmartTableComponent {
|
|
|
2620
2619
|
this.elementRef = inject(ElementRef);
|
|
2621
2620
|
this.ngZone = inject(NgZone);
|
|
2622
2621
|
this.injector = inject(Injector);
|
|
2623
|
-
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : []));
|
|
2624
|
-
this.settings = input.required(...(ngDevMode ? [{ debugName: "settings" }] : []));
|
|
2622
|
+
this.source = input.required(...(ngDevMode ? [{ debugName: "source" }] : /* istanbul ignore next */ []));
|
|
2623
|
+
this.settings = input.required(...(ngDevMode ? [{ debugName: "settings" }] : /* istanbul ignore next */ []));
|
|
2625
2624
|
/**
|
|
2626
2625
|
* @description If you want to display pagination in your custom container, you can pass it to "paginationSlot".
|
|
2627
2626
|
* @example
|
|
@@ -2635,7 +2634,7 @@ class Ng2SmartTableComponent {
|
|
|
2635
2634
|
* read: ViewContainerRef,
|
|
2636
2635
|
* });
|
|
2637
2636
|
*/
|
|
2638
|
-
this.paginationSlot = input(...(ngDevMode ? [undefined, { debugName: "paginationSlot" }] : []));
|
|
2637
|
+
this.paginationSlot = input(...(ngDevMode ? [undefined, { debugName: "paginationSlot" }] : /* istanbul ignore next */ []));
|
|
2639
2638
|
/**
|
|
2640
2639
|
* @description if you want to render custom data inside a container with pagination you can pass a TemplateRef
|
|
2641
2640
|
* @example
|
|
@@ -2656,7 +2655,7 @@ class Ng2SmartTableComponent {
|
|
|
2656
2655
|
* </ng-container>
|
|
2657
2656
|
* </ng2-smart-table>
|
|
2658
2657
|
*/
|
|
2659
|
-
this.paginationTemplateData = input(...(ngDevMode ? [undefined, { debugName: "paginationTemplateData" }] : []));
|
|
2658
|
+
this.paginationTemplateData = input(...(ngDevMode ? [undefined, { debugName: "paginationTemplateData" }] : /* istanbul ignore next */ []));
|
|
2660
2659
|
this.multiRowSelect = output();
|
|
2661
2660
|
this.rowClicked = output();
|
|
2662
2661
|
this.columnsSorted = output();
|
|
@@ -2670,25 +2669,25 @@ class Ng2SmartTableComponent {
|
|
|
2670
2669
|
this.custom = output();
|
|
2671
2670
|
this.tableClass = computed(() => {
|
|
2672
2671
|
return this.settings().attr?.class || '';
|
|
2673
|
-
}, ...(ngDevMode ? [{ debugName: "tableClass" }] : []));
|
|
2672
|
+
}, ...(ngDevMode ? [{ debugName: "tableClass" }] : /* istanbul ignore next */ []));
|
|
2674
2673
|
this.tableId = computed(() => {
|
|
2675
2674
|
return this.settings().attr?.id || getRandomId();
|
|
2676
|
-
}, ...(ngDevMode ? [{ debugName: "tableId" }] : []));
|
|
2675
|
+
}, ...(ngDevMode ? [{ debugName: "tableId" }] : /* istanbul ignore next */ []));
|
|
2677
2676
|
this.isPagerDisplay = computed(() => {
|
|
2678
2677
|
const { pager } = this.settings();
|
|
2679
2678
|
return pager ? pager.display : false;
|
|
2680
|
-
}, ...(ngDevMode ? [{ debugName: "isPagerDisplay" }] : []));
|
|
2679
|
+
}, ...(ngDevMode ? [{ debugName: "isPagerDisplay" }] : /* istanbul ignore next */ []));
|
|
2681
2680
|
this.rowClassFunction = computed(() => {
|
|
2682
2681
|
const settings = this.settings();
|
|
2683
2682
|
return settings.rowClassFunction ? (rowData) => settings.rowClassFunction(rowData) : () => '';
|
|
2684
|
-
}, ...(ngDevMode ? [{ debugName: "rowClassFunction" }] : []));
|
|
2685
|
-
this.isMobileView = signal(false, ...(ngDevMode ? [{ debugName: "isMobileView" }] : []));
|
|
2683
|
+
}, ...(ngDevMode ? [{ debugName: "rowClassFunction" }] : /* istanbul ignore next */ []));
|
|
2684
|
+
this.isMobileView = signal(false, ...(ngDevMode ? [{ debugName: "isMobileView" }] : /* istanbul ignore next */ []));
|
|
2686
2685
|
this.tableWidthMobileBreakpoint = computed(() => {
|
|
2687
2686
|
return this.settings().tableWidthMobileBreakpoint;
|
|
2688
|
-
}, ...(ngDevMode ? [{ debugName: "tableWidthMobileBreakpoint" }] : []));
|
|
2687
|
+
}, ...(ngDevMode ? [{ debugName: "tableWidthMobileBreakpoint" }] : /* istanbul ignore next */ []));
|
|
2689
2688
|
this.isExternalMode = computed(() => {
|
|
2690
2689
|
return this.grid.settings().mode === 'external';
|
|
2691
|
-
}, ...(ngDevMode ? [{ debugName: "isExternalMode" }] : []));
|
|
2690
|
+
}, ...(ngDevMode ? [{ debugName: "isExternalMode" }] : /* istanbul ignore next */ []));
|
|
2692
2691
|
this.resizeObserver = null;
|
|
2693
2692
|
this.resizeDebounceTimer = null;
|
|
2694
2693
|
this.paginationComponentRef = null;
|
|
@@ -2835,13 +2834,13 @@ class Ng2SmartTableComponent {
|
|
|
2835
2834
|
this.resizeDebounceTimer = null;
|
|
2836
2835
|
}
|
|
2837
2836
|
}
|
|
2838
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2839
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2837
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: Ng2SmartTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2838
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: Ng2SmartTableComponent, isStandalone: true, selector: "ng2-smart-table", inputs: { source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, settings: { classPropertyName: "settings", publicName: "settings", isSignal: true, isRequired: true, transformFunction: null }, paginationSlot: { classPropertyName: "paginationSlot", publicName: "paginationSlot", isSignal: true, isRequired: false, transformFunction: null }, paginationTemplateData: { classPropertyName: "paginationTemplateData", publicName: "paginationTemplateData", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { multiRowSelect: "multiRowSelect", rowClicked: "rowClicked", columnsSorted: "columnsSorted", deleteEmitter: "deleteEmitter", deleteConfirm: "deleteConfirm", edit: "edit", editConfirm: "editConfirm", editCancel: "editCancel", create: "create", createConfirm: "createConfirm", custom: "custom" }, usesOnChanges: true, ngImport: i0, template: "<table [id]=\"tableId()\" [class]=\"tableClass()\" [class.mobile-view]=\"isMobileView()\">\n <thead\n ng2-st-thead\n [grid]=\"grid\"\n [source]=\"source()\"\n [isMobileView]=\"isMobileView()\"\n (create)=\"createEmitted()\"\n (selectAllRows)=\"onSelectAllRows()\"></thead>\n\n <tbody\n ng2-st-tbody\n [grid]=\"grid\"\n [source]=\"source()\"\n [rowClassFunction]=\"rowClassFunction()\"\n [isMobileView]=\"isMobileView()\"\n (deleteEmitter)=\"deleEmitted($event)\"\n (edit)=\"editEmitted($event)\"\n (editConfirmed)=\"editConfirmed($event)\"\n (editCancel)=\"editCanceled($event)\"\n (createConfirmed)=\"createConfirmed()\"\n (customActionEmitter)=\"customActionEmitted($event)\"\n (userClickedRow)=\"emitUserRowClicked($event)\"\n (multipleSelectRow)=\"multipleSelectRow($event)\"></tbody>\n</table>\n\n@if (isPagerDisplay() && !paginationSlot()) {\n <ng2-smart-table-pager [source]=\"source()\" [content]=\"paginationTemplateData()\">\n <ng-content select=\"[pager-content]\"></ng-content>\n </ng2-smart-table-pager>\n}\n", styles: [":host{max-width:100%;display:block}:host table{width:100%}:host .close-dialog-button{display:flex;align-items:center;justify-content:center;border:none;background:none;width:2rem;height:2rem;padding:.5rem;border-radius:50%}:host .close-dialog-button:hover{box-shadow:0 0 5px 4px #dadada91}:host .close-dialog-button:after,:host .close-dialog-button:before{content:\"\";display:block;background-color:var(--smart-table-fg, #000);height:2px;width:1rem;border-radius:2px}:host .close-dialog-button:before{rotate:45deg}:host .close-dialog-button:after{position:absolute;rotate:-45deg}\n"], dependencies: [{ kind: "component", type: Ng2SmartTableTheadComponent, selector: "[ng2-st-thead]", inputs: ["grid", "source", "isMobileView"], outputs: ["selectAllRows", "create"] }, { kind: "component", type: Ng2SmartTableTbodyComponent, selector: "[ng2-st-tbody]", inputs: ["grid", "source", "rowClassFunction", "isMobileView"], outputs: ["edit", "editConfirmed", "editCancel", "createConfirmed", "deleteEmitter", "customActionEmitter", "userClickedRow", "multipleSelectRow"] }, { kind: "component", type: PagerComponent, selector: "ng2-smart-table-pager", inputs: ["source", "content"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2840
2839
|
}
|
|
2841
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2840
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: Ng2SmartTableComponent, decorators: [{
|
|
2842
2841
|
type: Component,
|
|
2843
2842
|
args: [{ selector: 'ng2-smart-table', imports: [Ng2SmartTableTheadComponent, Ng2SmartTableTbodyComponent, PagerComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<table [id]=\"tableId()\" [class]=\"tableClass()\" [class.mobile-view]=\"isMobileView()\">\n <thead\n ng2-st-thead\n [grid]=\"grid\"\n [source]=\"source()\"\n [isMobileView]=\"isMobileView()\"\n (create)=\"createEmitted()\"\n (selectAllRows)=\"onSelectAllRows()\"></thead>\n\n <tbody\n ng2-st-tbody\n [grid]=\"grid\"\n [source]=\"source()\"\n [rowClassFunction]=\"rowClassFunction()\"\n [isMobileView]=\"isMobileView()\"\n (deleteEmitter)=\"deleEmitted($event)\"\n (edit)=\"editEmitted($event)\"\n (editConfirmed)=\"editConfirmed($event)\"\n (editCancel)=\"editCanceled($event)\"\n (createConfirmed)=\"createConfirmed()\"\n (customActionEmitter)=\"customActionEmitted($event)\"\n (userClickedRow)=\"emitUserRowClicked($event)\"\n (multipleSelectRow)=\"multipleSelectRow($event)\"></tbody>\n</table>\n\n@if (isPagerDisplay() && !paginationSlot()) {\n <ng2-smart-table-pager [source]=\"source()\" [content]=\"paginationTemplateData()\">\n <ng-content select=\"[pager-content]\"></ng-content>\n </ng2-smart-table-pager>\n}\n", styles: [":host{max-width:100%;display:block}:host table{width:100%}:host .close-dialog-button{display:flex;align-items:center;justify-content:center;border:none;background:none;width:2rem;height:2rem;padding:.5rem;border-radius:50%}:host .close-dialog-button:hover{box-shadow:0 0 5px 4px #dadada91}:host .close-dialog-button:after,:host .close-dialog-button:before{content:\"\";display:block;background-color:var(--smart-table-fg, #000);height:2px;width:1rem;border-radius:2px}:host .close-dialog-button:before{rotate:45deg}:host .close-dialog-button:after{position:absolute;rotate:-45deg}\n"] }]
|
|
2844
|
-
}] });
|
|
2843
|
+
}], propDecorators: { source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: true }] }], settings: [{ type: i0.Input, args: [{ isSignal: true, alias: "settings", required: true }] }], paginationSlot: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginationSlot", required: false }] }], paginationTemplateData: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginationTemplateData", required: false }] }], multiRowSelect: [{ type: i0.Output, args: ["multiRowSelect"] }], rowClicked: [{ type: i0.Output, args: ["rowClicked"] }], columnsSorted: [{ type: i0.Output, args: ["columnsSorted"] }], deleteEmitter: [{ type: i0.Output, args: ["deleteEmitter"] }], deleteConfirm: [{ type: i0.Output, args: ["deleteConfirm"] }], edit: [{ type: i0.Output, args: ["edit"] }], editConfirm: [{ type: i0.Output, args: ["editConfirm"] }], editCancel: [{ type: i0.Output, args: ["editCancel"] }], create: [{ type: i0.Output, args: ["create"] }], createConfirm: [{ type: i0.Output, args: ["createConfirm"] }], custom: [{ type: i0.Output, args: ["custom"] }] } });
|
|
2845
2844
|
|
|
2846
2845
|
/**
|
|
2847
2846
|
* Generated bundle index. Do not edit.
|