balala-revogrid 1.0.0

package/dist/collection/plugins/manual-focus.plugin.js

@@ -0,0 +1,353 @@
+/*!
+ * Built by Revolist OU ❤️
+ */
+import { BasePlugin } from "./base.plugin";
+/**
+ * Manual Focus Plugin
+ * 提供手动控制的单元格焦点框功能
+ *
+ * 功能：
+ * 1. 提供 show/hide API 控制焦点框显示
+ * 2. 在指定单元格上显示焦点框
+ * 3. 支持手动切换焦点框显示状态
+ * 4. 支持自定义边框颜色和粗细
+ * 5. 焦点框显示时禁止表格滚动
+ */
+export class ManualFocusPlugin extends BasePlugin {
+    constructor(revogrid, providers, options = {}) {
+        var _a;
+        super(revogrid, providers);
+        this.focusElement = null;
+        this.isVisible = false;
+        this.currentCell = null;
+        this.scrollPreventHandlers = [];
+        this.afterFocusHandler = null;
+        this.hideBorder = false;
+        this.customSize = null;
+        this.options = {
+            borderColor: options.borderColor || '#1D74F5',
+            borderWidth: options.borderWidth || 2,
+            disableScroll: (_a = options.disableScroll) !== null && _a !== void 0 ? _a : false,
+        };
+        // 监听 afterfocus 事件
+        this.afterFocusHandler = (e) => {
+            const detail = e.detail;
+            // 检查是否是当前要显示焦点的单元格
+            if (this.currentCell &&
+                detail.rowIndex === this.currentCell.y &&
+                detail.colIndex === this.currentCell.x &&
+                detail.rowType === this.currentCell.rowType &&
+                detail.colType === this.currentCell.colType) {
+                // 延迟一帧，确保 DOM 更新完成
+                requestAnimationFrame(() => {
+                    this.isVisible = true;
+                    this.updateFocusBox();
+                    if (this.options.disableScroll) {
+                        this.disableScroll();
+                    }
+                });
+            }
+        };
+        this.revogrid.addEventListener('afterfocus', this.afterFocusHandler);
+    }
+    /**
+     * 设置焦点到指定单元格
+     * @param rowIndex 行索引
+     * @param colIndex 列索引
+     * @param rowType 行类型，默认 'rgRow'
+     * @param colType 列类型，默认 'rgCol'
+     * @param hideBorder 是否隐藏边框（设置 opacity: 0），默认 false
+     * @param customSize 自定义尺寸 { width?: number, height?: number }
+     */
+    async setFocusAt(rowIndex, colIndex, rowType = 'rgRow', colType = 'rgCol', hideBorder = false, customSize) {
+        var _a;
+        // 先移除旧的焦点框
+        this.removeFocusBox();
+        this.isVisible = false;
+        this.currentCell = {
+            x: colIndex,
+            y: rowIndex,
+            rowType,
+            colType,
+        };
+        // 保存 hideBorder 状态
+        this.hideBorder = hideBorder;
+        // 保存自定义尺寸
+        this.customSize = customSize || null;
+        // 先设置表格的焦点，让 revogr-focus 渲染出来
+        const rowTypeIndex = this.providers.selection.storesByType[rowType];
+        const colTypeIndex = this.providers.selection.storesByType[colType];
+        if (rowTypeIndex !== undefined && colTypeIndex !== undefined) {
+            const store = (_a = this.providers.selection.stores[rowTypeIndex]) === null || _a === void 0 ? void 0 : _a[colTypeIndex];
+            if (store) {
+                store.setFocus({ x: colIndex, y: rowIndex }, { x: colIndex, y: rowIndex });
+            }
+        }
+        // afterfocus 事件会触发 updateFocusBox
+        // 如果 50ms 内没有触发，则强制显示
+        setTimeout(() => {
+            if (this.currentCell && !this.isVisible) {
+                this.show();
+            }
+        }, 50);
+    }
+    /**
+     * 移除指定单元格的焦点
+     */
+    removeFocusAt(rowIndex, colIndex, rowType = 'rgRow', colType = 'rgCol') {
+        // 检查是否是当前焦点单元格
+        const isSameCell = this.currentCell &&
+            this.currentCell.x === colIndex &&
+            this.currentCell.y === rowIndex &&
+            this.currentCell.rowType === rowType &&
+            this.currentCell.colType === colType;
+        if (isSameCell) {
+            this.hide();
+        }
+    }
+    /**
+     * 切换指定单元格的焦点显示状态
+     * @param rowIndex 行索引
+     * @param colIndex 列索引
+     * @param rowType 行类型，默认 'rgRow'
+     * @param colType 列类型，默认 'rgCol'
+     * @param hideBorder 是否隐藏边框（设置 opacity: 0），默认 false
+     * @param customSize 自定义尺寸 { width?: number, height?: number }
+     */
+    toggleFocusAt(rowIndex, colIndex, rowType = 'rgRow', colType = 'rgCol', hideBorder = false, customSize) {
+        // 检查是否是同一个单元格
+        const isSameCell = this.currentCell &&
+            this.currentCell.x === colIndex &&
+            this.currentCell.y === rowIndex &&
+            this.currentCell.rowType === rowType &&
+            this.currentCell.colType === colType;
+        if (isSameCell && this.isVisible) {
+            // 如果是同一个单元格且已显示，则移除
+            this.hide();
+        }
+        else {
+            // 否则设置焦点
+            this.setFocusAt(rowIndex, colIndex, rowType, colType, hideBorder, customSize);
+        }
+    }
+    /**
+     * 显示焦点框
+     */
+    show() {
+        this.isVisible = true;
+        if (this.currentCell) {
+            this.updateFocusBox();
+            if (this.options.disableScroll) {
+                this.disableScroll();
+            }
+        }
+    }
+    /**
+     * 隐藏焦点框
+     */
+    hide() {
+        this.isVisible = false;
+        this.removeFocusBox();
+        this.currentCell = null; // 清除当前单元格，防止自动重新显示
+        this.customSize = null; // 清除自定义尺寸
+        if (this.options.disableScroll) {
+            this.enableScroll();
+        }
+    }
+    /**
+     * 切换焦点框显示状态
+     */
+    toggle() {
+        // 如果已经显示，检查是否是同一个单元格
+        if (this.isVisible && this.currentCell) {
+            // 不隐藏，保持显示状态
+            this.show();
+        }
+        else {
+            this.show();
+        }
+    }
+    /**
+     * 获取当前焦点框显示状态
+     */
+    isShown() {
+        return this.isVisible;
+    }
+    /**
+     * 动态修改焦点框的宽高
+     * @param width 新的宽度（像素值）
+     * @param height 新的高度（像素值）
+     */
+    updateSize(width, height) {
+        if (!this.focusElement) {
+            console.warn('⚠️ 焦点框不存在，无法修改尺寸');
+            return;
+        }
+        this.focusElement.style.width = `${width}px`;
+        this.focusElement.style.height = `${height}px`;
+        console.log('✅ 焦点框尺寸已更新:', { width: `${width}px`, height: `${height}px` });
+    }
+    /**
+     * 设置边框的显示/隐藏状态
+     * @param hide 是否隐藏边框（设置 opacity: 0）
+     */
+    setBorderVisibility(hide) {
+        this.hideBorder = hide;
+        if (this.focusElement) {
+            this.focusElement.style.opacity = hide ? '0' : '1';
+            console.log(`✅ 焦点框边框已${hide ? '隐藏' : '显示'}`);
+        }
+        else {
+            console.warn('⚠️ 焦点框不存在');
+        }
+    }
+    /**
+     * 更新焦点框位置和样式
+     */
+    updateFocusBox() {
+        var _a, _b, _c, _d;
+        if (!this.currentCell) {
+            return;
+        }
+        const { rowType, colType, x } = this.currentCell;
+        // 查找匹配的 revogr-focus 元素
+        const allFocusElements = this.revogrid.querySelectorAll('revogr-focus.focused-cell');
+        let focusElement = null;
+        allFocusElements.forEach(el => {
+            const elRowType = el.getAttribute('row-type');
+            const elColType = el.getAttribute('col-type');
+            if (elRowType === rowType && elColType === colType) {
+                focusElement = el;
+            }
+        });
+        if (!focusElement) {
+            return;
+        }
+        // 移除旧的焦点框
+        this.removeFocusBox();
+        // 使用 getBoundingClientRect 获取 revogr-focus 的绝对位置
+        const rect = focusElement.getBoundingClientRect();
+        // 创建新的焦点框
+        this.focusElement = document.createElement('div');
+        this.focusElement.className = 'manual-focus-box';
+        const { borderColor, borderWidth } = this.options;
+        const w = borderWidth;
+        const opacity = this.hideBorder ? 0 : 1;
+        // 表格边框宽度（通过 box-shadow inset 实现）
+        const cellAdditional = 1;
+        const columnCount = this.providers.column.getColumns(colType).length;
+        const isLastColumn = columnCount > 0 && x === columnCount - 1;
+        const widthAdditional = isLastColumn ? 0 : cellAdditional;
+        // 使用自定义尺寸或默认尺寸，并扩展以覆盖边框
+        const finalWidth = ((_b = (_a = this.customSize) === null || _a === void 0 ? void 0 : _a.width) !== null && _b !== void 0 ? _b : rect.width) + widthAdditional;
+        const finalHeight = ((_d = (_c = this.customSize) === null || _c === void 0 ? void 0 : _c.height) !== null && _d !== void 0 ? _d : rect.height) + cellAdditional;
+        this.focusElement.style.cssText = `
+      position: fixed;
+      pointer-events: none;
+      z-index: 2000;
+      display: block;
+      border: ${w}px solid ${borderColor};
+      box-sizing: border-box;
+      opacity: ${opacity};
+      left: ${rect.left}px;
+      top: ${rect.top - cellAdditional}px;
+      width: ${finalWidth}px;
+      height: ${finalHeight}px;
+    `;
+        // 添加到 body 下
+        document.body.appendChild(this.focusElement);
+    }
+    /**
+     * 移除焦点框
+     */
+    removeFocusBox() {
+        if (this.focusElement && this.focusElement.parentNode) {
+            this.focusElement.parentNode.removeChild(this.focusElement);
+            this.focusElement = null;
+        }
+    }
+    /**
+     * 清除所有焦点框
+     */
+    clearAll() {
+        this.hide();
+        this.currentCell = null;
+        this.customSize = null;
+        // 触发清除事件
+        this.revogrid.dispatchEvent(new CustomEvent('manualfocuscleared', {
+            bubbles: true,
+            detail: {},
+        }));
+    }
+    /**
+     * 禁止表格滚动
+     */
+    disableScroll() {
+        // 阻止所有滚动相关的事件
+        const preventScroll = (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+        };
+        // 查找所有可能触发滚动的元素
+        const scrollElements = [
+            ...Array.from(this.revogrid.querySelectorAll('revogr-viewport-scroll')),
+            ...Array.from(this.revogrid.querySelectorAll('revogr-scroll-virtual')),
+            ...Array.from(this.revogrid.querySelectorAll('[class*="scroll"]')),
+        ];
+        // 为每个滚动元素添加事件监听
+        scrollElements.forEach(el => {
+            const handler = (e) => preventScroll(e);
+            this.scrollPreventHandlers.push(handler);
+            el.addEventListener('wheel', handler, { passive: false, capture: true });
+            el.addEventListener('scroll', handler, { passive: false, capture: true });
+            el.addEventListener('touchmove', handler, { passive: false, capture: true });
+            // 禁用自定义滚动条的指针事件
+            el.style.pointerEvents = 'none';
+        });
+        // 同时在 revogrid 根元素上添加监听
+        const rootHandler = (e) => preventScroll(e);
+        this.scrollPreventHandlers.push(rootHandler);
+        this.revogrid.addEventListener('wheel', rootHandler, { passive: false, capture: true });
+        this.revogrid.addEventListener('scroll', rootHandler, { passive: false, capture: true });
+        this.revogrid.addEventListener('touchmove', rootHandler, { passive: false, capture: true });
+    }
+    /**
+     * 恢复表格滚动
+     */
+    enableScroll() {
+        // 移除所有滚动阻止事件监听
+        const scrollElements = [
+            ...Array.from(this.revogrid.querySelectorAll('revogr-viewport-scroll')),
+            ...Array.from(this.revogrid.querySelectorAll('revogr-scroll-virtual')),
+            ...Array.from(this.revogrid.querySelectorAll('[class*="scroll"]')),
+            this.revogrid,
+        ];
+        scrollElements.forEach(el => {
+            this.scrollPreventHandlers.forEach(handler => {
+                el.removeEventListener('wheel', handler, { capture: true });
+                el.removeEventListener('scroll', handler, { capture: true });
+                el.removeEventListener('touchmove', handler, { capture: true });
+            });
+            // 恢复自定义滚动条的指针事件
+            if (el !== this.revogrid) {
+                el.style.pointerEvents = '';
+            }
+        });
+        this.scrollPreventHandlers = [];
+    }
+    /**
+     * 清理插件资源
+     */
+    destroy() {
+        this.enableScroll();
+        this.removeFocusBox();
+        this.currentCell = null;
+        // 移除 afterfocus 事件监听
+        if (this.afterFocusHandler) {
+            this.revogrid.removeEventListener('afterfocus', this.afterFocusHandler);
+            this.afterFocusHandler = null;
+        }
+        super.destroy();
+    }
+}
+//# sourceMappingURL=manual-focus.plugin.js.map

package/dist/collection/plugins/manual-focus.plugin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"manual-focus.plugin.js","sourceRoot":"","sources":["../../src/plugins/manual-focus.plugin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAmB3C;;;;;;;;;;GAUG;AACH,MAAM,OAAO,iBAAkB,SAAQ,UAAU;IAU/C,YAAY,QAA6B,EAAE,SAA0B,EAAE,UAA8B,EAAE;;QACrG,KAAK,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;QAVrB,iBAAY,GAAuB,IAAI,CAAC;QACxC,cAAS,GAAY,KAAK,CAAC;QAC3B,gBAAW,GAAsE,IAAI,CAAC;QAEtF,0BAAqB,GAA8B,EAAE,CAAC;QACtD,sBAAiB,GAAsC,IAAI,CAAC;QAC5D,eAAU,GAAY,KAAK,CAAC;QAC5B,eAAU,GAAsB,IAAI,CAAC;QAI3C,IAAI,CAAC,OAAO,GAAG;YACb,WAAW,EAAE,OAAO,CAAC,WAAW,IAAI,SAAS;YAC7C,WAAW,EAAE,OAAO,CAAC,WAAW,IAAI,CAAC;YACrC,aAAa,EAAE,MAAA,OAAO,CAAC,aAAa,mCAAI,KAAK;SAC9C,CAAC;QAEF,mBAAmB;QACnB,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAc,EAAE,EAAE;YAC1C,MAAM,MAAM,GAAG,CAAC,CAAC,MAAM,CAAC;YACxB,mBAAmB;YACnB,IACE,IAAI,CAAC,WAAW;gBAChB,MAAM,CAAC,QAAQ,KAAK,IAAI,CAAC,WAAW,CAAC,CAAC;gBACtC,MAAM,CAAC,QAAQ,KAAK,IAAI,CAAC,WAAW,CAAC,CAAC;gBACtC,MAAM,CAAC,OAAO,KAAK,IAAI,CAAC,WAAW,CAAC,OAAO;gBAC3C,MAAM,CAAC,OAAO,KAAK,IAAI,CAAC,WAAW,CAAC,OAAO,EAC3C,CAAC;gBACD,mBAAmB;gBACnB,qBAAqB,CAAC,GAAG,EAAE;oBACzB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;oBACtB,IAAI,CAAC,cAAc,EAAE,CAAC;oBACtB,IAAI,IAAI,CAAC,OAAO,CAAC,aAAa,EAAE,CAAC;wBAC/B,IAAI,CAAC,aAAa,EAAE,CAAC;oBACvB,CAAC;gBACH,CAAC,CAAC,CAAC;YACL,CAAC;QACH,CAAC,CAAC;QACF,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,iBAAwB,CAAC,CAAC;IAC9E,CAAC;IAED;;;;;;;;OAQG;IACH,KAAK,CAAC,UAAU,CAAC,QAAgB,EAAE,QAAgB,EAAE,UAAkB,OAAO,EAAE,UAAkB,OAAO,EAAE,aAAsB,KAAK,EAAE,UAAuB;;QAC7J,WAAW;QACX,IAAI,CAAC,cAAc,EAAE,CAAC;QACtB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;QAEvB,IAAI,CAAC,WAAW,GAAG;YACjB,CAAC,EAAE,QAAQ;YACX,CAAC,EAAE,QAAQ;YACX,OAAO;YACP,OAAO;SACR,CAAC;QAEF,mBAAmB;QACnB,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC;QAE7B,UAAU;QACV,IAAI,CAAC,UAAU,GAAG,UAAU,IAAI,IAAI,CAAC;QAErC,+BAA+B;QAC/B,MAAM,YAAY,GAAwB,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,YAAoB,CAAC,OAAO,CAAC,CAAC;QACjG,MAAM,YAAY,GAAwB,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,YAAoB,CAAC,OAAO,CAAC,CAAC;QAEjG,IAAI,YAAY,KAAK,SAAS,IAAI,YAAY,KAAK,SAAS,EAAE,CAAC;YAC7D,MAAM,KAAK,GAAG,MAAA,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,MAAM,CAAC,YAAY,CAAC,0CAAG,YAAY,CAAC,CAAC;YAC5E,IAAI,KAAK,EAAE,CAAC;gBACV,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC;YAC7E,CAAC;QACH,CAAC;QAED,kCAAkC;QAClC,sBAAsB;QACtB,UAAU,CAAC,GAAG,EAAE;YACd,IAAI,IAAI,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC;gBACxC,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,CAAC;QACH,CAAC,EAAE,EAAE,CAAC,CAAC;IACT,CAAC;IAED;;OAEG;IACH,aAAa,CAAC,QAAgB,EAAE,QAAgB,EAAE,UAAkB,OAAO,EAAE,UAAkB,OAAO;QACpG,eAAe;QACf,MAAM,UAAU,GAAG,IAAI,CAAC,WAAW;YACjC,IAAI,CAAC,WAAW,CAAC,CAAC,KAAK,QAAQ;YAC/B,IAAI,CAAC,WAAW,CAAC,CAAC,KAAK,QAAQ;YAC/B,IAAI,CAAC,WAAW,CAAC,OAAO,KAAK,OAAO;YACpC,IAAI,CAAC,WAAW,CAAC,OAAO,KAAK,OAAO,CAAC;QAEvC,IAAI,UAAU,EAAE,CAAC;YACf,IAAI,CAAC,IAAI,EAAE,CAAC;QACd,CAAC;IACH,CAAC;IAED;;;;;;;;OAQG;IACH,aAAa,CAAC,QAAgB,EAAE,QAAgB,EAAE,UAAkB,OAAO,EAAE,UAAkB,OAAO,EAAE,aAAsB,KAAK,EAAE,UAAuB;QAC1J,cAAc;QACd,MAAM,UAAU,GAAG,IAAI,CAAC,WAAW;YACjC,IAAI,CAAC,WAAW,CAAC,CAAC,KAAK,QAAQ;YAC/B,IAAI,CAAC,WAAW,CAAC,CAAC,KAAK,QAAQ;YAC/B,IAAI,CAAC,WAAW,CAAC,OAAO,KAAK,OAAO;YACpC,IAAI,CAAC,WAAW,CAAC,OAAO,KAAK,OAAO,CAAC;QAEvC,IAAI,UAAU,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACjC,oBAAoB;YACpB,IAAI,CAAC,IAAI,EAAE,CAAC;QACd,CAAC;aAAM,CAAC;YACN,SAAS;YACT,IAAI,CAAC,UAAU,CAAC,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC;QAChF,CAAC;IACH,CAAC;IAED;;OAEG;IACH,IAAI;QACF,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;QACtB,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACrB,IAAI,CAAC,cAAc,EAAE,CAAC;YACtB,IAAI,IAAI,CAAC,OAAO,CAAC,aAAa,EAAE,CAAC;gBAC/B,IAAI,CAAC,aAAa,EAAE,CAAC;YACvB,CAAC;QACH,CAAC;IACH,CAAC;IAED;;OAEG;IACH,IAAI;QACF,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;QACvB,IAAI,CAAC,cAAc,EAAE,CAAC;QACtB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC,mBAAmB;QAC5C,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,CAAC,UAAU;QAClC,IAAI,IAAI,CAAC,OAAO,CAAC,aAAa,EAAE,CAAC;YAC/B,IAAI,CAAC,YAAY,EAAE,CAAC;QACtB,CAAC;IACH,CAAC;IAED;;OAEG;IACH,MAAM;QACJ,qBAAqB;QACrB,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACvC,aAAa;YACb,IAAI,CAAC,IAAI,EAAE,CAAC;QACd,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,IAAI,EAAE,CAAC;QACd,CAAC;IACH,CAAC;IAED;;OAEG;IACH,OAAO;QACL,OAAO,IAAI,CAAC,SAAS,CAAC;IACxB,CAAC;IAED;;;;OAIG;IACH,UAAU,CAAC,KAAa,EAAE,MAAc;QACtC,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;YACvB,OAAO,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;YACjC,OAAO;QACT,CAAC;QAED,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,KAAK,IAAI,CAAC;QAC7C,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,MAAM,IAAI,CAAC;QAE/C,OAAO,CAAC,GAAG,CAAC,aAAa,EAAE,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,EAAE,MAAM,EAAE,GAAG,MAAM,IAAI,EAAE,CAAC,CAAC;IAC7E,CAAC;IAED;;;OAGG;IACH,mBAAmB,CAAC,IAAa;QAC/B,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QAEvB,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACtB,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC;YACnD,OAAO,CAAC,GAAG,CAAC,WAAW,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;QAC/C,CAAC;aAAM,CAAC;YACN,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAC5B,CAAC;IACH,CAAC;IAED;;OAEG;IACK,cAAc;;QACpB,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;YACtB,OAAO;QACT,CAAC;QAED,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC;QAEjD,wBAAwB;QACxB,MAAM,gBAAgB,GAAG,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,2BAA2B,CAAC,CAAC;QAErF,IAAI,YAAY,GAAmB,IAAI,CAAC;QACxC,gBAAgB,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;YAC5B,MAAM,SAAS,GAAG,EAAE,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;YAC9C,MAAM,SAAS,GAAG,EAAE,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;YAC9C,IAAI,SAAS,KAAK,OAAO,IAAI,SAAS,KAAK,OAAO,EAAE,CAAC;gBACnD,YAAY,GAAG,EAAE,CAAC;YACpB,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,YAAY,EAAE,CAAC;YAClB,OAAO;QACT,CAAC;QAED,UAAU;QACV,IAAI,CAAC,cAAc,EAAE,CAAC;QAEtB,iDAAiD;QACjD,MAAM,IAAI,GAAI,YAA4B,CAAC,qBAAqB,EAAE,CAAC;QAEnE,UAAU;QACV,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAClD,IAAI,CAAC,YAAY,CAAC,SAAS,GAAG,kBAAkB,CAAC;QAEjD,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,OAAO,CAAC;QAClD,MAAM,CAAC,GAAG,WAAY,CAAC;QACvB,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAExC,iCAAiC;QACjC,MAAM,cAAc,GAAG,CAAC,CAAC;QAEzB,MAAM,WAAW,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,CAAC,OAAwB,CAAC,CAAC,MAAM,CAAC;QACtF,MAAM,YAAY,GAAG,WAAW,GAAG,CAAC,IAAI,CAAC,KAAK,WAAW,GAAG,CAAC,CAAC;QAC9D,MAAM,eAAe,GAAG,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC;QAE1D,wBAAwB;QACxB,MAAM,UAAU,GAAG,CAAC,MAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,KAAK,mCAAI,IAAI,CAAC,KAAK,CAAC,GAAG,eAAe,CAAC;QAC5E,MAAM,WAAW,GAAG,CAAC,MAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,MAAM,mCAAI,IAAI,CAAC,MAAM,CAAC,GAAG,cAAc,CAAC;QAE9E,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,OAAO,GAAG;;;;;gBAKtB,CAAC,YAAY,WAAW;;iBAEvB,OAAO;cACV,IAAI,CAAC,IAAI;aACV,IAAI,CAAC,GAAG,GAAG,cAAc;eACvB,UAAU;gBACT,WAAW;KACtB,CAAC;QAEF,aAAa;QACb,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IAC/C,CAAC;IAED;;OAEG;IACK,cAAc;QACpB,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,CAAC;YACtD,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;YAC5D,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;QAC3B,CAAC;IACH,CAAC;IAED;;OAEG;IACH,QAAQ;QACN,IAAI,CAAC,IAAI,EAAE,CAAC;QACZ,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QACxB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,SAAS;QACT,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,oBAAoB,EAAE;YAChE,OAAO,EAAE,IAAI;YACb,MAAM,EAAE,EAAE;SACX,CAAC,CAAC,CAAC;IACN,CAAC;IAED;;OAEG;IACK,aAAa;QACnB,cAAc;QACd,MAAM,aAAa,GAAG,CAAC,CAAQ,EAAE,EAAE;YACjC,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,CAAC,CAAC,eAAe,EAAE,CAAC;QACtB,CAAC,CAAC;QAEF,gBAAgB;QAChB,MAAM,cAAc,GAAG;YACrB,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,wBAAwB,CAAC,CAAC;YACvE,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,CAAC;YACtE,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,mBAAmB,CAAC,CAAC;SACnE,CAAC;QAEF,gBAAgB;QAChB,cAAc,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;YAC1B,MAAM,OAAO,GAAG,CAAC,CAAQ,EAAE,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;YAC/C,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YAEzC,EAAE,CAAC,gBAAgB,CAAC,OAAO,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;YACzE,EAAE,CAAC,gBAAgB,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;YAC1E,EAAE,CAAC,gBAAgB,CAAC,WAAW,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;YAE7E,gBAAgB;YACf,EAAkB,CAAC,KAAK,CAAC,aAAa,GAAG,MAAM,CAAC;QACnD,CAAC,CAAC,CAAC;QAEH,wBAAwB;QACxB,MAAM,WAAW,GAAG,CAAC,CAAQ,EAAE,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;QACnD,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAC7C,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,WAAW,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QACxF,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,EAAE,WAAW,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QACzF,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,WAAW,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IAC9F,CAAC;IAED;;OAEG;IACK,YAAY;QAClB,eAAe;QACf,MAAM,cAAc,GAAG;YACrB,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,wBAAwB,CAAC,CAAC;YACvE,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,CAAC;YACtE,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,mBAAmB,CAAC,CAAC;YAClE,IAAI,CAAC,QAAQ;SACd,CAAC;QAEF,cAAc,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;YAC1B,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;gBAC3C,EAAE,CAAC,mBAAmB,CAAC,OAAO,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,EAAS,CAAC,CAAC;gBACnE,EAAE,CAAC,mBAAmB,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,EAAS,CAAC,CAAC;gBACpE,EAAE,CAAC,mBAAmB,CAAC,WAAW,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,EAAS,CAAC,CAAC;YACzE,CAAC,CAAC,CAAC;YAEH,gBAAgB;YAChB,IAAI,EAAE,KAAK,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACxB,EAAkB,CAAC,KAAK,CAAC,aAAa,GAAG,EAAE,CAAC;YAC/C,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,qBAAqB,GAAG,EAAE,CAAC;IAClC,CAAC;IAED;;OAEG;IACH,OAAO;QACL,IAAI,CAAC,YAAY,EAAE,CAAC;QACpB,IAAI,CAAC,cAAc,EAAE,CAAC;QACtB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QAExB,qBAAqB;QACrB,IAAI,IAAI,CAAC,iBAAiB,EAAE,CAAC;YAC3B,IAAI,CAAC,QAAQ,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,iBAAwB,CAAC,CAAC;YAC/E,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;QAChC,CAAC;QAED,KAAK,CAAC,OAAO,EAAE,CAAC;IAClB,CAAC;CACF","sourcesContent":["import { BasePlugin } from './base.plugin';\nimport type { PluginProviders, DimensionCols } from '@type';\n\nexport interface ManualFocusOptions {\n  /** 边框颜色 */\n  borderColor?: string;\n  /** 边框粗细 */\n  borderWidth?: number;\n  /** 焦点框显示时是否禁止滚动，默认 false */\n  disableScroll?: boolean;\n}\n\nexport interface CustomSize {\n  /** 自定义宽度（像素） */\n  width?: number;\n  /** 自定义高度（像素） */\n  height?: number;\n}\n\n/**\n * Manual Focus Plugin\n * 提供手动控制的单元格焦点框功能\n * \n * 功能：\n * 1. 提供 show/hide API 控制焦点框显示\n * 2. 在指定单元格上显示焦点框\n * 3. 支持手动切换焦点框显示状态\n * 4. 支持自定义边框颜色和粗细\n * 5. 焦点框显示时禁止表格滚动\n */\nexport class ManualFocusPlugin extends BasePlugin {\n  private focusElement: HTMLElement | null = null;\n  private isVisible: boolean = false;\n  private currentCell: { x: number; y: number; rowType: string; colType: string } | null = null;\n  private options: ManualFocusOptions;\n  private scrollPreventHandlers: Array<(e: Event) => void> = [];\n  private afterFocusHandler: ((e: CustomEvent) => void) | null = null;\n  private hideBorder: boolean = false;\n  private customSize: CustomSize | null = null;\n\n  constructor(revogrid: HTMLRevoGridElement, providers: PluginProviders, options: ManualFocusOptions = {}) {\n    super(revogrid, providers);\n    this.options = {\n      borderColor: options.borderColor || '#1D74F5',\n      borderWidth: options.borderWidth || 2,\n      disableScroll: options.disableScroll ?? false,\n    };\n\n    // 监听 afterfocus 事件\n    this.afterFocusHandler = (e: CustomEvent) => {\n      const detail = e.detail;\n      // 检查是否是当前要显示焦点的单元格\n      if (\n        this.currentCell &&\n        detail.rowIndex === this.currentCell.y &&\n        detail.colIndex === this.currentCell.x &&\n        detail.rowType === this.currentCell.rowType &&\n        detail.colType === this.currentCell.colType\n      ) {\n        // 延迟一帧，确保 DOM 更新完成\n        requestAnimationFrame(() => {\n          this.isVisible = true;\n          this.updateFocusBox();\n          if (this.options.disableScroll) {\n            this.disableScroll();\n          }\n        });\n      }\n    };\n    this.revogrid.addEventListener('afterfocus', this.afterFocusHandler as any);\n  }\n\n  /**\n   * 设置焦点到指定单元格\n   * @param rowIndex 行索引\n   * @param colIndex 列索引\n   * @param rowType 行类型，默认 'rgRow'\n   * @param colType 列类型，默认 'rgCol'\n   * @param hideBorder 是否隐藏边框（设置 opacity: 0），默认 false\n   * @param customSize 自定义尺寸 { width?: number, height?: number }\n   */\n  async setFocusAt(rowIndex: number, colIndex: number, rowType: string = 'rgRow', colType: string = 'rgCol', hideBorder: boolean = false, customSize?: CustomSize) {\n    // 先移除旧的焦点框\n    this.removeFocusBox();\n    this.isVisible = false;\n    \n    this.currentCell = {\n      x: colIndex,\n      y: rowIndex,\n      rowType,\n      colType,\n    };\n\n    // 保存 hideBorder 状态\n    this.hideBorder = hideBorder;\n    \n    // 保存自定义尺寸\n    this.customSize = customSize || null;\n\n    // 先设置表格的焦点，让 revogr-focus 渲染出来\n    const rowTypeIndex: number | undefined = (this.providers.selection.storesByType as any)[rowType];\n    const colTypeIndex: number | undefined = (this.providers.selection.storesByType as any)[colType];\n    \n    if (rowTypeIndex !== undefined && colTypeIndex !== undefined) {\n      const store = this.providers.selection.stores[rowTypeIndex]?.[colTypeIndex];\n      if (store) {\n        store.setFocus({ x: colIndex, y: rowIndex }, { x: colIndex, y: rowIndex });\n      }\n    }\n\n    // afterfocus 事件会触发 updateFocusBox\n    // 如果 50ms 内没有触发，则强制显示\n    setTimeout(() => {\n      if (this.currentCell && !this.isVisible) {\n        this.show();\n      }\n    }, 50);\n  }\n\n  /**\n   * 移除指定单元格的焦点\n   */\n  removeFocusAt(rowIndex: number, colIndex: number, rowType: string = 'rgRow', colType: string = 'rgCol') {\n    // 检查是否是当前焦点单元格\n    const isSameCell = this.currentCell && \n      this.currentCell.x === colIndex && \n      this.currentCell.y === rowIndex &&\n      this.currentCell.rowType === rowType &&\n      this.currentCell.colType === colType;\n    \n    if (isSameCell) {\n      this.hide();\n    }\n  }\n\n  /**\n   * 切换指定单元格的焦点显示状态\n   * @param rowIndex 行索引\n   * @param colIndex 列索引\n   * @param rowType 行类型，默认 'rgRow'\n   * @param colType 列类型，默认 'rgCol'\n   * @param hideBorder 是否隐藏边框（设置 opacity: 0），默认 false\n   * @param customSize 自定义尺寸 { width?: number, height?: number }\n   */\n  toggleFocusAt(rowIndex: number, colIndex: number, rowType: string = 'rgRow', colType: string = 'rgCol', hideBorder: boolean = false, customSize?: CustomSize) {\n    // 检查是否是同一个单元格\n    const isSameCell = this.currentCell && \n      this.currentCell.x === colIndex && \n      this.currentCell.y === rowIndex &&\n      this.currentCell.rowType === rowType &&\n      this.currentCell.colType === colType;\n    \n    if (isSameCell && this.isVisible) {\n      // 如果是同一个单元格且已显示，则移除\n      this.hide();\n    } else {\n      // 否则设置焦点\n      this.setFocusAt(rowIndex, colIndex, rowType, colType, hideBorder, customSize);\n    }\n  }\n\n  /**\n   * 显示焦点框\n   */\n  show() {\n    this.isVisible = true;\n    if (this.currentCell) {\n      this.updateFocusBox();\n      if (this.options.disableScroll) {\n        this.disableScroll();\n      }\n    }\n  }\n\n  /**\n   * 隐藏焦点框\n   */\n  hide() {\n    this.isVisible = false;\n    this.removeFocusBox();\n    this.currentCell = null; // 清除当前单元格，防止自动重新显示\n    this.customSize = null; // 清除自定义尺寸\n    if (this.options.disableScroll) {\n      this.enableScroll();\n    }\n  }\n\n  /**\n   * 切换焦点框显示状态\n   */\n  toggle() {\n    // 如果已经显示，检查是否是同一个单元格\n    if (this.isVisible && this.currentCell) {\n      // 不隐藏，保持显示状态\n      this.show();\n    } else {\n      this.show();\n    }\n  }\n\n  /**\n   * 获取当前焦点框显示状态\n   */\n  isShown(): boolean {\n    return this.isVisible;\n  }\n\n  /**\n   * 动态修改焦点框的宽高\n   * @param width 新的宽度（像素值）\n   * @param height 新的高度（像素值）\n   */\n  updateSize(width: number, height: number) {\n    if (!this.focusElement) {\n      console.warn('⚠️ 焦点框不存在，无法修改尺寸');\n      return;\n    }\n\n    this.focusElement.style.width = `${width}px`;\n    this.focusElement.style.height = `${height}px`;\n    \n    console.log('✅ 焦点框尺寸已更新:', { width: `${width}px`, height: `${height}px` });\n  }\n\n  /**\n   * 设置边框的显示/隐藏状态\n   * @param hide 是否隐藏边框（设置 opacity: 0）\n   */\n  setBorderVisibility(hide: boolean) {\n    this.hideBorder = hide;\n    \n    if (this.focusElement) {\n      this.focusElement.style.opacity = hide ? '0' : '1';\n      console.log(`✅ 焦点框边框已${hide ? '隐藏' : '显示'}`);\n    } else {\n      console.warn('⚠️ 焦点框不存在');\n    }\n  }\n\n  /**\n   * 更新焦点框位置和样式\n   */\n  private updateFocusBox() {\n    if (!this.currentCell) {\n      return;\n    }\n\n    const { rowType, colType, x } = this.currentCell;\n\n    // 查找匹配的 revogr-focus 元素\n    const allFocusElements = this.revogrid.querySelectorAll('revogr-focus.focused-cell');\n    \n    let focusElement: Element | null = null;\n    allFocusElements.forEach(el => {\n      const elRowType = el.getAttribute('row-type');\n      const elColType = el.getAttribute('col-type');\n      if (elRowType === rowType && elColType === colType) {\n        focusElement = el;\n      }\n    });\n\n    if (!focusElement) {\n      return;\n    }\n\n    // 移除旧的焦点框\n    this.removeFocusBox();\n\n    // 使用 getBoundingClientRect 获取 revogr-focus 的绝对位置\n    const rect = (focusElement as HTMLElement).getBoundingClientRect();\n\n    // 创建新的焦点框\n    this.focusElement = document.createElement('div');\n    this.focusElement.className = 'manual-focus-box';\n    \n    const { borderColor, borderWidth } = this.options;\n    const w = borderWidth!;\n    const opacity = this.hideBorder ? 0 : 1;\n\n    // 表格边框宽度（通过 box-shadow inset 实现）\n    const cellAdditional = 1;\n\n    const columnCount = this.providers.column.getColumns(colType as DimensionCols).length;\n    const isLastColumn = columnCount > 0 && x === columnCount - 1;\n    const widthAdditional = isLastColumn ? 0 : cellAdditional;\n\n    // 使用自定义尺寸或默认尺寸，并扩展以覆盖边框\n    const finalWidth = (this.customSize?.width ?? rect.width) + widthAdditional;\n    const finalHeight = (this.customSize?.height ?? rect.height) + cellAdditional;\n\n    this.focusElement.style.cssText = `\n      position: fixed;\n      pointer-events: none;\n      z-index: 2000;\n      display: block;\n      border: ${w}px solid ${borderColor};\n      box-sizing: border-box;\n      opacity: ${opacity};\n      left: ${rect.left}px;\n      top: ${rect.top - cellAdditional}px;\n      width: ${finalWidth}px;\n      height: ${finalHeight}px;\n    `;\n\n    // 添加到 body 下\n    document.body.appendChild(this.focusElement);\n  }\n\n  /**\n   * 移除焦点框\n   */\n  private removeFocusBox() {\n    if (this.focusElement && this.focusElement.parentNode) {\n      this.focusElement.parentNode.removeChild(this.focusElement);\n      this.focusElement = null;\n    }\n  }\n\n  /**\n   * 清除所有焦点框\n   */\n  clearAll() {\n    this.hide();\n    this.currentCell = null;\n    this.customSize = null;\n    // 触发清除事件\n    this.revogrid.dispatchEvent(new CustomEvent('manualfocuscleared', {\n      bubbles: true,\n      detail: {},\n    }));\n  }\n\n  /**\n   * 禁止表格滚动\n   */\n  private disableScroll() {\n    // 阻止所有滚动相关的事件\n    const preventScroll = (e: Event) => {\n      e.preventDefault();\n      e.stopPropagation();\n    };\n\n    // 查找所有可能触发滚动的元素\n    const scrollElements = [\n      ...Array.from(this.revogrid.querySelectorAll('revogr-viewport-scroll')),\n      ...Array.from(this.revogrid.querySelectorAll('revogr-scroll-virtual')),\n      ...Array.from(this.revogrid.querySelectorAll('[class*=\"scroll\"]')),\n    ];\n\n    // 为每个滚动元素添加事件监听\n    scrollElements.forEach(el => {\n      const handler = (e: Event) => preventScroll(e);\n      this.scrollPreventHandlers.push(handler);\n      \n      el.addEventListener('wheel', handler, { passive: false, capture: true });\n      el.addEventListener('scroll', handler, { passive: false, capture: true });\n      el.addEventListener('touchmove', handler, { passive: false, capture: true });\n      \n      // 禁用自定义滚动条的指针事件\n      (el as HTMLElement).style.pointerEvents = 'none';\n    });\n\n    // 同时在 revogrid 根元素上添加监听\n    const rootHandler = (e: Event) => preventScroll(e);\n    this.scrollPreventHandlers.push(rootHandler);\n    this.revogrid.addEventListener('wheel', rootHandler, { passive: false, capture: true });\n    this.revogrid.addEventListener('scroll', rootHandler, { passive: false, capture: true });\n    this.revogrid.addEventListener('touchmove', rootHandler, { passive: false, capture: true });\n  }\n\n  /**\n   * 恢复表格滚动\n   */\n  private enableScroll() {\n    // 移除所有滚动阻止事件监听\n    const scrollElements = [\n      ...Array.from(this.revogrid.querySelectorAll('revogr-viewport-scroll')),\n      ...Array.from(this.revogrid.querySelectorAll('revogr-scroll-virtual')),\n      ...Array.from(this.revogrid.querySelectorAll('[class*=\"scroll\"]')),\n      this.revogrid,\n    ];\n\n    scrollElements.forEach(el => {\n      this.scrollPreventHandlers.forEach(handler => {\n        el.removeEventListener('wheel', handler, { capture: true } as any);\n        el.removeEventListener('scroll', handler, { capture: true } as any);\n        el.removeEventListener('touchmove', handler, { capture: true } as any);\n      });\n      \n      // 恢复自定义滚动条的指针事件\n      if (el !== this.revogrid) {\n        (el as HTMLElement).style.pointerEvents = '';\n      }\n    });\n\n    this.scrollPreventHandlers = [];\n  }\n\n  /**\n   * 清理插件资源\n   */\n  destroy() {\n    this.enableScroll();\n    this.removeFocusBox();\n    this.currentCell = null;\n    \n    // 移除 afterfocus 事件监听\n    if (this.afterFocusHandler) {\n      this.revogrid.removeEventListener('afterfocus', this.afterFocusHandler as any);\n      this.afterFocusHandler = null;\n    }\n    \n    super.destroy();\n  }\n}\n"]}

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

@@ -0,0 +1,171 @@
+/*!
+ * Built by Revolist OU ❤️
+ */
+/**
+ * Plugin for column manual move
+ */
+import debounce from "lodash/debounce";
+import each from "lodash/each";
+import { getItemByPosition } from "../../store/index";
+import { BasePlugin } from "../base.plugin";
+import { ColumnOrderHandler } from "./order-column.handler";
+import { dispatch } from "../dispatcher";
+import { ON_COLUMN_CLICK } from "../../components/header/header-cell-renderer";
+import { isColGrouping } from "../../utils/column.utils";
+const COLUMN_CLICK = ON_COLUMN_CLICK;
+const MOVE = 'columndragmousemove';
+const DRAG_END = 'columndragend';
+const BEFORE_DRAG_END = 'beforecolumndragend';
+// use this event subscription to drop D&D for particular columns
+const DRAG_START = 'columndragstart';
+export class ColumnMovePlugin extends BasePlugin {
+    constructor(revogrid, providers) {
+        super(revogrid, providers);
+        this.moveFunc = debounce((e) => this.doMove(e), 5);
+        this.staticDragData = null;
+        this.dragData = null;
+        this.localSubscriptions = {};
+        this.orderUi = new ColumnOrderHandler();
+        revogrid.appendChild(this.orderUi.render());
+        revogrid.classList.add('column-draggable');
+        // Register events
+        this.localSubscriptions['mouseleave'] = {
+            target: document,
+            callback: (e) => this.onMouseOut(e),
+        };
+        this.localSubscriptions['mouseup'] = {
+            target: document,
+            callback: (e) => this.onMouseUp(e),
+        };
+        this.localSubscriptions['mousemove'] = {
+            target: document,
+            callback: (e) => this.move(e),
+        };
+        this.addEventListener(COLUMN_CLICK, ({ detail }) => this.dragStart(detail));
+    }
+    dragStart({ event, data }) {
+        if (event.defaultPrevented) {
+            return;
+        }
+        const { defaultPrevented } = dispatch(this.revogrid, DRAG_START, data);
+        // check if allowed to drag particulat column
+        if (defaultPrevented) {
+            return;
+        }
+        this.clearOrder();
+        const { mouseleave, mouseup, mousemove } = this.localSubscriptions;
+        mouseleave.target.addEventListener('mouseleave', mouseleave.callback);
+        mouseup.target.addEventListener('mouseup', mouseup.callback);
+        const dataEl = event.target.closest('revogr-header');
+        const scrollEl = event.target.closest('revogr-viewport-scroll');
+        if (!dataEl || !scrollEl) {
+            return;
+        }
+        // no grouping drag and no row header column drag
+        if (isColGrouping(data) || data.providers.type === 'rowHeaders') {
+            return;
+        }
+        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));
+        this.staticDragData = {
+            startPos: event.x,
+            startItem,
+            pin: data.pin,
+            dataEl,
+            scrollEl,
+            gridEl: this.revogrid,
+            cols,
+        };
+        this.dragData = this.getData(this.staticDragData);
+        mousemove.target.addEventListener('mousemove', mousemove.callback);
+        this.orderUi.start(event, Object.assign(Object.assign({}, this.dragData), this.staticDragData));
+    }
+    doMove(e) {
+        if (!this.staticDragData) {
+            return;
+        }
+        const dragData = (this.dragData = this.getData(this.staticDragData));
+        if (!dragData) {
+            return;
+        }
+        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);
+            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);
+        }
+    }
+    move(e) {
+        dispatch(this.revogrid, MOVE, e);
+        // then do move
+        this.moveFunc(e);
+    }
+    onMouseOut(_) {
+        this.clearOrder();
+    }
+    onMouseUp(e) {
+        // apply new positions
+        if (this.dragData && this.staticDragData) {
+            let relativePos = getLeftRelative(e.x, this.dragData.gridRect.left, this.dragData.scrollOffset);
+            if (relativePos < 0) {
+                relativePos = 0;
+            }
+            const newPosition = getItemByPosition(this.staticDragData.cols, relativePos);
+            const store = this.providers.column.stores[this.dragData.type].store;
+            const newItems = [...store.get('items')];
+            // prevent position change if needed
+            const { defaultPrevented: stopDrag } = dispatch(this.revogrid, BEFORE_DRAG_END, Object.assign(Object.assign({}, this.staticDragData), { startPosition: this.staticDragData.startItem, newPosition, newItem: store.get('source')[newItems[this.staticDragData.startItem.itemIndex]] }));
+            if (!stopDrag) {
+                const prevItems = [...newItems];
+                // todo: if move item out of group remove item from group
+                const toMove = newItems.splice(this.staticDragData.startItem.itemIndex, 1);
+                newItems.splice(newPosition.itemIndex, 0, ...toMove);
+                store.set('items', newItems);
+                this.providers.dimension.updateSizesPositionByNewDataIndexes(this.dragData.type, newItems, prevItems);
+            }
+            dispatch(this.revogrid, DRAG_END, this.dragData);
+        }
+        this.clearOrder();
+    }
+    clearLocalSubscriptions() {
+        each(this.localSubscriptions, ({ target, callback }, key) => target.removeEventListener(key, callback));
+    }
+    clearOrder() {
+        this.staticDragData = null;
+        this.dragData = null;
+        this.clearLocalSubscriptions();
+        this.orderUi.stop(this.revogrid);
+    }
+    /**
+     * Clearing subscription
+     */
+    clearSubscriptions() {
+        super.clearSubscriptions();
+        this.clearLocalSubscriptions();
+    }
+    getData({ gridEl, dataEl, pin, }) {
+        const gridRect = gridEl.getBoundingClientRect();
+        const elRect = dataEl.getBoundingClientRect();
+        const scrollOffset = elRect.left - gridRect.left;
+        return {
+            elRect,
+            gridRect,
+            type: pin || 'rgCol',
+            scrollOffset,
+        };
+    }
+    getDimension(type) {
+        return this.providers.dimension.stores[type].getCurrentState();
+    }
+}
+export function getLeftRelative(absoluteX, gridPos, offset) {
+    return absoluteX - gridPos - offset;
+}
+//# sourceMappingURL=column.drag.plugin.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"column.drag.plugin.js","sourceRoot":"","sources":["../../../src/plugins/moveColumn/column.drag.plugin.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,QAAQ,MAAM,iBAAiB,CAAC;AACvC,OAAO,IAAI,MAAM,aAAa,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,OAAO,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAC/E,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAEzD,MAAM,YAAY,GAAG,eAAe,CAAC;AACrC,MAAM,IAAI,GAAG,qBAAqB,CAAC;AACnC,MAAM,QAAQ,GAAG,eAAe,CAAC;AACjC,MAAM,eAAe,GAAG,qBAAqB,CAAC;AAE9C,iEAAiE;AACjE,MAAM,UAAU,GAAG,iBAAiB,CAAC;AA4BrC,MAAM,OAAO,gBAAiB,SAAQ,UAAU;IAO9C,YAAY,QAA6B,EAAE,SAA0B;QACnE,KAAK,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;QAPnB,aAAQ,GAAG,QAAQ,CAAC,CAAC,CAAa,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QAC1D,mBAAc,GAAsB,IAAI,CAAC;QACzC,aAAQ,GAA+B,IAAI,CAAC;QAE7C,uBAAkB,GAAuB,EAAE,CAAC;QAInD,IAAI,CAAC,OAAO,GAAG,IAAI,kBAAkB,EAAE,CAAC;QACxC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC,CAAC;QAC5C,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;QAE3C,kBAAkB;QAClB,IAAI,CAAC,kBAAkB,CAAC,YAAY,CAAC,GAAG;YACtC,MAAM,EAAE,QAAQ;YAChB,QAAQ,EAAE,CAAC,CAAa,EAAE,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC;SAChD,CAAC;QACF,IAAI,CAAC,kBAAkB,CAAC,SAAS,CAAC,GAAG;YACnC,MAAM,EAAE,QAAQ;YAChB,QAAQ,EAAE,CAAC,CAAa,EAAE,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC;SAC/C,CAAC;QAEF,IAAI,CAAC,kBAAkB,CAAC,WAAW,CAAC,GAAG;YACrC,MAAM,EAAE,QAAQ;YAChB,QAAQ,EAAE,CAAC,CAAa,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;SAC1C,CAAC;QAEF,IAAI,CAAC,gBAAgB,CAAC,YAAY,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC;IAC9E,CAAC;IAED,SAAS,CAAC,EAAE,KAAK,EAAE,IAAI,EAAyB;QAC9C,IAAI,KAAK,CAAC,gBAAgB,EAAE,CAAC;YAC3B,OAAO;QACT,CAAC;QACD,MAAM,EAAE,gBAAgB,EAAE,GAAG,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAE,UAAU,EAAE,IAAI,CAAC,CAAC;QACvE,6CAA6C;QAC7C,IAAI,gBAAgB,EAAE,CAAC;YACrB,OAAO;QACT,CAAC;QACD,IAAI,CAAC,UAAU,EAAE,CAAC;QAClB,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,kBAAkB,CAAC;QACnE,UAAU,CAAC,MAAM,CAAC,gBAAgB,CAAC,YAAY,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;QACtE,OAAO,CAAC,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC;QAE7D,MAAM,MAAM,GAAI,KAAK,CAAC,MAAsB,CAAC,OAAO,CAAC,eAAe,CAAC,CAAC;QACtE,MAAM,QAAQ,GAAI,KAAK,CAAC,MAAsB,CAAC,OAAO,CAAC,wBAAwB,CAAC,CAAC;QACjF,IAAI,CAAC,MAAM,IAAI,CAAC,QAAQ,EAAE,CAAC;YACzB,OAAO;QACT,CAAC;QAED,iDAAiD;QACjD,IAAI,aAAa,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,KAAK,YAAY,EAAE,CAAC;YAChE,OAAO;QACT,CAAC;QAED,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,GAAG,IAAI,OAAO,CAAC,CAAC;QACpD,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,qBAAqB,EAAE,CAAC;QACvD,MAAM,MAAM,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;QAC9C,MAAM,SAAS,GAAG,iBAAiB,CACjC,IAAI,EACJ,eAAe,CAAC,KAAK,CAAC,CAAC,EAAE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC;QAExE,IAAI,CAAC,cAAc,GAAG;YACpB,QAAQ,EAAE,KAAK,CAAC,CAAC;YACjB,SAAS;YACT,GAAG,EAAE,IAAI,CAAC,GAAG;YACb,MAAM;YACN,QAAQ;YACR,MAAM,EAAE,IAAI,CAAC,QAAQ;YACrB,IAAI;SACL,CAAC;QACF,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QAClD,SAAS,CAAC,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAC;QACnE,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,kCACnB,IAAI,CAAC,QAAQ,GACb,IAAI,CAAC,cAAc,EACtB,CAAC;IACL,CAAC;IAED,MAAM,CAAC,CAAa;QAClB,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;YACzB,OAAO;QACT,CAAC;QAED,MAAM,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC;QACrE,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,OAAO;QACT,CAAC;QACD,MAAM,KAAK,GAAG,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC;QAC3C,IAAI,IAAI,CAAC,GAAG,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC;YAC/B,MAAM,CAAC,GAAG,eAAe,CAAC,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;YACxF,MAAM,KAAK,GAAG,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC;YAC7D,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YAElD,2CAA2C;YAC3C,IAAI,KAAK,CAAC,SAAS,IAAI,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;gBACtD,OAAO;YACT,CAAC;YACD,IAAI,CAAC,OAAO,CAAC,WAAW,CACtB,KAAK,CAAC,GAAG,GAAG,QAAQ,CAAC,YAAY,EACjC,QAAQ,CAAC,QAAQ,CAAC,KAAK,CACxB,CAAC;QACJ,CAAC;IACH,CAAC;IAED,IAAI,CAAC,CAAa;QAChB,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;QACjC,eAAe;QACf,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IACnB,CAAC;IACD,UAAU,CAAC,CAAa;QACtB,IAAI,CAAC,UAAU,EAAE,CAAC;IACpB,CAAC;IACD,SAAS,CAAC,CAAa;QACrB,sBAAsB;QACtB,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACzC,IAAI,WAAW,GAAG,eAAe,CAAC,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;YAChG,IAAI,WAAW,GAAG,CAAC,EAAE,CAAC;gBACpB,WAAW,GAAG,CAAC,CAAC;YAClB,CAAC;YACD,MAAM,WAAW,GAAG,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;YAE7E,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC;YACrE,MAAM,QAAQ,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC;YAEzC,oCAAoC;YACpC,MAAM,EAAE,gBAAgB,EAAE,QAAQ,EAAE,GAAG,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAE,eAAe,kCACzE,IAAI,CAAC,cAAc,KACtB,aAAa,EAAE,IAAI,CAAC,cAAc,CAAC,SAAS,EAC5C,WAAW,EACX,OAAO,EAAE,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,IAC/E,CAAC;YACH,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACd,MAAM,SAAS,GAAG,CAAC,GAAG,QAAQ,CAAC,CAAC;gBAChC,yDAAyD;gBACzD,MAAM,MAAM,GAAG,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC;gBAC3E,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,SAAS,EAAE,CAAC,EAAE,GAAG,MAAM,CAAC,CAAC;gBACrD,KAAK,CAAC,GAAG,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;gBAC7B,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,mCAAmC,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;YACxG,CAAC;YACD,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;QACnD,CAAC;QACD,IAAI,CAAC,UAAU,EAAE,CAAC;IACpB,CAAC;IAES,uBAAuB;QAC/B,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAC,CAAC;IAC1G,CAAC;IAED,UAAU;QACR,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAC3B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;QACrB,IAAI,CAAC,uBAAuB,EAAE,CAAC;QAC/B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACnC,CAAC;IACD;;OAEG;IACH,kBAAkB;QAChB,KAAK,CAAC,kBAAkB,EAAE,CAAC;QAC3B,IAAI,CAAC,uBAAuB,EAAE,CAAC;IACjC,CAAC;IAES,OAAO,CAAC,EAChB,MAAM,EACN,MAAM,EACN,GAAG,GACQ;QACX,MAAM,QAAQ,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;QAChD,MAAM,MAAM,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;QAC9C,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC;QACjD,OAAO;YACL,MAAM;YACN,QAAQ;YACR,IAAI,EAAE,GAAG,IAAI,OAAO;YACpB,YAAY;SACb,CAAC;IACJ,CAAC;IACS,YAAY,CAAC,IAAwB;QAC7C,OAAO,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACjE,CAAC;CACF;AAED,MAAM,UAAU,eAAe,CAC7B,SAAiB,EACjB,OAAe,EACf,MAAc;IAEd,OAAO,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;AACtC,CAAC","sourcesContent":["/**\n * Plugin for column manual move\n */\nimport debounce from 'lodash/debounce';\nimport each from 'lodash/each';\nimport { getItemByPosition } from '@store';\nimport { BasePlugin } from '../base.plugin';\nimport { ColumnOrderHandler } from './order-column.handler';\nimport { dispatch } from '../dispatcher';\nimport type { ColumnPropProp, DimensionSettingsState, PositionItem, DimensionCols, MultiDimensionType, PluginProviders, DimensionColPin } from '@type';\nimport { ON_COLUMN_CLICK } from '../../components/header/header-cell-renderer';\nimport { isColGrouping } from '../../utils/column.utils';\n\nconst COLUMN_CLICK = ON_COLUMN_CLICK;\nconst MOVE = 'columndragmousemove';\nconst DRAG_END = 'columndragend';\nconst BEFORE_DRAG_END = 'beforecolumndragend';\n\n// use this event subscription to drop D&D for particular columns\nconst DRAG_START = 'columndragstart';\n\nexport type DragStartEventDetails = {\n  event: MouseEvent;\n  data: ColumnPropProp;\n};\n\ntype StaticData = {\n  startPos: number;\n  startItem: PositionItem;\n  pin?: DimensionColPin;\n  dataEl: HTMLElement;\n  scrollEl: Element;\n  gridEl: HTMLElement;\n  cols: DimensionSettingsState;\n};\n\ntype LocalSubscriptions = Record<string, LocalSubscription>;\ntype LocalSubscription = {\n  target: Element | Document;\n  callback(...params: any[]): void;\n};\nexport type ColumnDragEventData = {\n  elRect: DOMRect;\n  gridRect: DOMRect;\n  scrollOffset: number;\n  type: DimensionCols;\n};\nexport class ColumnMovePlugin extends BasePlugin {\n  protected moveFunc = debounce((e: MouseEvent) => this.doMove(e), 5);\n  protected staticDragData: StaticData | null = null;\n  protected dragData: ColumnDragEventData | null = null;\n  readonly orderUi: ColumnOrderHandler;\n  readonly localSubscriptions: LocalSubscriptions = {};\n\n  constructor(revogrid: HTMLRevoGridElement, providers: PluginProviders) {\n    super(revogrid, providers);\n    this.orderUi = new ColumnOrderHandler();\n    revogrid.appendChild(this.orderUi.render());\n    revogrid.classList.add('column-draggable');\n\n    // Register events\n    this.localSubscriptions['mouseleave'] = {\n      target: document,\n      callback: (e: MouseEvent) => this.onMouseOut(e),\n    };\n    this.localSubscriptions['mouseup'] = {\n      target: document,\n      callback: (e: MouseEvent) => this.onMouseUp(e),\n    };\n\n    this.localSubscriptions['mousemove'] = {\n      target: document,\n      callback: (e: MouseEvent) => this.move(e),\n    };\n\n    this.addEventListener(COLUMN_CLICK, ({ detail }) => this.dragStart(detail));\n  }\n\n  dragStart({ event, data }: DragStartEventDetails) {\n    if (event.defaultPrevented) {\n      return;\n    }\n    const { defaultPrevented } = dispatch(this.revogrid, DRAG_START, data);\n    // check if allowed to drag particulat column\n    if (defaultPrevented) {\n      return;\n    }\n    this.clearOrder();\n    const { mouseleave, mouseup, mousemove } = this.localSubscriptions;\n    mouseleave.target.addEventListener('mouseleave', mouseleave.callback);\n    mouseup.target.addEventListener('mouseup', mouseup.callback);\n\n    const dataEl = (event.target as HTMLElement).closest('revogr-header');\n    const scrollEl = (event.target as HTMLElement).closest('revogr-viewport-scroll');\n    if (!dataEl || !scrollEl) {\n      return;\n    }\n\n    // no grouping drag and no row header column drag\n    if (isColGrouping(data) || data.providers.type === 'rowHeaders') {\n      return;\n    }\n\n    const cols = this.getDimension(data.pin || 'rgCol');\n    const gridRect = this.revogrid.getBoundingClientRect();\n    const elRect = dataEl.getBoundingClientRect();\n    const startItem = getItemByPosition(\n      cols,\n      getLeftRelative(event.x, gridRect.left, elRect.left - gridRect.left));\n  \n    this.staticDragData = {\n      startPos: event.x,\n      startItem,\n      pin: data.pin,\n      dataEl,\n      scrollEl,\n      gridEl: this.revogrid,\n      cols,\n    };\n    this.dragData = this.getData(this.staticDragData);\n    mousemove.target.addEventListener('mousemove', mousemove.callback);\n    this.orderUi.start(event, {\n      ...this.dragData,\n      ...this.staticDragData,\n    });\n  }\n\n  doMove(e: MouseEvent) {\n    if (!this.staticDragData) {\n      return;\n    }\n\n    const dragData = (this.dragData = this.getData(this.staticDragData));\n    if (!dragData) {\n      return;\n    }\n    const start = this.staticDragData.startPos;\n    if (Math.abs(start - e.x) > 10) {\n      const x = getLeftRelative(e.x, this.dragData.gridRect.left, this.dragData.scrollOffset);\n      const rgCol = getItemByPosition(this.staticDragData.cols, x);\n      this.orderUi.autoscroll(x, dragData.elRect.width);\n\n      // prevent position change if out of bounds\n      if (rgCol.itemIndex >= this.staticDragData.cols.count) {\n        return;\n      }\n      this.orderUi.showHandler(\n        rgCol.end + dragData.scrollOffset,\n        dragData.gridRect.width\n      );\n    }\n  }\n\n  move(e: MouseEvent) {\n    dispatch(this.revogrid, MOVE, e);\n    // then do move\n    this.moveFunc(e);\n  }\n  onMouseOut(_: MouseEvent) {\n    this.clearOrder();\n  }\n  onMouseUp(e: MouseEvent) {\n    // apply new positions\n    if (this.dragData && this.staticDragData) {\n      let relativePos = getLeftRelative(e.x, this.dragData.gridRect.left, this.dragData.scrollOffset);\n      if (relativePos < 0) {\n        relativePos = 0;\n      }\n      const newPosition = getItemByPosition(this.staticDragData.cols, relativePos);\n\n      const store = this.providers.column.stores[this.dragData.type].store;\n      const newItems = [...store.get('items')];\n\n      // prevent position change if needed\n      const { defaultPrevented: stopDrag } = dispatch(this.revogrid, BEFORE_DRAG_END, {\n        ...this.staticDragData,\n        startPosition: this.staticDragData.startItem,\n        newPosition,\n        newItem: store.get('source')[newItems[this.staticDragData.startItem.itemIndex]]\n      });\n      if (!stopDrag) {\n        const prevItems = [...newItems];\n        // todo: if move item out of group remove item from group\n        const toMove = newItems.splice(this.staticDragData.startItem.itemIndex, 1);\n        newItems.splice(newPosition.itemIndex, 0, ...toMove);\n        store.set('items', newItems);\n        this.providers.dimension.updateSizesPositionByNewDataIndexes(this.dragData.type, newItems, prevItems);\n      }\n      dispatch(this.revogrid, DRAG_END, this.dragData);\n    }\n    this.clearOrder();\n  }\n\n  protected clearLocalSubscriptions() {\n    each(this.localSubscriptions, ({ target, callback }, key) => target.removeEventListener(key, callback));\n  }\n\n  clearOrder() {\n    this.staticDragData = null;\n    this.dragData = null;\n    this.clearLocalSubscriptions();\n    this.orderUi.stop(this.revogrid);\n  }\n  /**\n   * Clearing subscription\n   */\n  clearSubscriptions() {\n    super.clearSubscriptions();\n    this.clearLocalSubscriptions();\n  }\n\n  protected getData({\n    gridEl,\n    dataEl,\n    pin,\n  }: StaticData): ColumnDragEventData {\n    const gridRect = gridEl.getBoundingClientRect();\n    const elRect = dataEl.getBoundingClientRect();\n    const scrollOffset = elRect.left - gridRect.left;\n    return {\n      elRect,\n      gridRect,\n      type: pin || 'rgCol',\n      scrollOffset,\n    };\n  }\n  protected getDimension(type: MultiDimensionType) {\n    return this.providers.dimension.stores[type].getCurrentState();\n  }\n}\n\nexport function getLeftRelative(\n  absoluteX: number,\n  gridPos: number,\n  offset: number\n): number {\n  return absoluteX - gridPos - offset;\n}\n"]}