@revolist/revogrid 4.22.1 → 4.23.0

package/dist/cjs/{viewport.store-q6YdR9mg.js → viewport.store-BlKQ4x9H.js}

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var dimension_helpers = require('./dimension.helpers-CiiNnlLa.js');
+var dimension_helpers = require('./dimension.helpers-B9HgANnM.js');
 
 const LETTER_BLOCK_SIZE = 10;
 const calculateRowHeaderSize = (itemsLength, rowHeaderColumn, minWidth = 50) => {
@@ -11,6 +11,15 @@ const calculateRowHeaderSize = (itemsLength, rowHeaderColumn, minWidth = 50) =>
         Math.max((itemsLength.toString().length + 1) * LETTER_BLOCK_SIZE, minWidth));
 };
 
+function getViewportMaxCoordinate(dimension, viewportSize, frameOffset = 1) {
+    if (!viewportSize || dimension.realSize <= viewportSize) {
+        return 0;
+    }
+    return Math.max(0, dimension.realSize - viewportSize - dimension.originItemSize * frameOffset);
+}
+function clampViewportCoordinate(coordinate, dimension, viewportSize, frameOffset = 1) {
+    return Math.min(Math.max(0, coordinate), getViewportMaxCoordinate(dimension, viewportSize, frameOffset));
+}
 /**
  * Update items based on new scroll position
  * If viewport wasn't changed fully simple recombination of positions
@@ -276,6 +285,8 @@ function initialState() {
         realCount: 0,
         // size of viewport in px
         clientSize: 0,
+        // logical-to-physical render offset used when scroll space is compressed
+        renderOffset: 0,
     };
 }
 /**
@@ -311,21 +322,8 @@ class ViewportStore {
         const outsize = singleOffsetInPx * 2;
         // math virtual size is based on visible area + 2 items outside of visible area
         const virtualSize = viewportSize + outsize;
-        // expected no scroll if real size less than virtual size, position is 0
-        let maxCoordinate = 0;
-        // if there is nodes outside of viewport, max coordinate has to be adjusted
-        if (dimension.realSize > viewportSize) {
-            // max coordinate is real size minus virtual/rendered space
-            maxCoordinate = dimension.realSize - viewportSize - singleOffsetInPx;
-        }
-        let pos = position;
-        // limit position to max and min coordinates
-        if (pos < 0) {
-            pos = 0;
-        }
-        else if (pos > maxCoordinate) {
-            pos = maxCoordinate;
-        }
+        const maxCoordinate = getViewportMaxCoordinate(dimension, viewportSize, frameOffset);
+        let pos = clampViewportCoordinate(position, dimension, viewportSize, frameOffset);
         // store last coordinate for further restore on redraw
         this.lastCoordinate = pos;
         // actual position is less than first item start based on offset
@@ -406,10 +404,12 @@ class ViewportStore {
 exports.ViewportStore = ViewportStore;
 exports.addMissingItems = addMissingItems;
 exports.calculateRowHeaderSize = calculateRowHeaderSize;
+exports.clampViewportCoordinate = clampViewportCoordinate;
 exports.getFirstItem = getFirstItem;
 exports.getItems = getItems;
 exports.getLastItem = getLastItem;
 exports.getUpdatedItemsByPosition = getUpdatedItemsByPosition;
+exports.getViewportMaxCoordinate = getViewportMaxCoordinate;
 exports.isActiveRange = isActiveRange;
 exports.isActiveRangeOutsideLastItem = isActiveRangeOutsideLastItem;
 exports.recombineByOffset = recombineByOffset;

package/dist/collection/components/data/revogr-data.js

@@ -102,11 +102,13 @@ export class RevogrData {
         const depth = this.dataStore.get('groupingDepth');
         const groupingCustomRenderer = this.dataStore.get('groupingCustomRenderer');
         const groupDepth = this.columnService.hasGrouping ? depth : 0;
+        const rowRenderOffset = this.viewportRow.get('renderOffset') || 0;
+        const colRenderOffset = this.viewportCol.get('renderOffset') || 0;
         for (let rgRow of rows) {
             const dataItem = getSourceItem(this.dataStore, rgRow.itemIndex);
             // #region Grouping
             if (isGrouping(dataItem)) {
-                const gmodel = Object.assign(Object.assign({}, rgRow), { index: rgRow.itemIndex, model: dataItem, groupingCustomRenderer,
+                const gmodel = Object.assign(Object.assign({}, rgRow), { start: rgRow.start - rowRenderOffset, index: rgRow.itemIndex, model: dataItem, groupingCustomRenderer,
                     // Only show expand button if grouping is enabled and not in row headers
                     hasExpand: this.columnService.hasGrouping && this.colType !== 'rowHeaders', columnItems: cols, providers: this.providers });
                 rowsEls.push(h(GroupingRowRenderer, Object.assign({}, gmodel)));
@@ -129,7 +131,7 @@ export class RevogrData {
                     [DATA_ROW]: rowProps.itemIndex,
                     style: {
                         width: `${columnProps.size}px`,
-                        transform: `translateX(${columnProps.start}px)`,
+                        transform: `translateX(${columnProps.start - colRenderOffset}px)`,
                         height: rowProps.size ? `${rowProps.size}px` : undefined,
                     },
                 };
@@ -157,7 +159,7 @@ export class RevogrData {
             if (this.rowHighlightPlugin.isRowFocused(rgRow.itemIndex)) {
                 rowClass += ` ${ROW_FOCUSED_CLASS}`;
             }
-            const row = (h(RowRenderer, { index: rgRow.itemIndex, rowClass: rowClass, size: rgRow.size, start: rgRow.start, groupingLevel: groupDepth || undefined }, cells));
+            const row = (h(RowRenderer, { index: rgRow.itemIndex, rowClass: rowClass, size: rgRow.size, start: rgRow.start - rowRenderOffset, groupingLevel: groupDepth || undefined }, cells));
             this.beforerowrender.emit({
                 node: row,
                 item: rgRow,

package/dist/collection/components/header/header-group-renderer.js

@@ -15,7 +15,7 @@ const HeaderGroupRenderer = (p) => {
             [HEADER_CLASS]: true,
         },
         style: {
-            transform: `translateX(${p.start}px)`,
+            transform: `translateX(${p.start - (p.renderOffset || 0)}px)`,
             width: `${p.end - p.start}px`,
         },
         onResize: p.onResize,

package/dist/collection/components/header/header-renderer.js

@@ -25,7 +25,7 @@ const HeaderRenderer = (p) => {
         class: cellClass,
         style: {
             width: `${p.column.size}px`,
-            transform: `translateX(${p.column.start}px)`,
+            transform: `translateX(${p.column.start - (p.renderOffset || 0)}px)`,
         },
         onResize: p.onResize,
         onDblClick(originalEvent) {

package/dist/collection/components/header/revogr-header-style.css

@@ -34,15 +34,25 @@ revogr-header .rgHeaderCell.align-right {
 revogr-header .rgHeaderCell.sortable {
   cursor: pointer;
 }
-revogr-header .rgHeaderCell i.asc:after, revogr-header .rgHeaderCell i.desc:after {
+revogr-header .rgHeaderCell .sort-indicator {
+  display: inline-flex;
+  align-items: flex-start;
+  gap: 1px;
+}
+revogr-header .rgHeaderCell .sort-indicator i.asc:after, revogr-header .rgHeaderCell .sort-indicator i.desc:after {
   font-size: 13px;
 }
-revogr-header .rgHeaderCell i.asc:after {
+revogr-header .rgHeaderCell .sort-indicator i.asc:after {
   content: "↑";
 }
-revogr-header .rgHeaderCell i.desc:after {
+revogr-header .rgHeaderCell .sort-indicator i.desc:after {
   content: "↓";
 }
+revogr-header .rgHeaderCell .sort-indicator .sort-order-index {
+  font-size: 10px;
+  line-height: 1;
+  top: 0;
+}
 revogr-header .rgHeaderCell.active {
   z-index: 10;
 }

package/dist/collection/components/header/revogr-header.js

@@ -52,6 +52,7 @@ export class RevogrHeaderComponent {
     }
     renderHeaderColumns(cols, range) {
         const columnsToRender = [];
+        const renderOffset = this.viewportCol.get('renderOffset') || 0;
         for (let rgCol of cols) {
             const colData = this.colData[rgCol.itemIndex];
             const props = {
@@ -60,6 +61,7 @@ export class RevogrHeaderComponent {
                 data: Object.assign(Object.assign({}, colData), { index: rgCol.itemIndex, providers: this.providers }),
                 canFilter: !!this.columnFilter,
                 canResize: this.canResize,
+                renderOffset,
                 active: this.resizeHandler,
                 additionalData: this.additionalData,
                 onResize: e => this.onResize(e, rgCol.itemIndex),
@@ -112,6 +114,7 @@ export class RevogrHeaderComponent {
             start: groupStart,
             end: groupEnd,
             group,
+            renderOffset: this.viewportCol.get('renderOffset') || 0,
             active: this.resizeHandler,
             canResize: this.canResize,
             additionalData: this.additionalData,
@@ -579,7 +582,7 @@ export class RevogrHeaderComponent {
                 },
                 "complexType": {
                     "original": "HeaderRenderProps",
-                    "resolved": "{ column: VirtualPositionItem; additionalData: any; data: ColumnTemplateProp<ColumnProp>; range?: RangeArea | null | undefined; canResize?: boolean | undefined; canFilter?: boolean | undefined; onResize?(e: ResizeEvent): void; onClick?(data: InitialHeaderClick): void; onDblClick?(data: InitialHeaderClick): void; } & Partial<Pick<ResizeProps, \"active\">>",
+                    "resolved": "{ column: VirtualPositionItem; additionalData: any; data: ColumnTemplateProp<ColumnProp>; range?: RangeArea | null | undefined; canResize?: boolean | undefined; canFilter?: boolean | undefined; renderOffset?: number | undefined; onResize?(e: ResizeEvent): void; onClick?(data: InitialHeaderClick): void; onDblClick?(data: InitialHeaderClick): void; } & Partial<Pick<ResizeProps, \"active\">>",
                     "references": {
                         "HeaderRenderProps": {
                             "location": "import",
@@ -601,7 +604,7 @@ export class RevogrHeaderComponent {
                 },
                 "complexType": {
                     "original": "HeaderGroupRendererProps",
-                    "resolved": "{ start: number; end: number; group: Group; providers: ProvidersColumns<DimensionCols | \"rowHeaders\">; additionalData: any; canResize?: boolean | undefined; onResize?(e: ResizeEvent): void; } & Partial<Pick<ResizeProps, \"active\">>",
+                    "resolved": "{ start: number; end: number; group: Group; providers: ProvidersColumns<DimensionCols | \"rowHeaders\">; additionalData: any; canResize?: boolean | undefined; renderOffset?: number | undefined; onResize?(e: ResizeEvent): void; } & Partial<Pick<ResizeProps, \"active\">>",
                     "references": {
                         "HeaderGroupRendererProps": {
                             "location": "import",

package/dist/collection/components/order/order-row.service.js

@@ -51,11 +51,12 @@ export default class RowOrderService {
     getRow(y, { el, rows }) {
         const { top } = el.getBoundingClientRect();
         const topRelative = y - top;
-        const rgRow = getItemByPosition(rows, topRelative);
+        const rowOffset = rows.renderOffset || 0;
+        const rgRow = getItemByPosition(rows, topRelative + rowOffset);
         const absolutePosition = {
             itemIndex: rgRow.itemIndex,
-            start: rgRow.start + top,
-            end: rgRow.end + top,
+            start: rgRow.start - rowOffset + top,
+            end: rgRow.end - rowOffset + top,
         };
         return absolutePosition;
     }
@@ -64,8 +65,8 @@ export default class RowOrderService {
         const { top, left } = el.getBoundingClientRect();
         const topRelative = y - top;
         const leftRelative = x - left;
-        const rgRow = getItemByPosition(rows, topRelative);
-        const rgCol = getItemByPosition(cols, leftRelative);
+        const rgRow = getItemByPosition(rows, topRelative + (rows.renderOffset || 0));
+        const rgCol = getItemByPosition(cols, leftRelative + (cols.renderOffset || 0));
         return { x: rgCol.itemIndex, y: rgRow.itemIndex };
     }
 }

package/dist/collection/components/overlay/keyboard.service.js

@@ -4,6 +4,7 @@
 import { getRange } from "../../store/index";
 import { codesLetter, isAll, isClear, isCopy, isCut, isEnterKeyValue, isPaste, isShortcutModifier, isTab, timeout, RESIZE_INTERVAL, } from "../../utils";
 import { getCoordinate, isAfterLast, isBeforeFirst, } from "./selection.utils";
+import { isEditInput } from "../editors/edit.utils";
 const DIRECTION_CODES = [
     codesLetter.TAB,
     codesLetter.ARROW_UP,
@@ -15,9 +16,29 @@ export class KeyboardService {
     constructor(sv) {
         this.sv = sv;
     }
+    /**
+     * Appends printable key input that arrives after edit mode was requested
+     * but before the editor input has mounted or received focus.
+     */
+    appendPendingEditValue(e) {
+        if (isShortcutModifier(e) ||
+            e.key.length !== 1 ||
+            (e.target instanceof HTMLElement && isEditInput(e.target))) {
+            return false;
+        }
+        const editCell = this.sv.selectionStore.get('edit');
+        if (typeof (editCell === null || editCell === void 0 ? void 0 : editCell.val) !== 'string') {
+            return false;
+        }
+        this.sv.selectionStore.set('edit', Object.assign(Object.assign({}, editCell), { val: `${editCell.val}${e.key}` }));
+        return true;
+    }
     async keyDown(e, canRange, isEditMode, { range, focus }) {
         // IF EDIT MODE
         if (isEditMode) {
+            if (this.appendPendingEditValue(e)) {
+                return;
+            }
             switch (e.code) {
                 case codesLetter.ESCAPE:
                     this.sv.cancel();
@@ -111,7 +132,8 @@ export class KeyboardService {
         }
         const eData = this.sv.getData();
         if (isMulti) {
-            if (isAfterLast(data.end, eData.lastCell) || isBeforeFirst(data.start)) {
+            const isOutOfBounds = [data.start, data.end].some(cell => isAfterLast(cell, eData.lastCell) || isBeforeFirst(cell));
+            if (isOutOfBounds) {
                 return false;
             }
             const range = getRange(data.start, data.end);

package/dist/collection/components/overlay/selection.utils.js

@@ -49,8 +49,8 @@ export function getCurrentCell({ x, y }, { el, rows, cols }) {
         cellX = width - 1;
     }
     // Get the row and column items based on the cell position
-    const rgRow = getItemByPosition(rows, cellY);
-    const rgCol = getItemByPosition(cols, cellX);
+    const rgRow = getItemByPosition(rows, cellY + (rows.renderOffset || 0));
+    const rgCol = getItemByPosition(cols, cellX + (cols.renderOffset || 0));
     // Set the row and column index to 0 if they are before the first item
     if (rgCol.itemIndex < 0) {
         rgCol.itemIndex = 0;
@@ -120,10 +120,12 @@ export function styleByCellProps(styles) {
     };
 }
 export function getCell({ x, y, x1, y1 }, dimensionRow, dimensionCol) {
-    const top = getItemByIndex(dimensionRow, y).start;
-    const left = getItemByIndex(dimensionCol, x).start;
-    const bottom = getItemByIndex(dimensionRow, y1).end;
-    const right = getItemByIndex(dimensionCol, x1).end;
+    const rowOffset = dimensionRow.renderOffset || 0;
+    const colOffset = dimensionCol.renderOffset || 0;
+    const top = getItemByIndex(dimensionRow, y).start - rowOffset;
+    const left = getItemByIndex(dimensionCol, x).start - colOffset;
+    const bottom = getItemByIndex(dimensionRow, y1).end - rowOffset;
+    const right = getItemByIndex(dimensionCol, x1).end - colOffset;
     return {
         left,
         right,

package/dist/collection/components/revoGrid/revo-grid.js

@@ -626,12 +626,13 @@ export class RevoGridComponent {
             return;
         }
         const columns = this.columnProvider.setColumns(beforeApplyEvent.detail);
+        const order = {};
+        for (const prop of Object.keys(beforeApplyEvent.detail.sort)) {
+            order[prop] = beforeApplyEvent.detail.sort[prop].order;
+        }
         this.aftercolumnsset.emit({
             columns,
-            order: Object.entries(beforeApplyEvent.detail.sort).reduce((acc, [prop, column]) => {
-                acc[prop] = column.order;
-                return acc;
-            }, {}),
+            order,
         });
     }
     disableVirtualXChanged(newVal = false, prevVal = false) {
@@ -920,7 +921,7 @@ export class RevoGridComponent {
         if (Object.keys((_a = this.trimmedRows) !== null && _a !== void 0 ? _a : {}).length > 0) {
             this.trimmedRowsChanged(this.trimmedRows);
         }
-        this.rowDefChanged(this.rowDefinitions);
+        this.rowDefChanged(this.rowDefinitions, undefined, undefined, false);
         // init grouping
         if (this.grouping && Object.keys(this.grouping).length > 0) {
             this.groupingChanged(this.grouping);

package/dist/collection/components/revoGrid/viewport.service.js

@@ -108,7 +108,8 @@ export default class ViewportService {
         (_a = this.config.dimensionProvider) === null || _a === void 0 ? void 0 : _a.setCustomSizes(type, detail, true);
         // set resize event
         const changedItems = {};
-        for (const [i, size] of Object.entries(detail || {})) {
+        for (const i of Object.keys(detail || {})) {
+            const size = detail[i];
             const virtualIndex = parseInt(i, 10);
             const item = getSourceItem(store, virtualIndex);
             if (item) {

package/dist/collection/components/scroll/revogr-viewport-scroll.js

@@ -3,7 +3,7 @@
  */
 import { h, Host, } from "@stencil/core";
 import GridResizeService from "../revoGrid/viewport.resize.service";
-import LocalScrollService from "../../services/local.scroll.service";
+import LocalScrollService, { getContentSize } from "../../services/local.scroll.service";
 import { LocalScrollTimer } from "../../services/local.scroll.timer";
 import { CONTENT_SLOT, FOOTER_SLOT, HEADER_SLOT, } from "../revoGrid/viewport.helpers";
 /**
@@ -34,7 +34,7 @@ export class RevogrViewportScroll {
      * @param e
      */
     async changeScroll(e, silent = false) {
-        var _a, _b;
+        var _a, _b, _c, _d;
         if (silent) {
             if (e.coordinate && this.verticalScroll) {
                 switch (e.dimension) {
@@ -47,15 +47,16 @@ export class RevogrViewportScroll {
             return;
         }
         if (e.delta) {
+            let currentPhysicalCoordinate = 0;
             switch (e.dimension) {
                 case 'rgCol':
-                    e.coordinate = this.horizontalScroll.scrollLeft + e.delta;
+                    currentPhysicalCoordinate = this.horizontalScroll.scrollLeft;
                     break;
                 case 'rgRow':
-                    e.coordinate = ((_b = (_a = this.verticalScroll) === null || _a === void 0 ? void 0 : _a.scrollTop) !== null && _b !== void 0 ? _b : 0) + e.delta;
+                    currentPhysicalCoordinate = (_b = (_a = this.verticalScroll) === null || _a === void 0 ? void 0 : _a.scrollTop) !== null && _b !== void 0 ? _b : 0;
                     break;
             }
-            this.setScroll(e);
+            return (_d = (_c = this.localScrollService) === null || _c === void 0 ? void 0 : _c.setScrollByDelta(e, currentPhysicalCoordinate)) !== null && _d !== void 0 ? _d : e;
         }
         return e;
     }
@@ -207,7 +208,10 @@ export class RevogrViewportScroll {
         this.setScrollVisibility('rgCol', this.horizontalScroll.clientWidth, this.contentWidth);
     }
     render() {
-        return (h(Host, { key: 'adc7378dba1794ca2ec263d52b09abefe50bcbfd', onWheel: this.horizontalMouseWheel, onScroll: (e) => this.applyScroll('rgCol', e) }, h("div", { key: '7b57a8a0ea44629fefcfe4d2cd77bf0f048d8e06', class: "inner-content-table", style: { width: `${this.contentWidth}px` } }, h("div", { key: 'cca3de158bc2a7f0651f578a281819be5698b257', class: "header-wrapper", ref: e => (this.header = e) }, h("slot", { key: '1d170147dabe034f2c35481a8e2fedd6de2b6aed', name: HEADER_SLOT })), h("div", { key: 'b6dd29a91bb1f380a83a035dfdb749ca669936f2', class: "vertical-inner", ref: el => (this.verticalScroll = el), onWheel: this.verticalMouseWheel, onScroll: (e) => this.applyScroll('rgRow', e) }, h("div", { key: '9bce27bf8ec4d3b679aa9a34eb6379a8c2d46cac', class: "content-wrapper", style: { height: `${this.contentHeight}px` } }, h("slot", { key: 'b44a082c9fbb948fd87bd235b4cd4356fd4a3536', name: CONTENT_SLOT }))), h("div", { key: '28c305ff6bc664f1d1bbb117e8b8565c8d4bb6b2', class: "footer-wrapper", ref: e => (this.footer = e) }, h("slot", { key: '96312fb7f18198fd1feb9dcc00c79cde74ba9c9f', name: FOOTER_SLOT })))));
+        var _a, _b, _c, _d;
+        const physicalContentHeight = getContentSize(this.contentHeight, (_b = (_a = this.verticalScroll) === null || _a === void 0 ? void 0 : _a.clientHeight) !== null && _b !== void 0 ? _b : 0);
+        const physicalContentWidth = getContentSize(this.contentWidth, (_d = (_c = this.horizontalScroll) === null || _c === void 0 ? void 0 : _c.clientWidth) !== null && _d !== void 0 ? _d : 0);
+        return (h(Host, { key: 'a0c47dede9d131dea8c8ca449e8a323f24d9b113', onWheel: this.horizontalMouseWheel, onScroll: (e) => this.applyScroll('rgCol', e) }, h("div", { key: '6c960e753ffe522ba4afb1c379264873b6c617f3', class: "inner-content-table", style: { width: `${physicalContentWidth}px` } }, h("div", { key: '1a6cbcbd3634e84756b54c8150aebd25c824e14a', class: "header-wrapper", ref: e => (this.header = e) }, h("slot", { key: 'e4202c687bc39b4f78f3ed9840e979b032f06af8', name: HEADER_SLOT })), h("div", { key: '651415b5b32e72735065b183317386a34042bb85', class: "vertical-inner", ref: el => (this.verticalScroll = el), onWheel: this.verticalMouseWheel, onScroll: (e) => this.applyScroll('rgRow', e) }, h("div", { key: 'e65623b78d80957d8676adb019618953ef267ec3', class: "content-wrapper", style: { height: `${physicalContentHeight}px` } }, h("slot", { key: '5af47b12ef1226587cf774233447b5252d65e836', name: CONTENT_SLOT }))), h("div", { key: 'cbc0fd64fbfb53d3b18e547bbe34e32b7bb9c043', class: "footer-wrapper", ref: e => (this.footer = e) }, h("slot", { key: 'a8e4bfaef400973121090bac3069eb85469a95f3', name: FOOTER_SLOT })))));
     }
     /**
      * Extra layer for scroll event monitoring, where MouseWheel event is not passing

package/dist/collection/components/scrollable/revogr-scroll-virtual.js

@@ -37,15 +37,9 @@ export class RevogrScrollVirtual {
      */
     async changeScroll(e) {
         if (e.delta) {
-            switch (e.dimension) {
-                case 'rgCol':
-                    e.coordinate = this.element.scrollLeft + e.delta;
-                    break;
-                case 'rgRow':
-                    e.coordinate = this.element.scrollTop + e.delta;
-                    break;
-            }
-            this.setScroll(e);
+            const scrollProperty = e.dimension === 'rgRow' ? 'scrollTop' : 'scrollLeft';
+            const currentPhysicalCoordinate = this.element[scrollProperty];
+            return this.localScrollService.setScrollByDelta(e, currentPhysicalCoordinate);
         }
         return e;
     }
@@ -108,7 +102,7 @@ export class RevogrScrollVirtual {
     }
     render() {
         const size = getContentSize(this.realSize, this.dimension === 'rgRow' ? this.element.clientHeight : this.element.clientWidth, this.clientSize);
-        return (h(Host, { key: '57f81ec9deb2395e96b283338c03b9ad44f1e929', onScroll: (e) => this.onScroll(e) }, h("div", { key: '1a8c869adab53b362c351dae8d53664f33c4212c', style: {
+        return (h(Host, { key: '7213817ef941eee4050b714266598ec0c2961ee9', onScroll: (e) => this.onScroll(e) }, h("div", { key: '501da49c63253ab943172494b9dbf5399be56cee', style: {
                 [this.dimension === 'rgRow' ? 'height' : 'width']: `${size}px`,
             } })));
     }

package/dist/collection/plugins/filter/filter.panel.js

@@ -250,7 +250,8 @@ export class FilterPanel {
         const options = [];
         const prop = this.changes.prop;
         const hidden = new Set();
-        Object.entries(this.filterItems).forEach(([_, values]) => {
+        Object.keys(this.filterItems).forEach((prop) => {
+            const values = this.filterItems[prop];
             values.forEach((filter) => {
                 if (filter.hidden) {
                     hidden.add(filter.type);

package/dist/collection/plugins/filter/filter.plugin.js

@@ -152,17 +152,24 @@ export class FilterPlugin extends BasePlugin {
             }
         }
         if (config.collection) {
-            const filtersWithFilterFunctionPresent = Object.entries(config.collection).filter(([, item]) => this.filterFunctionsIndexedByType[item.type]);
-            this.filterCollection = Object.fromEntries(filtersWithFilterFunctionPresent);
+            const filterCollection = {};
+            for (const prop of Object.keys(config.collection)) {
+                const item = config.collection[prop];
+                if (this.filterFunctionsIndexedByType[item.type]) {
+                    filterCollection[prop] = item;
+                }
+            }
+            this.filterCollection = filterCollection;
         }
         else {
             this.filterCollection = {};
         }
         if (config.localization) {
             if (config.localization.filterNames) {
-                Object.entries(config.localization.filterNames).forEach(([k, v]) => {
+                const filterNames = config.localization.filterNames;
+                Object.keys(filterNames).forEach((k) => {
                     if (this.filterNameIndexByType[k] != void 0) {
-                        this.filterNameIndexByType[k] = v;
+                        this.filterNameIndexByType[k] = filterNames[k];
                     }
                 });
             }

package/dist/collection/plugins/groupingRow/grouping.row.plugin.js

@@ -1,6 +1,18 @@
 /*!
  * Built by Revolist OU ❤️
  */
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s)
+        if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+            t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { getPhysical, setItems, columnTypes, } from "../../store/index";
 import { BasePlugin } from "../base.plugin";
 import { FILTER_TRIMMED_TYPE } from "../filter/filter.plugin";
@@ -97,6 +109,18 @@ export class GroupingRowPlugin extends BasePlugin {
         const sortingPlugin = this.providers.plugins.getByClass(SortingPlugin);
         return !!(sortingPlugin === null || sortingPlugin === void 0 ? void 0 : sortingPlugin.sortingPromise);
     }
+    /**
+     * Returns grouping options for regrouping that must preserve current UI state.
+     *
+     * `expandedAll` and config `prevExpanded` are initial/config instructions.
+     * Reusing them after sorting would reopen groups the user collapsed before
+     * sorting instead of using the current grouped source state.
+     */
+    getCurrentExpandedOptions() {
+        var _a;
+        const _b = (_a = this.options) !== null && _a !== void 0 ? _a : {}, { expandedAll: _expandedAll, prevExpanded: _prevExpanded } = _b, options = __rest(_b, ["expandedAll", "prevExpanded"]);
+        return options;
+    }
     /**
      * Starts global source update with group clearing and applying new one
      * Initiated when need to reapply grouping
@@ -199,7 +223,7 @@ export class GroupingRowPlugin extends BasePlugin {
             if (!((_b = (_a = this.options) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.length)) {
                 return;
             }
-            this.doSourceUpdate(Object.assign({}, this.options));
+            this.doSourceUpdate(this.getCurrentExpandedOptions());
         });
         /**
          * Apply logic for focus inside of grouping

package/dist/collection/plugins/moveColumn/column.drag.plugin.js

@@ -68,7 +68,7 @@ export class ColumnMovePlugin extends BasePlugin {
         const cols = this.getDimension(data.pin || 'rgCol');
         const gridRect = this.revogrid.getBoundingClientRect();
         const elRect = dataEl.getBoundingClientRect();
-        const startItem = getItemByPosition(cols, getLeftRelative(event.x, gridRect.left, elRect.left - gridRect.left));
+        const startItem = getItemByPosition(cols, getLeftRelative(event.x, gridRect.left, elRect.left - gridRect.left) + (cols.renderOffset || 0));
         this.staticDragData = {
             startPos: event.x,
             startItem,
@@ -93,13 +93,13 @@ export class ColumnMovePlugin extends BasePlugin {
         const start = this.staticDragData.startPos;
         if (Math.abs(start - e.x) > 10) {
             const x = getLeftRelative(e.x, this.dragData.gridRect.left, this.dragData.scrollOffset);
-            const rgCol = getItemByPosition(this.staticDragData.cols, x);
+            const rgCol = getItemByPosition(this.staticDragData.cols, x + (this.staticDragData.cols.renderOffset || 0));
             this.orderUi.autoscroll(x, dragData.elRect.width);
             // prevent position change if out of bounds
             if (rgCol.itemIndex >= this.staticDragData.cols.count) {
                 return;
             }
-            this.orderUi.showHandler(rgCol.end + dragData.scrollOffset, dragData.gridRect.width);
+            this.orderUi.showHandler(rgCol.end - (this.staticDragData.cols.renderOffset || 0) + dragData.scrollOffset, dragData.gridRect.width);
         }
     }
     move(e) {
@@ -117,7 +117,7 @@ export class ColumnMovePlugin extends BasePlugin {
             if (relativePos < 0) {
                 relativePos = 0;
             }
-            const newPosition = getItemByPosition(this.staticDragData.cols, relativePos);
+            const newPosition = getItemByPosition(this.staticDragData.cols, relativePos + (this.staticDragData.cols.renderOffset || 0));
             const store = this.providers.column.stores[this.dragData.type].store;
             const source = store.get('source');
             const newItems = [...store.get('items')];