fix: 修复紧凑模式下数值单元格错误的展示了省略号

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

@@ -5,7 +5,7 @@
 import { LayoutWidthType, type S2Options } from '../../src';
 import * as mockDataConfig from '../data/data-issue-2385.json';
 import { getContainer } from '../util/helpers';
-import { PivotSheet, TableSheet } from '@/sheet-type';
+import { PivotSheet, SpreadSheet, TableSheet } from '@/sheet-type';
 
 const s2Options: S2Options = {
   width: 800,
@@ -19,6 +19,12 @@ const s2Options: S2Options = {
 };
 
 describe('Compare Layout Tests', () => {
+  const expectTextOverflowing = (s2: SpreadSheet) => {
+    [...s2.facet.getColCells(), ...s2.facet.getDataCells()].forEach((cell) => {
+      expect(cell.getTextShape().isOverflowing()).toBeFalsy();
+    });
+  };
+
   test('should get max col width for pivot sheet', async () => {
     const s2 = new PivotSheet(getContainer(), mockDataConfig, s2Options);
 
@@ -35,6 +41,7 @@ describe('Compare Layout Tests', () => {
 
     expect(Math.floor(colLeafNodes[0].width)).toBeCloseTo(189);
     expect(Math.floor(colLeafNodes[1].width)).toEqual(90);
+    expectTextOverflowing(s2);
   });
 
   test('should get max col width for table sheet', async () => {
@@ -58,5 +65,6 @@ describe('Compare Layout Tests', () => {
     const colLeafNodes = s2.facet.getColLeafNodes();
 
     expect(Math.floor(colLeafNodes[0].width)).toBeCloseTo(182);
+    expectTextOverflowing(s2);
   });
 });

packages/s2-core/__tests__/unit/sheet-type/pivot-sheet-spec.ts

@@ -12,7 +12,7 @@ import type {
 } from '../../../src';
 import { PivotDataSet } from '../../../src/data-set';
 import { PivotFacet } from '../../../src/facet';
-import { customMerge, getSafetyDataConfig } from '@/utils';
+import { customMerge, setupDataConfig } from '@/utils';
 import { BaseTooltip } from '@/ui/tooltip';
 import { PivotSheet, SpreadSheet } from '@/sheet-type';
 import type { GEvent } from '@/index';
@@ -457,9 +457,7 @@ describe('PivotSheet Tests', () => {
     // save original data cfg
     expect(s2.store.get('originalDataCfg')).toEqual(newDataCfg);
     // update data cfg
-    expect(s2.dataCfg).toEqual(
-      getSafetyDataConfig(originalDataCfg, newDataCfg),
-    );
+    expect(s2.dataCfg).toEqual(setupDataConfig(originalDataCfg, newDataCfg));
   });
 
   test('should set options', () => {

packages/s2-core/__tests__/unit/utils/__snapshots__/merge-spec.ts.snap

@@ -115,3 +115,42 @@ Object {
   "width": 600,
 }
 `;
+
+exports[`merge test should setup correctly compact layout width type style 1`] = `
+Object {
+  "colCell": Object {
+    "height": 30,
+    "heightByField": null,
+    "maxLines": 1,
+    "textOverflow": "ellipsis",
+    "widthByField": null,
+    "wordWrap": true,
+  },
+  "cornerCell": Object {
+    "maxLines": 1,
+    "textOverflow": "ellipsis",
+    "wordWrap": true,
+  },
+  "dataCell": Object {
+    "height": 30,
+    "maxLines": 1,
+    "textOverflow": "ellipsis",
+    "width": 96,
+    "wordWrap": false,
+  },
+  "layoutWidthType": "compact",
+  "rowCell": Object {
+    "heightByField": null,
+    "maxLines": 1,
+    "showTreeLeafNodeAlignDot": false,
+    "textOverflow": "ellipsis",
+    "widthByField": null,
+    "wordWrap": true,
+  },
+  "seriesNumberCell": Object {
+    "maxLines": 1,
+    "textOverflow": "ellipsis",
+    "wordWrap": true,
+  },
+}
+`;

packages/s2-core/__tests__/unit/utils/merge-spec.ts

@@ -1,9 +1,5 @@
-import type { S2DataConfig } from '@/common';
-import {
-  customMerge,
-  getSafetyDataConfig,
-  getSafetyOptions,
-} from '@/utils/merge';
+import { LayoutWidthType, type S2DataConfig } from '@/common';
+import { customMerge, setupDataConfig, setupOptions } from '@/utils/merge';
 
 describe('merge test', () => {
   test('should replace old array with new one', () => {
@@ -27,7 +23,7 @@ describe('merge test', () => {
   });
 
   test('should get safety data config', () => {
-    expect(getSafetyDataConfig(null)).toMatchInlineSnapshot(`
+    expect(setupDataConfig(null)).toMatchInlineSnapshot(`
       Object {
         "data": Array [],
         "fields": Object {
@@ -45,7 +41,7 @@ describe('merge test', () => {
 
   test('should unique dataConfig fields', () => {
     expect(
-      getSafetyDataConfig({
+      setupDataConfig({
         fields: {
           rows: ['province', 'city', 'city'],
           columns: ['type', 'type'],
@@ -86,7 +82,7 @@ describe('merge test', () => {
     };
 
     expect(
-      getSafetyDataConfig({
+      setupDataConfig({
         fields,
       }),
     ).toMatchInlineSnapshot(`
@@ -119,7 +115,7 @@ describe('merge test', () => {
     };
 
     expect(
-      getSafetyDataConfig({
+      setupDataConfig({
         fields,
       }),
     ).toMatchInlineSnapshot(`
@@ -148,7 +144,7 @@ describe('merge test', () => {
     };
 
     expect(
-      getSafetyDataConfig(oldDataCfg, {
+      setupDataConfig(oldDataCfg, {
         fields,
       }),
     ).toMatchInlineSnapshot(`
@@ -176,11 +172,21 @@ describe('merge test', () => {
 
   test('should get safety options', () => {
     // 加这个测试可以防止 本地跑 demo 修改了默认配置 直接提交
-    expect(getSafetyOptions(null)).toMatchSnapshot();
+    expect(setupOptions(null)).toMatchSnapshot();
+  });
+
+  test('should setup correctly compact layout width type style', () => {
+    expect(
+      setupOptions({
+        style: {
+          layoutWidthType: LayoutWidthType.Compact,
+        },
+      }).style,
+    ).toMatchSnapshot();
   });
 
   test('should get custom options', () => {
-    const options = getSafetyOptions({
+    const options = setupOptions({
       tooltip: {
         enable: false,
         operation: {
@@ -218,7 +224,7 @@ describe('merge test', () => {
   });
 
   test('should get custom data config', () => {
-    const dataConfig = getSafetyDataConfig({
+    const dataConfig = setupDataConfig({
       fields: {
         rows: ['test'],
         values: ['value'],

packages/s2-core/src/facet/pivot-facet.ts

@@ -886,8 +886,10 @@ export class PivotFacet extends FrozenFacet {
               valueData,
             ) ?? valueData;
           const cellLabel = `${formattedValue}`;
-          const cellLabelWidth =
-            this.spreadsheet.measureTextWidthRoughly(cellLabel);
+          const cellLabelWidth = this.spreadsheet.measureTextWidthRoughly(
+            cellLabel,
+            dataCellTextStyle,
+          );
 
           if (cellLabelWidth > maxDataLabelWidth) {
             maxDataLabel = cellLabel;

packages/s2-core/src/sheet-type/spread-sheet.ts

@@ -69,11 +69,7 @@ import { removeOffscreenCanvas } from '../utils/canvas';
 import { clearValueRangeState } from '../utils/condition/state-controller';
 import { hideColumnsByThunkGroup } from '../utils/hide-columns';
 import { isMobile } from '../utils/is-mobile';
-import {
-  customMerge,
-  getSafetyDataConfig,
-  getSafetyOptions,
-} from '../utils/merge';
+import { customMerge, setupDataConfig, setupOptions } from '../utils/merge';
 import { injectThemeVars } from '../utils/theme';
 import { getTooltipData, getTooltipOptions } from '../utils/tooltip';
 import { getTheme } from '../theme';
@@ -146,8 +142,8 @@ export abstract class SpreadSheet extends EE {
     options: S2Options | null,
   ) {
     super();
-    this.dataCfg = getSafetyDataConfig(dataCfg);
-    this.options = getSafetyOptions(options);
+    this.dataCfg = setupDataConfig(dataCfg);
+    this.options = setupOptions(options);
     this.dataSet = this.getDataSet();
     this.setDebug();
     this.initTooltip();
@@ -366,9 +362,9 @@ export abstract class SpreadSheet extends EE {
   ) {
     this.store.set('originalDataCfg', dataCfg);
     if (reset) {
-      this.dataCfg = getSafetyDataConfig(dataCfg);
+      this.dataCfg = setupDataConfig(dataCfg);
     } else {
-      this.dataCfg = getSafetyDataConfig(this.dataCfg, dataCfg);
+      this.dataCfg = setupDataConfig(this.dataCfg, dataCfg);
     }
 
     // clear value ranger after each updated data cfg
@@ -389,7 +385,7 @@ export abstract class SpreadSheet extends EE {
     this.hideTooltip();
 
     if (reset) {
-      this.options = getSafetyOptions(options);
+      this.options = setupOptions(options);
     } else {
       this.options = customMerge(this.options, options);
     }

packages/s2-core/src/utils/merge.ts

@@ -1,6 +1,6 @@
 import { isArray, isEmpty, isEqual, isString, mergeWith, uniq } from 'lodash';
 import { DEFAULT_DATA_CONFIG } from '../common/constant/dataConfig';
-import { DEFAULT_OPTIONS } from '../common/constant/options';
+import { DEFAULT_OPTIONS, LayoutWidthType } from '../common/constant/options';
 import type {
   CustomHeaderFields,
   Fields,
@@ -41,9 +41,9 @@ const uniqueFields = (fields: Fields): Fields => {
   };
 };
 
-export const getSafetyDataConfig = (
+export const setupDataConfig = (
   ...dataConfig: (Partial<S2DataConfig> | null | undefined)[]
-) => {
+): S2DataConfig => {
   const mergedDataCfg = customMerge<S2DataConfig>(
     DEFAULT_DATA_CONFIG,
     ...dataConfig,
@@ -65,6 +65,17 @@ export const getSafetyDataConfig = (
   return mergedDataCfg;
 };
 
-export const getSafetyOptions = (
+export const setupOptions = (
   options: Partial<S2Options> | null | undefined,
-) => customMerge<S2Options>(DEFAULT_OPTIONS, options);
+): S2Options => {
+  const mergedOptions = customMerge<S2Options>(DEFAULT_OPTIONS, options);
+
+  if (
+    mergedOptions.style?.layoutWidthType === LayoutWidthType.Compact &&
+    mergedOptions.style?.dataCell!.maxLines! <= 1
+  ) {
+    mergedOptions.style.dataCell!.wordWrap = false;
+  }
+
+  return mergedOptions;
+};

packages/s2-react/src/components/sheets/base-sheet/index.tsx

@@ -1,4 +1,4 @@
-import { getSafetyDataConfig, S2_PREFIX_CLS } from '@antv/s2';
+import { setupDataConfig, S2_PREFIX_CLS } from '@antv/s2';
 import { Spin } from 'antd';
 import React from 'react';
 import { injectThemeVars } from '@antv/s2-shared';
@@ -32,7 +32,7 @@ export const BaseSheet: React.FC<SheetComponentsProps> = React.memo((props) => {
             style={{
               width: options?.width,
             }}
-            dataCfg={getSafetyDataConfig(dataCfg)}
+            dataCfg={setupDataConfig(dataCfg)}
             options={getSheetComponentOptions(options!)}
           />
         )}

s2-site/docs/manual/migration-v2.zh.md

@@ -691,6 +691,13 @@ const header = {
 
 具体请查看 [Tooltip](/manual/basic/tooltip) 相关文档。
 
+#### 配置预处理 API 变更
+
+```diff
+- import { getSafetyOptions, getSafetyDataConfig } from '@antv/s2'
++ import { setupOptions, setupDataConfig } from '@antv/s2'
+```
+
 ## ✍️ API 调整
 
 具体请查看标记为 <Badge type="success">New</Badge> 和 <Badge>Updated</Badge> 的 [`API 文档`](/api)