@revolist/revogrid 4.23.6 → 4.23.8

package/dist/cjs/{column.drag.plugin-yUSx3qoN.js → column.drag.plugin-CHyc9aCK.js}

@@ -1418,7 +1418,7 @@ class FilterPlugin extends BasePlugin {
         // filter button clicked, open filter dialog
         const gridPos = this.revogrid.getBoundingClientRect();
         const buttonPos = el.getBoundingClientRect();
-        const data = Object.assign(Object.assign(Object.assign({}, e.detail), this.filterCollection[prop]), { x: buttonPos.x - gridPos.x, y: buttonPos.y - gridPos.y + buttonPos.height, autoCorrect: true, filterTypes: this.getColumnFilter(e.detail.filter), filterItems: this.multiFilterItems, extraContent: this.extraHyperContent });
+        const data = Object.assign(Object.assign(Object.assign({}, e.detail), this.filterCollection[prop]), { x: buttonPos.x - gridPos.x, y: buttonPos.y - gridPos.y + buttonPos.height, autoCorrect: true, filterTypes: this.getColumnFilter(e.detail.filter), filterItems: this.multiFilterItems, extraContent: this.extraHyperContent, extraBottomContent: this.extraBottomHyperContent });
         (_b = this.beforeshow) === null || _b === void 0 ? void 0 : _b.call(this, data);
         this.pop.show(data);
     }
@@ -2672,8 +2672,17 @@ class ColumnMovePlugin extends BasePlugin {
     constructor(revogrid, providers) {
         super(revogrid, providers);
         this.moveFunc = debounce.debounce((e) => this.doMove(e), 5);
+        this.preventHeaderClickAfterDrag = (event) => {
+            if (!this.preventNextHeaderClick) {
+                return;
+            }
+            this.preventNextHeaderClick = false;
+            event.preventDefault();
+        };
         this.staticDragData = null;
         this.dragData = null;
+        this.columnDragMoved = false;
+        this.preventNextHeaderClick = false;
         this.localSubscriptions = {};
         this.orderUi = new ColumnOrderHandler();
         revogrid.appendChild(this.orderUi.render());
@@ -2692,11 +2701,13 @@ class ColumnMovePlugin extends BasePlugin {
             callback: (e) => this.move(e),
         };
         this.addEventListener(COLUMN_CLICK, ({ detail }) => this.dragStart(detail));
+        this.revogrid.addEventListener('beforeheaderclick', this.preventHeaderClickAfterDrag, { capture: true });
     }
     dragStart({ event, data }) {
         if (event.defaultPrevented) {
             return;
         }
+        this.preventNextHeaderClick = false;
         const { defaultPrevented } = headerCellRenderer.dispatch(this.revogrid, COLUMN_DRAG_START_EVENT, data);
         // check if allowed to drag particulat column
         if (defaultPrevented) {
@@ -2718,7 +2729,8 @@ class ColumnMovePlugin extends BasePlugin {
         const cols = this.getDimension(data.pin || 'rgCol');
         const gridRect = this.revogrid.getBoundingClientRect();
         const elRect = dataEl.getBoundingClientRect();
-        const startItem = dimension_helpers.getItemByPosition(cols, getLeftRelative(event.x, gridRect.left, elRect.left - gridRect.left) + (cols.renderOffset || 0));
+        const startItem = dimension_helpers.getItemByPosition(cols, getLeftRelative(event.x, gridRect.left, elRect.left - gridRect.left) +
+            (cols.renderOffset || 0));
         this.staticDragData = {
             startPos: event.x,
             startItem,
@@ -2749,10 +2761,14 @@ class ColumnMovePlugin extends BasePlugin {
             if (rgCol.itemIndex >= this.staticDragData.cols.count) {
                 return;
             }
-            this.orderUi.showHandler(rgCol.end - (this.staticDragData.cols.renderOffset || 0) + dragData.scrollOffset, dragData.gridRect.width);
+            this.orderUi.showHandler(getColumnDragPosition(rgCol, this.staticDragData.startItem, this.staticDragData.cols.renderOffset || 0, dragData.scrollOffset), dragData.gridRect.width);
         }
     }
     move(e) {
+        if (this.staticDragData &&
+            Math.abs(this.staticDragData.startPos - e.x) > 10) {
+            this.columnDragMoved = true;
+        }
         headerCellRenderer.dispatch(this.revogrid, COLUMN_DRAG_MOVE_EVENT, e);
         // then do move
         this.moveFunc(e);
@@ -2761,6 +2777,7 @@ class ColumnMovePlugin extends BasePlugin {
         this.clearOrder();
     }
     onMouseUp(e) {
+        const suppressClick = this.columnDragMoved;
         // apply new positions
         if (this.dragData && this.staticDragData) {
             let relativePos = getLeftRelative(e.x, this.dragData.gridRect.left, this.dragData.scrollOffset);
@@ -2783,6 +2800,9 @@ class ColumnMovePlugin extends BasePlugin {
             }
             headerCellRenderer.dispatch(this.revogrid, COLUMN_DRAG_END_EVENT, this.getData(this.staticDragData, newItems, source));
         }
+        if (suppressClick) {
+            this.preventNextHeaderClick = !!e.target.closest('revogr-header');
+        }
         this.clearOrder();
     }
     clearLocalSubscriptions() {
@@ -2791,6 +2811,7 @@ class ColumnMovePlugin extends BasePlugin {
     clearOrder() {
         this.staticDragData = null;
         this.dragData = null;
+        this.columnDragMoved = false;
         this.clearLocalSubscriptions();
         this.orderUi.stop(this.revogrid);
     }
@@ -2800,6 +2821,7 @@ class ColumnMovePlugin extends BasePlugin {
     clearSubscriptions() {
         super.clearSubscriptions();
         this.clearLocalSubscriptions();
+        this.revogrid.removeEventListener('beforeheaderclick', this.preventHeaderClickAfterDrag, { capture: true });
     }
     getData({ gridEl, dataEl, pin }, order, source = []) {
         const gridRect = gridEl.getBoundingClientRect();
@@ -2821,6 +2843,12 @@ class ColumnMovePlugin extends BasePlugin {
 function getLeftRelative(absoluteX, gridPos, offset) {
     return absoluteX - gridPos - offset;
 }
+function getColumnDragPosition(targetItem, startItem, renderOffset, scrollOffset) {
+    const insertionEdge = startItem.itemIndex > targetItem.itemIndex
+        ? targetItem.start
+        : targetItem.end;
+    return insertionEdge - renderOffset + scrollOffset;
+}
 
 exports.AutoSizeColumnPlugin = AutoSizeColumnPlugin;
 exports.BEFORE_COLUMN_DRAG_END_EVENT = BEFORE_COLUMN_DRAG_END_EVENT;
@@ -2847,6 +2875,7 @@ exports.doExpand = doExpand;
 exports.filterCoreFunctionsIndexedByType = filterCoreFunctionsIndexedByType;
 exports.filterNames = filterNames;
 exports.filterTypes = filterTypes;
+exports.getColumnDragPosition = getColumnDragPosition;
 exports.getComparer = getComparer;
 exports.getLeftRelative = getLeftRelative;
 exports.getNextOrder = getNextOrder;

package/dist/cjs/index.cjs.js

@@ -4,7 +4,7 @@
 'use strict';
 
 var column_service = require('./column.service-C1Qvcf5l.js');
-var column_drag_plugin = require('./column.drag.plugin-yUSx3qoN.js');
+var column_drag_plugin = require('./column.drag.plugin-CHyc9aCK.js');
 var headerCellRenderer = require('./header-cell-renderer-vVr4IWNV.js');
 var cellRenderer = require('./cell-renderer-Dcz022q7.js');
 var index$1 = require('./index-DxaSE5uZ.js');
@@ -233,6 +233,7 @@ exports.doExpand = column_drag_plugin.doExpand;
 exports.filterCoreFunctionsIndexedByType = column_drag_plugin.filterCoreFunctionsIndexedByType;
 exports.filterNames = column_drag_plugin.filterNames;
 exports.filterTypes = column_drag_plugin.filterTypes;
+exports.getColumnDragPosition = column_drag_plugin.getColumnDragPosition;
 exports.getComparer = column_drag_plugin.getComparer;
 exports.getLeftRelative = column_drag_plugin.getLeftRelative;
 exports.getNextOrder = column_drag_plugin.getNextOrder;

package/dist/cjs/revo-grid.cjs.entry.js

@@ -8,7 +8,7 @@ var column_service = require('./column.service-C1Qvcf5l.js');
 var dimension_helpers = require('./dimension.helpers-B9HgANnM.js');
 var debounce = require('./debounce-CcpHiH2p.js');
 var viewport_helpers = require('./viewport.helpers-BND76K2j.js');
-var column_drag_plugin = require('./column.drag.plugin-yUSx3qoN.js');
+var column_drag_plugin = require('./column.drag.plugin-CHyc9aCK.js');
 var viewport_store = require('./viewport.store-BscUCiUk.js');
 var theme_service = require('./theme.service-BgnxGIjK.js');
 var index$1 = require('./index-DxaSE5uZ.js');

package/dist/cjs/revogr-data_4.cjs.entry.js

@@ -830,9 +830,17 @@ const RevogrViewportScroll = class {
     }
     render() {
         var _a, _b;
-        const physicalContentHeight = throttle.getContentSize(this.contentHeight, (_b = (_a = this.verticalScroll) === null || _a === void 0 ? void 0 : _a.clientHeight) !== null && _b !== void 0 ? _b : 0);
+        const clientHeight = (_b = (_a = this.verticalScroll) === null || _a === void 0 ? void 0 : _a.clientHeight) !== null && _b !== void 0 ? _b : 0;
+        // When content fits in the viewport (no scroll needed), don't inflate content-wrapper
+        // to clientHeight — that would prevent inner-content-table from shrinking and push
+        // rowPinEnd (footer) to the bottom instead of letting it follow the data rows.
+        // For large/compressed grids (content > clientHeight), physicalContentHeight handles
+        // the browser scroll-size compression correctly.
+        const physicalContentHeight = this.contentHeight < clientHeight
+            ? Math.max(this.contentHeight, 0)
+            : throttle.getContentSize(this.contentHeight, clientHeight);
         const physicalContentWidth = throttle.getContentSize(this.contentWidth, 0);
-        return (index.h(index.Host, { key: 'ec8d907976c1d50f7aab3c263be3f0249a274df6', onWheel: this.horizontalMouseWheel, onScroll: (e) => this.applyScroll('rgCol', e) }, index.h("div", { key: 'e35696a7993ac94261426b45c28d488cdc42b7f0', class: "inner-content-table", style: { width: `${physicalContentWidth}px` } }, index.h("div", { key: 'a6997451e01eacda1d27d4efa1d74e1748626218', class: "header-wrapper", ref: e => (this.header = e) }, index.h("slot", { key: '1d401e87d32d5b1531c2211723b552bbc894f22c', name: viewport_helpers.HEADER_SLOT })), index.h("div", { key: 'ceab6f9e812d6ca9a0aa376afcd2562a17f505e0', class: "vertical-inner", ref: el => (this.verticalScroll = el), onWheel: this.verticalMouseWheel, onScroll: (e) => this.applyScroll('rgRow', e) }, index.h("div", { key: 'a9556578a23d6efddec2e982e863aec064042154', class: "content-wrapper", style: { height: `${physicalContentHeight}px` } }, index.h("slot", { key: '0ae01f9736b9740612e75261f6e3abebda533377', name: viewport_helpers.CONTENT_SLOT }))), index.h("div", { key: '09c2565d4ed449a43820f92d97b6558fca3758e7', class: "footer-wrapper", ref: e => (this.footer = e) }, index.h("slot", { key: '1ffb08ff8138a560cc09d82e3fe22a53e502aafe', name: viewport_helpers.FOOTER_SLOT })))));
+        return (index.h(index.Host, { key: '3dd9d29cf26743d7aa4995f51180d56008526e54', onWheel: this.horizontalMouseWheel, onScroll: (e) => this.applyScroll('rgCol', e) }, index.h("div", { key: 'af75428e845044c33eba2fecd1ec04a9177b9b5c', class: "inner-content-table", style: { width: `${physicalContentWidth}px` } }, index.h("div", { key: 'a0149f597588371e1fafe69efc3bd4411379a017', class: "header-wrapper", ref: e => (this.header = e) }, index.h("slot", { key: 'e5d2570bf93897cd97ef702141c83bb8c0e13ee2', name: viewport_helpers.HEADER_SLOT })), index.h("div", { key: 'd1388ff0d721dd8ce925b934bb2128fddc1ac17b', class: "vertical-inner", ref: el => (this.verticalScroll = el), onWheel: this.verticalMouseWheel, onScroll: (e) => this.applyScroll('rgRow', e) }, index.h("div", { key: 'a306ff56f62279402e2a881a081e3224341d5bdf', class: "content-wrapper", style: { height: `${physicalContentHeight}px` } }, index.h("slot", { key: '898bda8e9429da06c9ff2bd41626ac27f3cde3cc', name: viewport_helpers.CONTENT_SLOT }))), index.h("div", { key: '5e9eba1edd5fca07a964971054a7900e4dd84099', class: "footer-wrapper", ref: e => (this.footer = e) }, index.h("slot", { key: 'f233ad1c23b3f692c45e1db235cfef4704a80726', name: viewport_helpers.FOOTER_SLOT })))));
     }
     /**
      * Extra layer for scroll event monitoring, where MouseWheel event is not passing

package/dist/cjs/revogr-filter-panel.cjs.entry.js

@@ -348,7 +348,7 @@ const FilterPanel = class {
             } }));
     }
     render() {
-        var _a, _b, _c;
+        var _a, _b, _c, _d, _e;
         if (!this.changes) {
             return index.h(index.Host, { style: { display: 'none' } });
         }
@@ -365,7 +365,7 @@ const FilterPanel = class {
             index.h("label", null, capts.title),
             index.h("div", { class: "filter-holder" }, this.getFilterItemsList()),
             index.h("div", { class: "add-filter" }, index.h("select", { id: FILTER_ID, class: "select-css", onChange: e => this.onAddNewFilter(e) }, this.renderSelectOptions(this.currentFilterType)))
-        ]), index.h("slot", null), index.h("div", { class: "filter-actions" }, this.disableDynamicFiltering && [
+        ]), index.h("slot", null), ((_e = (_d = this.changes).extraBottomContent) === null || _e === void 0 ? void 0 : _e.call(_d, this.changes)) || '', index.h("div", { class: "filter-actions" }, this.disableDynamicFiltering && [
             index.h("button", { id: "revo-button-save", "aria-label": "save", class: "revo-button green", onClick: () => this.onSave() }, capts.save),
             index.h("button", { id: "revo-button-ok", "aria-label": "ok", class: "revo-button green", onClick: () => this.onCancel() }, capts.cancel),
         ], !this.disableDynamicFiltering && [

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

@@ -219,9 +219,17 @@ export class RevogrViewportScroll {
     }
     render() {
         var _a, _b;
-        const physicalContentHeight = getContentSize(this.contentHeight, (_b = (_a = this.verticalScroll) === null || _a === void 0 ? void 0 : _a.clientHeight) !== null && _b !== void 0 ? _b : 0);
+        const clientHeight = (_b = (_a = this.verticalScroll) === null || _a === void 0 ? void 0 : _a.clientHeight) !== null && _b !== void 0 ? _b : 0;
+        // When content fits in the viewport (no scroll needed), don't inflate content-wrapper
+        // to clientHeight — that would prevent inner-content-table from shrinking and push
+        // rowPinEnd (footer) to the bottom instead of letting it follow the data rows.
+        // For large/compressed grids (content > clientHeight), physicalContentHeight handles
+        // the browser scroll-size compression correctly.
+        const physicalContentHeight = this.contentHeight < clientHeight
+            ? Math.max(this.contentHeight, 0)
+            : getContentSize(this.contentHeight, clientHeight);
         const physicalContentWidth = getContentSize(this.contentWidth, 0);
-        return (h(Host, { key: 'ec8d907976c1d50f7aab3c263be3f0249a274df6', onWheel: this.horizontalMouseWheel, onScroll: (e) => this.applyScroll('rgCol', e) }, h("div", { key: 'e35696a7993ac94261426b45c28d488cdc42b7f0', class: "inner-content-table", style: { width: `${physicalContentWidth}px` } }, h("div", { key: 'a6997451e01eacda1d27d4efa1d74e1748626218', class: "header-wrapper", ref: e => (this.header = e) }, h("slot", { key: '1d401e87d32d5b1531c2211723b552bbc894f22c', name: HEADER_SLOT })), h("div", { key: 'ceab6f9e812d6ca9a0aa376afcd2562a17f505e0', class: "vertical-inner", ref: el => (this.verticalScroll = el), onWheel: this.verticalMouseWheel, onScroll: (e) => this.applyScroll('rgRow', e) }, h("div", { key: 'a9556578a23d6efddec2e982e863aec064042154', class: "content-wrapper", style: { height: `${physicalContentHeight}px` } }, h("slot", { key: '0ae01f9736b9740612e75261f6e3abebda533377', name: CONTENT_SLOT }))), h("div", { key: '09c2565d4ed449a43820f92d97b6558fca3758e7', class: "footer-wrapper", ref: e => (this.footer = e) }, h("slot", { key: '1ffb08ff8138a560cc09d82e3fe22a53e502aafe', name: FOOTER_SLOT })))));
+        return (h(Host, { key: '3dd9d29cf26743d7aa4995f51180d56008526e54', onWheel: this.horizontalMouseWheel, onScroll: (e) => this.applyScroll('rgCol', e) }, h("div", { key: 'af75428e845044c33eba2fecd1ec04a9177b9b5c', class: "inner-content-table", style: { width: `${physicalContentWidth}px` } }, h("div", { key: 'a0149f597588371e1fafe69efc3bd4411379a017', class: "header-wrapper", ref: e => (this.header = e) }, h("slot", { key: 'e5d2570bf93897cd97ef702141c83bb8c0e13ee2', name: HEADER_SLOT })), h("div", { key: 'd1388ff0d721dd8ce925b934bb2128fddc1ac17b', class: "vertical-inner", ref: el => (this.verticalScroll = el), onWheel: this.verticalMouseWheel, onScroll: (e) => this.applyScroll('rgRow', e) }, h("div", { key: 'a306ff56f62279402e2a881a081e3224341d5bdf', class: "content-wrapper", style: { height: `${physicalContentHeight}px` } }, h("slot", { key: '898bda8e9429da06c9ff2bd41626ac27f3cde3cc', name: CONTENT_SLOT }))), h("div", { key: '5e9eba1edd5fca07a964971054a7900e4dd84099', class: "footer-wrapper", ref: e => (this.footer = e) }, h("slot", { key: 'f233ad1c23b3f692c45e1db235cfef4704a80726', name: FOOTER_SLOT })))));
     }
     /**
      * Extra layer for scroll event monitoring, where MouseWheel event is not passing

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

@@ -329,7 +329,7 @@ export class FilterPanel {
             } }));
     }
     render() {
-        var _a, _b, _c;
+        var _a, _b, _c, _d, _e;
         if (!this.changes) {
             return h(Host, { style: { display: 'none' } });
         }
@@ -346,7 +346,7 @@ export class FilterPanel {
             h("label", null, capts.title),
             h("div", { class: "filter-holder" }, this.getFilterItemsList()),
             h("div", { class: "add-filter" }, h("select", { id: FILTER_ID, class: "select-css", onChange: e => this.onAddNewFilter(e) }, this.renderSelectOptions(this.currentFilterType)))
-        ]), h("slot", null), h("div", { class: "filter-actions" }, this.disableDynamicFiltering && [
+        ]), h("slot", null), ((_e = (_d = this.changes).extraBottomContent) === null || _e === void 0 ? void 0 : _e.call(_d, this.changes)) || '', h("div", { class: "filter-actions" }, this.disableDynamicFiltering && [
             h("button", { id: "revo-button-save", "aria-label": "save", class: "revo-button green", onClick: () => this.onSave() }, capts.save),
             h("button", { id: "revo-button-ok", "aria-label": "ok", class: "revo-button green", onClick: () => this.onCancel() }, capts.cancel),
         ], !this.disableDynamicFiltering && [

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

@@ -194,7 +194,7 @@ export class FilterPlugin extends BasePlugin {
         // filter button clicked, open filter dialog
         const gridPos = this.revogrid.getBoundingClientRect();
         const buttonPos = el.getBoundingClientRect();
-        const data = Object.assign(Object.assign(Object.assign({}, e.detail), this.filterCollection[prop]), { x: buttonPos.x - gridPos.x, y: buttonPos.y - gridPos.y + buttonPos.height, autoCorrect: true, filterTypes: this.getColumnFilter(e.detail.filter), filterItems: this.multiFilterItems, extraContent: this.extraHyperContent });
+        const data = Object.assign(Object.assign(Object.assign({}, e.detail), this.filterCollection[prop]), { x: buttonPos.x - gridPos.x, y: buttonPos.y - gridPos.y + buttonPos.height, autoCorrect: true, filterTypes: this.getColumnFilter(e.detail.filter), filterItems: this.multiFilterItems, extraContent: this.extraHyperContent, extraBottomContent: this.extraBottomHyperContent });
         (_b = this.beforeshow) === null || _b === void 0 ? void 0 : _b.call(this, data);
         this.pop.show(data);
     }

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

@@ -22,8 +22,17 @@ export class ColumnMovePlugin extends BasePlugin {
     constructor(revogrid, providers) {
         super(revogrid, providers);
         this.moveFunc = debounce((e) => this.doMove(e), 5);
+        this.preventHeaderClickAfterDrag = (event) => {
+            if (!this.preventNextHeaderClick) {
+                return;
+            }
+            this.preventNextHeaderClick = false;
+            event.preventDefault();
+        };
         this.staticDragData = null;
         this.dragData = null;
+        this.columnDragMoved = false;
+        this.preventNextHeaderClick = false;
         this.localSubscriptions = {};
         this.orderUi = new ColumnOrderHandler();
         revogrid.appendChild(this.orderUi.render());
@@ -42,11 +51,13 @@ export class ColumnMovePlugin extends BasePlugin {
             callback: (e) => this.move(e),
         };
         this.addEventListener(COLUMN_CLICK, ({ detail }) => this.dragStart(detail));
+        this.revogrid.addEventListener('beforeheaderclick', this.preventHeaderClickAfterDrag, { capture: true });
     }
     dragStart({ event, data }) {
         if (event.defaultPrevented) {
             return;
         }
+        this.preventNextHeaderClick = false;
         const { defaultPrevented } = dispatch(this.revogrid, COLUMN_DRAG_START_EVENT, data);
         // check if allowed to drag particulat column
         if (defaultPrevented) {
@@ -68,7 +79,8 @@ 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) + (cols.renderOffset || 0));
+        const startItem = getItemByPosition(cols, getLeftRelative(event.x, gridRect.left, elRect.left - gridRect.left) +
+            (cols.renderOffset || 0));
         this.staticDragData = {
             startPos: event.x,
             startItem,
@@ -99,10 +111,14 @@ export class ColumnMovePlugin extends BasePlugin {
             if (rgCol.itemIndex >= this.staticDragData.cols.count) {
                 return;
             }
-            this.orderUi.showHandler(rgCol.end - (this.staticDragData.cols.renderOffset || 0) + dragData.scrollOffset, dragData.gridRect.width);
+            this.orderUi.showHandler(getColumnDragPosition(rgCol, this.staticDragData.startItem, this.staticDragData.cols.renderOffset || 0, dragData.scrollOffset), dragData.gridRect.width);
         }
     }
     move(e) {
+        if (this.staticDragData &&
+            Math.abs(this.staticDragData.startPos - e.x) > 10) {
+            this.columnDragMoved = true;
+        }
         dispatch(this.revogrid, COLUMN_DRAG_MOVE_EVENT, e);
         // then do move
         this.moveFunc(e);
@@ -111,6 +127,7 @@ export class ColumnMovePlugin extends BasePlugin {
         this.clearOrder();
     }
     onMouseUp(e) {
+        const suppressClick = this.columnDragMoved;
         // apply new positions
         if (this.dragData && this.staticDragData) {
             let relativePos = getLeftRelative(e.x, this.dragData.gridRect.left, this.dragData.scrollOffset);
@@ -133,6 +150,9 @@ export class ColumnMovePlugin extends BasePlugin {
             }
             dispatch(this.revogrid, COLUMN_DRAG_END_EVENT, this.getData(this.staticDragData, newItems, source));
         }
+        if (suppressClick) {
+            this.preventNextHeaderClick = !!e.target.closest('revogr-header');
+        }
         this.clearOrder();
     }
     clearLocalSubscriptions() {
@@ -141,6 +161,7 @@ export class ColumnMovePlugin extends BasePlugin {
     clearOrder() {
         this.staticDragData = null;
         this.dragData = null;
+        this.columnDragMoved = false;
         this.clearLocalSubscriptions();
         this.orderUi.stop(this.revogrid);
     }
@@ -150,6 +171,7 @@ export class ColumnMovePlugin extends BasePlugin {
     clearSubscriptions() {
         super.clearSubscriptions();
         this.clearLocalSubscriptions();
+        this.revogrid.removeEventListener('beforeheaderclick', this.preventHeaderClickAfterDrag, { capture: true });
     }
     getData({ gridEl, dataEl, pin }, order, source = []) {
         const gridRect = gridEl.getBoundingClientRect();
@@ -171,3 +193,9 @@ export class ColumnMovePlugin extends BasePlugin {
 export function getLeftRelative(absoluteX, gridPos, offset) {
     return absoluteX - gridPos - offset;
 }
+export function getColumnDragPosition(targetItem, startItem, renderOffset, scrollOffset) {
+    const insertionEdge = startItem.itemIndex > targetItem.itemIndex
+        ? targetItem.start
+        : targetItem.end;
+    return insertionEdge - renderOffset + scrollOffset;
+}

package/dist/esm/{column.drag.plugin-Cg2U-91C.js → column.drag.plugin-DEKk4rrp.js}

@@ -1416,7 +1416,7 @@ class FilterPlugin extends BasePlugin {
         // filter button clicked, open filter dialog
         const gridPos = this.revogrid.getBoundingClientRect();
         const buttonPos = el.getBoundingClientRect();
-        const data = Object.assign(Object.assign(Object.assign({}, e.detail), this.filterCollection[prop]), { x: buttonPos.x - gridPos.x, y: buttonPos.y - gridPos.y + buttonPos.height, autoCorrect: true, filterTypes: this.getColumnFilter(e.detail.filter), filterItems: this.multiFilterItems, extraContent: this.extraHyperContent });
+        const data = Object.assign(Object.assign(Object.assign({}, e.detail), this.filterCollection[prop]), { x: buttonPos.x - gridPos.x, y: buttonPos.y - gridPos.y + buttonPos.height, autoCorrect: true, filterTypes: this.getColumnFilter(e.detail.filter), filterItems: this.multiFilterItems, extraContent: this.extraHyperContent, extraBottomContent: this.extraBottomHyperContent });
         (_b = this.beforeshow) === null || _b === void 0 ? void 0 : _b.call(this, data);
         this.pop.show(data);
     }
@@ -2670,8 +2670,17 @@ class ColumnMovePlugin extends BasePlugin {
     constructor(revogrid, providers) {
         super(revogrid, providers);
         this.moveFunc = debounce((e) => this.doMove(e), 5);
+        this.preventHeaderClickAfterDrag = (event) => {
+            if (!this.preventNextHeaderClick) {
+                return;
+            }
+            this.preventNextHeaderClick = false;
+            event.preventDefault();
+        };
         this.staticDragData = null;
         this.dragData = null;
+        this.columnDragMoved = false;
+        this.preventNextHeaderClick = false;
         this.localSubscriptions = {};
         this.orderUi = new ColumnOrderHandler();
         revogrid.appendChild(this.orderUi.render());
@@ -2690,11 +2699,13 @@ class ColumnMovePlugin extends BasePlugin {
             callback: (e) => this.move(e),
         };
         this.addEventListener(COLUMN_CLICK, ({ detail }) => this.dragStart(detail));
+        this.revogrid.addEventListener('beforeheaderclick', this.preventHeaderClickAfterDrag, { capture: true });
     }
     dragStart({ event, data }) {
         if (event.defaultPrevented) {
             return;
         }
+        this.preventNextHeaderClick = false;
         const { defaultPrevented } = dispatch(this.revogrid, COLUMN_DRAG_START_EVENT, data);
         // check if allowed to drag particulat column
         if (defaultPrevented) {
@@ -2716,7 +2727,8 @@ 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) + (cols.renderOffset || 0));
+        const startItem = getItemByPosition(cols, getLeftRelative(event.x, gridRect.left, elRect.left - gridRect.left) +
+            (cols.renderOffset || 0));
         this.staticDragData = {
             startPos: event.x,
             startItem,
@@ -2747,10 +2759,14 @@ class ColumnMovePlugin extends BasePlugin {
             if (rgCol.itemIndex >= this.staticDragData.cols.count) {
                 return;
             }
-            this.orderUi.showHandler(rgCol.end - (this.staticDragData.cols.renderOffset || 0) + dragData.scrollOffset, dragData.gridRect.width);
+            this.orderUi.showHandler(getColumnDragPosition(rgCol, this.staticDragData.startItem, this.staticDragData.cols.renderOffset || 0, dragData.scrollOffset), dragData.gridRect.width);
         }
     }
     move(e) {
+        if (this.staticDragData &&
+            Math.abs(this.staticDragData.startPos - e.x) > 10) {
+            this.columnDragMoved = true;
+        }
         dispatch(this.revogrid, COLUMN_DRAG_MOVE_EVENT, e);
         // then do move
         this.moveFunc(e);
@@ -2759,6 +2775,7 @@ class ColumnMovePlugin extends BasePlugin {
         this.clearOrder();
     }
     onMouseUp(e) {
+        const suppressClick = this.columnDragMoved;
         // apply new positions
         if (this.dragData && this.staticDragData) {
             let relativePos = getLeftRelative(e.x, this.dragData.gridRect.left, this.dragData.scrollOffset);
@@ -2781,6 +2798,9 @@ class ColumnMovePlugin extends BasePlugin {
             }
             dispatch(this.revogrid, COLUMN_DRAG_END_EVENT, this.getData(this.staticDragData, newItems, source));
         }
+        if (suppressClick) {
+            this.preventNextHeaderClick = !!e.target.closest('revogr-header');
+        }
         this.clearOrder();
     }
     clearLocalSubscriptions() {
@@ -2789,6 +2809,7 @@ class ColumnMovePlugin extends BasePlugin {
     clearOrder() {
         this.staticDragData = null;
         this.dragData = null;
+        this.columnDragMoved = false;
         this.clearLocalSubscriptions();
         this.orderUi.stop(this.revogrid);
     }
@@ -2798,6 +2819,7 @@ class ColumnMovePlugin extends BasePlugin {
     clearSubscriptions() {
         super.clearSubscriptions();
         this.clearLocalSubscriptions();
+        this.revogrid.removeEventListener('beforeheaderclick', this.preventHeaderClickAfterDrag, { capture: true });
     }
     getData({ gridEl, dataEl, pin }, order, source = []) {
         const gridRect = gridEl.getBoundingClientRect();
@@ -2819,5 +2841,11 @@ class ColumnMovePlugin extends BasePlugin {
 function getLeftRelative(absoluteX, gridPos, offset) {
     return absoluteX - gridPos - offset;
 }
+function getColumnDragPosition(targetItem, startItem, renderOffset, scrollOffset) {
+    const insertionEdge = startItem.itemIndex > targetItem.itemIndex
+        ? targetItem.start
+        : targetItem.end;
+    return insertionEdge - renderOffset + scrollOffset;
+}
 
-export { AutoSizeColumnPlugin as A, BasePlugin as B, ColumnAutoSizeMode as C, DimensionStore as D, ExportFilePlugin as E, FILTER_TRIMMED_TYPE as F, GroupingRowPlugin as G, SelectionStore as S, StretchColumn as a, ExportCsv as b, FILTER_CONFIG_CHANGED_EVENT as c, FILTE_PANEL as d, FilterPlugin as e, filterCoreFunctionsIndexedByType as f, filterTypes as g, filterNames as h, isStretchPlugin as i, doCollapse as j, doExpand as k, COLUMN_DRAG_MOVE_EVENT as l, COLUMN_DRAG_END_EVENT as m, BEFORE_COLUMN_DRAG_END_EVENT as n, COLUMN_DRAG_START_EVENT as o, ColumnMovePlugin as p, getLeftRelative as q, SortingPlugin as r, hasActiveSorting as s, getSortingIndex as t, sortIndexByItems as u, defaultCellCompare as v, descCellCompare as w, getNextOrder as x, getComparer as y };
+export { AutoSizeColumnPlugin as A, BasePlugin as B, ColumnAutoSizeMode as C, DimensionStore as D, ExportFilePlugin as E, FILTER_TRIMMED_TYPE as F, GroupingRowPlugin as G, SelectionStore as S, StretchColumn as a, ExportCsv as b, FILTER_CONFIG_CHANGED_EVENT as c, FILTE_PANEL as d, FilterPlugin as e, filterCoreFunctionsIndexedByType as f, filterTypes as g, filterNames as h, isStretchPlugin as i, doCollapse as j, doExpand as k, COLUMN_DRAG_MOVE_EVENT as l, COLUMN_DRAG_END_EVENT as m, BEFORE_COLUMN_DRAG_END_EVENT as n, COLUMN_DRAG_START_EVENT as o, ColumnMovePlugin as p, getLeftRelative as q, getColumnDragPosition as r, SortingPlugin as s, hasActiveSorting as t, getSortingIndex as u, sortIndexByItems as v, defaultCellCompare as w, descCellCompare as x, getNextOrder as y, getComparer as z };

package/dist/esm/index.js

@@ -2,8 +2,8 @@
  * Built by Revolist OU ❤️
  */
 export { o as GROUPING_ROW_TYPE, j as GROUP_COLUMN_PROP, G as GROUP_DEPTH, h as GROUP_EXPANDED, l as GROUP_EXPAND_BTN, m as GROUP_EXPAND_EVENT, k as GROUP_ORIGINAL_INDEX, f as PSEUDO_GROUP_COLUMN, P as PSEUDO_GROUP_ITEM, d as PSEUDO_GROUP_ITEM_ID, e as PSEUDO_GROUP_ITEM_VALUE, c as columnTypes, a as cropCellToMax, H as gatherGroup, s as gatherGrouping, z as getCellData, B as getCellDataParsed, A as getCellRaw, I as getColumnByProp, D as getColumnSizes, C as getColumnType, F as getColumns, q as getExpanded, t as getGroupingName, x as getParsedGroup, g as getRange, p as getSource, E as isColGrouping, u as isGrouping, v as isGroupingColumn, b as isRangeSingleCell, i as isRowType, y as isSameGroup, w as measureEqualDepth, n as nextCell, r as rowTypes } from './column.service-CC_SD8W3.js';
-import { B as BasePlugin } from './column.drag.plugin-Cg2U-91C.js';
-export { A as AutoSizeColumnPlugin, n as BEFORE_COLUMN_DRAG_END_EVENT, m as COLUMN_DRAG_END_EVENT, l as COLUMN_DRAG_MOVE_EVENT, o as COLUMN_DRAG_START_EVENT, C as ColumnAutoSizeMode, p as ColumnMovePlugin, D as DimensionStore, b as ExportCsv, E as ExportFilePlugin, c as FILTER_CONFIG_CHANGED_EVENT, F as FILTER_TRIMMED_TYPE, d as FILTE_PANEL, e as FilterPlugin, G as GroupingRowPlugin, S as SelectionStore, r as SortingPlugin, a as StretchColumn, v as defaultCellCompare, w as descCellCompare, j as doCollapse, k as doExpand, f as filterCoreFunctionsIndexedByType, h as filterNames, g as filterTypes, y as getComparer, q as getLeftRelative, x as getNextOrder, t as getSortingIndex, s as hasActiveSorting, i as isStretchPlugin, u as sortIndexByItems } from './column.drag.plugin-Cg2U-91C.js';
+import { B as BasePlugin } from './column.drag.plugin-DEKk4rrp.js';
+export { A as AutoSizeColumnPlugin, n as BEFORE_COLUMN_DRAG_END_EVENT, m as COLUMN_DRAG_END_EVENT, l as COLUMN_DRAG_MOVE_EVENT, o as COLUMN_DRAG_START_EVENT, C as ColumnAutoSizeMode, p as ColumnMovePlugin, D as DimensionStore, b as ExportCsv, E as ExportFilePlugin, c as FILTER_CONFIG_CHANGED_EVENT, F as FILTER_TRIMMED_TYPE, d as FILTE_PANEL, e as FilterPlugin, G as GroupingRowPlugin, S as SelectionStore, s as SortingPlugin, a as StretchColumn, w as defaultCellCompare, x as descCellCompare, j as doCollapse, k as doExpand, f as filterCoreFunctionsIndexedByType, h as filterNames, g as filterTypes, r as getColumnDragPosition, z as getComparer, q as getLeftRelative, y as getNextOrder, u as getSortingIndex, t as hasActiveSorting, i as isStretchPlugin, v as sortIndexByItems } from './column.drag.plugin-DEKk4rrp.js';
 export { d as dispatch, a as dispatchByEvent } from './header-cell-renderer-B-LX2sgu.js';
 export { C as CellRenderer, G as GroupingRowRenderer, S as SortingSign, e as expandEvent, a as expandSvgIconVNode } from './cell-renderer-BtN-NGCk.js';
 export { a as applyMixins, f as findPositionInArray, g as getScrollbarSize, m as mergeSortedArray, p as pushSorted, r as range, s as scaleValue, t as timeout } from './index-Db3qZoW5.js';

package/dist/esm/revo-grid.entry.js

@@ -6,7 +6,7 @@ import { c as columnTypes, J as reduce, C as getColumnType, r as rowTypes, i as
 import { D as DataStore, b as getSourceItem, f as getSourceItemVirtualIndexByProp, d as setSourceByPhysicalIndex, s as setSourceByVirtualIndex, a as getVisibleSourceItem, h as gatherTrimmedItems, k as getItemByIndex, R as RESIZE_INTERVAL } from './dimension.helpers-CGKwSvw6.js';
 import { d as debounce } from './debounce-PCRWZliA.js';
 import { g as getScrollDimension, v as viewportDataPartition, F as FOOTER_SLOT, C as CONTENT_SLOT, H as HEADER_SLOT, D as DATA_SLOT } from './viewport.helpers-CoCAvmZs.js';
-import { D as DimensionStore, S as SelectionStore, B as BasePlugin, G as GroupingRowPlugin, a as StretchColumn, i as isStretchPlugin, A as AutoSizeColumnPlugin, e as FilterPlugin, E as ExportFilePlugin, r as SortingPlugin, p as ColumnMovePlugin } from './column.drag.plugin-Cg2U-91C.js';
+import { D as DimensionStore, S as SelectionStore, B as BasePlugin, G as GroupingRowPlugin, a as StretchColumn, i as isStretchPlugin, A as AutoSizeColumnPlugin, e as FilterPlugin, E as ExportFilePlugin, s as SortingPlugin, p as ColumnMovePlugin } from './column.drag.plugin-DEKk4rrp.js';
 import { V as ViewportStore } from './viewport.store-_c579YyM.js';
 import { T as ThemeService } from './theme.service-BmnDvr6P.js';
 import { t as timeout } from './index-Db3qZoW5.js';

package/dist/esm/revogr-data_4.entry.js

@@ -828,9 +828,17 @@ const RevogrViewportScroll = class {
     }
     render() {
         var _a, _b;
-        const physicalContentHeight = getContentSize(this.contentHeight, (_b = (_a = this.verticalScroll) === null || _a === void 0 ? void 0 : _a.clientHeight) !== null && _b !== void 0 ? _b : 0);
+        const clientHeight = (_b = (_a = this.verticalScroll) === null || _a === void 0 ? void 0 : _a.clientHeight) !== null && _b !== void 0 ? _b : 0;
+        // When content fits in the viewport (no scroll needed), don't inflate content-wrapper
+        // to clientHeight — that would prevent inner-content-table from shrinking and push
+        // rowPinEnd (footer) to the bottom instead of letting it follow the data rows.
+        // For large/compressed grids (content > clientHeight), physicalContentHeight handles
+        // the browser scroll-size compression correctly.
+        const physicalContentHeight = this.contentHeight < clientHeight
+            ? Math.max(this.contentHeight, 0)
+            : getContentSize(this.contentHeight, clientHeight);
         const physicalContentWidth = getContentSize(this.contentWidth, 0);
-        return (h(Host, { key: 'ec8d907976c1d50f7aab3c263be3f0249a274df6', onWheel: this.horizontalMouseWheel, onScroll: (e) => this.applyScroll('rgCol', e) }, h("div", { key: 'e35696a7993ac94261426b45c28d488cdc42b7f0', class: "inner-content-table", style: { width: `${physicalContentWidth}px` } }, h("div", { key: 'a6997451e01eacda1d27d4efa1d74e1748626218', class: "header-wrapper", ref: e => (this.header = e) }, h("slot", { key: '1d401e87d32d5b1531c2211723b552bbc894f22c', name: HEADER_SLOT })), h("div", { key: 'ceab6f9e812d6ca9a0aa376afcd2562a17f505e0', class: "vertical-inner", ref: el => (this.verticalScroll = el), onWheel: this.verticalMouseWheel, onScroll: (e) => this.applyScroll('rgRow', e) }, h("div", { key: 'a9556578a23d6efddec2e982e863aec064042154', class: "content-wrapper", style: { height: `${physicalContentHeight}px` } }, h("slot", { key: '0ae01f9736b9740612e75261f6e3abebda533377', name: CONTENT_SLOT }))), h("div", { key: '09c2565d4ed449a43820f92d97b6558fca3758e7', class: "footer-wrapper", ref: e => (this.footer = e) }, h("slot", { key: '1ffb08ff8138a560cc09d82e3fe22a53e502aafe', name: FOOTER_SLOT })))));
+        return (h(Host, { key: '3dd9d29cf26743d7aa4995f51180d56008526e54', onWheel: this.horizontalMouseWheel, onScroll: (e) => this.applyScroll('rgCol', e) }, h("div", { key: 'af75428e845044c33eba2fecd1ec04a9177b9b5c', class: "inner-content-table", style: { width: `${physicalContentWidth}px` } }, h("div", { key: 'a0149f597588371e1fafe69efc3bd4411379a017', class: "header-wrapper", ref: e => (this.header = e) }, h("slot", { key: 'e5d2570bf93897cd97ef702141c83bb8c0e13ee2', name: HEADER_SLOT })), h("div", { key: 'd1388ff0d721dd8ce925b934bb2128fddc1ac17b', class: "vertical-inner", ref: el => (this.verticalScroll = el), onWheel: this.verticalMouseWheel, onScroll: (e) => this.applyScroll('rgRow', e) }, h("div", { key: 'a306ff56f62279402e2a881a081e3224341d5bdf', class: "content-wrapper", style: { height: `${physicalContentHeight}px` } }, h("slot", { key: '898bda8e9429da06c9ff2bd41626ac27f3cde3cc', name: CONTENT_SLOT }))), h("div", { key: '5e9eba1edd5fca07a964971054a7900e4dd84099', class: "footer-wrapper", ref: e => (this.footer = e) }, h("slot", { key: 'f233ad1c23b3f692c45e1db235cfef4704a80726', name: FOOTER_SLOT })))));
     }
     /**
      * Extra layer for scroll event monitoring, where MouseWheel event is not passing

package/dist/esm/revogr-filter-panel.entry.js

@@ -346,7 +346,7 @@ const FilterPanel = class {
             } }));
     }
     render() {
-        var _a, _b, _c;
+        var _a, _b, _c, _d, _e;
         if (!this.changes) {
             return h(Host, { style: { display: 'none' } });
         }
@@ -363,7 +363,7 @@ const FilterPanel = class {
             h("label", null, capts.title),
             h("div", { class: "filter-holder" }, this.getFilterItemsList()),
             h("div", { class: "add-filter" }, h("select", { id: FILTER_ID, class: "select-css", onChange: e => this.onAddNewFilter(e) }, this.renderSelectOptions(this.currentFilterType)))
-        ]), h("slot", null), h("div", { class: "filter-actions" }, this.disableDynamicFiltering && [
+        ]), h("slot", null), ((_e = (_d = this.changes).extraBottomContent) === null || _e === void 0 ? void 0 : _e.call(_d, this.changes)) || '', h("div", { class: "filter-actions" }, this.disableDynamicFiltering && [
             h("button", { id: "revo-button-save", "aria-label": "save", class: "revo-button green", onClick: () => this.onSave() }, capts.save),
             h("button", { id: "revo-button-ok", "aria-label": "ok", class: "revo-button green", onClick: () => this.onCancel() }, capts.cancel),
         ], !this.disableDynamicFiltering && [