Merge branch 'master' into perf-dataset

packages/s2-core/__tests__/bugs/issue-2340-spec.ts

@@ -0,0 +1,78 @@
+/**
+ * @description spec for issue #2340
+ * https://github.com/antvis/S2/issues/2340
+ */
+import { map } from 'lodash';
+import {
+  CellTypes,
+  InteractionStateName,
+  getCellMeta,
+  type S2Options,
+  HeaderCell,
+} from '../../src';
+import { createPivotSheet, sleep } from '../util/helpers';
+
+const s2Options: S2Options = {
+  width: 800,
+  height: 600,
+  style: {
+    cellCfg: {
+      width: 200,
+      height: 200,
+    },
+  },
+};
+
+describe('Header Brush Selection Tests', () => {
+  test.each([CellTypes.COL_CELL, CellTypes.ROW_CELL])(
+    'should not trigger data cell selected when header selected and scroll out of viewport',
+    async (cellType) => {
+      const s2 = createPivotSheet(s2Options, { useSimpleData: false });
+      s2.render();
+
+      const isRow = cellType === CellTypes.ROW_CELL;
+      const targetCells = isRow
+        ? s2.interaction.getAllRowHeaderCells()
+        : s2.interaction.getAllColHeaderCells();
+
+      const cells = [
+        (targetCells as HeaderCell[]).find((cell) => {
+          const meta = cell.getMeta();
+          return meta.isLeaf;
+        }),
+      ];
+
+      s2.interaction.changeState({
+        cells: map(cells, getCellMeta),
+        stateName: InteractionStateName.BRUSH_SELECTED,
+      });
+
+      await sleep(500);
+
+      const offsetKey = isRow ? 'offsetY' : 'offsetX';
+      // 将圈选的单元格滑出可视范围
+      s2.facet.updateScrollOffset({
+        [offsetKey]: { value: 300 },
+      });
+
+      await sleep(500);
+
+      // 还原
+      s2.facet.updateScrollOffset({
+        [offsetKey]: { value: 0 },
+      });
+
+      expect(s2.interaction.getActiveCells()).toHaveLength(1);
+      expect(s2.interaction.getCurrentStateName()).toEqual(
+        InteractionStateName.BRUSH_SELECTED,
+      );
+
+      // 交互过的不应该有 dataCell (未触发过列头多选)
+      s2.interaction.getInteractedCells().forEach((cell) => {
+        expect(cell.cellType).toEqual(
+          isRow ? CellTypes.ROW_CELL : CellTypes.COL_CELL,
+        );
+      });
+    },
+  );
+});

packages/s2-core/__tests__/unit/utils/export/copy-spec.ts

@@ -1040,6 +1040,80 @@ describe('Tree Table Core Data Process', () => {
       总计	26193	23516	49709	12321	16838"
     `);
   });
+
+  it('should copy normal data with header for custom field name', () => {
+    s2.setOptions({
+      interaction: {
+        copyWithHeader: true,
+      },
+    });
+    s2.setDataCfg({
+      meta: [
+        {
+          field: 'number',
+          name: '数量',
+        },
+      ],
+    });
+    s2.render();
+
+    setSelectedVisibleCell();
+
+    expect(getSelectedData(s2)).toMatchInlineSnapshot(`
+      "	家具	家具	家具	办公用品	办公用品
+      	桌子	沙发	小计	笔	纸张
+      	数量	数量		数量	数量
+      浙江省	18375	14043	32418	4826	5854
+      浙江省	7789	5343	13132	945	1343
+      浙江省	2367	632	2999	1304	1354
+      浙江省	3877	7234	11111	1145	1523
+      浙江省	4342	834	5176	1432	1634
+      四川省	7818	9473	17291	7495	10984
+      四川省	1723	2451	4174	2335	4004
+      四川省	1822	2244	4066	245	3077
+      四川省	1943	2333	4276	2457	3551
+      四川省	2330	2445	4775	2458	352
+      总计	26193	23516	49709	12321	16838"
+    `);
+  });
+
+  it('should copy normal data with header for custom field formatter if enable copyWithFormat', () => {
+    s2.setOptions({
+      interaction: {
+        copyWithHeader: true,
+        copyWithFormat: true,
+      },
+    });
+    s2.setDataCfg({
+      meta: [
+        {
+          field: 'number',
+          name: '数量',
+          formatter: (value) => `${value}-@`,
+        },
+      ],
+    });
+    s2.render();
+
+    setSelectedVisibleCell();
+
+    expect(getSelectedData(s2)).toMatchInlineSnapshot(`
+      "	家具	家具	家具	办公用品	办公用品
+      	桌子	沙发	小计	笔	纸张
+      	数量	数量		数量	数量
+      浙江省	18375-@	14043-@	32418	4826-@	5854-@
+      浙江省	7789-@	5343-@	13132	945-@	1343-@
+      浙江省	2367-@	632-@	2999	1304-@	1354-@
+      浙江省	3877-@	7234-@	11111	1145-@	1523-@
+      浙江省	4342-@	834-@	5176	1432-@	1634-@
+      四川省	7818-@	9473-@	17291	7495-@	10984-@
+      四川省	1723-@	2451-@	4174	2335-@	4004-@
+      四川省	1822-@	2244-@	4066	245-@	3077-@
+      四川省	1943-@	2333-@	4276	2457-@	3551-@
+      四川省	2330-@	2445-@	4775	2458-@	352-@
+      总计	26193-@	23516-@	49709	12321-@	16838-@"
+    `);
+  });
 });
 
 describe('List Table getCopyData', () => {
@@ -1114,6 +1188,7 @@ describe('Pivot Table getBrushHeaderCopyable', () => {
   });
 
   const s2 = new PivotSheet(getContainer(), dataCfg, options);
+
   beforeEach(() => {
     s2.render();
   });
@@ -1141,6 +1216,37 @@ describe('Pivot Table getBrushHeaderCopyable', () => {
     `);
   });
 
+  test('should copy all original row data in grid mode if contains text ellipses', () => {
+    s2.setOptions({
+      style: {
+        rowCfg: {
+          // 展示省略号
+          width: 10,
+        },
+      },
+    });
+    const cells = s2.interaction.getAllRowHeaderCells();
+
+    s2.interaction.changeState({
+      cells: map(cells, getCellMeta),
+      stateName: InteractionStateName.SELECTED,
+      onUpdateCells: (root) => {
+        root.updateCells(root.getAllRowHeaderCells());
+      },
+    });
+
+    expect(getSelectedData(s2)).toMatchInlineSnapshot(`
+      "浙江省	杭州市
+      浙江省	绍兴市
+      浙江省	宁波市
+      浙江省	舟山市
+      四川省	成都市
+      四川省	绵阳市
+      四川省	南充市
+      四川省	乐山市"
+    `);
+  });
+
   test('should copy all col data in grid mode', () => {
     const cells = s2.interaction.getAllColHeaderCells();
 
@@ -1160,6 +1266,35 @@ describe('Pivot Table getBrushHeaderCopyable', () => {
     `);
   });
 
+  test('should copy all col data in grid mode for custom field meta', () => {
+    s2.setDataCfg({
+      meta: [
+        {
+          field: 'number',
+          name: '数量',
+        },
+      ],
+    });
+
+    s2.render();
+
+    const cells = s2.interaction.getAllColHeaderCells();
+
+    s2.interaction.changeState({
+      cells: map(cells, getCellMeta),
+      stateName: InteractionStateName.SELECTED,
+      onUpdateCells: (root) => {
+        root.updateCells(root.getAllColHeaderCells());
+      },
+    });
+
+    expect(getSelectedData(s2)).toMatchInlineSnapshot(`
+      "家具	家具	办公用品	办公用品
+      桌子	沙发	笔	纸张
+      数量	数量	数量	数量"
+    `);
+  });
+
   test('should copy selection row data in grid mode', () => {
     const ss = new PivotSheet(
       getContainer(),
@@ -1216,7 +1351,7 @@ describe('Pivot Table getBrushHeaderCopyable', () => {
   });
 
   test('should copy selection col data in grid mode', () => {
-    const ss = new PivotSheet(
+    const sheet = new PivotSheet(
       getContainer(),
       assembleDataCfg({
         meta: [],
@@ -1228,37 +1363,37 @@ describe('Pivot Table getBrushHeaderCopyable', () => {
       }),
       options,
     );
-    ss.render();
+    sheet.render();
 
-    const cells = ss.interaction.getAllColHeaderCells().filter((c) => {
+    const cells = sheet.interaction.getAllColHeaderCells().filter((c) => {
       const meta = c.getMeta();
       return (meta.level === 3 || meta.level === 4) && meta.x < 480;
     });
-    ss.interaction.changeState({
+    sheet.interaction.changeState({
       cells: map(cells, getCellMeta),
       stateName: InteractionStateName.SELECTED,
       onUpdateCells: (root) => {
         root.updateCells(root.getAllColHeaderCells());
       },
     });
 
-    expect(getSelectedData(ss)).toMatchInlineSnapshot(`
+    expect(getSelectedData(sheet)).toMatchInlineSnapshot(`
       "桌子	沙发	笔	纸张	桌子
       number	number	number	number	number"
     `);
 
-    const cells2 = ss.interaction.getAllColHeaderCells().filter((c) => {
+    const cells2 = sheet.interaction.getAllColHeaderCells().filter((c) => {
       const meta = c.getMeta();
       return (meta.level === 0 || meta.level === 1) && meta.x < 480;
     });
-    ss.interaction.changeState({
+    sheet.interaction.changeState({
       cells: map(cells2, getCellMeta),
       stateName: InteractionStateName.SELECTED,
       onUpdateCells: (root) => {
         root.updateCells(root.getAllColHeaderCells());
       },
     });
-    expect(getSelectedData(ss)).toMatchInlineSnapshot(`
+    expect(getSelectedData(sheet)).toMatchInlineSnapshot(`
       "浙江省	浙江省
       杭州市	绍兴市"
     `);

packages/s2-core/src/cell/data-cell.ts

@@ -401,7 +401,7 @@ export class DataCell extends BaseCell<ViewMeta> {
     );
   }
 
-  // dataCell根据state 改变当前样式，
+  // dataCell 根据 state 改变当前样式，
   protected changeRowColSelectState(indexType: ViewMetaIndexType) {
     const { interaction } = this.spreadsheet;
     const currentIndex = get(this.meta, indexType);

packages/s2-core/src/cell/header-cell.ts

@@ -415,6 +415,7 @@ export abstract class HeaderCell extends BaseCell<Node> {
 
     switch (stateInfo?.stateName) {
       case InteractionStateName.SELECTED:
+      case InteractionStateName.BRUSH_SELECTED:
         this.handleSelect(cells, stateInfo?.nodes);
         break;
       case InteractionStateName.HOVER_FOCUS:

packages/s2-core/src/common/constant/interaction.ts

@@ -18,6 +18,7 @@ export enum InteractionName {
 export enum InteractionStateName {
   ALL_SELECTED = 'allSelected',
   SELECTED = 'selected',
+  BRUSH_SELECTED = 'brushSelected',
   UNSELECTED = 'unselected',
   HOVER = 'hover',
   HOVER_FOCUS = 'hoverFocus',

packages/s2-core/src/facet/header/col.ts

@@ -77,14 +77,14 @@ export class ColHeader extends BaseHeader<ColHeaderConfig> {
     return this.scrollGroup;
   }
 
-  protected isColCellInRect(item: Node): boolean {
+  protected isColCellInRect(node: Node): boolean {
     const { spreadsheet, cornerWidth, width, scrollX } = this.headerConfig;
 
     return (
       // don't care about scrollY, because there is only freeze col-header exist
-      width + scrollX > item.x &&
+      width + scrollX > node.x &&
       scrollX - (spreadsheet.isFrozenRowHeader() ? 0 : cornerWidth) <
-        item.x + item.width
+        node.x + node.width
     );
   }
 

packages/s2-core/src/interaction/brush-selection/col-brush-selection.ts

@@ -96,16 +96,14 @@ export class ColBrushSelection extends BaseBrushSelection {
     );
   }
 
-  // 最终刷选的cell
+  // 最终刷选的 cell
   protected updateSelectedCells() {
     const { interaction } = this.spreadsheet;
 
     interaction.changeState({
       cells: map(this.brushRangeCells, getCellMeta),
-      stateName: InteractionStateName.SELECTED,
-      onUpdateCells: (root) => {
-        root.updateCells(root.getAllColHeaderCells());
-      },
+      stateName: InteractionStateName.BRUSH_SELECTED,
+      onUpdateCells: this.onUpdateCells,
     });
 
     this.spreadsheet.emit(

packages/s2-core/src/interaction/brush-selection/data-cell-brush-selection.ts

@@ -94,13 +94,14 @@ export class DataCellBrushSelection extends BaseBrushSelection {
     return metas;
   };
 
-  // 最终刷选的cell
+  // 最终刷选的 cell
   protected updateSelectedCells() {
     const brushRange = this.getBrushRange();
     const selectedCellMetas = this.getSelectedCellMetas(brushRange);
 
     this.spreadsheet.interaction.changeState({
       cells: selectedCellMetas,
+      // TODO: 怕上层有直接消费 stateName, 暂时保留, 2.0 版本改成 InteractionStateName.BRUSH_SELECTED
       stateName: InteractionStateName.SELECTED,
       onUpdateCells: afterSelectDataCells,
     });

packages/s2-core/src/interaction/brush-selection/row-brush-selection.ts

@@ -96,7 +96,7 @@ export class RowBrushSelection extends BaseBrushSelection {
 
     this.spreadsheet.interaction.changeState({
       cells: selectedCellMetas,
-      stateName: InteractionStateName.SELECTED,
+      stateName: InteractionStateName.BRUSH_SELECTED,
       onUpdateCells: this.onUpdateCells,
     });
 

packages/s2-core/src/interaction/root.ts

@@ -144,7 +144,10 @@ export class RootInteraction {
   }
 
   public isSelectedState() {
-    return this.isStateOf(InteractionStateName.SELECTED);
+    return (
+      this.isStateOf(InteractionStateName.SELECTED) ||
+      this.isStateOf(InteractionStateName.BRUSH_SELECTED)
+    );
   }
 
   public isAllSelectedState() {