balala-revogrid 1.0.0

package/standalone/header-group-renderer.js

@@ -0,0 +1,634 @@
+/*!
+ * Built by Revolist OU ❤️
+ */
+import { r as getNative, u as baseIteratee, l as isArray } from './data.store.js';
+import { y as doPropMerge, u as baseEach } from './column.service.js';
+import { h } from '@stencil/core/internal/client';
+import { c as FilterButton } from './filter.button.js';
+import { M as MIN_COL_SIZE, D as DATA_COL, d as HEADER_SORTABLE_CLASS, H as HEADER_CLASS, F as FOCUS_CLASS } from './consts.js';
+
+/**
+ * Dispatches a custom event to a specified target element.
+ *
+ * @param target - The target element to dispatch the event to.
+ * @param eventName - The name of the custom event.
+ * @param detail - Optional. The detail of the custom event.
+ * @returns The custom event that was dispatched.
+ */
+function dispatch(target, eventName, detail) {
+    // Create a new CustomEvent with the specified event name and detail.
+    const event = new CustomEvent(eventName, {
+        detail,
+        cancelable: true, // Indicates whether the event can be canceled.
+        bubbles: true, // Indicates whether the event bubbles up through the DOM.
+    });
+    // Dispatch the event on the target element.
+    target === null || target === void 0 ? void 0 : target.dispatchEvent(event);
+    // Return the custom event that was dispatched.
+    return event;
+}
+/**
+ * Dispatches a custom event based on an existing event object and prevents the default behavior of the original event.
+ *
+ * @param e - The original event object containing the target and preventDefault method.
+ * @param eventName - The name of the custom event.
+ * @param detail - Optional. The detail of the custom event.
+ * @returns The custom event that was dispatched.
+ */
+function dispatchByEvent(e, // The original event object containing the target and preventDefault method.
+eventName, // The name of the custom event.
+detail) {
+    // Prevent the default behavior of the original event.
+    e.preventDefault();
+    // Dispatch the custom event to the target element specified in the original event object.
+    return dispatch(e.target, eventName, detail);
+}
+
+const SortingSign = ({ column }) => {
+    var _a;
+    return h("i", { class: (_a = column === null || column === void 0 ? void 0 : column.order) !== null && _a !== void 0 ? _a : 'sort-off' });
+};
+
+var ResizeEvents;
+(function (ResizeEvents) {
+    ResizeEvents["start"] = "resize:start";
+    ResizeEvents["move"] = "resize:move";
+    ResizeEvents["end"] = "resize:end";
+})(ResizeEvents || (ResizeEvents = {}));
+const RESIZE_MASK = {
+    'resizable-r': { bit: 0b0001, cursor: 'col-resize' },
+    'resizable-rb': { bit: 0b0011, cursor: 'se-resize' },
+    'resizable-b': { bit: 0b0010, cursor: 's-resize' },
+    'resizable-lb': { bit: 0b0110, cursor: 'sw-resize' },
+    'resizable-l': { bit: 0b0100, cursor: 'w-resize' },
+    'resizable-lt': { bit: 0b1100, cursor: 'nw-resize' },
+    'resizable-t': { bit: 0b1000, cursor: 'n-resize' },
+    'resizable-rt': { bit: 0b1001, cursor: 'ne-resize' },
+};
+const DISABLE_MASK = {
+    w: 0b0100,
+    h: 0b1000,
+};
+const defaultProps = (props) => {
+    return Object.assign(Object.assign({}, props), { fitParent: props.fitParent || false, active: props.active || [], disableAttributes: props.disableAttributes || [], minWidth: props.minWidth || 0, minHeight: props.minHeight || 0 });
+};
+class ResizeDirective {
+    constructor(initialProps, $event) {
+        var _a, _b;
+        this.initialProps = initialProps;
+        this.$event = $event;
+        this.startMouseX = 0; // 记录拖拽开始时的鼠标位置
+        this.startMouseY = 0;
+        this.width = 0;
+        this.height = 0;
+        this.changeX = 0;
+        this.changeY = 0;
+        this.disableCalcMap = 0b1111;
+        this.props = defaultProps(initialProps);
+        this.mouseMoveFunc = this.handleMove.bind(this);
+        this.mouseUpFunc = this.handleUp.bind(this);
+        this.handleRightClickFunc = this.handleRightClick.bind(this);
+        this.handleContextMenuFunc = this.handleContextMenu.bind(this);
+        this.minW = this.props.minWidth;
+        this.minH = this.props.minHeight;
+        this.maxW = (_a = this.props.maxWidth) !== null && _a !== void 0 ? _a : 0;
+        this.maxH = (_b = this.props.maxHeight) !== null && _b !== void 0 ? _b : 0;
+        this.parent = { width: 0, height: 0 };
+        this.resizeState = 0;
+    }
+    set($el) {
+        this.$el = $el;
+        this.props.disableAttributes.forEach(attr => {
+            switch (attr) {
+                case 'l':
+                    this.disableCalcMap &= -2;
+                    break;
+                case 't':
+                    this.disableCalcMap &= -3;
+                    break;
+                case 'w':
+                    this.disableCalcMap &= -5;
+                    break;
+                case 'h':
+                    this.disableCalcMap &= -9;
+            }
+        });
+    }
+    emitEvent(eventName, additionalOptions) {
+        var _a;
+        if (!this.$event) {
+            return;
+        }
+        const isLeft = (_a = this.activeResizer) === null || _a === void 0 ? void 0 : _a.classList.contains('resizable-l');
+        this.$event(Object.assign({ eventName, width: this.width + this.changeX * (isLeft ? -1 : 1), height: this.height + this.changeY, changedX: this.changeX, changedY: this.changeY }, additionalOptions));
+    }
+    static isTouchEvent(e) {
+        var _a;
+        const event = e;
+        return ((_a = event.touches) === null || _a === void 0 ? void 0 : _a.length) >= 0;
+    }
+    handleMove(event) {
+        var _a;
+        if (!this.resizeState) {
+            return;
+        }
+        let eventY, eventX;
+        if (ResizeDirective.isTouchEvent(event)) {
+            eventY = event.touches[0].clientY;
+            eventX = event.touches[0].clientX;
+        }
+        else {
+            eventY = event.clientY;
+            eventX = event.clientX;
+        }
+        let isX = this.resizeState & RESIZE_MASK['resizable-r'].bit ||
+            this.resizeState & RESIZE_MASK['resizable-l'].bit;
+        let isY = this.resizeState & RESIZE_MASK['resizable-t'].bit ||
+            this.resizeState & RESIZE_MASK['resizable-b'].bit;
+        if (isY && this.disableCalcMap & DISABLE_MASK.h) {
+            // 使用绝对位置计算，避免累加误差
+            const totalDiffY = eventY - this.startMouseY;
+            let changedY = totalDiffY;
+            const newHeight = this.height + changedY;
+            // if overcrossed min height
+            if (newHeight < this.minH) {
+                changedY = -(this.height - this.minH);
+            }
+            // if overcrossed max heiht
+            if (this.maxH && newHeight > this.maxH) {
+                changedY = this.maxH - this.height;
+            }
+            this.changeY = changedY;
+            if (this.activeResizer) {
+                this.activeResizer.style.bottom = `${-this.changeY}px`;
+            }
+        }
+        if (isX && this.disableCalcMap & DISABLE_MASK.w) {
+            const isLeft = (_a = this.activeResizer) === null || _a === void 0 ? void 0 : _a.classList.contains('resizable-l');
+            // 使用绝对位置计算，避免累加误差
+            const totalDiffX = eventX - this.startMouseX;
+            let changedX = totalDiffX;
+            const newWidth = this.width + changedX * (isLeft ? -1 : 1);
+            // if overcrossed min width
+            if (newWidth < this.minW) {
+                changedX = -(this.width - this.minW) * (isLeft ? -1 : 1);
+            }
+            // if overcrossed max width
+            if (this.maxW && newWidth > this.maxW) {
+                changedX = (this.maxW - this.width) * (isLeft ? 1 : 1);
+            }
+            this.changeX = changedX;
+            if (this.activeResizer) {
+                if (!isLeft) {
+                    this.activeResizer.style.right = `${-this.changeX}px`;
+                }
+                else {
+                    this.activeResizer.style.left = `${this.changeX}px`;
+                }
+            }
+        }
+        this.emitEvent(ResizeEvents.move);
+    }
+    handleDown(event) {
+        if (event.defaultPrevented) {
+            return;
+        }
+        // 右键不触发拖拽
+        if (!ResizeDirective.isTouchEvent(event) && event.button !== 0) {
+            return;
+        }
+        // stop other events if resize in progress
+        event.preventDefault();
+        this.dropInitial();
+        for (let elClass in RESIZE_MASK) {
+            const target = event.target;
+            if (this.$el.contains(target) && (target === null || target === void 0 ? void 0 : target.classList.contains(elClass))) {
+                document.body.style.cursor = RESIZE_MASK[elClass].cursor;
+                if (ResizeDirective.isTouchEvent(event)) {
+                    this.setInitials(event.touches[0], target);
+                }
+                else {
+                    event.preventDefault && event.preventDefault();
+                    this.setInitials(event, target);
+                }
+                this.resizeState = RESIZE_MASK[elClass].bit;
+                const eventName = ResizeEvents.start;
+                this.emitEvent(eventName);
+                break;
+            }
+        }
+        this.bindMove();
+    }
+    handleUp(e) {
+        e.preventDefault();
+        if (this.resizeState !== 0) {
+            this.resizeState = 0;
+            document.body.style.cursor = '';
+            // 只有当宽度实际发生变化时才触发 resize:end 事件
+            // 允许 1px 的误差，避免微小的抖动触发调整
+            if (Math.abs(this.changeX) > 1 || Math.abs(this.changeY) > 1) {
+                const eventName = ResizeEvents.end;
+                this.emitEvent(eventName);
+            }
+        }
+        this.dropInitial();
+        this.unbindMove();
+    }
+    setInitials({ clientX, clientY }, target) {
+        var _a, _b, _c, _d;
+        const computedStyle = getComputedStyle(this.$el);
+        this.$el.classList.add('active');
+        this.activeResizer = target;
+        if (this.disableCalcMap & DISABLE_MASK.w) {
+            this.startMouseX = clientX; // 记录初始鼠标位置
+            this.width = this.$el.clientWidth;
+            this.parent.width = (_b = (_a = this.$el.parentElement) === null || _a === void 0 ? void 0 : _a.clientWidth) !== null && _b !== void 0 ? _b : 0;
+            // min width: 需要考虑 padding 和 border
+            const minPaddingX = parseFloat(computedStyle.paddingLeft) +
+                parseFloat(computedStyle.paddingRight);
+            const minBorderX = parseFloat(computedStyle.borderLeftWidth) +
+                parseFloat(computedStyle.borderRightWidth);
+            this.minW = Math.max(minPaddingX + minBorderX, this.initialProps.minWidth || 0);
+            // max width
+            if (this.initialProps.maxWidth) {
+                this.maxW = Math.max(this.width, this.initialProps.maxWidth);
+            }
+        }
+        if (this.disableCalcMap & DISABLE_MASK.h) {
+            this.startMouseY = clientY; // 记录初始鼠标位置
+            this.height = this.$el.clientHeight;
+            this.parent.height = (_d = (_c = this.$el.parentElement) === null || _c === void 0 ? void 0 : _c.clientHeight) !== null && _d !== void 0 ? _d : 0;
+            // min height
+            const minPaddingY = parseFloat(computedStyle.paddingTop) +
+                parseFloat(computedStyle.paddingBottom);
+            this.minH = Math.max(minPaddingY, this.initialProps.minHeight || 0);
+            // max height
+            if (this.initialProps.maxHeight) {
+                this.maxH = Math.max(this.height, this.initialProps.maxHeight);
+            }
+        }
+    }
+    dropInitial() {
+        this.changeX = this.changeY = this.minW = this.minH;
+        this.width = this.height = 0;
+        if (this.activeResizer) {
+            this.activeResizer.removeAttribute('style');
+        }
+        this.$el.classList.remove('active');
+        this.activeResizer = undefined;
+    }
+    bindMove() {
+        document.documentElement.addEventListener('mouseup', this.mouseUpFunc, true);
+        document.documentElement.addEventListener('touchend', this.mouseUpFunc, true);
+        document.documentElement.addEventListener('mousemove', this.mouseMoveFunc, true);
+        document.documentElement.addEventListener('touchmove', this.mouseMoveFunc, true);
+        document.documentElement.addEventListener('mouseleave', this.mouseUpFunc);
+        // 右键按下时取消拖拽
+        document.documentElement.addEventListener('mousedown', this.handleRightClickFunc, true);
+        document.documentElement.addEventListener('contextmenu', this.handleContextMenuFunc, true);
+    }
+    unbindMove() {
+        document.documentElement.removeEventListener('mouseup', this.mouseUpFunc, true);
+        document.documentElement.removeEventListener('touchend', this.mouseUpFunc, true);
+        document.documentElement.removeEventListener('mousemove', this.mouseMoveFunc, true);
+        document.documentElement.removeEventListener('touchmove', this.mouseMoveFunc, true);
+        document.documentElement.removeEventListener('mouseleave', this.mouseUpFunc);
+        document.documentElement.removeEventListener('mousedown', this.handleRightClickFunc, true);
+        document.documentElement.removeEventListener('contextmenu', this.handleContextMenuFunc, true);
+    }
+    // 右键按下时取消拖拽
+    handleRightClick(e) {
+        if (e.button === 2 && this.resizeState !== 0) {
+            e.preventDefault();
+            this.cancelResize();
+        }
+    }
+    // 阻止右键菜单
+    handleContextMenu(e) {
+        if (this.resizeState !== 0) {
+            e.preventDefault();
+        }
+    }
+    // 取消拖拽（不触发 resize:end 事件）
+    cancelResize() {
+        this.resizeState = 0;
+        document.body.style.cursor = '';
+        this.dropInitial();
+        this.unbindMove();
+    }
+}
+
+const ResizableElement = (props, children) => {
+    const resizeEls = [];
+    const directive = (props.canResize &&
+        new ResizeDirective(props, e => {
+            var _a;
+            if (e.eventName === ResizeEvents.end) {
+                (_a = props.onResize) === null || _a === void 0 ? void 0 : _a.call(props, e);
+            }
+        })) ||
+        null;
+    if (props.active) {
+        if (props.canResize) {
+            for (let p in props.active) {
+                resizeEls.push(h("div", { onClick: e => e.preventDefault(), onDblClick: e => {
+                        e.preventDefault();
+                        e.stopPropagation();
+                    }, onMouseDown: (e) => directive === null || directive === void 0 ? void 0 : directive.handleDown(e), onTouchStart: (e) => directive === null || directive === void 0 ? void 0 : directive.handleDown(e), class: `resizable resizable-${props.active[p]}` }));
+            }
+        }
+        else {
+            for (let _p in props.active) {
+                resizeEls.push(h("div", { onClick: e => e.preventDefault(), onTouchStart: (e) => e.preventDefault(), onDblClick: e => {
+                        e.preventDefault();
+                        e.stopPropagation();
+                    }, class: `no-resize` }));
+            }
+        }
+    }
+    return (h("div", Object.assign({}, props, { ref: e => e && (directive === null || directive === void 0 ? void 0 : directive.set(e)) }),
+        children,
+        resizeEls));
+};
+
+const ON_COLUMN_CLICK = 'columnclick';
+const HEADER_NOT_DRAGGABLE_CLASS = 'rgHeaderCell-not-draggable';
+const HeaderCellRenderer = ({ data, props, additionalData }, children) => {
+    let colTemplate = (data === null || data === void 0 ? void 0 : data.name) || '';
+    let cellProps = props;
+    if (data === null || data === void 0 ? void 0 : data.columnTemplate) {
+        colTemplate = data.columnTemplate(h, data, additionalData);
+    }
+    if (data === null || data === void 0 ? void 0 : data.columnProperties) {
+        const extra = data.columnProperties(data);
+        if (extra) {
+            cellProps = doPropMerge(props, extra);
+        }
+    }
+    // 添加 data-draggable 属性
+    const dataAny = data;
+    const isDraggable = (dataAny === null || dataAny === void 0 ? void 0 : dataAny.draggable) !== false;
+    const mergedClass = typeof cellProps.class === 'string'
+        ? { [cellProps.class]: true }
+        : (cellProps.class || {});
+    const draggableClass = Object.assign(Object.assign({}, mergedClass), { [HEADER_NOT_DRAGGABLE_CLASS]: !isDraggable });
+    const resizeProps = Object.assign(Object.assign({}, cellProps), { class: draggableClass, 'data-draggable': isDraggable ? 'true' : 'false', onMouseDown(e) {
+            dispatch(e.currentTarget, ON_COLUMN_CLICK, {
+                data,
+                event: e,
+            });
+        } });
+    // 为 header-content 准备属性
+    const headerContentProps = {};
+    // 如果配置了 tooltip，添加 data-tooltip 属性
+    if (dataAny === null || dataAny === void 0 ? void 0 : dataAny.tooltip) {
+        headerContentProps['data-tooltip'] = dataAny.tooltip;
+    }
+    // 如果没有配置 tooltip 但有 name，默认使用 name 作为 tooltip
+    else if ((data === null || data === void 0 ? void 0 : data.name) && typeof data.name === 'string') {
+        headerContentProps['data-tooltip'] = data.name;
+    }
+    if (data === null || data === void 0 ? void 0 : data.uniqueId)
+        headerContentProps['revo-grid-uid'] = data.uniqueId;
+    return (h(ResizableElement, Object.assign({}, resizeProps),
+        h("div", Object.assign({ class: "header-content" }, headerContentProps), colTemplate),
+        children));
+};
+
+var defineProperty = (function() {
+  try {
+    var func = getNative(Object, 'defineProperty');
+    func({}, '', {});
+    return func;
+  } catch (e) {}
+}());
+
+/**
+ * The base implementation of `assignValue` and `assignMergeValue` without
+ * value checks.
+ *
+ * @private
+ * @param {Object} object The object to modify.
+ * @param {string} key The key of the property to assign.
+ * @param {*} value The value to assign.
+ */
+function baseAssignValue(object, key, value) {
+  if (key == '__proto__' && defineProperty) {
+    defineProperty(object, key, {
+      'configurable': true,
+      'enumerable': true,
+      'value': value,
+      'writable': true
+    });
+  } else {
+    object[key] = value;
+  }
+}
+
+/**
+ * A specialized version of `baseAggregator` for arrays.
+ *
+ * @private
+ * @param {Array} [array] The array to iterate over.
+ * @param {Function} setter The function to set `accumulator` values.
+ * @param {Function} iteratee The iteratee to transform keys.
+ * @param {Object} accumulator The initial aggregated object.
+ * @returns {Function} Returns `accumulator`.
+ */
+function arrayAggregator(array, setter, iteratee, accumulator) {
+  var index = -1,
+      length = array == null ? 0 : array.length;
+
+  while (++index < length) {
+    var value = array[index];
+    setter(accumulator, value, iteratee(value), array);
+  }
+  return accumulator;
+}
+
+/**
+ * Aggregates elements of `collection` on `accumulator` with keys transformed
+ * by `iteratee` and values set by `setter`.
+ *
+ * @private
+ * @param {Array|Object} collection The collection to iterate over.
+ * @param {Function} setter The function to set `accumulator` values.
+ * @param {Function} iteratee The iteratee to transform keys.
+ * @param {Object} accumulator The initial aggregated object.
+ * @returns {Function} Returns `accumulator`.
+ */
+function baseAggregator(collection, setter, iteratee, accumulator) {
+  baseEach(collection, function(value, key, collection) {
+    setter(accumulator, value, iteratee(value), collection);
+  });
+  return accumulator;
+}
+
+/**
+ * Creates a function like `_.groupBy`.
+ *
+ * @private
+ * @param {Function} setter The function to set accumulator values.
+ * @param {Function} [initializer] The accumulator object initializer.
+ * @returns {Function} Returns the new aggregator function.
+ */
+function createAggregator(setter, initializer) {
+  return function(collection, iteratee) {
+    var func = isArray(collection) ? arrayAggregator : baseAggregator,
+        accumulator = initializer ? initializer() : {};
+
+    return func(collection, setter, baseIteratee(iteratee), accumulator);
+  };
+}
+
+/**
+ * Creates an object composed of keys generated from the results of running
+ * each element of `collection` thru `iteratee`. The corresponding value of
+ * each key is the last element responsible for generating the key. The
+ * iteratee is invoked with one argument: (value).
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Collection
+ * @param {Array|Object} collection The collection to iterate over.
+ * @param {Function} [iteratee=_.identity] The iteratee to transform keys.
+ * @returns {Object} Returns the composed aggregate object.
+ * @example
+ *
+ * var array = [
+ *   { 'dir': 'left', 'code': 97 },
+ *   { 'dir': 'right', 'code': 100 }
+ * ];
+ *
+ * _.keyBy(array, function(o) {
+ *   return String.fromCharCode(o.code);
+ * });
+ * // => { 'a': { 'dir': 'left', 'code': 97 }, 'd': { 'dir': 'right', 'code': 100 } }
+ *
+ * _.keyBy(array, 'dir');
+ * // => { 'left': { 'dir': 'left', 'code': 97 }, 'right': { 'dir': 'right', 'code': 100 } }
+ */
+var keyBy = createAggregator(function(result, value, key) {
+  baseAssignValue(result, key, value);
+});
+
+const HeaderRenderer = (p) => {
+    var _a, _b, _c, _d, _e, _f, _g;
+    const cellClass = {
+        [HEADER_CLASS]: true,
+        [HEADER_SORTABLE_CLASS]: !!((_a = p.data) === null || _a === void 0 ? void 0 : _a.sortable),
+        'merged-header': !!p.merged,
+        'grouped-cell': !!p.isGrouped, // 添加编组标识类名
+        'last-column': !!p.isLastColumn, // 添加最后一列类名
+    };
+    if ((_b = p.data) === null || _b === void 0 ? void 0 : _b.order) {
+        cellClass[p.data.order] = true;
+    }
+    // 添加对齐类
+    if ((_c = p.data) === null || _c === void 0 ? void 0 : _c.headerAlign) {
+        cellClass[`align-${p.data.headerAlign}`] = true;
+    }
+    // 计算样式
+    const style = {
+        width: `${p.column.size}px`,
+        transform: `translateX(${p.column.start}px)`,
+    };
+    // 如果是合并单元格，设置高度（跨越多行）
+    // 使用 CSS 变量计算：单行表头高度 / 2 * (分组深度 + 1)
+    if (p.merged && p.groupingDepth) {
+        style.height = `calc(var(--rg-header-row-height, 45px) / 2 * ${p.groupingDepth + 1})`;
+    }
+    const dataProps = {
+        [DATA_COL]: p.column.itemIndex,
+        'data-grouping-depth': (_d = p.groupingDepth) !== null && _d !== void 0 ? _d : 0,
+        canResize: p.canResize,
+        minWidth: ((_e = p.data) === null || _e === void 0 ? void 0 : _e.minSize) || MIN_COL_SIZE,
+        maxWidth: (_f = p.data) === null || _f === void 0 ? void 0 : _f.maxSize,
+        active: p.active || ['r'],
+        class: cellClass,
+        style,
+        onResize: p.onResize,
+        onDblClick(originalEvent) {
+            var _a, _b;
+            // 检查列配置是否允许双击事件，默认为 true
+            if (((_a = p.data) === null || _a === void 0 ? void 0 : _a.canDblClick) === false) {
+                return;
+            }
+            // 检查是否点击在 resize 区域
+            const target = originalEvent.target;
+            // 1. 检查是否直接点击了 resize 元素
+            if (target.classList.contains('resizable') ||
+                target.classList.contains('resizable-r') ||
+                target.classList.contains('resizable-l') ||
+                target.classList.contains('no-resize')) {
+                return;
+            }
+            // 2. 检查是否点击在单元格右边缘的 resize 区域（14px范围）
+            const cell = target.closest('.rgHeaderCell');
+            if (cell) {
+                const rect = cell.getBoundingClientRect();
+                const clickX = originalEvent.clientX;
+                const resizeZoneWidth = 14;
+                // 如果点击位置在右边缘14px范围内，不触发双击
+                if (clickX >= rect.right - resizeZoneWidth) {
+                    return;
+                }
+            }
+            (_b = p.onDblClick) === null || _b === void 0 ? void 0 : _b.call(p, {
+                column: p.data,
+                index: p.column.itemIndex,
+                originalEvent,
+                providers: p.data.providers,
+            });
+        },
+        onClick(originalEvent) {
+            if (originalEvent.defaultPrevented || !p.onClick) {
+                return;
+            }
+            p.onClick({
+                column: p.data,
+                index: p.column.itemIndex,
+                originalEvent,
+                providers: p.data.providers,
+            });
+        },
+    };
+    if (p.range) {
+        if (p.column.itemIndex >= p.range.x && p.column.itemIndex <= p.range.x1) {
+            if (typeof dataProps.class === 'object') {
+                dataProps.class[FOCUS_CLASS] = true;
+            }
+        }
+    }
+    return (h(HeaderCellRenderer, { data: p.data, props: dataProps, additionalData: p.additionalData },
+        h(SortingSign, { column: p.data }),
+        p.canFilter && ((_g = p.data) === null || _g === void 0 ? void 0 : _g.filter) !== false ? (h(FilterButton, { column: p.data })) : ('')));
+};
+
+const HeaderGroupRenderer = (p) => {
+    const cellClass = {
+        [HEADER_CLASS]: true,
+        'group-header': true, // 编组表头专用类名
+        'last-column': !!p.isLastColumn, // 添加最后一列类名
+    };
+    const groupProps = {
+        [DATA_COL]: p.group.indexes[0], // 使用分组下第一个列的索引
+        canResize: p.canResize,
+        minWidth: p.group.indexes.length * MIN_COL_SIZE,
+        maxWidth: 0,
+        active: p.active || ['r'],
+        class: cellClass,
+        style: {
+            transform: `translateX(${p.start}px)`,
+            width: `${p.end - p.start}px`,
+        },
+        onResize: p.onResize,
+    };
+    return (h(HeaderCellRenderer, { data: Object.assign(Object.assign({}, p.group), { prop: '', providers: p.providers, index: p.start, draggable: false }), props: groupProps, additionalData: p.additionalData }));
+};
+
+export { HeaderRenderer as H, ON_COLUMN_CLICK as O, SortingSign as S, dispatchByEvent as a, HeaderGroupRenderer as b, dispatch as d, keyBy as k };
+//# sourceMappingURL=header-group-renderer.js.map
+
+//# sourceMappingURL=header-group-renderer.js.map