feat: auto col (#3798)

.vscode/settings.json

@@ -33,6 +33,7 @@
         "Duplicatable",
         "Dushusir",
         "endindex",
+        "endregion",
         "esbuild",
         "Ethi",
         "evented",

e2e/visual-comparison/sheets/sheets-gridlines.spec.ts

@@ -39,9 +39,10 @@ test('sheets no gridlines', async () => {
     const screenshot = await page.screenshot({
         mask: [
             page.locator('.univer-headerbar'),
+            page.locator('.univer-workbench-container-header'),
+            page.locator('.univer-formula-box'),
         ],
         fullPage: true,
     });
     expect(screenshot).toMatchSnapshot(filename, { maxDiffPixels: 5 });
 });
-

e2e/visual-comparison/sheets/sheets-visual-comparison.spec.ts

@@ -32,12 +32,13 @@ test('diff default sheet toolbar', async () => {
     await page.goto('http://localhost:3000/sheets/');
     await page.waitForTimeout(2000);
     await page.evaluate(() => window.E2EControllerAPI.loadDefaultSheet());
-    await page.waitForTimeout(5000);
+    await page.waitForTimeout(2000);
 
     const filename = generateSnapshotName('default-sheet-fullpage');
     const screenshot = await page.screenshot({
         mask: [
             page.locator('.univer-headerbar'),
+            page.locator('.univer-defined-name'),
         ],
         fullPage: true,
     });

packages/core/src/sheets/column-manager.ts

@@ -195,7 +195,6 @@ export class ColumnManager {
     /**
      * get given column data
      * @param columnPos column index
-     * @returns
      */
     getColumn(columnPos: number): Nullable<Partial<IColumnData>> {
         const column = this._columnData[columnPos];

packages/core/src/sheets/sheet-snapshot-utils.ts

@@ -14,8 +14,8 @@
  * limitations under the License.
  */
 
-import { BooleanNumber } from '../types/enum/text-style';
 import type { IWorksheetData } from './typedef';
+import { BooleanNumber } from '../types/enum/text-style';
 
 // TODO@wzhudev: default value should not be exposed, but the keys.
 

packages/core/src/sheets/typedef.ts

@@ -196,6 +196,11 @@ export interface IColumnData {
     s?: Nullable<IStyleData | string>;
 }
 
+export interface IColAutoWidthInfo {
+    col: number;
+    width?: number;
+}
+
 /**
  * Cell value type
  */
@@ -259,6 +264,7 @@ export interface ICellDataForSheetInterceptor extends ICellData {
     markers?: ICellMarks;
     customRender?: Nullable<ICellCustomRender[]>;
     interceptorAutoHeight?: () => number | undefined;
+    interceptorAutoWidth?: () => number | undefined;
     /**
      * can cell be covered when sibling is overflow
      */

packages/data-validation/src/validators/base-widget.ts

@@ -18,4 +18,5 @@ import type { ICellCustomRender, ICellRenderContext } from '@univerjs/core';
 
 export interface IBaseDataValidationWidget extends ICellCustomRender {
     calcCellAutoHeight(info: ICellRenderContext): number | undefined;
+    calcCellAutoWidth(info: ICellRenderContext): number | undefined;
 }

packages/docs-ui/src/controllers/render-controllers/doc.render-controller.ts

@@ -76,8 +76,6 @@ export class DocRenderController extends RxDisposable implements IRenderModule {
             top: 0,
             bottom: 0,
             right: 0,
-            explicitViewportWidthSet: false,
-            explicitViewportHeightSet: false,
             isWheelPreventDefaultX: true,
         });
 

packages/engine-render/src/basics/const.ts

@@ -133,6 +133,7 @@ export enum RENDER_CLASS_TYPE {
 }
 
 export const MAXIMUM_ROW_HEIGHT = 2000;
+export const MAXIMUM_COL_WIDTH = 2000;
 
 export const FIX_ONE_PIXEL_BLUR_OFFSET = 0.5;
 

packages/engine-render/src/components/sheets/column-header.ts

@@ -19,10 +19,10 @@
 import type { Nullable } from '@univerjs/core';
 import type { IViewportInfo, Vector2 } from '../../basics/vector2';
 import type { UniverRenderingContext } from '../../context';
-import { SheetColumnHeaderExtensionRegistry } from '../extension';
 import type { ColumnHeaderLayout, IColumnsHeaderCfgParam } from './extensions/column-header-layout';
-import { SpreadsheetHeader } from './sheet-component';
 import type { SpreadsheetSkeleton } from './sheet-skeleton';
+import { SheetColumnHeaderExtensionRegistry } from '../extension';
+import { SpreadsheetHeader } from './sheet-component';
 
 export class SpreadsheetColumnHeader extends SpreadsheetHeader {
     override getDocuments(): void {
@@ -54,7 +54,7 @@ export class SpreadsheetColumnHeader extends SpreadsheetHeader {
         if (!spreadsheetSkeleton) return;
 
         const parentScale = this.getParentScale();
-        spreadsheetSkeleton.calculateSegment(bounds);
+        spreadsheetSkeleton.updateVisibleRange(bounds);
         const segment = spreadsheetSkeleton.rowColumnSegment;
 
         if (!segment) return;

packages/engine-render/src/components/sheets/constants.ts

@@ -14,9 +14,15 @@
  * limitations under the License.
  */
 
+import { SHEET_VIEWPORT_KEY } from './interfaces';
+
 export const BORDER_Z_INDEX = 50;
 export const FONT_EXTENSION_Z_INDEX = 45;
 export const BG_Z_INDEX = 21;
 export const PRINTING_BG_Z_INDEX = 21;
 
 export const EXPAND_SIZE_FOR_RENDER_OVERFLOW = 20;
+
+export const sheetContentViewportKeys = [SHEET_VIEWPORT_KEY.VIEW_MAIN, SHEET_VIEWPORT_KEY.VIEW_MAIN_LEFT_TOP, SHEET_VIEWPORT_KEY.VIEW_MAIN_TOP, SHEET_VIEWPORT_KEY.VIEW_MAIN_LEFT];
+
+export const sheetHeaderViewportKeys = [SHEET_VIEWPORT_KEY.VIEW_ROW_TOP, SHEET_VIEWPORT_KEY.VIEW_ROW_BOTTOM, SHEET_VIEWPORT_KEY.VIEW_COLUMN_LEFT, SHEET_VIEWPORT_KEY.VIEW_COLUMN_RIGHT, SHEET_VIEWPORT_KEY.VIEW_LEFT_TOP];

packages/engine-render/src/components/sheets/extensions/font.ts

@@ -154,8 +154,12 @@ export class Font extends SheetExtension {
         const { ctx, viewRanges, diffRanges, spreadsheetSkeleton, cellInfo } = renderFontCtx;
 
         //#region merged cell
-        let { startY, endY, startX, endX } = cellInfo;
+        const { startY, endY, startX, endX } = cellInfo;
         const { isMerged, isMergedMainCell, mergeInfo } = cellInfo;
+        renderFontCtx.startX = startX;
+        renderFontCtx.startY = startY;
+        renderFontCtx.endX = endX;
+        renderFontCtx.endY = endY;
 
         // merged, but not primary cell, then skip. DO NOT RENDER AGAIN, or that would cause font blurry.
         if (isMerged && !isMergedMainCell) {
@@ -164,11 +168,12 @@ export class Font extends SheetExtension {
 
         // merged and primary cell
         if (isMergedMainCell) {
-            startY = mergeInfo.startY;
-            endY = mergeInfo.endY;
-            startX = mergeInfo.startX;
-            endX = mergeInfo.endX;
+            renderFontCtx.startX = mergeInfo.startX;
+            renderFontCtx.startY = mergeInfo.startY;
+            renderFontCtx.endX = mergeInfo.endX;
+            renderFontCtx.endY = mergeInfo.endY;
         }
+
         //#endregion
 
         const fontsConfig = fontMatrix.getValue(row, col);
@@ -205,14 +210,10 @@ export class Font extends SheetExtension {
         //#region text overflow
         renderFontCtx.overflowRectangle = overflowRange;
         renderFontCtx.cellData = cellData;
-        renderFontCtx.startX = startX;
-        renderFontCtx.startY = startY;
-        renderFontCtx.endX = endX;
-        renderFontCtx.endY = endY;
         this._setFontRenderBounds(renderFontCtx, row, col, fontMatrix);
         //#endregion
 
-        ctx.translate(startX + FIX_ONE_PIXEL_BLUR_OFFSET, startY + FIX_ONE_PIXEL_BLUR_OFFSET);
+        ctx.translate(renderFontCtx.startX + FIX_ONE_PIXEL_BLUR_OFFSET, renderFontCtx.startY + FIX_ONE_PIXEL_BLUR_OFFSET);
         this._renderDocuments(ctx, fontsConfig, renderFontCtx.startX, renderFontCtx.startY, renderFontCtx.endX, renderFontCtx.endY, row, col, spreadsheetSkeleton.overflowCache);
 
         ctx.closePath();
@@ -309,7 +310,7 @@ export class Font extends SheetExtension {
             }
         } else {
             ctx.rectByPrecision(startX + 1 / scale, startY + 1 / scale, cellWidth - 2 / scale, cellHeight - 2 / scale);
-            // for normal cell, forbid text overflow cellarea
+            // for normal cell, forbid text overflow cell area
             ctx.clip();
         }
         renderFontContext.startX = startX;

packages/engine-render/src/components/sheets/extensions/row-header-layout.ts

@@ -16,13 +16,13 @@
 
 import type { IScale } from '@univerjs/core';
 
+import type { UniverRenderingContext } from '../../../context';
+import type { IARowCfg, IARowCfgObj, IColumnStyleCfg, IRowStyleCfg } from '../interfaces';
+import type { SpreadsheetSkeleton } from '../sheet-skeleton';
 import { DEFAULT_FONTFACE_PLANE, FIX_ONE_PIXEL_BLUR_OFFSET, MIDDLE_CELL_POS_MAGIC_NUMBER } from '../../../basics/const';
 import { getColor } from '../../../basics/tools';
 import { SheetRowHeaderExtensionRegistry } from '../../extension';
 import { SheetExtension } from './sheet-extension';
-import type { UniverRenderingContext } from '../../../context';
-import type { IARowCfg, IARowCfgObj, IColumnStyleCfg, IRowStyleCfg } from '../interfaces';
-import type { SpreadsheetSkeleton } from '../sheet-skeleton';
 
 const UNIQUE_KEY = 'DefaultRowHeaderLayoutExtension';
 

packages/engine-render/src/components/sheets/row-header.ts

@@ -15,12 +15,12 @@
  */
 
 import type { Nullable } from '@univerjs/core';
-import { SheetRowHeaderExtensionRegistry } from '../extension';
-import { SpreadsheetHeader } from './sheet-component';
 import type { IViewportInfo, Vector2 } from '../../basics/vector2';
 import type { UniverRenderingContext } from '../../context';
 import type { IRowsHeaderCfgParam, RowHeaderLayout } from './extensions/row-header-layout';
 import type { SpreadsheetSkeleton } from './sheet-skeleton';
+import { SheetRowHeaderExtensionRegistry } from '../extension';
+import { SpreadsheetHeader } from './sheet-component';
 
 export class SpreadsheetRowHeader extends SpreadsheetHeader {
     override getDocuments() {
@@ -58,7 +58,7 @@ export class SpreadsheetRowHeader extends SpreadsheetHeader {
 
         const parentScale = this.getParentScale();
 
-        spreadsheetSkeleton.calculateSegment(bounds);
+        spreadsheetSkeleton.updateVisibleRange(bounds);
 
         const segment = spreadsheetSkeleton.rowColumnSegment;