@revolist/revogrid 4.0.4-next → 4.0.4

package/dist/collection/plugins/column.auto-size.plugin.js

@@ -0,0 +1,234 @@
+/*!
+ * Built by Revolist OU ❤️
+ */
+/**
+ * Plugin module for revo-grid grid system
+ * Add support for automatic column resize
+ */
+import each from "lodash/each";
+import reduce from "lodash/reduce";
+import { BasePlugin } from "./base.plugin";
+import ColumnDataProvider from "../services/column.data.provider";
+import { columnTypes } from "../store/storeTypes";
+import { getSourceItem } from "../store/dataSource/data.store";
+const LETTER_BLOCK_SIZE = 7;
+var ColumnAutoSizeMode;
+(function (ColumnAutoSizeMode) {
+    // increases column width on header click according the largest text value
+    ColumnAutoSizeMode["headerClickAutosize"] = "headerClickAutoSize";
+    // increases column width on data set and text edit, decreases performance
+    ColumnAutoSizeMode["autoSizeOnTextOverlap"] = "autoSizeOnTextOverlap";
+    // increases and decreases column width based on all items sizes, worst for performance
+    ColumnAutoSizeMode["autoSizeAll"] = "autoSizeAll";
+})(ColumnAutoSizeMode || (ColumnAutoSizeMode = {}));
+export default class AutoSizeColumnPlugin extends BasePlugin {
+    constructor(revogrid, providers, config) {
+        super(revogrid, providers);
+        this.providers = providers;
+        this.config = config;
+        this.autoSizeColumns = null;
+        /** for edge case when no columns defined before data */
+        this.dataResolve = null;
+        this.dataReject = null;
+        this.letterBlockSize = (config === null || config === void 0 ? void 0 : config.letterBlockSize) || LETTER_BLOCK_SIZE;
+        // create test container to check text width
+        if (config === null || config === void 0 ? void 0 : config.preciseSize) {
+            this.precsizeCalculationArea = this.initiatePresizeElement();
+            revogrid.appendChild(this.precsizeCalculationArea);
+        }
+        const aftersourceset = ({ detail: { source } }) => {
+            this.setSource(source);
+        };
+        const afteredit = ({ detail }) => {
+            this.afteredit(detail);
+        };
+        const afterEditAll = ({ detail }) => {
+            this.afterEditAll(detail);
+        };
+        const beforecolumnsset = ({ detail: { columns } }) => {
+            this.columnSet(columns);
+        };
+        const headerDblClick = ({ detail }) => {
+            const type = ColumnDataProvider.getColumnType(detail.column);
+            const size = this.getColumnSize(detail.index, type);
+            if (size) {
+                this.providers.dimension.setCustomSizes(type, {
+                    [detail.index]: size,
+                }, true);
+            }
+        };
+        this.addEventListener('beforecolumnsset', beforecolumnsset);
+        switch (config === null || config === void 0 ? void 0 : config.mode) {
+            case ColumnAutoSizeMode.autoSizeOnTextOverlap:
+                this.addEventListener('aftersourceset', aftersourceset);
+                this.addEventListener('afteredit', afteredit);
+                break;
+            case ColumnAutoSizeMode.autoSizeAll:
+                this.addEventListener('aftersourceset', aftersourceset);
+                this.addEventListener('afteredit', afterEditAll);
+                break;
+            default:
+                this.addEventListener('headerdblclick', headerDblClick);
+                break;
+        }
+    }
+    async setSource(source) {
+        let autoSize = this.autoSizeColumns;
+        if (this.dataReject) {
+            this.dataReject();
+            this.clearPromise();
+        }
+        /** If data set first and no column provided await until get one */
+        if (!autoSize) {
+            const request = new Promise((resolve, reject) => {
+                this.dataResolve = resolve;
+                this.dataReject = reject;
+            });
+            try {
+                autoSize = await request;
+            }
+            catch (e) {
+                return;
+            }
+        }
+        // calculate sizes
+        each(autoSize, (_v, type) => {
+            const sizes = {};
+            each(autoSize[type], rgCol => {
+                // calculate size
+                rgCol.size = sizes[rgCol.index] = source.reduce((prev, rgRow) => Math.max(prev, this.getLength(rgRow[rgCol.prop])), this.getLength(rgCol.name || ''));
+            });
+            this.providers.dimension.setCustomSizes(type, sizes, true);
+        });
+    }
+    getLength(len) {
+        var _a;
+        const padding = 15;
+        if (!len) {
+            return 0;
+        }
+        try {
+            const str = len.toString();
+            /**if exact calculation required proxy with html element, slow operation */
+            if ((_a = this.config) === null || _a === void 0 ? void 0 : _a.preciseSize) {
+                this.precsizeCalculationArea.innerText = str;
+                return this.precsizeCalculationArea.scrollWidth + padding * 2;
+            }
+            return str.length * this.letterBlockSize + padding * 2;
+        }
+        catch (e) {
+            return 0;
+        }
+    }
+    afteredit(e) {
+        let data;
+        if (this.isRangeEdit(e)) {
+            data = e.data;
+        }
+        else {
+            data = { 0: { [e.prop]: e.val } };
+        }
+        each(this.autoSizeColumns, (columns, type) => {
+            const sizes = {};
+            each(columns, rgCol => {
+                // calculate size
+                const size = reduce(data, (prev, rgRow) => {
+                    if (typeof rgRow[rgCol.prop] === 'undefined') {
+                        return prev;
+                    }
+                    return Math.max(prev || 0, this.getLength(rgRow[rgCol.prop]));
+                }, undefined);
+                if (size && rgCol.size < size) {
+                    rgCol.size = sizes[rgCol.index] = size;
+                }
+            });
+            this.providers.dimension.setCustomSizes(type, sizes, true);
+        });
+    }
+    afterEditAll(e) {
+        const props = {};
+        if (this.isRangeEdit(e)) {
+            each(e.data, r => each(r, (_v, p) => (props[p] = true)));
+        }
+        else {
+            props[e.prop] = true;
+        }
+        each(this.autoSizeColumns, (columns, type) => {
+            const sizes = {};
+            each(columns, rgCol => {
+                if (props[rgCol.prop]) {
+                    const size = this.getColumnSize(rgCol.index, type);
+                    if (size) {
+                        sizes[rgCol.index] = size;
+                    }
+                }
+            });
+            this.providers.dimension.setCustomSizes(type, sizes, true);
+        });
+    }
+    getColumnSize(index, type) {
+        const rgCol = this.autoSizeColumns[type][index];
+        if (!rgCol) {
+            return 0;
+        }
+        return reduce(this.providers.data.stores, (r, s) => {
+            const perStore = reduce(s.store.get('items'), (prev, _row, i) => {
+                const item = getSourceItem(s.store, i);
+                return Math.max(prev || 0, this.getLength(item[rgCol.prop]));
+            }, 0);
+            return Math.max(r, perStore);
+        }, rgCol.size || 0);
+    }
+    columnSet(columns) {
+        var _a;
+        for (let t of columnTypes) {
+            const type = t;
+            const cols = columns[type];
+            for (let i in cols) {
+                if (cols[i].autoSize || ((_a = this.config) === null || _a === void 0 ? void 0 : _a.allColumns)) {
+                    if (!this.autoSizeColumns) {
+                        this.autoSizeColumns = {};
+                    }
+                    if (!this.autoSizeColumns[type]) {
+                        this.autoSizeColumns[type] = {};
+                    }
+                    this.autoSizeColumns[type][i] = Object.assign(Object.assign({}, cols[i]), { index: parseInt(i, 10) });
+                }
+            }
+        }
+        if (this.dataResolve) {
+            this.dataResolve(this.autoSizeColumns);
+            this.clearPromise();
+        }
+    }
+    clearPromise() {
+        this.dataResolve = null;
+        this.dataReject = null;
+    }
+    isRangeEdit(e) {
+        return !!e.data;
+    }
+    initiatePresizeElement() {
+        const styleForFontTest = {
+            position: 'absolute',
+            fontSize: '14px',
+            height: '0',
+            width: '0',
+            whiteSpace: 'nowrap',
+            top: '0',
+            overflowX: 'scroll',
+        };
+        const el = document.createElement('div');
+        for (let s in styleForFontTest) {
+            el.style[s] = styleForFontTest[s];
+        }
+        el.classList.add('revo-test-container');
+        return el;
+    }
+    destroy() {
+        var _a;
+        super.destroy();
+        (_a = this.precsizeCalculationArea) === null || _a === void 0 ? void 0 : _a.remove();
+    }
+}
+//# sourceMappingURL=column.auto-size.plugin.js.map

package/dist/collection/plugins/column.auto-size.plugin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"column.auto-size.plugin.js","sourceRoot":"","sources":["../../src/plugins/column.auto-size.plugin.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,IAAI,MAAM,aAAa,CAAC;AAC/B,OAAO,MAAM,MAAM,eAAe,CAAC;AACnC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,kBAAwC,MAAM,kCAAkC,CAAC;AACxF,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAElD,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAoC/D,MAAM,iBAAiB,GAAG,CAAC,CAAC;AAE5B,IAAK,kBAOJ;AAPD,WAAK,kBAAkB;IACrB,0EAA0E;IAC1E,iEAA2C,CAAA;IAC3C,0EAA0E;IAC1E,qEAA+C,CAAA;IAC/C,uFAAuF;IACvF,iDAA2B,CAAA;AAC7B,CAAC,EAPI,kBAAkB,KAAlB,kBAAkB,QAOtB;AAED,MAAM,CAAC,OAAO,OAAO,oBAAqB,SAAQ,UAAU;IAW1D,YAAY,QAA6B,EAAY,SAA0B,EAAU,MAA6B;QACpH,KAAK,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;QADwB,cAAS,GAAT,SAAS,CAAiB;QAAU,WAAM,GAAN,MAAM,CAAuB;QAV9G,oBAAe,GAAoC,IAAI,CAAC;QAMhE,wDAAwD;QAChD,gBAAW,GAAmB,IAAI,CAAC;QACnC,eAAU,GAAkB,IAAI,CAAC;QAIvC,IAAI,CAAC,eAAe,GAAG,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,eAAe,KAAI,iBAAiB,CAAC;QAEpE,4CAA4C;QAC5C,IAAI,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,WAAW,EAAE,CAAC;YACxB,IAAI,CAAC,uBAAuB,GAAG,IAAI,CAAC,sBAAsB,EAAE,CAAC;YAC7D,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,uBAAuB,CAAC,CAAC;QACrD,CAAC;QAED,MAAM,cAAc,GAAG,CAAC,EAAE,MAAM,EAAE,EAAE,MAAM,EAAE,EAA+B,EAAE,EAAE;YAC7E,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;QACzB,CAAC,CAAC;QACF,MAAM,SAAS,GAAG,CAAC,EAAE,MAAM,EAA0B,EAAE,EAAE;YACvD,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;QACzB,CAAC,CAAC;QACF,MAAM,YAAY,GAAG,CAAC,EAAE,MAAM,EAA0B,EAAE,EAAE;YAC1D,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;QAC5B,CAAC,CAAC;QACF,MAAM,gBAAgB,GAAG,CAAC,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,EAAiC,EAAE,EAAE;YAClF,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;QAC1B,CAAC,CAAC;QACF,MAAM,cAAc,GAAG,CAAC,EAAE,MAAM,EAAmC,EAAE,EAAE;YACrE,MAAM,IAAI,GAAG,kBAAkB,CAAC,aAAa,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;YAC7D,MAAM,IAAI,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;YACpD,IAAI,IAAI,EAAE,CAAC;gBACT,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,EAAE;oBAC5C,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,IAAI;iBACrB,EAAE,IAAI,CAAC,CAAC;YACX,CAAC;QACH,CAAC,CAAC;QACF,IAAI,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,gBAAgB,CAAC,CAAC;QAC5D,QAAQ,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,IAAI,EAAE,CAAC;YACrB,KAAK,kBAAkB,CAAC,qBAAqB;gBAC3C,IAAI,CAAC,gBAAgB,CAAC,gBAAgB,EAAE,cAAc,CAAC,CAAC;gBACxD,IAAI,CAAC,gBAAgB,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;gBAC9C,MAAM;YACR,KAAK,kBAAkB,CAAC,WAAW;gBACjC,IAAI,CAAC,gBAAgB,CAAC,gBAAgB,EAAE,cAAc,CAAC,CAAC;gBACxD,IAAI,CAAC,gBAAgB,CAAC,WAAW,EAAE,YAAY,CAAC,CAAC;gBACjD,MAAM;YACR;gBACE,IAAI,CAAC,gBAAgB,CAAC,gBAAgB,EAAE,cAAc,CAAC,CAAC;gBACxD,MAAM;QACV,CAAC;IACH,CAAC;IAEO,KAAK,CAAC,SAAS,CAAC,MAAkB;QACxC,IAAI,QAAQ,GAAG,IAAI,CAAC,eAAe,CAAC;QACpC,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,IAAI,CAAC,UAAU,EAAE,CAAC;YAClB,IAAI,CAAC,YAAY,EAAE,CAAC;QACtB,CAAC;QAED,mEAAmE;QACnE,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,MAAM,OAAO,GAAG,IAAI,OAAO,CAAC,CAAC,OAAgB,EAAE,MAAc,EAAE,EAAE;gBAC/D,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC;gBAC3B,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;YAC3B,CAAC,CAAC,CAAC;YACH,IAAI,CAAC;gBACH,QAAQ,GAAG,MAAM,OAAO,CAAC;YAC3B,CAAC;YAAC,OAAO,CAAC,EAAE,CAAC;gBACX,OAAO;YACT,CAAC;QACH,CAAC;QAED,kBAAkB;QAClB,IAAI,CAAC,QAAQ,EAAE,CAAC,EAAE,EAAE,IAAmB,EAAE,EAAE;YACzC,MAAM,KAAK,GAAwB,EAAE,CAAC;YACtC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,EAAE;gBAC3B,iBAAiB;gBACjB,KAAK,CAAC,IAAI,GAAG,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC,CAAC;YACxJ,CAAC,CAAC,CAAC;YACH,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC;QAC7D,CAAC,CAAC,CAAC;IACL,CAAC;IAEO,SAAS,CAAC,GAAS;;QACzB,MAAM,OAAO,GAAG,EAAE,CAAC;QACnB,IAAI,CAAC,GAAG,EAAE,CAAC;YACT,OAAO,CAAC,CAAC;QACX,CAAC;QACD,IAAI,CAAC;YACH,MAAM,GAAG,GAAG,GAAG,CAAC,QAAQ,EAAE,CAAC;YAE3B,2EAA2E;YAC3E,IAAI,MAAA,IAAI,CAAC,MAAM,0CAAE,WAAW,EAAE,CAAC;gBAC7B,IAAI,CAAC,uBAAuB,CAAC,SAAS,GAAG,GAAG,CAAC;gBAC7C,OAAO,IAAI,CAAC,uBAAuB,CAAC,WAAW,GAAG,OAAO,GAAG,CAAC,CAAC;YAChE,CAAC;YACD,OAAO,GAAG,CAAC,MAAM,GAAG,IAAI,CAAC,eAAe,GAAG,OAAO,GAAG,CAAC,CAAC;QACzD,CAAC;QAAC,OAAO,CAAC,EAAE,CAAC;YACX,OAAO,CAAC,CAAC;QACX,CAAC;IACH,CAAC;IAEO,SAAS,CAAC,CAAY;QAC5B,IAAI,IAA8B,CAAC;QACnC,IAAI,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;YACxB,IAAI,GAAG,CAAC,CAAC,IAAI,CAAC;QAChB,CAAC;aAAM,CAAC;YACN,IAAI,GAAG,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC;QACpC,CAAC;QACD,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC,OAAO,EAAE,IAAmB,EAAE,EAAE;YAC1D,MAAM,KAAK,GAAwB,EAAE,CAAC;YAEtC,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,EAAE;gBACpB,iBAAiB;gBACjB,MAAM,IAAI,GAAG,MAAM,CACjB,IAAI,EACJ,CAAC,IAAwB,EAAE,KAAK,EAAE,EAAE;oBAClC,IAAI,OAAO,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,WAAW,EAAE,CAAC;wBAC7C,OAAO,IAAI,CAAC;oBACd,CAAC;oBACD,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,IAAI,CAAC,EAAE,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;gBAChE,CAAC,EACD,SAAS,CACV,CAAC;gBAEF,IAAI,IAAI,IAAI,KAAK,CAAC,IAAI,GAAG,IAAI,EAAE,CAAC;oBAC9B,KAAK,CAAC,IAAI,GAAG,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC;gBACzC,CAAC;YACH,CAAC,CAAC,CAAC;YAEH,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC;QAC7D,CAAC,CAAC,CAAC;IACL,CAAC;IAEO,YAAY,CAAC,CAAY;QAC/B,MAAM,KAAK,GAAsB,EAAE,CAAC;QACpC,IAAI,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;YACxB,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;QAC3D,CAAC;aAAM,CAAC;YACN,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;QACvB,CAAC;QACD,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC,OAAO,EAAE,IAAmB,EAAE,EAAE;YAC1D,MAAM,KAAK,GAAwB,EAAE,CAAC;YAEtC,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,EAAE;gBACpB,IAAI,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC;oBACtB,MAAM,IAAI,GAAG,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;oBACnD,IAAI,IAAI,EAAE,CAAC;wBACT,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC;oBAC5B,CAAC;gBACH,CAAC;YACH,CAAC,CAAC,CAAC;YACH,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC;QAC7D,CAAC,CAAC,CAAC;IACL,CAAC;IAEO,aAAa,CAAC,KAAa,EAAE,IAAmB;QACtD,MAAM,KAAK,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC;QAChD,IAAI,CAAC,KAAK,EAAE,CAAC;YACX,OAAO,CAAC,CAAC;QACX,CAAC;QACD,OAAO,MAAM,CACX,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,MAAM,EAC1B,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;YACP,MAAM,QAAQ,GAAG,MAAM,CACrB,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,EACpB,CAAC,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,EAAE;gBAChB,MAAM,IAAI,GAAG,aAAa,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;gBACvC,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,IAAI,CAAC,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAC/D,CAAC,EACD,CAAC,CACF,CAAC;YACF,OAAO,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC;QAC/B,CAAC,EACD,KAAK,CAAC,IAAI,IAAI,CAAC,CAChB,CAAC;IACJ,CAAC;IAEO,SAAS,CAAC,OAAoB;;QACpC,KAAK,IAAI,CAAC,IAAI,WAAW,EAAE,CAAC;YAC1B,MAAM,IAAI,GAAG,CAAkB,CAAC;YAChC,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;YAE3B,KAAK,IAAI,CAAC,IAAI,IAAI,EAAE,CAAC;gBACnB,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,KAAI,MAAA,IAAI,CAAC,MAAM,0CAAE,UAAU,CAAA,EAAE,CAAC;oBAChD,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC;wBAC1B,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC;oBAC5B,CAAC;oBACD,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC;wBAChC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC;oBAClC,CAAC;oBACD,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,mCACxB,IAAI,CAAC,CAAC,CAAC,KACV,KAAK,EAAE,QAAQ,CAAC,CAAC,EAAE,EAAE,CAAC,GACvB,CAAC;gBACJ,CAAC;YACH,CAAC;QACH,CAAC;QAED,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACrB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;YACvC,IAAI,CAAC,YAAY,EAAE,CAAC;QACtB,CAAC;IACH,CAAC;IAEO,YAAY;QAClB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QACxB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;IACzB,CAAC;IAEO,WAAW,CAAC,CAAY;QAC9B,OAAO,CAAC,CAAE,CAAgC,CAAC,IAAI,CAAC;IAClD,CAAC;IAEO,sBAAsB;QAC5B,MAAM,gBAAgB,GAAiC;YACrD,QAAQ,EAAE,UAAU;YACpB,QAAQ,EAAE,MAAM;YAChB,MAAM,EAAE,GAAG;YACX,KAAK,EAAE,GAAG;YACV,UAAU,EAAE,QAAQ;YACpB,GAAG,EAAE,GAAG;YACR,SAAS,EAAE,QAAQ;SACpB,CAAC;QAEF,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QACzC,KAAK,IAAI,CAAC,IAAI,gBAAgB,EAAE,CAAC;YAC/B,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,gBAAgB,CAAC,CAAC,CAAC,CAAC;QACpC,CAAC;QACD,EAAE,CAAC,SAAS,CAAC,GAAG,CAAC,qBAAqB,CAAC,CAAC;QACxC,OAAO,EAAE,CAAC;IACZ,CAAC;IAED,OAAO;;QACL,KAAK,CAAC,OAAO,EAAE,CAAC;QAChB,MAAA,IAAI,CAAC,uBAAuB,0CAAE,MAAM,EAAE,CAAC;IACzC,CAAC;CACF","sourcesContent":["/**\n * Plugin module for revo-grid grid system\n * Add support for automatic column resize\n */\nimport each from 'lodash/each';\nimport reduce from 'lodash/reduce';\nimport { BasePlugin } from './base.plugin';\nimport ColumnDataProvider, { ColumnCollection } from '../services/column.data.provider';\nimport { columnTypes } from '../store/storeTypes';\nimport { ColumnItems } from '../services/dimension.provider';\nimport { getSourceItem } from '../store/dataSource/data.store';\nimport { DimensionCols, DimensionRows } from '..';\nimport { ColumnRegular, DataType, InitialHeaderClick, ViewSettingSizeProp } from '..';\nimport { BeforeSaveDataDetails, BeforeRangeSaveDataDetails } from '..';\nimport { PluginProviders } from '../';\n\ninterface Column extends ColumnRegular {\n  index: number;\n}\n\ntype AutoSizeColumns = Record<DimensionCols, ColumnRecords>;\ntype ColumnRecords = Record<any, Column>;\ntype SourceSetEvent = { type: DimensionRows; source: DataType[] };\ntype EditEvent = BeforeSaveDataDetails | BeforeRangeSaveDataDetails;\ntype Resolve = (cols: Partial<AutoSizeColumns>) => void;\ntype Reject = () => void;\n\nexport type AutoSizeColumnConfig = {\n  // ui behavior mode\n  mode?: ColumnAutoSizeMode;\n  /**\n   * autoSize for all columns\n   * if allColumnes true all columns treated as autoSize, worse for performance\n   * false by default\n   */\n  allColumns?: boolean;\n  /**\n   * assumption per characted size\n   * by default defined as 8, can be changed in this config\n   */\n  letterBlockSize?: number;\n  /** make size calculation exact\n   * by default it based on assumption each character takes some space defined in letterBlockSize */\n  preciseSize?: boolean;\n};\n\nconst LETTER_BLOCK_SIZE = 7;\n\nenum ColumnAutoSizeMode {\n  // increases column width on header click according the largest text value\n  headerClickAutosize = 'headerClickAutoSize',\n  // increases column width on data set and text edit, decreases performance\n  autoSizeOnTextOverlap = 'autoSizeOnTextOverlap',\n  // increases and decreases column width based on all items sizes, worst for performance\n  autoSizeAll = 'autoSizeAll',\n}\n\nexport default class AutoSizeColumnPlugin extends BasePlugin {\n  private autoSizeColumns: Partial<AutoSizeColumns> | null = null;\n  private readonly letterBlockSize: number;\n\n  /** for config option when @preciseSize enabled */\n  private readonly precsizeCalculationArea: HTMLElement;\n\n  /** for edge case when no columns defined before data */\n  private dataResolve: Resolve | null = null;\n  private dataReject: Reject | null = null;\n\n  constructor(revogrid: HTMLRevoGridElement, protected providers: PluginProviders, private config?: AutoSizeColumnConfig) {\n    super(revogrid, providers);\n    this.letterBlockSize = config?.letterBlockSize || LETTER_BLOCK_SIZE;\n\n    // create test container to check text width\n    if (config?.preciseSize) {\n      this.precsizeCalculationArea = this.initiatePresizeElement();\n      revogrid.appendChild(this.precsizeCalculationArea);\n    }\n\n    const aftersourceset = ({ detail: { source } }: CustomEvent<SourceSetEvent>) => {\n      this.setSource(source);\n    };\n    const afteredit = ({ detail }: CustomEvent<EditEvent>) => {\n      this.afteredit(detail);\n    };\n    const afterEditAll = ({ detail }: CustomEvent<EditEvent>) => {\n      this.afterEditAll(detail);\n    };\n    const beforecolumnsset = ({ detail: { columns } }: CustomEvent<ColumnCollection>) => {\n      this.columnSet(columns);\n    };\n    const headerDblClick = ({ detail }: CustomEvent<InitialHeaderClick>) => {\n      const type = ColumnDataProvider.getColumnType(detail.column);\n      const size = this.getColumnSize(detail.index, type);\n      if (size) {\n        this.providers.dimension.setCustomSizes(type, {\n          [detail.index]: size,\n        }, true);\n      }\n    };\n    this.addEventListener('beforecolumnsset', beforecolumnsset);\n    switch (config?.mode) {\n      case ColumnAutoSizeMode.autoSizeOnTextOverlap:\n        this.addEventListener('aftersourceset', aftersourceset);\n        this.addEventListener('afteredit', afteredit);\n        break;\n      case ColumnAutoSizeMode.autoSizeAll:\n        this.addEventListener('aftersourceset', aftersourceset);\n        this.addEventListener('afteredit', afterEditAll);\n        break;\n      default:\n        this.addEventListener('headerdblclick', headerDblClick);\n        break;\n    }\n  }\n\n  private async setSource(source: DataType[]): Promise<void> {\n    let autoSize = this.autoSizeColumns;\n    if (this.dataReject) {\n      this.dataReject();\n      this.clearPromise();\n    }\n\n    /** If data set first and no column provided await until get one */\n    if (!autoSize) {\n      const request = new Promise((resolve: Resolve, reject: Reject) => {\n        this.dataResolve = resolve;\n        this.dataReject = reject;\n      });\n      try {\n        autoSize = await request;\n      } catch (e) {\n        return;\n      }\n    }\n\n    // calculate sizes\n    each(autoSize, (_v, type: DimensionCols) => {\n      const sizes: ViewSettingSizeProp = {};\n      each(autoSize[type], rgCol => {\n        // calculate size\n        rgCol.size = sizes[rgCol.index] = source.reduce((prev, rgRow) => Math.max(prev, this.getLength(rgRow[rgCol.prop])), this.getLength(rgCol.name || ''));\n      });\n      this.providers.dimension.setCustomSizes(type, sizes, true);\n    });\n  }\n\n  private getLength(len?: any): number {\n    const padding = 15;\n    if (!len) {\n      return 0;\n    }\n    try {\n      const str = len.toString();\n\n      /**if exact calculation required proxy with html element, slow operation */\n      if (this.config?.preciseSize) {\n        this.precsizeCalculationArea.innerText = str;\n        return this.precsizeCalculationArea.scrollWidth + padding * 2;\n      }\n      return str.length * this.letterBlockSize + padding * 2;\n    } catch (e) {\n      return 0;\n    }\n  }\n\n  private afteredit(e: EditEvent) {\n    let data: Record<string, DataType>;\n    if (this.isRangeEdit(e)) {\n      data = e.data;\n    } else {\n      data = { 0: { [e.prop]: e.val } };\n    }\n    each(this.autoSizeColumns, (columns, type: DimensionCols) => {\n      const sizes: ViewSettingSizeProp = {};\n\n      each(columns, rgCol => {\n        // calculate size\n        const size = reduce(\n          data,\n          (prev: number | undefined, rgRow) => {\n            if (typeof rgRow[rgCol.prop] === 'undefined') {\n              return prev;\n            }\n            return Math.max(prev || 0, this.getLength(rgRow[rgCol.prop]));\n          },\n          undefined,\n        );\n\n        if (size && rgCol.size < size) {\n          rgCol.size = sizes[rgCol.index] = size;\n        }\n      });\n\n      this.providers.dimension.setCustomSizes(type, sizes, true);\n    });\n  }\n\n  private afterEditAll(e: EditEvent) {\n    const props: Record<any, true> = {};\n    if (this.isRangeEdit(e)) {\n      each(e.data, r => each(r, (_v, p) => (props[p] = true)));\n    } else {\n      props[e.prop] = true;\n    }\n    each(this.autoSizeColumns, (columns, type: DimensionCols) => {\n      const sizes: ViewSettingSizeProp = {};\n\n      each(columns, rgCol => {\n        if (props[rgCol.prop]) {\n          const size = this.getColumnSize(rgCol.index, type);\n          if (size) {\n            sizes[rgCol.index] = size;\n          }\n        }\n      });\n      this.providers.dimension.setCustomSizes(type, sizes, true);\n    });\n  }\n\n  private getColumnSize(index: number, type: DimensionCols): number {\n    const rgCol = this.autoSizeColumns[type][index];\n    if (!rgCol) {\n      return 0;\n    }\n    return reduce(\n      this.providers.data.stores,\n      (r, s) => {\n        const perStore = reduce(\n          s.store.get('items'),\n          (prev, _row, i) => {\n            const item = getSourceItem(s.store, i);\n            return Math.max(prev || 0, this.getLength(item[rgCol.prop]));\n          },\n          0,\n        );\n        return Math.max(r, perStore);\n      },\n      rgCol.size || 0,\n    );\n  }\n\n  private columnSet(columns: ColumnItems) {\n    for (let t of columnTypes) {\n      const type = t as DimensionCols;\n      const cols = columns[type];\n\n      for (let i in cols) {\n        if (cols[i].autoSize || this.config?.allColumns) {\n          if (!this.autoSizeColumns) {\n            this.autoSizeColumns = {};\n          }\n          if (!this.autoSizeColumns[type]) {\n            this.autoSizeColumns[type] = {};\n          }\n          this.autoSizeColumns[type][i] = {\n            ...cols[i],\n            index: parseInt(i, 10),\n          };\n        }\n      }\n    }\n\n    if (this.dataResolve) {\n      this.dataResolve(this.autoSizeColumns);\n      this.clearPromise();\n    }\n  }\n\n  private clearPromise() {\n    this.dataResolve = null;\n    this.dataReject = null;\n  }\n\n  private isRangeEdit(e: EditEvent): e is BeforeRangeSaveDataDetails {\n    return !!(e as BeforeRangeSaveDataDetails).data;\n  }\n\n  private initiatePresizeElement(): HTMLElement {\n    const styleForFontTest: Partial<CSSStyleDeclaration> = {\n      position: 'absolute',\n      fontSize: '14px',\n      height: '0',\n      width: '0',\n      whiteSpace: 'nowrap',\n      top: '0',\n      overflowX: 'scroll',\n    };\n\n    const el = document.createElement('div');\n    for (let s in styleForFontTest) {\n      el.style[s] = styleForFontTest[s];\n    }\n    el.classList.add('revo-test-container');\n    return el;\n  }\n\n  destroy() {\n    super.destroy();\n    this.precsizeCalculationArea?.remove();\n  }\n}\n"]}

package/dist/collection/plugins/column.stretch.plugin.js

@@ -0,0 +1,96 @@
+/*!
+ * Built by Revolist OU ❤️
+ */
+import each from "lodash/each";
+import { calculateRowHeaderSize } from "../utils/row-header-utils";
+import { getScrollbarSize } from "../utils";
+import { BasePlugin } from "./base.plugin";
+export default class StretchColumn extends BasePlugin {
+    constructor(revogrid, providers) {
+        super(revogrid, providers);
+        this.providers = providers;
+        this.stretchedColumn = null;
+        // calculate scroll bar size for current user session
+        this.scrollSize = getScrollbarSize(document);
+        // subscribe to column changes
+        const beforecolumnapplied = ({ detail: { columns }, }) => this.applyStretch(columns);
+        this.addEventListener('beforecolumnapplied', beforecolumnapplied);
+    }
+    setScroll({ type, hasScroll }) {
+        var _a;
+        if (type === 'rgRow' &&
+            this.stretchedColumn &&
+            ((_a = this.stretchedColumn) === null || _a === void 0 ? void 0 : _a.initialSize) === this.stretchedColumn.size) {
+            if (hasScroll) {
+                this.stretchedColumn.size -= this.scrollSize;
+                this.apply();
+                this.dropChanges();
+            }
+        }
+    }
+    activateChanges() {
+        const setScroll = ({ detail }) => this.setScroll(detail);
+        this.addEventListener('scrollchange', setScroll);
+    }
+    dropChanges() {
+        this.stretchedColumn = null;
+        this.removeEventListener('scrollchange');
+    }
+    apply() {
+        if (!this.stretchedColumn) {
+            return;
+        }
+        const type = 'rgCol';
+        const sizes = this.providers.dimension.stores[type].store.get('sizes');
+        this.providers.dimension.setCustomSizes(type, Object.assign(Object.assign({}, sizes), { [this.stretchedColumn.index]: this.stretchedColumn.size }), true);
+    }
+    /**
+     * Apply stretch changes
+     */
+    applyStretch(columns) {
+        // unsubscribe from all events
+        this.dropChanges();
+        // calculate grid size
+        let sizeDifference = this.revogrid.clientWidth - 1;
+        each(columns, (_, type) => {
+            const realSize = this.providers.dimension.stores[type].store.get('realSize');
+            sizeDifference -= realSize;
+        });
+        if (this.revogrid.rowHeaders) {
+            const itemsLength = this.providers.data.stores.rgRow.store.get('source').length;
+            const header = this.revogrid.rowHeaders;
+            const rowHeaderSize = calculateRowHeaderSize(itemsLength, typeof header === 'object' ? header : undefined);
+            if (rowHeaderSize) {
+                sizeDifference -= rowHeaderSize;
+            }
+        }
+        if (sizeDifference > 0) {
+            // currently plugin accepts last column only
+            const index = columns.rgCol.length - 1;
+            const last = columns.rgCol[index];
+            /**
+             * has column
+             * no auto size applied
+             * size for column shouldn't be defined
+             */
+            const colSize = (last === null || last === void 0 ? void 0 : last.size) || this.revogrid.colSize || 0;
+            const size = sizeDifference + colSize - 1;
+            if (last && !last.autoSize && colSize < size) {
+                this.stretchedColumn = {
+                    initialSize: size,
+                    index,
+                    size,
+                };
+                this.apply();
+                this.activateChanges();
+            }
+        }
+    }
+}
+/**
+ * Check plugin type is Stretch
+ */
+export function isStretchPlugin(plugin) {
+    return !!plugin.applyStretch;
+}
+//# sourceMappingURL=column.stretch.plugin.js.map

package/dist/collection/plugins/column.stretch.plugin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"column.stretch.plugin.js","sourceRoot":"","sources":["../../src/plugins/column.stretch.plugin.ts"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,aAAa,CAAC;AAC/B,OAAO,EAAE,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AAGnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAoB3C,MAAM,CAAC,OAAO,OAAO,aAAc,SAAQ,UAAU;IAGnD,YACE,QAA6B,EACnB,SAA0B;QAEpC,KAAK,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;QAFjB,cAAS,GAAT,SAAS,CAAiB;QAJ9B,oBAAe,GAAyB,IAAI,CAAC;QAQnD,qDAAqD;QACrD,IAAI,CAAC,UAAU,GAAG,gBAAgB,CAAC,QAAQ,CAAC,CAAC;QAE7C,8BAA8B;QAC9B,MAAM,mBAAmB,GAAG,CAAC,EAC3B,MAAM,EAAE,EAAE,OAAO,EAAE,GACW,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;QAChE,IAAI,CAAC,gBAAgB,CAAC,qBAAqB,EAAE,mBAAmB,CAAC,CAAC;IACpE,CAAC;IAEO,SAAS,CAAC,EAAE,IAAI,EAAE,SAAS,EAAgB;;QACjD,IACE,IAAI,KAAK,OAAO;YAChB,IAAI,CAAC,eAAe;YACpB,CAAA,MAAA,IAAI,CAAC,eAAe,0CAAE,WAAW,MAAK,IAAI,CAAC,eAAe,CAAC,IAAI,EAC/D,CAAC;YACD,IAAI,SAAS,EAAE,CAAC;gBACd,IAAI,CAAC,eAAe,CAAC,IAAI,IAAI,IAAI,CAAC,UAAU,CAAC;gBAC7C,IAAI,CAAC,KAAK,EAAE,CAAC;gBACb,IAAI,CAAC,WAAW,EAAE,CAAC;YACrB,CAAC;QACH,CAAC;IACH,CAAC;IAEO,eAAe;QACrB,MAAM,SAAS,GAAG,CAAC,EAAE,MAAM,EAA6B,EAAE,EAAE,CAC1D,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;QACzB,IAAI,CAAC,gBAAgB,CAAC,cAAc,EAAE,SAAS,CAAC,CAAC;IACnD,CAAC;IAEO,WAAW;QACjB,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;QAC5B,IAAI,CAAC,mBAAmB,CAAC,cAAc,CAAC,CAAC;IAC3C,CAAC;IAEO,KAAK;QACX,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC;YAC1B,OAAO;QACT,CAAC;QACD,MAAM,IAAI,GAAkB,OAAO,CAAC;QACpC,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;QACvE,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,cAAc,CACrC,IAAI,kCAEC,KAAK,KACR,CAAC,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,KAEzD,IAAI,CACL,CAAC;IACJ,CAAC;IAED;;OAEG;IACH,YAAY,CAAC,OAAoB;QAC/B,8BAA8B;QAC9B,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,sBAAsB;QACtB,IAAI,cAAc,GAAG,IAAI,CAAC,QAAQ,CAAC,WAAW,GAAG,CAAC,CAAC;QACnD,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE,IAAmB,EAAE,EAAE;YACvC,MAAM,QAAQ,GACZ,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;YAC9D,cAAc,IAAI,QAAQ,CAAC;QAC7B,CAAC,CAAC,CAAC;QACH,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;YAC7B,MAAM,WAAW,GACf,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC;YAC9D,MAAM,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC;YACxC,MAAM,aAAa,GAAG,sBAAsB,CAC1C,WAAW,EACX,OAAO,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAChD,CAAC;YACF,IAAI,aAAa,EAAE,CAAC;gBAClB,cAAc,IAAI,aAAa,CAAC;YAClC,CAAC;QACH,CAAC;QACD,IAAI,cAAc,GAAG,CAAC,EAAE,CAAC;YACvB,4CAA4C;YAC5C,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;YACvC,MAAM,IAAI,GAAG,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YAClC;;;;eAIG;YACH,MAAM,OAAO,GAAG,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,IAAI,KAAI,IAAI,CAAC,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;YACzD,MAAM,IAAI,GAAG,cAAc,GAAG,OAAO,GAAG,CAAC,CAAC;YAE1C,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,OAAO,GAAG,IAAI,EAAE,CAAC;gBAC7C,IAAI,CAAC,eAAe,GAAG;oBACrB,WAAW,EAAE,IAAI;oBACjB,KAAK;oBACL,IAAI;iBACL,CAAC;gBACF,IAAI,CAAC,KAAK,EAAE,CAAC;gBACb,IAAI,CAAC,eAAe,EAAE,CAAC;YACzB,CAAC;QACH,CAAC;IACH,CAAC;CACF;AAED;;GAEG;AACH,MAAM,UAAU,eAAe,CAC7B,MAA2C;IAE3C,OAAO,CAAC,CAAE,MAAwB,CAAC,YAAY,CAAC;AAClD,CAAC","sourcesContent":["import each from 'lodash/each';\nimport { calculateRowHeaderSize } from '../utils/row-header-utils';\nimport { ColumnCollection } from '../services/column.data.provider';\nimport { ColumnItems } from '../services/dimension.provider';\nimport { getScrollbarSize } from '../utils';\nimport { BasePlugin } from './base.plugin';\nimport { DimensionCols, DimensionType } from '..';\nimport { PluginBaseComponent } from '../';\nimport { PluginProviders } from '../';\n\n/**\n * This plugin serves to recalculate columns initially\n * Base on empty space if there is any\n * Currently plugin supports only increasing last column\n */\ntype ScrollChange = {\n  type: DimensionType;\n  hasScroll: boolean;\n};\ntype StretchedData = {\n  initialSize: number;\n  size: number;\n  index: number;\n};\n\nexport default class StretchColumn extends BasePlugin {\n  private stretchedColumn: StretchedData | null = null;\n  private readonly scrollSize;\n  constructor(\n    revogrid: HTMLRevoGridElement,\n    protected providers: PluginProviders,\n  ) {\n    super(revogrid, providers);\n\n    // calculate scroll bar size for current user session\n    this.scrollSize = getScrollbarSize(document);\n\n    // subscribe to column changes\n    const beforecolumnapplied = ({\n      detail: { columns },\n    }: CustomEvent<ColumnCollection>) => this.applyStretch(columns);\n    this.addEventListener('beforecolumnapplied', beforecolumnapplied);\n  }\n\n  private setScroll({ type, hasScroll }: ScrollChange) {\n    if (\n      type === 'rgRow' &&\n      this.stretchedColumn &&\n      this.stretchedColumn?.initialSize === this.stretchedColumn.size\n    ) {\n      if (hasScroll) {\n        this.stretchedColumn.size -= this.scrollSize;\n        this.apply();\n        this.dropChanges();\n      }\n    }\n  }\n\n  private activateChanges() {\n    const setScroll = ({ detail }: CustomEvent<ScrollChange>) =>\n      this.setScroll(detail);\n    this.addEventListener('scrollchange', setScroll);\n  }\n\n  private dropChanges() {\n    this.stretchedColumn = null;\n    this.removeEventListener('scrollchange');\n  }\n\n  private apply() {\n    if (!this.stretchedColumn) {\n      return;\n    }\n    const type: DimensionCols = 'rgCol';\n    const sizes = this.providers.dimension.stores[type].store.get('sizes');\n    this.providers.dimension.setCustomSizes(\n      type,\n      {\n        ...sizes,\n        [this.stretchedColumn.index]: this.stretchedColumn.size,\n      },\n      true,\n    );\n  }\n\n  /**\n   * Apply stretch changes\n   */\n  applyStretch(columns: ColumnItems) {\n    // unsubscribe from all events\n    this.dropChanges();\n    // calculate grid size\n    let sizeDifference = this.revogrid.clientWidth - 1;\n    each(columns, (_, type: DimensionCols) => {\n      const realSize =\n        this.providers.dimension.stores[type].store.get('realSize');\n      sizeDifference -= realSize;\n    });\n    if (this.revogrid.rowHeaders) {\n      const itemsLength =\n        this.providers.data.stores.rgRow.store.get('source').length;\n      const header = this.revogrid.rowHeaders;\n      const rowHeaderSize = calculateRowHeaderSize(\n        itemsLength,\n        typeof header === 'object' ? header : undefined,\n      );\n      if (rowHeaderSize) {\n        sizeDifference -= rowHeaderSize;\n      }\n    }\n    if (sizeDifference > 0) {\n      // currently plugin accepts last column only\n      const index = columns.rgCol.length - 1;\n      const last = columns.rgCol[index];\n      /**\n       * has column\n       * no auto size applied\n       * size for column shouldn't be defined\n       */\n      const colSize = last?.size || this.revogrid.colSize || 0;\n      const size = sizeDifference + colSize - 1;\n\n      if (last && !last.autoSize && colSize < size) {\n        this.stretchedColumn = {\n          initialSize: size,\n          index,\n          size,\n        };\n        this.apply();\n        this.activateChanges();\n      }\n    }\n  }\n}\n\n/**\n * Check plugin type is Stretch\n */\nexport function isStretchPlugin(\n  plugin: PluginBaseComponent | StretchColumn,\n): plugin is StretchColumn {\n  return !!(plugin as StretchColumn).applyStretch;\n}\n"]}

package/dist/collection/plugins/dispatcher.js

@@ -0,0 +1,27 @@
+/*!
+ * Built by Revolist OU ❤️
+ */
+/**
+ * Dispatch custom event to element
+ */
+export function dispatch(target, eventName, detail) {
+    const event = new CustomEvent(eventName, {
+        detail,
+        cancelable: true,
+        bubbles: true,
+    });
+    target === null || target === void 0 ? void 0 : target.dispatchEvent(event);
+    return event;
+}
+export function dispatchByEvent(e, eventName, detail) {
+    e.preventDefault();
+    return dispatch(e.target, eventName, detail);
+}
+/**
+ * Dispatch event by other event target
+ */
+export function dispatchOnEvent(e, eventName, detail) {
+    e.preventDefault();
+    return dispatch(e.target, eventName, detail);
+}
+//# sourceMappingURL=dispatcher.js.map

package/dist/collection/plugins/dispatcher.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dispatcher.js","sourceRoot":"","sources":["../../src/plugins/dispatcher.ts"],"names":[],"mappings":"AASA;;GAEG;AACH,MAAM,UAAU,QAAQ,CACtB,MAAc,EACd,SAAiB,EACjB,MAAuB;IAEvB,MAAM,KAAK,GAAG,IAAI,WAAW,CAAC,SAAS,EAAE;QACvC,MAAM;QACN,UAAU,EAAE,IAAI;QAChB,OAAO,EAAE,IAAI;KACd,CAAC,CAAC;IACH,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAC7B,OAAO,KAAK,CAAC;AACf,CAAC;AACD,MAAM,UAAU,eAAe,CAC7B,CAAQ,EACR,SAAiB,EACjB,MAAsB;IAEtB,CAAC,CAAC,cAAc,EAAE,CAAC;IACnB,OAAO,QAAQ,CAAC,CAAC,CAAC,MAAgB,EAAE,SAAS,EAAE,MAAM,CAAC,CAAC;AACzD,CAAC;AACD;;GAEG;AACH,MAAM,UAAU,eAAe,CAC3B,CAA2B,EAC3B,SAAiB,EACjB,MAAY;IAEZ,CAAC,CAAC,cAAc,EAAE,CAAC;IACnB,OAAO,QAAQ,CAAC,CAAC,CAAC,MAAgB,EAAE,SAAS,EAAE,MAAM,CAAC,CAAC;AAC3D,CAAC","sourcesContent":["export type Target = HTMLElement | Element | null;\n\nexport type DispatchDetail = any;\ntype Event = {\n  target: HTMLElement | null;\n  preventDefault(): void;\n};\n\n\n/**\n * Dispatch custom event to element\n */\nexport function dispatch(\n  target: Target,\n  eventName: string,\n  detail?: DispatchDetail,\n): CustomEvent {\n  const event = new CustomEvent(eventName, {\n    detail,\n    cancelable: true,\n    bubbles: true,\n  });\n  target?.dispatchEvent(event);\n  return event;\n}\nexport function dispatchByEvent(\n  e: Event,\n  eventName: string,\n  detail: DispatchDetail,\n): CustomEvent {\n  e.preventDefault();\n  return dispatch(e.target as Target, eventName, detail);\n}\n/**\n * Dispatch event by other event target\n */\nexport function dispatchOnEvent(\n    e: MouseEvent | CustomEvent,\n    eventName: string,\n    detail?: any\n  ): CustomEvent {\n    e.preventDefault();\n    return dispatch(e.target as Target, eventName, detail);\n}\n"]}

package/dist/collection/plugins/export/csv.js

@@ -1,12 +1,15 @@
-import { getGroupingName, isGrouping } from '../groupingRow/grouping.service';
+/*!
+ * Built by Revolist OU ❤️
+ */
+import { getGroupingName, isGrouping } from "../groupingRow/grouping.service";
 const INITIAL = {
-  mime: 'text/csv',
-  fileKind: 'csv',
-  // BOM signature
-  bom: true,
-  columnDelimiter: ',',
-  rowDelimiter: '\r\n',
-  encoding: '',
+    mime: 'text/csv',
+    fileKind: 'csv',
+    // BOM signature
+    bom: true,
+    columnDelimiter: ',',
+    rowDelimiter: '\r\n',
+    encoding: '',
 };
 // The ASCII character code 13 is called a Carriage Return or CR.
 const CARRIAGE_RETURN = String.fromCharCode(13);
@@ -16,53 +19,54 @@ const DOUBLE_QT = String.fromCharCode(34);
 const NO_BREAK_SPACE = String.fromCharCode(0xfeff);
 const escapeRegex = new RegExp('"', 'g');
 export default class ExportCsv {
-  constructor(options = {}) {
-    this.options = Object.assign(Object.assign({}, INITIAL), options);
-  }
-  doExport({ data, headers, props }) {
-    let result = this.options.bom ? NO_BREAK_SPACE : '';
-    // any header
-    if ((headers === null || headers === void 0 ? void 0 : headers.length) > 0) {
-      headers.forEach(header => {
-        // ignore empty
-        if (!header.length) {
-          return;
-        }
-        result += this.prepareHeader(header, this.options.columnDelimiter);
-        result += this.options.rowDelimiter;
-      });
+    constructor(options = {}) {
+        this.options = Object.assign(Object.assign({}, INITIAL), options);
     }
-    data.forEach((rgRow, index) => {
-      if (index > 0) {
-        result += this.options.rowDelimiter;
-      }
-      // support grouping
-      if (isGrouping(rgRow)) {
-        result += this.parseCell(getGroupingName(rgRow), this.options.columnDelimiter);
-        return;
-      }
-      result += props.map(p => this.parseCell(rgRow[p], this.options.columnDelimiter)).join(this.options.columnDelimiter);
-    });
-    return result;
-  }
-  prepareHeader(columnHeaders, columnDelimiter) {
-    let result = '';
-    const newColumnHeaders = columnHeaders.map(v => this.parseCell(v, columnDelimiter, true));
-    result += newColumnHeaders.join(columnDelimiter);
-    return result;
-  }
-  parseCell(value, columnDelimiter, force = false) {
-    let escape = value;
-    if (typeof value !== 'string') {
-      escape = JSON.stringify(value);
+    doExport({ data, headers, props }) {
+        let result = this.options.bom ? NO_BREAK_SPACE : '';
+        // any header
+        if ((headers === null || headers === void 0 ? void 0 : headers.length) > 0) {
+            headers.forEach(header => {
+                // ignore empty
+                if (!header.length) {
+                    return;
+                }
+                result += this.prepareHeader(header, this.options.columnDelimiter);
+                result += this.options.rowDelimiter;
+            });
+        }
+        data.forEach((rgRow, index) => {
+            if (index > 0) {
+                result += this.options.rowDelimiter;
+            }
+            // support grouping
+            if (isGrouping(rgRow)) {
+                result += this.parseCell(getGroupingName(rgRow), this.options.columnDelimiter);
+                return;
+            }
+            result += props.map(p => this.parseCell(rgRow[p], this.options.columnDelimiter)).join(this.options.columnDelimiter);
+        });
+        return result;
     }
-    const toEscape = [CARRIAGE_RETURN, DOUBLE_QT, LINE_FEED, columnDelimiter];
-    if (typeof escape === 'undefined') {
-      return '';
+    prepareHeader(columnHeaders, columnDelimiter) {
+        let result = '';
+        const newColumnHeaders = columnHeaders.map(v => this.parseCell(v, columnDelimiter, true));
+        result += newColumnHeaders.join(columnDelimiter);
+        return result;
     }
-    if (escape !== '' && (force || toEscape.some(i => escape.indexOf(i) >= 0))) {
-      return `"${escape.replace(escapeRegex, '""')}"`;
+    parseCell(value, columnDelimiter, force = false) {
+        let escape = value;
+        if (typeof value !== 'string') {
+            escape = JSON.stringify(value);
+        }
+        const toEscape = [CARRIAGE_RETURN, DOUBLE_QT, LINE_FEED, columnDelimiter];
+        if (typeof escape === 'undefined') {
+            return '';
+        }
+        if (escape !== '' && (force || toEscape.some(i => escape.indexOf(i) >= 0))) {
+            return `"${escape.replace(escapeRegex, '""')}"`;
+        }
+        return escape;
     }
-    return escape;
-  }
 }
+//# sourceMappingURL=csv.js.map

package/dist/collection/plugins/export/csv.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"csv.js","sourceRoot":"","sources":["../../../src/plugins/export/csv.ts"],"names":[],"mappings":"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","sourcesContent":["import { getGroupingName, isGrouping } from '../groupingRow/grouping.service';\nimport { CSVFormat, DataInput, Formatter } from './types';\n\nconst INITIAL: CSVFormat = {\n  mime: 'text/csv',\n  fileKind: 'csv',\n  // BOM signature\n  bom: true,\n  columnDelimiter: ',',\n  rowDelimiter: '\\r\\n',\n  encoding: '',\n};\n\nexport type CSVFormatter = (options: Partial<CSVFormat>, data: DataInput) => string;\n\n// The ASCII character code 13 is called a Carriage Return or CR.\nconst CARRIAGE_RETURN = String.fromCharCode(13);\n// Chr(13) followed by a Chr(10) that compose a proper CRLF.\nconst LINE_FEED = String.fromCharCode(10);\nconst DOUBLE_QT = String.fromCharCode(34);\nconst NO_BREAK_SPACE = String.fromCharCode(0xfeff);\nconst escapeRegex = new RegExp('\"', 'g');\n\nexport default class ExportCsv implements Formatter {\n  readonly options: Readonly<CSVFormat>;\n  constructor(options: Partial<CSVFormat> = {}) {\n    this.options = { ...INITIAL, ...options };\n  }\n\n  doExport({ data, headers, props }: DataInput) {\n    let result = this.options.bom ? NO_BREAK_SPACE : '';\n\n    // any header\n    if (headers?.length > 0) {\n      headers.forEach(header => {\n        // ignore empty\n        if (!header.length) {\n          return;\n        }\n        result += this.prepareHeader(header, this.options.columnDelimiter);\n        result += this.options.rowDelimiter;\n      });\n    }\n\n    data.forEach((rgRow, index) => {\n      if (index > 0) {\n        result += this.options.rowDelimiter;\n      }\n      // support grouping\n      if (isGrouping(rgRow)) {\n        result += this.parseCell(getGroupingName(rgRow), this.options.columnDelimiter);\n        return;\n      }\n      result += props.map(p => this.parseCell(rgRow[p], this.options.columnDelimiter)).join(this.options.columnDelimiter);\n    });\n\n    return result;\n  }\n\n  private prepareHeader(columnHeaders: string[], columnDelimiter: string) {\n    let result = '';\n    const newColumnHeaders = columnHeaders.map(v => this.parseCell(v, columnDelimiter, true));\n    result += newColumnHeaders.join(columnDelimiter);\n    return result;\n  }\n\n  private parseCell(value: any, columnDelimiter: string, force = false) {\n    let escape = value;\n    if (typeof value !== 'string') {\n      escape = JSON.stringify(value);\n    }\n    const toEscape = [CARRIAGE_RETURN, DOUBLE_QT, LINE_FEED, columnDelimiter];\n    if (typeof escape === 'undefined') {\n      return '';\n    }\n    if (escape !== '' && (force || toEscape.some(i => escape.indexOf(i) >= 0))) {\n      return `\"${escape.replace(escapeRegex, '\"\"')}\"`;\n    }\n\n    return escape;\n  }\n}\n"]}