@servicetitan/table 31.1.0 → 31.3.0

package/dist/table-state.js

@@ -1,24 +1,37 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+/* eslint-disable @typescript-eslint/member-ordering */ function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _ts_decorate(decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    else for(var i = decorators.length - 1; i >= 0; i--)if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
+}
+function _ts_metadata(k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
+}
 import { action, computed, observable, runInAction, makeObservable } from 'mobx';
 import { fromPromise } from 'mobx-utils';
 import { formStateToJS } from '@servicetitan/form';
 export function isGroupItem(item, groups) {
     const field = item.field;
-    return !!field && groups.some(g => g.field === field);
+    return !!field && groups.some((g)=>g.field === field);
 }
 function addAggregatesToGroups(groups, aggregates) {
-    return groups.map(group => ({
-        ...group,
-        aggregates,
-    }));
+    return groups.map((group)=>({
+            ...group,
+            aggregates
+        }));
 }
 export class TableState {
     get dataSource() {
@@ -28,22 +41,21 @@ export class TableState {
         if (!items) {
             return;
         }
-        for (const item of items) {
+        for (const item of items){
             if (isGroupItem(item, this.group)) {
                 const groupMaterializedPath = materializedPath + `/${item.value}`;
                 if (groupCallback) {
                     groupCallback(item, groupMaterializedPath);
                 }
                 this.traverse(item.items, itemCallback, groupCallback, groupMaterializedPath);
-            }
-            else {
+            } else {
                 itemCallback(item);
             }
         }
     }
     get originalData() {
         const result = [];
-        this.traverse(this.data, item => {
+        this.traverse(this.data, (item)=>{
             result.push(item);
         });
         return result;
@@ -61,19 +73,15 @@ export class TableState {
         return this.originalData.length - this.filteredUnselectableCount;
     }
     get totalFilteredSelectableCountPromise() {
-        return fromPromise(new Promise((resolve, reject) => {
+        return fromPromise(new Promise((resolve, reject)=>{
             if (!this.dataSource) {
                 return reject();
             }
-            this.dataSource
-                .getData({
-                filter: this.filter,
-            })
-                .then(filteredData => {
-                resolve(filteredData.data.filter(row => !this.isRowUnselectable(row))
-                    .length);
-            })
-                .catch(reject);
+            this.dataSource.getData({
+                filter: this.filter
+            }).then((filteredData)=>{
+                resolve(filteredData.data.filter((row)=>!this.isRowUnselectable(row)).length);
+            }).catch(reject);
         }));
     }
     get totalFilteredSelectableCount() {
@@ -85,446 +93,6 @@ export class TableState {
     set group(value) {
         this.innerGroup = value;
     }
-    constructor({ dataSource = null, rowIdKey, pageSize, isRowUnselectable = () => false, rowDetailsExpandState = 'collapsed', selectionLimit = Infinity, getFormState, parent, getDetailTableState, initialState, alwaysEditable = false, } = {}) {
-        Object.defineProperty(this, "innerDataSource", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "parent", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "getDetailTableState", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "selectedIds", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Set()
-        });
-        Object.defineProperty(this, "inEdit", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Map()
-        });
-        Object.defineProperty(this, "expandedIds", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Set()
-        });
-        Object.defineProperty(this, "collapsedIds", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Set()
-        });
-        Object.defineProperty(this, "collapsedGroups", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new Set()
-        });
-        Object.defineProperty(this, "isRowUnselectable", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        }); // TODO: think about a better name
-        Object.defineProperty(this, "selectionLimit", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "data", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: []
-        });
-        Object.defineProperty(this, "totalCount", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: 0
-        });
-        Object.defineProperty(this, "filteredCount", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: 0
-        });
-        Object.defineProperty(this, "selectedCount", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: 0
-        });
-        Object.defineProperty(this, "unselectableCount", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: 0
-        });
-        Object.defineProperty(this, "sort", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: []
-        });
-        Object.defineProperty(this, "filter", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "aggregates", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: []
-        });
-        Object.defineProperty(this, "innerGroup", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: []
-        });
-        Object.defineProperty(this, "skip", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: 0
-        });
-        Object.defineProperty(this, "pageSize", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "tablePdfExport", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: null
-        });
-        Object.defineProperty(this, "tableExcelExport", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: null
-        });
-        Object.defineProperty(this, "rowDetailsExpandState", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "rowIdKey", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "alwaysEditable", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "fetchInitialData", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: async () => {
-                if (!this.dataSource) {
-                    return;
-                }
-                const initial = (await this.dataSource.getData({
-                    skip: this.skip,
-                    take: this.pageSize,
-                    filter: this.filter,
-                    sort: [...this.sort],
-                    group: [...this.group],
-                }));
-                runInAction(() => {
-                    this.totalCount = initial.total;
-                    this.filteredCount = initial.total;
-                    this.updateExpandState(initial.data);
-                    this.data = initial.data;
-                    this.unselectableCount = this.originalData.filter(this.isRowUnselectable).length;
-                    this.addPropertiesToRows(this.data);
-                });
-            }
-        });
-        Object.defineProperty(this, "handleFilterChange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (ev) => {
-                this.fetchData({
-                    newFilter: ev.filter,
-                });
-            }
-        });
-        Object.defineProperty(this, "handleGroupChange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (ev) => {
-                this.collapsedGroups = new Set();
-                this.fetchData({
-                    newGroup: ev.group,
-                });
-            }
-        });
-        Object.defineProperty(this, "handleExpandChange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: ({ dataItem, value }) => {
-                if (isGroupItem(dataItem, this.group)) {
-                    const { materializedPath } = dataItem;
-                    if (value) {
-                        this.collapsedGroups.delete(materializedPath);
-                    }
-                    else {
-                        this.collapsedGroups.add(materializedPath);
-                    }
-                }
-                else {
-                    if (!this.dataSource) {
-                        return;
-                    }
-                    if (!this.dataSource.idSelector) {
-                        throw 'missing idSelector in the data source';
-                    }
-                    const id = this.dataSource.idSelector(dataItem);
-                    if (value) {
-                        this.expandedIds.add(id);
-                        this.collapsedIds.delete(id);
-                    }
-                    else {
-                        this.expandedIds.delete(id);
-                        this.collapsedIds.add(id);
-                    }
-                }
-                this.data = this.data.slice();
-            }
-        });
-        Object.defineProperty(this, "handleSortChange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (ev) => {
-                this.fetchData({
-                    newSort: ev.sort,
-                });
-            }
-        });
-        Object.defineProperty(this, "handlePageChange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (ev) => {
-                if (this.pageSize !== ev.page.take) {
-                    this.pageSize = ev.page.take;
-                    this.skip = 0;
-                }
-                else if (this.skip === ev.page.skip) {
-                    return;
-                }
-                this.fetchData({
-                    newSkip: ev.page.skip,
-                });
-            }
-        });
-        /** Call without params if unchanged */
-        Object.defineProperty(this, "fetchData", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: async ({ newSkip, newSort, newFilter, newAggregates, newGroup, } = {}) => {
-                const sort = newSort !== null && newSort !== void 0 ? newSort : [...this.sort];
-                const filter = newFilter === null ? undefined : (newFilter !== null && newFilter !== void 0 ? newFilter : this.filter);
-                const aggregates = newAggregates !== null && newAggregates !== void 0 ? newAggregates : this.aggregates;
-                const group = addAggregatesToGroups(newGroup !== null && newGroup !== void 0 ? newGroup : this.group, aggregates);
-                const skip = newSort || newFilter !== undefined || newGroup
-                    ? 0
-                    : newSkip !== undefined
-                        ? newSkip
-                        : this.skip;
-                if (!this.dataSource) {
-                    runInAction(() => {
-                        this.sort = sort;
-                        this.filter = filter;
-                        this.aggregates = aggregates;
-                        this.innerGroup = group;
-                    });
-                    return;
-                }
-                const newData = (await this.dataSource.getData({
-                    skip,
-                    sort,
-                    filter,
-                    group: [...group],
-                    take: this.pageSize,
-                }));
-                runInAction(() => {
-                    if (!this.dataSource) {
-                        return;
-                    }
-                    if (newFilter !== undefined) {
-                        // When a new filter is applied, deselect items that don't match the filter
-                        if (this.dataSource.getFilteredPersistentItems) {
-                            // For persistent items, deselect everything in the persistent array that's been filtered out
-                            if (newFilter !== null && this.dataSource.idSelector) {
-                                let delta = 0;
-                                const filteredData = this.dataSource.getFilteredPersistentItems(newFilter);
-                                filteredData.forEach(dataItem => {
-                                    const id = this.dataSource.idSelector(dataItem);
-                                    if (this.selectedIds.delete(id)) {
-                                        delta += 1;
-                                    }
-                                    if (!this.alwaysEditable) {
-                                        this.inEdit.delete(id);
-                                    }
-                                    this.expandedIds.delete(id);
-                                });
-                                this.selectedCount -= delta;
-                            }
-                        }
-                        else {
-                            // For non-peristent items, everything is deselected by default
-                            this.selectedCount = 0;
-                        }
-                    }
-                    this.updateExpandState(newData.data);
-                    this.data = newData.data;
-                    this.filteredCount = newData.total;
-                    this.sort = sort;
-                    this.filter = filter;
-                    this.aggregates = aggregates;
-                    this.innerGroup = group;
-                    this.skip = skip;
-                    this.addPropertiesToRows(this.data);
-                });
-            }
-        });
-        Object.defineProperty(this, "isRowSelectable", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (row) => !this.isRowUnselectable(row) &&
-                (this.selectionLimit === Infinity ||
-                    row.selected ||
-                    this.selectedCount < this.selectionLimit)
-        });
-        Object.defineProperty(this, "setTablePdfExportRef", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (el) => (this.tablePdfExport = el)
-        });
-        Object.defineProperty(this, "setTableExcelExportRef", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (el) => (this.tableExcelExport = el)
-        });
-        Object.defineProperty(this, "exportPdf", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: async () => {
-                if (this.dataSource && this.tablePdfExport) {
-                    const { data } = await this.dataSource.getData({}); // fetch all data
-                    this.tablePdfExport.save(data);
-                }
-            }
-        });
-        Object.defineProperty(this, "exportExcel", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: async (data, columns) => {
-                if (this.tableExcelExport) {
-                    this.tableExcelExport.save(data !== null && data !== void 0 ? data : (await this.filteredSortedUnpaginatedData()).data, columns);
-                }
-            }
-        });
-        Object.defineProperty(this, "filteredSortedUnpaginatedData", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: () => {
-                if (!this.dataSource) {
-                    throw 'missing dataSource';
-                }
-                return this.dataSource.getData({
-                    filter: this.filter,
-                    sort: [...this.sort],
-                    group: [...this.group],
-                });
-            }
-        });
-        Object.defineProperty(this, "getRowsBetween", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (start, end) => {
-                var _a;
-                const idSelector = (_a = this.dataSource) === null || _a === void 0 ? void 0 : _a.idSelector;
-                if (!idSelector) {
-                    return [];
-                }
-                let from, to;
-                const startId = idSelector(start);
-                const endId = idSelector(end);
-                for (const [index, row] of this.originalData.entries()) {
-                    const id = idSelector(row);
-                    if (startId === id) {
-                        from = index;
-                    }
-                    if (endId === id) {
-                        to = index;
-                    }
-                }
-                if (from === undefined || to === undefined) {
-                    return [];
-                }
-                return this.originalData.slice(Math.min(from, to), Math.max(from, to) + 1);
-            }
-        });
-        makeObservable(this);
-        this.innerDataSource = dataSource;
-        this.pageSize = pageSize;
-        this.isRowUnselectable = isRowUnselectable;
-        this.rowDetailsExpandState = rowDetailsExpandState;
-        this.selectionLimit = selectionLimit;
-        this.rowIdKey = rowIdKey;
-        this.getFormState = getFormState;
-        this.parent = parent;
-        this.getDetailTableState = getDetailTableState;
-        if (initialState) {
-            this.importState(initialState);
-        }
-        this.alwaysEditable = alwaysEditable;
-        this.fetchInitialData();
-        if (this.alwaysEditable) {
-            this.editAll();
-        }
-    }
     async addToDataSource(row, select, index) {
         if (!this.dataSource) {
             return;
@@ -533,7 +101,7 @@ export class TableState {
             throw 'missing addData in the data source';
         }
         await this.dataSource.addData(row, index);
-        runInAction(() => {
+        runInAction(()=>{
             this.totalCount += 1;
             if (select) {
                 if (!this.dataSource.idSelector) {
@@ -555,11 +123,11 @@ export class TableState {
         if (!this.dataSource.removeData) {
             throw 'missing removeData in the data source';
         }
-        const row = (await this.dataSource.removeData(id));
+        const row = await this.dataSource.removeData(id);
         if (!row) {
             return;
         }
-        runInAction(() => {
+        runInAction(()=>{
             this.totalCount -= 1;
             // Updating filteredCount here to force Table rerender after this action
             this.filteredCount -= 1;
@@ -576,9 +144,10 @@ export class TableState {
         });
         // If the current page has only one row and it's removed, fetch the previous page if it exists
         if (this.data.length === 1 && this.pageSize && this.skip >= this.pageSize) {
-            await this.fetchData({ newSkip: this.skip - this.pageSize });
-        }
-        else {
+            await this.fetchData({
+                newSkip: this.skip - this.pageSize
+            });
+        } else {
             await this.fetchData();
         }
         return row;
@@ -590,15 +159,14 @@ export class TableState {
         if (!this.dataSource.idSelector) {
             throw 'missing idSelector in the data source';
         }
-        for (const row of rows) {
+        for (const row of rows){
             if (ignoreUnselectable && this.isRowUnselectable(row)) {
                 continue;
             }
-            runInAction(() => {
+            runInAction(()=>{
                 if (!value) {
                     this.selectedIds.delete(this.dataSource.idSelector(row));
-                }
-                else if (this.selectedCount < this.selectionLimit) {
+                } else if (this.selectedCount < this.selectionLimit) {
                     this.selectedIds.add(this.dataSource.idSelector(row));
                 }
             });
@@ -614,17 +182,20 @@ export class TableState {
         // update parent selection
         if (this.parent) {
             if (this.isAllPageRowsSelected) {
-                await this.parent.tableState.setRowsSelection([this.parent.row], true, {
-                    recursive: false,
+                await this.parent.tableState.setRowsSelection([
+                    this.parent.row
+                ], true, {
+                    recursive: false
                 });
-            }
-            else {
-                await this.parent.tableState.setRowsSelection([this.parent.row], false, {
-                    recursive: false,
+            } else {
+                await this.parent.tableState.setRowsSelection([
+                    this.parent.row
+                ], false, {
+                    recursive: false
                 });
             }
         }
-        runInAction(() => {
+        runInAction(()=>{
             this.selectedCount = this.selectedIds.size;
             this.data = this.data.slice();
         });
@@ -640,7 +211,7 @@ export class TableState {
             return;
         }
         const filteredData = await this.dataSource.getData({
-            filter: this.filter,
+            filter: this.filter
         });
         await this.setRowsSelection(filteredData.data, value, options);
     }
@@ -665,7 +236,7 @@ export class TableState {
         }
         this.inEdit.set(this.dataSource.idSelector(row), {
             form: this.getFormState(row),
-            field,
+            field
         });
         this.data = this.data.slice();
     }
@@ -691,7 +262,7 @@ export class TableState {
         }
         await this.dataSource.updateData(id, changed);
         if (!this.alwaysEditable) {
-            runInAction(() => {
+            runInAction(()=>{
                 this.inEdit.delete(id);
             });
         }
@@ -721,13 +292,15 @@ export class TableState {
             throw 'missing getFormState';
         }
         const rows = (await this.dataSource.getData({
-            filter: this.filter,
+            filter: this.filter
         })).data;
-        runInAction(() => {
-            this.inEdit = new Map(rows.map(row => [
-                this.dataSource.idSelector(row),
-                { form: this.getFormState(row) },
-            ]));
+        runInAction(()=>{
+            this.inEdit = new Map(rows.map((row)=>[
+                    this.dataSource.idSelector(row),
+                    {
+                        form: this.getFormState(row)
+                    }
+                ]));
             this.data = this.data.slice();
         });
     }
@@ -738,19 +311,19 @@ export class TableState {
         if (!this.dataSource.updateData) {
             throw 'missing updateData in the data source';
         }
-        const changes = Array.from(this.inEdit).map(([id, { form }]) => ({
-            id,
-            changed: formStateToJS(form), // FIXME: incompatible types
-        }));
+        const changes = Array.from(this.inEdit).map(([id, { form }])=>({
+                id,
+                changed: formStateToJS(form)
+            }));
         if (beforeSave) {
-            await beforeSave(changes.map(change => change.changed));
+            await beforeSave(changes.map((change)=>change.changed));
         }
-        for (const { id, changed } of changes) {
+        for (const { id, changed } of changes){
             // eslint-disable-next-line no-await-in-loop
             await this.dataSource.updateData(id, changed);
         }
         if (!this.alwaysEditable) {
-            runInAction(() => {
+            runInAction(()=>{
                 this.inEdit = new Map();
             });
         }
@@ -784,9 +357,7 @@ export class TableState {
     async setDataSource(dataSource, setDataSourceParams) {
         this.innerDataSource = dataSource;
         this.skip = 0;
-        const reset = typeof setDataSourceParams === 'boolean'
-            ? setDataSourceParams
-            : setDataSourceParams === null || setDataSourceParams === void 0 ? void 0 : setDataSourceParams.reset;
+        const reset = typeof setDataSourceParams === 'boolean' ? setDataSourceParams : setDataSourceParams === null || setDataSourceParams === void 0 ? void 0 : setDataSourceParams.reset;
         const config = setDataSourceParams;
         if (reset) {
             this.reset();
@@ -800,7 +371,7 @@ export class TableState {
         }
     }
     addPropertiesToRows(data) {
-        this.traverse(data, item => {
+        this.traverse(data, (item)=>{
             if (!this.dataSource) {
                 return;
             }
@@ -809,40 +380,40 @@ export class TableState {
             }
             if (!('selected' in item)) {
                 Object.defineProperty(item, 'selected', {
-                    get: () => this.selectedIds.has(this.dataSource.idSelector(item)),
+                    get: ()=>this.selectedIds.has(this.dataSource.idSelector(item))
                 });
             }
             if (!('indeterminate' in item)) {
                 Object.defineProperty(item, 'indeterminate', {
-                    get: () => {
-                        var _a;
-                        const detail = (_a = this.getDetailTableState) === null || _a === void 0 ? void 0 : _a.call(this, item);
+                    get: ()=>{
+                        var _this_getDetailTableState, _this;
+                        const detail = (_this_getDetailTableState = (_this = this).getDetailTableState) === null || _this_getDetailTableState === void 0 ? void 0 : _this_getDetailTableState.call(_this, item);
                         if (!detail) {
                             return false;
                         }
                         return detail.isSomePageRowsSelected;
-                    },
+                    }
                 });
             }
             if (!('inEdit' in item)) {
                 Object.defineProperty(item, 'inEdit', {
-                    get: () => this.inEdit.has(this.dataSource.idSelector(item)),
+                    get: ()=>this.inEdit.has(this.dataSource.idSelector(item))
                 });
             }
             if (!('expanded' in item)) {
                 Object.defineProperty(item, 'expanded', {
-                    get: () => this.expandedIds.has(this.dataSource.idSelector(item)),
+                    get: ()=>this.expandedIds.has(this.dataSource.idSelector(item))
                 });
             }
-        }, (group, materializedPath) => {
+        }, (group, materializedPath)=>{
             if (!('materializedPath' in group)) {
                 Object.defineProperty(group, 'materializedPath', {
-                    get: () => materializedPath,
+                    get: ()=>materializedPath
                 });
             }
             if (!('expanded' in group)) {
                 Object.defineProperty(group, 'expanded', {
-                    get: () => !this.collapsedGroups.has(group.materializedPath),
+                    get: ()=>!this.collapsedGroups.has(group.materializedPath)
                 });
             }
         });
@@ -854,14 +425,15 @@ export class TableState {
         if (!this.dataSource.idSelector) {
             throw 'missing idSelector in the data source';
         }
-        await this.setRowsSelection([row], !this.selectedIds.has(this.dataSource.idSelector(row)), options);
+        await this.setRowsSelection([
+            row
+        ], !this.selectedIds.has(this.dataSource.idSelector(row)), options);
     }
     get isAllPageRowsSelected() {
-        return (this.originalData.some(row => row.selected) &&
-            this.originalData.every(row => this.isRowUnselectable(row) || row.selected));
+        return this.originalData.some((row)=>row.selected) && this.originalData.every((row)=>this.isRowUnselectable(row) || row.selected);
     }
     get isSomePageRowsSelected() {
-        return this.originalData.some(row => row.selected) && !this.isAllPageRowsSelected;
+        return this.originalData.some((row)=>row.selected) && !this.isAllPageRowsSelected;
     }
     get isAllRowsSelected() {
         if (!this.selectedIds.size) {
@@ -884,7 +456,7 @@ export class TableState {
             sort: this.sort,
             filter: this.filter,
             aggregates: this.aggregates,
-            group: this.innerGroup,
+            group: this.innerGroup
         };
     }
     importState(data) {
@@ -899,231 +471,478 @@ export class TableState {
     }
     updateExpandState(data) {
         if (this.rowDetailsExpandState === 'expanded') {
-            this.traverse(data, item => {
-                var _a, _b;
-                const id = (_b = (_a = this.dataSource) === null || _a === void 0 ? void 0 : _a.idSelector) === null || _b === void 0 ? void 0 : _b.call(_a, item);
+            this.traverse(data, (item)=>{
+                var _this_dataSource_idSelector, _this_dataSource;
+                const id = (_this_dataSource = this.dataSource) === null || _this_dataSource === void 0 ? void 0 : (_this_dataSource_idSelector = _this_dataSource.idSelector) === null || _this_dataSource_idSelector === void 0 ? void 0 : _this_dataSource_idSelector.call(_this_dataSource, item);
                 if (id !== undefined && !this.collapsedIds.has(id)) {
                     this.expandedIds.add(id);
                 }
             });
         }
     }
+    constructor({ dataSource = null, rowIdKey, pageSize, isRowUnselectable = ()=>false, rowDetailsExpandState = 'collapsed', selectionLimit = Infinity, getFormState, parent, getDetailTableState, initialState, alwaysEditable = false } = {}){
+        _define_property(this, "innerDataSource", void 0);
+        _define_property(this, "parent", void 0);
+        _define_property(this, "getDetailTableState", void 0);
+        _define_property(this, "selectedIds", new Set());
+        _define_property(this, "inEdit", new Map());
+        _define_property(this, "expandedIds", new Set());
+        _define_property(this, "collapsedIds", new Set());
+        _define_property(this, "collapsedGroups", new Set());
+        _define_property(this, "isRowUnselectable", void 0 // TODO: think about a better name
+        );
+        _define_property(this, "selectionLimit", void 0);
+        _define_property(this, "data", []);
+        _define_property(this, "totalCount", 0);
+        _define_property(this, "filteredCount", 0);
+        _define_property(this, "selectedCount", 0);
+        _define_property(this, "unselectableCount", 0);
+        _define_property(this, "sort", []);
+        _define_property(this, "filter", void 0);
+        _define_property(this, "aggregates", []);
+        _define_property(this, "innerGroup", []);
+        _define_property(this, "skip", 0);
+        _define_property(this, "pageSize", void 0);
+        _define_property(this, "tablePdfExport", null);
+        _define_property(this, "tableExcelExport", null);
+        _define_property(this, "rowDetailsExpandState", void 0);
+        _define_property(this, "rowIdKey", void 0);
+        _define_property(this, "alwaysEditable", void 0);
+        _define_property(this, "fetchInitialData", async ()=>{
+            if (!this.dataSource) {
+                return;
+            }
+            const initial = await this.dataSource.getData({
+                skip: this.skip,
+                take: this.pageSize,
+                filter: this.filter,
+                sort: [
+                    ...this.sort
+                ],
+                group: [
+                    ...this.group
+                ]
+            });
+            runInAction(()=>{
+                this.totalCount = initial.total;
+                this.filteredCount = initial.total;
+                this.updateExpandState(initial.data);
+                this.data = initial.data;
+                this.unselectableCount = this.originalData.filter(this.isRowUnselectable).length;
+                this.addPropertiesToRows(this.data);
+            });
+        });
+        _define_property(this, "handleFilterChange", (ev)=>{
+            this.fetchData({
+                newFilter: ev.filter
+            });
+        });
+        _define_property(this, "handleGroupChange", (ev)=>{
+            this.collapsedGroups = new Set();
+            this.fetchData({
+                newGroup: ev.group
+            });
+        });
+        _define_property(this, "handleExpandChange", ({ dataItem, value })=>{
+            if (isGroupItem(dataItem, this.group)) {
+                const { materializedPath } = dataItem;
+                if (value) {
+                    this.collapsedGroups.delete(materializedPath);
+                } else {
+                    this.collapsedGroups.add(materializedPath);
+                }
+            } else {
+                if (!this.dataSource) {
+                    return;
+                }
+                if (!this.dataSource.idSelector) {
+                    throw 'missing idSelector in the data source';
+                }
+                const id = this.dataSource.idSelector(dataItem);
+                if (value) {
+                    this.expandedIds.add(id);
+                    this.collapsedIds.delete(id);
+                } else {
+                    this.expandedIds.delete(id);
+                    this.collapsedIds.add(id);
+                }
+            }
+            this.data = this.data.slice();
+        });
+        _define_property(this, "handleSortChange", (ev)=>{
+            this.fetchData({
+                newSort: ev.sort
+            });
+        });
+        _define_property(this, "handlePageChange", (ev)=>{
+            if (this.pageSize !== ev.page.take) {
+                this.pageSize = ev.page.take;
+                this.skip = 0;
+            } else if (this.skip === ev.page.skip) {
+                return;
+            }
+            this.fetchData({
+                newSkip: ev.page.skip
+            });
+        });
+        /** Call without params if unchanged */ _define_property(this, "fetchData", async ({ newSkip, newSort, newFilter, newAggregates, newGroup } = {})=>{
+            const sort = newSort !== null && newSort !== void 0 ? newSort : [
+                ...this.sort
+            ];
+            const filter = newFilter === null ? undefined : newFilter !== null && newFilter !== void 0 ? newFilter : this.filter;
+            const aggregates = newAggregates !== null && newAggregates !== void 0 ? newAggregates : this.aggregates;
+            const group = addAggregatesToGroups(newGroup !== null && newGroup !== void 0 ? newGroup : this.group, aggregates);
+            const skip = newSort || newFilter !== undefined || newGroup ? 0 : newSkip !== undefined ? newSkip : this.skip;
+            if (!this.dataSource) {
+                runInAction(()=>{
+                    this.sort = sort;
+                    this.filter = filter;
+                    this.aggregates = aggregates;
+                    this.innerGroup = group;
+                });
+                return;
+            }
+            const newData = await this.dataSource.getData({
+                skip,
+                sort,
+                filter,
+                group: [
+                    ...group
+                ],
+                take: this.pageSize
+            });
+            runInAction(()=>{
+                if (!this.dataSource) {
+                    return;
+                }
+                if (newFilter !== undefined) {
+                    // When a new filter is applied, deselect items that don't match the filter
+                    if (this.dataSource.getFilteredPersistentItems) {
+                        // For persistent items, deselect everything in the persistent array that's been filtered out
+                        if (newFilter !== null && this.dataSource.idSelector) {
+                            let delta = 0;
+                            const filteredData = this.dataSource.getFilteredPersistentItems(newFilter);
+                            filteredData.forEach((dataItem)=>{
+                                const id = this.dataSource.idSelector(dataItem);
+                                if (this.selectedIds.delete(id)) {
+                                    delta += 1;
+                                }
+                                if (!this.alwaysEditable) {
+                                    this.inEdit.delete(id);
+                                }
+                                this.expandedIds.delete(id);
+                            });
+                            this.selectedCount -= delta;
+                        }
+                    } else {
+                        // For non-peristent items, everything is deselected by default
+                        this.selectedCount = 0;
+                    }
+                }
+                this.updateExpandState(newData.data);
+                this.data = newData.data;
+                this.filteredCount = newData.total;
+                this.sort = sort;
+                this.filter = filter;
+                this.aggregates = aggregates;
+                this.innerGroup = group;
+                this.skip = skip;
+                this.addPropertiesToRows(this.data);
+            });
+        });
+        _define_property(this, "isRowSelectable", (row)=>!this.isRowUnselectable(row) && (this.selectionLimit === Infinity || row.selected || this.selectedCount < this.selectionLimit));
+        _define_property(this, "setTablePdfExportRef", (el)=>this.tablePdfExport = el);
+        _define_property(this, "setTableExcelExportRef", (el)=>this.tableExcelExport = el);
+        _define_property(this, "exportPdf", async ()=>{
+            if (this.dataSource && this.tablePdfExport) {
+                const { data } = await this.dataSource.getData({}); // fetch all data
+                this.tablePdfExport.save(data);
+            }
+        });
+        _define_property(this, "exportExcel", async (data, columns)=>{
+            if (this.tableExcelExport) {
+                this.tableExcelExport.save(data !== null && data !== void 0 ? data : (await this.filteredSortedUnpaginatedData()).data, columns);
+            }
+        });
+        _define_property(this, "filteredSortedUnpaginatedData", ()=>{
+            if (!this.dataSource) {
+                throw 'missing dataSource';
+            }
+            return this.dataSource.getData({
+                filter: this.filter,
+                sort: [
+                    ...this.sort
+                ],
+                group: [
+                    ...this.group
+                ]
+            });
+        });
+        _define_property(this, "getRowsBetween", (start, end)=>{
+            var _this_dataSource;
+            const idSelector = (_this_dataSource = this.dataSource) === null || _this_dataSource === void 0 ? void 0 : _this_dataSource.idSelector;
+            if (!idSelector) {
+                return [];
+            }
+            let from, to;
+            const startId = idSelector(start);
+            const endId = idSelector(end);
+            for (const [index, row] of this.originalData.entries()){
+                const id = idSelector(row);
+                if (startId === id) {
+                    from = index;
+                }
+                if (endId === id) {
+                    to = index;
+                }
+            }
+            if (from === undefined || to === undefined) {
+                return [];
+            }
+            return this.originalData.slice(Math.min(from, to), Math.max(from, to) + 1);
+        });
+        makeObservable(this);
+        this.innerDataSource = dataSource;
+        this.pageSize = pageSize;
+        this.isRowUnselectable = isRowUnselectable;
+        this.rowDetailsExpandState = rowDetailsExpandState;
+        this.selectionLimit = selectionLimit;
+        this.rowIdKey = rowIdKey;
+        this.getFormState = getFormState;
+        this.parent = parent;
+        this.getDetailTableState = getDetailTableState;
+        if (initialState) {
+            this.importState(initialState);
+        }
+        this.alwaysEditable = alwaysEditable;
+        this.fetchInitialData();
+        if (this.alwaysEditable) {
+            this.editAll();
+        }
+    }
 }
-__decorate([
+_ts_decorate([
     observable,
-    __metadata("design:type", Object)
+    _ts_metadata("design:type", Object)
 ], TableState.prototype, "innerDataSource", void 0);
-__decorate([
+_ts_decorate([
     computed,
-    __metadata("design:type", Object),
-    __metadata("design:paramtypes", [])
+    _ts_metadata("design:type", void 0),
+    _ts_metadata("design:paramtypes", [])
 ], TableState.prototype, "dataSource", null);
-__decorate([
+_ts_decorate([
     computed,
-    __metadata("design:type", Object),
-    __metadata("design:paramtypes", [])
+    _ts_metadata("design:type", void 0),
+    _ts_metadata("design:paramtypes", [])
 ], TableState.prototype, "originalData", null);
-__decorate([
-    observable,
-    __metadata("design:type", Object)
+_ts_decorate([
+    observable
 ], TableState.prototype, "selectedIds", void 0);
-__decorate([
-    observable,
-    __metadata("design:type", Object)
+_ts_decorate([
+    observable
 ], TableState.prototype, "inEdit", void 0);
-__decorate([
-    observable,
-    __metadata("design:type", Object)
+_ts_decorate([
+    observable
 ], TableState.prototype, "expandedIds", void 0);
-__decorate([
-    observable,
-    __metadata("design:type", Object)
+_ts_decorate([
+    observable
 ], TableState.prototype, "collapsedIds", void 0);
-__decorate([
-    observable,
-    __metadata("design:type", Object)
+_ts_decorate([
+    observable
 ], TableState.prototype, "collapsedGroups", void 0);
-__decorate([
+_ts_decorate([
     observable,
-    __metadata("design:type", Object)
+    _ts_metadata("design:type", typeof Data === "undefined" ? Object : Data)
 ], TableState.prototype, "data", void 0);
-__decorate([
-    observable,
-    __metadata("design:type", Object)
+_ts_decorate([
+    observable
 ], TableState.prototype, "totalCount", void 0);
-__decorate([
-    observable,
-    __metadata("design:type", Object)
+_ts_decorate([
+    observable
 ], TableState.prototype, "filteredCount", void 0);
-__decorate([
-    observable,
-    __metadata("design:type", Object)
+_ts_decorate([
+    observable
 ], TableState.prototype, "selectedCount", void 0);
-__decorate([
-    observable,
-    __metadata("design:type", Object)
+_ts_decorate([
+    observable
 ], TableState.prototype, "unselectableCount", void 0);
-__decorate([
+_ts_decorate([
     computed,
-    __metadata("design:type", Object),
-    __metadata("design:paramtypes", [])
+    _ts_metadata("design:type", void 0),
+    _ts_metadata("design:paramtypes", [])
 ], TableState.prototype, "unselectedCount", null);
-__decorate([
+_ts_decorate([
     computed,
-    __metadata("design:type", Object),
-    __metadata("design:paramtypes", [])
+    _ts_metadata("design:type", void 0),
+    _ts_metadata("design:paramtypes", [])
 ], TableState.prototype, "selectableCount", null);
-__decorate([
+_ts_decorate([
     computed,
-    __metadata("design:type", Object),
-    __metadata("design:paramtypes", [])
+    _ts_metadata("design:type", void 0),
+    _ts_metadata("design:paramtypes", [])
 ], TableState.prototype, "filteredUnselectableCount", null);
-__decorate([
+_ts_decorate([
     computed,
-    __metadata("design:type", Object),
-    __metadata("design:paramtypes", [])
+    _ts_metadata("design:type", void 0),
+    _ts_metadata("design:paramtypes", [])
 ], TableState.prototype, "filteredSelectableCount", null);
-__decorate([
+_ts_decorate([
     computed,
-    __metadata("design:type", Object),
-    __metadata("design:paramtypes", [])
+    _ts_metadata("design:type", void 0),
+    _ts_metadata("design:paramtypes", [])
 ], TableState.prototype, "totalFilteredSelectableCountPromise", null);
-__decorate([
+_ts_decorate([
     computed,
-    __metadata("design:type", Number),
-    __metadata("design:paramtypes", [])
+    _ts_metadata("design:type", Number),
+    _ts_metadata("design:paramtypes", [])
 ], TableState.prototype, "totalFilteredSelectableCount", null);
-__decorate([
+_ts_decorate([
     observable,
-    __metadata("design:type", Array)
+    _ts_metadata("design:type", Array)
 ], TableState.prototype, "sort", void 0);
-__decorate([
+_ts_decorate([
     observable,
-    __metadata("design:type", Object)
+    _ts_metadata("design:type", Object)
 ], TableState.prototype, "filter", void 0);
-__decorate([
+_ts_decorate([
     observable,
-    __metadata("design:type", Array)
+    _ts_metadata("design:type", Array)
 ], TableState.prototype, "aggregates", void 0);
-__decorate([
+_ts_decorate([
     observable,
-    __metadata("design:type", Array)
+    _ts_metadata("design:type", Array)
 ], TableState.prototype, "innerGroup", void 0);
-__decorate([
+_ts_decorate([
     computed,
-    __metadata("design:type", Array),
-    __metadata("design:paramtypes", [Array])
+    _ts_metadata("design:type", Array),
+    _ts_metadata("design:paramtypes", [])
 ], TableState.prototype, "group", null);
-__decorate([
-    observable,
-    __metadata("design:type", Object)
+_ts_decorate([
+    observable
 ], TableState.prototype, "skip", void 0);
-__decorate([
+_ts_decorate([
     observable,
-    __metadata("design:type", Number)
+    _ts_metadata("design:type", Number)
 ], TableState.prototype, "pageSize", void 0);
-__decorate([
+_ts_decorate([
     action,
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Array, Boolean, Object]),
-    __metadata("design:returntype", Promise)
+    _ts_metadata("design:type", Function),
+    _ts_metadata("design:paramtypes", [
+        Array,
+        Boolean,
+        typeof SelectionOptions === "undefined" ? Object : SelectionOptions
+    ]),
+    _ts_metadata("design:returntype", Promise)
 ], TableState.prototype, "setRowsSelection", null);
-__decorate([
+_ts_decorate([
     action,
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object, Object]),
-    __metadata("design:returntype", void 0)
+    _ts_metadata("design:type", Function),
+    _ts_metadata("design:paramtypes", [
+        typeof T === "undefined" ? Object : T,
+        Object
+    ]),
+    _ts_metadata("design:returntype", void 0)
 ], TableState.prototype, "edit", null);
-__decorate([
+_ts_decorate([
     action,
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object, Function]),
-    __metadata("design:returntype", Promise)
+    _ts_metadata("design:type", Function),
+    _ts_metadata("design:paramtypes", [
+        typeof T === "undefined" ? Object : T,
+        Function
+    ]),
+    _ts_metadata("design:returntype", Promise)
 ], TableState.prototype, "saveEdit", null);
-__decorate([
+_ts_decorate([
     action,
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object]),
-    __metadata("design:returntype", void 0)
+    _ts_metadata("design:type", Function),
+    _ts_metadata("design:paramtypes", [
+        typeof T === "undefined" ? Object : T
+    ]),
+    _ts_metadata("design:returntype", void 0)
 ], TableState.prototype, "cancelEdit", null);
-__decorate([
+_ts_decorate([
     action,
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", []),
-    __metadata("design:returntype", void 0)
+    _ts_metadata("design:type", Function),
+    _ts_metadata("design:paramtypes", []),
+    _ts_metadata("design:returntype", void 0)
 ], TableState.prototype, "cancelEditAll", null);
-__decorate([
+_ts_decorate([
     action,
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", []),
-    __metadata("design:returntype", void 0)
+    _ts_metadata("design:type", Function),
+    _ts_metadata("design:paramtypes", []),
+    _ts_metadata("design:returntype", void 0)
 ], TableState.prototype, "reset", null);
-__decorate([
+_ts_decorate([
     action,
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object, Object]),
-    __metadata("design:returntype", Promise)
+    _ts_metadata("design:type", Function),
+    _ts_metadata("design:paramtypes", [
+        Object,
+        Object
+    ]),
+    _ts_metadata("design:returntype", Promise)
 ], TableState.prototype, "setDataSource", null);
-__decorate([
-    action,
-    __metadata("design:type", Object)
+_ts_decorate([
+    action
 ], TableState.prototype, "fetchInitialData", void 0);
-__decorate([
-    action,
-    __metadata("design:type", Object)
+_ts_decorate([
+    action
 ], TableState.prototype, "handleFilterChange", void 0);
-__decorate([
-    action,
-    __metadata("design:type", Object)
+_ts_decorate([
+    action
 ], TableState.prototype, "handleGroupChange", void 0);
-__decorate([
-    action,
-    __metadata("design:type", Object)
+_ts_decorate([
+    action
 ], TableState.prototype, "handleExpandChange", void 0);
-__decorate([
-    action,
-    __metadata("design:type", Object)
+_ts_decorate([
+    action
 ], TableState.prototype, "handleSortChange", void 0);
-__decorate([
-    action,
-    __metadata("design:type", Object)
+_ts_decorate([
+    action
 ], TableState.prototype, "handlePageChange", void 0);
-__decorate([
+_ts_decorate([
     action,
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object, Object]),
-    __metadata("design:returntype", Promise)
+    _ts_metadata("design:type", Function),
+    _ts_metadata("design:paramtypes", [
+        typeof T === "undefined" ? Object : T,
+        typeof SelectionOptions === "undefined" ? Object : SelectionOptions
+    ]),
+    _ts_metadata("design:returntype", Promise)
 ], TableState.prototype, "toggleRowSelection", null);
-__decorate([
+_ts_decorate([
     computed,
-    __metadata("design:type", Object),
-    __metadata("design:paramtypes", [])
+    _ts_metadata("design:type", void 0),
+    _ts_metadata("design:paramtypes", [])
 ], TableState.prototype, "isAllPageRowsSelected", null);
-__decorate([
+_ts_decorate([
     computed,
-    __metadata("design:type", Object),
-    __metadata("design:paramtypes", [])
+    _ts_metadata("design:type", void 0),
+    _ts_metadata("design:paramtypes", [])
 ], TableState.prototype, "isSomePageRowsSelected", null);
-__decorate([
+_ts_decorate([
     computed,
-    __metadata("design:type", Object),
-    __metadata("design:paramtypes", [])
+    _ts_metadata("design:type", void 0),
+    _ts_metadata("design:paramtypes", [])
 ], TableState.prototype, "isAllRowsSelected", null);
-__decorate([
+_ts_decorate([
     computed,
-    __metadata("design:type", Object),
-    __metadata("design:paramtypes", [])
+    _ts_metadata("design:type", void 0),
+    _ts_metadata("design:paramtypes", [])
 ], TableState.prototype, "isSomeRowsSelected", null);
-__decorate([
+_ts_decorate([
     action,
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object]),
-    __metadata("design:returntype", void 0)
+    _ts_metadata("design:type", Function),
+    _ts_metadata("design:paramtypes", [
+        typeof TableStateModel === "undefined" ? Object : TableStateModel
+    ]),
+    _ts_metadata("design:returntype", void 0)
 ], TableState.prototype, "importState", null);
-__decorate([
+_ts_decorate([
     action,
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object]),
-    __metadata("design:returntype", void 0)
+    _ts_metadata("design:type", Function),
+    _ts_metadata("design:paramtypes", [
+        Object
+    ]),
+    _ts_metadata("design:returntype", void 0)
 ], TableState.prototype, "updateExpandState", null);
+
 //# sourceMappingURL=table-state.js.map