@canvas-components/list-table 0.3.38 → 0.3.39

package/dist/index.cjs

@@ -1684,7 +1684,7 @@ var ListTableDomHost = class {
     wrapper.style.position = "relative";
     wrapper.style.display = "flex";
     wrapper.style.flexDirection = "column";
-    wrapper.style.minWidth = "0";
+    wrapper.style.minWidth = "0px";
     wrapper.style.maxWidth = "100%";
     wrapper.style.boxSizing = "border-box";
     wrapper.style.overflow = "visible";
@@ -1693,7 +1693,7 @@ var ListTableDomHost = class {
     contentLayer.style.display = "flex";
     contentLayer.style.flexDirection = "column";
     contentLayer.style.flex = "1 1 auto";
-    contentLayer.style.minWidth = "0";
+    contentLayer.style.minWidth = "0px";
     contentLayer.style.width = "100%";
     contentLayer.style.boxSizing = "border-box";
     contentLayer.style.minHeight = "0";
@@ -1701,7 +1701,7 @@ var ListTableDomHost = class {
     const canvasHost = document.createElement("div");
     canvasHost.style.position = "relative";
     canvasHost.style.flex = "1 1 auto";
-    canvasHost.style.minWidth = "0";
+    canvasHost.style.minWidth = "0px";
     canvasHost.style.width = "100%";
     canvasHost.style.boxSizing = "border-box";
     canvasHost.style.minHeight = "0";
@@ -3197,6 +3197,7 @@ function hitTest(x, y, descriptors) {
     resizeEdge: matched.resizeEdge,
     cursor: matched.cursor,
     rect: interactionRect,
+    tooltipRect: resolveErrorTooltipRect(matched, owningCells),
     tooltipText: matched.tooltipText,
     tooltipVariant: matched.tooltipVariant,
     textSelectionText: matched.textSelectionText,
@@ -3211,6 +3212,18 @@ function hitTest(x, y, descriptors) {
     scrollbarRole: matched.scrollbarRole
   };
 }
+function resolveErrorTooltipRect(descriptor, owningCells) {
+  if (descriptor.tooltipVariant !== "error") {
+    return void 0;
+  }
+  if (descriptor.kind === "body") {
+    return descriptor.rect;
+  }
+  const candidates = owningCells.get(buildOwningCellKey(descriptor))?.filter((cell) => cell.kind === "body");
+  return (candidates?.find(
+    (cell) => cell.fixed === descriptor.fixed && cell.frozen === descriptor.frozen
+  ) ?? candidates?.[0])?.rect;
+}
 function resolveInteractionRect(matched, descriptors) {
   if (matched.contentKey !== "nested-table" || typeof matched.nestedRowIndex !== "number" || typeof matched.nestedColumnIndex !== "number" || matched.debugNodeType === "nested-table-cell") {
     return matched.rect;
@@ -3285,6 +3298,7 @@ function mapKindToArea(kind, actionType) {
   if (kind === "grouping-remove") {
     return "grouping-remove";
   }
+  if (kind === "group-toggle") return "group-toggle";
   if (kind === "body") {
     return "body";
   }
@@ -3365,6 +3379,8 @@ function getBasePriority(kind) {
       return 5;
     case "grouping-bar":
       return 2;
+    case "group-toggle":
+      return 3;
     case "resize-handle":
       return 4;
     // 折叠列图标覆盖列宽热区，但仍低于固定列表头的遮挡层（优先级 5）。
@@ -3407,6 +3423,7 @@ var BodyTooltipController = class {
     __publicField(this, "toViewportPoint");
     __publicField(this, "timer", null);
     __publicField(this, "tooltipKey", null);
+    __publicField(this, "tooltipPoint", null);
     this.tooltip = options.tooltip;
     this.delay = options.delay;
     this.toViewportPoint = options.toViewportPoint;
@@ -3430,6 +3447,7 @@ var BodyTooltipController = class {
       this.timer = null;
     }
     this.tooltipKey = null;
+    this.tooltipPoint = null;
     if (hideTooltip) {
       this.tooltip.hide();
     }
@@ -3439,17 +3457,24 @@ var BodyTooltipController = class {
       return false;
     }
     if (result.tooltipVariant === "error") {
-      this.clear();
-      this.tooltipKey = `${result.rowIndex}:${result.columnKey}:${result.tooltipText}`;
+      const rect = result.tooltipRect ?? result.rect;
+      const tooltipKey2 = `${result.rowIndex}:${result.columnKey}:${result.tooltipText}`;
       const tooltipPoint = this.toViewportPoint(
-        result.rect.x + result.rect.width / 2,
-        result.rect.y + result.rect.height + 8
+        rect.x + rect.width / 2,
+        rect.y + rect.height + 8
       );
+      if (this.tooltipKey === tooltipKey2 && this.tooltipPoint?.x === tooltipPoint.x && this.tooltipPoint.y === tooltipPoint.y) {
+        return true;
+      }
+      this.clear();
+      this.tooltipKey = tooltipKey2;
+      this.tooltipPoint = tooltipPoint;
       this.tooltip.show(
         tooltipPoint.x,
         tooltipPoint.y,
         result.tooltipText,
-        "error"
+        "error",
+        this.toViewportRect(rect)
       );
       return true;
     }
@@ -3471,12 +3496,26 @@ var BodyTooltipController = class {
         tooltipPoint.x,
         tooltipPoint.y,
         result.tooltipText,
-        result.tooltipVariant
+        result.tooltipVariant,
+        this.toViewportRect(result.rect)
       );
       this.timer = null;
     }, this.delay);
     return true;
   }
+  toViewportRect(rect) {
+    const topLeft = this.toViewportPoint(rect.x, rect.y);
+    const bottomRight = this.toViewportPoint(
+      rect.x + rect.width,
+      rect.y + rect.height
+    );
+    return {
+      x: topLeft.x,
+      y: topLeft.y,
+      width: bottomRight.x - topLeft.x,
+      height: bottomRight.y - topLeft.y
+    };
+  }
 };
 
 // src/features/scroll/scroll-session.ts
@@ -9762,32 +9801,39 @@ function drawBody(params) {
     scrollTop: params.scroll.top,
     rowOffsets
   });
-  drawSegmentRows(
-    params,
-    "center",
-    params.centerColumns,
-    startRowIndex,
-    endRowIndex,
-    rowOffsets
-  );
-  drawSegmentRows(
-    params,
-    "left",
-    params.leftColumns,
-    startRowIndex,
-    endRowIndex,
-    rowOffsets
-  );
-  drawSegmentRows(
-    params,
-    "right",
-    params.rightColumns,
-    startRowIndex,
-    endRowIndex,
-    rowOffsets
-  );
-  drawGroupRowsOverlay(params, startRowIndex, endRowIndex, rowOffsets);
-  drawExpandedRowsOverlay(params, startRowIndex, endRowIndex, rowOffsets);
+  const animation = params.groupHeightAnimation;
+  const splitIndex = animation && animation.progress < 1 ? Array.from(
+    { length: endRowIndex - startRowIndex },
+    (_, offset) => startRowIndex + offset
+  ).find(
+    (index) => (params.rowIndexMap?.[index] ?? index) >= animation.endRowIndex
+  ) ?? endRowIndex : endRowIndex;
+  const drawRange = (start, end) => {
+    drawSegmentRows(
+      params,
+      "center",
+      params.centerColumns,
+      start,
+      end,
+      rowOffsets
+    );
+    drawSegmentRows(params, "left", params.leftColumns, start, end, rowOffsets);
+    drawSegmentRows(
+      params,
+      "right",
+      params.rightColumns,
+      start,
+      end,
+      rowOffsets
+    );
+    drawGroupRowsOverlay(params, start, end, rowOffsets);
+    drawExpandedRowsOverlay(params, start, end, rowOffsets);
+  };
+  drawRange(startRowIndex, splitIndex);
+  if (animation && animation.progress < 1) {
+    drawGroupAnimationMask(params, animation);
+    drawRange(splitIndex, endRowIndex);
+  }
   if (params.dragReorder) {
     drawDragGhostColumn(params);
   }
@@ -10394,6 +10440,15 @@ function drawGroupRowsOverlay(params, startRowIndex, endRowIndex, rowOffsets) {
   if (layout.clipRect.width <= 0) {
     return;
   }
+  const rowSelectorColumn = [
+    ...params.leftColumns,
+    ...params.centerColumns
+  ].find((column) => column.key === ROW_SELECTOR_COLUMN_KEY);
+  const contentLeft = Math.max(
+    layout.clipRect.x,
+    rowSelectorColumn ? rowSelectorColumn.drawX + rowSelectorColumn.width : layout.clipRect.x
+  );
+  const contentRight = layout.clipRect.x + layout.clipRect.width;
   const { ctx } = params;
   ctx.save();
   ctx.beginPath();
@@ -10425,7 +10480,22 @@ function drawGroupRowsOverlay(params, startRowIndex, endRowIndex, rowOffsets) {
     ctx.fillStyle = params.theme.headerBackgroundColor;
     ctx.fillRect(rect.x, rect.y, rect.width, rect.height);
     drawGridRect(ctx, rect, params.theme, params.theme.borderColor);
-    const textX = Math.max(rect.x, layout.clipRect.x) + 12 + Math.max(row.depth, 0) * 18;
+    if (contentLeft >= contentRight) continue;
+    const triggerRect = {
+      x: contentLeft + CONTENT_HORIZONTAL_PADDING + Math.max(row.depth, 0) * 18,
+      y: rect.y + Math.max((rect.height - EXPAND_TRIGGER_SIZE) / 2, 0),
+      width: EXPAND_TRIGGER_SIZE,
+      height: EXPAND_TRIGGER_SIZE
+    };
+    paintExpandTrigger({
+      ctx,
+      rect: triggerRect,
+      expanded: row.expanded,
+      animationProgress: params.getGroupAnimationProgress?.(row.rowKey),
+      color: params.theme.headerTextColor,
+      borderColor: params.theme.borderColor
+    });
+    const textX = triggerRect.x + triggerRect.width + EXPAND_TRIGGER_GAP;
     ctx.fillStyle = params.theme.headerTextColor;
     ctx.font = `${params.theme.headerFontWeight} ${params.theme.fontSize}px ${params.theme.fontFamily}`;
     ctx.textAlign = "left";
@@ -10436,9 +10506,73 @@ function drawGroupRowsOverlay(params, startRowIndex, endRowIndex, rowOffsets) {
       rect.y + rect.height / 2,
       Math.max(layout.clipRect.x + layout.clipRect.width - textX - 12, 0)
     );
+    params.descriptors.push({
+      kind: "group-toggle",
+      rect: {
+        x: contentLeft,
+        y: rect.y,
+        width: contentRight - contentLeft,
+        height: rect.height
+      },
+      contentKey: row.rowKey,
+      cursor: "pointer",
+      tooltipText: row.expanded ? "\u6298\u53E0\u5206\u7EC4" : "\u5C55\u5F00\u5206\u7EC4",
+      debugNodeType: "group-toggle"
+    });
   }
   ctx.restore();
 }
+function drawGroupAnimationMask(params, animation) {
+  const { ctx } = params;
+  const clipRect = resolveExpandedRowsOverlayLayout(params).clipRect;
+  if (clipRect.width <= 0) return;
+  const contentTop = params.bodyTop + animation.startOffset + params.rowHeight - params.scroll.top;
+  const contentBottom = Math.min(
+    contentTop + animation.contentHeight,
+    params.bodyTop + params.bodyHeight
+  );
+  const visibleBottom = contentTop + animation.contentHeight * animation.progress;
+  if (contentBottom > contentTop && visibleBottom < contentBottom) {
+    ctx.save();
+    ctx.beginPath();
+    ctx.rect(
+      clipRect.x,
+      contentTop,
+      clipRect.width,
+      contentBottom - contentTop
+    );
+    ctx.clip();
+    ctx.fillStyle = params.theme.backgroundColor;
+    ctx.globalAlpha = (1 - animation.progress) * 0.35;
+    ctx.fillRect(
+      clipRect.x,
+      contentTop,
+      clipRect.width,
+      contentBottom - contentTop
+    );
+    ctx.globalAlpha = 1;
+    ctx.fillRect(
+      clipRect.x,
+      visibleBottom,
+      clipRect.width,
+      contentBottom - visibleBottom
+    );
+    ctx.restore();
+    params.descriptors.forEach((descriptor) => {
+      const bounds = descriptor.rect;
+      if (bounds.y >= contentBottom || bounds.y + bounds.height <= contentTop || bounds.x >= clipRect.x + clipRect.width || bounds.x + bounds.width <= clipRect.x) {
+        return;
+      }
+      descriptor.rect = {
+        ...bounds,
+        height: Math.max(
+          Math.min(bounds.y + bounds.height, visibleBottom) - bounds.y,
+          0
+        )
+      };
+    });
+  }
+}
 function buildSpanConfigMap(rows, columns, rowIndexMap) {
   const spanConfigMap = /* @__PURE__ */ new Map();
   rows.forEach((record, rowIndex) => {
@@ -10807,8 +10941,27 @@ function drawExpandTrigger(params) {
     width: EXPAND_TRIGGER_SIZE,
     height: EXPAND_TRIGGER_SIZE
   };
-  const lines = resolveExpandTriggerLines({
+  paintExpandTrigger({
+    ctx,
+    rect: triggerRect,
+    expanded,
+    animationProgress,
+    color,
+    borderColor
+  });
+  descriptors.push({
+    kind: "expand-trigger",
     rect: triggerRect,
+    rowIndex,
+    columnKey,
+    cursor: "pointer"
+  });
+  return triggerRect;
+}
+function paintExpandTrigger(params) {
+  const { ctx, rect, expanded, animationProgress, color, borderColor } = params;
+  const lines = resolveExpandTriggerLines({
+    rect,
     progress: typeof animationProgress === "number" ? animationProgress : expanded ? 1 : 0
   });
   ctx.save();
@@ -10816,7 +10969,7 @@ function drawExpandTrigger(params) {
   ctx.strokeStyle = borderColor;
   ctx.lineWidth = 1;
   ctx.beginPath();
-  appendRoundedRectPath2(ctx, triggerRect, 2);
+  appendRoundedRectPath2(ctx, rect, 2);
   ctx.fill();
   ctx.stroke();
   ctx.strokeStyle = color;
@@ -10831,14 +10984,6 @@ function drawExpandTrigger(params) {
   }
   ctx.stroke();
   ctx.restore();
-  descriptors.push({
-    kind: "expand-trigger",
-    rect: triggerRect,
-    rowIndex,
-    columnKey,
-    cursor: "pointer"
-  });
-  return triggerRect;
 }
 function resolveExpandTriggerLines(params) {
   const { rect } = params;
@@ -20315,9 +20460,15 @@ function resolveCollapsedRowRange(params) {
 
 // src/engine/controllers/animation-controller.ts
 var ROW_EXPAND_ANIMATION_DURATION = 240;
+var GROUPING_REMOVE_HOVER_DURATION = 180;
 var ROW_SORT_ANIMATION_DURATION = 420;
 var ListTableAnimationController = class {
   constructor(options) {
+    __publicField(this, "groupingRemoveAnimations", /* @__PURE__ */ new Map());
+    __publicField(this, "groupingRemoveHoverKey", null);
+    __publicField(this, "groupingRemoveFrameId", null);
+    __publicField(this, "groupAnimations", /* @__PURE__ */ new Map());
+    __publicField(this, "groupAnimationFrameId", null);
     __publicField(this, "pendingSortRowPositions", null);
     __publicField(this, "sortRowsReady", false);
     __publicField(this, "runtime");
@@ -20564,6 +20715,125 @@ var ListTableAnimationController = class {
     }
     return getRowAnimationValue(animation, this.scheduler.now());
   }
+  /** 启动分组子行的显隐动画，折叠完成后再移除子行。 */
+  startGroupAnimation(rowKey, expanded, geometry, onCollapseComplete) {
+    const now2 = this.scheduler.now();
+    const active = this.groupAnimations.get(rowKey);
+    const from = active ? getRowAnimationValue(active, now2) : expanded ? 0 : 1;
+    const to = expanded ? 1 : 0;
+    this.groupAnimations.set(rowKey, {
+      from,
+      to,
+      startTime: now2,
+      duration: ROW_EXPAND_ANIMATION_DURATION,
+      ...geometry,
+      onCollapseComplete
+    });
+    this.ensureGroupAnimationFrame();
+  }
+  getGroupAnimationProgress(rowKey) {
+    const animation = this.groupAnimations.get(rowKey);
+    return animation ? getRowAnimationValue(animation, this.scheduler.now()) : void 0;
+  }
+  getGroupAnimationTarget(rowKey) {
+    return this.groupAnimations.get(rowKey)?.to;
+  }
+  getGroupHeightAnimation() {
+    const first = this.groupAnimations.entries().next().value;
+    if (!first) return void 0;
+    const [rowKey, animation] = first;
+    return {
+      rowKey,
+      startOffset: animation.startOffset,
+      contentHeight: animation.contentHeight,
+      endRowIndex: animation.endRowIndex,
+      progress: getRowAnimationValue(animation, this.scheduler.now())
+    };
+  }
+  /** 根据分组栏移除图标的悬停位置启动或反向播放旋转动画。 */
+  reconcileGroupingRemoveHover(hover) {
+    const nextKey = hover.area === "grouping-remove" ? hover.columnKey : null;
+    if (nextKey === this.groupingRemoveHoverKey) return;
+    const now2 = this.scheduler.now();
+    const previousKey = this.groupingRemoveHoverKey;
+    if (previousKey) {
+      const active = this.groupingRemoveAnimations.get(previousKey);
+      this.groupingRemoveAnimations.set(previousKey, {
+        from: active ? getRowAnimationValue(active, now2) : 1,
+        to: 0,
+        startTime: now2,
+        duration: GROUPING_REMOVE_HOVER_DURATION
+      });
+    }
+    this.groupingRemoveHoverKey = nextKey;
+    if (nextKey) {
+      const active = this.groupingRemoveAnimations.get(nextKey);
+      this.groupingRemoveAnimations.set(nextKey, {
+        from: active ? getRowAnimationValue(active, now2) : 0,
+        to: 1,
+        startTime: now2,
+        duration: GROUPING_REMOVE_HOVER_DURATION
+      });
+    }
+    this.ensureGroupingRemoveFrame();
+  }
+  getGroupingRemoveAnimationProgress(columnKey) {
+    const animation = this.groupingRemoveAnimations.get(columnKey);
+    return animation ? getRowAnimationValue(animation, this.scheduler.now()) : columnKey === this.groupingRemoveHoverKey ? 1 : 0;
+  }
+  ensureGroupingRemoveFrame() {
+    if (this.groupingRemoveAnimations.size === 0 || this.groupingRemoveFrameId != null)
+      return;
+    this.groupingRemoveFrameId = this.scheduler.requestAnimationFrame(() => {
+      this.groupingRemoveFrameId = null;
+      const now2 = this.scheduler.now();
+      for (const [key, animation] of this.groupingRemoveAnimations) {
+        if (now2 - animation.startTime >= animation.duration) {
+          this.groupingRemoveAnimations.delete(key);
+        }
+      }
+      this.requestRender();
+      this.ensureGroupingRemoveFrame();
+    });
+  }
+  stopGroupingRemoveAnimation() {
+    if (this.groupingRemoveFrameId != null) {
+      this.scheduler.cancelAnimationFrame(this.groupingRemoveFrameId);
+      this.groupingRemoveFrameId = null;
+    }
+    this.groupingRemoveAnimations.clear();
+    this.groupingRemoveHoverKey = null;
+  }
+  ensureGroupAnimationFrame() {
+    if (this.groupAnimations.size === 0 || this.groupAnimationFrameId != null) {
+      return;
+    }
+    this.groupAnimationFrameId = this.scheduler.requestAnimationFrame(() => {
+      this.groupAnimationFrameId = null;
+      const now2 = this.scheduler.now();
+      for (const [rowKey, animation] of this.groupAnimations) {
+        if (now2 - animation.startTime < animation.duration) continue;
+        this.groupAnimations.delete(rowKey);
+        if (animation.to === 0) animation.onCollapseComplete?.();
+      }
+      this.requestRender();
+      this.ensureGroupAnimationFrame();
+    });
+  }
+  stopGroupAnimations() {
+    if (this.groupAnimationFrameId != null) {
+      this.scheduler.cancelAnimationFrame(this.groupAnimationFrameId);
+      this.groupAnimationFrameId = null;
+    }
+    this.groupAnimations.clear();
+  }
+  finishGroupAnimations() {
+    const pending = [...this.groupAnimations.values()];
+    this.stopGroupAnimations();
+    pending.forEach((animation) => {
+      if (animation.to === 0) animation.onCollapseComplete?.();
+    });
+  }
   getCollapseRowOffset(rowKey) {
     const key = String(rowKey);
     const now2 = this.scheduler.now();
@@ -21070,6 +21340,8 @@ var ListTableAnimationController = class {
     this.sortRowsReady = false;
   }
   destroy() {
+    this.stopGroupingRemoveAnimation();
+    this.stopGroupAnimations();
     this.stopScrollbarOpacityAnimation();
     this.stopSwapAnimation();
     this.scrollAnimationController.destroy();
@@ -21085,6 +21357,8 @@ var ListTableAnimationController = class {
    * 停止所有动画循环（销毁前调用）。
    */
   stopAll() {
+    this.stopGroupingRemoveAnimation();
+    this.stopGroupAnimations();
     this.stopCarouselScroll();
     this.stopScrollToAnimation();
     this.stopWheelScrollSmoothing();
@@ -22181,6 +22455,7 @@ function openCellEditingSession(params) {
     fontFamily: theme.fontFamily,
     textColor: theme.textColor,
     cellColor: column.cellStyle?.color,
+    textAlign: column.cellStyle?.textAlign ?? column.align,
     paddingInline,
     paddingBlock,
     contentZoom: zoom
@@ -22821,7 +23096,7 @@ var ListTableEditingController = class {
         await this.validateCellTargets(rowIndex, columnKey);
       }
     }
-    const values = this.options.getDisplayData();
+    const values = this.options.getAllDisplayData();
     const leafColumns = this.options.getLeafColumns();
     const tableOptions = this.options.getOptions();
     const taskId = ++this.validationTaskId;
@@ -23564,7 +23839,10 @@ var groupedRowsCache = /* @__PURE__ */ new WeakMap();
 function flattenGroupedRows(params) {
   const startedAt = resolvePerformanceNow2();
   const cached = groupedRowsCache.get(params.rows);
-  if (cached && areSameStringArray(cached.groupColumnKeys, params.groupColumnKeys) && areSameKeyArray(cached.expandedRowKeys, params.expandedRowKeys) && cached.rowKey === params.options.rowKey && cached.expandable === params.options.expandable) {
+  if (cached && areSameStringArray(cached.groupColumnKeys, params.groupColumnKeys) && areSameKeyArray(cached.expandedRowKeys, params.expandedRowKeys) && areSameStringArray(
+    cached.collapsedGroupKeys,
+    params.collapsedGroupKeys ?? []
+  ) && cached.rowKey === params.options.rowKey && cached.expandable === params.options.expandable) {
     return cached.visibleRows;
   }
   const groupColumns = params.groupColumnKeys.map((key) => params.leafColumns.find((column) => column.key === key)).filter(
@@ -23586,6 +23864,7 @@ function flattenGroupedRows(params) {
     groupedRowsCache.set(params.rows, {
       groupColumnKeys: [...params.groupColumnKeys],
       expandedRowKeys: [...params.expandedRowKeys],
+      collapsedGroupKeys: [...params.collapsedGroupKeys ?? []],
       rowKey: params.options.rowKey,
       expandable: params.options.expandable,
       visibleRows: visibleRows2
@@ -23593,6 +23872,7 @@ function flattenGroupedRows(params) {
     return visibleRows2;
   }
   const visibleRows = [];
+  const collapsedGroupKeys = new Set(params.collapsedGroupKeys);
   let dataRowOffset = 0;
   let hasExpandedRows = false;
   let groupedRowCount = 0;
@@ -23649,20 +23929,32 @@ function flattenGroupedRows(params) {
     buckets.forEach((bucket) => {
       const serializedValue = serializeGroupValue(bucket.value);
       const nextKeyPath = [...keyPath, `${column.key}:${serializedValue}`];
+      const rowKey = `__list_table_group__${nextKeyPath.join("/")}`;
+      const expanded = !collapsedGroupKeys.has(rowKey);
       visibleRows.push({
         kind: "group",
         record: bucket.rows[0],
-        rowKey: `__list_table_group__${nextKeyPath.join("/")}`,
+        rowKey,
         groupColumnKey: column.key,
         columnTitle: column.title,
         value: bucket.value,
         valueText: formatGroupValue(bucket.value),
         count: bucket.rows.length,
         depth,
+        expanded,
         sourceDataRowIndex: dataRowOffset
       });
       groupedRowCount += 1;
-      visit(bucket.rows, depth + 1, nextKeyPath);
+      if (expanded) visit(bucket.rows, depth + 1, nextKeyPath);
+      else if (!params.options.expandable || params.expandedRowKeys.length === 0) {
+        dataRowOffset += bucket.rows.length;
+      } else {
+        dataRowOffset += flattenExpandableRows({
+          options: params.options,
+          rows: bucket.rows,
+          expandedRowKeys: params.expandedRowKeys
+        }).filter((row) => row.kind === "data").length;
+      }
     });
   };
   visit(params.rows, 0, []);
@@ -23672,6 +23964,7 @@ function flattenGroupedRows(params) {
   groupedRowsCache.set(params.rows, {
     groupColumnKeys: [...params.groupColumnKeys],
     expandedRowKeys: [...params.expandedRowKeys],
+    collapsedGroupKeys: [...params.collapsedGroupKeys ?? []],
     rowKey: params.options.rowKey,
     expandable: params.options.expandable,
     visibleRows
@@ -24013,9 +24306,14 @@ function areSameGroupColumnAccessors(left, right) {
 function buildListTableGroupVisibilityPlan(params) {
   const nodeVisibility = /* @__PURE__ */ new WeakMap();
   const collapsedKeySet = new Set(params.collapsedRowKeys);
+  const collapsedGroupKeySet = new Set(params.collapsedGroupKeys);
   const excludedKeySet = new Set(params.excludedRowKeys);
   const collapsedDataRowIndexes = [];
   const visit = (node, isRoot = false) => {
+    if (!isRoot && collapsedGroupKeySet.has(node.nodeKey)) {
+      nodeVisibility.set(node, { visibleRowCount: 1 });
+      return 1;
+    }
     if (node.sourceIndexes) {
       const hiddenDataIndexes = [];
       node.sourceIndexes.forEach((sourceIndex, index) => {
@@ -24050,6 +24348,7 @@ function buildListTableGroupVisibilityPlan(params) {
     index: params.index,
     rowKey: params.options.rowKey,
     collapsedRowKeys: [...params.collapsedRowKeys],
+    collapsedGroupKeys: [...params.collapsedGroupKeys ?? []],
     excludedRowKeys: [...params.excludedRowKeys ?? []],
     nodeVisibility,
     visibleRowCount,
@@ -24167,58 +24466,117 @@ function resolveListTableGroupVisibleRowWindow(params) {
   const baseRowCount = params.visibilityPlan?.visibleRowCount ?? params.index.visibleRowCount;
   const totalRowCount = params.expandedRowPlan?.totalRowCount ?? baseRowCount;
   const overscan = params.overscan ?? 3;
-  const start = params.expandedRowPlan?.entries.length ? Math.max(
-    resolveBaseRowIndexAtOffset(
-      params.expandedRowPlan,
-      params.scrollTop,
-      params.rowHeight
-    ) - overscan,
-    0
-  ) : Math.max(Math.floor(params.scrollTop / params.rowHeight) - overscan, 0);
-  const end = params.expandedRowPlan?.entries.length ? Math.min(
-    resolveBaseRowIndexAtOffset(
-      params.expandedRowPlan,
-      params.scrollTop + params.bodyHeight,
-      params.rowHeight
-    ) + overscan + 2,
-    baseRowCount
-  ) : Math.min(
-    Math.ceil((params.scrollTop + params.bodyHeight) / params.rowHeight) + overscan + 1,
+  const animation = params.heightAnimation;
+  const removedHeight = animation ? animation.contentHeight * (1 - animation.progress) : 0;
+  const fullEndOffset = animation ? animation.startOffset + params.rowHeight + animation.contentHeight : 0;
+  const visualEndOffset = fullEndOffset - removedHeight;
+  const viewportEnd = params.scrollTop + params.bodyHeight;
+  const pixelRanges = animation && removedHeight > 1e-3 ? [
+    ...params.scrollTop < visualEndOffset ? [
+      [
+        params.scrollTop,
+        Math.min(viewportEnd, visualEndOffset)
+      ]
+    ] : [],
+    ...viewportEnd > visualEndOffset ? [
+      [
+        Math.max(params.scrollTop, visualEndOffset) + removedHeight,
+        viewportEnd + removedHeight
+      ]
+    ] : []
+  ] : [[params.scrollTop, viewportEnd]];
+  const rowRanges = animation && removedHeight > 1e-3 ? pixelRanges.map(([from, to]) => ({
+    start: Math.max(
+      resolveBaseRowIndexAtOffset(
+        params.expandedRowPlan,
+        from,
+        params.rowHeight
+      ) - overscan,
+      0
+    ),
+    end: Math.min(
+      resolveBaseRowIndexAtOffset(
+        params.expandedRowPlan,
+        to,
+        params.rowHeight
+      ) + overscan + 2,
+      baseRowCount
+    )
+  })) : [
+    {
+      start: params.expandedRowPlan?.entries.length ? Math.max(
+        resolveBaseRowIndexAtOffset(
+          params.expandedRowPlan,
+          params.scrollTop,
+          params.rowHeight
+        ) - overscan,
+        0
+      ) : Math.max(
+        Math.floor(params.scrollTop / params.rowHeight) - overscan,
+        0
+      ),
+      end: params.expandedRowPlan?.entries.length ? Math.min(
+        resolveBaseRowIndexAtOffset(
+          params.expandedRowPlan,
+          viewportEnd,
+          params.rowHeight
+        ) + overscan + 2,
+        baseRowCount
+      ) : Math.min(
+        Math.ceil(viewportEnd / params.rowHeight) + overscan + 1,
+        baseRowCount
+      )
+    }
+  ];
+  const start = Math.min(
+    ...rowRanges.map((range) => range.start),
     baseRowCount
   );
+  const end = Math.max(...rowRanges.map((range) => range.end), 0);
   const rows = [];
   const rowIndexMap = [];
   const rowOffsetMap = [];
-  visitNodeChildren({
-    parent: params.index.root,
-    parentStart: 0,
-    sourceRows: params.index.sourceRows,
-    options: params.options,
-    start,
-    end,
-    visibilityPlan: params.visibilityPlan,
-    expandedRowPlan: params.expandedRowPlan,
-    push: (row, baseRowIndex) => {
-      rows.push(row);
-      const expanded = row.kind === "expanded";
-      rowIndexMap.push(
-        resolveRenderedRowIndex(params.expandedRowPlan, baseRowIndex, expanded)
-      );
-      rowOffsetMap.push(
-        resolveBaseRowOffset(
+  const seen = /* @__PURE__ */ new Set();
+  rowRanges.forEach(
+    (range) => visitNodeChildren({
+      parent: params.index.root,
+      parentStart: 0,
+      sourceRows: params.index.sourceRows,
+      options: params.options,
+      start: range.start,
+      end: range.end,
+      visibilityPlan: params.visibilityPlan,
+      expandedRowPlan: params.expandedRowPlan,
+      push: (row, baseRowIndex) => {
+        const key = `${baseRowIndex}:${row.kind}`;
+        if (seen.has(key)) return;
+        seen.add(key);
+        rows.push(row);
+        const expanded = row.kind === "expanded";
+        rowIndexMap.push(
+          resolveRenderedRowIndex(
+            params.expandedRowPlan,
+            baseRowIndex,
+            expanded
+          )
+        );
+        const baseOffset = resolveBaseRowOffset(
           params.expandedRowPlan,
           baseRowIndex,
           params.rowHeight
-        ) + (expanded ? params.rowHeight : 0)
-      );
-    }
-  });
+        ) + (expanded ? params.rowHeight : 0);
+        rowOffsetMap.push(
+          baseOffset - (animation && baseOffset >= fullEndOffset ? removedHeight : 0)
+        );
+      }
+    })
+  );
   return {
     rows,
     start,
     end,
     totalRowCount,
-    totalBodyHeight: params.expandedRowPlan?.totalBodyHeight ?? totalRowCount * params.rowHeight,
+    totalBodyHeight: (params.expandedRowPlan?.totalBodyHeight ?? totalRowCount * params.rowHeight) - removedHeight,
     dataRowCount: params.index.dataRowCount,
     rowIndexMap,
     rowOffsetMap
@@ -24259,11 +24617,15 @@ function visitNodeChildren(params) {
           valueText: node.valueText,
           count: node.count,
           depth: node.depth,
+          expanded: !params.visibilityPlan?.collapsedGroupKeys.includes(
+            node.nodeKey
+          ),
           sourceDataRowIndex: node.firstDataRowIndex
         },
         nodeStart
       );
     }
+    if (nodeRowCount === 1) continue;
     if (node.children) {
       visitNodeChildren({ ...params, parent: node, parentStart: nodeStart });
       continue;
@@ -24930,6 +25292,7 @@ function buildListTableGroupExpandedRowPlan(params) {
   }
   const visit = (nodes, parent, parentStart) => {
     nodes.forEach((node, nodeIndex) => {
+      if (params.visibilityPlan?.collapsedGroupKeys.includes(node.nodeKey)) return;
       const nodeStart = parentStart + (getGroupNodeChildRowOffsets(params.visibilityPlan, parent)[nodeIndex] ?? 0);
       if (node.children) {
         visit(node.children, node, nodeStart);
@@ -25147,6 +25510,7 @@ function buildListTableRenderSnapshot(params) {
   });
   const groupColumnKeys = params.groupColumnKeys ?? [];
   const collapsedRowKeys = params.collapsedRowKeys ?? [];
+  const collapsedGroupKeys = params.collapsedGroupKeys ?? [];
   const expandedRowKeys = params.expandedRowKeys ?? expandableState.expandedRowKeys;
   const canUsePlainRowWindow = groupColumnKeys.length === 0 && expandedRowKeys.length === 0 && collapsedRowKeys.length === 0 && frozenRows.topRowKeys.length === 0 && frozenRows.bottomRowKeys.length === 0;
   const plainRowWindow = canUsePlainRowWindow ? resolvePlainVisibleRowWindow({
@@ -25185,6 +25549,7 @@ function buildListTableRenderSnapshot(params) {
     index: groupIndex,
     options,
     collapsedRowKeys,
+    collapsedGroupKeys,
     excludedRowKeys: [
       ...frozenRows.topRowKeys,
       ...frozenRows.bottomRowKeys
@@ -25249,16 +25614,27 @@ function buildListTableRenderSnapshot(params) {
     rows: [...indexedFrozenRows.top, ...indexedFrozenRows.bottom],
     rowHeight
   }) : 0;
+  const groupWindowBodyHeight = Math.max(
+    initialBodyLayout.bodyAreaHeight - indexedFrozenHeight,
+    0
+  );
+  const groupWindowTotalHeight = groupExpandedRowPlan?.totalBodyHeight ?? (groupVisibilityPlan?.visibleRowCount ?? groupIndex?.visibleRowCount ?? 0) * rowHeight;
+  const groupAnimationRemovedHeight = params.groupHeightAnimation ? params.groupHeightAnimation.contentHeight * (1 - params.groupHeightAnimation.progress) : 0;
+  const groupWindowScrollTop = Math.min(
+    Math.max(scroll.top, 0),
+    Math.max(
+      groupWindowTotalHeight - groupAnimationRemovedHeight - groupWindowBodyHeight,
+      0
+    )
+  );
   const groupVisibleWindow = canMaterializeGroupIndex ? resolveListTableGroupVisibleRowWindow({
     index: groupIndex,
     options,
-    scrollTop: scroll.top,
-    bodyHeight: Math.max(
-      initialBodyLayout.bodyAreaHeight - indexedFrozenHeight,
-      0
-    ),
+    scrollTop: groupWindowScrollTop,
+    bodyHeight: groupWindowBodyHeight,
     rowHeight,
     visibilityPlan: groupVisibilityPlan,
+    heightAnimation: params.groupHeightAnimation,
     expandedRowPlan: hasExpandedDetailRows ? groupExpandedRowPlan : void 0
   }) : void 0;
   const isGroupIndexBuilding = canUseGroupIndex && params.useAsyncGroupIndex === true && !groupIndex && expandedRowKeys.length === 0;
@@ -25267,7 +25643,8 @@ function buildListTableRenderSnapshot(params) {
     rows: queryRows.displayRows,
     leafColumns: sourceLeafColumns,
     groupColumnKeys,
-    expandedRowKeys
+    expandedRowKeys,
+    collapsedGroupKeys
   }).map(measureExpandedRow);
   if (autoRowHeight) {
     visibleRows.forEach((row) => {
@@ -25325,16 +25702,25 @@ function buildListTableRenderSnapshot(params) {
       bottomFrozenRowCount: indexedFrozenRows.bottom.length,
       scrollRowCount: groupVisibleWindow.totalRowCount
     })
-  } : resolveFrozenBodyRenderState({
-    visibleRows: filteredVisibleRows,
-    frozenState: frozenRows,
-    getRowKey: (row) => row.kind === "data" ? row.rowKey : null,
-    height: contentHeight,
+  } : resolveGroupedFallbackAnimation(
+    resolveFrozenBodyRenderState({
+      visibleRows: filteredVisibleRows,
+      frozenState: frozenRows,
+      getRowKey: (row) => row.kind === "data" ? row.rowKey : null,
+      height: contentHeight,
+      headerHeight,
+      summaryRowHeight,
+      hasSummary,
+      rowHeight
+    }),
+    params.groupHeightAnimation,
+    rowHeight,
+    contentHeight,
     headerHeight,
     summaryRowHeight,
     hasSummary,
-    rowHeight
-  });
+    scroll.top
+  );
   let bodyState = resolveCurrentBodyState();
   if (plainRowWindow) {
     bodyState.frozenRows.scroll.windowed = true;
@@ -25456,6 +25842,7 @@ function buildListTableRenderSnapshot(params) {
     groupVisibleWindow,
     groupVisibilityPlan,
     groupExpandedRowPlan,
+    groupHeightAnimation: params.groupHeightAnimation,
     dataRowCount,
     collapsedRowCount,
     collapsedDataRowIndexes,
@@ -25538,9 +25925,76 @@ function resolveGroupIndex(params) {
   }
   return void 0;
 }
+function resolveGroupedFallbackAnimation(state, animation, rowHeight, height, headerHeight, summaryRowHeight, hasSummary, requestedScrollTop) {
+  if (!animation || animation.contentHeight <= 0) return state;
+  const section = state.frozenRows.scroll;
+  const sourceRows = section.rows;
+  const offsets = getVisibleRowOffsets(sourceRows, rowHeight);
+  const getOffset = (index) => offsets?.[index] ?? index * rowHeight;
+  const findIndex = (offset) => offsets ? resolveVisibleRowIndexAtOffset(offsets, offset) : Math.max(Math.floor(offset / rowHeight), 0);
+  const removedHeight = animation.contentHeight * (1 - animation.progress);
+  const fullEnd = animation.startOffset + rowHeight + animation.contentHeight;
+  const visualEnd = fullEnd - removedHeight;
+  const scrollTop = Math.min(
+    Math.max(
+      0,
+      state.bodyLayout.totalBodyHeight - removedHeight - state.bodyLayout.scrollBodyHeight
+    ),
+    Math.max(requestedScrollTop, 0)
+  );
+  const viewportTop = scrollTop;
+  const viewportBottom = viewportTop + state.bodyLayout.scrollBodyHeight;
+  const ranges = [
+    ...viewportTop < visualEnd ? [[viewportTop, Math.min(viewportBottom, visualEnd)]] : [],
+    ...viewportBottom > visualEnd ? [
+      [
+        Math.max(viewportTop, visualEnd) + removedHeight,
+        viewportBottom + removedHeight
+      ]
+    ] : []
+  ];
+  const rows = [];
+  const rowIndexMap = [];
+  const rowOffsetMap = [];
+  const seen = /* @__PURE__ */ new Set();
+  ranges.forEach(([from, to]) => {
+    const start = Math.max(findIndex(from) - 3, 0);
+    const end = Math.min(findIndex(to) + 5, sourceRows.length);
+    for (let index = start; index < end; index += 1) {
+      if (seen.has(index)) continue;
+      seen.add(index);
+      rows.push(sourceRows[index]);
+      rowIndexMap.push(section.rowIndexMap?.[index] ?? index);
+      const baseOffset = getOffset(index);
+      rowOffsetMap.push(
+        baseOffset - (baseOffset >= fullEnd ? removedHeight : 0)
+      );
+    }
+  });
+  return {
+    ...state,
+    frozenRows: {
+      ...state.frozenRows,
+      scroll: { rows, rowIndexMap, rowOffsetMap, windowed: true }
+    },
+    bodyLayout: resolveBodyLayout({
+      height,
+      headerHeight,
+      summaryRowHeight,
+      hasSummary,
+      rowHeight,
+      topFrozenHeight: state.bodyLayout.topFrozenHeight,
+      bottomFrozenHeight: state.bodyLayout.bottomFrozenHeight,
+      totalBodyHeight: state.bodyLayout.totalBodyHeight - removedHeight,
+      topFrozenRowCount: state.frozenRows.top.rows.length,
+      bottomFrozenRowCount: state.frozenRows.bottom.rows.length,
+      scrollRowCount: sourceRows.length
+    })
+  };
+}
 function resolveGroupVisibilityPlan(params) {
   const cached = params.cache?.groupVisibilityPlan;
-  if (cached?.index === params.index && cached.rowKey === params.options.rowKey && areSameKeyArrays(cached.collapsedRowKeys, params.collapsedRowKeys) && areSameKeyArrays(cached.excludedRowKeys, params.excludedRowKeys ?? [])) {
+  if (cached?.index === params.index && cached.rowKey === params.options.rowKey && areSameKeyArrays(cached.collapsedRowKeys, params.collapsedRowKeys) && areSameStringArrays(cached.collapsedGroupKeys, params.collapsedGroupKeys) && areSameKeyArrays(cached.excludedRowKeys, params.excludedRowKeys ?? [])) {
     return cached;
   }
   const plan = buildListTableGroupVisibilityPlan(params);
@@ -25720,6 +26174,8 @@ function createRenderCacheInputs(params) {
     selectedRowKeys: params.selectedRowKeys,
     expandedRowKeys: params.expandedRowKeys,
     collapsedRowKeys: params.collapsedRowKeys,
+    collapsedGroupKeys: params.collapsedGroupKeys,
+    groupHeightAnimation: params.groupHeightAnimation,
     query: params.query,
     frozenRows: params.frozenRows,
     draggingResize: params.draggingResize,
@@ -25734,7 +26190,7 @@ function isSameRenderCacheInputs(previous, next) {
   if (!previous || next.swapAnimation) {
     return false;
   }
-  return previous.options === next.options && previous.jsonCellLayoutRevision === getJsonCellLayoutRevision() && previous.summaryRowHeight === next.options.summaryRowHeight && previous.columnsSignature === resolveColumnsSignature(next.options) && previous.theme === next.theme && previous.width === next.width && previous.height === next.height && previous.selectedRowKeys === next.selectedRowKeys && previous.expandedRowKeys === next.expandedRowKeys && previous.collapsedRowKeys === next.collapsedRowKeys && previous.query.sortState === next.query.sortState && previous.query.filterState === next.query.filterState && previous.query.pagination === next.query.pagination && previous.frozenRows === next.frozenRows && previous.draggingResize === next.draggingResize && previous.draggingResizeColumnKey === next.draggingResizeColumnKey && previous.baseRowsOverride === next.baseRowsOverride && previous.displayRowsOverride === next.displayRowsOverride && previous.groupBarVisible === next.groupBarVisible && areSameStringArrays(previous.groupColumnKeys, next.groupColumnKeys);
+  return previous.options === next.options && previous.jsonCellLayoutRevision === getJsonCellLayoutRevision() && previous.summaryRowHeight === next.options.summaryRowHeight && previous.columnsSignature === resolveColumnsSignature(next.options) && previous.theme === next.theme && previous.width === next.width && previous.height === next.height && previous.selectedRowKeys === next.selectedRowKeys && previous.expandedRowKeys === next.expandedRowKeys && previous.collapsedRowKeys === next.collapsedRowKeys && previous.collapsedGroupKeys === next.collapsedGroupKeys && previous.groupHeightAnimation === next.groupHeightAnimation && previous.query.sortState === next.query.sortState && previous.query.filterState === next.query.filterState && previous.query.pagination === next.query.pagination && previous.frozenRows === next.frozenRows && previous.draggingResize === next.draggingResize && previous.draggingResizeColumnKey === next.draggingResizeColumnKey && previous.baseRowsOverride === next.baseRowsOverride && previous.displayRowsOverride === next.displayRowsOverride && previous.groupBarVisible === next.groupBarVisible && areSameStringArrays(previous.groupColumnKeys, next.groupColumnKeys);
 }
 function resolveRenderCacheMissReason(previous, next) {
   if (!previous) return "empty";
@@ -25759,6 +26215,12 @@ function resolveRenderCacheMissReason(previous, next) {
   if (previous.collapsedRowKeys !== next.collapsedRowKeys) {
     return "collapsed-rows";
   }
+  if (previous.collapsedGroupKeys !== next.collapsedGroupKeys) {
+    return "collapsed-groups";
+  }
+  if (previous.groupHeightAnimation !== next.groupHeightAnimation) {
+    return "group-animation";
+  }
   if (previous.query.sortState !== next.query.sortState) return "sort";
   if (previous.query.filterState !== next.query.filterState) return "filter";
   if (previous.query.pagination !== next.query.pagination) return "pagination";
@@ -26367,6 +26829,8 @@ function drawListTableBodySections(params) {
     descriptors: params.descriptors,
     collapseConfig: params.collapseConfig,
     expandableConfig: params.expandableConfig,
+    getGroupAnimationProgress: params.getGroupAnimationProgress,
+    groupHeightAnimation: params.groupHeightAnimation,
     getCollapseRowOffset: params.getCollapseRowOffset,
     getCollapseCellHeight: params.getCollapseCellHeight,
     dragReorder: params.dragReorder,
@@ -26454,6 +26918,8 @@ function drawBodySection(params) {
     descriptors: params.descriptors,
     collapseConfig: params.collapseConfig,
     expandableConfig: params.expandableConfig,
+    getGroupAnimationProgress: params.getGroupAnimationProgress,
+    groupHeightAnimation: params.frozen ? void 0 : params.groupHeightAnimation,
     getCollapseRowOffset: params.getCollapseRowOffset,
     getCollapseCellHeight: params.getCollapseCellHeight,
     dragReorder: params.dragReorder,
@@ -27196,6 +27662,8 @@ function executeListTableRenderPipeline(params) {
     getControlAnimationProgress,
     getNestedTableHighlight,
     getExpandAnimationProgress,
+    getGroupAnimationProgress,
+    getGroupingRemoveAnimationProgress,
     getCollapseCellHeight,
     getValidationMessage,
     requestRender,
@@ -27228,7 +27696,8 @@ function executeListTableRenderPipeline(params) {
     columns: snapshot.groupingColumns,
     theme,
     descriptors,
-    hover
+    hover,
+    getGroupingRemoveAnimationProgress
   });
   if (snapshot.displayRows.length === 0) {
     renderer.drawEmpty(
@@ -27283,6 +27752,8 @@ function executeListTableRenderPipeline(params) {
         inlineColumnKey: inlineExpandColumnKey,
         getExpandAnimationProgress
       } : void 0,
+      getGroupAnimationProgress,
+      groupHeightAnimation: snapshot.groupHeightAnimation,
       dragReorder: dragReorderState,
       getControlAnimationProgress,
       getNestedTableHighlight,
@@ -27458,7 +27929,16 @@ function executeListTableRenderPipeline(params) {
 }
 function drawGroupingBar(params) {
   if (params.height <= 0) return;
-  const { ctx, width, height, columns, theme, descriptors, hover } = params;
+  const {
+    ctx,
+    width,
+    height,
+    columns,
+    theme,
+    descriptors,
+    hover,
+    getGroupingRemoveAnimationProgress
+  } = params;
   ctx.save();
   ctx.fillStyle = theme.headerBackgroundColor;
   ctx.fillRect(0, 0, width, height);
@@ -27471,7 +27951,15 @@ function drawGroupingBar(params) {
   ctx.font = `${theme.headerFontWeight} ${theme.fontSize}px ${theme.fontFamily}`;
   ctx.textBaseline = "middle";
   ctx.fillText("\u5206\u7EC4\u680F", 12, height / 2);
-  drawGroupingPath({ ctx, height, columns, theme, descriptors, hover });
+  drawGroupingPath({
+    ctx,
+    height,
+    columns,
+    theme,
+    descriptors,
+    hover,
+    getGroupingRemoveAnimationProgress
+  });
   descriptors.push({
     kind: "grouping-bar",
     rect: { x: 0, y: 0, width, height }
@@ -27479,7 +27967,15 @@ function drawGroupingBar(params) {
   ctx.restore();
 }
 function drawGroupingPath(params) {
-  const { ctx, height, columns, theme, descriptors, hover } = params;
+  const {
+    ctx,
+    height,
+    columns,
+    theme,
+    descriptors,
+    hover,
+    getGroupingRemoveAnimationProgress
+  } = params;
   const itemHeight = Math.min(20, Math.max(height - 2, 0));
   const itemY = (height - itemHeight) / 2;
   const dividerX = 67.5;
@@ -27509,7 +28005,19 @@ function drawGroupingPath(params) {
     ctx.fillText(column.title, x + 4, height / 2);
     ctx.fillStyle = theme.mutedTextColor;
     ctx.font = `600 ${theme.fontSize + 2}px ${theme.fontFamily}`;
-    ctx.fillText("\xD7", x + itemWidth - 16, height / 2);
+    const removeX = x + itemWidth - 16;
+    const progress = getGroupingRemoveAnimationProgress?.(column.key) ?? 0;
+    if (progress > 0) {
+      const centerX = removeX + ctx.measureText("\xD7").width / 2;
+      ctx.save();
+      ctx.translate(centerX, height / 2);
+      ctx.rotate(Math.PI / 2 * progress);
+      ctx.textAlign = "center";
+      ctx.fillText("\xD7", 0, 0);
+      ctx.restore();
+    } else {
+      ctx.fillText("\xD7", removeX, height / 2);
+    }
     descriptors.push({
       kind: "grouping-tag",
       rect: { x, y: itemY, width: itemWidth, height: itemHeight },
@@ -29148,14 +29656,26 @@ function showHeaderContextMenu(params) {
     }),
     onGetPrintData: resolveEnabledContextMenuFeatures(options.contextMenu).has(
       "print"
-    ) ? async () => {
+    ) ? async (taskOptions) => {
+      taskOptions?.signal?.throwIfAborted();
       const columns = getColumns().filter(
         (column) => column.hidden !== true && column.key !== ROW_SELECTION_COLUMN_KEY && column.key !== ROW_SELECTOR_COLUMN_KEY && column.key !== "__expanded_row__"
       );
       const rows = getRows();
-      const hasSummary = params.getExportSummaryEnabled?.() === true;
+      const hasSummary = taskOptions?.includeSummary !== false && params.getExportSummaryEnabled?.() === true;
       const values = hasSummary ? await params.getPrintSummaryValues?.() : null;
+      taskOptions?.signal?.throwIfAborted();
       const defaultKey = resolveDefaultSummaryTitleColumnKey(columns);
+      const printRows = await utils.mapInBatches(
+        taskOptions?.rowLimit == null ? rows.length : Math.min(
+          rows.length,
+          Math.max(0, Math.floor(taskOptions.rowLimit))
+        ),
+        (rowIndex) => columns.map(
+          (column) => getCellClipboardText(rows[rowIndex], rowIndex, column)
+        ),
+        taskOptions
+      );
       return {
         columns: columns.map((column) => ({
           key: column.key,
@@ -29164,11 +29684,7 @@ function showHeaderContextMenu(params) {
           align: column.align ?? "left",
           overflow: column.ellipsis === true ? "ellipsis" : "wrap"
         })),
-        rows: rows.map(
-          (row, rowIndex) => columns.map(
-            (column) => getCellClipboardText(row, rowIndex, column)
-          )
-        ),
+        rows: printRows,
         summaryRow: hasSummary ? columns.map(
           (column) => resolveSummaryCellDisplayValue(
             column,
@@ -29344,7 +29860,17 @@ function updateHeaderActionTooltip(params) {
     rect.x + rect.width / 2,
     rect.y + rect.height + 4
   );
-  tooltip.show(tooltipPoint.x, tooltipPoint.y, text);
+  const topLeft = toViewportPoint(rect.x, rect.y);
+  const bottomRight = toViewportPoint(
+    rect.x + rect.width,
+    rect.y + rect.height
+  );
+  tooltip.show(tooltipPoint.x, tooltipPoint.y, text, "default", {
+    x: topLeft.x,
+    y: topLeft.y,
+    width: bottomRight.x - topLeft.x,
+    height: bottomRight.y - topLeft.y
+  });
 }
 function showDragTooltip(params) {
   const { tooltip, toViewportPoint, x, y, text, variant } = params;
@@ -30674,18 +31200,23 @@ var ListTableEventController = class {
         this.host.debugManager.getSnapshot()?.hitTest,
         result
       );
-      if (!hoverChanged && !hitChanged) {
+      const editingSession = this.host.editingController.getSession();
+      const updateBodyTooltip = () => {
+        if (result.tooltipVariant === "error" && editingSession != null && editingSession.rowIndex === result.rowIndex && editingSession.columnKey === result.columnKey) {
+          this.host.bodyTooltipController.clear();
+          return;
+        }
         this.host.bodyTooltipController.update(
           result,
           () => this.host.updateTooltip(result)
         );
+      };
+      if (!hoverChanged && !hitChanged) {
+        updateBodyTooltip();
         return;
       }
       this.host.hover = nextHover;
-      this.host.bodyTooltipController.update(
-        result,
-        () => this.host.updateTooltip(result)
-      );
+      updateBodyTooltip();
       this.host.scheduleRender(result);
     });
     __publicField(this, "handleMouseDown", (event) => {
@@ -31577,6 +32108,10 @@ var ListTableEventController = class {
         this.host.suppressNextClick = true;
         return;
       }
+      if (result.area === "group-toggle" && result.contentKey) {
+        this.host.toggleGroupRow?.(result.contentKey);
+        return;
+      }
       if (result.area !== "filter-trigger") {
         this.host.filterPanel.hide();
       }
@@ -34087,6 +34622,7 @@ function createListTableEventHost(core) {
     addGroupingColumns: (columnKeys) => core.addGroupingColumns(columnKeys),
     removeGroupingColumn: (columnKey) => core.removeGroupingColumn(columnKey),
     resetGrouping: () => core.resetGrouping(),
+    toggleGroupRow: (rowKey) => core.toggleGroupRow?.(rowKey),
     isGroupingBarDropTarget: (clientX, clientY) => core.isGroupingBarDropTarget(clientX, clientY),
     setGroupingBarDropActive: (active) => core.setGroupingBarDropActive(active),
     toViewportPoint: (x, y) => core.domHost.toViewportPoint(x, y),
@@ -34608,8 +35144,14 @@ var ListTableOverlayController = class {
     this.runtime = options.runtime ?? createListTableOverlayRuntime();
     this.tooltipAdapter = {
       mount: () => void 0,
-      show: (x, y, content, variant) => {
-        this.showTooltip({ x, y, content, variant });
+      show: (x, y, content, variant, anchorRect) => {
+        this.showTooltip({
+          x,
+          y,
+          content,
+          variant,
+          ...anchorRect ? { anchorRect } : {}
+        });
       },
       hide: () => {
         this.hideTooltip();
@@ -34662,12 +35204,22 @@ var ListTableOverlayController = class {
     const options = this.getOptions();
     options.ui?.onTooltipRequest?.(nextRequest);
     if (!options.ui?.onTooltipRequest) {
-      this.componentPortal.tooltip.show(
-        nextRequest.x,
-        nextRequest.y,
-        nextRequest.content,
-        nextRequest.variant
-      );
+      if (nextRequest.anchorRect) {
+        this.componentPortal.tooltip.show(
+          nextRequest.x,
+          nextRequest.y,
+          nextRequest.content,
+          nextRequest.variant,
+          nextRequest.anchorRect
+        );
+      } else {
+        this.componentPortal.tooltip.show(
+          nextRequest.x,
+          nextRequest.y,
+          nextRequest.content,
+          nextRequest.variant
+        );
+      }
     }
   }
   hideTooltip() {
@@ -36010,6 +36562,8 @@ function publishListTableRender(params) {
     getControlAnimationProgress,
     getNestedTableHighlight,
     getExpandAnimationProgress,
+    getGroupAnimationProgress,
+    getGroupingRemoveAnimationProgress,
     getCollapseRowOffset,
     getCollapseCellHeight,
     getValidationMessage,
@@ -36049,6 +36603,8 @@ function publishListTableRender(params) {
     getControlAnimationProgress,
     getNestedTableHighlight,
     getExpandAnimationProgress,
+    getGroupAnimationProgress,
+    getGroupingRemoveAnimationProgress,
     getCollapseRowOffset,
     getCollapseCellHeight,
     getValidationMessage,
@@ -36375,6 +36931,8 @@ var ListTableRenderController = class {
       getControlAnimationProgress: publishAccessors.getControlAnimationProgress,
       getNestedTableHighlight: publishAccessors.getNestedTableHighlight,
       getExpandAnimationProgress: publishAccessors.getExpandAnimationProgress,
+      getGroupAnimationProgress: publishAccessors.getGroupAnimationProgress,
+      getGroupingRemoveAnimationProgress: publishAccessors.getGroupingRemoveAnimationProgress,
       getCollapseRowOffset: publishAccessors.getCollapseRowOffset,
       getCollapseCellHeight: publishAccessors.getCollapseCellHeight,
       getValidationMessage: publishAccessors.getValidationMessage,
@@ -36423,6 +36981,8 @@ var ListTableRenderController = class {
       selectedRowKeys: this.options.getSelectedRowKeys(),
       expandedRowKeys: this.options.getExpandedRowKeys(),
       collapsedRowKeys: this.options.getCollapsedRowKeys(),
+      collapsedGroupKeys: this.options.getCollapsedGroupKeys?.() ?? [],
+      groupHeightAnimation: this.options.getGroupHeightAnimation?.(),
       query: this.options.getQueryRuntimeState(),
       frozenRows: this.options.getFrozenRows(),
       draggingResize: this.options.isDraggingResize(),
@@ -37150,7 +37710,7 @@ var ListTableScrollToController = class {
     this.options.animationController.stopWheelScrollSmoothing();
     this.options.animationController.stopCarouselScrollAnimation();
     if (this.options.editingController.getSession()) {
-      this.options.editingController.close(false);
+      this.options.editingController.commit();
     }
     if (request.behavior === "smooth") {
       this.options.animationController.startScrollToAnimation({
@@ -37912,6 +38472,10 @@ function assembleListTableCoreControllers(core, options) {
   const emitGroupingChange = () => {
     core.options.grouping?.onChange?.([...core.groupColumnKeys]);
   };
+  const clearCollapsedGroups = () => {
+    core.animationController?.stopGroupAnimations();
+    core.collapsedGroupKeys = [];
+  };
   const resetGroupingColumnHighlights = () => {
     core.selectionController.setSelectedHeaderState(
       core.selectionController.getSelectedHeaderKey(),
@@ -37956,6 +38520,7 @@ function assembleListTableCoreControllers(core, options) {
       (key, index) => key !== core.groupColumnKeys[index]
     )) {
       resetGroupingColumnHighlights();
+      clearCollapsedGroups();
     }
   };
   core.setGroupingBarVisible = (visible) => {
@@ -37979,6 +38544,7 @@ function assembleListTableCoreControllers(core, options) {
       return;
     }
     core.groupColumnKeys = next;
+    clearCollapsedGroups();
     resetGroupingColumnHighlights();
     core.storeFacade.scroll = { ...core.storeFacade.scroll, top: 0 };
     emitGroupingChange();
@@ -37990,6 +38556,7 @@ function assembleListTableCoreControllers(core, options) {
       return;
     }
     core.groupColumnKeys = next;
+    clearCollapsedGroups();
     resetGroupingColumnHighlights();
     core.storeFacade.scroll = { ...core.storeFacade.scroll, top: 0 };
     emitGroupingChange();
@@ -38000,6 +38567,7 @@ function assembleListTableCoreControllers(core, options) {
       return;
     }
     core.groupColumnKeys = [];
+    clearCollapsedGroups();
     resetGroupingColumnHighlights();
     core.storeFacade.scroll = { ...core.storeFacade.scroll, top: 0 };
     emitGroupingChange();
@@ -38054,6 +38622,7 @@ function assembleListTableCoreControllers(core, options) {
     getTableZoom: () => core.tableZoom,
     getLeafColumns: () => core.leafColumns,
     getDisplayData,
+    getAllDisplayData: () => core.queryController.getDisplayData(),
     getDescriptors,
     getCurrentRenderSnapshot,
     getScroll: () => core.storeFacade.scroll,
@@ -38309,6 +38878,8 @@ function assembleListTableCoreControllers(core, options) {
     getSelectedRowKeys: () => core.storeFacade.selectedRowKeys,
     getExpandedRowKeys: () => core.storeFacade.expandedRowKeys,
     getCollapsedRowKeys: () => core.storeFacade.collapsedRowKeys,
+    getCollapsedGroupKeys: () => core.collapsedGroupKeys,
+    getGroupHeightAnimation: () => core.animationController.getGroupHeightAnimation(),
     getQueryRuntimeState,
     getFrozenRows: () => core.storeFacade.frozenRows,
     isDraggingResize: () => core.draggingResize != null,
@@ -38350,8 +38921,13 @@ function assembleListTableCoreControllers(core, options) {
       core.animationController.stopCarouselScroll();
       core.animationController.stopExpandAnimations();
       core.animationController.stopCollapseAnimations();
+      core.animationController.stopGroupAnimations();
+      core.animationController.stopGroupingRemoveAnimation();
     },
     beforePublish: (snapshot, resolveCellContents) => {
+      core.animationController.reconcileGroupingRemoveHover(
+        core.storeFacade.hover
+      );
       if (core.animationController.shouldReconcileControlAnimations(snapshot)) {
         core.animationController.reconcileControlAnimations(
           snapshot,
@@ -38377,6 +38953,8 @@ function assembleListTableCoreControllers(core, options) {
       }),
       getNestedTableHighlight: (params) => core.animationController.getNestedTableHighlight(params),
       getExpandAnimationProgress: (rowKey) => core.animationController.getExpandAnimationProgress(rowKey),
+      getGroupAnimationProgress: (rowKey) => core.animationController.getGroupAnimationProgress(rowKey),
+      getGroupingRemoveAnimationProgress: (columnKey) => core.animationController.getGroupingRemoveAnimationProgress(columnKey),
       getCollapseRowOffset: (rowKey) => core.animationController.getCollapseRowOffset(rowKey),
       getCollapseCellHeight: (params) => core.animationController.getCollapseCellHeight(params),
       getValidationMessage: ({ record, rowIndex, columnKey }) => core.editingController.getValidationMessage(
@@ -38388,6 +38966,7 @@ function assembleListTableCoreControllers(core, options) {
     afterPublish: () => {
       core.animationController.ensureControlAnimationFrame();
       core.animationController.ensureExpandAnimationFrame();
+      core.animationController.ensureGroupAnimationFrame();
       core.animationController.ensureCollapseAnimationFrame();
       core.carouselController.syncCarouselScroll();
     },
@@ -38484,6 +39063,45 @@ function assembleListTableCoreControllers(core, options) {
     addGroupingColumns: (columnKeys) => core.addGroupingColumns(columnKeys),
     removeGroupingColumn: (columnKey) => core.removeGroupingColumn(columnKey),
     resetGrouping: () => core.resetGrouping(),
+    toggleGroupRow: (rowKey) => {
+      const previous = core.animationController.getGroupHeightAnimation();
+      if (previous && previous.rowKey !== rowKey) {
+        core.animationController.finishGroupAnimations();
+        render();
+      }
+      const collapsing = core.animationController.getGroupAnimationTarget(rowKey) === 0;
+      const active = core.animationController.getGroupHeightAnimation();
+      const geometry = active?.rowKey === rowKey ? {
+        startOffset: active.startOffset,
+        contentHeight: active.contentHeight,
+        endRowIndex: active.endRowIndex
+      } : resolveGroupHeightAnimationGeometry({
+        snapshot: core.renderController.getCurrentRenderSnapshot(),
+        options: core.options,
+        rowKey,
+        collapsedGroupKeys: core.collapsedGroupKeys.filter(
+          (key) => key !== rowKey
+        ),
+        collapsedRowKeys: core.storeFacade.collapsedRowKeys,
+        expandedRowKeys: core.storeFacade.expandedRowKeys
+      });
+      if (collapsing || core.collapsedGroupKeys.includes(rowKey)) {
+        core.collapsedGroupKeys = core.collapsedGroupKeys.filter(
+          (key) => key !== rowKey
+        );
+        core.animationController.startGroupAnimation(rowKey, true, geometry);
+      } else {
+        core.animationController.startGroupAnimation(
+          rowKey,
+          false,
+          geometry,
+          () => {
+            core.collapsedGroupKeys = [...core.collapsedGroupKeys, rowKey];
+          }
+        );
+      }
+      render();
+    },
     isGroupingBarDropTarget: (clientX, clientY) => {
       const point = core.canvasHost.getPointerPosition(clientX, clientY);
       return resolvePointerHit(point.x, point.y).area === "grouping-bar";
@@ -38541,8 +39159,85 @@ function assembleListTableCoreControllers(core, options) {
   core.groupColumnKeys = [
     ...options.grouping?.columnKeys ?? core.defaultGroupColumnKeys
   ];
+  core.collapsedGroupKeys = [];
   core.tableZoom = 1;
 }
+function resolveGroupHeightAnimationGeometry(params) {
+  const { snapshot } = params;
+  const window2 = snapshot?.groupVisibleWindow;
+  const index = snapshot?.groupIndex;
+  const section = snapshot?.frozenRows.scroll;
+  const rows = window2?.rows ?? section?.rows;
+  const headerIndex = rows?.findIndex(
+    (row) => row.kind === "group" && row.rowKey === params.rowKey
+  ) ?? -1;
+  if (!snapshot || !rows || !index || headerIndex < 0) {
+    return { startOffset: 0, contentHeight: 0, endRowIndex: 0 };
+  }
+  const findNode = (nodes) => {
+    for (const node2 of nodes) {
+      if (node2.nodeKey === params.rowKey) return node2;
+      const nested = findNode(node2.children ?? []);
+      if (nested) return nested;
+    }
+    return void 0;
+  };
+  const node = findNode(index.root.children ?? []);
+  if (!node) return { startOffset: 0, contentHeight: 0, endRowIndex: 0 };
+  const visibilityPlan = buildListTableGroupVisibilityPlan({
+    index,
+    options: params.options,
+    collapsedRowKeys: params.collapsedRowKeys,
+    collapsedGroupKeys: params.collapsedGroupKeys,
+    excludedRowKeys: [
+      ...snapshot.frozenRows.top.rows.filter((row) => row.kind === "data").map((row) => row.rowKey),
+      ...snapshot.frozenRows.bottom.rows.filter((row) => row.kind === "data").map((row) => row.rowKey)
+    ]
+  });
+  const nodeRowCount = getGroupNodeVisibleRowCount(visibilityPlan, node);
+  const detailPlan = buildListTableGroupExpandedRowPlan({
+    index,
+    options: params.options,
+    expandedRowKeys: params.expandedRowKeys,
+    rowHeight: snapshot.rowHeight,
+    visibilityPlan
+  });
+  const details = detailPlan.supported ? detailPlan.plan.entries.filter(
+    (entry) => entry.row.ownerDataRowIndex >= node.firstDataRowIndex && entry.row.ownerDataRowIndex < node.firstDataRowIndex + node.count
+  ) : [];
+  if (!window2) {
+    const groupRow = rows[headerIndex];
+    const nextPeerIndex = rows.findIndex(
+      (row, rowIndex) => rowIndex > headerIndex && row.kind === "group" && row.depth <= (groupRow?.kind === "group" ? groupRow.depth : 0)
+    );
+    const endIndex = nextPeerIndex < 0 ? rows.length : nextPeerIndex;
+    return {
+      startOffset: sumVisibleRowHeights({
+        rows,
+        rowHeight: snapshot.rowHeight,
+        end: headerIndex
+      }),
+      contentHeight: groupRow?.kind === "group" && groupRow.expanded ? sumVisibleRowHeights({
+        rows,
+        rowHeight: snapshot.rowHeight,
+        start: headerIndex + 1,
+        end: endIndex
+      }) : (nodeRowCount - 1) * snapshot.rowHeight + details.reduce(
+        (height, entry) => height + (entry.row.height ?? snapshot.rowHeight),
+        0
+      ),
+      endRowIndex: groupRow?.kind === "group" && groupRow.expanded ? section?.rowIndexMap?.[endIndex] ?? endIndex : (section?.rowIndexMap?.[headerIndex] ?? headerIndex) + nodeRowCount + details.length
+    };
+  }
+  return {
+    startOffset: window2.rowOffsetMap[headerIndex] ?? 0,
+    contentHeight: (nodeRowCount - 1) * snapshot.rowHeight + details.reduce(
+      (height, entry) => height + (entry.row.height ?? snapshot.rowHeight),
+      0
+    ),
+    endRowIndex: (window2.rowIndexMap[headerIndex] ?? 0) + nodeRowCount + details.length
+  };
+}
 function collectGroupingColumnItems(columns) {
   return columns.flatMap((column) => {
     if (column.children?.length) {