@univerjs/sheets-ui 1.0.0-beta.0 → 1.0.0-beta.1

package/lib/es/index.js

@@ -1,17 +1,17 @@
 import { BreakLineCommand, CoverContentCommand, DOCS_COMPONENT_MAIN_LAYER_INDEX, DOCS_VIEW_KEY, DOC_VERTICAL_PADDING, DeleteLeftCommand, DeleteRightCommand, DocSelectionRenderService, IEditorService, IMEInputCommand, MoveCursorOperation, MoveSelectionOperation, NodePositionConvertToCursor, ReplaceSnapshotCommand, SetInlineFormatBoldCommand, SetInlineFormatCommand, SetInlineFormatFontFamilyCommand, SetInlineFormatFontSizeCommand, SetInlineFormatItalicCommand, SetInlineFormatStrikethroughCommand, SetInlineFormatSubscriptCommand, SetInlineFormatSuperscriptCommand, SetInlineFormatTextColorCommand, SetInlineFormatUnderlineCommand, UniverDocsUIPlugin, VIEWPORT_KEY, convertBodyToHtml, getCanvasOffsetByEngine, getLineBounding } from "@univerjs/docs-ui";
-import { AbsoluteRefType, BaselineOffset, BooleanNumber, BorderStyleTypes, CellModeEnum, CellValueType, ColorKit, CommandType, CustomRangeType, DEFAULT_EMPTY_DOCUMENT_VALUE, DEFAULT_STYLES, DEFAULT_WORKSHEET_COLUMN_COUNT, DEFAULT_WORKSHEET_COLUMN_TITLE_HEIGHT, DEFAULT_WORKSHEET_COLUMN_WIDTH, DEFAULT_WORKSHEET_COLUMN_WIDTH_KEY, DEFAULT_WORKSHEET_ROW_COUNT, DEFAULT_WORKSHEET_ROW_HEIGHT, DEFAULT_WORKSHEET_ROW_TITLE_WIDTH, DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY, DOCS_NORMAL_EDITOR_UNIT_ID_KEY, DataStreamTreeTokenType, DependentOn, Direction, Disposable, DisposableCollection, DocumentFlavor, EDITOR_ACTIVATED, ErrorService, FOCUSING_COMMENT_EDITOR, FOCUSING_COMMON_DRAWINGS, FOCUSING_EDITOR_INPUT_FORMULA, FOCUSING_EDITOR_STANDALONE, FOCUSING_FX_BAR_EDITOR, FOCUSING_SHAPE_TEXT_EDITOR, FOCUSING_SHEET, FOCUSING_UNIVER_EDITOR, FontItalic, FontWeight, HorizontalAlign, IAuthzIoService, ICommandService, IConfigService, IConfirmService, IContextService, ILogService, IPermissionService, IUndoRedoService, IUniverInstanceService, Inject, Injector, InterceptorEffectEnum, InterceptorManager, LRUMap, LocaleService, LocaleType, LookUp, NilCommand, ObjectMatrix, Optional, Plugin, PresetListType, Quantity, RANGE_TYPE, Range, Rectangle, RxDisposable, SHEET_EDITOR_UNITS, ThemeService, Tools, UndoCommandId, UniverInstanceType, UserManagerService, VerticalAlign, Workbook, WrapStrategy, cloneCellDataMatrix, cloneCellDataWithSpanAndDisplay, cloneValue, composeStyles, convertCellToRange, createDocumentModelWithStyle, createIdentifier, createInterceptorKey, createParagraphId, createSectionId, dateKit, debounce, extractPureTextFromCell, fromEventSubject, generateRandomId, get, getEmptyCell, getIntersectRange, getNumfmtParseValueFilter, getReverseDirection, handleStyleToString, isDefaultFormat, isFormulaString, isInternalEditorID, isNotNullOrUndefined, isRealNum, isSafeUrl, isTextFormat, isValidRange, merge, mergeOverrideWithDependencies, nameCharacterCheck, numberToABC, numfmt, registerDependencies, sequenceExecute, set, skipParseTagNames, sortRules, splitIntoGrid, throttle, toDisposable, touchDependencies, willLoseNumericPrecision } from "@univerjs/core";
+import { AbsoluteRefType, BaselineOffset, BooleanNumber, BorderStyleTypes, CellModeEnum, CellValueType, ColorKit, CommandType, CustomRangeType, DEFAULT_EMPTY_DOCUMENT_VALUE, DEFAULT_STYLES, DEFAULT_WORKSHEET_COLUMN_COUNT, DEFAULT_WORKSHEET_COLUMN_WIDTH, DEFAULT_WORKSHEET_COLUMN_WIDTH_KEY, DEFAULT_WORKSHEET_ROW_COUNT, DEFAULT_WORKSHEET_ROW_HEIGHT, DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY, DOCS_NORMAL_EDITOR_UNIT_ID_KEY, DataStreamTreeTokenType, DependentOn, Direction, Disposable, DisposableCollection, DocumentFlavor, EDITOR_ACTIVATED, ErrorService, FOCUSING_COMMENT_EDITOR, FOCUSING_COMMON_DRAWINGS, FOCUSING_EDITOR_INPUT_FORMULA, FOCUSING_EDITOR_STANDALONE, FOCUSING_FX_BAR_EDITOR, FOCUSING_SHAPE_TEXT_EDITOR, FOCUSING_SHEET, FOCUSING_UNIVER_EDITOR, FontItalic, FontWeight, HorizontalAlign, IAuthzIoService, ICommandService, IConfigService, IConfirmService, IContextService, ILogService, IPermissionService, IUndoRedoService, IUniverInstanceService, Inject, Injector, InterceptorEffectEnum, InterceptorManager, LRUMap, LocaleService, LocaleType, LookUp, NilCommand, ObjectMatrix, Optional, Plugin, PresetListType, Quantity, RANGE_TYPE, Range, Rectangle, RxDisposable, SHEET_EDITOR_UNITS, ThemeService, Tools, UndoCommandId, UniverInstanceType, UserManagerService, VerticalAlign, Workbook, WrapStrategy, cloneCellDataMatrix, cloneCellDataWithSpanAndDisplay, cloneValue, composeStyles, convertCellToRange, createDocumentModelWithStyle, createIdentifier, createInterceptorKey, createParagraphId, createSectionId, dateKit, debounce, extractPureTextFromCell, fromEventSubject, generateRandomId, get, getEmptyCell, getIntersectRange, getNumfmtParseValueFilter, getReverseDirection, handleStyleToString, isDefaultFormat, isFormulaString, isInternalEditorID, isNotNullOrUndefined, isRealNum, isSafeUrl, isTextFormat, isValidRange, merge, mergeOverrideWithDependencies, nameCharacterCheck, numberToABC, numfmt, registerDependencies, sequenceExecute, set, skipParseTagNames, sortRules, splitIntoGrid, throttle, toDisposable, touchDependencies, willLoseNumericPrecision } from "@univerjs/core";
 import { AUTO_FILL_APPLY_TYPE, AUTO_FILL_HOOK_TYPE, AddMergeUndoMutationFactory, AddRangeProtectionCommand, AddRangeProtectionMutation, AddWorksheetMergeAllCommand, AddWorksheetMergeCommand, AddWorksheetMergeHorizontalCommand, AddWorksheetMergeMutation, AddWorksheetMergeVerticalCommand, AddWorksheetProtectionCommand, AutoClearContentCommand, AutoFillCommand, AutoFillController, BEFORE_CELL_EDIT, BorderStyleManagerService, COMMAND_LISTENER_SKELETON_CHANGE, COMMAND_LISTENER_VALUE_CHANGE, CancelFrozenCommand, CancelMarkDirtyRowAutoHeightOperation, ClearSelectionAllCommand, ClearSelectionContentCommand, ClearSelectionFormatCommand, CopySheetCommand, DeleteRangeMoveLeftCommand, DeleteRangeMoveUpCommand, DeleteRangeProtectionCommand, DeleteRangeProtectionMutation, DeleteWorksheetProtectionCommand, DeltaColumnWidthCommand, DeltaRowHeightCommand, EditStateEnum, IAutoFillService, IExclusiveRangeService, INTERCEPTOR_POINT, INumfmtService, IRefSelectionsService, InsertColBeforeCommand, InsertColCommand, InsertColMutation, InsertDefinedNameCommand, InsertMultiColsLeftCommand, InsertMultiColsRightCommand, InsertMultiRowsAboveCommand, InsertMultiRowsAfterCommand, InsertRangeMoveDownCommand, InsertRangeMoveRightCommand, InsertRowBeforeCommand, InsertRowCommand, InsertRowMutation, InsertSheetCommand, InsertSheetMutation, MAX_CELL_PER_SHEET_KEY, MERGE_CELL_INTERCEPTOR_CHECK, MarkDirtyRowAutoHeightOperation, MergeCellController, MoveColsCommand, MoveColsMutation, MoveRangeCommand, MoveRangeMutation, MoveRowsCommand, MoveRowsMutation, REF_SELECTIONS_ENABLED, RangeProtectionCache, RangeProtectionPermissionEditPoint, RangeProtectionPermissionViewPoint, RangeProtectionRuleModel, RefRangeService, RefSelectionsService, RefillCommand, RemoveColCommand, RemoveColMutation, RemoveDefinedNameCommand, RemoveMergeUndoMutationFactory, RemoveRowCommand, RemoveRowMutation, RemoveSheetCommand, RemoveSheetMutation, RemoveWorksheetMergeCommand, RemoveWorksheetMergeMutation, ResetBackgroundColorCommand, ResetTextColorCommand, SCOPE_WORKBOOK_VALUE_DEFINED_NAME, SELECTIONS_ENABLED, SELECTION_CONTROL_BORDER_BUFFER_COLOR, SELECTION_CONTROL_BORDER_BUFFER_WIDTH, SHEETS_PLUGIN_CONFIG_KEY, ScrollToCellOperation, SelectionMoveType, SetBackgroundColorCommand, SetBoldCommand, SetBorderBasicCommand, SetBorderCommand, SetColHiddenCommand, SetColHiddenMutation, SetColVisibleMutation, SetColWidthCommand, SetDefinedNameCommand, SetFontFamilyCommand, SetFontSizeCommand, SetFrozenCommand, SetFrozenMutation, SetFrozenMutationFactory, SetHorizontalTextAlignCommand, SetItalicCommand, SetProtectionCommand, SetRangeValuesCommand, SetRangeValuesMutation, SetRangeValuesUndoMutationFactory, SetRowHeightCommand, SetRowHiddenCommand, SetRowHiddenMutation, SetRowVisibleMutation, SetSelectedColsVisibleCommand, SetSelectedRowsVisibleCommand, SetSelectionsOperation, SetShrinkToFitCommand, SetSpecificColsVisibleCommand, SetSpecificRowsVisibleCommand, SetStrikeThroughCommand, SetStyleCommand, SetTabColorCommand, SetTabColorMutation, SetTextColorCommand, SetTextRotationCommand, SetTextWrapCommand, SetUnderlineCommand, SetVerticalTextAlignCommand, SetWorksheetActivateCommand, SetWorksheetActiveOperation, SetWorksheetColWidthMutation, SetWorksheetColWidthMutationFactory, SetWorksheetHideCommand, SetWorksheetHideMutation, SetWorksheetNameCommand, SetWorksheetNameMutation, SetWorksheetOrderCommand, SetWorksheetOrderMutation, SetWorksheetPermissionPointsCommand, SetWorksheetRowAutoHeightMutation, SetWorksheetRowAutoHeightMutationFactory, SetWorksheetRowHeightMutation, SetWorksheetRowIsAutoHeightCommand, SetWorksheetRowIsAutoHeightMutation, SetWorksheetShowCommand, SheetCopyDownCommand, SheetCopyRightCommand, SheetInterceptorService, SheetPermissionCheckController, SheetPermissionInitController, SheetSkeletonService, SheetsSelectionsService, TextToNumberCommand, ToggleCellCheckboxCommand, ToggleGridlinesCommand, ToggleGridlinesMutation, UniverSheetsPlugin, ViewStateEnum, WorkbookCopyPermission, WorkbookCreateProtectPermission, WorkbookCreateSheetPermission, WorkbookDeleteColumnPermission, WorkbookDeleteRowPermission, WorkbookDeleteSheetPermission, WorkbookEditablePermission, WorkbookHideSheetPermission, WorkbookInsertColumnPermission, WorkbookInsertRowPermission, WorkbookManageCollaboratorPermission, WorkbookRenameSheetPermission, WorksheetCopyPermission, WorksheetDeleteColumnPermission, WorksheetDeleteProtectionPermission, WorksheetDeleteRowPermission, WorksheetEditPermission, WorksheetInsertColumnPermission, WorksheetInsertRowPermission, WorksheetManageCollaboratorPermission, WorksheetProtectionPointModel, WorksheetProtectionRuleModel, WorksheetSetCellStylePermission, WorksheetSetCellValuePermission, WorksheetSetColumnStylePermission, WorksheetSetRowStylePermission, WorksheetViewPermission, adjustRangeOnMutation, alignToMergedCellsBorders, attachPrimaryWithCoord, attachRangeWithCoord, attachSelectionWithCoord, baseProtectionActions, convertPrimaryWithCoordToPrimary, convertSelectionDataToRange, countCells, defaultLargeSheetOperationConfig, deserializeListOptions, discreteRangeToRange, expandToContinuousRange, getAddMergeMutationRangeByType, getAllWorksheetPermissionPoint, getCellAtRowCol, getClearContentMutationParamsForRanges, getMoveRangeCommandMutations, getPrimaryForRange, getSelectionsService, getSheetCommandTarget, isCellImage, rangeToDiscreteRange, serializeListOptions, setEndForRange, validateDefinedName } from "@univerjs/sheets";
 import { AnchoredContextMenu, BuiltInUIPart, COLOR_PICKER_COMPONENT, ComponentContainer, ComponentManager, ContextMenuGroup, ContextMenuPosition, CopyCommand, CutCommand, DISABLE_AUTO_FOCUS_KEY, FILE_PNG_CLIPBOARD_MIME_TYPE, FILE__BMP_CLIPBOARD_MIME_TYPE, FILE__JPEG_CLIPBOARD_MIME_TYPE, FILE__WEBP_CLIPBOARD_MIME_TYPE, FONT_FAMILY_COMPONENT, FONT_FAMILY_ITEM_COMPONENT, FONT_SIZE_COMPONENT, FONT_SIZE_LIST, HTML_CLIPBOARD_MIME_TYPE, ICanvasPopupService, IClipboardInterfaceService, IContextMenuService, IDialogService, ILayoutService, IMenuManagerService, IMessageService, INotificationService, IPlatformService, IShortcutService, ISidebarService, IUIPartsService, IconManager, KeyCode, MenuItemType, MetaKeys, PLAIN_TEXT_CLIPBOARD_MIME_TYPE, PasteCommand, RibbonPosition, RibbonStartGroup, RibbonViewGroup, SheetPasteShortKeyCommandName, Slider, ToggleFullscreenOperation, ToolbarItem, UI_PLUGIN_CONFIG_KEY, UniverMobileUIPlugin, ZoomInput, connectInjector, getMenuHiddenObservable, handleStringToStyle, imageMimeTypeSet, sanitizeParsedHtml, textTrim, useComponentsOfPart, useConfigValue, useDependency, useEvent, useObservable, useSidebarClick, useVirtualList } from "@univerjs/ui";
-import { CURSOR_TYPE, DashedRect, DeviceInputEventType, Engine, FIX_ONE_PIXEL_BLUR_OFFSET, Group, IRenderManagerService, Layer, RENDER_CLASS_TYPE, RENDER_RAW_FORMULA_KEY, Rect, RegularPolygon, RenderUnit, SHEET_EXTENSION_PREFIX, SHEET_VIEWPORT_KEY, Scene, ScrollBar, ScrollTimer, ScrollTimerType, Shape, SheetExtension, Spreadsheet, SpreadsheetColumnHeader, SpreadsheetRowHeader, TRANSFORM_CHANGE_OBSERVABLE_TYPE, UniverRenderEnginePlugin, Vector2, Viewport, calculateCellImageRect, cancelRequestFrame, convertTextRotation, convertTransformToOffsetX, convertTransformToOffsetY, fixLineWidthByScale, getCurrentTypeOfRenderer, getNextWheelZoomRatio, ptToPixel, requestNewFrame, withCurrentTypeOfRenderer } from "@univerjs/engine-render";
-import { BehaviorSubject, EMPTY, Observable, Subject, Subscription, combineLatest, combineLatestWith, distinctUntilChanged, filter, firstValueFrom, from, fromEvent, map, merge as merge$1, of, shareReplay, skip, startWith, switchMap, take, takeUntil, throttleTime, timeout, withLatestFrom } from "rxjs";
+import { CURSOR_TYPE, DashedRect, DeviceInputEventType, FIX_ONE_PIXEL_BLUR_OFFSET, Group, IRenderManagerService, Layer, RENDER_CLASS_TYPE, RENDER_RAW_FORMULA_KEY, Rect, RegularPolygon, SHEET_EXTENSION_PREFIX, SHEET_VIEWPORT_KEY, ScrollBar, ScrollTimer, ScrollTimerType, Shape, SheetExtension, Spreadsheet, SpreadsheetColumnHeader, SpreadsheetRowHeader, TRANSFORM_CHANGE_OBSERVABLE_TYPE, UniverRenderEnginePlugin, Vector2, Viewport, calculateCellImageRect, cancelRequestFrame, convertTextRotation, convertTransformToOffsetX, convertTransformToOffsetY, fixLineWidthByScale, getCurrentTypeOfRenderer, getNextWheelZoomRatio, ptToPixel, requestNewFrame, withCurrentTypeOfRenderer } from "@univerjs/engine-render";
+import { BehaviorSubject, EMPTY, Observable, Subject, Subscription, combineLatest, combineLatestWith, distinctUntilChanged, filter, from, fromEvent, map, merge as merge$1, of, shareReplay, skip, startWith, switchMap, takeUntil, throttleTime, withLatestFrom } from "rxjs";
 import { DocSelectionManagerService, DocSkeletonManagerService, InsertTextCommand, RichTextEditingMutation, SetTextSelectionsOperation, UniverDocsPlugin } from "@univerjs/docs";
 import { ObjectScope, UnitAction, UnitObject, UnitRole } from "@univerjs/protocol";
 import { Avatar, Button, Calendar, CascaderList, ColorPicker, ConfigContext, Confirm, Dropdown, DropdownMenu, FormLayout, Input, InputNumber, MessageType, Radio, RadioGroup, Select, Separator, Switch, TimeInput, Tooltip, borderBottomClassName, borderClassName, borderRightClassName, borderTopClassName, clsx, scrollbarClassName } from "@univerjs/design";
-import { AddImageIcon, AdjustHeightDoubleIcon, AdjustWidthDoubleIcon, AlignBottomIcon, AlignTopIcon, AllBorderIcon, AutoHeightDoubleIcon, AutoWidthDoubleIcon, AutofillDoubleIcon, AutowrapIcon, BackSlashDoubleIcon, BoldIcon, BrushIcon, CancelFreezeIcon, CancelMergeIcon, CheckMarkIcon, ClearFormatDoubleIcon, CloseIcon, CodeIcon, ConvertIcon, ConvertToNumberIcon, CopyDoubleIcon, CutIcon, DeleteCellShiftLeftDoubleIcon, DeleteCellShiftUpDoubleIcon, DeleteColumnDoubleIcon, DeleteIcon, DeleteRowDoubleIcon, DownBorderDoubleIcon, DownIcon, DownloadImageIcon, ErrorIcon, EyeIcon, EyelashIcon, FontColorDoubleIcon, FontSizeIncreaseIcon, FontSizeReduceIcon, FreezeColumnIcon, FreezeRowIcon, FreezeToSelectedIcon, FxIcon, HideDoubleIcon, HideGridlinesIcon, HorizontalBorderDoubleIcon, HorizontalMergeIcon, HorizontallyIcon, IncreaseIcon, InfoIcon, InnerBorderDoubleIcon, InsertCellDownDoubleIcon, InsertCellShiftRightDoubleIcon, InsertDoubleIcon, InsertRowAboveDoubleIcon, InsertRowBelowDoubleIcon, ItalicIcon, LeftBorderDoubleIcon, LeftDoubleDiagonalDoubleIcon, LeftInsertColumnDoubleIcon, LeftJustifyingIcon, LeftRotationFortyFiveDegreesIcon, LeftRotationNinetyDegreesIcon, LeftTridiagonalDoubleIcon, LoadingMultiIcon, LockIcon, MergeAllIcon, MoreDownIcon, MoreLeftIcon, MoreRightIcon, NoBorderIcon, NoColorDoubleIcon, NoRotationIcon, OuterBorderDoubleIcon, OverflowIcon, PaintBucketDoubleIcon, PasteSpecialDoubleIcon, PenIcon, ProtectIcon, ReduceDoubleIcon, RightBorderDoubleIcon, RightDoubleDiagonalDoubleIcon, RightInsertColumnDoubleIcon, RightJustifyingIcon, RightRotationFortyFiveDegreesIcon, RightRotationNinetyDegreesIcon, ShrinkToFitIcon, SlashDoubleIcon, StrikethroughIcon, SubscriptIcon, SuperscriptIcon, TruncationIcon, UnderlineIcon, UpBorderDoubleIcon, VerticalBorderDoubleIcon, VerticalCenterIcon, VerticalIntegrationIcon, VerticalTextIcon, WarningIcon, WriteIcon } from "@univerjs/icons";
-import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
-import { FUNCTION_NAMES_MATH, FUNCTION_NAMES_STATISTICAL, FUNCTION_NAMES_TEXT, FormulaDataModel, IDefinedNamesService, IFunctionService, ISuperTableService, LexerTreeBuilder, NullValueObject, SetFormulaCalculationNotificationMutation, UniverFormulaEnginePlugin, deserializeRangeWithSheet, isReferenceStringWithEffectiveColumn, isReferenceStrings, matchToken, operatorToken, sequenceNodeType, serializeRange, serializeRangeWithSheet } from "@univerjs/engine-formula";
-import { ITelemetryService } from "@univerjs/telemetry";
+import { AddImageIcon, AdjustHeightDoubleIcon, AdjustWidthDoubleIcon, AlignBottomIcon, AlignTopIcon, AllBorderIcon, AutoHeightDoubleIcon, AutoWidthDoubleIcon, AutofillDoubleIcon, AutowrapIcon, BackSlashDoubleIcon, BasesMultiIcon, BoardsMultiIcon, BoldIcon, BrushIcon, CancelFreezeIcon, CancelMergeIcon, CheckMarkIcon, ClearFormatDoubleIcon, CloseIcon, CodeIcon, ConvertIcon, ConvertToNumberIcon, CopyDoubleIcon, CutIcon, DeleteCellShiftLeftDoubleIcon, DeleteCellShiftUpDoubleIcon, DeleteColumnDoubleIcon, DeleteIcon, DeleteRowDoubleIcon, DocsMultiIcon, DownBorderDoubleIcon, DownIcon, DownloadImageIcon, ErrorIcon, EyeIcon, EyelashIcon, FontColorDoubleIcon, FontSizeIncreaseIcon, FontSizeReduceIcon, FreezeColumnIcon, FreezeRowIcon, FreezeToSelectedIcon, FxIcon, HideDoubleIcon, HideGridlinesIcon, HorizontalBorderDoubleIcon, HorizontalMergeIcon, HorizontallyIcon, IncreaseIcon, InfoIcon, InnerBorderDoubleIcon, InsertCellDownDoubleIcon, InsertCellShiftRightDoubleIcon, InsertDoubleIcon, InsertRowAboveDoubleIcon, InsertRowBelowDoubleIcon, ItalicIcon, LeftBorderDoubleIcon, LeftDoubleDiagonalDoubleIcon, LeftInsertColumnDoubleIcon, LeftJustifyingIcon, LeftRotationFortyFiveDegreesIcon, LeftRotationNinetyDegreesIcon, LeftTridiagonalDoubleIcon, LockIcon, MergeAllIcon, MoreDownIcon, MoreLeftIcon, MoreRightIcon, NoBorderIcon, NoColorDoubleIcon, NoRotationIcon, OuterBorderDoubleIcon, OverflowIcon, PaintBucketDoubleIcon, PasteSpecialDoubleIcon, PenIcon, ProtectIcon, ReduceDoubleIcon, RightBorderDoubleIcon, RightDoubleDiagonalDoubleIcon, RightInsertColumnDoubleIcon, RightJustifyingIcon, RightRotationFortyFiveDegreesIcon, RightRotationNinetyDegreesIcon, SheetsMultiIcon, ShrinkToFitIcon, SlashDoubleIcon, SlidesMultiIcon, StrikethroughIcon, SubscriptIcon, SuperscriptIcon, TruncationIcon, UnderlineIcon, UpBorderDoubleIcon, VerticalBorderDoubleIcon, VerticalCenterIcon, VerticalIntegrationIcon, VerticalTextIcon, WarningIcon, WriteIcon } from "@univerjs/icons";
+import { useCallback, useContext, useEffect, useMemo, useReducer, useRef, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { FUNCTION_NAMES_MATH, FUNCTION_NAMES_STATISTICAL, FUNCTION_NAMES_TEXT, FormulaDataModel, IDefinedNamesService, IFunctionService, ISuperTableService, LexerTreeBuilder, NullValueObject, SetFormulaCalculationNotificationMutation, UniverFormulaEnginePlugin, deserializeRangeWithSheet, isReferenceStringWithEffectiveColumn, isReferenceStrings, matchToken, operatorToken, quoteSheetName, sequenceNodeType, serializeRange, serializeRangeWithSheet } from "@univerjs/engine-formula";
+import { ITelemetryService } from "@univerjs/telemetry";
 import { debounceTime, filter as filter$1, map as map$1, shareReplay as shareReplay$1, startWith as startWith$1, switchMap as switchMap$1 } from "rxjs/operators";
 
 //#region src/basics/editor/get-editor-object.ts
@@ -92,6 +92,40 @@ function whenEditorDidNotInputFormulaActivated(contextService) {
 
 //#endregion
 //#region src/controllers/utils/range-tools.ts
+function groupConsecutive(values, start, end) {
+	const groups = [];
+	for (let index = start; index <= end; index++) {
+		const value = values[index];
+		const previous = groups[groups.length - 1];
+		if (previous && value === previous.end + 1) previous.end = value;
+		else groups.push({
+			start: value,
+			end: value
+		});
+	}
+	return groups;
+}
+function projectLine(values, start, end) {
+	let low = 0;
+	let high = values.length;
+	while (low < high) {
+		const middle = Math.floor((low + high) / 2);
+		if (values[middle] < start) low = middle + 1;
+		else high = middle;
+	}
+	const first = low;
+	if (first === values.length || values[first] > end) return null;
+	high = values.length;
+	while (low < high) {
+		const middle = Math.floor((low + high) / 2);
+		if (values[middle] <= end) low = middle + 1;
+		else high = middle;
+	}
+	return {
+		start: first,
+		end: low - 1
+	};
+}
 function virtualizeDiscreteRanges(ranges) {
 	let totalRows = [];
 	let totalCols = [];
@@ -115,7 +149,27 @@ function virtualizeDiscreteRanges(ranges) {
 		mapFunc: (row, col) => ({
 			row: totalRows[row],
 			col: totalCols[col]
-		})
+		}),
+		mapRange: (range) => {
+			const rowGroups = groupConsecutive(totalRows, range.startRow, range.endRow);
+			const columnGroups = groupConsecutive(totalCols, range.startColumn, range.endColumn);
+			return rowGroups.flatMap((row) => columnGroups.map((column) => ({
+				startRow: row.start,
+				endRow: row.end,
+				startColumn: column.start,
+				endColumn: column.end
+			})));
+		},
+		projectRange: (range) => {
+			const row = projectLine(totalRows, range.startRow, range.endRow);
+			const column = projectLine(totalCols, range.startColumn, range.endColumn);
+			return row && column ? {
+				startRow: row.start,
+				endRow: row.end,
+				startColumn: column.start,
+				endColumn: column.end
+			} : null;
+		}
 	};
 }
 
@@ -130,7 +184,7 @@ let SELECTION_SHAPE_DEPTH = /* @__PURE__ */ function(SELECTION_SHAPE_DEPTH) {
 }({});
 function genNormalSelectionStyle(themeService) {
 	const primaryColor = themeService.getColorFromTheme("primary.600");
-	const whiteColor = themeService.getColorFromTheme("white");
+	const gray0Color = themeService.getColorFromTheme("gray.0");
 	const fill = new ColorKit(primaryColor).setAlpha(.07).toRgbString();
 	return {
 		strokeWidth: 1,
@@ -139,10 +193,10 @@ function genNormalSelectionStyle(themeService) {
 		widgets: {},
 		widgetSize: 6,
 		widgetStrokeWidth: 1,
-		widgetStroke: whiteColor,
+		widgetStroke: gray0Color,
 		autofillSize: 6,
 		autofillStrokeWidth: 1,
-		autofillStroke: whiteColor,
+		autofillStroke: gray0Color,
 		rowHeaderFill: fill,
 		rowHeaderStroke: primaryColor,
 		rowHeaderStrokeWidth: 1,
@@ -4009,6 +4063,10 @@ const IMAGE_MIME_TO_EXTENSION = {
 	[FILE__BMP_CLIPBOARD_MIME_TYPE]: "bmp"
 };
 const FORMULA_CLIPBOARD_MIME_TYPE = "web application/x-univer-sheets-formula";
+function wrapHtmlForExcel(html) {
+	var _html$match;
+	return `<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><meta name="ProgId" content="Excel.Sheet"><meta name="Generator" content="Univer"></head><body><!--StartFragment-->${((_html$match = html.match(/<table[\s\S]*<\/table>/)) === null || _html$match === void 0 ? void 0 : _html$match[0]) ?? html}<!--EndFragment--></body></html>`;
+}
 /**
 * This service provide hooks for sheet features to supplement content or modify behavior of clipboard.
 */
@@ -4103,7 +4161,7 @@ let SheetClipboardService = class SheetClipboardService extends Disposable {
 			matrix: matrixFragment,
 			copyType
 		});
-		await this._clipboardInterfaceService.write(plain, html, formulaClipboardPayload ? { [FORMULA_CLIPBOARD_MIME_TYPE]: formulaClipboardPayload } : void 0);
+		await this._clipboardInterfaceService.write(plain, wrapHtmlForExcel(html), formulaClipboardPayload ? { [FORMULA_CLIPBOARD_MIME_TYPE]: formulaClipboardPayload } : void 0);
 		this._markSelectionService.removeAllShapes();
 		const style = createCopyPasteSelectionStyle(this._themeService);
 		this._copyMarkId = this._markSelectionService.addShape({
@@ -4123,7 +4181,9 @@ let SheetClipboardService = class SheetClipboardService extends Disposable {
 		const imageIndex = types.findIndex((type) => imageMimeTypeSet.has(type));
 		const shouldUseHTMLPaste = imageIndex === -1 || !htmlContainsImage(html);
 		if (html && shouldUseHTMLPaste) {
-			if (this._platformService.isWindows && htmlIsFromExcel(html)) this._notificationService.show({
+			const copyId = extractId(html);
+			const isInternalCopy = Boolean(copyId && this._copyContentCache.get(copyId));
+			if (this._platformService.isWindows && htmlIsFromExcel(html) && !isInternalCopy) this._notificationService.show({
 				type: "warning",
 				title: this._localeService.t("sheets-ui.clipboard.shortCutNotify.title"),
 				content: this._localeService.t("sheets-ui.clipboard.shortCutNotify.useShortCutInstead")
@@ -7232,6 +7292,9 @@ let SheetsScrollRenderController = class SheetsScrollRenderController extends Di
 		this._commandService = _commandService;
 		this._renderManagerService = _renderManagerService;
 		this._scrollManagerService = _scrollManagerService;
+		_defineProperty(this, "_pendingWheelOffsetX", 0);
+		_defineProperty(this, "_pendingWheelOffsetY", 0);
+		_defineProperty(this, "_pendingWheelFrameId", null);
 		this._initCommandListener();
 		this._wheelEventListener();
 		this._scrollBarEventListener();
@@ -7242,6 +7305,12 @@ let SheetsScrollRenderController = class SheetsScrollRenderController extends Di
 		if (!scene) return;
 		const viewMain = scene.getViewport(SHEET_VIEWPORT_KEY.VIEW_MAIN);
 		if (!viewMain) return;
+		this.disposeWithMe(toDisposable(() => {
+			if (this._pendingWheelFrameId != null) {
+				cancelAnimationFrame(this._pendingWheelFrameId);
+				this._pendingWheelFrameId = null;
+			}
+		}));
 		this.disposeWithMe(scene.onMouseWheel$.subscribeEvent((evt, state) => {
 			if (evt.ctrlKey || !this._contextService.getContextValue(FOCUSING_SHEET)) return;
 			let offsetX = 0;
@@ -7257,14 +7326,15 @@ let SheetsScrollRenderController = class SheetsScrollRenderController extends Di
 				if (absOffsetY >= absOffsetX * WHEEL_CROSS_AXIS_LOCK_RATIO) offsetX = 0;
 				else if (absOffsetX >= absOffsetY * WHEEL_CROSS_AXIS_LOCK_RATIO) offsetY = 0;
 			}
-			const targetViewportScrollX = viewMain.viewportScrollX + offsetX;
-			const targetViewportScrollY = viewMain.viewportScrollY + offsetY;
-			const { x: targetScrollX, y: targetScrollY } = viewMain.transViewportScroll2ScrollValue(targetViewportScrollX, targetViewportScrollY);
-			this._commandService.executeCommand(SetScrollRelativeCommand.id, {
-				offsetX,
-				offsetY
+			this._pendingWheelOffsetX += offsetX;
+			this._pendingWheelOffsetY += offsetY;
+			if (this._pendingWheelFrameId == null) this._pendingWheelFrameId = requestAnimationFrame(() => {
+				this._pendingWheelFrameId = null;
+				this._flushPendingWheelScroll();
 			});
-			this._context.scene.makeDirty(true);
+			const targetViewportScrollX = viewMain.viewportScrollX + this._pendingWheelOffsetX;
+			const targetViewportScrollY = viewMain.viewportScrollY + this._pendingWheelOffsetY;
+			const { x: targetScrollX, y: targetScrollY } = viewMain.transViewportScroll2ScrollValue(targetViewportScrollX, targetViewportScrollY);
 			const isLimitedStore = viewMain.limitedScroll(targetScrollX, targetScrollY);
 			if (isLimitedStore && !isLimitedStore.isLimitedX && !isLimitedStore.isLimitedY) {
 				evt.preventDefault();
@@ -7273,6 +7343,30 @@ let SheetsScrollRenderController = class SheetsScrollRenderController extends Di
 			if (viewMain.isWheelPreventDefaultX && viewMain.isWheelPreventDefaultY) evt.preventDefault();
 		}));
 	}
+	_flushPendingWheelScroll() {
+		const offsetX = this._pendingWheelOffsetX;
+		const offsetY = this._pendingWheelOffsetY;
+		if (offsetX === 0 && offsetY === 0) return;
+		this._pendingWheelOffsetX = 0;
+		this._pendingWheelOffsetY = 0;
+		const canUseScrollFastPath = this._canUseScrollFastPath();
+		this._commandService.executeCommand(SetScrollRelativeCommand.id, {
+			offsetX,
+			offsetY
+		});
+		this._markSceneDirtyForScrolling(canUseScrollFastPath);
+	}
+	_canUseScrollFastPath() {
+		var _this$_getSheetObject, _spreadsheet$getSkele;
+		const { scene } = this._context;
+		const spreadsheet = (_this$_getSheetObject = this._getSheetObject()) === null || _this$_getSheetObject === void 0 ? void 0 : _this$_getSheetObject.spreadsheet;
+		return scene.getParent().classType === RENDER_CLASS_TYPE.ENGINE && !scene.isDirty() && spreadsheet != null && !spreadsheet.isDirty() && !spreadsheet.isForceDirty() && ((_spreadsheet$getSkele = spreadsheet.getSkeleton()) === null || _spreadsheet$getSkele === void 0 ? void 0 : _spreadsheet$getSkele.worksheet.getMergeData().length) === 0 && scene.getViewports().every((viewport) => !viewport.shouldIntoRender() || !viewport.isDirty && !viewport.isForceDirty) && scene.getLayers().every((layer) => layer.getObjectsByOrder().every((object) => !object.isDirty()));
+	}
+	_markSceneDirtyForScrolling(canUseScrollFastPath) {
+		const { scene } = this._context;
+		if (canUseScrollFastPath) scene.makeDirtyForScrolling();
+		else scene.makeDirty(true);
+	}
 	_scrollBarEventListener() {
 		const { scene } = this._context;
 		if (scene == null) return;
@@ -7525,8 +7619,8 @@ let SheetsScrollRenderController = class SheetsScrollRenderController extends Di
 		return getSelectionsService(this._injector);
 	}
 	_getViewportBounding() {
-		var _this$_getSheetObject, _this$_sheetSkeletonM5;
-		const scene = (_this$_getSheetObject = this._getSheetObject()) === null || _this$_getSheetObject === void 0 ? void 0 : _this$_getSheetObject.scene;
+		var _this$_getSheetObject2, _this$_sheetSkeletonM5;
+		const scene = (_this$_getSheetObject2 = this._getSheetObject()) === null || _this$_getSheetObject2 === void 0 ? void 0 : _this$_getSheetObject2.scene;
 		if (scene == null) return;
 		const viewport = scene.getViewport(SHEET_VIEWPORT_KEY.VIEW_MAIN);
 		if (viewport == null) return;
@@ -7536,10 +7630,10 @@ let SheetsScrollRenderController = class SheetsScrollRenderController extends Di
 		return skeleton.getRangeByViewBound(vpInfo.viewBound);
 	}
 	_scrollToCell(row, column, forceTop = false, forceLeft = false) {
-		var _this$_getSheetObject2, _this$_sheetSkeletonM6;
+		var _this$_getSheetObject3, _this$_sheetSkeletonM6;
 		const { rowHeightAccumulation, columnWidthAccumulation } = this._sheetSkeletonManagerService.getCurrentSkeleton() ?? {};
 		if (rowHeightAccumulation == null || columnWidthAccumulation == null) return false;
-		const scene = (_this$_getSheetObject2 = this._getSheetObject()) === null || _this$_getSheetObject2 === void 0 ? void 0 : _this$_getSheetObject2.scene;
+		const scene = (_this$_getSheetObject3 = this._getSheetObject()) === null || _this$_getSheetObject3 === void 0 ? void 0 : _this$_getSheetObject3.scene;
 		if (scene == null) return false;
 		const viewport = scene.getViewport(SHEET_VIEWPORT_KEY.VIEW_MAIN);
 		if (viewport == null) return false;
@@ -9240,1057 +9334,382 @@ CellCustomRenderController = __decorate([
 ], CellCustomRenderController);
 
 //#endregion
-//#region src/controllers/render-controllers/sheet.render-controller.ts
-const FRAME_STACK_THRESHOLD = 60;
-let SheetRenderController = class SheetRenderController extends RxDisposable {
-	constructor(_context, _configService, _sheetSkeletonManagerService, _sheetRenderService, _commandService, _telemetryService) {
-		super();
-		this._context = _context;
-		this._configService = _configService;
-		this._sheetSkeletonManagerService = _sheetSkeletonManagerService;
-		this._sheetRenderService = _sheetRenderService;
-		this._commandService = _commandService;
-		this._telemetryService = _telemetryService;
-		_defineProperty(this, "_renderMetric$", new Subject());
-		_defineProperty(this, "renderMetric$", this._renderMetric$.asObservable());
-		_defineProperty(this, "_renderFrameTimeMetric", null);
-		_defineProperty(this, "_renderFrameTags", {});
-		_defineProperty(this, "_afterRenderMetric$", new Subject());
-		this._addNewRender();
-		this._initRenderMetricSubscriber();
+//#region src/views/hook.ts
+function useActiveWorkbook() {
+	const univerInstanceService = useDependency(IUniverInstanceService);
+	return useObservable(() => univerInstanceService.getCurrentTypeOfUnit$(UniverInstanceType.UNIVER_SHEET), void 0, void 0, []) ?? null;
+}
+function useActiveWorksheet(workbook) {
+	return useObservable(() => (workbook === null || workbook === void 0 ? void 0 : workbook.activeSheet$) ?? of(null), void 0, void 0, [workbook]);
+}
+function useWorkbooks() {
+	const univerInstanceService = useDependency(IUniverInstanceService);
+	return useObservable(() => {
+		return merge$1([univerInstanceService.getTypeOfUnitAdded$(UniverInstanceType.UNIVER_SHEET), univerInstanceService.getTypeOfUnitDisposed$(UniverInstanceType.UNIVER_SHEET)]).pipe(map(() => univerInstanceService.getAllUnitsForType(UniverInstanceType.UNIVER_SHEET)), startWith(univerInstanceService.getAllUnitsForType(UniverInstanceType.UNIVER_SHEET)));
+	}, [], void 0, [univerInstanceService]);
+}
+
+//#endregion
+//#region src/views/clipboard/ClipboardPopupMenu.tsx
+const DEFAULT_PADDING = 2;
+const SheetPasteOptions = [
+	{
+		value: "DEFAULT_PASTE",
+		label: "sheets-ui.rightClick.paste"
+	},
+	{
+		value: "SPECIAL_PASTE_VALUE",
+		label: "sheets-ui.rightClick.pasteValue"
+	},
+	{
+		value: "SPECIAL_PASTE_FORMAT",
+		label: "sheets-ui.rightClick.pasteFormat"
+	},
+	{
+		value: "SPECIAL_PASTE_COL_WIDTH",
+		label: "sheets-ui.rightClick.pasteColWidth"
+	},
+	{
+		value: "SPECIAL_PASTE_BESIDES_BORDER",
+		label: "sheets-ui.rightClick.pasteBesidesBorder"
+	},
+	{
+		value: "SPECIAL_PASTE_FORMULA",
+		label: "sheets-ui.rightClick.pasteFormula"
 	}
-	_addNewRender() {
-		const { scene, engine, unit: workbook } = this._context;
-		this._addComponent(workbook);
-		this._initRerenderScheduler();
-		this._initCommandListener();
-		const worksheet = this._context.unit.getActiveSheet();
-		if (!worksheet) throw new Error("No active sheet found");
-		const sheetId = worksheet.getSheetId();
-		this._sheetSkeletonManagerService.setCurrent({ sheetId });
-		const frameFn = () => scene.render();
-		this.disposeWithMe(this._context.activated$.subscribe((activated) => {
-			if (activated) engine.runRenderLoop(frameFn);
-			else engine.stopRenderLoop(frameFn);
-		}));
+];
+const useMenuPosition = (range) => {
+	var _scene$getEngine;
+	const univerInstanceService = useDependency(IUniverInstanceService);
+	const renderManagerService = useDependency(IRenderManagerService);
+	const workbook = useActiveWorkbook();
+	if (!range || !workbook) return null;
+	const anchor = {
+		startRow: range.rows[0],
+		startCol: range.cols[0],
+		endRow: range.rows[range.rows.length - 1],
+		endCol: range.cols[range.cols.length - 1]
+	};
+	if (anchor.endRow < 0 || anchor.endCol < 0) return null;
+	const ru = renderManagerService.getRenderUnitById(workbook.getUnitId());
+	const sheetSkeletonManagerService = ru === null || ru === void 0 ? void 0 : ru.with(SheetSkeletonManagerService);
+	const sheetObject = getSheetObject(univerInstanceService, renderManagerService);
+	if (!sheetObject) return null;
+	const { scene } = sheetObject;
+	const skeleton = sheetSkeletonManagerService === null || sheetSkeletonManagerService === void 0 ? void 0 : sheetSkeletonManagerService.getCurrentSkeleton();
+	const viewport = getViewportByCell(anchor.endRow, anchor.endCol, scene, workbook.getActiveSheet());
+	if (!viewport) return null;
+	const scaleX = scene === null || scene === void 0 ? void 0 : scene.scaleX;
+	const scaleY = scene === null || scene === void 0 ? void 0 : scene.scaleY;
+	const scrollXY = scene === null || scene === void 0 ? void 0 : scene.getViewportScrollXY(viewport);
+	const canvas = (_scene$getEngine = scene.getEngine()) === null || _scene$getEngine === void 0 ? void 0 : _scene$getEngine.getCanvas();
+	if (!scaleX || !scene || !scaleX || !scaleY || !scrollXY) return null;
+	const endPosition = skeleton === null || skeleton === void 0 ? void 0 : skeleton.getNoMergeCellWithCoordByIndex(anchor.endRow, anchor.endCol);
+	const endX = (endPosition === null || endPosition === void 0 ? void 0 : endPosition.endX) ?? 0;
+	const endY = (endPosition === null || endPosition === void 0 ? void 0 : endPosition.endY) ?? 0;
+	const positionEndX = convertTransformToOffsetX(endX, scaleX, scrollXY) ?? -9999;
+	const positionEndY = convertTransformToOffsetY(endY, scaleY, scrollXY) ?? -9999;
+	const canvasWidth = canvas === null || canvas === void 0 ? void 0 : canvas.getWidth();
+	const canvasHeight = canvas === null || canvas === void 0 ? void 0 : canvas.getHeight();
+	if (!canvasWidth || !canvasHeight) return null;
+	const XInSideView = positionEndX + 50 <= canvasWidth;
+	const YInSideView = positionEndY + 50 <= canvasHeight;
+	let positionX = positionEndX;
+	let positionY = positionEndY;
+	if (!XInSideView) positionX = canvasWidth - 100;
+	if (!YInSideView) positionY = canvasHeight - 100;
+	return {
+		positionX,
+		positionY
+	};
+};
+const ClipboardPopupMenu = () => {
+	const clipboardService = useDependency(ISheetClipboardService);
+	const showMenu = useObservable(clipboardService.showMenu$, false);
+	const pasteOptionsCache = useObservable(clipboardService.pasteOptionsCache$, null);
+	const localeService = useDependency(LocaleService);
+	const commandService = useDependency(ICommandService);
+	const [menuHovered, setMenuHovered] = useState(false);
+	const [visible, setVisible] = useState(false);
+	const range = pasteOptionsCache === null || pasteOptionsCache === void 0 ? void 0 : pasteOptionsCache.target.pastedRange;
+	const relativePosition = useMenuPosition(range);
+	if (!relativePosition || !showMenu) return null;
+	if (relativePosition.positionX < 50 || relativePosition.positionY < 30) return null;
+	const showMore = menuHovered || visible;
+	const handleClick = (type) => {
+		setVisible(false);
+		commandService.executeCommand(SheetOptionalPasteCommand.id, { type });
+	};
+	return /* @__PURE__ */ jsx("div", {
+		className: "univer-absolute univer-inset-0 univer-z-10 univer-size-0",
+		children: /* @__PURE__ */ jsx("div", {
+			className: "univer-absolute",
+			style: {
+				left: relativePosition.positionX + DEFAULT_PADDING,
+				top: relativePosition.positionY + DEFAULT_PADDING
+			},
+			onMouseEnter: () => setMenuHovered(true),
+			onMouseLeave: () => setMenuHovered(false),
+			children: /* @__PURE__ */ jsx(DropdownMenu, {
+				align: "start",
+				items: SheetPasteOptions.map((item) => ({
+					type: "checkbox",
+					value: item.value,
+					label: localeService.t(item.label),
+					checked: (pasteOptionsCache === null || pasteOptionsCache === void 0 ? void 0 : pasteOptionsCache.pasteType) === PREDEFINED_HOOK_NAME_PASTE[item.value],
+					onSelect: () => handleClick(item.value)
+				})),
+				open: visible,
+				onOpenChange: setVisible,
+				children: /* @__PURE__ */ jsxs("div", {
+					className: clsx("univer-flex univer-items-center univer-gap-2 univer-rounded univer-p-1 hover:univer-bg-gray-100 dark:hover:!univer-bg-gray-800", borderClassName, {
+						"univer-bg-gray-100 dark:!univer-bg-gray-800": visible,
+						"univer-bg-gray-0 dark:!univer-bg-gray-900": !visible
+					}),
+					children: [/* @__PURE__ */ jsx(PasteSpecialDoubleIcon, { className: "univer-fill-primary-600 univer-text-gray-900 dark:!univer-text-gray-0" }), showMore && /* @__PURE__ */ jsx(MoreDownIcon, { className: "dark:!univer-text-gray-0" })]
+				})
+			})
+		})
+	});
+};
+
+//#endregion
+//#region src/controllers/clipboard/const.ts
+/**
+* Copyright 2023-present DreamNum Co., Ltd.
+*
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+*     http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+*/
+const RemovePasteMenuCommands = [
+	SetCellEditVisibleOperation.id,
+	SetRangeValuesCommand.id,
+	SetZoomRatioOperation.id,
+	MoveRangeMutation.id,
+	RemoveRowMutation.id,
+	RemoveColMutation.id,
+	InsertRowMutation.id,
+	InsertColMutation.id,
+	MoveRowsMutation.id,
+	MoveColsMutation.id,
+	SetWorksheetColWidthMutation.id,
+	SetWorksheetRowHeightMutation.id,
+	SetSelectionsOperation.id,
+	UndoCommandId
+];
+
+//#endregion
+//#region src/services/editor/cell-editor-manager.service.ts
+var CellEditorManagerService = class {
+	constructor() {
+		_defineProperty(this, "_state", null);
+		_defineProperty(this, "_rect", null);
+		_defineProperty(this, "_state$", new BehaviorSubject(null));
+		_defineProperty(this, "state$", this._state$.asObservable());
+		_defineProperty(this, "_rect$", new BehaviorSubject(null));
+		_defineProperty(this, "rect$", this._rect$.asObservable());
+		_defineProperty(this, "_focus", false);
+		_defineProperty(this, "_focus$", new BehaviorSubject(this._focus));
+		_defineProperty(this, "focus$", this._focus$.asObservable());
 	}
-	_initRenderMetricSubscriber() {
-		const { engine } = this._context;
-		this.disposeWithMe(engine.beginFrame$.subscribe(() => {
-			this._renderFrameTimeMetric = null;
-			this._renderFrameTags = {};
-		}));
-		this.disposeWithMe(engine.endFrame$.subscribe(() => {
-			if (this._renderFrameTimeMetric && Object.keys(this._renderFrameTimeMetric).some((key) => key.startsWith(SHEET_EXTENSION_PREFIX))) this._afterRenderMetric$.next({
-				frameTimeMetric: this._renderFrameTimeMetric,
-				tags: this._renderFrameTags
-			});
-		}));
-		this.disposeWithMe(engine.renderFrameTimeMetric$.subscribe(([key, value]) => {
-			if (!this._renderFrameTimeMetric) this._renderFrameTimeMetric = {};
-			if (!this._renderFrameTimeMetric[key]) this._renderFrameTimeMetric[key] = [];
-			this._renderFrameTimeMetric[key].push(Math.round(value * 100) / 100);
-		}));
-		this.disposeWithMe(engine.renderFrameTags$.subscribe(([key, value]) => {
-			this._renderFrameTags[key] = value;
-		}));
-		const frameInfoList = [];
-		this.disposeWithMe(this._afterRenderMetric$.pipe(withLatestFrom(engine.endFrame$)).subscribe(([sceneRenderDetail, basicFrameTimeInfo]) => {
-			frameInfoList.push({
-				FPS: basicFrameTimeInfo.FPS,
-				elapsedTime: basicFrameTimeInfo.elapsedTime,
-				frameTime: Math.round(basicFrameTimeInfo.frameTime * 100) / 100,
-				...sceneRenderDetail.frameTimeMetric,
-				...sceneRenderDetail.tags
-			});
-			if (frameInfoList.length > FRAME_STACK_THRESHOLD) {
-				this._captureRenderMetric(frameInfoList);
-				frameInfoList.length = 0;
-			}
-		}));
+	dispose() {
+		this._state$.complete();
+		this._state = null;
+		this._rect$.complete();
+		this._rect = null;
+	}
+	setState(param) {
+		this._state = param;
+		this._refresh(param);
+	}
+	getRect() {
+		return this._rect;
+	}
+	setRect(param) {
+		this._rect = param;
+		this._rect$.next(param);
+	}
+	getState() {
+		return this._state;
+	}
+	setFocus(param = false) {
+		this._focus = param;
+		this._focus$.next(param);
+	}
+	_refresh(param) {
+		this._state$.next(param);
+	}
+};
+const ICellEditorManagerService = createIdentifier("univer.sheet-cell-editor-manager.service");
+
+//#endregion
+//#region src/services/sheet-embed-integration.service.ts
+const SHEET_EMBED_INTERACTION_BOUNDARY_OWNER_ATTRIBUTE = "data-embed-interaction-boundary-owner";
+const SHEET_EMBED_RUNTIME_FOCUS_ROLE_ATTRIBUTE = "data-embed-runtime-focus-role";
+const SHEET_EMBED_FLOAT_DOM_ATTRIBUTE = "data-embed-float-dom";
+const SHEET_EMBED_ID_ATTRIBUTE = "data-embed-id";
+const SHEET_EMBED_HOST_UNIT_ID_ATTRIBUTE = "data-embed-host-unit-id";
+const SHEET_EMBED_CHILD_UNIT_ID_ATTRIBUTE = "data-embed-child-unit-id";
+const SHEET_EMBED_CHILD_TYPE_ATTRIBUTE = "data-embed-child-type";
+const ISheetEmbedInteractionBoundaryService = createIdentifier("sheets-ui.embed-interaction-boundary.service");
+const ISheetEmbedRuntimeFocusCoordinator = createIdentifier("sheets-ui.embed-runtime-focus-coordinator");
+const ISheetEmbedFloatingGeometryService = createIdentifier("sheets-ui.embed-floating-geometry.service");
+function resolveSheetEmbedRuntimeDomScope(element) {
+	var _element$closest;
+	if (!element) return;
+	const embedId = ((_element$closest = element.closest(`[${"data-embed-interaction-boundary-owner"}]`)) === null || _element$closest === void 0 ? void 0 : _element$closest.getAttribute("data-embed-interaction-boundary-owner")) ?? void 0;
+	const container = resolveSheetEmbedFloatDomContainer(element, embedId);
+	const resolvedEmbedId = (container === null || container === void 0 ? void 0 : container.getAttribute("data-embed-id")) ?? embedId;
+	if (!resolvedEmbedId) return;
+	return {
+		embedId: resolvedEmbedId,
+		hostUnitId: (container === null || container === void 0 ? void 0 : container.getAttribute("data-embed-host-unit-id")) ?? void 0,
+		childUnitId: (container === null || container === void 0 ? void 0 : container.getAttribute("data-embed-child-unit-id")) ?? void 0,
+		childType: readChildType(container)
+	};
+}
+function resolveActiveSheetEmbedRuntimeDomScope(ownerDocument = document) {
+	const activeContainer = ownerDocument.querySelector(`[${SHEET_EMBED_FLOAT_DOM_ATTRIBUTE}="true"][data-embed-float-stage="stage2"]`);
+	if (!activeContainer) return;
+	return resolveSheetEmbedRuntimeDomScope(activeContainer);
+}
+function resolveSheetEmbedFloatDomContainer(element, embedId) {
+	const ownContainer = element === null || element === void 0 ? void 0 : element.closest(`[${SHEET_EMBED_FLOAT_DOM_ATTRIBUTE}="true"]`);
+	if (ownContainer && (!embedId || ownContainer.getAttribute("data-embed-id") === embedId)) return ownContainer;
+	const ownerDocument = (element === null || element === void 0 ? void 0 : element.ownerDocument) ?? (typeof document === "undefined" ? void 0 : document);
+	if (!ownerDocument || !embedId) return ownContainer ?? void 0;
+	return ownerDocument.querySelector(`[${"data-embed-float-dom"}="true"][${"data-embed-id"}="${escapeAttributeValue(embedId)}"]`) ?? void 0;
+}
+function escapeAttributeValue(value) {
+	return value.replace(/\\/g, "\\\\").replace(/"/g, "\\\"");
+}
+function readChildType(container) {
+	const value = container === null || container === void 0 ? void 0 : container.getAttribute(SHEET_EMBED_CHILD_TYPE_ATTRIBUTE);
+	if (value == null || value === "") return;
+	return Number(value);
+}
+
+//#endregion
+//#region src/services/editor/cell-editor-resize.service.ts
+const EDITOR_INPUT_SELF_EXTEND_GAP = 5;
+const EDITOR_BORDER_SIZE = 2;
+let SheetCellEditorResizeService = class SheetCellEditorResizeService extends Disposable {
+	constructor(_layoutService, _cellEditorManagerService, _editorBridgeService, _renderManagerService, _univerInstanceService, _configService, _embedFloatingGeometryService) {
+		super();
+		this._layoutService = _layoutService;
+		this._cellEditorManagerService = _cellEditorManagerService;
+		this._editorBridgeService = _editorBridgeService;
+		this._renderManagerService = _renderManagerService;
+		this._univerInstanceService = _univerInstanceService;
+		this._configService = _configService;
+		this._embedFloatingGeometryService = _embedFloatingGeometryService;
+	}
+	get _currentRenderer() {
+		return getCurrentTypeOfRenderer(UniverInstanceType.UNIVER_SHEET, this._univerInstanceService, this._renderManagerService);
+	}
+	get _editingUnitId() {
+		var _this$_editorBridgeSe;
+		return ((_this$_editorBridgeSe = this._editorBridgeService.getEditCellState()) === null || _this$_editorBridgeSe === void 0 ? void 0 : _this$_editorBridgeSe.unitId) ?? "";
+	}
+	get _editingRenderer() {
+		return this._renderManagerService.getRenderUnitById(this._editingUnitId);
+	}
+	get _renderer() {
+		return this._editingRenderer ?? this._currentRenderer;
+	}
+	get _sheetSkeletonManagerService() {
+		var _this$_renderer;
+		return (_this$_renderer = this._renderer) === null || _this$_renderer === void 0 ? void 0 : _this$_renderer.with(SheetSkeletonManagerService);
+	}
+	get engine() {
+		var _this$_renderer2;
+		return (_this$_renderer2 = this._renderer) === null || _this$_renderer2 === void 0 ? void 0 : _this$_renderer2.engine;
+	}
+	fitTextSize(callback) {
+		const param = this._editorBridgeService.getEditCellState();
+		if (!param) return;
+		const { position, documentLayoutObject, canvasOffset, scaleX, scaleY } = param;
+		const { startX, startY, endX, endY } = position;
+		const documentDataModel = this._univerInstanceService.getUnit(DOCS_NORMAL_EDITOR_UNIT_ID_KEY, UniverInstanceType.UNIVER_DOC);
+		if (documentDataModel == null) return;
+		const documentSkeleton = this._getEditorSkeleton();
+		if (!documentSkeleton) return;
+		documentSkeleton.resetInitialWidth();
+		const info = this._predictingSize(position, canvasOffset, documentSkeleton, documentLayoutObject, scaleX, scaleY);
+		if (!info || info.actualWidth <= 0) return;
+		let { actualWidth, actualHeight } = info;
+		const { verticalAlign, horizontalAlign, paddingData, fill } = documentLayoutObject;
+		actualWidth = actualWidth + (paddingData.l ?? 0) * scaleX + (paddingData.r ?? 0) * scaleX;
+		actualHeight = actualHeight + (paddingData.t ?? 0) * scaleY + (paddingData.b ?? 0) * scaleY;
+		let editorWidth = endX - startX;
+		let editorHeight = endY - startY;
+		if (editorWidth < actualWidth) editorWidth = Math.ceil(actualWidth);
+		if (editorHeight < actualHeight) editorHeight = Math.ceil(actualHeight);
+		let offsetTop = 0;
+		if (verticalAlign === VerticalAlign.MIDDLE) offsetTop = (editorHeight - actualHeight) / 2 / scaleY;
+		else if (verticalAlign === VerticalAlign.TOP) offsetTop = paddingData.t || 0;
+		else offsetTop = (editorHeight - actualHeight) / scaleY;
+		let offsetLeft = 0;
+		if (horizontalAlign === HorizontalAlign.CENTER) {} else if (horizontalAlign === HorizontalAlign.RIGHT) offsetLeft = (editorWidth - actualWidth) / scaleX;
+		else offsetLeft = paddingData.l || 0;
+		offsetTop = Math.max(offsetTop, paddingData.t || 0);
+		offsetLeft = Math.max(offsetLeft, paddingData.l || 0);
+		documentDataModel.updateDocumentDataMargin({
+			t: offsetTop,
+			l: offsetLeft
+		});
+		documentSkeleton.calculate();
+		this._editAreaProcessing(editorWidth, editorHeight, position, canvasOffset, fill, scaleX, scaleY, horizontalAlign, callback);
 	}
 	/**
-	* Send render metric to telemetry service
-	* @param frameInfoList
+	* Mainly used to pre-calculate the width of the editor,
+	* to determine whether it needs to be automatically widened.
 	*/
-	_captureRenderMetric(frameInfoList) {
-		var _this$_telemetryServi;
-		const filteredFrameInfo = frameInfoList;
-		if (filteredFrameInfo.length === 0) return;
-		const sumValueForNumListFields = (data) => {
-			let totalSum = 0;
-			const sums = Object.entries(data).filter(([_, value]) => Array.isArray(value)).map(([key]) => key).reduce((acc, key) => {
-				acc[key] = data[key].reduce((sum, num) => sum + num, 0);
-				return acc;
-			}, {});
-			Object.keys(data).filter((key) => key.startsWith(SHEET_EXTENSION_PREFIX)).forEach((key) => {
-				totalSum += sums[key];
+	_predictingSize(actualRangeWithCoord, canvasOffset, documentSkeleton, documentLayoutObject, scaleX = 1, scaleY = 1) {
+		const { startX, endX } = actualRangeWithCoord;
+		const { textRotation, wrapStrategy, paddingData } = documentLayoutObject;
+		const documentDataModel = this._univerInstanceService.getUnit(DOCS_NORMAL_EDITOR_UNIT_ID_KEY, UniverInstanceType.UNIVER_DOC);
+		const { vertexAngle: angle } = convertTextRotation(textRotation);
+		if (wrapStrategy === WrapStrategy.WRAP && angle === 0) {
+			documentDataModel === null || documentDataModel === void 0 || documentDataModel.updateDocumentDataPageSize((endX - startX) / scaleX);
+			documentDataModel === null || documentDataModel === void 0 || documentDataModel.updateDocumentDataMargin({
+				l: paddingData.l,
+				t: paddingData.t
 			});
+			documentSkeleton.calculate();
+			const { actualWidth, actualHeight } = documentSkeleton.getActualSize();
 			return {
-				...sums,
-				extensionTotal: totalSum
-			};
-		};
-		const frameTimeListAfterSum = frameInfoList.map((info) => {
-			return {
-				...info,
-				...sumValueForNumListFields(info)
+				actualWidth: actualWidth * scaleX,
+				actualHeight: actualHeight * scaleY
 			};
+		}
+		const maxSize = this._getEditorMaxSize(actualRangeWithCoord, canvasOffset, documentLayoutObject.horizontalAlign);
+		if (!maxSize) return;
+		documentDataModel === null || documentDataModel === void 0 || documentDataModel.updateDocumentDataPageSize(maxSize.width / scaleX);
+		documentSkeleton.calculate();
+		const size = documentSkeleton.getActualSize();
+		let editorWidth = endX - startX;
+		if (editorWidth < size.actualWidth * scaleX + EDITOR_INPUT_SELF_EXTEND_GAP * scaleX) editorWidth = size.actualWidth * scaleX + EDITOR_INPUT_SELF_EXTEND_GAP * scaleX;
+		documentDataModel === null || documentDataModel === void 0 || documentDataModel.updateDocumentDataPageSize(editorWidth / scaleX);
+		/**
+		* Do not rely on cell layout logic, depend on the document's internal alignment logic.
+		*/
+		documentDataModel === null || documentDataModel === void 0 || documentDataModel.updateDocumentRenderConfig({
+			horizontalAlign: HorizontalAlign.UNSPECIFIED,
+			cellValueType: void 0
 		});
-		const getSummaryStats = (list) => {
-			return Object.entries(list[0]).filter(([key, _]) => !["elapsedTime"].includes(key)).filter(([_, value]) => typeof value === "number").map(([key]) => key).reduce((acc, key) => {
-				const values = list.map((obj) => obj[key]);
-				const max = Math.max(...values);
-				const min = Math.min(...values);
-				const avg = values.reduce((sum, val) => sum + val, 0) / values.length;
-				acc[key] = {
-					max: Math.round(max * 100) / 100,
-					min: Math.round(min * 100) / 100,
-					avg: Math.round(avg * 100) / 100
-				};
-				return acc;
-			}, {});
-		};
-		const summaryFrameStats = getSummaryStats(frameTimeListAfterSum);
-		const elapsedTimeToStart = filteredFrameInfo[filteredFrameInfo.length - 1].elapsedTime;
-		const telemetryData = {
-			sheetId: this._context.unit.getActiveSheet().getSheetId(),
-			unitId: this._context.unit.getUnitId(),
-			elapsedTimeToStart,
-			...summaryFrameStats
-		};
-		this._renderMetric$.next(telemetryData);
-		(_this$_telemetryServi = this._telemetryService) === null || _this$_telemetryServi === void 0 || _this$_telemetryServi.capture("sheet_render_cost", telemetryData);
-	}
-	_addComponent(workbook) {
-		const { scene, components } = this._context;
-		const worksheet = workbook.getActiveSheet();
-		const spreadsheet = new Spreadsheet("__SpreadsheetRender__");
-		this._addViewport(worksheet);
-		const spreadsheetRowHeader = new SpreadsheetRowHeader("__SpreadsheetRowHeader__");
-		const spreadsheetColumnHeader = new SpreadsheetColumnHeader("__SpreadsheetColumnHeader__");
-		const SpreadsheetLeftTopPlaceholder = new Rect("__SpreadsheetLeftTopPlaceholder__", {
-			zIndex: 2,
-			left: -1,
-			top: -1,
-			fill: "rgb(248, 249, 250)",
-			stroke: "rgb(217, 217, 217)",
-			strokeWidth: 1
-		});
-		this._context.mainComponent = spreadsheet;
-		components.set("__SpreadsheetRender__", spreadsheet);
-		components.set("__SpreadsheetRowHeader__", spreadsheetRowHeader);
-		components.set("__SpreadsheetColumnHeader__", spreadsheetColumnHeader);
-		components.set("__SpreadsheetLeftTopPlaceholder__", SpreadsheetLeftTopPlaceholder);
-		scene.addObjects([spreadsheet], 0);
-		scene.addObjects([
-			spreadsheetRowHeader,
-			spreadsheetColumnHeader,
-			SpreadsheetLeftTopPlaceholder
-		], 10);
-		scene.enableLayerCache(0, 10);
-	}
-	_initViewports(scene, rowHeader, columnHeader) {
-		const rowHeaderWidth = rowHeader.hidden ? 0 : rowHeader.width;
-		const columnHeaderHeight = columnHeader.hidden ? 0 : columnHeader.height;
-		const bufferEdgeX = 100;
-		const bufferEdgeY = 100;
-		const viewMain = new Viewport(SHEET_VIEWPORT_KEY.VIEW_MAIN, scene, {
-			left: rowHeaderWidth,
-			top: columnHeaderHeight,
-			bottom: 0,
-			right: 0,
-			isWheelPreventDefaultX: true,
-			allowCache: true,
-			bufferEdgeX,
-			bufferEdgeY
-		});
-		const viewMainLeftTop = new Viewport(SHEET_VIEWPORT_KEY.VIEW_MAIN_LEFT_TOP, scene, {
-			isWheelPreventDefaultX: true,
-			active: false,
-			allowCache: true,
-			bufferEdgeX: 0,
-			bufferEdgeY: 0
-		});
-		const viewMainLeft = new Viewport(SHEET_VIEWPORT_KEY.VIEW_MAIN_LEFT, scene, {
-			isWheelPreventDefaultX: true,
-			active: false,
-			allowCache: true,
-			bufferEdgeX: 0,
-			bufferEdgeY
-		});
-		const viewMainTop = new Viewport(SHEET_VIEWPORT_KEY.VIEW_MAIN_TOP, scene, {
-			isWheelPreventDefaultX: true,
-			active: false,
-			allowCache: true,
-			bufferEdgeX,
-			bufferEdgeY: 0
-		});
-		const viewRowTop = new Viewport(SHEET_VIEWPORT_KEY.VIEW_ROW_TOP, scene, {
-			active: false,
-			isWheelPreventDefaultX: true
-		});
-		const viewRowBottom = new Viewport(SHEET_VIEWPORT_KEY.VIEW_ROW_BOTTOM, scene, {
-			left: 0,
-			top: columnHeaderHeight,
-			bottom: 0,
-			width: rowHeaderWidth + 1,
-			isWheelPreventDefaultX: true
-		});
-		const viewColumnLeft = new Viewport(SHEET_VIEWPORT_KEY.VIEW_COLUMN_LEFT, scene, {
-			active: false,
-			isWheelPreventDefaultX: true
-		});
-		const viewColumnRight = new Viewport(SHEET_VIEWPORT_KEY.VIEW_COLUMN_RIGHT, scene, {
-			left: rowHeaderWidth,
-			top: 0,
-			height: columnHeaderHeight + 1,
-			right: 0,
-			isWheelPreventDefaultX: true
-		});
-		return {
-			viewMain,
-			viewLeftTop: new Viewport(SHEET_VIEWPORT_KEY.VIEW_LEFT_TOP, scene, {
-				left: 0,
-				top: 0,
-				width: rowHeaderWidth,
-				height: columnHeaderHeight,
-				isWheelPreventDefaultX: true
-			}),
-			viewMainLeftTop,
-			viewMainLeft,
-			viewMainTop,
-			viewColumnLeft,
-			viewRowTop,
-			viewRowBottom,
-			viewColumnRight
-		};
-	}
-	/**
-	*
-	* initViewport & wheel event
-	* +-----------------+--------------------+-------------------+
-	* |  VIEW_LEFT_TOP  |  VIEW_COLUMN_LEFT  | VIEW_COLUMN_RIGHT |
-	* +-----------------+--------------------+-------------------+
-	* |  VIEW_ROW_TOP   | VIEW_MAIN_LEFT_TOP |   VIEW_MAIN_TOP   |
-	* +-----------------+--------------------+-------------------+
-	* | VIEW_ROW_BOTTOM |   VIEW_MAIN_LEFT   |     VIEW_MAIN     |
-	* +-----------------+--------------------+-------------------+
-	*/
-	_addViewport(worksheet) {
-		const scene = this._context.scene;
-		const { rowHeader, columnHeader } = worksheet.getConfig();
-		const { viewMain } = this._initViewports(scene, rowHeader, columnHeader);
-		const sheetsUIConfig = this._configService.getConfig(SHEETS_UI_PLUGIN_CONFIG_KEY);
-		new ScrollBar(viewMain, sheetsUIConfig === null || sheetsUIConfig === void 0 ? void 0 : sheetsUIConfig.scrollConfig);
-		scene.attachControl();
-		return viewMain;
-	}
-	_initRerenderScheduler() {
-		this.disposeWithMe(this._sheetSkeletonManagerService.currentSkeleton$.subscribe((param) => {
-			if (!param) return null;
-			const { skeleton: spreadsheetSkeleton, sheetId } = param;
-			const workbook = this._context.unit;
-			const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getSheetBySheetId(sheetId);
-			if (workbook == null || worksheet == null) return;
-			const { mainComponent, components } = this._context;
-			const spreadsheet = mainComponent;
-			const spreadsheetRowHeader = components.get("__SpreadsheetRowHeader__");
-			const spreadsheetColumnHeader = components.get("__SpreadsheetColumnHeader__");
-			const spreadsheetLeftTopPlaceholder = components.get("__SpreadsheetLeftTopPlaceholder__");
-			const leftTopPlaceholderSize = getLeftTopPlaceholderSize(spreadsheetSkeleton);
-			spreadsheet === null || spreadsheet === void 0 || spreadsheet.updateSkeleton(spreadsheetSkeleton);
-			spreadsheetRowHeader === null || spreadsheetRowHeader === void 0 || spreadsheetRowHeader.updateSkeleton(spreadsheetSkeleton);
-			spreadsheetColumnHeader === null || spreadsheetColumnHeader === void 0 || spreadsheetColumnHeader.updateSkeleton(spreadsheetSkeleton);
-			spreadsheetLeftTopPlaceholder === null || spreadsheetLeftTopPlaceholder === void 0 || spreadsheetLeftTopPlaceholder.transformByState({
-				width: leftTopPlaceholderSize.width,
-				height: leftTopPlaceholderSize.height
-			});
-		}));
-	}
-	_initCommandListener() {
-		this.disposeWithMe(this._commandService.onCommandExecuted((command, options) => {
-			const { unit: workbook } = this._context;
-			const { id: commandId } = command;
-			if (COMMAND_LISTENER_SKELETON_CHANGE.includes(commandId) || this._sheetRenderService.checkMutationShouldTriggerRerender(commandId)) {
-				const { unitId, subUnitId } = command.params;
-				const worksheet = workbook.getActiveSheet();
-				if (!worksheet) return;
-				const workbookId = this._context.unitId;
-				const worksheetId = worksheet.getSheetId();
-				if (unitId !== workbookId || subUnitId !== worksheetId) return;
-				this._sheetSkeletonManagerService.makeDirty({
-					sheetId: worksheetId,
-					commandId
-				}, true);
-				this._sheetSkeletonManagerService.setCurrent({
-					sheetId: worksheetId,
-					commandId
-				});
-			} else if (COMMAND_LISTENER_VALUE_CHANGE.includes(commandId)) this._sheetSkeletonManagerService.reCalculate();
-			if (command.type === CommandType.MUTATION) this._markUnitDirty(command, options);
-		}));
-	}
-	_markUnitDirty(command, options) {
-		if (command.id.substring(0, 3) === "doc") return;
-		const { mainComponent: spreadsheet, scene } = this._context;
-		if (command.id === SetFormulaCalculationNotificationMutation.id) {
-			if (command.params.stageInfo != null) return;
-		}
-		if (spreadsheet) spreadsheet.makeDirty();
-		scene.makeDirty();
-		if (!command.params) return;
-		const cmdParams = command.params;
-		const viewports = this._spreadsheetViewports(scene);
-		if (command.id === SetRangeValuesMutation.id && cmdParams.cellValue && !(options === null || options === void 0 ? void 0 : options.fromChangeset)) {
-			const dirtyRange = this._cellValueToRange(cmdParams.cellValue);
-			const dirtyBounds = this._rangeToBounds([dirtyRange]);
-			this._markViewportDirty(viewports, dirtyBounds);
-			spreadsheet.setDirtyArea(dirtyBounds);
-		}
-		if (command.id === MoveRangeMutation.id && cmdParams.from && cmdParams.to && !(options === null || options === void 0 ? void 0 : options.fromChangeset)) {
-			const fromRange = cmdParams.fromRange || this._cellValueToRange(cmdParams.from.value);
-			const toRange = cmdParams.toRange || this._cellValueToRange(cmdParams.to.value);
-			const dirtyBounds = this._rangeToBounds([fromRange, toRange]);
-			this._markViewportDirty(viewports, dirtyBounds);
-			spreadsheet.setDirtyArea(dirtyBounds);
-		}
-	}
-	/**
-	* cellValue data structure:
-	* {[row]: { [col]: value}}
-	* @param cellValue
-	* @returns IRange
-	*/
-	_cellValueToRange(cellValue) {
-		const columns = [];
-		let minCol = 0;
-		let maxCol = 0;
-		let minRow = 0;
-		let maxRow = 0;
-		for (const [_row, columnObj] of Object.entries(cellValue)) {
-			for (const column in columnObj) {
-				columns.push(Number(column));
-				if (minCol > Number(column)) minCol = Number(column);
-				if (maxCol < Number(column)) maxCol = Number(column);
-			}
-			if (minRow > Number(_row)) minRow = Number(_row);
-			if (maxRow < Number(_row)) maxRow = Number(_row);
-		}
-		return {
-			startRow: minRow,
-			endRow: maxRow,
-			startColumn: minCol,
-			endColumn: maxCol
-		};
-	}
-	_rangeToBounds(ranges) {
-		const { rowHeightAccumulation, columnWidthAccumulation, rowHeaderWidth, columnHeaderHeight } = this._sheetSkeletonManagerService.getCurrentParam().skeleton;
-		const dirtyBounds = [];
-		for (const r of ranges) {
-			const { startRow, endRow, startColumn, endColumn } = r;
-			const top = startRow === 0 ? 0 : rowHeightAccumulation[startRow - 1] + columnHeaderHeight;
-			const bottom = rowHeightAccumulation[endRow] + columnHeaderHeight;
-			const left = startColumn === 0 ? 0 : columnWidthAccumulation[startColumn - 1] + rowHeaderWidth;
-			const right = columnWidthAccumulation[endColumn] + rowHeaderWidth;
-			dirtyBounds.push({
-				top,
-				left,
-				bottom,
-				right,
-				width: right - left,
-				height: bottom - top
-			});
-		}
-		return dirtyBounds;
-	}
-	_markViewportDirty(viewports, dirtyBounds) {
-		const activeViewports = viewports.filter((vp) => vp.isActive && vp.cacheBound);
-		for (const vp of activeViewports) for (const b of dirtyBounds) if (Rectangle.hasIntersectionBetweenTwoRect(vp.cacheBound, b)) vp.markDirty(true);
-	}
-	_spreadsheetViewports(scene) {
-		return scene.getViewports().filter((v) => [
-			"viewMain",
-			"viewMainLeftTop",
-			"viewMainTop",
-			"viewMainLeft"
-		].includes(v.viewportKey));
-	}
-};
-SheetRenderController = __decorate([
-	__decorateParam(1, Inject(IConfigService)),
-	__decorateParam(2, Inject(SheetSkeletonManagerService)),
-	__decorateParam(3, Inject(SheetsRenderService)),
-	__decorateParam(4, ICommandService),
-	__decorateParam(5, Optional(ITelemetryService))
-], SheetRenderController);
-function getLeftTopPlaceholderSize(skeleton) {
-	return {
-		width: skeleton.rowHeaderWidthAndMarginLeft ?? skeleton.rowHeaderWidth,
-		height: skeleton.columnHeaderHeightAndMarginTop ?? skeleton.columnHeaderHeight
-	};
-}
-
-//#endregion
-//#region src/controllers/render-controllers/skeleton.render-controller.ts
-let SheetSkeletonRenderController = class SheetSkeletonRenderController extends Disposable {
-	constructor(_context, _sheetSkeletonManagerService, _renderManagerService) {
-		super();
-		this._context = _context;
-		this._sheetSkeletonManagerService = _sheetSkeletonManagerService;
-		this._renderManagerService = _renderManagerService;
-		this.disposeWithMe(this._sheetSkeletonManagerService.currentSkeleton$.subscribe((param) => {
-			this._updateSceneSize(param);
-		}));
-	}
-	_updateSceneSize(param) {
-		var _this$_renderManagerS;
-		if (param == null) return;
-		const { unitId } = this._context;
-		const { skeleton } = param;
-		const scene = (_this$_renderManagerS = this._renderManagerService.getRenderUnitById(unitId)) === null || _this$_renderManagerS === void 0 ? void 0 : _this$_renderManagerS.scene;
-		if (skeleton == null || scene == null) return;
-		const { rowTotalHeight, columnTotalWidth, rowHeaderWidthAndMarginLeft, columnHeaderHeightAndMarginTop } = skeleton;
-		if (!this._context.unit.getActiveSheet()) return;
-		scene === null || scene === void 0 || scene.transformByState({
-			width: rowHeaderWidthAndMarginLeft + columnTotalWidth,
-			height: columnHeaderHeightAndMarginTop + rowTotalHeight
-		});
-		scene.getMainViewport().setMargin(rowHeaderWidthAndMarginLeft, columnHeaderHeightAndMarginTop);
-	}
-};
-SheetSkeletonRenderController = __decorate([__decorateParam(1, Inject(SheetSkeletonManagerService)), __decorateParam(2, IRenderManagerService)], SheetSkeletonRenderController);
-
-//#endregion
-//#region src/services/sheet-loading-render.service.ts
-const PREVIEW_UNIT_SUFFIX = "__snapshot_loading_preview__";
-const PREVIEW_SCENE_PREFIX = "_UNIVER_SCENE_";
-const PREVIEW_CANVAS_Z_INDEX = "9";
-const ISheetLoadingRenderService = createIdentifier("sheets-ui.sheet-loading-render.service");
-let SheetLoadingRenderService = class SheetLoadingRenderService extends Disposable {
-	constructor(_injector, _layoutService, _sheetInterceptorService, _renderManagerService) {
-		super();
-		this._injector = _injector;
-		this._layoutService = _layoutService;
-		this._sheetInterceptorService = _sheetInterceptorService;
-		this._renderManagerService = _renderManagerService;
-		_defineProperty(this, "workbook$", new BehaviorSubject(null));
-		_defineProperty(this, "loading$", new BehaviorSubject(false));
-		_defineProperty(this, "previewReady$", new BehaviorSubject(false));
-		_defineProperty(this, "_loadingRender", null);
-		_defineProperty(this, "_finalCanvasGuard", null);
-		_defineProperty(this, "_hiddenFinalCanvas", null);
-		_defineProperty(this, "_finalCanvasVisibility", "");
-	}
-	showSkeleton(workbookData, activeSheetId) {
-		var _this$_loadingRender;
-		const sourceUnitId = workbookData.id;
-		if (((_this$_loadingRender = this._loadingRender) === null || _this$_loadingRender === void 0 ? void 0 : _this$_loadingRender.sourceUnitId) !== sourceUnitId) {
-			this._disposeLoadingRender();
-			this.previewReady$.next(false);
-			this._loadingRender = {
-				sourceUnitId,
-				workbook: this._createLoadingWorkbook(workbookData, activeSheetId),
-				render: null
-			};
-			this.workbook$.next(this._loadingRender.workbook);
-			this.loading$.next(true);
-			this._guardFinalCanvas(sourceUnitId);
-		}
-		const worksheet = this._loadingRender.workbook.getSheetBySheetId(activeSheetId);
-		if (worksheet && this._loadingRender.workbook.getActiveSheet().getSheetId() !== activeSheetId) this._loadingRender.workbook.setActiveSheet(worksheet);
-	}
-	show(workbookData, activeSheetId, cellData) {
-		this.showSkeleton(workbookData, activeSheetId);
-		const loadingRender = this._loadingRender;
-		if (!loadingRender) return;
-		let shouldRender = false;
-		if (!loadingRender.render) {
-			const contentElement = this._layoutService.getContentElement();
-			if (!contentElement) return;
-			loadingRender.render = this._createLoadingRender(loadingRender.workbook, loadingRender.sourceUnitId, contentElement);
-			shouldRender = true;
-		}
-		const worksheet = loadingRender.workbook.getSheetBySheetId(activeSheetId);
-		if (!worksheet) return;
-		if (loadingRender.workbook.getActiveSheet().getSheetId() !== activeSheetId) {
-			loadingRender.workbook.setActiveSheet(worksheet);
-			loadingRender.render.with(SheetSkeletonManagerService).setCurrent({ sheetId: activeSheetId });
-			shouldRender = true;
-		}
-		if (cellData && cellData !== loadingRender.lastCellData) {
-			loadingRender.lastCellData = cellData;
-			const target = worksheet.getCellMatrix();
-			const getDisplayCell = this._sheetInterceptorService.fetchThroughInterceptors(INTERCEPTOR_POINT.CELL_CONTENT, InterceptorEffectEnum.Value | InterceptorEffectEnum.Style);
-			new ObjectMatrix(cellData).forValue((row, column, rawData) => {
-				const displayCell = getDisplayCell(rawData, {
-					unitId: loadingRender.sourceUnitId,
-					subUnitId: activeSheetId,
-					row,
-					col: column,
-					workbook: loadingRender.workbook,
-					worksheet,
-					rawData
-				});
-				target.setValue(row, column, displayCell);
-			});
-			const skeletonManager = loadingRender.render.with(SheetSkeletonManagerService);
-			skeletonManager.makeDirty({ sheetId: activeSheetId });
-			skeletonManager.reCalculate();
-			if (loadingRender.render.mainComponent instanceof Spreadsheet) loadingRender.render.mainComponent.makeForceDirty(true);
-			loadingRender.render.scene.makeDirty(true);
-			shouldRender = true;
-		}
-		if (shouldRender) loadingRender.render.scene.render();
-		if (!this.previewReady$.value) this.previewReady$.next(true);
-	}
-	async handoff(sourceUnitId, timeoutMs) {
-		var _this$_loadingRender2, _this$_finalCanvasGua;
-		if (((_this$_loadingRender2 = this._loadingRender) === null || _this$_loadingRender2 === void 0 ? void 0 : _this$_loadingRender2.sourceUnitId) !== sourceUnitId) return true;
-		if (!this._loadingRender.render) {
-			this.hide(sourceUnitId);
-			return true;
-		}
-		(_this$_finalCanvasGua = this._finalCanvasGuard) === null || _this$_finalCanvasGua === void 0 || _this$_finalCanvasGua.unsubscribe();
-		this._finalCanvasGuard = null;
-		try {
-			await firstValueFrom(this._getFinalRender$(sourceUnitId).pipe(take(1), switchMap((render) => this._waitForFinalCanvas(render).pipe(switchMap(() => {
-				this._hideFinalCanvas(render);
-				return this._requestFinalRender(render);
-			}))), timeout(timeoutMs)));
-			this.hide(sourceUnitId);
-			return true;
-		} catch {
-			return false;
-		}
-	}
-	hide(sourceUnitId) {
-		var _this$_loadingRender3;
-		if (((_this$_loadingRender3 = this._loadingRender) === null || _this$_loadingRender3 === void 0 ? void 0 : _this$_loadingRender3.sourceUnitId) !== sourceUnitId) return;
-		this._disposeLoadingRender();
-	}
-	dispose() {
-		this._disposeLoadingRender();
-		this.workbook$.complete();
-		this.loading$.complete();
-		this.previewReady$.complete();
-		super.dispose();
-	}
-	_createLoadingWorkbook(workbookData, activeSheetId) {
-		const previewUnitId = `${workbookData.id}${PREVIEW_UNIT_SUFFIX}`;
-		const workbook = this._injector.createInstance(Workbook, {
-			...workbookData,
-			id: previewUnitId
-		});
-		const activeSheet = workbook.getSheetBySheetId(activeSheetId);
-		if (activeSheet) workbook.setActiveSheet(activeSheet);
-		return workbook;
-	}
-	_createLoadingRender(workbook, sourceUnitId, contentElement) {
-		const previewUnitId = workbook.getUnitId();
-		const { width, height } = contentElement.getBoundingClientRect();
-		const engine = this._injector.createInstance(Engine, previewUnitId, void 0);
-		const scene = new Scene(`${PREVIEW_SCENE_PREFIX}${previewUnitId}`, engine, {
-			width,
-			height
-		});
-		scene.disableObjectsEvent();
-		const render = this._injector.createInstance(RenderUnit, {
-			unit: workbook,
-			engine,
-			scene,
-			isMainScene: true
-		});
-		try {
-			render.addRenderDependencies([
-				[SheetSkeletonManagerService],
-				[SheetSkeletonRenderController],
-				[SheetRenderController]
-			]);
-			const canvas = engine.getCanvas();
-			canvas.setId(`univer-sheet-loading-canvas_${sourceUnitId}`);
-			canvas.getCanvasEle().dataset.uUnitId = sourceUnitId;
-			canvas.getCanvasEle().style.pointerEvents = "none";
-			canvas.getCanvasEle().style.zIndex = PREVIEW_CANVAS_Z_INDEX;
-			engine.mount(contentElement);
-			return render;
-		} catch (error) {
-			this._disposeRender(render);
-			throw error;
-		}
-	}
-	_waitForFinalCanvas(render) {
-		return new Observable((subscriber) => {
-			let frameId;
-			const canvasElement = render.engine.getCanvasElement();
-			const checkMounted = () => {
-				const contentElement = this._layoutService.getContentElement();
-				if (contentElement && canvasElement.parentElement === contentElement && canvasElement.width > 0 && canvasElement.height > 0) {
-					subscriber.next();
-					subscriber.complete();
-					return;
-				}
-				frameId = window.requestAnimationFrame(checkMounted);
-			};
-			checkMounted();
-			return () => {
-				if (frameId !== void 0) window.cancelAnimationFrame(frameId);
-			};
-		});
-	}
-	_getFinalRender$(sourceUnitId) {
-		const existingRender = this._renderManagerService.getRenderUnitById(sourceUnitId);
-		return existingRender ? of(existingRender) : this._renderManagerService.created$.pipe(filter((render) => render.unitId === sourceUnitId));
-	}
-	_guardFinalCanvas(sourceUnitId) {
-		var _this$_finalCanvasGua2;
-		(_this$_finalCanvasGua2 = this._finalCanvasGuard) === null || _this$_finalCanvasGua2 === void 0 || _this$_finalCanvasGua2.unsubscribe();
-		this._finalCanvasGuard = this._getFinalRender$(sourceUnitId).pipe(take(1), switchMap((render) => this._waitForFinalCanvas(render).pipe(map(() => render)))).subscribe((render) => this._hideFinalCanvas(render));
-	}
-	_requestFinalRender(render) {
-		render.scene.makeDirty(true);
-		return from(render.scene.requestRender()).pipe(switchMap(() => this._waitForNextAnimationFrame()));
-	}
-	_hideFinalCanvas(render) {
-		const canvasElement = render.engine.getCanvasElement();
-		if (this._hiddenFinalCanvas === canvasElement) return;
-		this._restoreFinalCanvas();
-		this._hiddenFinalCanvas = canvasElement;
-		this._finalCanvasVisibility = canvasElement.style.visibility;
-		canvasElement.style.visibility = "hidden";
-	}
-	_restoreFinalCanvas() {
-		if (!this._hiddenFinalCanvas) return;
-		this._hiddenFinalCanvas.style.visibility = this._finalCanvasVisibility;
-		this._hiddenFinalCanvas = null;
-		this._finalCanvasVisibility = "";
-	}
-	_waitForNextAnimationFrame() {
-		return new Observable((subscriber) => {
-			const frameId = window.requestAnimationFrame(() => {
-				subscriber.next();
-				subscriber.complete();
-			});
-			return () => window.cancelAnimationFrame(frameId);
-		});
-	}
-	_disposeLoadingRender() {
-		var _this$_finalCanvasGua3;
-		(_this$_finalCanvasGua3 = this._finalCanvasGuard) === null || _this$_finalCanvasGua3 === void 0 || _this$_finalCanvasGua3.unsubscribe();
-		this._finalCanvasGuard = null;
-		this._restoreFinalCanvas();
-		const loadingRender = this._loadingRender;
-		this._loadingRender = null;
-		this.workbook$.next(null);
-		this.loading$.next(false);
-		this.previewReady$.next(false);
-		if (!loadingRender) return;
-		if (loadingRender.render) this._disposeRender(loadingRender.render);
-		loadingRender.workbook.dispose();
-	}
-	_disposeRender(render) {
-		render.components.forEach((component) => component.dispose());
-		render.scene.dispose();
-		render.dispose();
-		render.engine.dispose();
-	}
-};
-SheetLoadingRenderService = __decorate([
-	__decorateParam(0, Inject(Injector)),
-	__decorateParam(1, ILayoutService),
-	__decorateParam(2, Inject(SheetInterceptorService)),
-	__decorateParam(3, IRenderManagerService)
-], SheetLoadingRenderService);
-
-//#endregion
-//#region src/views/hook.ts
-const SheetLoadingWorkbookContext = createContext(null);
-function useActiveWorkbook() {
-	const univerInstanceService = useDependency(IUniverInstanceService);
-	const loadingWorkbook = useContext(SheetLoadingWorkbookContext);
-	const workbook = useObservable(() => univerInstanceService.getCurrentTypeOfUnit$(UniverInstanceType.UNIVER_SHEET), void 0, void 0, []);
-	return loadingWorkbook ?? workbook ?? null;
-}
-function useSheetLoadingWorkbook() {
-	return useObservable(useDependency(ISheetLoadingRenderService).workbook$) ?? null;
-}
-function useSheetLoading() {
-	return useObservable(useDependency(ISheetLoadingRenderService).loading$) ?? false;
-}
-function useSheetLoadingPreviewReady() {
-	return useObservable(useDependency(ISheetLoadingRenderService).previewReady$) ?? false;
-}
-function useActiveWorksheet(workbook) {
-	return useObservable(() => (workbook === null || workbook === void 0 ? void 0 : workbook.activeSheet$) ?? of(null), void 0, void 0, [workbook]);
-}
-function useWorkbooks() {
-	const univerInstanceService = useDependency(IUniverInstanceService);
-	return useObservable(() => {
-		return merge$1([univerInstanceService.getTypeOfUnitAdded$(UniverInstanceType.UNIVER_SHEET), univerInstanceService.getTypeOfUnitDisposed$(UniverInstanceType.UNIVER_SHEET)]).pipe(map(() => univerInstanceService.getAllUnitsForType(UniverInstanceType.UNIVER_SHEET)), startWith(univerInstanceService.getAllUnitsForType(UniverInstanceType.UNIVER_SHEET)));
-	}, [], void 0, [univerInstanceService]);
-}
-
-//#endregion
-//#region src/views/clipboard/ClipboardPopupMenu.tsx
-const DEFAULT_PADDING = 2;
-const SheetPasteOptions = [
-	{
-		value: "DEFAULT_PASTE",
-		label: "sheets-ui.rightClick.paste"
-	},
-	{
-		value: "SPECIAL_PASTE_VALUE",
-		label: "sheets-ui.rightClick.pasteValue"
-	},
-	{
-		value: "SPECIAL_PASTE_FORMAT",
-		label: "sheets-ui.rightClick.pasteFormat"
-	},
-	{
-		value: "SPECIAL_PASTE_COL_WIDTH",
-		label: "sheets-ui.rightClick.pasteColWidth"
-	},
-	{
-		value: "SPECIAL_PASTE_BESIDES_BORDER",
-		label: "sheets-ui.rightClick.pasteBesidesBorder"
-	},
-	{
-		value: "SPECIAL_PASTE_FORMULA",
-		label: "sheets-ui.rightClick.pasteFormula"
-	}
-];
-const useMenuPosition = (range) => {
-	var _scene$getEngine;
-	const univerInstanceService = useDependency(IUniverInstanceService);
-	const renderManagerService = useDependency(IRenderManagerService);
-	const workbook = useActiveWorkbook();
-	if (!range || !workbook) return null;
-	const anchor = {
-		startRow: range.rows[0],
-		startCol: range.cols[0],
-		endRow: range.rows[range.rows.length - 1],
-		endCol: range.cols[range.cols.length - 1]
-	};
-	if (anchor.endRow < 0 || anchor.endCol < 0) return null;
-	const ru = renderManagerService.getRenderUnitById(workbook.getUnitId());
-	const sheetSkeletonManagerService = ru === null || ru === void 0 ? void 0 : ru.with(SheetSkeletonManagerService);
-	const sheetObject = getSheetObject(univerInstanceService, renderManagerService);
-	if (!sheetObject) return null;
-	const { scene } = sheetObject;
-	const skeleton = sheetSkeletonManagerService === null || sheetSkeletonManagerService === void 0 ? void 0 : sheetSkeletonManagerService.getCurrentSkeleton();
-	const viewport = getViewportByCell(anchor.endRow, anchor.endCol, scene, workbook.getActiveSheet());
-	if (!viewport) return null;
-	const scaleX = scene === null || scene === void 0 ? void 0 : scene.scaleX;
-	const scaleY = scene === null || scene === void 0 ? void 0 : scene.scaleY;
-	const scrollXY = scene === null || scene === void 0 ? void 0 : scene.getViewportScrollXY(viewport);
-	const canvas = (_scene$getEngine = scene.getEngine()) === null || _scene$getEngine === void 0 ? void 0 : _scene$getEngine.getCanvas();
-	if (!scaleX || !scene || !scaleX || !scaleY || !scrollXY) return null;
-	const endPosition = skeleton === null || skeleton === void 0 ? void 0 : skeleton.getNoMergeCellWithCoordByIndex(anchor.endRow, anchor.endCol);
-	const endX = (endPosition === null || endPosition === void 0 ? void 0 : endPosition.endX) ?? 0;
-	const endY = (endPosition === null || endPosition === void 0 ? void 0 : endPosition.endY) ?? 0;
-	const positionEndX = convertTransformToOffsetX(endX, scaleX, scrollXY) ?? -9999;
-	const positionEndY = convertTransformToOffsetY(endY, scaleY, scrollXY) ?? -9999;
-	const canvasWidth = canvas === null || canvas === void 0 ? void 0 : canvas.getWidth();
-	const canvasHeight = canvas === null || canvas === void 0 ? void 0 : canvas.getHeight();
-	if (!canvasWidth || !canvasHeight) return null;
-	const XInSideView = positionEndX + 50 <= canvasWidth;
-	const YInSideView = positionEndY + 50 <= canvasHeight;
-	let positionX = positionEndX;
-	let positionY = positionEndY;
-	if (!XInSideView) positionX = canvasWidth - 100;
-	if (!YInSideView) positionY = canvasHeight - 100;
-	return {
-		positionX,
-		positionY
-	};
-};
-const ClipboardPopupMenu = () => {
-	const clipboardService = useDependency(ISheetClipboardService);
-	const showMenu = useObservable(clipboardService.showMenu$, false);
-	const pasteOptionsCache = useObservable(clipboardService.pasteOptionsCache$, null);
-	const localeService = useDependency(LocaleService);
-	const commandService = useDependency(ICommandService);
-	const [menuHovered, setMenuHovered] = useState(false);
-	const [visible, setVisible] = useState(false);
-	const range = pasteOptionsCache === null || pasteOptionsCache === void 0 ? void 0 : pasteOptionsCache.target.pastedRange;
-	const relativePosition = useMenuPosition(range);
-	if (!relativePosition || !showMenu) return null;
-	if (relativePosition.positionX < 50 || relativePosition.positionY < 30) return null;
-	const showMore = menuHovered || visible;
-	const handleClick = (type) => {
-		setVisible(false);
-		commandService.executeCommand(SheetOptionalPasteCommand.id, { type });
-	};
-	return /* @__PURE__ */ jsx("div", {
-		className: "univer-absolute univer-inset-0 univer-z-10 univer-size-0",
-		children: /* @__PURE__ */ jsx("div", {
-			className: "univer-absolute",
-			style: {
-				left: relativePosition.positionX + DEFAULT_PADDING,
-				top: relativePosition.positionY + DEFAULT_PADDING
-			},
-			onMouseEnter: () => setMenuHovered(true),
-			onMouseLeave: () => setMenuHovered(false),
-			children: /* @__PURE__ */ jsx(DropdownMenu, {
-				align: "start",
-				items: SheetPasteOptions.map((item) => ({
-					type: "checkbox",
-					value: item.value,
-					label: localeService.t(item.label),
-					checked: (pasteOptionsCache === null || pasteOptionsCache === void 0 ? void 0 : pasteOptionsCache.pasteType) === PREDEFINED_HOOK_NAME_PASTE[item.value],
-					onSelect: () => handleClick(item.value)
-				})),
-				open: visible,
-				onOpenChange: setVisible,
-				children: /* @__PURE__ */ jsxs("div", {
-					className: clsx("univer-flex univer-items-center univer-gap-2 univer-rounded univer-p-1 hover:univer-bg-gray-100 dark:hover:!univer-bg-gray-800", borderClassName, {
-						"univer-bg-gray-100 dark:!univer-bg-gray-800": visible,
-						"univer-bg-white dark:!univer-bg-gray-900": !visible
-					}),
-					children: [/* @__PURE__ */ jsx(PasteSpecialDoubleIcon, { className: "univer-fill-primary-600 univer-text-gray-900 dark:!univer-text-white" }), showMore && /* @__PURE__ */ jsx(MoreDownIcon, { className: "dark:!univer-text-white" })]
-				})
-			})
-		})
-	});
-};
-
-//#endregion
-//#region src/controllers/clipboard/const.ts
-/**
-* Copyright 2023-present DreamNum Co., Ltd.
-*
-* Licensed under the Apache License, Version 2.0 (the "License");
-* you may not use this file except in compliance with the License.
-* You may obtain a copy of the License at
-*
-*     http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-*/
-const RemovePasteMenuCommands = [
-	SetCellEditVisibleOperation.id,
-	SetRangeValuesCommand.id,
-	SetZoomRatioOperation.id,
-	MoveRangeMutation.id,
-	RemoveRowMutation.id,
-	RemoveColMutation.id,
-	InsertRowMutation.id,
-	InsertColMutation.id,
-	MoveRowsMutation.id,
-	MoveColsMutation.id,
-	SetWorksheetColWidthMutation.id,
-	SetWorksheetRowHeightMutation.id,
-	SetSelectionsOperation.id,
-	UndoCommandId
-];
-
-//#endregion
-//#region src/services/editor/cell-editor-manager.service.ts
-var CellEditorManagerService = class {
-	constructor() {
-		_defineProperty(this, "_state", null);
-		_defineProperty(this, "_rect", null);
-		_defineProperty(this, "_state$", new BehaviorSubject(null));
-		_defineProperty(this, "state$", this._state$.asObservable());
-		_defineProperty(this, "_rect$", new BehaviorSubject(null));
-		_defineProperty(this, "rect$", this._rect$.asObservable());
-		_defineProperty(this, "_focus", false);
-		_defineProperty(this, "_focus$", new BehaviorSubject(this._focus));
-		_defineProperty(this, "focus$", this._focus$.asObservable());
-	}
-	dispose() {
-		this._state$.complete();
-		this._state = null;
-		this._rect$.complete();
-		this._rect = null;
-	}
-	setState(param) {
-		this._state = param;
-		this._refresh(param);
-	}
-	getRect() {
-		return this._rect;
-	}
-	setRect(param) {
-		this._rect = param;
-		this._rect$.next(param);
-	}
-	getState() {
-		return this._state;
-	}
-	setFocus(param = false) {
-		this._focus = param;
-		this._focus$.next(param);
-	}
-	_refresh(param) {
-		this._state$.next(param);
-	}
-};
-const ICellEditorManagerService = createIdentifier("univer.sheet-cell-editor-manager.service");
-
-//#endregion
-//#region src/services/sheet-embed-integration.service.ts
-const SHEET_EMBED_INTERACTION_BOUNDARY_OWNER_ATTRIBUTE = "data-embed-interaction-boundary-owner";
-const SHEET_EMBED_RUNTIME_FOCUS_ROLE_ATTRIBUTE = "data-embed-runtime-focus-role";
-const SHEET_EMBED_FLOAT_DOM_ATTRIBUTE = "data-embed-float-dom";
-const SHEET_EMBED_ID_ATTRIBUTE = "data-embed-id";
-const SHEET_EMBED_HOST_UNIT_ID_ATTRIBUTE = "data-embed-host-unit-id";
-const SHEET_EMBED_CHILD_UNIT_ID_ATTRIBUTE = "data-embed-child-unit-id";
-const SHEET_EMBED_CHILD_TYPE_ATTRIBUTE = "data-embed-child-type";
-const ISheetEmbedInteractionBoundaryService = createIdentifier("sheets-ui.embed-interaction-boundary.service");
-const ISheetEmbedRuntimeFocusCoordinator = createIdentifier("sheets-ui.embed-runtime-focus-coordinator");
-const ISheetEmbedFloatingGeometryService = createIdentifier("sheets-ui.embed-floating-geometry.service");
-function resolveSheetEmbedRuntimeDomScope(element) {
-	var _element$closest;
-	if (!element) return;
-	const embedId = ((_element$closest = element.closest(`[${"data-embed-interaction-boundary-owner"}]`)) === null || _element$closest === void 0 ? void 0 : _element$closest.getAttribute("data-embed-interaction-boundary-owner")) ?? void 0;
-	const container = resolveSheetEmbedFloatDomContainer(element, embedId);
-	const resolvedEmbedId = (container === null || container === void 0 ? void 0 : container.getAttribute("data-embed-id")) ?? embedId;
-	if (!resolvedEmbedId) return;
-	return {
-		embedId: resolvedEmbedId,
-		hostUnitId: (container === null || container === void 0 ? void 0 : container.getAttribute("data-embed-host-unit-id")) ?? void 0,
-		childUnitId: (container === null || container === void 0 ? void 0 : container.getAttribute("data-embed-child-unit-id")) ?? void 0,
-		childType: readChildType(container)
-	};
-}
-function resolveActiveSheetEmbedRuntimeDomScope(ownerDocument = document) {
-	const activeContainer = ownerDocument.querySelector(`[${SHEET_EMBED_FLOAT_DOM_ATTRIBUTE}="true"][data-embed-float-stage="stage2"]`);
-	if (!activeContainer) return;
-	return resolveSheetEmbedRuntimeDomScope(activeContainer);
-}
-function resolveSheetEmbedFloatDomContainer(element, embedId) {
-	const ownContainer = element === null || element === void 0 ? void 0 : element.closest(`[${SHEET_EMBED_FLOAT_DOM_ATTRIBUTE}="true"]`);
-	if (ownContainer && (!embedId || ownContainer.getAttribute("data-embed-id") === embedId)) return ownContainer;
-	const ownerDocument = (element === null || element === void 0 ? void 0 : element.ownerDocument) ?? (typeof document === "undefined" ? void 0 : document);
-	if (!ownerDocument || !embedId) return ownContainer ?? void 0;
-	return ownerDocument.querySelector(`[${"data-embed-float-dom"}="true"][${"data-embed-id"}="${escapeAttributeValue(embedId)}"]`) ?? void 0;
-}
-function escapeAttributeValue(value) {
-	return value.replace(/\\/g, "\\\\").replace(/"/g, "\\\"");
-}
-function readChildType(container) {
-	const value = container === null || container === void 0 ? void 0 : container.getAttribute(SHEET_EMBED_CHILD_TYPE_ATTRIBUTE);
-	if (value == null || value === "") return;
-	return Number(value);
-}
-
-//#endregion
-//#region src/services/editor/cell-editor-resize.service.ts
-const EDITOR_INPUT_SELF_EXTEND_GAP = 5;
-const EDITOR_BORDER_SIZE = 2;
-let SheetCellEditorResizeService = class SheetCellEditorResizeService extends Disposable {
-	constructor(_layoutService, _cellEditorManagerService, _editorBridgeService, _renderManagerService, _univerInstanceService, _configService, _embedFloatingGeometryService) {
-		super();
-		this._layoutService = _layoutService;
-		this._cellEditorManagerService = _cellEditorManagerService;
-		this._editorBridgeService = _editorBridgeService;
-		this._renderManagerService = _renderManagerService;
-		this._univerInstanceService = _univerInstanceService;
-		this._configService = _configService;
-		this._embedFloatingGeometryService = _embedFloatingGeometryService;
-	}
-	get _currentRenderer() {
-		return getCurrentTypeOfRenderer(UniverInstanceType.UNIVER_SHEET, this._univerInstanceService, this._renderManagerService);
-	}
-	get _editingUnitId() {
-		var _this$_editorBridgeSe;
-		return ((_this$_editorBridgeSe = this._editorBridgeService.getEditCellState()) === null || _this$_editorBridgeSe === void 0 ? void 0 : _this$_editorBridgeSe.unitId) ?? "";
-	}
-	get _editingRenderer() {
-		return this._renderManagerService.getRenderUnitById(this._editingUnitId);
-	}
-	get _renderer() {
-		return this._editingRenderer ?? this._currentRenderer;
-	}
-	get _sheetSkeletonManagerService() {
-		var _this$_renderer;
-		return (_this$_renderer = this._renderer) === null || _this$_renderer === void 0 ? void 0 : _this$_renderer.with(SheetSkeletonManagerService);
-	}
-	get engine() {
-		var _this$_renderer2;
-		return (_this$_renderer2 = this._renderer) === null || _this$_renderer2 === void 0 ? void 0 : _this$_renderer2.engine;
-	}
-	fitTextSize(callback) {
-		const param = this._editorBridgeService.getEditCellState();
-		if (!param) return;
-		const { position, documentLayoutObject, canvasOffset, scaleX, scaleY } = param;
-		const { startX, startY, endX, endY } = position;
-		const documentDataModel = this._univerInstanceService.getUnit(DOCS_NORMAL_EDITOR_UNIT_ID_KEY, UniverInstanceType.UNIVER_DOC);
-		if (documentDataModel == null) return;
-		const documentSkeleton = this._getEditorSkeleton();
-		if (!documentSkeleton) return;
-		documentSkeleton.resetInitialWidth();
-		const info = this._predictingSize(position, canvasOffset, documentSkeleton, documentLayoutObject, scaleX, scaleY);
-		if (!info || info.actualWidth <= 0) return;
-		let { actualWidth, actualHeight } = info;
-		const { verticalAlign, horizontalAlign, paddingData, fill } = documentLayoutObject;
-		actualWidth = actualWidth + (paddingData.l ?? 0) * scaleX + (paddingData.r ?? 0) * scaleX;
-		actualHeight = actualHeight + (paddingData.t ?? 0) * scaleY + (paddingData.b ?? 0) * scaleY;
-		let editorWidth = endX - startX;
-		let editorHeight = endY - startY;
-		if (editorWidth < actualWidth) editorWidth = Math.ceil(actualWidth);
-		if (editorHeight < actualHeight) editorHeight = Math.ceil(actualHeight);
-		let offsetTop = 0;
-		if (verticalAlign === VerticalAlign.MIDDLE) offsetTop = (editorHeight - actualHeight) / 2 / scaleY;
-		else if (verticalAlign === VerticalAlign.TOP) offsetTop = paddingData.t || 0;
-		else offsetTop = (editorHeight - actualHeight) / scaleY;
-		let offsetLeft = 0;
-		if (horizontalAlign === HorizontalAlign.CENTER) {} else if (horizontalAlign === HorizontalAlign.RIGHT) offsetLeft = (editorWidth - actualWidth) / scaleX;
-		else offsetLeft = paddingData.l || 0;
-		offsetTop = Math.max(offsetTop, paddingData.t || 0);
-		offsetLeft = Math.max(offsetLeft, paddingData.l || 0);
-		documentDataModel.updateDocumentDataMargin({
-			t: offsetTop,
-			l: offsetLeft
-		});
-		documentSkeleton.calculate();
-		this._editAreaProcessing(editorWidth, editorHeight, position, canvasOffset, fill, scaleX, scaleY, horizontalAlign, callback);
-	}
-	/**
-	* Mainly used to pre-calculate the width of the editor,
-	* to determine whether it needs to be automatically widened.
-	*/
-	_predictingSize(actualRangeWithCoord, canvasOffset, documentSkeleton, documentLayoutObject, scaleX = 1, scaleY = 1) {
-		const { startX, endX } = actualRangeWithCoord;
-		const { textRotation, wrapStrategy, paddingData } = documentLayoutObject;
-		const documentDataModel = this._univerInstanceService.getUnit(DOCS_NORMAL_EDITOR_UNIT_ID_KEY, UniverInstanceType.UNIVER_DOC);
-		const { vertexAngle: angle } = convertTextRotation(textRotation);
-		if (wrapStrategy === WrapStrategy.WRAP && angle === 0) {
-			documentDataModel === null || documentDataModel === void 0 || documentDataModel.updateDocumentDataPageSize((endX - startX) / scaleX);
-			documentDataModel === null || documentDataModel === void 0 || documentDataModel.updateDocumentDataMargin({
-				l: paddingData.l,
-				t: paddingData.t
-			});
-			documentSkeleton.calculate();
-			const { actualWidth, actualHeight } = documentSkeleton.getActualSize();
-			return {
-				actualWidth: actualWidth * scaleX,
-				actualHeight: actualHeight * scaleY
-			};
-		}
-		const maxSize = this._getEditorMaxSize(actualRangeWithCoord, canvasOffset, documentLayoutObject.horizontalAlign);
-		if (!maxSize) return;
-		documentDataModel === null || documentDataModel === void 0 || documentDataModel.updateDocumentDataPageSize(maxSize.width / scaleX);
-		documentSkeleton.calculate();
-		const size = documentSkeleton.getActualSize();
-		let editorWidth = endX - startX;
-		if (editorWidth < size.actualWidth * scaleX + EDITOR_INPUT_SELF_EXTEND_GAP * scaleX) editorWidth = size.actualWidth * scaleX + EDITOR_INPUT_SELF_EXTEND_GAP * scaleX;
-		documentDataModel === null || documentDataModel === void 0 || documentDataModel.updateDocumentDataPageSize(editorWidth / scaleX);
-		/**
-		* Do not rely on cell layout logic, depend on the document's internal alignment logic.
-		*/
-		documentDataModel === null || documentDataModel === void 0 || documentDataModel.updateDocumentRenderConfig({
-			horizontalAlign: HorizontalAlign.UNSPECIFIED,
-			cellValueType: void 0
-		});
-		return {
-			actualWidth: size.actualWidth * scaleX,
-			actualHeight: size.actualHeight * scaleY
+		return {
+			actualWidth: size.actualWidth * scaleX,
+			actualHeight: size.actualHeight * scaleY
 		};
 	}
 	_getEditorMaxSize(position, canvasOffset, horizontalAlign) {
@@ -10568,7 +9987,9 @@ let EditorBridgeRenderController = class EditorBridgeRenderController extends Rx
 		if (!sheetObject) return;
 		const { spreadsheet, spreadsheetColumnHeader, spreadsheetLeftTopPlaceholder, spreadsheetRowHeader } = sheetObject;
 		d.add(spreadsheet.onDblclick$.subscribeEvent((evt) => {
+			var _this$_editorBridgeSe;
 			if (evt.button === 2) return;
+			if (isCellImage((_this$_editorBridgeSe = this._editorBridgeService.getEditCellState()) === null || _this$_editorBridgeSe === void 0 || (_this$_editorBridgeSe = _this$_editorBridgeSe.documentLayoutObject.documentModel) === null || _this$_editorBridgeSe === void 0 ? void 0 : _this$_editorBridgeSe.getSnapshot())) return;
 			this._commandService.executeCommand(SetCellEditVisibleOperation.id, {
 				visible: true,
 				eventType: DeviceInputEventType.Dblclick,
@@ -10664,9 +10085,9 @@ let EditorBridgeRenderController = class EditorBridgeRenderController extends Rx
 		this._hideEditor();
 	}
 	_isEmbeddedFormulaEditorActive() {
-		var _this$_embedRuntimeFo2, _this$_editorBridgeSe;
+		var _this$_embedRuntimeFo2, _this$_editorBridgeSe2;
 		if (((_this$_embedRuntimeFo2 = this._embedRuntimeFocusCoordinator) === null || _this$_embedRuntimeFo2 === void 0 ? void 0 : _this$_embedRuntimeFo2.isChildUnitInActiveSession(this._context.unitId)) !== true) return false;
-		const dataStream = (_this$_editorBridgeSe = this._editorBridgeService.getEditCellState()) === null || _this$_editorBridgeSe === void 0 || (_this$_editorBridgeSe = _this$_editorBridgeSe.documentLayoutObject.documentModel) === null || _this$_editorBridgeSe === void 0 || (_this$_editorBridgeSe = _this$_editorBridgeSe.getSnapshot().body) === null || _this$_editorBridgeSe === void 0 ? void 0 : _this$_editorBridgeSe.dataStream;
+		const dataStream = (_this$_editorBridgeSe2 = this._editorBridgeService.getEditCellState()) === null || _this$_editorBridgeSe2 === void 0 || (_this$_editorBridgeSe2 = _this$_editorBridgeSe2.documentLayoutObject.documentModel) === null || _this$_editorBridgeSe2 === void 0 || (_this$_editorBridgeSe2 = _this$_editorBridgeSe2.getSnapshot().body) === null || _this$_editorBridgeSe2 === void 0 ? void 0 : _this$_editorBridgeSe2.dataStream;
 		return typeof dataStream === "string" && dataStream.startsWith("=");
 	}
 	_isCurrentEmbedRuntimeEvent(evt) {
@@ -14002,7 +13423,7 @@ let SheetPermissionCheckUIController = class SheetPermissionCheckUIController ex
 					workbookTypes: [WorkbookEditablePermission],
 					worksheetTypes: [WorksheetSetCellValuePermission, WorksheetEditPermission],
 					rangeTypes: [RangeProtectionPermissionEditPoint]
-				});
+				}, params.unitId);
 				errorMsg = this._localeService.t("sheets-ui.permission.dialog.editErr");
 				break;
 			case ApplyFormatPainterCommand.id:
@@ -15753,9 +15174,9 @@ var HeaderUnhideRangeService = class {
 
 //#endregion
 //#region src/menu/header-menu-shape.ts
-const HEADER_MENU_SHAPE_CIRCLE_FILL = "rgba(0, 0, 0, 0.15)";
-const HEADER_MENU_SHAPE_TRIANGLE_FILL = "rgb(0, 0, 0)";
-const HEADER_MENU_BACKGROUND_COLOR = "rgb(255, 255, 255, 1)";
+const HEADER_MENU_SHAPE_CIRCLE_FILL = "gray.200";
+const HEADER_MENU_SHAPE_TRIANGLE_FILL = "gray.900";
+const HEADER_MENU_BACKGROUND_COLOR = "gray.50";
 var HeaderMenuShape = class extends Shape {
 	constructor(key, props) {
 		super(key, props);
@@ -15928,157 +15349,549 @@ var HeaderUnhideShape = class extends Shape {
 			]],
 			fill: HEADER_MENU_SHAPE_TRIANGLE_FILL
 		});
-		if (this._hasNext) {
-			const offset = this._hasPrevious ? 3 : 1;
-			RegularPolygon.drawWith(ctx, {
-				pointsGroup: [[
-					{
-						x: top + this._size * offset / 2,
-						y: this._size / 2
-					},
-					{
-						x: -left + this._size * offset / 2,
-						y: this._size / 2 - left
-					},
-					{
-						x: -left + this._size * offset / 2,
-						y: this._size / 2 + left
-					}
-				]],
-				fill: HEADER_MENU_SHAPE_TRIANGLE_FILL
-			});
-		}
+		if (this._hasNext) {
+			const offset = this._hasPrevious ? 3 : 1;
+			RegularPolygon.drawWith(ctx, {
+				pointsGroup: [[
+					{
+						x: top + this._size * offset / 2,
+						y: this._size / 2
+					},
+					{
+						x: -left + this._size * offset / 2,
+						y: this._size / 2 - left
+					},
+					{
+						x: -left + this._size * offset / 2,
+						y: this._size / 2 + left
+					}
+				]],
+				fill: HEADER_MENU_SHAPE_TRIANGLE_FILL
+			});
+		}
+	}
+};
+
+//#endregion
+//#region src/controllers/render-controllers/header-unhide.render-controller.ts
+const HEADER_UNHIDE_CONTROLLER_SHAPE = "__SpreadsheetHeaderUnhideSHAPEControllerShape__";
+const HEADER_UNHIDE_RANGE_VISIBLE_CHECK = createInterceptorKey("headerUnhideRangeVisibleCheck");
+let HeaderUnhideRenderController = class HeaderUnhideRenderController extends RxDisposable {
+	get _workbook() {
+		return this._context.unit;
+	}
+	constructor(_context, _sheetSkeletonManagerService, _headerUnhideRangeService, _commandService) {
+		super();
+		this._context = _context;
+		this._sheetSkeletonManagerService = _sheetSkeletonManagerService;
+		this._headerUnhideRangeService = _headerUnhideRangeService;
+		this._commandService = _commandService;
+		_defineProperty(this, "_shapes", {
+			cols: [],
+			rows: []
+		});
+		_defineProperty(this, "interceptor", new InterceptorManager({ HEADER_UNHIDE_RANGE_VISIBLE_CHECK }));
+		this._init();
+	}
+	dispose() {
+		super.dispose();
+		this._clearShapes();
+	}
+	_init() {
+		let activeSheetId = "";
+		this._context.unit.activeSheet$.pipe(takeUntil(this.dispose$)).subscribe((worksheet) => {
+			this._clearShapes();
+			if (!worksheet) {
+				activeSheetId = "";
+				return;
+			}
+			activeSheetId = worksheet.getSheetId();
+			this._update(this._workbook, worksheet);
+		});
+		this.disposeWithMe(this._sheetSkeletonManagerService.currentSkeleton$.subscribe((param) => {
+			if (param) {
+				const { unitId, sheetId } = param;
+				if (unitId === this._workbook.getUnitId() && sheetId === activeSheetId) {
+					const worksheet = this._workbook.getSheetBySheetId(sheetId);
+					if (worksheet) this._update(this._workbook, worksheet);
+				}
+			}
+		}));
+	}
+	_update(workbook, worksheet) {
+		var _this$_sheetSkeletonM;
+		const skeleton = (_this$_sheetSkeletonM = this._sheetSkeletonManagerService.getSkeletonParam(worksheet.getSheetId())) === null || _this$_sheetSkeletonM === void 0 ? void 0 : _this$_sheetSkeletonM.skeleton;
+		if (!skeleton) return;
+		const visibleCheck = this.interceptor.fetchThroughInterceptors(HEADER_UNHIDE_RANGE_VISIBLE_CHECK);
+		const shouldRenderRange = (payload) => this._headerUnhideRangeService.shouldRenderRange(visibleCheck(true, payload) ?? true, payload);
+		const hiddenRowRanges = worksheet.getHiddenRows().filter((range) => shouldRenderRange({
+			axis: "row",
+			range,
+			workbook,
+			worksheet
+		}));
+		const hiddenColRanges = worksheet.getHiddenCols().filter((range) => shouldRenderRange({
+			axis: "column",
+			range,
+			workbook,
+			worksheet
+		}));
+		const { scene } = this._getSheetObject();
+		const rowCount = worksheet.getRowCount();
+		const rowShapes = hiddenRowRanges.map((range) => {
+			const { startRow, endRow } = range;
+			const position = getCoordByCell(startRow, 0, scene, skeleton);
+			const hasPrevious = startRow !== 0;
+			const hasNext = endRow !== rowCount - 1;
+			return new HeaderUnhideShape(HEADER_UNHIDE_CONTROLLER_SHAPE, {
+				type: 0,
+				hovered: false,
+				hasPrevious,
+				hasNext,
+				top: position.startY - (hasPrevious ? 12 : 0),
+				left: position.startX - 12
+			}, () => this._commandService.executeCommand(SetSpecificRowsVisibleCommand.id, {
+				unitId: workbook.getUnitId(),
+				subUnitId: worksheet.getSheetId(),
+				ranges: [range]
+			}));
+		});
+		const colCount = worksheet.getColumnCount();
+		const colShapes = hiddenColRanges.map((range) => {
+			const { startColumn, endColumn } = range;
+			const position = getCoordByCell(0, startColumn, scene, skeleton);
+			const hasPrevious = startColumn !== 0;
+			const hasNext = endColumn !== colCount - 1;
+			return new HeaderUnhideShape(HEADER_UNHIDE_CONTROLLER_SHAPE, {
+				type: 1,
+				hovered: false,
+				hasPrevious,
+				hasNext,
+				top: Math.max(skeleton.columnHeaderHeight, skeleton.columnHeaderHeightAndMarginTop) - 12,
+				left: position.startX - (hasPrevious ? 12 : 0)
+			}, () => this._commandService.executeCommand(SetSpecificColsVisibleCommand.id, {
+				unitId: workbook.getUnitId(),
+				subUnitId: worksheet.getSheetId(),
+				ranges: [range]
+			}));
+		});
+		scene.addObjects(colShapes, 12);
+		scene.addObjects(rowShapes, 12);
+		this._clearShapes();
+		this._shapes = {
+			cols: colShapes,
+			rows: rowShapes
+		};
+	}
+	_clearShapes() {
+		this._shapes.cols.forEach((shape) => shape.dispose());
+		this._shapes.rows.forEach((shape) => shape.dispose());
+		this._shapes = {
+			cols: [],
+			rows: []
+		};
+	}
+	_getSheetObject() {
+		return getSheetObject(this._workbook, this._context);
 	}
 };
+HeaderUnhideRenderController = __decorate([
+	__decorateParam(1, Inject(SheetSkeletonManagerService)),
+	__decorateParam(2, Inject(HeaderUnhideRangeService)),
+	__decorateParam(3, ICommandService)
+], HeaderUnhideRenderController);
 
 //#endregion
-//#region src/controllers/render-controllers/header-unhide.render-controller.ts
-const HEADER_UNHIDE_CONTROLLER_SHAPE = "__SpreadsheetHeaderUnhideSHAPEControllerShape__";
-const HEADER_UNHIDE_RANGE_VISIBLE_CHECK = createInterceptorKey("headerUnhideRangeVisibleCheck");
-let HeaderUnhideRenderController = class HeaderUnhideRenderController extends RxDisposable {
-	get _workbook() {
-		return this._context.unit;
-	}
-	constructor(_context, _sheetSkeletonManagerService, _headerUnhideRangeService, _commandService) {
+//#region src/controllers/render-controllers/sheet.render-controller.ts
+const FRAME_STACK_THRESHOLD = 60;
+let SheetRenderController = class SheetRenderController extends RxDisposable {
+	constructor(_context, _configService, _sheetSkeletonManagerService, _sheetRenderService, _commandService, _telemetryService) {
 		super();
 		this._context = _context;
+		this._configService = _configService;
 		this._sheetSkeletonManagerService = _sheetSkeletonManagerService;
-		this._headerUnhideRangeService = _headerUnhideRangeService;
+		this._sheetRenderService = _sheetRenderService;
 		this._commandService = _commandService;
-		_defineProperty(this, "_shapes", {
-			cols: [],
-			rows: []
+		this._telemetryService = _telemetryService;
+		_defineProperty(this, "_renderMetric$", new Subject());
+		_defineProperty(this, "renderMetric$", this._renderMetric$.asObservable());
+		_defineProperty(this, "_renderFrameTimeMetric", null);
+		_defineProperty(this, "_renderFrameTags", {});
+		_defineProperty(this, "_afterRenderMetric$", new Subject());
+		this._addNewRender();
+		this._initRenderMetricSubscriber();
+	}
+	_addNewRender() {
+		const { scene, engine, unit: workbook } = this._context;
+		this._addComponent(workbook);
+		this._initRerenderScheduler();
+		this._initCommandListener();
+		const worksheet = this._context.unit.getActiveSheet();
+		if (!worksheet) throw new Error("No active sheet found");
+		const sheetId = worksheet.getSheetId();
+		this._sheetSkeletonManagerService.setCurrent({ sheetId });
+		const frameFn = () => scene.render();
+		this.disposeWithMe(this._context.activated$.subscribe((activated) => {
+			if (activated) engine.runRenderLoop(frameFn);
+			else engine.stopRenderLoop(frameFn);
+		}));
+	}
+	_initRenderMetricSubscriber() {
+		const { engine } = this._context;
+		this.disposeWithMe(engine.beginFrame$.subscribe(() => {
+			this._renderFrameTimeMetric = null;
+			this._renderFrameTags = {};
+		}));
+		this.disposeWithMe(engine.endFrame$.subscribe(() => {
+			if (this._renderFrameTimeMetric && Object.keys(this._renderFrameTimeMetric).some((key) => key.startsWith(SHEET_EXTENSION_PREFIX))) this._afterRenderMetric$.next({
+				frameTimeMetric: this._renderFrameTimeMetric,
+				tags: this._renderFrameTags
+			});
+		}));
+		this.disposeWithMe(engine.renderFrameTimeMetric$.subscribe(([key, value]) => {
+			if (!this._renderFrameTimeMetric) this._renderFrameTimeMetric = {};
+			if (!this._renderFrameTimeMetric[key]) this._renderFrameTimeMetric[key] = [];
+			this._renderFrameTimeMetric[key].push(Math.round(value * 100) / 100);
+		}));
+		this.disposeWithMe(engine.renderFrameTags$.subscribe(([key, value]) => {
+			this._renderFrameTags[key] = value;
+		}));
+		const frameInfoList = [];
+		this.disposeWithMe(this._afterRenderMetric$.pipe(withLatestFrom(engine.endFrame$)).subscribe(([sceneRenderDetail, basicFrameTimeInfo]) => {
+			frameInfoList.push({
+				FPS: basicFrameTimeInfo.FPS,
+				elapsedTime: basicFrameTimeInfo.elapsedTime,
+				frameTime: Math.round(basicFrameTimeInfo.frameTime * 100) / 100,
+				...sceneRenderDetail.frameTimeMetric,
+				...sceneRenderDetail.tags
+			});
+			if (frameInfoList.length > FRAME_STACK_THRESHOLD) {
+				this._captureRenderMetric(frameInfoList);
+				frameInfoList.length = 0;
+			}
+		}));
+	}
+	/**
+	* Send render metric to telemetry service
+	* @param frameInfoList
+	*/
+	_captureRenderMetric(frameInfoList) {
+		var _this$_telemetryServi;
+		const filteredFrameInfo = frameInfoList;
+		if (filteredFrameInfo.length === 0) return;
+		const sumValueForNumListFields = (data) => {
+			let totalSum = 0;
+			const sums = Object.entries(data).filter(([_, value]) => Array.isArray(value)).map(([key]) => key).reduce((acc, key) => {
+				acc[key] = data[key].reduce((sum, num) => sum + num, 0);
+				return acc;
+			}, {});
+			Object.keys(data).filter((key) => key.startsWith(SHEET_EXTENSION_PREFIX)).forEach((key) => {
+				totalSum += sums[key];
+			});
+			return {
+				...sums,
+				extensionTotal: totalSum
+			};
+		};
+		const frameTimeListAfterSum = frameInfoList.map((info) => {
+			return {
+				...info,
+				...sumValueForNumListFields(info)
+			};
+		});
+		const getSummaryStats = (list) => {
+			return Object.entries(list[0]).filter(([key, _]) => !["elapsedTime"].includes(key)).filter(([_, value]) => typeof value === "number").map(([key]) => key).reduce((acc, key) => {
+				const values = list.map((obj) => obj[key]);
+				const max = Math.max(...values);
+				const min = Math.min(...values);
+				const avg = values.reduce((sum, val) => sum + val, 0) / values.length;
+				acc[key] = {
+					max: Math.round(max * 100) / 100,
+					min: Math.round(min * 100) / 100,
+					avg: Math.round(avg * 100) / 100
+				};
+				return acc;
+			}, {});
+		};
+		const summaryFrameStats = getSummaryStats(frameTimeListAfterSum);
+		const elapsedTimeToStart = filteredFrameInfo[filteredFrameInfo.length - 1].elapsedTime;
+		const telemetryData = {
+			sheetId: this._context.unit.getActiveSheet().getSheetId(),
+			unitId: this._context.unit.getUnitId(),
+			elapsedTimeToStart,
+			...summaryFrameStats
+		};
+		this._renderMetric$.next(telemetryData);
+		(_this$_telemetryServi = this._telemetryService) === null || _this$_telemetryServi === void 0 || _this$_telemetryServi.capture("sheet_render_cost", telemetryData);
+	}
+	_addComponent(workbook) {
+		const { scene, components } = this._context;
+		const worksheet = workbook.getActiveSheet();
+		const spreadsheet = new Spreadsheet("__SpreadsheetRender__");
+		this._addViewport(worksheet);
+		const spreadsheetRowHeader = new SpreadsheetRowHeader("__SpreadsheetRowHeader__");
+		const spreadsheetColumnHeader = new SpreadsheetColumnHeader("__SpreadsheetColumnHeader__");
+		const SpreadsheetLeftTopPlaceholder = new Rect("__SpreadsheetLeftTopPlaceholder__", {
+			zIndex: 2,
+			left: -1,
+			top: -1,
+			fill: "gray.50",
+			stroke: "gray.200",
+			strokeWidth: 1
+		});
+		this._context.mainComponent = spreadsheet;
+		components.set("__SpreadsheetRender__", spreadsheet);
+		components.set("__SpreadsheetRowHeader__", spreadsheetRowHeader);
+		components.set("__SpreadsheetColumnHeader__", spreadsheetColumnHeader);
+		components.set("__SpreadsheetLeftTopPlaceholder__", SpreadsheetLeftTopPlaceholder);
+		scene.addObjects([spreadsheet], 0);
+		scene.addObjects([
+			spreadsheetRowHeader,
+			spreadsheetColumnHeader,
+			SpreadsheetLeftTopPlaceholder
+		], 10);
+		scene.enableLayerCache(0, 10);
+	}
+	_initViewports(scene, rowHeader, columnHeader) {
+		const rowHeaderWidth = rowHeader.hidden ? 0 : rowHeader.width;
+		const columnHeaderHeight = columnHeader.hidden ? 0 : columnHeader.height;
+		const bufferEdgeX = 100;
+		const bufferEdgeY = 100;
+		const viewMain = new Viewport(SHEET_VIEWPORT_KEY.VIEW_MAIN, scene, {
+			left: rowHeaderWidth,
+			top: columnHeaderHeight,
+			bottom: 0,
+			right: 0,
+			isWheelPreventDefaultX: true,
+			allowCache: true,
+			bufferEdgeX,
+			bufferEdgeY
+		});
+		const viewMainLeftTop = new Viewport(SHEET_VIEWPORT_KEY.VIEW_MAIN_LEFT_TOP, scene, {
+			isWheelPreventDefaultX: true,
+			active: false,
+			allowCache: true,
+			bufferEdgeX: 0,
+			bufferEdgeY: 0
+		});
+		const viewMainLeft = new Viewport(SHEET_VIEWPORT_KEY.VIEW_MAIN_LEFT, scene, {
+			isWheelPreventDefaultX: true,
+			active: false,
+			allowCache: true,
+			bufferEdgeX: 0,
+			bufferEdgeY
 		});
-		_defineProperty(this, "interceptor", new InterceptorManager({ HEADER_UNHIDE_RANGE_VISIBLE_CHECK }));
-		this._init();
+		const viewMainTop = new Viewport(SHEET_VIEWPORT_KEY.VIEW_MAIN_TOP, scene, {
+			isWheelPreventDefaultX: true,
+			active: false,
+			allowCache: true,
+			bufferEdgeX,
+			bufferEdgeY: 0
+		});
+		const viewRowTop = new Viewport(SHEET_VIEWPORT_KEY.VIEW_ROW_TOP, scene, {
+			active: false,
+			isWheelPreventDefaultX: true
+		});
+		const viewRowBottom = new Viewport(SHEET_VIEWPORT_KEY.VIEW_ROW_BOTTOM, scene, {
+			left: 0,
+			top: columnHeaderHeight,
+			bottom: 0,
+			width: rowHeaderWidth + 1,
+			isWheelPreventDefaultX: true
+		});
+		const viewColumnLeft = new Viewport(SHEET_VIEWPORT_KEY.VIEW_COLUMN_LEFT, scene, {
+			active: false,
+			isWheelPreventDefaultX: true
+		});
+		const viewColumnRight = new Viewport(SHEET_VIEWPORT_KEY.VIEW_COLUMN_RIGHT, scene, {
+			left: rowHeaderWidth,
+			top: 0,
+			height: columnHeaderHeight + 1,
+			right: 0,
+			isWheelPreventDefaultX: true
+		});
+		return {
+			viewMain,
+			viewLeftTop: new Viewport(SHEET_VIEWPORT_KEY.VIEW_LEFT_TOP, scene, {
+				left: 0,
+				top: 0,
+				width: rowHeaderWidth,
+				height: columnHeaderHeight,
+				isWheelPreventDefaultX: true
+			}),
+			viewMainLeftTop,
+			viewMainLeft,
+			viewMainTop,
+			viewColumnLeft,
+			viewRowTop,
+			viewRowBottom,
+			viewColumnRight
+		};
 	}
-	dispose() {
-		super.dispose();
-		this._clearShapes();
+	/**
+	*
+	* initViewport & wheel event
+	* +-----------------+--------------------+-------------------+
+	* |  VIEW_LEFT_TOP  |  VIEW_COLUMN_LEFT  | VIEW_COLUMN_RIGHT |
+	* +-----------------+--------------------+-------------------+
+	* |  VIEW_ROW_TOP   | VIEW_MAIN_LEFT_TOP |   VIEW_MAIN_TOP   |
+	* +-----------------+--------------------+-------------------+
+	* | VIEW_ROW_BOTTOM |   VIEW_MAIN_LEFT   |     VIEW_MAIN     |
+	* +-----------------+--------------------+-------------------+
+	*/
+	_addViewport(worksheet) {
+		const scene = this._context.scene;
+		const { rowHeader, columnHeader } = worksheet.getConfig();
+		const { viewMain } = this._initViewports(scene, rowHeader, columnHeader);
+		const sheetsUIConfig = this._configService.getConfig(SHEETS_UI_PLUGIN_CONFIG_KEY);
+		new ScrollBar(viewMain, sheetsUIConfig === null || sheetsUIConfig === void 0 ? void 0 : sheetsUIConfig.scrollConfig);
+		scene.attachControl();
+		return viewMain;
 	}
-	_init() {
-		let activeSheetId = "";
-		this._context.unit.activeSheet$.pipe(takeUntil(this.dispose$)).subscribe((worksheet) => {
-			this._clearShapes();
-			if (!worksheet) {
-				activeSheetId = "";
-				return;
-			}
-			activeSheetId = worksheet.getSheetId();
-			this._update(this._workbook, worksheet);
-		});
+	_initRerenderScheduler() {
 		this.disposeWithMe(this._sheetSkeletonManagerService.currentSkeleton$.subscribe((param) => {
-			if (param) {
-				const { unitId, sheetId } = param;
-				if (unitId === this._workbook.getUnitId() && sheetId === activeSheetId) {
-					const worksheet = this._workbook.getSheetBySheetId(sheetId);
-					if (worksheet) this._update(this._workbook, worksheet);
-				}
-			}
+			if (!param) return null;
+			const { skeleton: spreadsheetSkeleton, sheetId } = param;
+			const workbook = this._context.unit;
+			const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getSheetBySheetId(sheetId);
+			if (workbook == null || worksheet == null) return;
+			const { mainComponent, components } = this._context;
+			const spreadsheet = mainComponent;
+			const spreadsheetRowHeader = components.get("__SpreadsheetRowHeader__");
+			const spreadsheetColumnHeader = components.get("__SpreadsheetColumnHeader__");
+			const spreadsheetLeftTopPlaceholder = components.get("__SpreadsheetLeftTopPlaceholder__");
+			const leftTopPlaceholderSize = getLeftTopPlaceholderSize(spreadsheetSkeleton);
+			spreadsheet === null || spreadsheet === void 0 || spreadsheet.updateSkeleton(spreadsheetSkeleton);
+			spreadsheetRowHeader === null || spreadsheetRowHeader === void 0 || spreadsheetRowHeader.updateSkeleton(spreadsheetSkeleton);
+			spreadsheetColumnHeader === null || spreadsheetColumnHeader === void 0 || spreadsheetColumnHeader.updateSkeleton(spreadsheetSkeleton);
+			spreadsheetLeftTopPlaceholder === null || spreadsheetLeftTopPlaceholder === void 0 || spreadsheetLeftTopPlaceholder.transformByState({
+				width: leftTopPlaceholderSize.width,
+				height: leftTopPlaceholderSize.height
+			});
 		}));
 	}
-	_update(workbook, worksheet) {
-		var _this$_sheetSkeletonM;
-		const skeleton = (_this$_sheetSkeletonM = this._sheetSkeletonManagerService.getSkeletonParam(worksheet.getSheetId())) === null || _this$_sheetSkeletonM === void 0 ? void 0 : _this$_sheetSkeletonM.skeleton;
-		if (!skeleton) return;
-		const visibleCheck = this.interceptor.fetchThroughInterceptors(HEADER_UNHIDE_RANGE_VISIBLE_CHECK);
-		const shouldRenderRange = (payload) => this._headerUnhideRangeService.shouldRenderRange(visibleCheck(true, payload) ?? true, payload);
-		const hiddenRowRanges = worksheet.getHiddenRows().filter((range) => shouldRenderRange({
-			axis: "row",
-			range,
-			workbook,
-			worksheet
-		}));
-		const hiddenColRanges = worksheet.getHiddenCols().filter((range) => shouldRenderRange({
-			axis: "column",
-			range,
-			workbook,
-			worksheet
+	_initCommandListener() {
+		this.disposeWithMe(this._commandService.onCommandExecuted((command, options) => {
+			const { unit: workbook } = this._context;
+			const { id: commandId } = command;
+			if (COMMAND_LISTENER_SKELETON_CHANGE.includes(commandId) || this._sheetRenderService.checkMutationShouldTriggerRerender(commandId)) {
+				const { unitId, subUnitId } = command.params;
+				const worksheet = workbook.getActiveSheet();
+				if (!worksheet) return;
+				const workbookId = this._context.unitId;
+				const worksheetId = worksheet.getSheetId();
+				if (unitId !== workbookId || subUnitId !== worksheetId) return;
+				this._sheetSkeletonManagerService.makeDirty({
+					sheetId: worksheetId,
+					commandId
+				}, true);
+				this._sheetSkeletonManagerService.setCurrent({
+					sheetId: worksheetId,
+					commandId
+				});
+			} else if (COMMAND_LISTENER_VALUE_CHANGE.includes(commandId)) this._sheetSkeletonManagerService.reCalculate();
+			if (command.type === CommandType.MUTATION) this._markUnitDirty(command, options);
 		}));
-		const { scene } = this._getSheetObject();
-		const rowCount = worksheet.getRowCount();
-		const rowShapes = hiddenRowRanges.map((range) => {
-			const { startRow, endRow } = range;
-			const position = getCoordByCell(startRow, 0, scene, skeleton);
-			const hasPrevious = startRow !== 0;
-			const hasNext = endRow !== rowCount - 1;
-			return new HeaderUnhideShape(HEADER_UNHIDE_CONTROLLER_SHAPE, {
-				type: 0,
-				hovered: false,
-				hasPrevious,
-				hasNext,
-				top: position.startY - (hasPrevious ? 12 : 0),
-				left: position.startX - 12
-			}, () => this._commandService.executeCommand(SetSpecificRowsVisibleCommand.id, {
-				unitId: workbook.getUnitId(),
-				subUnitId: worksheet.getSheetId(),
-				ranges: [range]
-			}));
-		});
-		const colCount = worksheet.getColumnCount();
-		const colShapes = hiddenColRanges.map((range) => {
-			const { startColumn, endColumn } = range;
-			const position = getCoordByCell(0, startColumn, scene, skeleton);
-			const hasPrevious = startColumn !== 0;
-			const hasNext = endColumn !== colCount - 1;
-			return new HeaderUnhideShape(HEADER_UNHIDE_CONTROLLER_SHAPE, {
-				type: 1,
-				hovered: false,
-				hasPrevious,
-				hasNext,
-				top: Math.max(skeleton.columnHeaderHeight, skeleton.columnHeaderHeightAndMarginTop) - 12,
-				left: position.startX - (hasPrevious ? 12 : 0)
-			}, () => this._commandService.executeCommand(SetSpecificColsVisibleCommand.id, {
-				unitId: workbook.getUnitId(),
-				subUnitId: worksheet.getSheetId(),
-				ranges: [range]
-			}));
-		});
-		scene.addObjects(colShapes, 12);
-		scene.addObjects(rowShapes, 12);
-		this._clearShapes();
-		this._shapes = {
-			cols: colShapes,
-			rows: rowShapes
+	}
+	_markUnitDirty(command, options) {
+		if (command.id.substring(0, 3) === "doc") return;
+		const { mainComponent: spreadsheet, scene } = this._context;
+		if (command.id === SetFormulaCalculationNotificationMutation.id) {
+			if (command.params.stageInfo != null) return;
+		}
+		if (spreadsheet) spreadsheet.makeDirty();
+		scene.makeDirty();
+		if (!command.params) return;
+		const cmdParams = command.params;
+		const viewports = this._spreadsheetViewports(scene);
+		if (command.id === SetRangeValuesMutation.id && cmdParams.cellValue && !(options === null || options === void 0 ? void 0 : options.fromChangeset)) {
+			const dirtyRange = this._cellValueToRange(cmdParams.cellValue);
+			const dirtyBounds = this._rangeToBounds([dirtyRange]);
+			this._markViewportDirty(viewports, dirtyBounds);
+			spreadsheet.setDirtyArea(dirtyBounds);
+		}
+		if (command.id === MoveRangeMutation.id && cmdParams.from && cmdParams.to && !(options === null || options === void 0 ? void 0 : options.fromChangeset)) {
+			const fromRange = cmdParams.fromRange || this._cellValueToRange(cmdParams.from.value);
+			const toRange = cmdParams.toRange || this._cellValueToRange(cmdParams.to.value);
+			const dirtyBounds = this._rangeToBounds([fromRange, toRange]);
+			this._markViewportDirty(viewports, dirtyBounds);
+			spreadsheet.setDirtyArea(dirtyBounds);
+		}
+	}
+	/**
+	* cellValue data structure:
+	* {[row]: { [col]: value}}
+	* @param cellValue
+	* @returns IRange
+	*/
+	_cellValueToRange(cellValue) {
+		const columns = [];
+		let minCol = 0;
+		let maxCol = 0;
+		let minRow = 0;
+		let maxRow = 0;
+		for (const [_row, columnObj] of Object.entries(cellValue)) {
+			for (const column in columnObj) {
+				columns.push(Number(column));
+				if (minCol > Number(column)) minCol = Number(column);
+				if (maxCol < Number(column)) maxCol = Number(column);
+			}
+			if (minRow > Number(_row)) minRow = Number(_row);
+			if (maxRow < Number(_row)) maxRow = Number(_row);
+		}
+		return {
+			startRow: minRow,
+			endRow: maxRow,
+			startColumn: minCol,
+			endColumn: maxCol
 		};
 	}
-	_clearShapes() {
-		this._shapes.cols.forEach((shape) => shape.dispose());
-		this._shapes.rows.forEach((shape) => shape.dispose());
-		this._shapes = {
-			cols: [],
-			rows: []
-		};
+	_rangeToBounds(ranges) {
+		const { rowHeightAccumulation, columnWidthAccumulation, rowHeaderWidth, columnHeaderHeight } = this._sheetSkeletonManagerService.getCurrentParam().skeleton;
+		const dirtyBounds = [];
+		for (const r of ranges) {
+			const { startRow, endRow, startColumn, endColumn } = r;
+			const top = startRow === 0 ? 0 : rowHeightAccumulation[startRow - 1] + columnHeaderHeight;
+			const bottom = rowHeightAccumulation[endRow] + columnHeaderHeight;
+			const left = startColumn === 0 ? 0 : columnWidthAccumulation[startColumn - 1] + rowHeaderWidth;
+			const right = columnWidthAccumulation[endColumn] + rowHeaderWidth;
+			dirtyBounds.push({
+				top,
+				left,
+				bottom,
+				right,
+				width: right - left,
+				height: bottom - top
+			});
+		}
+		return dirtyBounds;
+	}
+	_markViewportDirty(viewports, dirtyBounds) {
+		const activeViewports = viewports.filter((vp) => vp.isActive && vp.cacheBound);
+		for (const vp of activeViewports) for (const b of dirtyBounds) if (Rectangle.hasIntersectionBetweenTwoRect(vp.cacheBound, b)) vp.markDirty(true);
 	}
-	_getSheetObject() {
-		return getSheetObject(this._workbook, this._context);
+	_spreadsheetViewports(scene) {
+		return scene.getViewports().filter((v) => [
+			"viewMain",
+			"viewMainLeftTop",
+			"viewMainTop",
+			"viewMainLeft"
+		].includes(v.viewportKey));
 	}
 };
-HeaderUnhideRenderController = __decorate([
-	__decorateParam(1, Inject(SheetSkeletonManagerService)),
-	__decorateParam(2, Inject(HeaderUnhideRangeService)),
-	__decorateParam(3, ICommandService)
-], HeaderUnhideRenderController);
+SheetRenderController = __decorate([
+	__decorateParam(1, Inject(IConfigService)),
+	__decorateParam(2, Inject(SheetSkeletonManagerService)),
+	__decorateParam(3, Inject(SheetsRenderService)),
+	__decorateParam(4, ICommandService),
+	__decorateParam(5, Optional(ITelemetryService))
+], SheetRenderController);
+function getLeftTopPlaceholderSize(skeleton) {
+	return {
+		width: skeleton.rowHeaderWidthAndMarginLeft ?? skeleton.rowHeaderWidth,
+		height: skeleton.columnHeaderHeightAndMarginTop ?? skeleton.columnHeaderHeight
+	};
+}
 
 //#endregion
 //#region src/services/status-bar.service.ts
@@ -17357,6 +17170,7 @@ function ToggleGridlinesMenuFactory(accessor) {
 		type: MenuItemType.BUTTON,
 		tooltip: "sheets-ui.toolbar.toggleGridlines",
 		icon: "HideGridlinesIcon",
+		hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_SHEET),
 		activated$: new Observable((observer) => {
 			const getValue = () => {
 				const workbook = instanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
@@ -18103,7 +17917,7 @@ function TextColorSelectorMenuItemFactory(accessor) {
 				selectable: false
 			},
 			value$: new Observable((subscriber) => {
-				const defaultValue = DEFAULT_STYLES.cl.rgb;
+				const defaultValue = themeService.getColorFromTheme("gray.900");
 				const { isAllValuesSame, value: currentValue } = selectionManagerService.getCellStylesProperty("cl");
 				if (isAllValuesSame) subscriber.next((currentValue === null || currentValue === void 0 ? void 0 : currentValue.rgb) ?? defaultValue);
 				else subscriber.next(defaultValue);
@@ -20179,7 +19993,7 @@ function getEmbedSheetsTabCustomData(snapshot) {
 function isEmbedSheetsTabCustomData(value) {
 	if (!value || typeof value !== "object") return false;
 	const candidate = value;
-	return candidate.version === 1 && typeof candidate.embedId === "string" && typeof candidate.hostAnchorId === "string";
+	return candidate.version === 1 && typeof candidate.embedId === "string" && typeof candidate.hostAnchorId === "string" && (candidate.childType === void 0 || typeof candidate.childType === "number");
 }
 
 //#endregion
@@ -20188,10 +20002,6 @@ const ISheetEmbedRuntimeService = createIdentifier("sheet-ui.embed-runtime.servi
 
 //#endregion
 //#region src/views/auto-fill-popup-menu/AutoFillPopupMenu.tsx
-const useUpdate = () => {
-	const [, setState] = useState({});
-	return useCallback(() => setState((prevState) => !prevState), []);
-};
 function AutoFillPopupMenu() {
 	const commandService = useDependency(ICommandService);
 	const univerInstanceService = useDependency(IUniverInstanceService);
@@ -20221,7 +20031,8 @@ function AutoFillPopupMenu() {
 		col: -1
 	}, false, [autoFillService]);
 	const selected = useObservable(autoFillService.applyType$, AUTO_FILL_APPLY_TYPE.SERIES);
-	const [isHovered, setHovered] = useState(false);
+	const [isHovered, setIsHovered] = useState(false);
+	const [, forceUpdate] = useReducer((version) => version + 1, 0);
 	const workbook = useActiveWorkbook();
 	const sheetSkeletonManagerService = useMemo(() => {
 		if (workbook) {
@@ -20231,14 +20042,13 @@ function AutoFillPopupMenu() {
 		return null;
 	}, [workbook, renderManagerService]);
 	const handleMouseEnter = () => {
-		setHovered(true);
+		setIsHovered(true);
 	};
 	const handleMouseLeave = () => {
-		setHovered(false);
+		setIsHovered(false);
 	};
-	const forceUpdate = useUpdate();
 	useEffect(() => {
-		return commandService.onCommandExecuted((command, options) => {
+		return commandService.onCommandExecuted((command) => {
 			if (command.id === SetScrollOperation.id) forceUpdate();
 		}).dispose;
 	}, [forceUpdate, commandService]);
@@ -20283,7 +20093,11 @@ function AutoFillPopupMenu() {
 	const showMore = visible || isHovered;
 	const availableMenu = menu.filter((item) => !item.disable);
 	return /* @__PURE__ */ jsx("div", {
-		className: "univer-absolute univer-inset-0 univer-z-10 univer-size-0",
+		className: "univer-absolute univer-z-10 univer-size-0",
+		style: {
+			left: 0,
+			top: 0
+		},
 		children: /* @__PURE__ */ jsx("div", {
 			className: "univer-absolute",
 			style: {
@@ -20308,9 +20122,9 @@ function AutoFillPopupMenu() {
 				children: /* @__PURE__ */ jsxs("div", {
 					className: clsx("univer-flex univer-items-center univer-gap-2 univer-rounded univer-p-1 hover:univer-bg-gray-100 dark:hover:!univer-bg-gray-800", borderClassName, {
 						"univer-bg-gray-100 dark:!univer-bg-gray-800": visible,
-						"univer-bg-white dark:!univer-bg-gray-900": !visible
+						"univer-bg-gray-0 dark:!univer-bg-gray-900": !visible
 					}),
-					children: [/* @__PURE__ */ jsx(AutofillDoubleIcon, { className: "univer-fill-primary-600 univer-text-gray-900 dark:!univer-text-white" }), showMore && /* @__PURE__ */ jsx(MoreDownIcon, { className: "dark:!univer-text-white" })]
+					children: [/* @__PURE__ */ jsx(AutofillDoubleIcon, { className: "univer-fill-primary-600 univer-text-gray-900 dark:!univer-text-gray-0" }), showMore && /* @__PURE__ */ jsx(MoreDownIcon, { className: "dark:!univer-text-gray-0" })]
 				})
 			})
 		})
@@ -20457,7 +20271,7 @@ const EDITOR_DEFAULT_POSITION = {
 	left: HIDDEN_EDITOR_POSITION
 };
 const CELL_EDITOR_DARK_SURFACE_THEME_COLOR = "gray.800";
-const CELL_EDITOR_LIGHT_SURFACE_THEME_COLOR = "white";
+const CELL_EDITOR_LIGHT_SURFACE_THEME_COLOR = "gray.0";
 /**
 * @returns the host background color for the cell editor.
 */
@@ -20516,6 +20330,7 @@ function isEmbedRuntimeEditorOrPopup(target) {
 * @returns the rendered cell editor container.
 */
 function EditorContainer() {
+	var _workbook$getSheetByS;
 	const [state, setState] = useState({ ...EDITOR_DEFAULT_POSITION });
 	const cellEditorManagerService = useDependency(ICellEditorManagerService);
 	const injector = useDependency(Injector);
@@ -20534,9 +20349,12 @@ function EditorContainer() {
 	const disableAutoFocus = useObservable(() => contextService.subscribeContextValue$(DISABLE_AUTO_FOCUS_KEY), false, void 0, [contextService, DISABLE_AUTO_FOCUS_KEY]);
 	const FormulaEditor = componentManager.get(EMBEDDING_FORMULA_EDITOR_COMPONENT_KEY);
 	const editState = useObservable(editorBridgeService.currentEditCellState$);
+	const workbook = editState ? instanceService.getUnit(editState.unitId, UniverInstanceType.UNIVER_SHEET) ?? null : null;
+	const activeSheet = useActiveWorksheet(workbook);
 	const darkMode = useObservable(themeService.darkMode$, themeService.darkMode);
 	const [showEditCellAddress, setShowEditCellAddress] = useState(false);
-	const editCellAddress = editState ? `${numberToABC(editState.column)}${editState.row + 1}` : null;
+	const editSheetName = editState ? workbook === null || workbook === void 0 || (_workbook$getSheetByS = workbook.getSheetBySheetId(editState.sheetId)) === null || _workbook$getSheetByS === void 0 ? void 0 : _workbook$getSheetByS.getName() : null;
+	const editCellAddress = editState ? `${activeSheet && editSheetName && activeSheet.getSheetId() !== editState.sheetId ? `'${quoteSheetName(editSheetName)}'!` : ""}${numberToABC(editState.column)}${editState.row + 1}` : null;
 	const editorBorderColor = genNormalSelectionStyle(themeService).stroke;
 	const focusCoordinator = injector.has(ISheetEmbedRuntimeFocusCoordinator) ? injector.get(ISheetEmbedRuntimeFocusCoordinator) : void 0;
 	const resolveRuntimeFocusState = () => {
@@ -20856,7 +20674,7 @@ function EditorContainer() {
 			className: "univer-pointer-events-none univer-absolute univer-left-0 univer-top-0 univer-z-10 univer-whitespace-nowrap univer-rounded-t univer-px-1.5 univer-text-xs univer-leading-5",
 			style: {
 				backgroundColor: editorBorderColor,
-				color: themeService.getColorFromTheme("white"),
+				color: themeService.getColorFromTheme("gray.0"),
 				transform: "translateY(-100%)"
 			},
 			children: editCellAddress
@@ -21093,7 +20911,13 @@ function DefinedName({ disable }) {
 		return () => {
 			subscription.unsubscribe();
 		};
-	}, []);
+	}, [
+		definedNamesService,
+		lexerTreeBuilder,
+		selectionManagerService,
+		unitId,
+		workbook
+	]);
 	const handleDefinedNamesList = debounce((value) => {
 		const hasMatch = definedNames.find((i) => i.name.toLowerCase().includes(value.toLowerCase()));
 		if (hasMatch && !open) setOpen(true);
@@ -21195,7 +21019,7 @@ function DefinedName({ disable }) {
 		className: "univer-relative univer-box-border univer-flex univer-h-full univer-w-24 univer-border-r-gray-200 univer-py-1.5 univer-transition-all",
 		children: [/* @__PURE__ */ jsx("input", {
 			ref: inputRef,
-			className: clsx("univer-box-border univer-size-full univer-appearance-none univer-pl-1.5 univer-pr-5 univer-text-gray-900 focus:univer-outline-none rtl:univer-pl-5 rtl:univer-pr-1.5 dark:!univer-border-r-gray-700 dark:!univer-bg-gray-900 dark:!univer-text-white", borderRightClassName, { "univer-cursor-not-allowed": disable }),
+			className: clsx("univer-box-border univer-size-full univer-appearance-none univer-bg-transparent univer-pl-1.5 univer-pr-5 univer-text-gray-900 focus:univer-outline-none dark:!univer-border-r-gray-700 dark:!univer-text-gray-0", borderRightClassName, { "univer-cursor-not-allowed": disable }),
 			type: "text",
 			value: inputValue,
 			onChange: handleChangeSelection,
@@ -21214,7 +21038,7 @@ function DefinedName({ disable }) {
 			onOpenChange: setOpen,
 			onOpenAutoFocus: (e) => e.preventDefault(),
 			children: /* @__PURE__ */ jsx("a", {
-				className: clsx("univer-absolute univer-right-0 univer-top-0 univer-flex univer-h-full univer-cursor-pointer univer-items-center univer-justify-center univer-px-1 univer-transition-colors univer-duration-200 hover:univer-bg-gray-100 rtl:univer-left-0 rtl:univer-right-auto dark:!univer-text-white dark:hover:!univer-bg-gray-800", { "univer-cursor-not-allowed univer-text-gray-300 hover:univer-bg-transparent dark:!univer-text-gray-700": disable }),
+				className: clsx("univer-absolute univer-right-0 univer-top-0 univer-flex univer-h-full univer-cursor-pointer univer-items-center univer-justify-center univer-px-1 univer-transition-colors univer-duration-200 hover:univer-bg-gray-100 dark:!univer-text-gray-0 dark:hover:!univer-bg-gray-800", { "univer-cursor-not-allowed univer-text-gray-300 hover:univer-bg-transparent dark:!univer-text-gray-700": disable }),
 				children: /* @__PURE__ */ jsx(MoreDownIcon, {})
 			})
 		})]
@@ -21349,7 +21173,7 @@ function FormulaBar(props) {
 	const workbookEditDisable = !((workbookEditablePermission === null || workbookEditablePermission === void 0 ? void 0 : workbookEditablePermission.value) ?? true);
 	const editorActivationDisable = editDisable || workbookEditDisable;
 	const disabled = editDisable || imageDisable;
-	const shouldSkipFocus = useRef(false);
+	const shouldSkipFocusRef = useRef(false);
 	const handlePointerDown = () => {
 		try {
 			contextService.setContextValue(FOCUSING_FX_BAR_EDITOR, true);
@@ -21364,25 +21188,26 @@ function FormulaBar(props) {
 					unitId: editState.unitId
 				})) {
 					contextService.setContextValue(FOCUSING_FX_BAR_EDITOR, false);
-					shouldSkipFocus.current = true;
+					shouldSkipFocusRef.current = true;
 				}
 			}
 		} catch (e) {
 			contextService.setContextValue(FOCUSING_FX_BAR_EDITOR, false);
-			shouldSkipFocus.current = true;
+			shouldSkipFocusRef.current = true;
 			throw e;
 		}
 	};
 	const handlePointerUp = () => {
-		if (shouldSkipFocus.current) setTimeout(() => {
+		if (shouldSkipFocusRef.current) setTimeout(() => {
 			editorService.blur(true);
 		}, 30);
-		shouldSkipFocus.current = false;
+		shouldSkipFocusRef.current = false;
 	};
 	const hideEditor = isCellImage(editState === null || editState === void 0 || (_editState$documentLa = editState.documentLayoutObject.documentModel) === null || _editState$documentLa === void 0 ? void 0 : _editState$documentLa.getSnapshot()) || viewDisable;
 	return /* @__PURE__ */ jsxs("div", {
+		dir: "ltr",
 		"data-u-comp": "formula-bar",
-		className: clsx("univer-box-border univer-flex univer-bg-white univer-transition-[height] univer-ease-linear dark:!univer-bg-gray-800", borderBottomClassName, className, {
+		className: clsx("univer-box-border univer-flex univer-bg-gray-0 univer-text-gray-900 univer-transition-[height] univer-ease-linear dark:!univer-bg-gray-800", borderBottomClassName, className, {
 			"univer-h-7": arrowDirection === 0,
 			"univer-h-20": arrowDirection === 1,
 			"univer-pointer-events-none": editDisable
@@ -21400,17 +21225,17 @@ function FormulaBar(props) {
 						className: clsx("univer-relative univer-box-border univer-flex univer-h-full univer-w-20 univer-items-center univer-justify-center univer-text-xs", borderRightClassName),
 						children: [
 							/* @__PURE__ */ jsx("span", {
-								className: clsx("univer-flex univer-items-center univer-justify-center univer-rounded univer-p-1 univer-text-base dark:!univer-text-white", { "univer-cursor-pointer univer-text-red-600 hover:univer-bg-gray-100 dark:!univer-text-green-400 dark:hover:!univer-bg-gray-700": iconActivated }),
+								className: clsx("univer-flex univer-items-center univer-justify-center univer-rounded univer-p-1 univer-text-base dark:!univer-text-gray-0", { "univer-cursor-pointer univer-text-red-600 hover:univer-bg-gray-100 dark:!univer-text-green-400 dark:hover:!univer-bg-gray-700": iconActivated }),
 								onClick: handleCloseBtnClick,
 								children: /* @__PURE__ */ jsx(CloseIcon, {})
 							}),
 							/* @__PURE__ */ jsx("span", {
-								className: clsx("univer-flex univer-items-center univer-justify-center univer-rounded univer-p-1 univer-text-base dark:!univer-text-white", { "univer-cursor-pointer univer-text-green-600 hover:univer-bg-gray-100 dark:!univer-text-red-400 dark:hover:!univer-bg-gray-700": iconActivated }),
+								className: clsx("univer-flex univer-items-center univer-justify-center univer-rounded univer-p-1 univer-text-base dark:!univer-text-gray-0", { "univer-cursor-pointer univer-text-green-600 hover:univer-bg-gray-100 dark:!univer-text-red-400 dark:hover:!univer-bg-gray-700": iconActivated }),
 								onClick: handleConfirmBtnClick,
 								children: /* @__PURE__ */ jsx(CheckMarkIcon, {})
 							}),
 							/* @__PURE__ */ jsx("span", {
-								className: "univer-flex univer-cursor-pointer univer-items-center univer-justify-center univer-rounded univer-p-1 univer-text-base hover:univer-bg-gray-100 dark:!univer-text-white dark:hover:!univer-bg-gray-700",
+								className: "univer-flex univer-cursor-pointer univer-items-center univer-justify-center univer-rounded univer-p-1 univer-text-base hover:univer-bg-gray-100 dark:!univer-text-gray-0 dark:hover:!univer-bg-gray-700",
 								onClick: handlerFxBtnClick,
 								children: /* @__PURE__ */ jsx(FxIcon, {})
 							})
@@ -21420,7 +21245,7 @@ function FormulaBar(props) {
 					className: "univer-flex univer-w-full univer-flex-1 univer-overflow-hidden univer-pl-3",
 					children: [/* @__PURE__ */ jsxs("div", {
 						ref,
-						className: "univer-relative univer-flex-1 univer-bg-white dark:!univer-bg-gray-800",
+						className: "univer-relative univer-flex-1 univer-bg-gray-0 dark:!univer-bg-gray-800",
 						onPointerDown: handlePointerDown,
 						onPointerUp: handlePointerUp,
 						style: { pointerEvents: hideEditor ? "none" : "auto" },
@@ -21445,7 +21270,7 @@ function FormulaBar(props) {
 							},
 							autoScrollbar: false,
 							disableContextMenu: false
-						}), hideEditor && /* @__PURE__ */ jsx("div", { className: "univer-pointer-events-none univer-relative univer-left-0 univer-top-0 univer-z-[100] univer-size-full univer-cursor-not-allowed univer-bg-white dark:!univer-bg-gray-800" })]
+						}), hideEditor && /* @__PURE__ */ jsx("div", { className: "univer-pointer-events-none univer-relative univer-left-0 univer-top-0 univer-z-[100] univer-size-full univer-cursor-not-allowed univer-bg-gray-0 dark:!univer-bg-gray-800" })]
 					}), /* @__PURE__ */ jsx("div", {
 						className: clsx("univer-flex univer-h-full univer-w-5 univer-cursor-pointer univer-items-center univer-justify-center univer-text-xs univer-text-gray-700 dark:!univer-text-gray-200", { "univer-cursor-not-allowed univer-text-gray-200 dark:!univer-text-gray-700": editDisable }),
 						onClick: handleArrowClick,
@@ -21586,7 +21411,7 @@ function SheetBarItem(props) {
 	const themeService = useDependency(ThemeService);
 	const getTextColor = (color) => {
 		const darkTextColor = themeService.getColorFromTheme("gray.900");
-		const lightTextColor = themeService.getColorFromTheme("white");
+		const lightTextColor = themeService.getColorFromTheme("gray.0");
 		return new ColorKit(color).isDark() ? lightTextColor : darkTextColor;
 	};
 	const currentSelected = Boolean(selected);
@@ -21600,8 +21425,8 @@ function SheetBarItem(props) {
 		onKeyDown,
 		onClick,
 		className: clsx("univer-mx-1 univer-box-border univer-flex univer-flex-grow univer-cursor-pointer univer-select-none univer-flex-row univer-items-center univer-rounded univer-text-xs univer-transition-[colors,box-shadow] focus-visible:univer-ring-2 focus-visible:univer-ring-primary-500", {
-			"dark:!univer-text-white": !color || color && !textColor,
-			"univer-justify-center univer-bg-white univer-font-bold univer-text-primary-700 univer-shadow": currentSelected,
+			"dark:!univer-text-gray-0": !color || color && !textColor,
+			"univer-justify-center univer-bg-gray-0 univer-font-bold univer-text-primary-700 univer-shadow": currentSelected,
 			"dark:!univer-bg-gray-700": currentSelected && !color,
 			"univer-font-medium univer-text-gray-900 hover:univer-bg-gray-100": !currentSelected,
 			"dark:hover:!univer-bg-gray-700": !currentSelected && !color
@@ -22528,6 +22353,32 @@ const SCROLL_SHADOW_NONE = "";
 const SCROLL_SHADOW_LEFT = "inset 10px 0px 10px -10px rgba(0, 0, 0, 0.2)";
 const SCROLL_SHADOW_RIGHT = "inset -10px 0px 10px -10px rgba(0, 0, 0, 0.2)";
 const SCROLL_SHADOW_BOTH = "inset 10px 0px 10px -10px rgba(0, 0, 0, 0.2), inset -10px 0px 10px -10px rgba(0, 0, 0, 0.2)";
+function EmbedSheetTabProductIcon({ childType }) {
+	const className = "univer-size-4 univer-shrink-0";
+	switch (childType) {
+		case UniverInstanceType.UNIVER_SHEET: return /* @__PURE__ */ jsx(SheetsMultiIcon, {
+			"aria-hidden": true,
+			className
+		});
+		case UniverInstanceType.UNIVER_DOC: return /* @__PURE__ */ jsx(DocsMultiIcon, {
+			"aria-hidden": true,
+			className
+		});
+		case UniverInstanceType.UNIVER_SLIDE: return /* @__PURE__ */ jsx(SlidesMultiIcon, {
+			"aria-hidden": true,
+			className
+		});
+		case UniverInstanceType.UNIVER_BASE: return /* @__PURE__ */ jsx(BasesMultiIcon, {
+			"aria-hidden": true,
+			className
+		});
+		case UniverInstanceType.UNIVER_BOARD: return /* @__PURE__ */ jsx(BoardsMultiIcon, {
+			"aria-hidden": true,
+			className
+		});
+		default: return null;
+	}
+}
 function getScrollShadow(state) {
 	const { leftEnd, rightEnd } = state;
 	if (leftEnd && rightEnd) return SCROLL_SHADOW_NONE;
@@ -22548,6 +22399,7 @@ function shouldRefreshSheetTabs(commandInfo) {
 	}
 }
 function SheetBarTabs() {
+	const injector = useDependency(Injector);
 	const [sheetList, setSheetList] = useState([]);
 	const [activeSheetId, setActiveSheetId] = useState("");
 	const [scrollShadow, setScrollShadow] = useState("");
@@ -22669,19 +22521,28 @@ function SheetBarTabs() {
 	const updateSheetItems = useCallback(() => {
 		const activeSheet = workbook.getActiveSheet();
 		const currentSubUnitId = (activeSheet === null || activeSheet === void 0 ? void 0 : activeSheet.getSheetId()) ?? "";
+		const embedRuntimeService = injector.has(ISheetEmbedRuntimeService) ? injector.get(ISheetEmbedRuntimeService) : void 0;
 		const sheetListItems = workbook.getSheets().filter((sheet) => !sheet.isSheetHidden()).map((sheet, index) => {
+			var _embedRuntimeService$;
 			const worksheetRule = worksheetProtectionRuleModel.getRule(workbook.getUnitId(), sheet.getSheetId());
 			const hasSelectionRule = rangeProtectionRuleModel.getSubunitRuleList(workbook.getUnitId(), sheet.getSheetId()).length > 0;
 			const hasProtection = Boolean((worksheetRule === null || worksheetRule === void 0 ? void 0 : worksheetRule.permissionId) || hasSelectionRule);
+			const embedData = getEmbedSheetsTabCustomData(sheet.getConfig());
+			const embedChildType = (embedData === null || embedData === void 0 ? void 0 : embedData.childType) ?? (embedData ? embedRuntimeService === null || embedRuntimeService === void 0 || (_embedRuntimeService$ = embedRuntimeService.getSheetTabChildType) === null || _embedRuntimeService$ === void 0 ? void 0 : _embedRuntimeService$.call(embedRuntimeService, {
+				hostUnitId: workbook.getUnitId(),
+				hostAnchorId: embedData.hostAnchorId,
+				embedId: embedData.embedId
+			}) : void 0);
 			return {
 				sheetId: sheet.getSheetId(),
-				label: hasProtection ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(LockIcon, { className: "univer-shrink-0" }), /* @__PURE__ */ jsx("span", {
-					className: "univer-truncate univer-outline-none",
-					children: sheet.getName()
-				})] }) : /* @__PURE__ */ jsx("span", {
-					className: "univer-truncate univer-outline-none",
-					children: sheet.getName()
-				}),
+				label: /* @__PURE__ */ jsxs(Fragment, { children: [
+					embedChildType != null && /* @__PURE__ */ jsx(EmbedSheetTabProductIcon, { childType: embedChildType }),
+					hasProtection && /* @__PURE__ */ jsx(LockIcon, { className: "univer-shrink-0" }),
+					/* @__PURE__ */ jsx("span", {
+						className: "univer-truncate univer-outline-none",
+						children: sheet.getName()
+					})
+				] }),
 				index,
 				selected: activeSheet === sheet,
 				color: sheet.getTabColor() ?? void 0
@@ -22690,6 +22551,7 @@ function SheetBarTabs() {
 		setSheetList(sheetListItems);
 		setActiveSheetId(currentSubUnitId);
 	}, [
+		injector,
 		rangeProtectionRuleModel,
 		workbook,
 		worksheetProtectionRuleModel
@@ -23157,120 +23019,98 @@ const functionDisplayNames = {
 	[FUNCTION_NAMES_STATISTICAL.COUNTA]: "sheets-ui.statusbar.countA",
 	[FUNCTION_NAMES_TEXT.CONCATENATE]: "concatenate"
 };
-const CopyableStatisticItem = (item) => {
-	const localeService = useDependency(LocaleService);
-	const messageService = useDependency(IMessageService);
-	const clipboardService = useDependency(IClipboardInterfaceService);
-	const formateValue = formatNumber(item);
-	const copyToClipboard = async () => {
-		await clipboardService.writeText(item.value.toString());
-		messageService.show({
-			type: MessageType.Success,
-			content: localeService.t("sheets-ui.statusbar.copied")
-		});
-	};
-	return /* @__PURE__ */ jsx(Tooltip, {
-		title: localeService.t("sheets-ui.statusbar.clickToCopy"),
-		placement: "top",
-		children: /* @__PURE__ */ jsx("div", {
-			className: "univer-flex univer-cursor-pointer univer-truncate univer-text-center univer-text-xs univer-text-gray-400",
-			onClick: copyToClipboard,
-			children: /* @__PURE__ */ jsx("span", { children: `${localeService.t((functionDisplayNames === null || functionDisplayNames === void 0 ? void 0 : functionDisplayNames[item.name]) || item.name)}: ${formateValue}` })
-		}, item.name)
-	});
-};
 function formatNumber(item) {
 	const { pattern, value: num } = item;
 	if (typeof num !== "number") return 0;
-	if (num >= 1e8) return num.toExponential(2);
 	if (pattern && allowPatternFunctions.includes(item.name)) return numfmt.format(pattern, num, { throws: false });
 	return num.toLocaleString();
 }
 
 //#endregion
 //#region src/views/status-bar/StatusBar.tsx
-const SINGLE_MODE_WIDTH = 800;
-const ROW_COUNT_THRESHOLD = 3;
 const StatusBar = () => {
-	const [isSingle, setIsSingle] = useState(window.innerWidth < SINGLE_MODE_WIDTH);
+	const localeService = useDependency(LocaleService);
 	const statusBarService = useDependency(IStatusBarService);
-	const items = statusBarService.getFunctions().map((item, index) => ({
+	const [selectedFunction, setSelectedFunction] = useState(FUNCTION_NAMES_MATH.SUM);
+	const [open, setOpen] = useState(false);
+	const [statistics, setStatistics] = useState(() => statusBarService.getFunctions().map((item) => ({
 		name: item.func,
 		value: 0,
 		show: true,
-		disable: false,
+		disable: true,
 		pattern: null
-	}));
-	const useStatistics = (initialItems, statusBarService, isSingle) => {
-		const [statistics, setStatistics] = useState(initialItems);
-		const [show, setShow] = useState(true);
-		const filteredStatistics = useMemo(() => statistics.filter((item) => item.show && !item.disable), [statistics]);
-		const firstItem = useMemo(() => filteredStatistics.find((item) => item.show && !item.disable), [filteredStatistics]);
-		const showList = useMemo(() => isSingle && firstItem ? [firstItem] : filteredStatistics, [
-			isSingle,
-			firstItem,
-			filteredStatistics
-		]);
-		const updateStatistics = useCallback((state) => {
-			const items = state === null || state === void 0 ? void 0 : state.values;
-			if (!(items === null || items === void 0 ? void 0 : items.length)) {
-				setShow(false);
-				return;
-			}
-			setShow(true);
-			setStatistics((prevStats) => prevStats.map((stat) => {
-				var _items$find;
+	})));
+	useEffect(() => {
+		const subscription = statusBarService.state$.subscribe((state) => {
+			const values = (state === null || state === void 0 ? void 0 : state.values) ?? [];
+			setStatistics((previousStatistics) => previousStatistics.map((statistic) => {
+				const value = values.find((item) => item.func === statistic.name);
 				return {
-					...stat,
-					value: ((_items$find = items.find((i) => i.func === stat.name)) === null || _items$find === void 0 ? void 0 : _items$find.value) ?? stat.value,
-					disable: !items.some((i) => i.func === stat.name),
+					...statistic,
+					value: (value === null || value === void 0 ? void 0 : value.value) ?? statistic.value,
+					disable: !value,
 					pattern: (state === null || state === void 0 ? void 0 : state.pattern) ?? null
 				};
 			}));
-		}, []);
-		useEffect(() => {
-			const subscription = statusBarService.state$.subscribe(updateStatistics);
-			return () => subscription.unsubscribe();
-		}, [statusBarService, updateStatistics]);
-		return {
-			statistics,
-			showList,
-			show
-		};
+		});
+		return () => subscription.unsubscribe();
+	}, [statusBarService]);
+	const availableStatistics = statistics.filter((item) => item.show && !item.disable);
+	const selectedStatistic = availableStatistics.find((item) => item.name === selectedFunction) ?? availableStatistics.find((item) => item.name === FUNCTION_NAMES_MATH.SUM) ?? availableStatistics[0];
+	if (!selectedStatistic) return null;
+	const formatStatistic = (item) => {
+		const localeKey = functionDisplayNames[item.name] || item.name;
+		return `${localeService.t(localeKey)}: ${formatNumber(item)}`;
 	};
-	const { showList, show } = useStatistics(items, statusBarService, isSingle);
-	const handleResize = debounce(() => {
-		const newSingleState = window.innerWidth < SINGLE_MODE_WIDTH;
-		if (isSingle !== newSingleState) setIsSingle(newSingleState);
-	}, 100);
-	useEffect(() => {
-		window.addEventListener("resize", handleResize);
-		return () => {
-			window.removeEventListener("resize", handleResize);
-		};
-	}, [isSingle]);
-	const getStatisticLayout = (showList, rowCountThreshold, CopyableStatisticItem) => {
-		if (showList.length > rowCountThreshold) return showList.reduce((acc, _, index) => {
-			if (index % 2 === 0) acc.push(showList.slice(index, index + 2));
-			return acc;
-		}, []).map((item, index) => /* @__PURE__ */ jsxs("div", {
-			className: "univer-grid univer-h-full univer-items-center",
-			children: [item[0] && /* @__PURE__ */ jsx(CopyableStatisticItem, { ...item[0] }, item[0].name), item[1] && /* @__PURE__ */ jsx(CopyableStatisticItem, { ...item[1] }, item[1].name)]
-		}, `stat-col-${index}`));
-		return showList.map((item) => /* @__PURE__ */ jsx("div", {
-			className: "univer-grid univer-h-full univer-items-center",
-			children: /* @__PURE__ */ jsx(CopyableStatisticItem, { ...item })
-		}, item.name));
+	const handleSelect = (name) => {
+		setSelectedFunction(name);
+		setOpen(false);
 	};
-	const renderContent = getStatisticLayout(showList, ROW_COUNT_THRESHOLD, CopyableStatisticItem);
-	return show && /* @__PURE__ */ jsx("div", {
-		className: clsx("univer-relative univer-box-border univer-flex univer-h-full univer-items-center univer-overflow-hidden univer-px-2 after:univer-absolute after:univer-right-0 after:univer-top-1/2 after:univer-block after:univer-h-4 after:univer-w-px after:-univer-translate-y-1/2 after:univer-bg-gray-200 after:univer-content-[\"\"]", {
-			"univer-max-w-32": isSingle,
-			"univer-max-w-fit": !isSingle
-		}),
-		children: /* @__PURE__ */ jsx("div", {
-			className: "univer-flex univer-h-full univer-gap-x-2",
-			children: renderContent
+	return /* @__PURE__ */ jsx("div", {
+		className: "univer-relative univer-box-border univer-flex univer-h-full univer-min-w-0 univer-max-w-64 univer-items-center univer-overflow-hidden univer-px-2 after:univer-absolute after:univer-right-0 after:univer-top-1/2 after:univer-block after:univer-h-4 after:univer-w-px after:-univer-translate-y-1/2 after:univer-bg-gray-200 after:univer-content-[\"\"]",
+		children: /* @__PURE__ */ jsx(Dropdown, {
+			align: "end",
+			side: "top",
+			open,
+			onOpenChange: setOpen,
+			overlay: /* @__PURE__ */ jsx("div", {
+				"data-u-comp": "status-bar-statistic-menu",
+				className: "univer-grid univer-w-max univer-max-w-[calc(100vw-16px)] univer-gap-0.5 univer-p-1.5",
+				children: availableStatistics.map((item) => {
+					const text = formatStatistic(item);
+					const selected = item.name === selectedStatistic.name;
+					return /* @__PURE__ */ jsxs("button", {
+						type: "button",
+						className: clsx("univer-flex univer-cursor-pointer univer-items-center univer-gap-2 univer-rounded univer-border-none univer-bg-transparent univer-px-2 univer-py-1.5 univer-text-left univer-text-xs univer-text-gray-900 hover:univer-bg-gray-100 dark:!univer-text-gray-200 dark:hover:!univer-bg-gray-800", { "univer-bg-gray-100 dark:!univer-bg-gray-800": selected }),
+						"aria-pressed": selected,
+						onClick: () => handleSelect(item.name),
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "univer-w-3 univer-shrink-0",
+							children: selected && /* @__PURE__ */ jsx(CheckMarkIcon, {})
+						}), /* @__PURE__ */ jsx(Tooltip, {
+							title: text,
+							placement: "top",
+							children: /* @__PURE__ */ jsx("span", {
+								className: "univer-min-w-0 univer-flex-1 univer-truncate",
+								children: text
+							})
+						})]
+					}, item.name);
+				})
+			}),
+			children: /* @__PURE__ */ jsxs("button", {
+				type: "button",
+				"data-u-comp": "status-bar-statistic-picker",
+				className: "univer-flex univer-min-w-0 univer-max-w-full univer-cursor-pointer univer-items-center univer-gap-1 univer-border-none univer-bg-transparent univer-p-0 univer-text-xs univer-text-gray-400",
+				children: [/* @__PURE__ */ jsx(Tooltip, {
+					title: formatStatistic(selectedStatistic),
+					placement: "top",
+					children: /* @__PURE__ */ jsx("span", {
+						className: "univer-min-w-0 univer-flex-1 univer-truncate",
+						children: formatStatistic(selectedStatistic)
+					})
+				}), /* @__PURE__ */ jsx(MoreDownIcon, { className: "univer-shrink-0" })]
+			})
 		})
 	});
 };
@@ -23282,9 +23122,7 @@ function RenderSheetFooter() {
 	const config = useConfigValue(SHEETS_UI_PLUGIN_CONFIG_KEY);
 	const menuManagerService = useDependency(IMenuManagerService);
 	const showFooter = (config === null || config === void 0 ? void 0 : config.footer) ?? true;
-	const activeWorkbook = useActiveWorkbook();
-	const workbook = useSheetLoadingWorkbook() ?? activeWorkbook;
-	const isLoading = useSheetLoading();
+	const workbook = useRootWorkbenchWorkbook();
 	const activeWorkbookEmbeddedRender = useActiveWorkbookIsEmbeddedRender(workbook);
 	const focusedUnitType = useFocusedUnitType();
 	const activeEmbedTab = useActiveSheetEmbedTabData(workbook);
@@ -23297,33 +23135,27 @@ function RenderSheetFooter() {
 	const showMenus = activeEmbedTab ? false : menus;
 	const showZoomSlider = activeEmbedTab ? false : zoomSlider;
 	if (!sheetBar && !showStatisticBar && !showMenus && !showZoomSlider) return null;
-	return /* @__PURE__ */ jsx(SheetLoadingWorkbookContext.Provider, {
-		value: workbook,
-		children: /* @__PURE__ */ jsxs("section", {
-			className: clsx("univer-box-border univer-grid univer-w-full univer-grid-flow-col univer-grid-cols-[1fr,auto,auto,auto] univer-items-center univer-justify-between univer-bg-white univer-px-5 univer-text-gray-900 dark:!univer-bg-gray-900 dark:!univer-text-gray-200", { "univer-pointer-events-none": isLoading }),
-			"data-range-selector": true,
-			"aria-disabled": isLoading,
-			style: { height: 36 },
-			children: [
-				sheetBar && /* @__PURE__ */ jsx(SheetBar, {}),
-				showStatisticBar && /* @__PURE__ */ jsx(StatusBar, {}),
-				showMenus && footerMenus.length > 0 && /* @__PURE__ */ jsx("div", {
-					className: "univer-box-border univer-flex univer-gap-2 univer-px-2",
-					children: footerMenus.map((item) => {
-						var _item$children;
-						return (_item$children = item.children) === null || _item$children === void 0 ? void 0 : _item$children.map((child) => (child === null || child === void 0 ? void 0 : child.item) && /* @__PURE__ */ jsx(ToolbarItem, { ...child.item }, child.key));
-					})
-				}),
-				showZoomSlider && /* @__PURE__ */ jsx(SheetZoomSlider, {})
-			]
-		})
+	return /* @__PURE__ */ jsxs("section", {
+		className: "univer-box-border univer-grid univer-w-full univer-grid-flow-col univer-grid-cols-[1fr,auto,auto,auto] univer-items-center univer-justify-between univer-bg-gray-0 univer-px-5 univer-text-gray-900 dark:!univer-bg-gray-900 dark:!univer-text-gray-200",
+		"data-range-selector": true,
+		style: { height: 36 },
+		children: [
+			sheetBar && /* @__PURE__ */ jsx(SheetBar, {}),
+			showStatisticBar && /* @__PURE__ */ jsx(StatusBar, {}),
+			showMenus && footerMenus.length > 0 && /* @__PURE__ */ jsx("div", {
+				className: "univer-box-border univer-flex univer-gap-2 univer-px-2",
+				children: footerMenus.map((item) => {
+					var _item$children;
+					return (_item$children = item.children) === null || _item$children === void 0 ? void 0 : _item$children.map((child) => (child === null || child === void 0 ? void 0 : child.item) && /* @__PURE__ */ jsx(ToolbarItem, { ...child.item }, child.key));
+				})
+			}),
+			showZoomSlider && /* @__PURE__ */ jsx(SheetZoomSlider, {})
+		]
 	});
 }
 function RenderSheetHeader() {
 	const config = useConfigValue(SHEETS_UI_PLUGIN_CONFIG_KEY);
-	const activeWorkbook = useActiveWorkbook();
-	const workbook = useSheetLoadingWorkbook() ?? activeWorkbook;
-	const isLoading = useSheetLoading();
+	const workbook = useRootWorkbenchWorkbook();
 	const hasWorkbook = !!workbook;
 	const activeWorkbookEmbeddedRender = useActiveWorkbookIsEmbeddedRender(workbook);
 	const focusedUnitType = useFocusedUnitType();
@@ -23333,17 +23165,10 @@ function RenderSheetHeader() {
 	if (activeEmbedTab) return null;
 	if (focusedUnitType != null && focusedUnitType !== UniverInstanceType.UNIVER_SHEET) return /* @__PURE__ */ jsx("div", {
 		"aria-hidden": true,
-		className: "univer-h-7 univer-border-b univer-border-gray-200 univer-bg-white dark:!univer-border-gray-700 dark:!univer-bg-gray-900",
+		className: "univer-h-7 univer-border-b univer-border-gray-200 univer-bg-gray-0 dark:!univer-border-gray-700 dark:!univer-bg-gray-900",
 		"data-u-comp": "formula-bar-placeholder"
 	});
-	if ((config === null || config === void 0 ? void 0 : config.formulaBar) !== false) return /* @__PURE__ */ jsx(SheetLoadingWorkbookContext.Provider, {
-		value: workbook,
-		children: /* @__PURE__ */ jsx("div", {
-			"aria-disabled": isLoading,
-			className: clsx({ "univer-pointer-events-none": isLoading }),
-			children: /* @__PURE__ */ jsx(FormulaBar, {})
-		})
-	});
+	if ((config === null || config === void 0 ? void 0 : config.formulaBar) !== false) return /* @__PURE__ */ jsx(FormulaBar, {});
 	return null;
 }
 /**
@@ -23351,18 +23176,17 @@ function RenderSheetHeader() {
 */
 function RenderSheetContent() {
 	const config = useConfigValue(SHEETS_UI_PLUGIN_CONFIG_KEY);
-	const isLoading = useSheetLoading();
-	const isPreviewReady = useSheetLoadingPreviewReady();
 	const componentManager = useDependency(ComponentManager);
-	const activeWorkbook = useActiveWorkbook();
-	const workbook = useSheetLoadingWorkbook() ?? activeWorkbook;
+	const workbook = useRootWorkbenchWorkbook();
 	const activeEmbedTab = useActiveSheetEmbedTabData(workbook);
 	const injector = useDependency(Injector);
 	const activeWorkbookEmbeddedRender = useActiveWorkbookIsEmbeddedRender(workbook);
+	const focusedUnitType = useFocusedUnitType();
+	const rootWorkbenchOwnsSheet = activeEmbedTab != null || focusedUnitType == null || focusedUnitType === UniverInstanceType.UNIVER_SHEET;
 	const ShapeTextEditorContainer = componentManager.get("SheetShapeTextEditorContainer") ?? componentManager.get("ShapeTextEditorContainer");
 	useEffect(() => {
 		var _tryGetSheetEmbedRunt;
-		if (!workbook || isLoading || activeEmbedTab || activeWorkbookEmbeddedRender) return;
+		if (!workbook || activeEmbedTab || activeWorkbookEmbeddedRender || !rootWorkbenchOwnsSheet) return;
 		const instanceService = injector.get(IUniverInstanceService);
 		instanceService.setCurrentUnitForType(workbook.getUnitId());
 		instanceService.focusUnit(workbook.getUnitId());
@@ -23371,11 +23195,11 @@ function RenderSheetContent() {
 		activeEmbedTab,
 		activeWorkbookEmbeddedRender,
 		injector,
-		isLoading,
+		rootWorkbenchOwnsSheet,
 		workbook
 	]);
 	if (!workbook) return null;
-	if (isLoading) return isPreviewReady ? null : /* @__PURE__ */ jsx(SheetLoadingSkeleton, {});
+	if (!rootWorkbenchOwnsSheet) return null;
 	if (activeWorkbookEmbeddedRender) return null;
 	if (activeEmbedTab && workbook) return /* @__PURE__ */ jsx(RenderSheetEmbedTabHost, {
 		workbook,
@@ -23387,42 +23211,6 @@ function RenderSheetContent() {
 		/* @__PURE__ */ jsx(AutoFillPopupMenu, {})
 	] });
 }
-function SheetLoadingSkeleton() {
-	return /* @__PURE__ */ jsxs("div", {
-		"data-u-comp": "sheet-loading-skeleton",
-		"aria-busy": true,
-		className: "univer-absolute univer-inset-0 univer-z-10 univer-overflow-hidden univer-bg-white dark:!univer-bg-gray-900",
-		children: [
-			/* @__PURE__ */ jsx("div", {
-				className: "univer-absolute univer-right-0 univer-top-0 univer-border-b univer-border-gray-200 univer-bg-gray-50 dark:!univer-border-gray-700 dark:!univer-bg-gray-800",
-				style: {
-					left: DEFAULT_WORKSHEET_ROW_TITLE_WIDTH,
-					height: DEFAULT_WORKSHEET_COLUMN_TITLE_HEIGHT
-				}
-			}),
-			/* @__PURE__ */ jsx("div", {
-				className: "univer-absolute univer-bottom-0 univer-left-0 univer-border-r univer-border-gray-200 univer-bg-gray-50 dark:!univer-border-gray-700 dark:!univer-bg-gray-800",
-				style: {
-					top: DEFAULT_WORKSHEET_COLUMN_TITLE_HEIGHT,
-					width: DEFAULT_WORKSHEET_ROW_TITLE_WIDTH
-				}
-			}),
-			/* @__PURE__ */ jsx("div", {
-				className: "univer-absolute univer-bottom-0 univer-right-0 univer-animate-pulse univer-text-gray-200 dark:!univer-text-gray-700",
-				style: {
-					top: DEFAULT_WORKSHEET_COLUMN_TITLE_HEIGHT,
-					left: DEFAULT_WORKSHEET_ROW_TITLE_WIDTH,
-					backgroundImage: "linear-gradient(to right, currentColor 1px, transparent 1px), linear-gradient(to bottom, currentColor 1px, transparent 1px)",
-					backgroundSize: `${DEFAULT_WORKSHEET_COLUMN_WIDTH}px ${DEFAULT_WORKSHEET_ROW_HEIGHT}px`
-				}
-			}),
-			/* @__PURE__ */ jsx(LoadingMultiIcon, {
-				"aria-hidden": true,
-				className: "univer-absolute univer-left-1/2 univer-top-1/2 univer-size-6 -univer-translate-x-1/2 -univer-translate-y-1/2 univer-animate-spin univer-text-violet-500"
-			})
-		]
-	});
-}
 function RenderSheetEmbedTabHost(props) {
 	const { workbook, worksheet } = props;
 	const injector = useDependency(Injector);
@@ -23454,16 +23242,42 @@ function RenderSheetEmbedTabHost(props) {
 	]);
 	return /* @__PURE__ */ jsx("div", {
 		"data-embed-sheets-sheet-tab-host": hostAnchorId,
-		className: "univer-absolute univer-inset-0 univer-z-40 univer-bg-white dark:!univer-bg-gray-900"
+		className: "univer-absolute univer-inset-0 univer-z-40 univer-bg-gray-0 dark:!univer-bg-gray-900"
 	});
 }
 function useActiveWorkbookIsEmbeddedRender(workbook) {
 	const univerInstanceService = useDependency(IUniverInstanceService);
+	const renderManagerService = useDependency(IRenderManagerService);
+	const injector = useDependency(Injector);
+	const runtimeFocusCoordinator = injector.has(ISheetEmbedRuntimeFocusCoordinator) ? injector.get(ISheetEmbedRuntimeFocusCoordinator) : void 0;
 	return useMemo(() => {
-		var _univerInstanceServic;
+		var _renderManagerService, _univerInstanceServic;
 		if (!workbook) return false;
-		return ((_univerInstanceServic = univerInstanceService.getUnitCreateOptions(workbook.getUnitId())) === null || _univerInstanceServic === void 0 ? void 0 : _univerInstanceServic.embeddedRender) === true;
-	}, [univerInstanceService, workbook]);
+		return (runtimeFocusCoordinator === null || runtimeFocusCoordinator === void 0 ? void 0 : runtimeFocusCoordinator.resolveRuntimeScopeByChildUnitId(workbook.getUnitId())) != null || ((_renderManagerService = renderManagerService.getRenderUnitById(workbook.getUnitId())) === null || _renderManagerService === void 0 ? void 0 : _renderManagerService.isMainScene) === false || ((_univerInstanceServic = univerInstanceService.getUnitCreateOptions(workbook.getUnitId())) === null || _univerInstanceServic === void 0 ? void 0 : _univerInstanceServic.embeddedRender) === true;
+	}, [
+		useObservable(() => merge$1(renderManagerService.created$, renderManagerService.disposed$, (runtimeFocusCoordinator === null || runtimeFocusCoordinator === void 0 ? void 0 : runtimeFocusCoordinator.runtimeSessionChanged$) ?? EMPTY), null, false, [renderManagerService, runtimeFocusCoordinator]),
+		renderManagerService,
+		runtimeFocusCoordinator,
+		univerInstanceService,
+		workbook
+	]);
+}
+function useRootWorkbenchWorkbook() {
+	const activeWorkbook = useActiveWorkbook();
+	const injector = useDependency(Injector);
+	const instanceService = useDependency(IUniverInstanceService);
+	const runtimeFocusCoordinator = injector.has(ISheetEmbedRuntimeFocusCoordinator) ? injector.get(ISheetEmbedRuntimeFocusCoordinator) : void 0;
+	return useMemo(() => {
+		if (!activeWorkbook || !runtimeFocusCoordinator) return activeWorkbook;
+		const runtimeScope = runtimeFocusCoordinator.resolveRuntimeScopeByChildUnitId(activeWorkbook.getUnitId());
+		if (!(runtimeScope === null || runtimeScope === void 0 ? void 0 : runtimeScope.hostUnitId)) return activeWorkbook;
+		return instanceService.getUnit(runtimeScope.hostUnitId, UniverInstanceType.UNIVER_SHEET) ?? activeWorkbook;
+	}, [
+		activeWorkbook,
+		instanceService,
+		runtimeFocusCoordinator,
+		useObservable(() => (runtimeFocusCoordinator === null || runtimeFocusCoordinator === void 0 ? void 0 : runtimeFocusCoordinator.runtimeSessionChanged$) ?? EMPTY, null, false, [runtimeFocusCoordinator])
+	]);
 }
 function useFocusedUnitType() {
 	const univerInstanceService = useDependency(IUniverInstanceService);
@@ -24098,7 +23912,7 @@ const useHighlightRange = (ranges = []) => {
 //#endregion
 //#region package.json
 var name = "@univerjs/sheets-ui";
-var version = "1.0.0-beta.0";
+var version = "1.0.0-beta.1";
 
 //#endregion
 //#region src/views/cell-popup/config.ts
@@ -24268,6 +24082,8 @@ let SheetCanvasPopManagerService = class SheetCanvasPopManagerService extends Di
 		disposable.add(this._commandService.onCommandExecuted((commandInfo) => {
 			if (shouldUpdatePosition(commandInfo.id)) position$.next(calc());
 		}));
+		const viewMain = currentRender.scene.getViewport(SHEET_VIEWPORT_KEY.VIEW_MAIN);
+		if (viewMain) disposable.add(viewMain.onScrollAfter$.subscribeEvent(() => position$.next(calc())));
 		return {
 			position,
 			position$,
@@ -24314,6 +24130,9 @@ let SheetCanvasPopManagerService = class SheetCanvasPopManagerService extends Di
 		};
 		const { position, position$, disposable } = this._createPositionObserver(bound, currentRender, skeleton, worksheet);
 		const popupInjector = this._resolveEmbeddedPopupInjector(unitId, currentRender);
+		const canvasElement = currentRender.engine.getCanvasElement();
+		const scaleAdjust = canvasElement.getBoundingClientRect().width / pxToNum(canvasElement.style.width);
+		const { scaleX, scaleY } = currentRender.scene.getAncestorScale();
 		const id = this._globalPopupManagerService.addPopup({
 			...popup,
 			unitId,
@@ -24321,7 +24140,11 @@ let SheetCanvasPopManagerService = class SheetCanvasPopManagerService extends Di
 			connectorInjector: popupInjector,
 			anchorRect: position,
 			anchorRect$: position$,
-			canvasElement: currentRender.engine.getCanvasElement()
+			canvasElement,
+			boundaryInsets: popup.constrainToCanvas ? {
+				left: skeleton.rowHeaderWidth * scaleAdjust * scaleX,
+				top: skeleton.columnHeaderHeight * scaleAdjust * scaleY
+			} : popup.boundaryInsets
 		});
 		const disposableCollection = new DisposableCollection();
 		disposableCollection.add(disposable);
@@ -24734,6 +24557,11 @@ function shouldUpdatePosition(commandId) {
 
 //#endregion
 //#region src/services/cell-popup-manager.service.ts
+const CELL_POPUP_DIRECTIONS = [
+	"horizontal",
+	"vertical",
+	"left-center"
+];
 let CellPopupManagerService = class CellPopupManagerService extends Disposable {
 	constructor(_sheetCanvasPopManagerService) {
 		super();
@@ -24789,7 +24617,7 @@ let CellPopupManagerService = class CellPopupManagerService extends Disposable {
 					direction
 				},
 				noPushMinimumGap: true,
-				autoRelayout: false,
+				autoRelayout: popup.autoRelayout ?? false,
 				zIndex: 90
 			}, unitId, subUnitId);
 			subUnitMap.setValue(row, col, {
@@ -24817,31 +24645,21 @@ let CellPopupManagerService = class CellPopupManagerService extends Disposable {
 		const subUnitMap = this._ensureCellPopupMap(unitId, subUnitId);
 		const cache = subUnitMap.getValue(row, col);
 		if (!cache) return;
-		if (cache.horizontal) {
-			var _cache$horizontal$dis;
-			(_cache$horizontal$dis = cache.horizontal.disposable) === null || _cache$horizontal$dis === void 0 || _cache$horizontal$dis.dispose();
-			cache.horizontal = void 0;
-			this._change$.next({
-				unitId,
-				subUnitId,
-				row,
-				col,
-				direction: "horizontal"
-			});
-		}
-		if (cache.vertical) {
-			var _cache$vertical$dispo;
-			(_cache$vertical$dispo = cache.vertical.disposable) === null || _cache$vertical$dispo === void 0 || _cache$vertical$dispo.dispose();
-			cache.vertical = void 0;
+		CELL_POPUP_DIRECTIONS.forEach((direction) => {
+			var _directionCache$dispo2;
+			const directionCache = cache[direction];
+			if (!directionCache) return;
+			(_directionCache$dispo2 = directionCache.disposable) === null || _directionCache$dispo2 === void 0 || _directionCache$dispo2.dispose();
+			cache[direction] = void 0;
 			this._change$.next({
 				unitId,
 				subUnitId,
 				row,
 				col,
-				direction: "vertical"
+				direction
 			});
-		}
-		if (!cache.horizontal && !cache.vertical) subUnitMap.realDeleteValue(row, col);
+		});
+		if (CELL_POPUP_DIRECTIONS.every((direction) => !cache[direction])) subUnitMap.realDeleteValue(row, col);
 	}
 	hidePopupsForUnit(unitId, subUnitId) {
 		const unitMap = this._cellPopupMap.get(unitId);
@@ -25560,12 +25378,12 @@ function BorderPanel(props) {
 						})
 					}),
 					children: /* @__PURE__ */ jsxs("button", {
-						className: "univer-flex univer-cursor-pointer univer-items-center univer-gap-2 univer-rounded univer-border-none univer-bg-transparent univer-p-1 hover:univer-bg-gray-100 dark:hover:!univer-bg-gray-700",
+						className: "univer-flex univer-cursor-pointer univer-items-center univer-gap-2 univer-rounded univer-border-none univer-bg-transparent univer-p-1 univer-text-gray-900 hover:univer-bg-gray-100 dark:hover:!univer-bg-gray-700",
 						type: "button",
 						children: [/* @__PURE__ */ jsx(PaintBucketDoubleIcon, {
-							className: "univer-fill-primary-600 dark:!univer-text-white",
+							className: "univer-fill-primary-600 dark:!univer-text-gray-0",
 							extend: { colorChannel1: (value === null || value === void 0 ? void 0 : value.color) ?? "" }
-						}), /* @__PURE__ */ jsx(MoreDownIcon, { className: "dark:!univer-text-white" })]
+						}), /* @__PURE__ */ jsx(MoreDownIcon, { className: "dark:!univer-text-gray-0" })]
 					})
 				}) }), /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Dropdown, {
 					overlay: /* @__PURE__ */ jsx("section", {
@@ -25576,19 +25394,19 @@ function BorderPanel(props) {
 								className: "univer-flex univer-cursor-pointer univer-items-center univer-justify-center univer-rounded univer-px-1 univer-py-3 hover:univer-bg-gray-100 dark:hover:!univer-bg-gray-700",
 								onClick: () => handleClick(item.value, "style"),
 								children: [item.value === type && /* @__PURE__ */ jsx(CheckMarkIcon, { className: "univer-absolute univer-left-3 univer-text-primary-600" }), /* @__PURE__ */ jsx(BorderLine, {
-									className: "univer-ml-6 univer-fill-gray-900 dark:!univer-fill-white",
+									className: "univer-ml-6 univer-fill-gray-900 dark:!univer-fill-gray-0",
 									type: item.value
 								})]
 							}, item.value))
 						})
 					}),
 					children: /* @__PURE__ */ jsxs("button", {
-						className: "univer-flex univer-cursor-pointer univer-items-center univer-gap-2 univer-rounded univer-border-none univer-bg-transparent univer-p-1 hover:univer-bg-gray-100 dark:hover:!univer-bg-gray-700",
+						className: "univer-flex univer-cursor-pointer univer-items-center univer-gap-2 univer-rounded univer-border-none univer-bg-transparent univer-p-1 univer-text-gray-900 hover:univer-bg-gray-100 dark:hover:!univer-bg-gray-700",
 						type: "button",
 						children: [/* @__PURE__ */ jsx(BorderLine, {
-							className: "univer-fill-gray-900 dark:!univer-fill-white",
+							className: "univer-fill-gray-900 dark:!univer-fill-gray-0",
 							type: type ?? BorderStyleTypes.THIN
-						}), /* @__PURE__ */ jsx(MoreDownIcon, { className: "dark:!univer-text-white" })]
+						}), /* @__PURE__ */ jsx(MoreDownIcon, { className: "dark:!univer-text-gray-0" })]
 					})
 				}) })]
 			})
@@ -25620,6 +25438,7 @@ let CellAlertManagerService = class CellAlertManagerService extends Disposable {
 		});
 	}
 	showAlert(alert) {
+		var _alert$menu, _alert$menu2, _alert$menu3;
 		let lastPopup = this._currentAlert.get(alert.key);
 		if (lastPopup) lastPopup.dispose.dispose();
 		if (lastPopup) lastPopup.dispose.dispose();
@@ -25640,7 +25459,9 @@ let CellAlertManagerService = class CellAlertManagerService extends Disposable {
 			col
 		}, {
 			componentKey: CELL_ALERT_KEY,
-			direction: "horizontal",
+			direction: ((_alert$menu = alert.menu) === null || _alert$menu === void 0 ? void 0 : _alert$menu.length) ? "left-center" : "horizontal",
+			autoRelayout: Boolean((_alert$menu2 = alert.menu) === null || _alert$menu2 === void 0 ? void 0 : _alert$menu2.length),
+			showOnSelectionMoving: Boolean((_alert$menu3 = alert.menu) === null || _alert$menu3 === void 0 ? void 0 : _alert$menu3.length),
 			extraProps: { alert },
 			priority: 1
 		});
@@ -25680,18 +25501,53 @@ CellAlertManagerService = __decorate([__decorateParam(0, IRenderManagerService),
 */
 function CellAlert({ popup }) {
 	var _popup$extraProps;
+	const [visible, setVisible] = useState(false);
+	const [isHovered, setIsHovered] = useState(false);
 	const alert = (_popup$extraProps = popup.extraProps) === null || _popup$extraProps === void 0 ? void 0 : _popup$extraProps.alert;
 	if (!alert) return null;
-	const { type, title, message } = alert;
+	const { type, title, message, menu } = alert;
+	if (menu === null || menu === void 0 ? void 0 : menu.length) {
+		const accessibleLabel = [title, message].filter((value) => typeof value === "string").join(": ");
+		const showMore = visible || isHovered;
+		return /* @__PURE__ */ jsx("div", {
+			onMouseEnter: () => setIsHovered(true),
+			onMouseLeave: () => setIsHovered(false),
+			children: /* @__PURE__ */ jsx(DropdownMenu, {
+				align: "start",
+				open: visible,
+				onOpenChange: setVisible,
+				items: [
+					{
+						type: "custom",
+						className: "univer-px-2 univer-py-1.5 univer-font-medium univer-text-gray-900 dark:!univer-text-gray-0",
+						children: message
+					},
+					{ type: "separator" },
+					...menu.map((item) => ({
+						type: "item",
+						children: item.label,
+						disabled: item.disabled,
+						onSelect: item.onSelect
+					}))
+				],
+				children: /* @__PURE__ */ jsxs("button", {
+					type: "button",
+					"aria-label": accessibleLabel || void 0,
+					className: "univer-flex univer-items-center univer-gap-1 univer-rounded univer-border univer-border-solid univer-border-gray-200 univer-bg-gray-0 univer-p-1 univer-shadow hover:univer-bg-gray-100 dark:!univer-border-gray-600 dark:!univer-bg-gray-900 dark:hover:!univer-bg-gray-800",
+					children: [/* @__PURE__ */ jsx(WarningIcon, { className: "univer-text-yellow-500" }), showMore && /* @__PURE__ */ jsx(MoreDownIcon, { className: "univer-text-gray-600 dark:!univer-text-gray-300" })]
+				})
+			})
+		});
+	}
 	const iconMap = {
-		[2]: /* @__PURE__ */ jsx(ErrorIcon, { className: "univer-mr-1.5 univer-text-red-500" }),
-		[0]: /* @__PURE__ */ jsx(InfoIcon, { className: "univer-mr-1.5 univer-text-blue-500" }),
-		[1]: /* @__PURE__ */ jsx(WarningIcon, { className: "univer-mr-1.5 univer-text-yellow-500" })
+		[2]: /* @__PURE__ */ jsx(ErrorIcon, { className: "univer-text-red-500" }),
+		[0]: /* @__PURE__ */ jsx(InfoIcon, { className: "univer-text-blue-500" }),
+		[1]: /* @__PURE__ */ jsx(WarningIcon, { className: "univer-text-yellow-500" })
 	};
 	return /* @__PURE__ */ jsxs("div", {
-		className: "univer-z-[100] univer-box-border univer-w-[156px] univer-rounded-lg univer-bg-white univer-px-2 univer-py-1 univer-text-gray-900 univer-shadow dark:!univer-bg-black dark:!univer-text-white",
+		className: "univer-z-[100] univer-box-border univer-w-[156px] univer-rounded-lg univer-bg-gray-0 univer-px-2 univer-py-1 univer-text-gray-900 univer-shadow dark:!univer-bg-gray-1000 dark:!univer-text-gray-0",
 		children: [/* @__PURE__ */ jsxs("div", {
-			className: "univer-mb-1.5 univer-flex univer-h-5 univer-flex-row univer-items-center univer-text-sm univer-font-medium",
+			className: "univer-mb-1.5 univer-flex univer-h-5 univer-flex-row univer-items-center univer-gap-x-1.5 univer-text-sm univer-font-medium",
 			children: [type ? iconMap[type] : null, title]
 		}), /* @__PURE__ */ jsx("div", {
 			className: "univer-text-sm",
@@ -25721,7 +25577,10 @@ const CellPopup = (props) => {
 	const componentManager = useDependency(ComponentManager);
 	return /* @__PURE__ */ jsx("div", {
 		"data-u-comp": "sheets-ui-cell-popup",
-		className: "univer-ml-px univer-flex univer-flex-col",
+		className: `
+              ${direction === "left-center" ? "univer-mr-px" : "univer-ml-px"}
+              univer-flex univer-flex-col
+            `,
 		children: popups.map((popup) => {
 			const Component = componentManager.get(popup.componentKey);
 			return Component ? /* @__PURE__ */ jsx(Component, { popup }, popup.id ?? popup.componentKey) : null;
@@ -25863,7 +25722,7 @@ function DefinedNameInputContent(props) {
 					className: "univer-relative univer-h-8 univer-select-none",
 					children: /* @__PURE__ */ jsx(FormulaEditor, {
 						ref: formulaEditorRef,
-						className: clsx("univer-box-border univer-h-8 univer-w-full univer-cursor-pointer univer-items-center univer-rounded-lg univer-bg-white univer-pt-2 univer-transition-colors hover:univer-border-primary-600 dark:!univer-bg-gray-700 dark:!univer-text-white [&>div:first-child]:univer-px-2.5 [&>div]:univer-h-5 [&>div]:univer-ring-transparent", borderClassName),
+						className: clsx("univer-box-border univer-h-8 univer-w-full univer-cursor-pointer univer-items-center univer-rounded-lg univer-bg-gray-0 univer-pt-2 univer-transition-colors hover:univer-border-primary-600 dark:!univer-bg-gray-700 dark:!univer-text-gray-0 [&>div:first-child]:univer-px-2.5 [&>div]:univer-h-5 [&>div]:univer-ring-transparent", borderClassName),
 						initValue: formulaOrRefStringValue,
 						unitId,
 						subUnitId,
@@ -26099,7 +25958,7 @@ const DefinedNameContainer = () => {
 								children: [/* @__PURE__ */ jsxs("div", {
 									title: definedName.comment,
 									children: [/* @__PURE__ */ jsxs("div", {
-										className: "univer-my-1 univer-max-h-[100px] univer-max-w-[190px] univer-truncate univer-text-sm univer-font-medium univer-text-gray-900 dark:!univer-text-white",
+										className: "univer-my-1 univer-max-h-[100px] univer-max-w-[190px] univer-truncate univer-text-sm univer-font-medium univer-text-gray-900 dark:!univer-text-gray-0",
 										children: [definedName.name, /* @__PURE__ */ jsx("span", {
 											className: "univer-text-xxs univer-ml-1 univer-text-gray-400",
 											children: definedName.localSheetId === SCOPE_WORKBOOK_VALUE_DEFINED_NAME || definedName.localSheetId == null ? "" : getSheetNameBySheetId(definedName.localSheetId)
@@ -26206,7 +26065,7 @@ function DateDropdown(props) {
 		if (await (onChange === null || onChange === void 0 ? void 0 : onChange(date))) hideFn();
 	};
 	return /* @__PURE__ */ jsxs("div", {
-		className: "univer-rounded univer-bg-white univer-p-2 univer-shadow-lg dark:!univer-bg-black",
+		className: "univer-rounded univer-bg-gray-0 univer-p-2 univer-shadow-lg dark:!univer-bg-gray-1000",
 		children: [patternType === "time" ? /* @__PURE__ */ jsx(TimeInput, {
 			value: date.toDate(),
 			onValueChange: (newValue) => {
@@ -26259,6 +26118,8 @@ function getListDropdownValue(value, multiple) {
 function SelectList(props) {
 	const { value, onChange, multiple, options, onEdit, style, location, showEdit: showEditOnDropdown, showSearch: showSearchOnDropdown } = props;
 	const localeService = useDependency(LocaleService);
+	const themeService = useDependency(ThemeService);
+	useObservable(themeService.currentTheme$);
 	const { row, col, unitId, subUnitId } = location;
 	const searchRef = useRef(null);
 	useEffect(() => {
@@ -26297,14 +26158,14 @@ function SelectList(props) {
 	]);
 	return /* @__PURE__ */ jsxs("div", {
 		"data-u-comp": "sheets-dropdown-list",
-		className: clsx("univer-box-border univer-rounded-lg univer-bg-white univer-py-1 univer-text-gray-900 univer-shadow dark:!univer-bg-black dark:!univer-text-white", borderClassName),
+		className: clsx("univer-box-border univer-rounded-lg univer-bg-gray-0 univer-py-1 univer-text-gray-900 univer-shadow dark:!univer-bg-gray-1000 dark:!univer-text-gray-0", borderClassName),
 		style,
 		children: [
 			showSearchOnDropdown && /* @__PURE__ */ jsx("div", {
 				className: "univer-box-border univer-flex univer-w-full univer-px-2",
 				children: /* @__PURE__ */ jsx("input", {
 					ref: searchRef,
-					className: clsx("univer-w-full univer-rounded-md univer-px-2 univer-py-1 univer-text-sm focus:univer-border-primary-500 focus:univer-outline-none dark:!univer-bg-black dark:!univer-text-white", borderClassName),
+					className: clsx("univer-w-full univer-rounded-md univer-bg-gray-0 univer-px-2 univer-py-1 univer-text-sm univer-text-gray-900 focus:univer-border-primary-500 focus:univer-outline-none dark:!univer-bg-gray-1000 dark:!univer-text-gray-0", borderClassName),
 					type: "text",
 					value: lowerFilter,
 					autoFocus: true,
@@ -26318,6 +26179,7 @@ function SelectList(props) {
 			/* @__PURE__ */ jsx("div", {
 				className: clsx("univer-flex univer-max-h-52 univer-flex-col univer-gap-1 univer-overflow-y-auto univer-px-2 univer-py-1", scrollbarClassName),
 				children: filteredOptions.map((item, i) => {
+					var _item$color;
 					const selected = value.indexOf(item.value) > -1;
 					const handleClick = () => {
 						let set;
@@ -26330,16 +26192,18 @@ function SelectList(props) {
 						onChange(newValue);
 					};
 					const index = item.label.toLocaleLowerCase().indexOf(lowerFilter);
-					const isDark = new ColorKit(item.color).isDark();
+					const isThemeColor = Boolean(((_item$color = item.color) === null || _item$color === void 0 ? void 0 : _item$color.includes(".")) && themeService.isValidThemeColor(item.color));
+					const backgroundColor = isThemeColor ? themeService.getColorFromTheme(item.color) : item.color;
+					const isDark = new ColorKit(backgroundColor).isDark();
 					return /* @__PURE__ */ jsxs("div", {
 						className: "univer-flex univer-cursor-pointer univer-flex-row univer-items-center univer-justify-between univer-rounded-md univer-px-1.5 univer-py-1 hover:univer-bg-gray-50 dark:hover:!univer-bg-gray-700",
 						onClick: handleClick,
 						children: [/* @__PURE__ */ jsx("div", {
 							className: clsx("univer-inline-flex univer-h-4 univer-w-fit univer-items-center univer-truncate univer-rounded-full univer-px-1.5 univer-text-xs", {
-								"univer-text-gray-900": !isDark,
-								"univer-text-white": isDark
+								"univer-text-gray-900": isThemeColor || !isDark,
+								"univer-text-gray-0": !isThemeColor && isDark
 							}),
-							style: { background: item.color },
+							style: { background: backgroundColor },
 							children: lowerFilter && item.label.toLowerCase().includes(lowerFilter) ? /* @__PURE__ */ jsxs(Fragment, { children: [
 								/* @__PURE__ */ jsx("span", { children: item.label.substring(0, index) }),
 								/* @__PURE__ */ jsx("span", {
@@ -26409,7 +26273,7 @@ const Spin = ({ loading, children }) => {
 	return /* @__PURE__ */ jsxs("div", {
 		className: "univer-relative univer-size-full",
 		children: [loading && /* @__PURE__ */ jsx("div", {
-			className: "univer-absolute -univer-bottom-0.5 -univer-left-0.5 -univer-right-0.5 -univer-top-0.5 univer-z-10 univer-flex univer-items-center univer-justify-center univer-bg-white univer-backdrop-blur dark:!univer-bg-black",
+			className: "univer-absolute -univer-bottom-0.5 -univer-left-0.5 -univer-right-0.5 -univer-top-0.5 univer-z-10 univer-flex univer-items-center univer-justify-center univer-bg-gray-0 univer-backdrop-blur dark:!univer-bg-gray-1000",
 			children: /* @__PURE__ */ jsx("div", { className: "univer-size-10 univer-animate-spin univer-rounded-full univer-border-4 univer-border-solid univer-border-gray-100 univer-border-t-primary-500" })
 		}), /* @__PURE__ */ jsx("div", {
 			className: loading ? "univer-pointer-events-none univer-blur-sm" : "",
@@ -27017,7 +26881,7 @@ const PermissionDetailUserPart = (props) => {
 									src: (_item$subject2 = item.subject) === null || _item$subject2 === void 0 ? void 0 : _item$subject2.avatar
 								}),
 								/* @__PURE__ */ jsx("span", {
-									className: "univer-ml-1.5 univer-w-[130px] univer-truncate univer-text-gray-900 dark:!univer-text-white",
+									className: "univer-ml-1.5 univer-w-[130px] univer-truncate univer-text-gray-900 dark:!univer-text-gray-0",
 									children: (_item$subject3 = item.subject) === null || _item$subject3 === void 0 ? void 0 : _item$subject3.name
 								}),
 								/* @__PURE__ */ jsx(Select, {
@@ -27384,11 +27248,11 @@ function SheetPermissionPanelListContent() {
 										}) })
 									}),
 									/* @__PURE__ */ jsx("span", {
-										className: "univer-h-4 univer-flex-grow univer-text-xs univer-text-gray-900 dark:!univer-text-white",
+										className: "univer-h-4 univer-flex-grow univer-text-xs univer-text-gray-900 dark:!univer-text-gray-0",
 										children: localeService.t("sheets-ui.permission.panel.created")
 									}),
 									/* @__PURE__ */ jsx("span", {
-										className: "univer-h-4 univer-text-xs univer-text-gray-900 dark:!univer-text-white",
+										className: "univer-h-4 univer-text-xs univer-text-gray-900 dark:!univer-text-gray-0",
 										children: editPermission ? `${localeService.t("sheets-ui.permission.panel.iCanEdit")}` : `${localeService.t("sheets-ui.permission.panel.iCanNotEdit")}`
 									})
 								]
@@ -27396,10 +27260,10 @@ function SheetPermissionPanelListContent() {
 							/* @__PURE__ */ jsxs("div", {
 								className: "univer-mt-2 univer-flex univer-items-center",
 								children: [/* @__PURE__ */ jsx("span", {
-									className: "univer-h-4 univer-flex-grow univer-text-xs univer-text-gray-900 dark:!univer-text-white",
+									className: "univer-h-4 univer-flex-grow univer-text-xs univer-text-gray-900 dark:!univer-text-gray-0",
 									children: localeService.t("sheets-ui.permission.panel.viewPermission")
 								}), /* @__PURE__ */ jsx("span", {
-									className: "univer-h-4 univer-text-xs univer-text-gray-900 dark:!univer-text-white",
+									className: "univer-h-4 univer-text-xs univer-text-gray-900 dark:!univer-text-gray-0",
 									children: viewPermission ? `${localeService.t("sheets-ui.permission.panel.iCanView")}` : `${localeService.t("sheets-ui.permission.panel.iCanNotView")}`
 								})]
 							}),
@@ -27841,7 +27705,7 @@ const formulaEditorStyle = {
 	}
 };
 let EditorDataSyncController = class EditorDataSyncController extends Disposable {
-	constructor(_univerInstanceService, _renderManagerService, _editorBridgeService, _commandService, _rangeProtectionRuleModel, _worksheetProtectionRuleModel, _formulaEditorController, _formulaEditorManagerService, _contextService) {
+	constructor(_univerInstanceService, _renderManagerService, _editorBridgeService, _commandService, _rangeProtectionRuleModel, _worksheetProtectionRuleModel, _formulaEditorController, _formulaEditorManagerService, _contextService, _themeService) {
 		super();
 		this._univerInstanceService = _univerInstanceService;
 		this._renderManagerService = _renderManagerService;
@@ -27852,12 +27716,14 @@ let EditorDataSyncController = class EditorDataSyncController extends Disposable
 		this._formulaEditorController = _formulaEditorController;
 		this._formulaEditorManagerService = _formulaEditorManagerService;
 		this._contextService = _contextService;
+		this._themeService = _themeService;
 		this._initialize();
 	}
 	_initialize() {
 		this._syncFormulaEditorContent();
 		this._commandExecutedListener();
 		this._syncFormulaRefRenderStyleOnFocusChange();
+		this._syncFormulaBarTextColorOnThemeChange();
 	}
 	_getEditorViewModel(unitId) {
 		var _this$_renderManagerS;
@@ -27981,6 +27847,11 @@ let EditorDataSyncController = class EditorDataSyncController extends Disposable
 			this._refreshRenderStyleConfig(DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY);
 		}));
 	}
+	_syncFormulaBarTextColorOnThemeChange() {
+		this.disposeWithMe(this._themeService.currentTheme$.pipe(skip(1)).subscribe(() => {
+			this._refreshRenderStyleConfig(DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY);
+		}));
+	}
 	_refreshRenderStyleConfig(unitId) {
 		var _currentRender$mainCo3;
 		const currentRender = this._renderManagerService.getRenderUnitById(unitId);
@@ -27999,7 +27870,10 @@ let EditorDataSyncController = class EditorDataSyncController extends Disposable
 		const snapshot = documentDataModel.getSnapshot();
 		if (snapshot.id !== DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY && snapshot.id !== DOCS_NORMAL_EDITOR_UNIT_ID_KEY) return;
 		const isFormulaBar = snapshot.id === DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY;
-		if (isFormulaBar) snapshot.documentStyle = formulaEditorStyle;
+		if (isFormulaBar) snapshot.documentStyle = {
+			...formulaEditorStyle,
+			textStyle: { cl: { rgb: this._themeService.getColorFromTheme("gray.900") } }
+		};
 		else snapshot.documentStyle ??= {};
 		let renderConfig = snapshot.documentStyle.renderConfig;
 		if (renderConfig == null) {
@@ -28036,84 +27910,97 @@ EditorDataSyncController = __decorate([
 	__decorateParam(5, Inject(WorksheetProtectionRuleModel)),
 	__decorateParam(6, Inject(FormulaEditorController)),
 	__decorateParam(7, IFormulaEditorManagerService),
-	__decorateParam(8, IContextService)
+	__decorateParam(8, IContextService),
+	__decorateParam(9, Inject(ThemeService))
 ], EditorDataSyncController);
 
 //#endregion
 //#region src/controllers/force-string-alert-render.controller.ts
 const ALERT_KEY = "SHEET_FORCE_STRING_ALERT";
 let ForceStringAlertRenderController = class ForceStringAlertRenderController extends Disposable {
-	constructor(_context, _hoverManagerService, _cellAlertManagerService, _localeService, _configService) {
+	constructor(_context, _selectionManagerService, _cellAlertManagerService, _localeService, _configService, _commandService, _univerInstanceService) {
 		super();
 		this._context = _context;
-		this._hoverManagerService = _hoverManagerService;
+		this._selectionManagerService = _selectionManagerService;
 		this._cellAlertManagerService = _cellAlertManagerService;
 		this._localeService = _localeService;
 		this._configService = _configService;
+		this._commandService = _commandService;
+		this._univerInstanceService = _univerInstanceService;
 		this._init();
 	}
 	_init() {
 		this._initCellAlertPopup();
 	}
 	_initCellAlertPopup() {
-		this.disposeWithMe(this._hoverManagerService.currentCell$.subscribe((cellPos) => {
-			if (cellPos) {
-				const location = cellPos.location;
-				const workbook = this._context.unit;
-				const worksheet = workbook.getActiveSheet();
-				if (!worksheet) return this._hideAlert();
-				const cellData = worksheet.getCell(location.row, location.col);
-				if (!cellData || cellData.v === null || cellData.v === void 0) return this._hideAlert();
-				let numfmtValue;
-				if (cellData === null || cellData === void 0 ? void 0 : cellData.s) {
-					const style = workbook.getStyles().get(cellData.s);
-					if (style === null || style === void 0 ? void 0 : style.n) numfmtValue = style.n;
-				}
-				if (isTextFormat(numfmtValue === null || numfmtValue === void 0 ? void 0 : numfmtValue.pattern)) {
-					this._hideAlert();
-					return;
-				}
-				/**
-				* If the cell type is string or force string, and the value is a pure number or a string that can be converted to a number, show the force string alert.
-				* '123 -> yes
-				* '20% -> yes
-				* '1,234.56 -> yes
-				* 'abc -> no
-				* '2025-09-17 -> no
-				*/
-				if ((cellData.t === CellValueType.FORCE_STRING || cellData.t === CellValueType.STRING) && (isRealNum(cellData.v) || typeof cellData.v === "string" && getNumfmtParseValueFilter(cellData.v))) {
-					var _this$_configService$, _currentAlert$alert;
-					if ((_this$_configService$ = this._configService.getConfig("sheets-ui.config")) === null || _this$_configService$ === void 0 ? void 0 : _this$_configService$.disableForceStringAlert) return;
-					const currentAlert = this._cellAlertManagerService.currentAlert.get(ALERT_KEY);
-					const currentLoc = currentAlert === null || currentAlert === void 0 || (_currentAlert$alert = currentAlert.alert) === null || _currentAlert$alert === void 0 ? void 0 : _currentAlert$alert.location;
-					if (currentLoc && currentLoc.row === cellPos.location.row && currentLoc.col === cellPos.location.col && currentLoc.subUnitId === cellPos.location.subUnitId && currentLoc.unitId === cellPos.location.unitId) {
-						this._hideAlert();
-						return;
-					}
-					this._cellAlertManagerService.showAlert({
-						type: 2,
-						title: this._localeService.t("sheets-ui.info.error"),
-						message: this._localeService.t("sheets-ui.info.forceStringInfo"),
-						location,
-						width: 200,
-						height: 74,
-						key: ALERT_KEY
-					});
-					return;
+		this.disposeWithMe(this._selectionManagerService.selectionChanged$.subscribe((selections) => this._updateAlert(selections)));
+		this.disposeWithMe(this._context.unit.activeSheet$.subscribe(() => this._updateAlert(this._selectionManagerService.getCurrentSelections())));
+		this.disposeWithMe(this._univerInstanceService.getCurrentTypeOfUnit$(UniverInstanceType.UNIVER_SHEET).subscribe(() => this._updateAlert(this._selectionManagerService.getCurrentSelections())));
+	}
+	_isCurrentSheet(worksheet) {
+		const selectionParam = this._selectionManagerService.currentSelectionParam;
+		return Boolean(worksheet && (selectionParam === null || selectionParam === void 0 ? void 0 : selectionParam.unitId) === this._context.unit.getUnitId() && selectionParam.sheetId === worksheet.getSheetId());
+	}
+	_updateAlert(selections) {
+		var _this$_configService$, _cellStyle$n;
+		this._hideAlert();
+		const workbook = this._context.unit;
+		const worksheet = workbook.getActiveSheet();
+		if (!this._isCurrentSheet(worksheet)) return;
+		if ((selections === null || selections === void 0 ? void 0 : selections.length) !== 1) return;
+		if ((_this$_configService$ = this._configService.getConfig("sheets-ui.config")) === null || _this$_configService$ === void 0 ? void 0 : _this$_configService$.disableForceStringAlert) return;
+		const selection = selections[0];
+		const primary = selection.primary;
+		if (!primary) return;
+		const row = primary.actualRow;
+		const col = primary.actualColumn;
+		const cellData = worksheet.getCell(row, col);
+		if (!cellData || cellData.v === null || cellData.v === void 0) return;
+		const cellStyle = workbook.getStyles().get(cellData.s);
+		if (isTextFormat(cellStyle === null || cellStyle === void 0 || (_cellStyle$n = cellStyle.n) === null || _cellStyle$n === void 0 ? void 0 : _cellStyle$n.pattern)) return;
+		if (cellData.t !== CellValueType.FORCE_STRING && cellData.t !== CellValueType.STRING || !isRealNum(cellData.v) && !(typeof cellData.v === "string" && getNumfmtParseValueFilter(cellData.v))) return;
+		const unitId = workbook.getUnitId();
+		const subUnitId = worksheet.getSheetId();
+		const range = { ...selection.range };
+		this._cellAlertManagerService.showAlert({
+			type: 1,
+			title: this._localeService.t("sheets-ui.info.error"),
+			message: this._localeService.t("sheets-ui.info.forceStringInfo"),
+			location: {
+				unitId,
+				subUnitId,
+				row,
+				col
+			},
+			width: 200,
+			height: 74,
+			key: this._alertKey,
+			menu: [{
+				label: this._localeService.t("sheets-ui.info.convertToNumber"),
+				onSelect: () => {
+					if (this._commandService.syncExecuteCommand(TextToNumberCommand.id, {
+						unitId,
+						subUnitId,
+						ranges: [range]
+					})) this._hideAlert();
 				}
-			}
-			this._hideAlert();
-		}));
+			}]
+		});
+	}
+	get _alertKey() {
+		return `${ALERT_KEY}:${this._context.unit.getUnitId()}`;
 	}
 	_hideAlert() {
-		this._cellAlertManagerService.removeAlert(ALERT_KEY);
+		this._cellAlertManagerService.removeAlert(this._alertKey);
 	}
 };
 ForceStringAlertRenderController = __decorate([
-	__decorateParam(1, Inject(HoverManagerService)),
+	__decorateParam(1, Inject(SheetsSelectionsService)),
 	__decorateParam(2, Inject(CellAlertManagerService)),
 	__decorateParam(3, Inject(LocaleService)),
-	__decorateParam(4, IConfigService)
+	__decorateParam(4, IConfigService),
+	__decorateParam(5, ICommandService),
+	__decorateParam(6, IUniverInstanceService)
 ], ForceStringAlertRenderController);
 
 //#endregion
@@ -28543,7 +28430,7 @@ function MobileSheetBarImpl(props) {
 					tabMapRef.current.set(sheet.sheetId, element);
 				},
 				className: clsx("univer-relative univer-box-border univer-flex univer-h-full univer-max-w-36 univer-shrink-0 univer-cursor-pointer univer-select-none univer-items-center univer-justify-center univer-truncate univer-px-1 univer-py-0.5 univer-text-sm univer-font-medium univer-leading-6 univer-transition-all", borderRightClassName, {
-					"univer-bg-white univer-text-blue-600 dark:!univer-bg-gray-700 dark:!univer-text-blue-400": sheet.sheetId === activeKey,
+					"univer-bg-gray-0 univer-text-blue-600 dark:!univer-bg-gray-700 dark:!univer-text-blue-400": sheet.sheetId === activeKey,
 					"univer-text-gray-600 hover:univer-bg-gray-50 active:univer-bg-gray-100 dark:!univer-text-gray-300 dark:hover:!univer-bg-gray-700": sheet.sheetId !== activeKey
 				}),
 				role: "tab",
@@ -29359,7 +29246,7 @@ FormatPainterRenderController = __decorate([
 //#region src/controllers/render-controllers/header-menu.render-controller.ts
 const HEADER_MENU_CONTROLLER_SHAPE = "__SpreadsheetHeaderMenuSHAPEControllerShape__";
 const HEADER_MENU_CONTROLLER_MENU = "__SpreadsheetHeaderMenuMAINControllerShape__";
-const HEADER_MENU_CONTROLLER_SHAPE_COLOR = "rgba(0, 0, 0, 0.1)";
+const HEADER_MENU_CONTROLLER_SHAPE_COLOR = "gray.100";
 let HeaderMenuRenderController = class HeaderMenuRenderController extends Disposable {
 	constructor(_context, _sheetSkeletonManagerService, _contextMenuService, _commandService, _selectionManagerService) {
 		super();
@@ -30837,6 +30724,36 @@ MobileSheetsScrollRenderController = __decorate([
 	__decorateParam(7, IContextService)
 ], MobileSheetsScrollRenderController);
 
+//#endregion
+//#region src/controllers/render-controllers/skeleton.render-controller.ts
+let SheetSkeletonRenderController = class SheetSkeletonRenderController extends Disposable {
+	constructor(_context, _sheetSkeletonManagerService, _renderManagerService) {
+		super();
+		this._context = _context;
+		this._sheetSkeletonManagerService = _sheetSkeletonManagerService;
+		this._renderManagerService = _renderManagerService;
+		this.disposeWithMe(this._sheetSkeletonManagerService.currentSkeleton$.subscribe((param) => {
+			this._updateSceneSize(param);
+		}));
+	}
+	_updateSceneSize(param) {
+		var _this$_renderManagerS;
+		if (param == null) return;
+		const { unitId } = this._context;
+		const { skeleton } = param;
+		const scene = (_this$_renderManagerS = this._renderManagerService.getRenderUnitById(unitId)) === null || _this$_renderManagerS === void 0 ? void 0 : _this$_renderManagerS.scene;
+		if (skeleton == null || scene == null) return;
+		const { rowTotalHeight, columnTotalWidth, rowHeaderWidthAndMarginLeft, columnHeaderHeightAndMarginTop } = skeleton;
+		if (!this._context.unit.getActiveSheet()) return;
+		scene === null || scene === void 0 || scene.transformByState({
+			width: rowHeaderWidthAndMarginLeft + columnTotalWidth,
+			height: columnHeaderHeightAndMarginTop + rowTotalHeight
+		});
+		scene.getMainViewport().setMargin(rowHeaderWidthAndMarginLeft, columnHeaderHeightAndMarginTop);
+	}
+};
+SheetSkeletonRenderController = __decorate([__decorateParam(1, Inject(SheetSkeletonManagerService)), __decorateParam(2, IRenderManagerService)], SheetSkeletonRenderController);
+
 //#endregion
 //#region src/services/auto-height.service.ts
 const IAutoHeightService = createIdentifier("sheets-ui.services.auto-height");
@@ -31742,7 +31659,6 @@ let UniverSheetsMobileUIPlugin = class UniverSheetsMobileUIPlugin extends Plugin
 			[SelectAllService],
 			[ISheetCellDropdownManagerService, { useClass: SheetCellDropdownManagerService }],
 			[SheetCellEditorResizeService],
-			[ISheetLoadingRenderService, { useClass: SheetLoadingRenderService }],
 			[AutoHeightController],
 			[AutoWidthController],
 			[FormulaEditorController],
@@ -32360,7 +32276,6 @@ let UniverSheetsUIPlugin = class UniverSheetsUIPlugin extends Plugin {
 			[SelectAllService],
 			[ISheetCellDropdownManagerService, { useClass: SheetCellDropdownManagerService }],
 			[SheetCellEditorResizeService],
-			[ISheetLoadingRenderService, { useClass: SheetLoadingRenderService }],
 			[AutoHeightController],
 			[AutoWidthController],
 			[FormulaEditorController],
@@ -32483,4 +32398,4 @@ UniverSheetsUIPlugin = __decorate([
 ], UniverSheetsUIPlugin);
 
 //#endregion
-export { AddRangeProtectionFromContextMenuCommand, AddRangeProtectionFromSheetBarCommand, AddRangeProtectionFromToolbarCommand, ApplyFormatPainterCommand, AutoFillPopupMenu, AutoFillUIController, AutoHeightController, AutoWidthController, BORDER_LINE_CHILDREN, BORDER_SIZE_CHILDREN, BaseSelectionRenderService, BorderLine, COPY_SPECIAL_MENU_ID, COPY_TYPE, CellAlertManagerService, CellAlertType, CellCustomRenderController, CellEditorManagerService, CellPopupManagerService, ChangeSheetProtectionFromSheetBarCommand, ChangeZoomRatioCommand, DeleteRangeMoveLeftConfirmCommand, DeleteRangeMoveUpConfirmCommand, DeleteRangeProtectionFromContextMenuCommand, DeleteWorksheetProtectionFormSheetBarCommand, DragManagerService, DragRenderController, EMBEDDING_FORMULA_EDITOR, EMBEDDING_FORMULA_EDITOR_COMPONENT_KEY, EditingRenderController, EditorBridgeService, EditorContainer, ExpandSelectionCommand, FORMULA_CLIPBOARD_MIME_TYPE, FormatPainterStatus, FormulaBar, FormulaEditorController, HEADER_UNHIDE_RANGE_VISIBLE_CHECK, HeaderFreezeRenderController, HeaderMoveRenderController, HeaderResizeRenderController, HeaderUnhideRangeAxis, HeaderUnhideRangeService, HeaderUnhideRenderController, HideColConfirmCommand, HideRowConfirmCommand, HoverManagerService, HoverRenderController, ICellEditorManagerService, IEditorBridgeService, IFormatPainterService, IFormulaEditorManagerService, IMarkSelectionService, IRepeatLastActionService, ISheetCellDropdownManagerService, ISheetClipboardService, ISheetEmbedFloatingGeometryService, ISheetEmbedInteractionBoundaryService, ISheetEmbedRuntimeFocusCoordinator, ISheetEmbedRuntimeService, ISheetHostChromeOverrideService, ISheetLoadingRenderService, ISheetSelectionRenderService, IStatusBarService, InsertRangeMoveDownConfirmCommand, InsertRangeMoveRightConfirmCommand, JumpOver, MarkSelectionService, MoveSelectionCommand, MoveSelectionEnterAndTabCommand, PASTE_SPECIAL_MENU_ID, PREDEFINED_HOOK_NAME, PREDEFINED_HOOK_NAME_COPY, PREDEFINED_HOOK_NAME_PASTE, RANGE_SELECTOR_COMPONENT_KEY, RANGE_SELECTOR_SYMBOLS, RemoveColConfirmCommand, RemoveRowConfirmCommand, RemoveSheetConfirmCommand, RenameSheetOperation, RepeatLastActionPermission, ResetRangeTextColorCommand, ResetScrollCommand, SELECTION_SHAPE_DEPTH, SHEETS_UI_PLUGIN_CONFIG_KEY, SHEET_EMBED_CHILD_TYPE_ATTRIBUTE, SHEET_EMBED_CHILD_UNIT_ID_ATTRIBUTE, SHEET_EMBED_FLOAT_DOM_ATTRIBUTE, SHEET_EMBED_HOST_UNIT_ID_ATTRIBUTE, SHEET_EMBED_ID_ATTRIBUTE, SHEET_EMBED_INTERACTION_BOUNDARY_OWNER_ATTRIBUTE, SHEET_EMBED_RUNTIME_FOCUS_ROLE_ATTRIBUTE, SHEET_FOOTER_BAR_HEIGHT, SHEET_UI_PLUGIN_NAME, SHEET_VIEW_KEY, ScrollCommand, ScrollToCellCommand, ScrollToRangeOperation, SelectAllCommand, SelectionControl, SelectionControl as SelectionShape, SelectionShapeExtension, SetActivateCellEditOperation, SetCellEditVisibleArrowOperation, SetCellEditVisibleOperation, SetCellEditVisibleWithF2Operation, SetColumnFrozenCommand, SetColumnHeaderHeightCommand, SetFirstColumnFrozenCommand, SetFirstRowFrozenCommand, SetFormatPainterOperation, SetInfiniteFormatPainterCommand, SetOnceFormatPainterCommand, SetRangeBoldCommand, SetRangeFontDecreaseCommand, SetRangeFontFamilyCommand, SetRangeFontIncreaseCommand, SetRangeFontSizeCommand, SetRangeItalicCommand, SetRangeProtectionFromContextMenuCommand, SetRangeStrickThroughCommand, SetRangeSubscriptCommand, SetRangeSuperscriptCommand, SetRangeTextColorCommand, SetRangeUnderlineCommand, SetRowFrozenCommand, SetRowHeaderWidthCommand, SetScrollOperation, SetScrollRelativeCommand, SetSelectionFrozenCommand, SetWorksheetColAutoWidthCommand, SetZoomRatioCommand, SetZoomRatioOperation, SheetBar, SheetCanvasPopManagerService, SheetCellDropdownManagerService, SheetCellEditorResizeService, SheetClipboardController, SheetClipboardService, SheetCopyCommand, SheetCutCommand, SheetMenuPosition, SheetPasteBesidesBorderCommand, SheetPasteColWidthCommand, SheetPasteCommand, SheetPasteFormatCommand, SheetPasteShortKeyCommand, SheetPasteValueCommand, SheetPermissionCheckUIController, SheetPermissionOpenDialogOperation, SheetPermissionOpenPanelOperation, SheetPermissionRenderManagerService, SheetPermissionUserManagerService, SheetPrintInterceptorService, SheetPrintingResourceCollector, SheetRenderController, SheetScrollManagerService, SheetSelectionRenderService, SheetSkeletonManagerService, SheetUIController, SheetsRenderService, SheetsScrollRenderController, menuSchema as SheetsUIMenuSchema, SheetsUIPart, ShowMenuListCommand, SidebarDefinedNameOperation, StatusBarController, StatusBarService, UNIVER_SHEET_PERMISSION_USER_PART, UniverSheetsMobileUIPlugin, UniverSheetsUIPlugin, ViewSheetPermissionFromContextMenuCommand, ViewSheetPermissionFromSheetBarCommand, calculateDocSkeletonRects, matchedSelectionByRowColIndex as checkInHeaderRanges, deriveStateFromActiveSheet$, functionDisplayNames, genNormalSelectionStyle, genSelectionByRange, selectionDataForSelectAll as getAllSelection, getCellRealRange, getCoordByCell, getCoordByOffset, getCurrentExclusiveRangeInterest$, getCurrentRangeDisable$, getCustomRangePosition, getEditingCustomRangePosition, getEditorObject, getMatrixPlainText, getObservableWithExclusiveRange$, getRepeatRange, getSheetObject, getTopLeftSelectionOfCurrSheet, getTransformCoord, getViewportByCell, isEmbeddingFormulaEditor, isRangeSelector, menuClipboardDisabledObservable, mergeSetRangeValues, resolveActiveSheetEmbedRuntimeDomScope, resolveSheetEmbedRuntimeDomScope, useActiveWorkbook, useActiveWorksheet, useHighlightRange, useKeyEventConfig, useWorkbooks, virtualizeDiscreteRanges, whenFormulaEditorActivated, whenSheetEditorActivated, whenSheetEditorFocused };
+export { AddRangeProtectionFromContextMenuCommand, AddRangeProtectionFromSheetBarCommand, AddRangeProtectionFromToolbarCommand, ApplyFormatPainterCommand, AutoFillPopupMenu, AutoFillUIController, AutoHeightController, AutoWidthController, BORDER_LINE_CHILDREN, BORDER_SIZE_CHILDREN, BaseSelectionRenderService, BorderLine, COPY_SPECIAL_MENU_ID, COPY_TYPE, CellAlertManagerService, CellAlertType, CellCustomRenderController, CellEditorManagerService, CellPopupManagerService, ChangeSheetProtectionFromSheetBarCommand, ChangeZoomRatioCommand, DeleteRangeMoveLeftConfirmCommand, DeleteRangeMoveUpConfirmCommand, DeleteRangeProtectionFromContextMenuCommand, DeleteWorksheetProtectionFormSheetBarCommand, DragManagerService, DragRenderController, EMBEDDING_FORMULA_EDITOR, EMBEDDING_FORMULA_EDITOR_COMPONENT_KEY, EditingRenderController, EditorBridgeService, EditorContainer, ExpandSelectionCommand, FORMULA_CLIPBOARD_MIME_TYPE, FormatPainterStatus, FormulaBar, FormulaEditorController, HEADER_UNHIDE_RANGE_VISIBLE_CHECK, HeaderFreezeRenderController, HeaderMoveRenderController, HeaderResizeRenderController, HeaderUnhideRangeAxis, HeaderUnhideRangeService, HeaderUnhideRenderController, HideColConfirmCommand, HideRowConfirmCommand, HoverManagerService, HoverRenderController, ICellEditorManagerService, IEditorBridgeService, IFormatPainterService, IFormulaEditorManagerService, IMarkSelectionService, IRepeatLastActionService, ISheetBarService, ISheetCellDropdownManagerService, ISheetClipboardService, ISheetEmbedFloatingGeometryService, ISheetEmbedInteractionBoundaryService, ISheetEmbedRuntimeFocusCoordinator, ISheetEmbedRuntimeService, ISheetHostChromeOverrideService, ISheetSelectionRenderService, IStatusBarService, InsertRangeMoveDownConfirmCommand, InsertRangeMoveRightConfirmCommand, JumpOver, MarkSelectionService, MoveSelectionCommand, MoveSelectionEnterAndTabCommand, PASTE_SPECIAL_MENU_ID, PREDEFINED_HOOK_NAME, PREDEFINED_HOOK_NAME_COPY, PREDEFINED_HOOK_NAME_PASTE, RANGE_SELECTOR_COMPONENT_KEY, RANGE_SELECTOR_SYMBOLS, RemoveColConfirmCommand, RemoveRowConfirmCommand, RemoveSheetConfirmCommand, RenameSheetOperation, RepeatLastActionPermission, ResetRangeTextColorCommand, ResetScrollCommand, SELECTION_SHAPE_DEPTH, SHEETS_UI_PLUGIN_CONFIG_KEY, SHEET_EMBED_CHILD_TYPE_ATTRIBUTE, SHEET_EMBED_CHILD_UNIT_ID_ATTRIBUTE, SHEET_EMBED_FLOAT_DOM_ATTRIBUTE, SHEET_EMBED_HOST_UNIT_ID_ATTRIBUTE, SHEET_EMBED_ID_ATTRIBUTE, SHEET_EMBED_INTERACTION_BOUNDARY_OWNER_ATTRIBUTE, SHEET_EMBED_RUNTIME_FOCUS_ROLE_ATTRIBUTE, SHEET_FOOTER_BAR_HEIGHT, SHEET_UI_PLUGIN_NAME, SHEET_VIEW_KEY, ScrollCommand, ScrollToCellCommand, ScrollToRangeOperation, SelectAllCommand, SelectionControl, SelectionControl as SelectionShape, SelectionShapeExtension, SetActivateCellEditOperation, SetCellEditVisibleArrowOperation, SetCellEditVisibleOperation, SetCellEditVisibleWithF2Operation, SetColumnFrozenCommand, SetColumnHeaderHeightCommand, SetFirstColumnFrozenCommand, SetFirstRowFrozenCommand, SetFormatPainterOperation, SetInfiniteFormatPainterCommand, SetOnceFormatPainterCommand, SetRangeBoldCommand, SetRangeFontDecreaseCommand, SetRangeFontFamilyCommand, SetRangeFontIncreaseCommand, SetRangeFontSizeCommand, SetRangeItalicCommand, SetRangeProtectionFromContextMenuCommand, SetRangeStrickThroughCommand, SetRangeSubscriptCommand, SetRangeSuperscriptCommand, SetRangeTextColorCommand, SetRangeUnderlineCommand, SetRowFrozenCommand, SetRowHeaderWidthCommand, SetScrollOperation, SetScrollRelativeCommand, SetSelectionFrozenCommand, SetWorksheetColAutoWidthCommand, SetZoomRatioCommand, SetZoomRatioOperation, SheetBar, SheetBarService, SheetCanvasPopManagerService, SheetCellDropdownManagerService, SheetCellEditorResizeService, SheetClipboardController, SheetClipboardService, SheetCopyCommand, SheetCutCommand, SheetMenuPosition, SheetPasteBesidesBorderCommand, SheetPasteColWidthCommand, SheetPasteCommand, SheetPasteFormatCommand, SheetPasteShortKeyCommand, SheetPasteValueCommand, SheetPermissionCheckUIController, SheetPermissionOpenDialogOperation, SheetPermissionOpenPanelOperation, SheetPermissionRenderManagerService, SheetPermissionUserManagerService, SheetPrintInterceptorService, SheetPrintingResourceCollector, SheetRenderController, SheetScrollManagerService, SheetSelectionRenderService, SheetSkeletonManagerService, SheetUIController, SheetsRenderService, SheetsScrollRenderController, menuSchema as SheetsUIMenuSchema, SheetsUIPart, ShowMenuListCommand, SidebarDefinedNameOperation, StatusBarController, StatusBarService, UNIVER_SHEET_PERMISSION_USER_PART, UniverSheetsMobileUIPlugin, UniverSheetsUIPlugin, ViewSheetPermissionFromContextMenuCommand, ViewSheetPermissionFromSheetBarCommand, calculateDocSkeletonRects, matchedSelectionByRowColIndex as checkInHeaderRanges, deriveStateFromActiveSheet$, functionDisplayNames, genNormalSelectionStyle, genSelectionByRange, selectionDataForSelectAll as getAllSelection, getCellRealRange, getCoordByCell, getCoordByOffset, getCurrentExclusiveRangeInterest$, getCurrentRangeDisable$, getCustomRangePosition, getEditingCustomRangePosition, getEditorObject, getMatrixPlainText, getObservableWithExclusiveRange$, getRepeatRange, getSheetObject, getTopLeftSelectionOfCurrSheet, getTransformCoord, getViewportByCell, isEmbeddingFormulaEditor, isRangeSelector, menuClipboardDisabledObservable, mergeSetRangeValues, resolveActiveSheetEmbedRuntimeDomScope, resolveSheetEmbedRuntimeDomScope, useActiveWorkbook, useActiveWorksheet, useHighlightRange, useKeyEventConfig, useWorkbooks, virtualizeDiscreteRanges, whenFormulaEditorActivated, whenSheetEditorActivated, whenSheetEditorFocused };