@revolist/revogrid 4.14.0 → 4.14.2

package/standalone/revo-grid.js

@@ -1822,24 +1822,23 @@ function getComparer(column, order) {
 /**
  * Lifecycle
  * 1. @event `beforesorting` - Triggered when sorting just starts. Nothing has happened yet. This can be triggered from a column or from the source. If the type is from rows, the column will be undefined.
- * 1.1. @event `beforesourcesortingapply` - Triggered before the sorting data is applied to the data source. You can prevent this event, and the data will not be sorted.
- * 2. Method `updateColumnSorting` - Updates the column sorting icon on the grid and the column itself, but the data remains untouched.
+ * 2. @event `beforesourcesortingapply` - Triggered before the sorting data is applied to the data source. You can prevent this event, and the data will not be sorted.
  * 3. @event `beforesortingapply` - Triggered before the sorting data is applied to the data source. You can prevent this event, and the data will not be sorted. This event is only called from a column sorting click.
  * 4. @event `aftersortingapply` - Triggered after sorting has been applied and completed. This event occurs for both row and column sorting.
  *
  * Note: If you prevent an event, it will not proceed to the subsequent steps.
  */
 class SortingPlugin extends BasePlugin {
-    runSorting(order, comparison, ignoreViewportUpdate) {
-        var _a;
-        this.sort(order, comparison, undefined, ignoreViewportUpdate);
-        (_a = this.sortingPromise) === null || _a === void 0 ? void 0 : _a.call(this);
-        this.sortingPromise = null;
-    }
     constructor(revogrid, providers, config) {
         super(revogrid, providers);
         this.revogrid = revogrid;
+        /**
+         * Delayed sorting promise
+         */
         this.sortingPromise = null;
+        /**
+         * We need to sort only so often
+         */
         this.postponeSort = debounce((order, comparison, ignoreViewportUpdate) => this.runSorting(order, comparison, ignoreViewportUpdate), 50);
         const setConfig = (cfg) => {
             var _a;
@@ -1850,9 +1849,15 @@ class SortingPlugin extends BasePlugin {
                     sortingFunc[col.prop] = getComparer(col, col.order);
                     order[col.prop] = col.order;
                 });
-                // // set sorting
-                this.sorting = order;
-                this.sortingFunc = sortingFunc;
+                if (cfg.additive) {
+                    this.sorting = Object.assign(Object.assign({}, this.sorting), order);
+                    this.sortingFunc = Object.assign(Object.assign({}, this.sortingFunc), sortingFunc);
+                }
+                else {
+                    // // set sorting
+                    this.sorting = order;
+                    this.sortingFunc = sortingFunc;
+                }
             }
         };
         setConfig(config);
@@ -1861,6 +1866,13 @@ class SortingPlugin extends BasePlugin {
             setConfig(detail);
             this.startSorting(this.sorting, this.sortingFunc);
         });
+        this.addEventListener('beforeheaderrender', ({ detail, }) => {
+            var _a;
+            const { data: column } = detail;
+            if (column.sortable) {
+                detail.data = Object.assign(Object.assign({}, column), { order: (_a = this.sorting) === null || _a === void 0 ? void 0 : _a[column.prop] });
+            }
+        });
         this.addEventListener('beforeanysource', ({ detail: { type }, }) => {
             // if sorting was provided - sort data
             if (!!this.sorting && this.sortingFunc) {
@@ -1894,9 +1906,12 @@ class SortingPlugin extends BasePlugin {
             if (!((_b = (_a = e.detail) === null || _a === void 0 ? void 0 : _a.column) === null || _b === void 0 ? void 0 : _b.sortable)) {
                 return;
             }
-            this.headerclick(e.detail.column, e.detail.index, (_d = (_c = e.detail) === null || _c === void 0 ? void 0 : _c.originalEvent) === null || _d === void 0 ? void 0 : _d.shiftKey);
+            this.headerclick(e.detail.column, (_d = (_c = e.detail) === null || _c === void 0 ? void 0 : _c.originalEvent) === null || _d === void 0 ? void 0 : _d.shiftKey);
         });
     }
+    /**
+     * Entry point for sorting, waits for all delayes, registers jobs
+     */
     startSorting(order, sortingFunc, ignoreViewportUpdate) {
         if (!this.sortingPromise) {
             // add job before render
@@ -1910,18 +1925,18 @@ class SortingPlugin extends BasePlugin {
      * Apply sorting to data on header click
      * If additive - add to existing sorting, multiple columns can be sorted
      */
-    headerclick(column, index, additive) {
-        var _a, _b;
-        let order = getNextOrder(column.order);
+    headerclick(column, additive) {
+        var _a, _b, _c;
+        const columnProp = column.prop;
+        let order = getNextOrder((_a = this.sorting) === null || _a === void 0 ? void 0 : _a[columnProp]);
         const beforeEvent = this.emit('beforesorting', { column, order, additive });
         if (beforeEvent.defaultPrevented) {
             return;
         }
         order = beforeEvent.detail.order;
-        const newCol = this.providers.column.updateColumnSorting(beforeEvent.detail.column, index, order, additive);
         // apply sort data
         const beforeApplyEvent = this.emit('beforesortingapply', {
-            column: newCol,
+            column: beforeEvent.detail.column,
             order,
             additive,
         });
@@ -1935,28 +1950,34 @@ class SortingPlugin extends BasePlugin {
             this.sorting = Object.assign(Object.assign({}, this.sorting), sorting);
             // extend sorting function with new sorting for multiple columns sorting
             this.sortingFunc = Object.assign(Object.assign({}, this.sortingFunc), sortingFunc);
-            if (column.prop in sorting && size(sorting) > 1 && order === undefined) {
-                delete sorting[column.prop];
-                delete sortingFunc[column.prop];
+            if (columnProp in sorting && size(sorting) > 1 && order === undefined) {
+                delete sorting[columnProp];
+                delete sortingFunc[columnProp];
             }
             else {
-                sorting[column.prop] = order;
-                sortingFunc[column.prop] = cmp;
+                sorting[columnProp] = order;
+                sortingFunc[columnProp] = cmp;
             }
         }
         else {
             if (order) {
                 // reset sorting
-                this.sorting = { [column.prop]: order };
-                this.sortingFunc = { [column.prop]: cmp };
+                this.sorting = { [columnProp]: order };
+                this.sortingFunc = { [columnProp]: cmp };
             }
             else {
-                (_a = this.sorting) === null || _a === void 0 ? true : delete _a[column.prop];
-                (_b = this.sortingFunc) === null || _b === void 0 ? true : delete _b[column.prop];
+                (_b = this.sorting) === null || _b === void 0 ? true : delete _b[columnProp];
+                (_c = this.sortingFunc) === null || _c === void 0 ? true : delete _c[columnProp];
             }
         }
         this.startSorting(this.sorting, this.sortingFunc);
     }
+    runSorting(order, comparison, ignoreViewportUpdate) {
+        var _a;
+        this.sort(order, comparison, undefined, ignoreViewportUpdate);
+        (_a = this.sortingPromise) === null || _a === void 0 ? void 0 : _a.call(this);
+        this.sortingPromise = null;
+    }
     /**
      * Sort items by sorting function
      * @requires proxyItems applied to row store
@@ -2002,6 +2023,10 @@ class SortingPlugin extends BasePlugin {
                 }
             }
         }
+        // refresh columns to redraw column headers and show correct icon
+        columnTypes.forEach((type) => {
+            this.providers.column.dataSources[type].refresh();
+        });
         this.emit('aftersortingapply');
     }
 }
@@ -2583,21 +2608,10 @@ function getLeftRelative(absoluteX, gridPos, offset) {
 }
 
 class ColumnDataProvider {
-    get order() {
-        const order = {};
-        const sorting = this.sorting;
-        if (sorting) {
-            Object.keys(sorting).forEach(prop => {
-                order[prop] = sorting[prop].order;
-            });
-        }
-        return order;
-    }
     get stores() {
         return this.dataSources;
     }
     constructor() {
-        this.sorting = null;
         this.collection = null;
         this.dataSources = columnTypes.reduce((sources, k) => {
             sources[k] = new DataStore(k);
@@ -2656,7 +2670,6 @@ class ColumnDataProvider {
                 }, {}),
             });
         });
-        this.sorting = data.sort;
         this.collection = data;
         return data;
     }
@@ -2705,31 +2718,6 @@ class ColumnDataProvider {
         const type = getColumnType(column);
         setSourceByVirtualIndex(this.dataSources[type].store, { [index]: column });
     }
-    updateColumnSorting(column, index, sorting, additive) {
-        if (!additive) {
-            this.clearSorting();
-        }
-        column.order = sorting;
-        if (!this.sorting) {
-            this.sorting = {};
-        }
-        this.sorting[column.prop] = column;
-        this.updateColumn(column, index);
-        return column;
-    }
-    clearSorting() {
-        const types = reduce(this.sorting, (r, c) => {
-            const k = getColumnType(c);
-            r[k] = true;
-            return r;
-        }, {});
-        forEach(types, (_, type) => {
-            const cols = this.dataSources[type].store.get('source');
-            forEach(cols, (c) => (c.order = undefined));
-            this.dataSources[type].setData({ source: [...cols] });
-        });
-        this.sorting = {};
-    }
 }
 
 /**
@@ -3816,25 +3804,29 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
     }
     /**
      * Update column sorting
-     * @param column - full column details to update
-     * @param index - virtual column index
+     * @param column - column prop and cellCompare
      * @param order - order to apply
      * @param additive - if false will replace current order
+     *
+     * later passed to SortingPlugin
      */
-    async updateColumnSorting(column, index, order, additive) {
-        if (!this.columnProvider) {
-            throw new Error('Not connected');
-        }
-        return this.columnProvider.updateColumnSorting(column, index, order, additive);
+    async updateColumnSorting(column, order, additive) {
+        this.sortingconfigchanged.emit({
+            columns: [{
+                    prop: column.prop,
+                    order,
+                    cellCompare: column.cellCompare,
+                }],
+            additive,
+        });
     }
     /**
      * Clears column sorting
      */
     async clearSorting() {
-        if (!this.columnProvider) {
-            throw new Error('Not connected');
-        }
-        this.columnProvider.clearSorting();
+        this.sortingconfigchanged.emit({
+            columns: [],
+        });
     }
     /**
      * Receive all columns in data source
@@ -4042,7 +4034,10 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
         const columns = this.columnProvider.setColumns(beforeApplyEvent.detail);
         this.aftercolumnsset.emit({
             columns,
-            order: this.columnProvider.order,
+            order: Object.entries(beforeApplyEvent.detail.sort).reduce((acc, [prop, column]) => {
+                acc[prop] = column.order;
+                return acc;
+            }, {}),
         });
     }
     disableVirtualXChanged(newVal = false, prevVal = false) {