@den4ik92/ng2-smart-table 19.5.43 → 19.5.45

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.
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { input, computed, ChangeDetectionStrategy, Component, signal, effect, inject, ElementRef, Directive, ViewContainerRef, ViewChild, output, viewChild } from '@angular/core';
2
+ import { input, computed, ChangeDetectionStrategy, Component, signal, effect, inject, ElementRef, Directive, untracked, ViewContainerRef, ViewChild, output, viewChild } from '@angular/core';
3
3
  import * as i1 from '@angular/forms';
4
4
  import { UntypedFormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
5
5
  import { distinctUntilChanged, debounceTime, takeUntil, switchMap, take } from 'rxjs/operators';
@@ -352,14 +352,16 @@ class Cell {
352
352
  this.title = '';
353
353
  this.id = '';
354
354
  this.columnClass = column.class;
355
- this.newValue.set(value);
355
+ untracked(() => {
356
+ this.newValue.set(value);
357
+ });
356
358
  this.styles = column.styles;
357
359
  this.title = column.title;
358
360
  this.id = column.id;
359
361
  }
360
362
  getValue() {
361
363
  const prepare = this.column.valuePrepareFunction;
362
- return !prepare ? this.value : prepare.call(null, this.value, this.row.rowData, this);
364
+ return !prepare ? this.value : prepare.call(null, this.value, this.row.rowData(), this);
363
365
  }
364
366
  getNotPrepareValue() {
365
367
  return this.value;
@@ -434,32 +436,30 @@ class Column {
434
436
  }
435
437
 
436
438
  class Row {
437
- constructor(index, rowData, columns) {
439
+ constructor(index, rowDataObj, columnsList) {
438
440
  this.index = index;
439
- this.rowData = rowData;
440
- this.columns = columns;
441
+ this.rowDataObj = rowDataObj;
442
+ this.columnsList = columnsList;
441
443
  this.pending = signal(false);
442
444
  this.isSelected = signal(false);
443
445
  this.isInEditing = signal(false);
444
- this.cells = signal([]);
446
+ this.cells = computed(() => this.columns().map((column) => this.createCell(column, this.rowData())));
447
+ this.rowData = signal({});
448
+ this.columns = signal([]);
445
449
  this.visibleCells = computed(() => this.cells().filter((cell) => !cell.column.hide));
446
- this.process();
450
+ this.rowData.set(rowDataObj);
451
+ this.columns.set(columnsList);
447
452
  }
448
453
  getNewData() {
449
- const values = Object.assign({}, this.rowData);
454
+ const values = Object.assign({}, this.rowData());
450
455
  this.cells().forEach((cell) => (values[cell.column.id] = cell.newValue()));
451
456
  return values;
452
457
  }
453
458
  setData(rowData) {
454
- this.rowData = rowData;
455
- this.process();
459
+ this.rowData.set(rowData);
456
460
  }
457
- process() {
458
- const cells = this.columns.map((column) => this.createCell(column));
459
- this.cells.set(cells);
460
- }
461
- createCell(column) {
462
- const value = typeof this.rowData[column.id] === 'undefined' ? '' : this.rowData[column.id];
461
+ createCell(column, rowData) {
462
+ const value = typeof rowData[column.id] === 'undefined' ? '' : rowData[column.id];
463
463
  return new Cell(value, this, column);
464
464
  }
465
465
  }
@@ -775,22 +775,31 @@ class PagerComponent {
775
775
  this.count = computed(() => this.source().count());
776
776
  this.nextButtonText = computed(() => this.pagingConf().nextButtonText);
777
777
  this.prevButtonText = computed(() => this.pagingConf().nextButtonText);
778
- this.lastPage = computed(() => Math.ceil(this.count() / this.currentPerPage()));
779
- this.pages = computed(() => this.getPages(this.currentPage(), this.lastPage()));
778
+ this.lastPage = computed(() => Math.ceil(this.count() / this.currentPerPage()) || 1);
779
+ this.pages = computed(() => this.getPages(this.currentPage(), this.lastPage(), this.count()));
780
780
  }
781
781
  paginate(page) {
782
782
  this.source().setPage(page);
783
783
  }
784
784
  next() {
785
+ if (this.currentPage() >= this.lastPage() || !this.count()) {
786
+ return;
787
+ }
785
788
  this.paginate(this.currentPage() + 1);
786
789
  }
787
790
  prev() {
791
+ if (this.currentPage() <= 1 || !this.count()) {
792
+ return;
793
+ }
788
794
  this.paginate(this.currentPage() - 1);
789
795
  }
790
796
  isString(value) {
791
797
  return typeof value === 'string';
792
798
  }
793
- getPages(current, last) {
799
+ getPages(current, last, total) {
800
+ if (!total) {
801
+ return [1];
802
+ }
794
803
  const delta = 2, left = current - delta, right = current + delta + 1, range = [], rangeWithDots = [];
795
804
  let l;
796
805
  for (let i = 1; i <= last; i++) {
@@ -819,11 +828,11 @@ class PagerComponent {
819
828
  this.source().setPaging(1, +target.value);
820
829
  }
821
830
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: PagerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
822
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: PagerComponent, isStandalone: true, selector: "ng2-smart-table-pager", inputs: { source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"ng2-smart-table-pagination__wrap\">\n <div>\n @if (isShowTotal()) {\n Total: {{ count() }}\n }\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 (click)=\"currentPage() === 1 ? false : prev()\" aria-label=\"Prev\">\n @if (prevButtonText(); as text) {\n {{ text }}\n } @else {\n &laquo; 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 (click)=\"paginate(page)\">{{ page }}</a>\n }\n </li>\n }\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() === lastPage()\">\n <a (click)=\"currentPage() === lastPage() ? false : next()\" aria-label=\"Next\">\n @if (nextButtonText(); as text) {\n {{ text }}\n } @else {\n Next &raquo;\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 (change)=\"onChangePerPage($any($event.target))\" [ngModel]=\"currentPerPage()\" id=\"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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
831
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: PagerComponent, isStandalone: true, selector: "ng2-smart-table-pager", inputs: { source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"ng2-smart-table-pagination__wrap\">\n <div>\n @if (isShowTotal()) {\n Total: {{ count() }}\n }\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 (click)=\"prev()\" aria-label=\"Prev\">\n @if (prevButtonText(); as text) {\n {{ text }}\n } @else {\n &laquo; 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 (click)=\"paginate(page)\">{{ page }}</a>\n }\n </li>\n }\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() >= lastPage()\">\n <a (click)=\"next()\" aria-label=\"Next\">\n @if (nextButtonText(); as text) {\n {{ text }}\n } @else {\n Next &raquo;\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 (change)=\"onChangePerPage($any($event.target))\" [ngModel]=\"currentPerPage()\" id=\"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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
823
832
  }
824
833
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: PagerComponent, decorators: [{
825
834
  type: Component,
826
- args: [{ selector: 'ng2-smart-table-pager', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormsModule], template: "<div class=\"ng2-smart-table-pagination__wrap\">\n <div>\n @if (isShowTotal()) {\n Total: {{ count() }}\n }\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 (click)=\"currentPage() === 1 ? false : prev()\" aria-label=\"Prev\">\n @if (prevButtonText(); as text) {\n {{ text }}\n } @else {\n &laquo; 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 (click)=\"paginate(page)\">{{ page }}</a>\n }\n </li>\n }\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() === lastPage()\">\n <a (click)=\"currentPage() === lastPage() ? false : next()\" aria-label=\"Next\">\n @if (nextButtonText(); as text) {\n {{ text }}\n } @else {\n Next &raquo;\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 (change)=\"onChangePerPage($any($event.target))\" [ngModel]=\"currentPerPage()\" id=\"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"] }]
835
+ args: [{ selector: 'ng2-smart-table-pager', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormsModule], template: "<div class=\"ng2-smart-table-pagination__wrap\">\n <div>\n @if (isShowTotal()) {\n Total: {{ count() }}\n }\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 (click)=\"prev()\" aria-label=\"Prev\">\n @if (prevButtonText(); as text) {\n {{ text }}\n } @else {\n &laquo; 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 (click)=\"paginate(page)\">{{ page }}</a>\n }\n </li>\n }\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() >= lastPage()\">\n <a (click)=\"next()\" aria-label=\"Next\">\n @if (nextButtonText(); as text) {\n {{ text }}\n } @else {\n Next &raquo;\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 (change)=\"onChangePerPage($any($event.target))\" [ngModel]=\"currentPerPage()\" id=\"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"] }]
827
836
  }] });
828
837
 
829
838
  class CheckboxEditorComponent extends BaseEditorComponent {
@@ -1079,7 +1088,7 @@ class CustomViewComponent {
1079
1088
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.0.3", 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
1080
1089
  *ngComponentOutlet="
1081
1090
  cell().column.renderComponent;
1082
- inputs: { rowData: cell().row.rowData, value: cell().getValue() }
1091
+ inputs: { rowData: cell().row.rowData(), value: cell().getValue() }
1083
1092
  "></ng-template>`, isInline: true, dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1084
1093
  }
1085
1094
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: CustomViewComponent, decorators: [{
@@ -1089,7 +1098,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
1089
1098
  template: `<ng-template
1090
1099
  *ngComponentOutlet="
1091
1100
  cell().column.renderComponent;
1092
- inputs: { rowData: cell().row.rowData, value: cell().getValue() }
1101
+ inputs: { rowData: cell().row.rowData(), value: cell().getValue() }
1093
1102
  "></ng-template>`,
1094
1103
  imports: [NgComponentOutlet],
1095
1104
  changeDetection: ChangeDetectionStrategy.OnPush,
@@ -1207,7 +1216,7 @@ class RowActionsComponent {
1207
1216
  if (!actions || !actions.custom) {
1208
1217
  return [];
1209
1218
  }
1210
- const list = actions.custom.filter((action) => !action.hasPermissionFunction ? true : action.hasPermissionFunction(this.row().rowData));
1219
+ const list = actions.custom.filter((action) => !action.hasPermissionFunction ? true : action.hasPermissionFunction(this.row().rowData()));
1211
1220
  return list;
1212
1221
  });
1213
1222
  this.isActionEditActive = computed(() => {
@@ -1219,7 +1228,7 @@ class RowActionsComponent {
1219
1228
  if (!editConfig || !editConfig.hasPermissionFunction) {
1220
1229
  return true;
1221
1230
  }
1222
- return editConfig.hasPermissionFunction(this.row().rowData);
1231
+ return editConfig.hasPermissionFunction(this.row().rowData());
1223
1232
  });
1224
1233
  this.isActionDeleteActive = computed(() => {
1225
1234
  const actions = this.grid().settings().actions;
@@ -1230,7 +1239,7 @@ class RowActionsComponent {
1230
1239
  if (!deleteConfig || !deleteConfig.hasPermissionFunction) {
1231
1240
  return true;
1232
1241
  }
1233
- return deleteConfig.hasPermissionFunction(this.row().rowData);
1242
+ return deleteConfig.hasPermissionFunction(this.row().rowData());
1234
1243
  });
1235
1244
  this.isExternalMode = computed(() => {
1236
1245
  return this.grid().settings().mode === 'external';
@@ -1347,7 +1356,7 @@ class Ng2SmartTableTbodyComponent {
1347
1356
  customActionEmitted(actionName, row) {
1348
1357
  this.customActionEmitter.emit({
1349
1358
  source: this.source(),
1350
- data: row.rowData,
1359
+ data: row.rowData(),
1351
1360
  action: actionName,
1352
1361
  });
1353
1362
  }
@@ -1355,11 +1364,11 @@ class Ng2SmartTableTbodyComponent {
1355
1364
  return item?.id || index;
1356
1365
  }
1357
1366
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: Ng2SmartTableTbodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1358
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", 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)\"\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 }); }
1367
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", 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)\"\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 }); }
1359
1368
  }
1360
1369
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: Ng2SmartTableTbodyComponent, decorators: [{
1361
1370
  type: Component,
1362
- 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)\"\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" }]
1371
+ 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)\"\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" }]
1363
1372
  }] });
1364
1373
 
1365
1374
  class AddButtonComponent {
@@ -2088,7 +2097,7 @@ class DataSet {
2088
2097
  this.createRows();
2089
2098
  }
2090
2099
  findRowByData(data) {
2091
- return this.rows().find((row) => isObjectsIdentical(row.rowData, data));
2100
+ return this.rows().find((row) => isObjectsIdentical(row.rowData(), data));
2092
2101
  }
2093
2102
  setSelectAll(state) {
2094
2103
  this.rows().forEach((row) => {
@@ -2145,15 +2154,17 @@ class DataSet {
2145
2154
  }
2146
2155
  storeSelectedRow(row) {
2147
2156
  if (row.isSelected()) {
2148
- if (this.isSelectedHasRow(row.rowData)) {
2157
+ if (this.isSelectedHasRow(row.rowData())) {
2149
2158
  //check if row already in selected array to prevent duplicate
2150
2159
  return;
2151
2160
  }
2152
- this.selectedRowsData.push(row.rowData);
2161
+ this.selectedRowsData.push(row.rowData());
2153
2162
  }
2154
2163
  else {
2155
2164
  const index = this.selectedRowsData.findIndex((rowData) => isObjectsIdentical(rowData, row));
2156
- this.selectedRowsData.splice(index, 1);
2165
+ if (index !== -1) {
2166
+ this.selectedRowsData.splice(index, 1);
2167
+ }
2157
2168
  }
2158
2169
  }
2159
2170
  }
@@ -2247,7 +2258,7 @@ class Grid {
2247
2258
  .then((newData) => {
2248
2259
  row.pending.set(false);
2249
2260
  newData = newData || row.getNewData();
2250
- this.source.update(row.rowData, newData).then(() => {
2261
+ this.source.update(row.rowData(), newData).then(() => {
2251
2262
  row.isInEditing.set(false);
2252
2263
  });
2253
2264
  })
@@ -2257,7 +2268,7 @@ class Grid {
2257
2268
  });
2258
2269
  if (this.getSetting('edit.confirmSave', false)) {
2259
2270
  confirmEmitter.emit({
2260
- data: row.rowData,
2271
+ data: row.rowData(),
2261
2272
  newData: row.getNewData(),
2262
2273
  source: this.source,
2263
2274
  confirm: deferred,
@@ -2274,7 +2285,7 @@ class Grid {
2274
2285
  deferred.promise
2275
2286
  .then(() => {
2276
2287
  row.pending.set(false);
2277
- this.source.remove(row.rowData);
2288
+ this.source.remove(row.rowData());
2278
2289
  })
2279
2290
  .catch(() => {
2280
2291
  row.pending.set(false);
@@ -2282,7 +2293,7 @@ class Grid {
2282
2293
  });
2283
2294
  if (this.getSetting('delete.confirmDelete', true)) {
2284
2295
  confirmEmitter.emit({
2285
- data: row.rowData,
2296
+ data: row.rowData(),
2286
2297
  source: this.source,
2287
2298
  confirm: deferred,
2288
2299
  });
@@ -2509,7 +2520,7 @@ class Ng2SmartTableComponent {
2509
2520
  }
2510
2521
  emitUserRowClicked(row) {
2511
2522
  this.rowClicked.emit({
2512
- data: row ? row.rowData : null,
2523
+ data: row ? row.rowData() : null,
2513
2524
  source: this.source(),
2514
2525
  });
2515
2526
  }
@@ -2519,7 +2530,7 @@ class Ng2SmartTableComponent {
2519
2530
  editEmitted(row) {
2520
2531
  if (this.isExternalMode()) {
2521
2532
  this.edit.emit({
2522
- data: row.rowData,
2533
+ data: row.rowData(),
2523
2534
  source: this.source(),
2524
2535
  });
2525
2536
  return;
@@ -2530,7 +2541,7 @@ class Ng2SmartTableComponent {
2530
2541
  this.grid.save(row, this.editConfirm);
2531
2542
  }
2532
2543
  editCanceled(row) {
2533
- this.editCancel.emit({ data: row.rowData, source: this.source() });
2544
+ this.editCancel.emit({ data: row.rowData(), source: this.source() });
2534
2545
  }
2535
2546
  createEmitted() {
2536
2547
  if (this.isExternalMode()) {
@@ -2546,7 +2557,7 @@ class Ng2SmartTableComponent {
2546
2557
  deleEmitted(row) {
2547
2558
  if (this.isExternalMode()) {
2548
2559
  this.deleteEmitter.emit({
2549
- data: row.rowData,
2560
+ data: row.rowData(),
2550
2561
  source: this.source(),
2551
2562
  });
2552
2563
  }
@@ -2560,7 +2571,7 @@ class Ng2SmartTableComponent {
2560
2571
  }
2561
2572
  emitUserSelectRow(row) {
2562
2573
  this.multiRowSelect.emit({
2563
- data: row ? row.rowData : null,
2574
+ data: row ? row.rowData() : null,
2564
2575
  isSelected: row ? row.isSelected() : false,
2565
2576
  source: this.source(),
2566
2577
  selected: this.grid.dataSet.getSelectedRowsData(),