@revolist/revogrid 4.14.0 → 4.14.2

package/hydrate/index.js

@@ -9850,6 +9850,7 @@ class OverlaySelection {
         this.beforeKeyDown = createEvent(this, "beforekeydown", 7);
         this.beforeKeyUp = createEvent(this, "beforekeyup", 7);
         this.beforeCellSave = createEvent(this, "beforecellsave", 7);
+        this.cellEditDone = createEvent(this, "celledit", 7);
         this.keyboardService = null;
         this.autoFillService = null;
         this.unsubscribeSelectionStore = [];
@@ -10031,7 +10032,22 @@ class OverlaySelection {
         }
         const cell = getCell(renderEvent.detail.range, renderEvent.detail.rowDimension, renderEvent.detail.colDimension);
         const styles = styleByCellProps(cell);
-        return (hAsync("revogr-edit", { style: styles, ref: el => (this.revogrEdit = el), additionalData: this.additionalData, editCell: editable, saveOnClose: this.applyChangesOnClose, column: this.columnService.rowDataModel(editCell.y, editCell.x), editor: getCellEditor(this.columnService.columns[editCell.x], this.editors) }));
+        return (hAsync("revogr-edit", { style: styles, ref: el => (this.revogrEdit = el), additionalData: this.additionalData, editCell: editable, saveOnClose: this.applyChangesOnClose, onCelleditinit: (e) => {
+                this.cellEditDone.emit(e.detail);
+            }, column: this.columnService.rowDataModel(editCell.y, editCell.x), editor: getCellEditor(this.columnService.columns[editCell.x], this.editors) }));
+    }
+    onEditCell(e) {
+        if (e.defaultPrevented) {
+            return;
+        }
+        const saveEv = this.beforeCellSave.emit(e.detail);
+        if (!saveEv.defaultPrevented) {
+            this.cellEdit(saveEv.detail);
+        }
+        // if not clear navigate to next cell after edit
+        if (!saveEv.detail.preventFocus) {
+            this.focusNext();
+        }
     }
     render() {
         var _a;
@@ -10061,16 +10077,9 @@ class OverlaySelection {
                 nodes.push(hAsync("revogr-order-editor", { ref: e => (this.orderEditor = e), dataStore: this.dataStore, dimensionRow: this.dimensionRow, dimensionCol: this.dimensionCol, parent: this.element, rowType: this.types.rowType, onRowdragstartinit: e => this.rowDragStart(e) }));
             }
         }
-        return (hAsync(Host, { key: 'aaae2fb9cd6abd04c5b742277214579901062a54', class: { mobile: this.isMobileDevice }, onDblClick: (e) => this.onElementDblClick(e), onMouseDown: (e) => this.onElementMouseDown(e), onTouchStart: (e) => this.onElementMouseDown(e, true), onCloseedit: (e) => this.closeEdit(e), onCelledit: (e) => {
-                const saveEv = this.beforeCellSave.emit(e.detail);
-                if (!saveEv.defaultPrevented) {
-                    this.cellEdit(saveEv.detail);
-                }
-                // if not clear navigate to next cell after edit
-                if (!saveEv.detail.preventFocus) {
-                    this.focusNext();
-                }
-            } }, nodes, hAsync("slot", { key: '945243e45f2cfbb78d8727c10652d6d0d530d494', name: "data" })));
+        return (hAsync(Host, { key: '262adae9c825a0feb678090b62bd3ab57f149ac7', class: { mobile: this.isMobileDevice }, onDblClick: (e) => this.onElementDblClick(e), onMouseDown: (e) => this.onElementMouseDown(e), onTouchStart: (e) => this.onElementMouseDown(e, true), onCloseedit: (e) => this.closeEdit(e),
+            // it's done to be able to throw events from different levels, not just from editor
+            onCelledit: (e) => this.onEditCell(e) }, nodes, hAsync("slot", { key: '2196345c62e1edf7b00c854ba4f281ecb68ea5a7', name: "data" })));
     }
     /**
      * Executes the focus operation on the specified range of cells.
@@ -10440,7 +10449,7 @@ var RevogrEditStyle0 = revogrEditStyleCss;
 class RevoEdit {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.cellEdit = createEvent(this, "celledit", 7);
+        this.cellEdit = createEvent(this, "celleditinit", 7);
         this.closeEdit = createEvent(this, "closeedit", 7);
         this.currentEditor = null;
         this.preventSaveOnClose = false;
@@ -10589,89 +10598,11 @@ class RevoEdit {
     }; }
 }
 
-/**
- * A specialized version of `_.forEach` for arrays without support for
- * iteratee shorthands.
- *
- * @private
- * @param {Array} [array] The array to iterate over.
- * @param {Function} iteratee The function invoked per iteration.
- * @returns {Array} Returns `array`.
- */
-function arrayEach(array, iteratee) {
-  var index = -1,
-      length = array == null ? 0 : array.length;
-
-  while (++index < length) {
-    if (iteratee(array[index], index, array) === false) {
-      break;
-    }
-  }
-  return array;
-}
-
-/**
- * Casts `value` to `identity` if it's not a function.
- *
- * @private
- * @param {*} value The value to inspect.
- * @returns {Function} Returns cast function.
- */
-function castFunction(value) {
-  return typeof value == 'function' ? value : identity;
-}
-
-/**
- * Iterates over elements of `collection` and invokes `iteratee` for each element.
- * The iteratee is invoked with three arguments: (value, index|key, collection).
- * Iteratee functions may exit iteration early by explicitly returning `false`.
- *
- * **Note:** As with other "Collections" methods, objects with a "length"
- * property are iterated like arrays. To avoid this behavior use `_.forIn`
- * or `_.forOwn` for object iteration.
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @alias each
- * @category Collection
- * @param {Array|Object} collection The collection to iterate over.
- * @param {Function} [iteratee=_.identity] The function invoked per iteration.
- * @returns {Array|Object} Returns `collection`.
- * @see _.forEachRight
- * @example
- *
- * _.forEach([1, 2], function(value) {
- *   console.log(value);
- * });
- * // => Logs `1` then `2`.
- *
- * _.forEach({ 'a': 1, 'b': 2 }, function(value, key) {
- *   console.log(key);
- * });
- * // => Logs 'a' then 'b' (iteration order is not guaranteed).
- */
-function forEach(collection, iteratee) {
-  var func = isArray$1(collection) ? arrayEach : baseEach$1;
-  return func(collection, castFunction(iteratee));
-}
-
 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);
@@ -10730,7 +10661,6 @@ class ColumnDataProvider {
                 }, {}),
             });
         });
-        this.sorting = data.sort;
         this.collection = data;
         return data;
     }
@@ -10779,31 +10709,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 = {};
-    }
 }
 
 /**
@@ -11070,6 +10975,73 @@ class ViewportProvider {
     }
 }
 
+/**
+ * A specialized version of `_.forEach` for arrays without support for
+ * iteratee shorthands.
+ *
+ * @private
+ * @param {Array} [array] The array to iterate over.
+ * @param {Function} iteratee The function invoked per iteration.
+ * @returns {Array} Returns `array`.
+ */
+function arrayEach(array, iteratee) {
+  var index = -1,
+      length = array == null ? 0 : array.length;
+
+  while (++index < length) {
+    if (iteratee(array[index], index, array) === false) {
+      break;
+    }
+  }
+  return array;
+}
+
+/**
+ * Casts `value` to `identity` if it's not a function.
+ *
+ * @private
+ * @param {*} value The value to inspect.
+ * @returns {Function} Returns cast function.
+ */
+function castFunction(value) {
+  return typeof value == 'function' ? value : identity;
+}
+
+/**
+ * Iterates over elements of `collection` and invokes `iteratee` for each element.
+ * The iteratee is invoked with three arguments: (value, index|key, collection).
+ * Iteratee functions may exit iteration early by explicitly returning `false`.
+ *
+ * **Note:** As with other "Collections" methods, objects with a "length"
+ * property are iterated like arrays. To avoid this behavior use `_.forIn`
+ * or `_.forOwn` for object iteration.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @alias each
+ * @category Collection
+ * @param {Array|Object} collection The collection to iterate over.
+ * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+ * @returns {Array|Object} Returns `collection`.
+ * @see _.forEachRight
+ * @example
+ *
+ * _.forEach([1, 2], function(value) {
+ *   console.log(value);
+ * });
+ * // => Logs `1` then `2`.
+ *
+ * _.forEach({ 'a': 1, 'b': 2 }, function(value, key) {
+ *   console.log(key);
+ * });
+ * // => Logs 'a' then 'b' (iteration order is not guaranteed).
+ */
+function forEach(collection, iteratee) {
+  var func = isArray$1(collection) ? arrayEach : baseEach$1;
+  return func(collection, castFunction(iteratee));
+}
+
 /**
  * Base layer for plugins
  * Provide minimal starting core for plugins to work
@@ -12121,24 +12093,23 @@ const SortingSign = ({ column }) => {
 /**
  * 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$1((order, comparison, ignoreViewportUpdate) => this.runSorting(order, comparison, ignoreViewportUpdate), 50);
         const setConfig = (cfg) => {
             var _a;
@@ -12149,9 +12120,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);
@@ -12160,6 +12137,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) {
@@ -12193,9 +12177,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
@@ -12209,18 +12196,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,
         });
@@ -12234,28 +12221,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$1(sorting) > 1 && order === undefined) {
-                delete sorting[column.prop];
-                delete sortingFunc[column.prop];
+            if (columnProp in sorting && size$1(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
@@ -12301,6 +12294,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');
     }
 }
@@ -14559,25 +14556,29 @@ class RevoGridComponent {
     }
     /**
      * 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
@@ -14785,7 +14786,10 @@ class RevoGridComponent {
         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) {