@univerjs/sheets-ui 0.23.0 → 0.24.0

package/lib/index.js

@@ -489,11 +489,13 @@ var BaseSelectionRenderService = class extends Disposable {
 	}
 	newSelectionControl(scene, skeleton, selection) {
 		const zIndex = this.getSelectionControls().length;
-		const { rowHeaderWidth, columnHeaderHeight } = skeleton;
+		const { rowHeaderWidth, rowHeaderWidthAndMarginLeft, columnHeaderHeight, columnHeaderHeightAndMarginTop } = skeleton;
 		const control = new SelectionControl(scene, zIndex, this._selectionTheme, {
 			highlightHeader: this._highlightHeader,
 			rowHeaderWidth,
-			columnHeaderHeight
+			columnHeaderHeight,
+			rowHeaderOffsetX: Math.max(0, rowHeaderWidthAndMarginLeft - rowHeaderWidth),
+			columnHeaderOffsetY: Math.max(0, columnHeaderHeightAndMarginTop - columnHeaderHeight)
 		});
 		this._selectionControls.push(control);
 		const selectionWithCoord = attachSelectionWithCoord(selection, skeleton);
@@ -1779,7 +1781,7 @@ const SELECTION_TITLE_HIGHLIGHT_ALPHA = .3;
 */
 var SelectionControl = class extends Disposable {
 	constructor(_scene, _zIndex, _themeService, options) {
-		var _options$enableAutoFi, _options$highlightHea, _options$rowHeaderWid, _options$columnHeader;
+		var _options$enableAutoFi, _options$highlightHea, _options$rowHeaderWid, _options$columnHeader, _options$rowHeaderOff, _options$columnHeader2;
 		super();
 		this._scene = _scene;
 		this._zIndex = _zIndex;
@@ -1818,6 +1820,8 @@ var SelectionControl = class extends Disposable {
 		_defineProperty(this, "_currentStyle", void 0);
 		_defineProperty(this, "_rowHeaderWidth", 0);
 		_defineProperty(this, "_columnHeaderHeight", 0);
+		_defineProperty(this, "_rowHeaderOffsetX", 0);
+		_defineProperty(this, "_columnHeaderOffsetY", 0);
 		_defineProperty(this, "_widgetRects", []);
 		_defineProperty(this, "_controlExtension", void 0);
 		_defineProperty(this, "_dispose$", new BehaviorSubject(this));
@@ -1835,6 +1839,8 @@ var SelectionControl = class extends Disposable {
 		this._highlightHeader = (_options$highlightHea = options === null || options === void 0 ? void 0 : options.highlightHeader) !== null && _options$highlightHea !== void 0 ? _options$highlightHea : true;
 		this._rowHeaderWidth = (_options$rowHeaderWid = options === null || options === void 0 ? void 0 : options.rowHeaderWidth) !== null && _options$rowHeaderWid !== void 0 ? _options$rowHeaderWid : 0;
 		this._columnHeaderHeight = (_options$columnHeader = options === null || options === void 0 ? void 0 : options.columnHeaderHeight) !== null && _options$columnHeader !== void 0 ? _options$columnHeader : 0;
+		this._rowHeaderOffsetX = (_options$rowHeaderOff = options === null || options === void 0 ? void 0 : options.rowHeaderOffsetX) !== null && _options$rowHeaderOff !== void 0 ? _options$rowHeaderOff : 0;
+		this._columnHeaderOffsetY = (_options$columnHeader2 = options === null || options === void 0 ? void 0 : options.columnHeaderOffsetY) !== null && _options$columnHeader2 !== void 0 ? _options$columnHeader2 : 0;
 		this._initializeSheetBody();
 		this._initialHeader();
 	}
@@ -2199,6 +2205,8 @@ var SelectionControl = class extends Disposable {
 		if (sk) {
 			this._rowHeaderWidth = sk.rowHeaderWidth;
 			this._columnHeaderHeight = sk.columnHeaderHeight;
+			this._rowHeaderOffsetX = Math.max(0, sk.rowHeaderWidthAndMarginLeft - sk.rowHeaderWidth);
+			this._columnHeaderOffsetY = Math.max(0, sk.columnHeaderHeightAndMarginTop - sk.columnHeaderHeight);
 		}
 		this._selectionRenderModel.setValue(selectionWthCoord.rangeWithCoord, selectionWthCoord.primaryWithCoord);
 		this._showAutoFill = selectionWthCoord.primaryWithCoord !== null;
@@ -2219,6 +2227,8 @@ var SelectionControl = class extends Disposable {
 	update(newSelectionRange, rowHeaderWidth = 0, columnHeaderHeight = 0, style, primaryCell) {
 		this._rowHeaderWidth = rowHeaderWidth;
 		this._columnHeaderHeight = columnHeaderHeight;
+		this._rowHeaderOffsetX = 0;
+		this._columnHeaderOffsetY = 0;
 		this.updateRangeBySelectionWithCoord({
 			rangeWithCoord: newSelectionRange,
 			primaryWithCoord: primaryCell,
@@ -2338,6 +2348,8 @@ var SelectionControl = class extends Disposable {
 		columnHeaderStrokeWidth /= scale;
 		const rowHeaderWidth = this._rowHeaderWidth;
 		const columnHeaderHeight = this._columnHeaderHeight;
+		const rowHeaderOffsetX = this._rowHeaderOffsetX;
+		const columnHeaderOffsetY = this._columnHeaderOffsetY;
 		if (this._highlightHeader && columnHeaderHeight > 0) {
 			let highlightTitleColor = columnHeaderFill;
 			if (rangeType === RANGE_TYPE.COLUMN) highlightTitleColor = new ColorKit(stroke).setAlpha(SELECTION_TITLE_HIGHLIGHT_ALPHA).toString();
@@ -2350,7 +2362,7 @@ var SelectionControl = class extends Disposable {
 				top: columnHeaderHeight - columnHeaderStrokeWidth + 1 / scale
 			});
 			this._columnHeaderGroup.show();
-			this._columnHeaderGroup.translate(startX, 0);
+			this._columnHeaderGroup.translate(startX, columnHeaderOffsetY);
 		} else this._columnHeaderGroup.hide();
 		this._columnHeaderGroup.makeDirty(true);
 		if (this._highlightHeader && rowHeaderWidth > 0) {
@@ -2365,7 +2377,7 @@ var SelectionControl = class extends Disposable {
 				left: rowHeaderWidth - rowHeaderStrokeWidth + 1 / scale
 			});
 			this._rowHeaderGroup.show();
-			this._rowHeaderGroup.translate(0, startY);
+			this._rowHeaderGroup.translate(rowHeaderOffsetX, startY);
 		} else this._rowHeaderGroup.hide();
 		this._rowHeaderGroup.makeDirty(true);
 	}
@@ -2579,7 +2591,7 @@ let MarkSelectionService = class MarkSelectionService extends Disposable {
 	}
 	addShape(selection, exits = [], zIndex = DEFAULT_Z_INDEX) {
 		var _workbook$getActiveSh;
-		const workbook = this._currentService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = this._currentService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const subUnitId = (_workbook$getActiveSh = workbook.getActiveSheet()) === null || _workbook$getActiveSh === void 0 ? void 0 : _workbook$getActiveSh.getSheetId();
 		if (!subUnitId) return null;
 		const id = generateRandomId();
@@ -2597,7 +2609,7 @@ let MarkSelectionService = class MarkSelectionService extends Disposable {
 	}
 	addShapeWithNoFresh(selection, exits = [], zIndex = DEFAULT_Z_INDEX) {
 		var _workbook$getActiveSh2;
-		const workbook = this._currentService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = this._currentService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const subUnitId = (_workbook$getActiveSh2 = workbook.getActiveSheet()) === null || _workbook$getActiveSh2 === void 0 ? void 0 : _workbook$getActiveSh2.getSheetId();
 		if (!subUnitId) return null;
 		const id = generateRandomId();
@@ -2613,7 +2625,7 @@ let MarkSelectionService = class MarkSelectionService extends Disposable {
 	}
 	refreshShapes() {
 		var _currentSheet$getActi;
-		const currentSheet = this._currentService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const currentSheet = this._currentService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		if (!currentSheet) return;
 		const currentUnitId = currentSheet.getUnitId();
 		const currentSubUnitId = (_currentSheet$getActi = currentSheet.getActiveSheet()) === null || _currentSheet$getActi === void 0 ? void 0 : _currentSheet$getActi.getSheetId();
@@ -2705,10 +2717,6 @@ function cloneCellDataWithSpanInfo(cell) {
 //#endregion
 //#region src/services/clipboard/copy-content-cache.ts
 const COPY_CONTENT_CACHE_LIMIT = 10;
-const ID_LENGTH = 6;
-function genId() {
-	return generateRandomId(ID_LENGTH);
-}
 function extractId(html) {
 	const match = html.match(/data-copy-id="([^\s]+)"/);
 	if (match && match[1]) return match[1];
@@ -4035,7 +4043,7 @@ let SheetClipboardService = class SheetClipboardService extends Disposable {
 	async copy(options) {
 		const selection = this._selectionManagerService.getCurrentLastSelection();
 		if (!selection) return false;
-		const workbook = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 		if (!workbook || !worksheet) return false;
 		const workbookId = workbook.getUnitId();
@@ -4196,7 +4204,7 @@ let SheetClipboardService = class SheetClipboardService extends Disposable {
 			rowIndex += 1;
 		}
 		for (let c = startColumn; c <= endColumn; c++) discreteRange.cols.push(c);
-		const copyId = genId();
+		const copyId = generateRandomId(6);
 		const html = this._usmToHtml.convert(matrix, discreteRange, hooks, copyId);
 		return {
 			copyId,
@@ -4248,7 +4256,7 @@ let SheetClipboardService = class SheetClipboardService extends Disposable {
 		});
 		const result = redoMutationsInfo.every((m) => this._commandService.executeCommand(m.id, m.params));
 		if (result) this._undoRedoService.pushUndoRedo({
-			unitID: this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET).getUnitId(),
+			unitID: this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET).getUnitId(),
 			undoMutations: undoMutationsInfo,
 			redoMutations: redoMutationsInfo
 		});
@@ -4595,7 +4603,7 @@ let SheetClipboardService = class SheetClipboardService extends Disposable {
 		};
 	}
 	_getPastingTarget() {
-		const workbook = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook.getActiveSheet();
 		const selection = this._selectionManagerService.getCurrentLastSelection();
 		return {
@@ -4657,7 +4665,7 @@ let SheetClipboardService = class SheetClipboardService extends Disposable {
 		const { startRow, startColumn, endRow, endColumn } = vRange;
 		const destinationRows = endRow - startRow + 1;
 		const destinationColumns = endColumn - startColumn + 1;
-		const workbook = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 		if (!worksheet) return null;
 		const mergedCellsInRange = worksheet.getMergeData().filter((rect) => discreteRange.rows.includes(rect.startRow) && discreteRange.cols.includes(rect.startColumn));
@@ -4797,7 +4805,7 @@ let SheetClipboardService = class SheetClipboardService extends Disposable {
 	* @param range
 	*/
 	_topLeftCellsMatch(rowCount, colCount, range) {
-		const workbook = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 		if (!worksheet) return false;
 		const { topRow, leftCol } = range;
@@ -5998,7 +6006,7 @@ const DeleteRangeProtectionFromContextMenuCommand = {
 		const undoRedoService = accessor.get(IUndoRedoService);
 		const selectionManagerService = accessor.get(SheetsSelectionsService);
 		const worksheetRuleModel = accessor.get(WorksheetProtectionRuleModel);
-		const workbook = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook.getActiveSheet();
 		const unitId = workbook.getUnitId();
 		const subUnitId = worksheet.getSheetId();
@@ -6049,7 +6057,7 @@ const SetRangeProtectionFromContextMenuCommand = {
 		const univerInstanceService = accessor.get(IUniverInstanceService);
 		const selectionManagerService = accessor.get(SheetsSelectionsService);
 		const worksheetRuleModel = accessor.get(WorksheetProtectionRuleModel);
-		const workbook = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook.getActiveSheet();
 		const unitId = workbook.getUnitId();
 		const subUnitId = worksheet.getSheetId();
@@ -6970,7 +6978,7 @@ function isRenderManagerService(renderManagerService) {
 * Get render objects of a spreadsheet.
 */
 function getSheetObject(univerInstanceService, renderManagerService) {
-	const workbook = univerInstanceService instanceof Workbook ? univerInstanceService : univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+	const workbook = univerInstanceService instanceof Workbook ? univerInstanceService : univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 	if (!workbook) return null;
 	const unitId = workbook.getUnitId();
 	let components, mainComponent, scene, engine;
@@ -7522,7 +7530,7 @@ const ScrollToCellCommand = {
 	type: CommandType.COMMAND,
 	handler: (accessor, params) => {
 		const instanceService = accessor.get(IUniverInstanceService);
-		return accessor.get(IRenderManagerService).getRenderById(instanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET).getUnitId()).with(SheetsScrollRenderController).scrollToRange(params.range, params.forceTop, params.forceLeft);
+		return accessor.get(IRenderManagerService).getRenderById(instanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET).getUnitId()).with(SheetsScrollRenderController).scrollToRange(params.range, params.forceTop, params.forceLeft);
 	}
 };
 /**
@@ -8132,7 +8140,7 @@ const DeleteWorksheetProtectionFormSheetBarCommand = {
 		const commandService = accessor.get(ICommandService);
 		const undoRedoService = accessor.get(IUndoRedoService);
 		const worksheetProtectionRuleModel = accessor.get(WorksheetProtectionRuleModel);
-		const workbook = accessor.get(IUniverInstanceService).getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = accessor.get(IUniverInstanceService).getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 		const unitId = workbook.getUnitId();
 		if (!worksheet) return false;
@@ -8219,7 +8227,7 @@ const SetCellEditVisibleOperation = {
 		if (!params) return false;
 		if (((_configService$getCon = accessor.get(IConfigService).getConfig("sheets-ui.config")) === null || _configService$getCon === void 0 ? void 0 : _configService$getCon.disableEdit) && params.visible) return false;
 		const { unitId } = params;
-		const workbook = accessor.get(IUniverInstanceService).getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = accessor.get(IUniverInstanceService).getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		if (!workbook) return false;
 		accessor.get(IEditorBridgeService).changeVisible({
 			...params,
@@ -8233,7 +8241,7 @@ const SetCellEditVisibleWithF2Operation = {
 	type: CommandType.OPERATION,
 	handler: (accessor, params) => {
 		const commandService = accessor.get(ICommandService);
-		const workbook = accessor.get(IUniverInstanceService).getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = accessor.get(IUniverInstanceService).getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		if (!workbook) return false;
 		return commandService.syncExecuteCommand(SetCellEditVisibleOperation.id, {
 			...params,
@@ -8273,7 +8281,7 @@ const ScrollToRangeOperation = {
 	handler: (accessor, params) => {
 		if (!params) return false;
 		const instanceService = accessor.get(IUniverInstanceService);
-		return accessor.get(IRenderManagerService).getRenderById(instanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET).getUnitId()).with(SheetsScrollRenderController).scrollToRange(params.range, params.forceTop, params.forceLeft);
+		return accessor.get(IRenderManagerService).getRenderById(instanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET).getUnitId()).with(SheetsScrollRenderController).scrollToRange(params.range, params.forceTop, params.forceLeft);
 	}
 };
 
@@ -8848,7 +8856,7 @@ let AutoHeightController = class AutoHeightController extends Disposable {
 	}
 	getUndoRedoParamsOfAutoHeight(ranges, subUnitIdParam, currentCellHeights) {
 		const { _univerInstanceService: univerInstanceService } = this;
-		const workbook = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const unitId = workbook.getUnitId();
 		let worksheet = workbook.getActiveSheet();
 		let subUnitId = worksheet.getSheetId();
@@ -10400,7 +10408,7 @@ let EditingRenderController = class EditingRenderController extends Disposable {
 	_initialCursorSync(d) {
 		d.add(this._cellEditorManagerService.focus$.pipe(filter((f) => !!f)).subscribe(() => {
 			var _this$_renderManagerS2;
-			const currentDoc = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_DOC);
+			const currentDoc = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_DOC);
 			if (!currentDoc) return;
 			const docSelectionRenderManager = (_this$_renderManagerS2 = this._renderManagerService.getRenderById(currentDoc === null || currentDoc === void 0 ? void 0 : currentDoc.getUnitId())) === null || _this$_renderManagerS2 === void 0 ? void 0 : _this$_renderManagerS2.with(DocSelectionRenderService);
 			if (!docSelectionRenderManager) return;
@@ -11766,7 +11774,7 @@ let SheetClipboardController = class SheetClipboardController extends RxDisposab
 				id: PREDEFINED_HOOK_NAME_PASTE.SPECIAL_PASTE_BESIDES_BORDER,
 				specialPasteInfo: { label: "specialPaste.besidesBorder" },
 				onPasteCells: (pasteFrom, pasteTo, matrix, payload) => {
-					self._instanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+					self._instanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 					const redoMutationsInfo = [];
 					const undoMutationsInfo = [];
 					const { range, unitId, subUnitId } = pasteTo;
@@ -11885,7 +11893,7 @@ let DragManagerService = class DragManagerService extends Disposable {
 		}));
 	}
 	_calcActiveCell(offsetX, offsetY) {
-		const workbook = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		if (!workbook) return null;
 		const worksheet = workbook.getActiveSheet();
 		if (!worksheet) return;
@@ -14488,7 +14496,7 @@ let HeaderResizeRenderController = class HeaderResizeRenderController extends Di
 			var _this$_sheetSkeletonM;
 			const skeleton = (_this$_sheetSkeletonM = this._sheetSkeletonManagerService.getCurrentParam()) === null || _this$_sheetSkeletonM === void 0 ? void 0 : _this$_sheetSkeletonM.skeleton;
 			if (skeleton == null || this._rowResizeRect == null || this._columnResizeRect == null) return;
-			const { rowHeaderWidth, columnHeaderHeight } = skeleton;
+			const { rowBaseWidth, rowGutterWidth, columnBaseHeight, columnGutterHeight } = getHeaderBaseLayout$1(skeleton);
 			const { startX, startY, endX, endY, row, column } = getCoordByOffset(evt.offsetX, evt.offsetY, scene, skeleton);
 			const isLastRow = row === skeleton.worksheet.getRowCount() - 1;
 			const isLastColumn = column === skeleton.worksheet.getColumnCount() - 1;
@@ -14508,9 +14516,9 @@ let HeaderResizeRenderController = class HeaderResizeRenderController extends Di
 				}
 				if (this._currentRow === -1) return;
 				if (!this.interceptor.fetchThroughInterceptors(HEADER_RESIZE_PERMISSION_CHECK)(null, { row: this._currentRow })) return false;
-				const rowSize = Math.min(44, rowHeaderWidth / 3);
+				const rowSize = Math.min(44, rowBaseWidth / 3);
 				this._rowResizeRect.transformByState({
-					left: rowHeaderWidth / 2 - rowSize / 2,
+					left: rowGutterWidth + rowBaseWidth / 2 - rowSize / 2,
 					top
 				});
 				this._rowResizeRect.setShapeProps({ size: rowSize });
@@ -14528,10 +14536,10 @@ let HeaderResizeRenderController = class HeaderResizeRenderController extends Di
 				}
 				if (this._currentColumn === -1) return;
 				if (!this.interceptor.fetchThroughInterceptors(HEADER_RESIZE_PERMISSION_CHECK)(null, { col: this._currentColumn })) return false;
-				const columnSize = columnHeaderHeight * .7;
+				const columnSize = columnBaseHeight * .7;
 				this._columnResizeRect.transformByState({
 					left,
-					top: columnHeaderHeight / 2 - columnSize / 2
+					top: columnGutterHeight + columnBaseHeight / 2 - columnSize / 2
 				});
 				this._columnResizeRect.setShapeProps({ size: columnSize });
 				this._columnResizeRect.show();
@@ -14576,9 +14584,9 @@ let HeaderResizeRenderController = class HeaderResizeRenderController extends Di
 			let isStartMove = false;
 			let moveChangeX = 0;
 			let moveChangeY = 0;
-			const { columnTotalWidth, rowHeaderWidth, rowTotalHeight, columnHeaderHeight } = skeleton;
-			const shapeWidth = canvasMaxWidth > columnTotalWidth + rowHeaderWidth ? canvasMaxWidth : columnTotalWidth + rowHeaderWidth;
-			const shapeHeight = canvasMaxHeight > rowTotalHeight + columnHeaderHeight ? canvasMaxHeight : rowTotalHeight + columnHeaderHeight;
+			const { columnTotalWidth, rowHeaderWidthAndMarginLeft, rowTotalHeight, columnHeaderHeightAndMarginTop } = skeleton;
+			const shapeWidth = canvasMaxWidth > columnTotalWidth + rowHeaderWidthAndMarginLeft ? canvasMaxWidth : columnTotalWidth + rowHeaderWidthAndMarginLeft;
+			const shapeHeight = canvasMaxHeight > rowTotalHeight + columnHeaderHeightAndMarginTop ? canvasMaxHeight : rowTotalHeight + columnHeaderHeightAndMarginTop;
 			const HEADER_MENU_SHAPE_THUMB_SIZE_SCALE = 4 / Math.max(scaleX, scaleY);
 			if (initialType === 0) this._resizeHelperShape = new Rect(HEADER_RESIZE_CONTROLLER_SHAPE_HELPER, {
 				width: shapeWidth,
@@ -14711,208 +14719,580 @@ HeaderResizeRenderController = __decorate([
 	__decorateParam(2, Inject(SheetsSelectionsService)),
 	__decorateParam(3, ICommandService)
 ], HeaderResizeRenderController);
+function getHeaderBaseLayout$1(skeleton) {
+	var _skeleton$worksheet$g, _skeleton$worksheet, _config$rowHeader, _config$columnHeader;
+	const config = (_skeleton$worksheet$g = (_skeleton$worksheet = skeleton.worksheet).getConfig) === null || _skeleton$worksheet$g === void 0 ? void 0 : _skeleton$worksheet$g.call(_skeleton$worksheet);
+	const configuredRowWidth = config === null || config === void 0 || (_config$rowHeader = config.rowHeader) === null || _config$rowHeader === void 0 ? void 0 : _config$rowHeader.width;
+	const configuredColumnHeight = config === null || config === void 0 || (_config$columnHeader = config.columnHeader) === null || _config$columnHeader === void 0 ? void 0 : _config$columnHeader.height;
+	const rowBaseWidth = typeof configuredRowWidth === "number" && configuredRowWidth > 0 ? Math.min(configuredRowWidth, skeleton.rowHeaderWidth) : skeleton.rowHeaderWidth;
+	const columnBaseHeight = typeof configuredColumnHeight === "number" && configuredColumnHeight > 0 ? Math.min(configuredColumnHeight, skeleton.columnHeaderHeight) : skeleton.columnHeaderHeight;
+	return {
+		rowBaseWidth,
+		rowGutterWidth: Math.max(0, skeleton.rowHeaderWidthAndMarginLeft - rowBaseWidth),
+		columnBaseHeight,
+		columnGutterHeight: Math.max(0, skeleton.columnHeaderHeightAndMarginTop - columnBaseHeight)
+	};
+}
 
 //#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/services/header-unhide-range.service.ts
+let HeaderUnhideRangeAxis = /* @__PURE__ */ function(HeaderUnhideRangeAxis) {
+	HeaderUnhideRangeAxis["ROW"] = "row";
+	HeaderUnhideRangeAxis["COLUMN"] = "column";
+	return HeaderUnhideRangeAxis;
+}({});
+var HeaderUnhideRangeService = class {
+	constructor() {
+		_defineProperty(this, "_visibleHandlers", /* @__PURE__ */ new Set());
 	}
-	_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);
-		}));
+	registerRangeVisibleHandler(handler) {
+		this._visibleHandlers.add(handler);
+		const dispose = () => this._visibleHandlers.delete(handler);
+		return {
+			dispose,
+			unsubscribe: dispose
+		};
 	}
-	_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).filter((key) => key.startsWith(SHEET_EXTENSION_PREFIX)).length > 0) 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;
-			}
-		}));
+	shouldRenderRange(visible, payload) {
+		let nextVisible = visible;
+		for (const handler of this._visibleHandlers) nextVisible = handler(nextVisible, payload);
+		return nextVisible;
 	}
-	/**
-	* 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);
+};
+
+//#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)";
+var HeaderMenuShape = class extends Shape {
+	constructor(key, props) {
+		super(key, props);
+		_defineProperty(this, "_size", 12);
+		_defineProperty(this, "_iconRatio", .4);
+		_defineProperty(this, "_mode", 0);
+		this.setShapeProps(props);
 	}
-	_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
+	setShapeProps(props) {
+		if (props === null || props === void 0 ? void 0 : props.size) this._size = props.size;
+		if (props === null || props === void 0 ? void 0 : props.mode) this._mode = props.mode;
+		this.transformByState({
+			width: this._size,
+			height: this._size
 		});
-		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
+	_draw(ctx) {
+		if (this._mode === 1) Rect.drawWith(ctx, {
+			width: this._size,
+			height: this._size,
+			radius: this._size,
+			fill: HEADER_MENU_SHAPE_CIRCLE_FILL
 		});
-		const viewRowBottom = new Viewport(SHEET_VIEWPORT_KEY.VIEW_ROW_BOTTOM, scene, {
-			left: 0,
-			top: columnHeaderHeight,
-			bottom: 0,
-			width: rowHeaderWidth + 1,
-			isWheelPreventDefaultX: true
+		const iconSize = this._size * .5 * this._iconRatio;
+		const sixtyDegree = Math.PI / 180 * 60;
+		const left = iconSize * Math.sin(sixtyDegree);
+		const top = iconSize * Math.cos(sixtyDegree);
+		RegularPolygon.drawWith(ctx, {
+			pointsGroup: [[
+				{
+					x: -left + this._size / 2,
+					y: -top + this._size / 2
+				},
+				{
+					x: left + this._size / 2,
+					y: -top + this._size / 2
+				},
+				{
+					x: this._size / 2,
+					y: iconSize + this._size / 2
+				}
+			]],
+			fill: HEADER_MENU_SHAPE_TRIANGLE_FILL
 		});
-		const viewColumnLeft = new Viewport(SHEET_VIEWPORT_KEY.VIEW_COLUMN_LEFT, scene, {
-			active: false,
-			isWheelPreventDefaultX: true
+	}
+};
+
+//#endregion
+//#region src/views/header-unhide-shape.ts
+const UNHIDE_ICON_SIZE = 12;
+const UNHIDE_ARROW_RATIO = .4;
+var HeaderUnhideShape = class extends Shape {
+	constructor(key, props, onClick) {
+		super(key, props);
+		_defineProperty(this, "_size", 12);
+		_defineProperty(this, "_iconRatio", UNHIDE_ARROW_RATIO);
+		_defineProperty(this, "_hovered", true);
+		_defineProperty(this, "_hasPrevious", true);
+		_defineProperty(this, "_hasNext", true);
+		_defineProperty(this, "_unhideType", void 0);
+		if (props) this.setShapeProps(props);
+		this.onPointerEnter$.subscribeEvent(() => this.setShapeProps({ hovered: true }));
+		this.onPointerLeave$.subscribeEvent(() => this.setShapeProps({ hovered: false }));
+		this.onPointerDown$.subscribeEvent(() => onClick === null || onClick === void 0 ? void 0 : onClick());
+	}
+	setShapeProps(props) {
+		if (props.type !== void 0) this._unhideType = props.type;
+		if (props.hovered !== void 0) this._hovered = props.hovered;
+		if (props.hasPrevious !== void 0) this._hasPrevious = props.hasPrevious;
+		if (props.hasNext !== void 0) this._hasNext = props.hasNext;
+		this.transformByState({
+			width: this._size * (this._unhideType === 1 ? 2 : 1),
+			height: this._size * (this._unhideType === 0 ? 2 : 1)
+		});
+	}
+	_draw(ctx) {
+		if (this._unhideType === 0) this._drawOnRow(ctx);
+		else this._drawOnCol(ctx);
+	}
+	_drawOnRow(ctx) {
+		if (this._hovered) if (!this._hasNext || !this._hasPrevious) Rect.drawWith(ctx, {
+			width: this._size,
+			height: this._size,
+			stroke: HEADER_MENU_SHAPE_TRIANGLE_FILL,
+			fill: HEADER_MENU_BACKGROUND_COLOR
+		});
+		else Rect.drawWith(ctx, {
+			width: this._size,
+			height: 2 * this._size,
+			stroke: HEADER_MENU_SHAPE_TRIANGLE_FILL,
+			fill: HEADER_MENU_BACKGROUND_COLOR
+		});
+		const iconSize = this._size * .5 * this._iconRatio;
+		const sixtyDegree = Math.PI / 3;
+		const top = iconSize * Math.cos(sixtyDegree);
+		const left = iconSize * Math.sin(sixtyDegree);
+		if (this._hasPrevious) RegularPolygon.drawWith(ctx, {
+			pointsGroup: [[
+				{
+					x: this._size / 2,
+					y: this._size / 2 - left
+				},
+				{
+					x: this._size / 2 - left,
+					y: this._size / 2 + top
+				},
+				{
+					x: this._size / 2 + left,
+					y: this._size / 2 + top
+				}
+			]],
+			fill: HEADER_MENU_SHAPE_TRIANGLE_FILL
+		});
+		if (this._hasNext) {
+			const offset = this._hasPrevious ? 3 : 1;
+			RegularPolygon.drawWith(ctx, {
+				pointsGroup: [[
+					{
+						x: this._size / 2,
+						y: this._size * offset / 2 + left
+					},
+					{
+						x: this._size / 2 - left,
+						y: this._size * offset / 2 - top
+					},
+					{
+						x: this._size / 2 + left,
+						y: this._size * offset / 2 - top
+					}
+				]],
+				fill: HEADER_MENU_SHAPE_TRIANGLE_FILL
+			});
+		}
+	}
+	/**
+	*
+	* @param ctx
+	*/
+	_drawOnCol(ctx) {
+		if (this._hovered) if (!this._hasNext || !this._hasPrevious) Rect.drawWith(ctx, {
+			width: this._size,
+			height: this._size,
+			stroke: HEADER_MENU_SHAPE_TRIANGLE_FILL,
+			fill: HEADER_MENU_BACKGROUND_COLOR
+		});
+		else Rect.drawWith(ctx, {
+			width: 2 * this._size,
+			height: this._size,
+			stroke: HEADER_MENU_SHAPE_TRIANGLE_FILL,
+			fill: HEADER_MENU_BACKGROUND_COLOR
+		});
+		const iconSize = this._size * .5 * this._iconRatio;
+		const sixtyDegree = Math.PI / 3;
+		const top = iconSize * Math.cos(sixtyDegree);
+		const left = iconSize * Math.sin(sixtyDegree);
+		if (this._hasPrevious) RegularPolygon.drawWith(ctx, {
+			pointsGroup: [[
+				{
+					x: -top + this._size / 2,
+					y: this._size / 2
+				},
+				{
+					x: this._size / 2 + left,
+					y: this._size / 2 - left
+				},
+				{
+					x: this._size / 2 + left,
+					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) => {
+			var _visibleCheck;
+			return this._headerUnhideRangeService.shouldRenderRange((_visibleCheck = visibleCheck(true, payload)) !== null && _visibleCheck !== void 0 ? _visibleCheck : 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/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();
+	}
+	_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).filter((key) => key.startsWith(SHEET_EXTENSION_PREFIX)).length > 0) 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: "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,
@@ -14971,13 +15351,13 @@ let SheetRenderController = class SheetRenderController extends RxDisposable {
 			const spreadsheetRowHeader = components.get("__SpreadsheetRowHeader__");
 			const spreadsheetColumnHeader = components.get("__SpreadsheetColumnHeader__");
 			const spreadsheetLeftTopPlaceholder = components.get("__SpreadsheetLeftTopPlaceholder__");
-			const { rowHeaderWidth, columnHeaderHeight } = spreadsheetSkeleton;
+			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: rowHeaderWidth,
-				height: columnHeaderHeight
+				width: leftTopPlaceholderSize.width,
+				height: leftTopPlaceholderSize.height
 			});
 		}));
 	}
@@ -15097,6 +15477,13 @@ SheetRenderController = __decorate([
 	__decorateParam(4, ICommandService),
 	__decorateParam(5, Optional(ITelemetryService))
 ], SheetRenderController);
+function getLeftTopPlaceholderSize(skeleton) {
+	var _skeleton$rowHeaderWi, _skeleton$columnHeade;
+	return {
+		width: (_skeleton$rowHeaderWi = skeleton.rowHeaderWidthAndMarginLeft) !== null && _skeleton$rowHeaderWi !== void 0 ? _skeleton$rowHeaderWi : skeleton.rowHeaderWidth,
+		height: (_skeleton$columnHeade = skeleton.columnHeaderHeightAndMarginTop) !== null && _skeleton$columnHeade !== void 0 ? _skeleton$columnHeade : skeleton.columnHeaderHeight
+	};
+}
 
 //#endregion
 //#region src/components/border-panel/border-line/icons/BorderDashDot.tsx
@@ -16110,7 +16497,7 @@ function getBaseRangeMenuHidden$(accessor) {
 		var _selectionManagerServ;
 		const range = (_selectionManagerServ = selectionManagerService.getCurrentLastSelection()) === null || _selectionManagerServ === void 0 ? void 0 : _selectionManagerServ.range;
 		if (!range) return true;
-		const workbook = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 		if (!workbook || !worksheet) return true;
 		const unitId = workbook.getUnitId();
@@ -16133,7 +16520,7 @@ function getInsertBeforeMenuHidden$(accessor, type) {
 		var _selectionManagerServ3;
 		const range = (_selectionManagerServ3 = selectionManagerService.getCurrentLastSelection()) === null || _selectionManagerServ3 === void 0 ? void 0 : _selectionManagerServ3.range;
 		if (!range) return true;
-		const workbook = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 		if (!workbook || !worksheet) return true;
 		const unitId = workbook.getUnitId();
@@ -16161,7 +16548,7 @@ function getDeleteMenuHidden$(accessor, type) {
 		var _selectionManagerServ4;
 		const range = (_selectionManagerServ4 = selectionManagerService.getCurrentLastSelection()) === null || _selectionManagerServ4 === void 0 ? void 0 : _selectionManagerServ4.range;
 		if (!range) return true;
-		const workbook = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 		if (!workbook || !worksheet) return true;
 		const unitId = workbook.getUnitId();
@@ -16192,7 +16579,7 @@ function getCellMenuHidden$(accessor, type) {
 		var _selectionManagerServ5;
 		const range = (_selectionManagerServ5 = selectionManagerService.getCurrentLastSelection()) === null || _selectionManagerServ5 === void 0 ? void 0 : _selectionManagerServ5.range;
 		if (!range) return true;
-		const workbook = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 		if (!workbook || !worksheet) return true;
 		const unitId = workbook.getUnitId();
@@ -16292,7 +16679,6 @@ function ClearSelectionContentMenuItemFactory(accessor) {
 	return {
 		id: ClearSelectionContentCommand.id,
 		type: MenuItemType.BUTTON,
-		icon: "ClearFormatDoubleIcon",
 		title: "rightClick.clearContent",
 		disabled$: getObservableWithExclusiveRange$(accessor, getCurrentRangeDisable$(accessor, {
 			workbookTypes: [WorkbookEditablePermission],
@@ -16306,7 +16692,6 @@ function ClearSelectionFormatMenuItemFactory(accessor) {
 	return {
 		id: ClearSelectionFormatCommand.id,
 		type: MenuItemType.BUTTON,
-		icon: "ClearFormatDoubleIcon",
 		title: "rightClick.clearFormat",
 		disabled$: getCurrentRangeDisable$(accessor, {
 			workbookTypes: [WorkbookEditablePermission],
@@ -16316,11 +16701,28 @@ function ClearSelectionFormatMenuItemFactory(accessor) {
 		hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_SHEET)
 	};
 }
-function ClearSelectionAllMenuItemFactory(accessor) {
+function ClearSelectionAllToolbarMenuItemFactory(accessor) {
 	return {
 		id: ClearSelectionAllCommand.id,
 		type: MenuItemType.BUTTON,
 		icon: "ClearFormatDoubleIcon",
+		tooltip: "rightClick.clearAll",
+		disabled$: getObservableWithExclusiveRange$(accessor, getCurrentRangeDisable$(accessor, {
+			workbookTypes: [WorkbookEditablePermission],
+			worksheetTypes: [
+				WorksheetEditPermission,
+				WorksheetSetCellValuePermission,
+				WorksheetSetCellStylePermission
+			],
+			rangeTypes: [RangeProtectionPermissionEditPoint]
+		})),
+		hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_SHEET)
+	};
+}
+function ClearSelectionAllMenuItemFactory(accessor) {
+	return {
+		id: ClearSelectionAllCommand.id,
+		type: MenuItemType.BUTTON,
 		title: "rightClick.clearAll",
 		tooltip: "rightClick.clearAll",
 		disabled$: getObservableWithExclusiveRange$(accessor, getCurrentRangeDisable$(accessor, {
@@ -16627,7 +17029,7 @@ function ToggleGridlinesMenuFactory(accessor) {
 		icon: "HideGridlinesDoubleIcon",
 		activated$: new Observable((observer) => {
 			const getValue = () => {
-				const workbook = instanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+				const workbook = instanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 				if (workbook) return workbook.getActiveSheet().getConfig().showGridlines === BooleanNumber.TRUE;
 				return false;
 			};
@@ -18526,7 +18928,7 @@ function ShowMenuItemFactory(accessor) {
 		title: "sheetConfig.unhide",
 		disabled$: new Observable((subscriber) => {
 			function disableFunction() {
-				const worksheets = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET).getWorksheets();
+				const worksheets = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET).getWorksheets();
 				const visibleSheets = Array.from(worksheets.values());
 				subscriber.next(visibleSheets.length === 1);
 			}
@@ -18541,7 +18943,7 @@ function ShowMenuItemFactory(accessor) {
 	};
 }
 function disableFunction(univerInstanceService, subscriber) {
-	const worksheets = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET).getWorksheets();
+	const worksheets = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET).getWorksheets();
 	const visibleSheets = Array.from(worksheets.values()).filter((sheet) => sheet.getConfig().hidden === BooleanNumber.FALSE);
 	subscriber.next(visibleSheets.length === 1);
 }
@@ -18617,7 +19019,7 @@ const menuSchema = {
 			},
 			[ClearSelectionAllCommand.id]: {
 				order: 3,
-				menuItemFactory: ClearSelectionAllMenuItemFactory
+				menuItemFactory: ClearSelectionAllToolbarMenuItemFactory
 			}
 		},
 		[RibbonStartGroup.FORMAT]: {
@@ -19370,7 +19772,7 @@ let SheetCanvasPopManagerService = class SheetCanvasPopManagerService extends Di
 	*/
 	attachPopupToObject(targetObject, popup) {
 		var _this$_renderManagerS;
-		const workbook = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook.getActiveSheet();
 		if (!worksheet || this._isSelectionMoving && !popup.showOnSelectionMoving) return {
 			dispose: () => {},
@@ -19420,7 +19822,7 @@ let SheetCanvasPopManagerService = class SheetCanvasPopManagerService extends Di
 	}
 	attachPopupByPosition(bound, popup, location) {
 		var _this$_renderManagerS2;
-		let workbook = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		let workbook = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		let worksheet = workbook.getActiveSheet();
 		if (!worksheet) return null;
 		const unitId = workbook.getUnitId();
@@ -19461,7 +19863,7 @@ let SheetCanvasPopManagerService = class SheetCanvasPopManagerService extends Di
 	}
 	attachPopupToAbsolutePosition(bound, popup, _unitId, _subUnitId) {
 		var _this$_renderManagerS3;
-		const workbook = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook.getActiveSheet();
 		if (!worksheet) return null;
 		const unitId = workbook.getUnitId();
@@ -19566,7 +19968,7 @@ let SheetCanvasPopManagerService = class SheetCanvasPopManagerService extends Di
 	* @param showOnSelectionMoving
 	*/
 	attachRangePopup(range, popup, _unitId, _subUnitId, viewport, showOnSelectionMoving = false) {
-		const workbook = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook.getActiveSheet();
 		if (!worksheet) return null;
 		const unitId = workbook.getUnitId();
@@ -19913,7 +20315,7 @@ const CellPopup = (props) => {
 const DefinedNameInput = (props) => {
 	const { inputId, state = false, type = "range", confirm, cancel, name, formulaOrRefString, comment = "", localSheetId = SCOPE_WORKBOOK_VALUE_DEFINED_NAME, hidden = false, id } = props;
 	const univerInstanceService = useDependency(IUniverInstanceService);
-	const workbook = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+	const workbook = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 	const localeService = useDependency(LocaleService);
 	const definedNamesService = useDependency(IDefinedNamesService);
 	const superTableService = useDependency(ISuperTableService);
@@ -20707,7 +21109,7 @@ function DefinedNameOverlay({ search, isInputEvent }) {
 	const definedNamesService = useDependency(IDefinedNamesService);
 	const univerInstanceService = useDependency(IUniverInstanceService);
 	const sidebarService = useDependency(ISidebarService);
-	const unitId = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET).getUnitId();
+	const unitId = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET).getUnitId();
 	const getDefinedNameMap = () => {
 		const definedNameMap = definedNamesService.getDefinedNameMap(unitId);
 		if (definedNameMap) return Array.from(Object.values(definedNameMap));
@@ -22805,7 +23207,7 @@ function ZoomSlider() {
 	}, [commandService, getCurrentZoom]);
 	function handleChange(value) {
 		setZoom(value);
-		const workbook = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 		if (worksheet == null) return;
 		const zoomRatio = value / 100;
@@ -23858,14 +24260,14 @@ let StatusBarController = class StatusBarController extends Disposable {
 		return rawCell;
 	}
 	_calculateSelection(selections, primary) {
-		const workbook = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		if (!workbook) return this._clearResult();
 		const unitId = workbook.getUnitId();
 		const sheet = workbook.getActiveSheet();
 		const sheetId = sheet === null || sheet === void 0 ? void 0 : sheet.getSheetId();
 		if (!sheetId) return this._clearResult();
 		const sheetData = {};
-		this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET).getSheets().forEach((sheet) => {
+		this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET).getSheets().forEach((sheet) => {
 			const sheetConfig = sheet.getConfig();
 			sheetData[sheet.getSheetId()] = {
 				cellData: new ObjectMatrix(sheetConfig.cellData),
@@ -23961,7 +24363,7 @@ const useHighlightRange = (ranges = []) => {
 //#endregion
 //#region package.json
 var name = "@univerjs/sheets-ui";
-var version = "0.23.0";
+var version = "0.24.0";
 
 //#endregion
 //#region src/services/cell-alert-manager.service.ts
@@ -24209,7 +24611,7 @@ let SheetsDefinedNameController = class SheetsDefinedNameController extends Disp
 	_syncDefinedNameRange(params) {
 		if (params.length === 0) return;
 		const lastSelection = params[params.length - 1];
-		const workbook = this._instanceSrv.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = this._instanceSrv.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 		if (!worksheet) return;
 		this._definedNamesService.setCurrentRange({
@@ -24631,7 +25033,7 @@ let FormatPainterController = class FormatPainterController extends Disposable {
 		const range = selection === null || selection === void 0 ? void 0 : selection.range;
 		if (!range) return null;
 		const { startRow, endRow, startColumn, endColumn } = range;
-		const workbook = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 		if (!worksheet) return null;
 		const cellData = worksheet.getCellMatrix();
@@ -25389,7 +25791,7 @@ let SheetPermissionInterceptorCanvasRenderController = class SheetPermissionInte
 	_initFreezePermissionInterceptor() {
 		this.disposeWithMe(this._headerFreezeRenderController.interceptor.intercept(this._headerFreezeRenderController.interceptor.getInterceptPoints().FREEZE_PERMISSION_CHECK, { handler: (_, __) => {
 			var _this$_permissionServ5, _this$_permissionServ6;
-			const workbook = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+			const workbook = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 			if (!(workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet()) || !workbook) return false;
 			return (_this$_permissionServ5 = (_this$_permissionServ6 = this._permissionService.getPermissionPoint(new WorkbookEditablePermission(workbook.getUnitId()).id)) === null || _this$_permissionServ6 === void 0 ? void 0 : _this$_permissionServ6.value) !== null && _this$_permissionServ5 !== void 0 ? _this$_permissionServ5 : false;
 		} }));
@@ -25435,7 +25837,7 @@ let SheetPermissionInterceptorClipboardController = class SheetPermissionInterce
 					startColumn: startRange.startColumn + ranges.startColumn,
 					endColumn: startRange.startColumn + ranges.endColumn
 				};
-				const worksheet = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET).getActiveSheet();
+				const worksheet = this._univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET).getActiveSheet();
 				if (!worksheet) return false;
 				const { startRow, endRow, startColumn, endColumn } = targetRange;
 				let hasPermission = true;
@@ -25564,7 +25966,7 @@ const generateDefaultRule = (injector, fromSheetBar) => {
 	var _selectionManagerServ, _selectionManagerServ2;
 	const univerInstanceService = injector.get(IUniverInstanceService);
 	const selectionManagerService = injector.get(SheetsSelectionsService);
-	const workbook = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+	const workbook = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 	const worksheet = workbook.getActiveSheet();
 	let unitType = UnitObject.SelectRange;
 	let ranges = (_selectionManagerServ = (_selectionManagerServ2 = selectionManagerService.getCurrentSelections()) === null || _selectionManagerServ2 === void 0 ? void 0 : _selectionManagerServ2.map((s) => s.range)) !== null && _selectionManagerServ !== void 0 ? _selectionManagerServ : [];
@@ -25591,7 +25993,7 @@ const generateDefaultRule = (injector, fromSheetBar) => {
 	};
 };
 const generateRuleByUnitType = (injector, rule) => {
-	const worksheet = injector.get(IUniverInstanceService).getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET).getActiveSheet();
+	const worksheet = injector.get(IUniverInstanceService).getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET).getActiveSheet();
 	const { unitType } = rule;
 	if (unitType === UnitObject.Worksheet) return {
 		...rule,
@@ -25616,7 +26018,7 @@ const PermissionDetailFooterPart = (props) => {
 	const localeService = useDependency(LocaleService);
 	const commandService = useDependency(ICommandService);
 	const sheetPermissionUserManagerService = useDependency(SheetPermissionUserManagerService);
-	const workbook = useDependency(IUniverInstanceService).getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+	const workbook = useDependency(IUniverInstanceService).getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 	const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 	if (!workbook || !worksheet) return null;
 	const unitId = workbook.getUnitId();
@@ -25777,7 +26179,7 @@ const PermissionDetailMainPart = (props) => {
 	const univerInstanceService = useDependency(IUniverInstanceService);
 	const localeService = useDependency(LocaleService);
 	const injector = useDependency(Injector);
-	const workbook = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+	const workbook = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 	const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 	if (!workbook || !worksheet) return null;
 	const unitId = workbook.getUnitId();
@@ -25785,7 +26187,7 @@ const PermissionDetailMainPart = (props) => {
 	const handleRangeChange = (rangeText) => {
 		const newRange = rangeText.split(",").map(deserializeRangeWithSheet).map((item) => item.range);
 		if (newRange.some((i) => !isValidRange(i) || i.endColumn < i.startColumn || i.endRow < i.startRow)) return;
-		const workbook = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 		if (!workbook || !worksheet) return;
 		const unitId = workbook.getUnitId();
@@ -25847,7 +26249,7 @@ const PermissionDetailUserPart = (props) => {
 	const userManagerService = useDependency(UserManagerService);
 	const univerInstanceService = useDependency(IUniverInstanceService);
 	const selectUserList = useObservable(sheetPermissionUserManagerService.selectUserList$, sheetPermissionUserManagerService.selectUserList);
-	const workbook = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+	const workbook = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 	const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 	if (!workbook || !worksheet) return null;
 	const unitId = workbook.getUnitId();
@@ -26420,7 +26822,7 @@ const SheetPermissionDialog = () => {
 	const worksheetProtectionPointRuleModel = useDependency(WorksheetProtectionPointModel);
 	const dialogService = useDependency(IDialogService);
 	const permissionService = useDependency(IPermissionService);
-	const workbook = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+	const workbook = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 	const worksheet = workbook.getActiveSheet();
 	if (!worksheet) throw new Error("No active sheet found");
 	const [collaborators, setCollaborators] = useState([]);
@@ -26471,7 +26873,7 @@ const SheetPermissionDialog = () => {
 		getPermissionPoints();
 	}, []);
 	const handleChangeActionPermission = async () => {
-		const workbook = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
+		const workbook = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_SHEET);
 		const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getActiveSheet();
 		if (!worksheet) throw new Error("No active sheet found");
 		const unitId = workbook.getUnitId();
@@ -26860,694 +27262,398 @@ var WorksheetProtectionRenderExtension = class extends SheetExtension {
 	}
 	/**
 	* Get the current shadow strategy
-	*/
-	getShadowStrategy() {
-		return this._shadowStrategy;
-	}
-	setZIndex(zIndex) {
-		this.Z_INDEX = zIndex;
-	}
-};
-
-//#endregion
-//#region src/controllers/permission/sheet-permission-render.controller.ts
-let SheetPermissionRenderManagerController = class SheetPermissionRenderManagerController extends Disposable {
-	constructor(_injector, _componentManager) {
-		super();
-		this._injector = _injector;
-		this._componentManager = _componentManager;
-		this._init();
-	}
-	_init() {
-		this._initComponents();
-		this._initUiPartComponents();
-	}
-	_initComponents() {
-		[
-			[permissionMenuIconKey, ProtectIcon],
-			[permissionDeleteIconKey, DeleteIcon],
-			[permissionEditIconKey, WriteIcon],
-			[permissionCheckIconKey, CheckMarkIcon],
-			[permissionLockIconKey, LockIcon],
-			[UNIVER_SHEET_PERMISSION_PANEL, SheetPermissionPanel],
-			[UNIVER_SHEET_PERMISSION_USER_DIALOG, SheetPermissionUserDialog],
-			[UNIVER_SHEET_PERMISSION_DIALOG, SheetPermissionDialog],
-			[UNIVER_SHEET_PERMISSION_ALERT_DIALOG, AlertDialog]
-		].forEach(([key, comp]) => {
-			this.disposeWithMe(this._componentManager.register(key, comp));
-		});
-	}
-	_initUiPartComponents() {
-		const config = this._injector.get(IConfigService).getConfig(SHEETS_UI_PLUGIN_CONFIG_KEY);
-		if (config === null || config === void 0 ? void 0 : config.protectedRangeUserSelector) {
-			const { component, framework } = config.protectedRangeUserSelector;
-			this.disposeWithMe(this._componentManager.register(UNIVER_SHEET_PERMISSION_USER_PART, component, { framework }));
-		}
-	}
-};
-SheetPermissionRenderManagerController = __decorate([__decorateParam(0, Inject(Injector)), __decorateParam(1, Inject(ComponentManager))], SheetPermissionRenderManagerController);
-let SheetPermissionRenderController = class SheetPermissionRenderController extends Disposable {
-	constructor(_context, _rangeProtectionRuleModel, _sheetSkeletonManagerService, _permissionService, _configService) {
-		super();
-		this._context = _context;
-		this._rangeProtectionRuleModel = _rangeProtectionRuleModel;
-		this._sheetSkeletonManagerService = _sheetSkeletonManagerService;
-		this._permissionService = _permissionService;
-		this._configService = _configService;
-		_defineProperty(this, "_rangeProtectionCanViewRenderExtension", void 0);
-		_defineProperty(this, "_rangeProtectionCanNotViewRenderExtension", void 0);
-		const config = this._configService.getConfig(SHEETS_UI_PLUGIN_CONFIG_KEY);
-		const shadowStrategy = convertToShadowStrategy(config === null || config === void 0 ? void 0 : config.protectedRangeShadow);
-		this._rangeProtectionCanViewRenderExtension = new RangeProtectionCanViewRenderExtension(shadowStrategy);
-		this._rangeProtectionCanNotViewRenderExtension = new RangeProtectionCanNotViewRenderExtension(shadowStrategy);
-		this._initSkeleton();
-		this._initRender();
-		this.disposeWithMe(this._rangeProtectionRuleModel.ruleChange$.subscribe((info) => {
-			var _info$oldRule, _info$oldRule2;
-			if (((_info$oldRule = info.oldRule) === null || _info$oldRule === void 0 ? void 0 : _info$oldRule.id) && this._rangeProtectionCanViewRenderExtension.renderCache.has(info.oldRule.id) || this._rangeProtectionCanViewRenderExtension.renderCache.has(info.rule.id)) this._rangeProtectionCanViewRenderExtension.clearCache();
-			if (((_info$oldRule2 = info.oldRule) === null || _info$oldRule2 === void 0 ? void 0 : _info$oldRule2.id) && this._rangeProtectionCanNotViewRenderExtension.renderCache.has(info.oldRule.id) || this._rangeProtectionCanNotViewRenderExtension.renderCache.has(info.rule.id)) this._rangeProtectionCanNotViewRenderExtension.clearCache();
-		}));
-	}
-	_initRender() {
-		const spreadsheetRender = this._context.mainComponent;
-		if (spreadsheetRender) {
-			if (!spreadsheetRender.getExtensionByKey("RANGE_PROTECTION_CAN_VIEW_RENDER_EXTENSION_KEY")) spreadsheetRender.register(this._rangeProtectionCanViewRenderExtension);
-			if (!spreadsheetRender.getExtensionByKey("RANGE_PROTECTION_CAN_NOT_VIEW_RENDER_EXTENSION_KEY")) spreadsheetRender.register(this._rangeProtectionCanNotViewRenderExtension);
-		}
-	}
-	_initSkeleton() {
-		const markDirtySkeleton = () => {
-			var _this$_context$mainCo;
-			this._sheetSkeletonManagerService.reCalculate();
-			(_this$_context$mainCo = this._context.mainComponent) === null || _this$_context$mainCo === void 0 || _this$_context$mainCo.makeDirty();
-		};
-		this.disposeWithMe(merge$1(this._permissionService.permissionPointUpdate$.pipe(throttleTime(300, void 0, { trailing: true })), this._rangeProtectionRuleModel.rangeRuleInitStateChange$, this._rangeProtectionRuleModel.ruleChange$).pipe().subscribe(markDirtySkeleton));
-	}
-};
-SheetPermissionRenderController = __decorate([
-	__decorateParam(1, Inject(RangeProtectionRuleModel)),
-	__decorateParam(2, Inject(SheetSkeletonManagerService)),
-	__decorateParam(3, IPermissionService),
-	__decorateParam(4, IConfigService)
-], SheetPermissionRenderController);
-let WorksheetProtectionRenderController = class WorksheetProtectionRenderController extends Disposable {
-	constructor(_context, _renderManagerService, _sheetSkeletonManagerService, _worksheetProtectionRuleModel, _configService) {
-		super();
-		this._context = _context;
-		this._renderManagerService = _renderManagerService;
-		this._sheetSkeletonManagerService = _sheetSkeletonManagerService;
-		this._worksheetProtectionRuleModel = _worksheetProtectionRuleModel;
-		this._configService = _configService;
-		_defineProperty(this, "_worksheetProtectionRenderExtension", void 0);
-		const config = this._configService.getConfig(SHEETS_UI_PLUGIN_CONFIG_KEY);
-		const shadowStrategy = convertToShadowStrategy(config === null || config === void 0 ? void 0 : config.protectedRangeShadow);
-		this._worksheetProtectionRenderExtension = new WorksheetProtectionRenderExtension(shadowStrategy);
-		this._initSkeleton();
-		if (shadowStrategy === "none") return;
-		this._initRender();
-	}
-	_initRender() {
-		const renderId = this._context.unitId;
-		const render = renderId && this._renderManagerService.getRenderById(renderId);
-		const spreadsheetRender = render && render.mainComponent;
-		if (spreadsheetRender) {
-			if (!spreadsheetRender.getExtensionByKey("worksheet-protection")) spreadsheetRender.register(this._worksheetProtectionRenderExtension);
-		}
-	}
-	_initSkeleton() {
-		const markDirtySkeleton = () => {
-			var _this$_context$mainCo2;
-			this._sheetSkeletonManagerService.reCalculate();
-			(_this$_context$mainCo2 = this._context.mainComponent) === null || _this$_context$mainCo2 === void 0 || _this$_context$mainCo2.makeDirty();
-		};
-		this.disposeWithMe(merge$1(this._worksheetProtectionRuleModel.worksheetRuleInitStateChange$).pipe().subscribe(markDirtySkeleton));
-	}
-};
-WorksheetProtectionRenderController = __decorate([
-	__decorateParam(1, Inject(IRenderManagerService)),
-	__decorateParam(2, Inject(SheetSkeletonManagerService)),
-	__decorateParam(3, Inject(WorksheetProtectionRuleModel)),
-	__decorateParam(4, Inject(IConfigService))
-], WorksheetProtectionRenderController);
-
-//#endregion
-//#region src/controllers/render-controllers/clipboard.render-controller.ts
-let ClipboardRenderController = class ClipboardRenderController extends Disposable {
-	constructor(_context, _sheetSkeletonManagerService, _sheetClipboardService, _sheetClipboardController) {
-		super();
-		this._context = _context;
-		this._sheetSkeletonManagerService = _sheetSkeletonManagerService;
-		this._sheetClipboardService = _sheetClipboardService;
-		this._sheetClipboardController = _sheetClipboardController;
-		this._initialize();
-	}
-	_initialize() {
-		this.disposeWithMe(toDisposable(this._sheetSkeletonManagerService.currentSkeleton$.subscribe((skeleton) => {
-			if (!(skeleton === null || skeleton === void 0 ? void 0 : skeleton.unitId)) return;
-			if (!this._sheetClipboardService.getPasteMenuVisible()) return;
-			const pasteOptionsCache = this._sheetClipboardService.getPasteOptionsCache();
-			const menuUnitId = pasteOptionsCache === null || pasteOptionsCache === void 0 ? void 0 : pasteOptionsCache.target.unitId;
-			if (skeleton.unitId === menuUnitId) this._sheetClipboardController.refreshOptionalPaste();
-		})));
-	}
-};
-ClipboardRenderController = __decorate([
-	__decorateParam(1, Inject(SheetSkeletonManagerService)),
-	__decorateParam(2, ISheetClipboardService),
-	__decorateParam(3, Inject(SheetClipboardController))
-], ClipboardRenderController);
-
-//#endregion
-//#region src/controllers/render-controllers/format-painter.render-controller.ts
-let FormatPainterRenderController = class FormatPainterRenderController extends Disposable {
-	constructor(_context, _formatPainterService, _selectionRenderService, _commandService) {
-		super();
-		this._context = _context;
-		this._formatPainterService = _formatPainterService;
-		this._selectionRenderService = _selectionRenderService;
-		this._commandService = _commandService;
-		this._initialize();
-	}
-	_initialize() {
-		this._bindFormatPainterStatus();
-		this._commandExecutedListener();
-	}
-	_commandExecutedListener() {
-		this.disposeWithMe(this._selectionRenderService.selectionMoveEnd$.subscribe((selections) => {
-			if (this._formatPainterService.getStatus() !== 0) {
-				var _this$_context$unit$g;
-				const { rangeWithCoord } = selections[selections.length - 1];
-				this._commandService.executeCommand(ApplyFormatPainterCommand.id, {
-					unitId: this._context.unitId,
-					subUnitId: ((_this$_context$unit$g = this._context.unit.getActiveSheet()) === null || _this$_context$unit$g === void 0 ? void 0 : _this$_context$unit$g.getSheetId()) || "",
-					range: {
-						startRow: rangeWithCoord.startRow,
-						startColumn: rangeWithCoord.startColumn,
-						endRow: rangeWithCoord.endRow,
-						endColumn: rangeWithCoord.endColumn
-					}
-				});
-				if (this._formatPainterService.getStatus() === 1) this._commandService.executeCommand(SetOnceFormatPainterCommand.id);
-			}
-		}));
-	}
-	_bindFormatPainterStatus() {
-		this.disposeWithMe(toDisposable(this._formatPainterService.status$.subscribe((status) => {
-			const scene = this._context.scene;
-			if (!scene) return;
-			if (status !== 0) scene.setDefaultCursor(CURSOR_TYPE.CELL);
-			else scene.setDefaultCursor(CURSOR_TYPE.DEFAULT);
-		})));
+	*/
+	getShadowStrategy() {
+		return this._shadowStrategy;
+	}
+	setZIndex(zIndex) {
+		this.Z_INDEX = zIndex;
 	}
 };
-FormatPainterRenderController = __decorate([
-	__decorateParam(1, IFormatPainterService),
-	__decorateParam(2, ISheetSelectionRenderService),
-	__decorateParam(3, ICommandService)
-], FormatPainterRenderController);
 
 //#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)";
-var HeaderMenuShape = class extends Shape {
-	constructor(key, props) {
-		super(key, props);
-		_defineProperty(this, "_size", 12);
-		_defineProperty(this, "_iconRatio", .4);
-		_defineProperty(this, "_mode", 0);
-		this.setShapeProps(props);
+//#region src/controllers/permission/sheet-permission-render.controller.ts
+let SheetPermissionRenderManagerController = class SheetPermissionRenderManagerController extends Disposable {
+	constructor(_injector, _componentManager) {
+		super();
+		this._injector = _injector;
+		this._componentManager = _componentManager;
+		this._init();
 	}
-	setShapeProps(props) {
-		if (props === null || props === void 0 ? void 0 : props.size) this._size = props.size;
-		if (props === null || props === void 0 ? void 0 : props.mode) this._mode = props.mode;
-		this.transformByState({
-			width: this._size,
-			height: this._size
-		});
+	_init() {
+		this._initComponents();
+		this._initUiPartComponents();
 	}
-	_draw(ctx) {
-		if (this._mode === 1) Rect.drawWith(ctx, {
-			width: this._size,
-			height: this._size,
-			radius: this._size,
-			fill: HEADER_MENU_SHAPE_CIRCLE_FILL
-		});
-		const iconSize = this._size * .5 * this._iconRatio;
-		const sixtyDegree = Math.PI / 180 * 60;
-		const left = iconSize * Math.sin(sixtyDegree);
-		const top = iconSize * Math.cos(sixtyDegree);
-		RegularPolygon.drawWith(ctx, {
-			pointsGroup: [[
-				{
-					x: -left + this._size / 2,
-					y: -top + this._size / 2
-				},
-				{
-					x: left + this._size / 2,
-					y: -top + this._size / 2
-				},
-				{
-					x: this._size / 2,
-					y: iconSize + this._size / 2
-				}
-			]],
-			fill: HEADER_MENU_SHAPE_TRIANGLE_FILL
+	_initComponents() {
+		[
+			[permissionMenuIconKey, ProtectIcon],
+			[permissionDeleteIconKey, DeleteIcon],
+			[permissionEditIconKey, WriteIcon],
+			[permissionCheckIconKey, CheckMarkIcon],
+			[permissionLockIconKey, LockIcon],
+			[UNIVER_SHEET_PERMISSION_PANEL, SheetPermissionPanel],
+			[UNIVER_SHEET_PERMISSION_USER_DIALOG, SheetPermissionUserDialog],
+			[UNIVER_SHEET_PERMISSION_DIALOG, SheetPermissionDialog],
+			[UNIVER_SHEET_PERMISSION_ALERT_DIALOG, AlertDialog]
+		].forEach(([key, comp]) => {
+			this.disposeWithMe(this._componentManager.register(key, comp));
 		});
 	}
+	_initUiPartComponents() {
+		const config = this._injector.get(IConfigService).getConfig(SHEETS_UI_PLUGIN_CONFIG_KEY);
+		if (config === null || config === void 0 ? void 0 : config.protectedRangeUserSelector) {
+			const { component, framework } = config.protectedRangeUserSelector;
+			this.disposeWithMe(this._componentManager.register(UNIVER_SHEET_PERMISSION_USER_PART, component, { framework }));
+		}
+	}
 };
-
-//#endregion
-//#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)";
-let HeaderMenuRenderController = class HeaderMenuRenderController extends Disposable {
-	constructor(_context, _sheetSkeletonManagerService, _contextMenuService, _commandService, _selectionManagerService) {
+SheetPermissionRenderManagerController = __decorate([__decorateParam(0, Inject(Injector)), __decorateParam(1, Inject(ComponentManager))], SheetPermissionRenderManagerController);
+let SheetPermissionRenderController = class SheetPermissionRenderController extends Disposable {
+	constructor(_context, _rangeProtectionRuleModel, _sheetSkeletonManagerService, _permissionService, _configService) {
 		super();
 		this._context = _context;
+		this._rangeProtectionRuleModel = _rangeProtectionRuleModel;
 		this._sheetSkeletonManagerService = _sheetSkeletonManagerService;
-		this._contextMenuService = _contextMenuService;
-		this._commandService = _commandService;
-		this._selectionManagerService = _selectionManagerService;
-		_defineProperty(this, "_hoverRect", void 0);
-		_defineProperty(this, "_hoverMenu", void 0);
-		_defineProperty(this, "_currentColumn", Number.POSITIVE_INFINITY);
-		_defineProperty(this, "_headerPointerSubs", void 0);
-		_defineProperty(this, "_colHeaderPointerSubs", void 0);
-		this._initialize();
-	}
-	dispose() {
-		var _this$_hoverRect, _this$_hoverMenu, _this$_headerPointerS;
-		(_this$_hoverRect = this._hoverRect) === null || _this$_hoverRect === void 0 || _this$_hoverRect.dispose();
-		(_this$_hoverMenu = this._hoverMenu) === null || _this$_hoverMenu === void 0 || _this$_hoverMenu.dispose();
-		(_this$_headerPointerS = this._headerPointerSubs) === null || _this$_headerPointerS === void 0 || _this$_headerPointerS.unsubscribe();
-		this._headerPointerSubs = null;
+		this._permissionService = _permissionService;
+		this._configService = _configService;
+		_defineProperty(this, "_rangeProtectionCanViewRenderExtension", void 0);
+		_defineProperty(this, "_rangeProtectionCanNotViewRenderExtension", void 0);
+		const config = this._configService.getConfig(SHEETS_UI_PLUGIN_CONFIG_KEY);
+		const shadowStrategy = convertToShadowStrategy(config === null || config === void 0 ? void 0 : config.protectedRangeShadow);
+		this._rangeProtectionCanViewRenderExtension = new RangeProtectionCanViewRenderExtension(shadowStrategy);
+		this._rangeProtectionCanNotViewRenderExtension = new RangeProtectionCanNotViewRenderExtension(shadowStrategy);
+		this._initSkeleton();
+		this._initRender();
+		this.disposeWithMe(this._rangeProtectionRuleModel.ruleChange$.subscribe((info) => {
+			var _info$oldRule, _info$oldRule2;
+			if (((_info$oldRule = info.oldRule) === null || _info$oldRule === void 0 ? void 0 : _info$oldRule.id) && this._rangeProtectionCanViewRenderExtension.renderCache.has(info.oldRule.id) || this._rangeProtectionCanViewRenderExtension.renderCache.has(info.rule.id)) this._rangeProtectionCanViewRenderExtension.clearCache();
+			if (((_info$oldRule2 = info.oldRule) === null || _info$oldRule2 === void 0 ? void 0 : _info$oldRule2.id) && this._rangeProtectionCanNotViewRenderExtension.renderCache.has(info.oldRule.id) || this._rangeProtectionCanNotViewRenderExtension.renderCache.has(info.rule.id)) this._rangeProtectionCanNotViewRenderExtension.clearCache();
+		}));
 	}
-	_initialize() {
-		const scene = this._context.scene;
-		this._hoverRect = new Rect(HEADER_MENU_CONTROLLER_SHAPE, {
-			fill: HEADER_MENU_CONTROLLER_SHAPE_COLOR,
-			evented: false
-		});
-		this._hoverMenu = new HeaderMenuShape(HEADER_MENU_CONTROLLER_MENU, {
-			zIndex: 100,
-			visible: false
-		});
-		scene.addObjects([this._hoverRect, this._hoverMenu], 10);
-		this._initialHover(0);
-		this._initialHover(1);
-		this._initialHoverMenu();
+	_initRender() {
+		const spreadsheetRender = this._context.mainComponent;
+		if (spreadsheetRender) {
+			if (!spreadsheetRender.getExtensionByKey("RANGE_PROTECTION_CAN_VIEW_RENDER_EXTENSION_KEY")) spreadsheetRender.register(this._rangeProtectionCanViewRenderExtension);
+			if (!spreadsheetRender.getExtensionByKey("RANGE_PROTECTION_CAN_NOT_VIEW_RENDER_EXTENSION_KEY")) spreadsheetRender.register(this._rangeProtectionCanNotViewRenderExtension);
+		}
 	}
-	_initialHover(initialType = 0) {
-		var _this$_headerPointerS2, _this$_headerPointerS3, _this$_headerPointerS4;
-		const spreadsheetColumnHeader = this._context.components.get("__SpreadsheetColumnHeader__");
-		const spreadsheetRowHeader = this._context.components.get("__SpreadsheetRowHeader__");
-		const eventBindingObject = initialType === 0 ? spreadsheetRowHeader : spreadsheetColumnHeader;
-		const pointerMoveHandler = (evt) => {
-			var _this$_sheetSkeletonM;
-			const skeleton = (_this$_sheetSkeletonM = this._sheetSkeletonManagerService.getCurrentParam()) === null || _this$_sheetSkeletonM === void 0 ? void 0 : _this$_sheetSkeletonM.skeleton;
-			if (skeleton == null) return;
-			const { rowHeaderWidth, columnHeaderHeight } = skeleton;
-			const { startX, startY, endX, endY, column } = getCoordByOffset(evt.offsetX, evt.offsetY, this._context.scene, skeleton);
-			if (initialType === 0) {
-				var _this$_hoverRect2;
-				(_this$_hoverRect2 = this._hoverRect) === null || _this$_hoverRect2 === void 0 || _this$_hoverRect2.transformByState({
-					width: rowHeaderWidth,
-					height: endY - startY,
-					left: 0,
-					top: startY
-				});
-			} else {
-				var _this$_hoverRect3;
-				this._currentColumn = column;
-				(_this$_hoverRect3 = this._hoverRect) === null || _this$_hoverRect3 === void 0 || _this$_hoverRect3.transformByState({
-					width: endX - startX,
-					height: columnHeaderHeight,
-					left: startX,
-					top: 0
-				});
-				if (this._hoverMenu == null) return;
-				if (endX - startX < columnHeaderHeight * 2) {
-					this._hoverMenu.hide();
-					return;
-				}
-				const menuSize = columnHeaderHeight * .8;
-				this._hoverMenu.transformByState({
-					left: endX - columnHeaderHeight,
-					top: columnHeaderHeight / 2 - menuSize / 2
-				});
-				this._hoverMenu.setShapeProps({ size: menuSize });
-				this._hoverMenu.show();
-			}
-		};
-		const pointerEnterHandler = () => {
-			var _this$_hoverRect4;
-			(_this$_hoverRect4 = this._hoverRect) === null || _this$_hoverRect4 === void 0 || _this$_hoverRect4.show();
-		};
-		const pointerLeaveHandler = () => {
-			var _this$_hoverRect5, _this$_hoverMenu2;
-			(_this$_hoverRect5 = this._hoverRect) === null || _this$_hoverRect5 === void 0 || _this$_hoverRect5.hide();
-			(_this$_hoverMenu2 = this._hoverMenu) === null || _this$_hoverMenu2 === void 0 || _this$_hoverMenu2.hide();
+	_initSkeleton() {
+		const markDirtySkeleton = () => {
+			var _this$_context$mainCo;
+			this._sheetSkeletonManagerService.reCalculate();
+			(_this$_context$mainCo = this._context.mainComponent) === null || _this$_context$mainCo === void 0 || _this$_context$mainCo.makeDirty();
 		};
-		this._headerPointerSubs = new Subscription();
-		const headerPointerMoveSub = eventBindingObject.onPointerMove$.subscribeEvent(pointerMoveHandler);
-		const headerPointerEnterSub = eventBindingObject.onPointerEnter$.subscribeEvent(pointerEnterHandler);
-		const headerPointerLeaveSub = eventBindingObject.onPointerLeave$.subscribeEvent(pointerLeaveHandler);
-		(_this$_headerPointerS2 = this._headerPointerSubs) === null || _this$_headerPointerS2 === void 0 || _this$_headerPointerS2.add(headerPointerMoveSub);
-		(_this$_headerPointerS3 = this._headerPointerSubs) === null || _this$_headerPointerS3 === void 0 || _this$_headerPointerS3.add(headerPointerEnterSub);
-		(_this$_headerPointerS4 = this._headerPointerSubs) === null || _this$_headerPointerS4 === void 0 || _this$_headerPointerS4.add(headerPointerLeaveSub);
+		this.disposeWithMe(merge$1(this._permissionService.permissionPointUpdate$.pipe(throttleTime(300, void 0, { trailing: true })), this._rangeProtectionRuleModel.rangeRuleInitStateChange$, this._rangeProtectionRuleModel.ruleChange$).pipe().subscribe(markDirtySkeleton));
 	}
-	_initialHoverMenu() {
-		if (this._hoverMenu == null) return;
-		this._hoverMenu.onPointerEnter$.subscribeEvent(() => {
-			if (this._hoverMenu == null) return;
-			this._hoverMenu.setProps({
-				mode: 1,
-				visible: true
-			});
-			this._context.scene.setCursor(CURSOR_TYPE.POINTER);
-		});
-		this._hoverMenu.onPointerLeave$.subscribeEvent(() => {
-			if (this._hoverMenu == null) return;
-			this._hoverMenu.setProps({
-				mode: 0,
-				visible: false
-			});
-			this._context.scene.resetCursor();
-		});
-		this._hoverMenu.onPointerDown$.subscribeEvent((evt) => {
-			var _this$_selectionManag;
-			const currentColumn = this._currentColumn;
-			const currentSelectionDatas = (_this$_selectionManag = this._selectionManagerService.getCurrentSelections()) === null || _this$_selectionManag === void 0 ? void 0 : _this$_selectionManag.map((s) => s.range);
-			if (!!!(currentSelectionDatas === null || currentSelectionDatas === void 0 ? void 0 : currentSelectionDatas.filter((range) => range.rangeType === RANGE_TYPE.COLUMN).find((data) => {
-				const { startColumn, endColumn } = data;
-				if (currentColumn >= startColumn && currentColumn <= endColumn) return true;
-				return false;
-			}))) {
-				const selection = this._getSelectionOnColumn(currentColumn);
-				this._commandService.syncExecuteCommand(SetSelectionsOperation.id, selection);
-			}
-			evt.stopPropagation();
-			evt.preventDefault();
-			this._contextMenuService.triggerContextMenu(evt, ContextMenuPosition.COL_HEADER);
-		});
+};
+SheetPermissionRenderController = __decorate([
+	__decorateParam(1, Inject(RangeProtectionRuleModel)),
+	__decorateParam(2, Inject(SheetSkeletonManagerService)),
+	__decorateParam(3, IPermissionService),
+	__decorateParam(4, IConfigService)
+], SheetPermissionRenderController);
+let WorksheetProtectionRenderController = class WorksheetProtectionRenderController extends Disposable {
+	constructor(_context, _renderManagerService, _sheetSkeletonManagerService, _worksheetProtectionRuleModel, _configService) {
+		super();
+		this._context = _context;
+		this._renderManagerService = _renderManagerService;
+		this._sheetSkeletonManagerService = _sheetSkeletonManagerService;
+		this._worksheetProtectionRuleModel = _worksheetProtectionRuleModel;
+		this._configService = _configService;
+		_defineProperty(this, "_worksheetProtectionRenderExtension", void 0);
+		const config = this._configService.getConfig(SHEETS_UI_PLUGIN_CONFIG_KEY);
+		const shadowStrategy = convertToShadowStrategy(config === null || config === void 0 ? void 0 : config.protectedRangeShadow);
+		this._worksheetProtectionRenderExtension = new WorksheetProtectionRenderExtension(shadowStrategy);
+		this._initSkeleton();
+		if (shadowStrategy === "none") return;
+		this._initRender();
 	}
-	_getSelectionOnColumn(column) {
-		const workbook = this._context.unit;
-		const worksheet = workbook.getActiveSheet();
-		if (!worksheet) throw new Error("No active worksheet");
-		return {
-			unitId: workbook.getUnitId(),
-			subUnitId: worksheet.getSheetId(),
-			selections: [{
-				range: {
-					startRow: 0,
-					startColumn: column,
-					endRow: worksheet.getRowCount() - 1,
-					endColumn: column,
-					rangeType: RANGE_TYPE.COLUMN
-				},
-				primary: {
-					startRow: 0,
-					startColumn: column,
-					endRow: 0,
-					endColumn: column,
-					actualRow: 0,
-					actualColumn: column,
-					isMerged: false,
-					isMergedMainCell: false
-				},
-				style: null
-			}]
+	_initRender() {
+		const renderId = this._context.unitId;
+		const render = renderId && this._renderManagerService.getRenderById(renderId);
+		const spreadsheetRender = render && render.mainComponent;
+		if (spreadsheetRender) {
+			if (!spreadsheetRender.getExtensionByKey("worksheet-protection")) spreadsheetRender.register(this._worksheetProtectionRenderExtension);
+		}
+	}
+	_initSkeleton() {
+		const markDirtySkeleton = () => {
+			var _this$_context$mainCo2;
+			this._sheetSkeletonManagerService.reCalculate();
+			(_this$_context$mainCo2 = this._context.mainComponent) === null || _this$_context$mainCo2 === void 0 || _this$_context$mainCo2.makeDirty();
 		};
+		this.disposeWithMe(merge$1(this._worksheetProtectionRuleModel.worksheetRuleInitStateChange$).pipe().subscribe(markDirtySkeleton));
 	}
 };
-HeaderMenuRenderController = __decorate([
-	__decorateParam(1, Inject(SheetSkeletonManagerService)),
-	__decorateParam(2, IContextMenuService),
-	__decorateParam(3, ICommandService),
-	__decorateParam(4, Inject(SheetsSelectionsService))
-], HeaderMenuRenderController);
+WorksheetProtectionRenderController = __decorate([
+	__decorateParam(1, Inject(IRenderManagerService)),
+	__decorateParam(2, Inject(SheetSkeletonManagerService)),
+	__decorateParam(3, Inject(WorksheetProtectionRuleModel)),
+	__decorateParam(4, Inject(IConfigService))
+], WorksheetProtectionRenderController);
 
 //#endregion
-//#region src/views/header-unhide-shape.ts
-const UNHIDE_ICON_SIZE = 12;
-const UNHIDE_ARROW_RATIO = .4;
-var HeaderUnhideShape = class extends Shape {
-	constructor(key, props, onClick) {
-		super(key, props);
-		_defineProperty(this, "_size", 12);
-		_defineProperty(this, "_iconRatio", UNHIDE_ARROW_RATIO);
-		_defineProperty(this, "_hovered", true);
-		_defineProperty(this, "_hasPrevious", true);
-		_defineProperty(this, "_hasNext", true);
-		_defineProperty(this, "_unhideType", void 0);
-		if (props) this.setShapeProps(props);
-		this.onPointerEnter$.subscribeEvent(() => this.setShapeProps({ hovered: true }));
-		this.onPointerLeave$.subscribeEvent(() => this.setShapeProps({ hovered: false }));
-		this.onPointerDown$.subscribeEvent(() => onClick === null || onClick === void 0 ? void 0 : onClick());
+//#region src/controllers/render-controllers/clipboard.render-controller.ts
+let ClipboardRenderController = class ClipboardRenderController extends Disposable {
+	constructor(_context, _sheetSkeletonManagerService, _sheetClipboardService, _sheetClipboardController) {
+		super();
+		this._context = _context;
+		this._sheetSkeletonManagerService = _sheetSkeletonManagerService;
+		this._sheetClipboardService = _sheetClipboardService;
+		this._sheetClipboardController = _sheetClipboardController;
+		this._initialize();
 	}
-	setShapeProps(props) {
-		if (props.type !== void 0) this._unhideType = props.type;
-		if (props.hovered !== void 0) this._hovered = props.hovered;
-		if (props.hasPrevious !== void 0) this._hasPrevious = props.hasPrevious;
-		if (props.hasNext !== void 0) this._hasNext = props.hasNext;
-		this.transformByState({
-			width: this._size * (this._unhideType === 1 ? 2 : 1),
-			height: this._size * (this._unhideType === 0 ? 2 : 1)
-		});
+	_initialize() {
+		this.disposeWithMe(toDisposable(this._sheetSkeletonManagerService.currentSkeleton$.subscribe((skeleton) => {
+			if (!(skeleton === null || skeleton === void 0 ? void 0 : skeleton.unitId)) return;
+			if (!this._sheetClipboardService.getPasteMenuVisible()) return;
+			const pasteOptionsCache = this._sheetClipboardService.getPasteOptionsCache();
+			const menuUnitId = pasteOptionsCache === null || pasteOptionsCache === void 0 ? void 0 : pasteOptionsCache.target.unitId;
+			if (skeleton.unitId === menuUnitId) this._sheetClipboardController.refreshOptionalPaste();
+		})));
 	}
-	_draw(ctx) {
-		if (this._unhideType === 0) this._drawOnRow(ctx);
-		else this._drawOnCol(ctx);
+};
+ClipboardRenderController = __decorate([
+	__decorateParam(1, Inject(SheetSkeletonManagerService)),
+	__decorateParam(2, ISheetClipboardService),
+	__decorateParam(3, Inject(SheetClipboardController))
+], ClipboardRenderController);
+
+//#endregion
+//#region src/controllers/render-controllers/format-painter.render-controller.ts
+let FormatPainterRenderController = class FormatPainterRenderController extends Disposable {
+	constructor(_context, _formatPainterService, _selectionRenderService, _commandService) {
+		super();
+		this._context = _context;
+		this._formatPainterService = _formatPainterService;
+		this._selectionRenderService = _selectionRenderService;
+		this._commandService = _commandService;
+		this._initialize();
 	}
-	_drawOnRow(ctx) {
-		if (this._hovered) if (!this._hasNext || !this._hasPrevious) Rect.drawWith(ctx, {
-			width: this._size,
-			height: this._size,
-			stroke: HEADER_MENU_SHAPE_TRIANGLE_FILL,
-			fill: HEADER_MENU_BACKGROUND_COLOR
-		});
-		else Rect.drawWith(ctx, {
-			width: this._size,
-			height: 2 * this._size,
-			stroke: HEADER_MENU_SHAPE_TRIANGLE_FILL,
-			fill: HEADER_MENU_BACKGROUND_COLOR
-		});
-		const iconSize = this._size * .5 * this._iconRatio;
-		const sixtyDegree = Math.PI / 3;
-		const top = iconSize * Math.cos(sixtyDegree);
-		const left = iconSize * Math.sin(sixtyDegree);
-		if (this._hasPrevious) RegularPolygon.drawWith(ctx, {
-			pointsGroup: [[
-				{
-					x: this._size / 2,
-					y: this._size / 2 - left
-				},
-				{
-					x: this._size / 2 - left,
-					y: this._size / 2 + top
-				},
-				{
-					x: this._size / 2 + left,
-					y: this._size / 2 + top
-				}
-			]],
-			fill: HEADER_MENU_SHAPE_TRIANGLE_FILL
-		});
-		if (this._hasNext) {
-			const offset = this._hasPrevious ? 3 : 1;
-			RegularPolygon.drawWith(ctx, {
-				pointsGroup: [[
-					{
-						x: this._size / 2,
-						y: this._size * offset / 2 + left
-					},
-					{
-						x: this._size / 2 - left,
-						y: this._size * offset / 2 - top
-					},
-					{
-						x: this._size / 2 + left,
-						y: this._size * offset / 2 - top
-					}
-				]],
-				fill: HEADER_MENU_SHAPE_TRIANGLE_FILL
-			});
-		}
+	_initialize() {
+		this._bindFormatPainterStatus();
+		this._commandExecutedListener();
 	}
-	/**
-	*
-	* @param ctx
-	*/
-	_drawOnCol(ctx) {
-		if (this._hovered) if (!this._hasNext || !this._hasPrevious) Rect.drawWith(ctx, {
-			width: this._size,
-			height: this._size,
-			stroke: HEADER_MENU_SHAPE_TRIANGLE_FILL,
-			fill: HEADER_MENU_BACKGROUND_COLOR
-		});
-		else Rect.drawWith(ctx, {
-			width: 2 * this._size,
-			height: this._size,
-			stroke: HEADER_MENU_SHAPE_TRIANGLE_FILL,
-			fill: HEADER_MENU_BACKGROUND_COLOR
-		});
-		const iconSize = this._size * .5 * this._iconRatio;
-		const sixtyDegree = Math.PI / 3;
-		const top = iconSize * Math.cos(sixtyDegree);
-		const left = iconSize * Math.sin(sixtyDegree);
-		if (this._hasPrevious) RegularPolygon.drawWith(ctx, {
-			pointsGroup: [[
-				{
-					x: -top + this._size / 2,
-					y: this._size / 2
-				},
-				{
-					x: this._size / 2 + left,
-					y: this._size / 2 - left
-				},
-				{
-					x: this._size / 2 + left,
-					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
+	_commandExecutedListener() {
+		this.disposeWithMe(this._selectionRenderService.selectionMoveEnd$.subscribe((selections) => {
+			if (this._formatPainterService.getStatus() !== 0) {
+				var _this$_context$unit$g;
+				const { rangeWithCoord } = selections[selections.length - 1];
+				this._commandService.executeCommand(ApplyFormatPainterCommand.id, {
+					unitId: this._context.unitId,
+					subUnitId: ((_this$_context$unit$g = this._context.unit.getActiveSheet()) === null || _this$_context$unit$g === void 0 ? void 0 : _this$_context$unit$g.getSheetId()) || "",
+					range: {
+						startRow: rangeWithCoord.startRow,
+						startColumn: rangeWithCoord.startColumn,
+						endRow: rangeWithCoord.endRow,
+						endColumn: rangeWithCoord.endColumn
 					}
-				]],
-				fill: HEADER_MENU_SHAPE_TRIANGLE_FILL
-			});
-		}
+				});
+				if (this._formatPainterService.getStatus() === 1) this._commandService.executeCommand(SetOnceFormatPainterCommand.id);
+			}
+		}));
+	}
+	_bindFormatPainterStatus() {
+		this.disposeWithMe(toDisposable(this._formatPainterService.status$.subscribe((status) => {
+			const scene = this._context.scene;
+			if (!scene) return;
+			if (status !== 0) scene.setDefaultCursor(CURSOR_TYPE.CELL);
+			else scene.setDefaultCursor(CURSOR_TYPE.DEFAULT);
+		})));
 	}
 };
+FormatPainterRenderController = __decorate([
+	__decorateParam(1, IFormatPainterService),
+	__decorateParam(2, ISheetSelectionRenderService),
+	__decorateParam(3, ICommandService)
+], FormatPainterRenderController);
 
 //#endregion
-//#region src/controllers/render-controllers/header-unhide.render-controller.ts
-const HEADER_UNHIDE_CONTROLLER_SHAPE = "__SpreadsheetHeaderUnhideSHAPEControllerShape__";
-let HeaderUnhideRenderController = class HeaderUnhideRenderController extends RxDisposable {
-	get _workbook() {
-		return this._context.unit;
-	}
-	constructor(_context, _sheetSkeletonManagerService, _commandService) {
+//#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)";
+let HeaderMenuRenderController = class HeaderMenuRenderController extends Disposable {
+	constructor(_context, _sheetSkeletonManagerService, _contextMenuService, _commandService, _selectionManagerService) {
 		super();
 		this._context = _context;
 		this._sheetSkeletonManagerService = _sheetSkeletonManagerService;
+		this._contextMenuService = _contextMenuService;
 		this._commandService = _commandService;
-		_defineProperty(this, "_shapes", {
-			cols: [],
-			rows: []
-		});
-		this._init();
+		this._selectionManagerService = _selectionManagerService;
+		_defineProperty(this, "_hoverRect", void 0);
+		_defineProperty(this, "_hoverMenu", void 0);
+		_defineProperty(this, "_currentColumn", Number.POSITIVE_INFINITY);
+		_defineProperty(this, "_headerPointerSubs", void 0);
+		_defineProperty(this, "_colHeaderPointerSubs", void 0);
+		this._initialize();
 	}
 	dispose() {
-		super.dispose();
-		this._clearShapes();
+		var _this$_hoverRect, _this$_hoverMenu, _this$_headerPointerS;
+		(_this$_hoverRect = this._hoverRect) === null || _this$_hoverRect === void 0 || _this$_hoverRect.dispose();
+		(_this$_hoverMenu = this._hoverMenu) === null || _this$_hoverMenu === void 0 || _this$_hoverMenu.dispose();
+		(_this$_headerPointerS = this._headerPointerSubs) === null || _this$_headerPointerS === void 0 || _this$_headerPointerS.unsubscribe();
+		this._headerPointerSubs = null;
 	}
-	_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);
+	_initialize() {
+		const scene = this._context.scene;
+		this._hoverRect = new Rect(HEADER_MENU_CONTROLLER_SHAPE, {
+			fill: HEADER_MENU_CONTROLLER_SHAPE_COLOR,
+			evented: false
 		});
-		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);
+		this._hoverMenu = new HeaderMenuShape(HEADER_MENU_CONTROLLER_MENU, {
+			zIndex: 100,
+			visible: false
+		});
+		scene.addObjects([this._hoverRect, this._hoverMenu], 10);
+		this._initialHover(0);
+		this._initialHover(1);
+		this._initialHoverMenu();
+	}
+	_initialHover(initialType = 0) {
+		var _this$_headerPointerS2, _this$_headerPointerS3, _this$_headerPointerS4;
+		const spreadsheetColumnHeader = this._context.components.get("__SpreadsheetColumnHeader__");
+		const spreadsheetRowHeader = this._context.components.get("__SpreadsheetRowHeader__");
+		const eventBindingObject = initialType === 0 ? spreadsheetRowHeader : spreadsheetColumnHeader;
+		const pointerMoveHandler = (evt) => {
+			var _this$_sheetSkeletonM;
+			const skeleton = (_this$_sheetSkeletonM = this._sheetSkeletonManagerService.getCurrentParam()) === null || _this$_sheetSkeletonM === void 0 ? void 0 : _this$_sheetSkeletonM.skeleton;
+			if (skeleton == null) return;
+			const { rowBaseWidth, rowGutterWidth, columnBaseHeight, columnGutterHeight } = getHeaderBaseLayout(skeleton);
+			const { startX, startY, endX, endY, column } = getCoordByOffset(evt.offsetX, evt.offsetY, this._context.scene, skeleton);
+			if (initialType === 0) {
+				var _this$_hoverRect2;
+				(_this$_hoverRect2 = this._hoverRect) === null || _this$_hoverRect2 === void 0 || _this$_hoverRect2.transformByState({
+					width: rowBaseWidth,
+					height: endY - startY,
+					left: rowGutterWidth,
+					top: startY
+				});
+			} else {
+				var _this$_hoverRect3;
+				this._currentColumn = column;
+				(_this$_hoverRect3 = this._hoverRect) === null || _this$_hoverRect3 === void 0 || _this$_hoverRect3.transformByState({
+					width: endX - startX,
+					height: columnBaseHeight,
+					left: startX,
+					top: columnGutterHeight
+				});
+				if (this._hoverMenu == null) return;
+				if (endX - startX < columnBaseHeight * 2) {
+					this._hoverMenu.hide();
+					return;
 				}
+				const menuSize = columnBaseHeight * .8;
+				this._hoverMenu.transformByState({
+					left: endX - columnBaseHeight,
+					top: columnGutterHeight + columnBaseHeight / 2 - menuSize / 2
+				});
+				this._hoverMenu.setShapeProps({ size: menuSize });
+				this._hoverMenu.show();
 			}
-		}));
+		};
+		const pointerEnterHandler = () => {
+			var _this$_hoverRect4;
+			(_this$_hoverRect4 = this._hoverRect) === null || _this$_hoverRect4 === void 0 || _this$_hoverRect4.show();
+		};
+		const pointerLeaveHandler = () => {
+			var _this$_hoverRect5, _this$_hoverMenu2;
+			(_this$_hoverRect5 = this._hoverRect) === null || _this$_hoverRect5 === void 0 || _this$_hoverRect5.hide();
+			(_this$_hoverMenu2 = this._hoverMenu) === null || _this$_hoverMenu2 === void 0 || _this$_hoverMenu2.hide();
+		};
+		this._headerPointerSubs = new Subscription();
+		const headerPointerMoveSub = eventBindingObject.onPointerMove$.subscribeEvent(pointerMoveHandler);
+		const headerPointerEnterSub = eventBindingObject.onPointerEnter$.subscribeEvent(pointerEnterHandler);
+		const headerPointerLeaveSub = eventBindingObject.onPointerLeave$.subscribeEvent(pointerLeaveHandler);
+		(_this$_headerPointerS2 = this._headerPointerSubs) === null || _this$_headerPointerS2 === void 0 || _this$_headerPointerS2.add(headerPointerMoveSub);
+		(_this$_headerPointerS3 = this._headerPointerSubs) === null || _this$_headerPointerS3 === void 0 || _this$_headerPointerS3.add(headerPointerEnterSub);
+		(_this$_headerPointerS4 = this._headerPointerSubs) === null || _this$_headerPointerS4 === void 0 || _this$_headerPointerS4.add(headerPointerLeaveSub);
 	}
-	_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 hiddenRowRanges = worksheet.getHiddenRows();
-		const hiddenColRanges = worksheet.getHiddenCols();
-		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]
-			}));
+	_initialHoverMenu() {
+		if (this._hoverMenu == null) return;
+		this._hoverMenu.onPointerEnter$.subscribeEvent(() => {
+			if (this._hoverMenu == null) return;
+			this._hoverMenu.setProps({
+				mode: 1,
+				visible: true
+			});
+			this._context.scene.setCursor(CURSOR_TYPE.POINTER);
 		});
-		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: 20 - 12,
-				left: position.startX - (hasPrevious ? 12 : 0)
-			}, () => this._commandService.executeCommand(SetSpecificColsVisibleCommand.id, {
-				unitId: workbook.getUnitId(),
-				subUnitId: worksheet.getSheetId(),
-				ranges: [range]
-			}));
+		this._hoverMenu.onPointerLeave$.subscribeEvent(() => {
+			if (this._hoverMenu == null) return;
+			this._hoverMenu.setProps({
+				mode: 0,
+				visible: false
+			});
+			this._context.scene.resetCursor();
+		});
+		this._hoverMenu.onPointerDown$.subscribeEvent((evt) => {
+			var _this$_selectionManag;
+			const currentColumn = this._currentColumn;
+			const currentSelectionDatas = (_this$_selectionManag = this._selectionManagerService.getCurrentSelections()) === null || _this$_selectionManag === void 0 ? void 0 : _this$_selectionManag.map((s) => s.range);
+			if (!!!(currentSelectionDatas === null || currentSelectionDatas === void 0 ? void 0 : currentSelectionDatas.filter((range) => range.rangeType === RANGE_TYPE.COLUMN).find((data) => {
+				const { startColumn, endColumn } = data;
+				if (currentColumn >= startColumn && currentColumn <= endColumn) return true;
+				return false;
+			}))) {
+				const selection = this._getSelectionOnColumn(currentColumn);
+				this._commandService.syncExecuteCommand(SetSelectionsOperation.id, selection);
+			}
+			evt.stopPropagation();
+			evt.preventDefault();
+			this._contextMenuService.triggerContextMenu(evt, ContextMenuPosition.COL_HEADER);
 		});
-		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: []
+	_getSelectionOnColumn(column) {
+		const workbook = this._context.unit;
+		const worksheet = workbook.getActiveSheet();
+		if (!worksheet) throw new Error("No active worksheet");
+		return {
+			unitId: workbook.getUnitId(),
+			subUnitId: worksheet.getSheetId(),
+			selections: [{
+				range: {
+					startRow: 0,
+					startColumn: column,
+					endRow: worksheet.getRowCount() - 1,
+					endColumn: column,
+					rangeType: RANGE_TYPE.COLUMN
+				},
+				primary: {
+					startRow: 0,
+					startColumn: column,
+					endRow: 0,
+					endColumn: column,
+					actualRow: 0,
+					actualColumn: column,
+					isMerged: false,
+					isMergedMainCell: false
+				},
+				style: null
+			}]
 		};
 	}
-	_getSheetObject() {
-		return getSheetObject(this._workbook, this._context);
-	}
 };
-HeaderUnhideRenderController = __decorate([__decorateParam(1, Inject(SheetSkeletonManagerService)), __decorateParam(2, ICommandService)], HeaderUnhideRenderController);
+HeaderMenuRenderController = __decorate([
+	__decorateParam(1, Inject(SheetSkeletonManagerService)),
+	__decorateParam(2, IContextMenuService),
+	__decorateParam(3, ICommandService),
+	__decorateParam(4, Inject(SheetsSelectionsService))
+], HeaderMenuRenderController);
+function getHeaderBaseLayout(skeleton) {
+	var _skeleton$worksheet$g, _skeleton$worksheet, _config$rowHeader, _config$columnHeader;
+	const config = (_skeleton$worksheet$g = (_skeleton$worksheet = skeleton.worksheet).getConfig) === null || _skeleton$worksheet$g === void 0 ? void 0 : _skeleton$worksheet$g.call(_skeleton$worksheet);
+	const configuredRowWidth = config === null || config === void 0 || (_config$rowHeader = config.rowHeader) === null || _config$rowHeader === void 0 ? void 0 : _config$rowHeader.width;
+	const configuredColumnHeight = config === null || config === void 0 || (_config$columnHeader = config.columnHeader) === null || _config$columnHeader === void 0 ? void 0 : _config$columnHeader.height;
+	const rowBaseWidth = typeof configuredRowWidth === "number" && configuredRowWidth > 0 ? Math.min(configuredRowWidth, skeleton.rowHeaderWidth) : skeleton.rowHeaderWidth;
+	const columnBaseHeight = typeof configuredColumnHeight === "number" && configuredColumnHeight > 0 ? Math.min(configuredColumnHeight, skeleton.columnHeaderHeight) : skeleton.columnHeaderHeight;
+	return {
+		rowBaseWidth,
+		rowGutterWidth: Math.max(0, skeleton.rowHeaderWidthAndMarginLeft - rowBaseWidth),
+		columnBaseHeight,
+		columnGutterHeight: Math.max(0, skeleton.columnHeaderHeightAndMarginTop - columnBaseHeight)
+	};
+}
 
 //#endregion
 //#region src/consts/mobile-context.ts
@@ -28854,7 +28960,7 @@ let SheetSkeletonRenderController = class SheetSkeletonRenderController extends
 		}));
 	}
 	_updateSceneSize(param) {
-		var _this$_renderManagerS;
+		var _this$_renderManagerS, _scene$getViewport, _scene$getViewport2, _scene$getViewport3, _scene$getViewport4, _scene$getViewport5;
 		if (param == null) return;
 		const { unitId } = this._context;
 		const { skeleton } = param;
@@ -28867,6 +28973,30 @@ let SheetSkeletonRenderController = class SheetSkeletonRenderController extends
 			height: columnHeaderHeightAndMarginTop + rowTotalHeight
 		});
 		scene.getMainViewport().setMargin(rowHeaderWidthAndMarginLeft, columnHeaderHeightAndMarginTop);
+		scene.getMainViewport().resizeWhenFreezeChange({
+			left: rowHeaderWidthAndMarginLeft,
+			top: columnHeaderHeightAndMarginTop
+		});
+		(_scene$getViewport = scene.getViewport(SHEET_VIEWPORT_KEY.VIEW_COLUMN_LEFT)) === null || _scene$getViewport === void 0 || _scene$getViewport.resizeWhenFreezeChange({
+			left: rowHeaderWidthAndMarginLeft,
+			height: columnHeaderHeightAndMarginTop
+		});
+		(_scene$getViewport2 = scene.getViewport(SHEET_VIEWPORT_KEY.VIEW_COLUMN_RIGHT)) === null || _scene$getViewport2 === void 0 || _scene$getViewport2.resizeWhenFreezeChange({
+			left: rowHeaderWidthAndMarginLeft,
+			height: columnHeaderHeightAndMarginTop
+		});
+		(_scene$getViewport3 = scene.getViewport(SHEET_VIEWPORT_KEY.VIEW_ROW_BOTTOM)) === null || _scene$getViewport3 === void 0 || _scene$getViewport3.resizeWhenFreezeChange({
+			width: rowHeaderWidthAndMarginLeft,
+			top: columnHeaderHeightAndMarginTop
+		});
+		(_scene$getViewport4 = scene.getViewport(SHEET_VIEWPORT_KEY.VIEW_ROW_TOP)) === null || _scene$getViewport4 === void 0 || _scene$getViewport4.resizeWhenFreezeChange({
+			width: rowHeaderWidthAndMarginLeft,
+			top: columnHeaderHeightAndMarginTop
+		});
+		(_scene$getViewport5 = scene.getViewport(SHEET_VIEWPORT_KEY.VIEW_LEFT_TOP)) === null || _scene$getViewport5 === void 0 || _scene$getViewport5.resizeWhenFreezeChange({
+			width: rowHeaderWidthAndMarginLeft,
+			height: columnHeaderHeightAndMarginTop
+		});
 	}
 };
 SheetSkeletonRenderController = __decorate([__decorateParam(1, Inject(SheetSkeletonManagerService)), __decorateParam(2, IRenderManagerService)], SheetSkeletonRenderController);
@@ -29700,16 +29830,18 @@ let MobileSheetsSelectionRenderService = class MobileSheetsSelectionRenderServic
 	*/
 	newSelectionControl(scene, skeleton, selection) {
 		const selectionControls = this.getSelectionControls();
-		const { rowHeaderWidth, columnHeaderHeight } = skeleton;
+		const { rowHeaderWidth, rowHeaderWidthAndMarginLeft, columnHeaderHeight, columnHeaderHeightAndMarginTop } = skeleton;
 		const rangeType = selection.range.rangeType;
 		const control = new MobileSelectionControl(scene, selectionControls.length, this._themeService, {
 			highlightHeader: this._highlightHeader,
 			rowHeaderWidth,
 			columnHeaderHeight,
+			rowHeaderOffsetX: Math.max(0, rowHeaderWidthAndMarginLeft - rowHeaderWidth),
+			columnHeaderOffsetY: Math.max(0, columnHeaderHeightAndMarginTop - columnHeaderHeight),
 			rangeType
 		});
 		const selectionWithCoord = attachSelectionWithCoord(selection, skeleton);
-		control.updateRangeBySelectionWithCoord(selectionWithCoord);
+		control.updateRangeBySelectionWithCoord(selectionWithCoord, skeleton);
 		this._selectionControls.push(control);
 		const { expandingModeForTopLeft, expandingModeForBottomRight } = (() => {
 			switch (rangeType) {
@@ -29985,6 +30117,7 @@ let UniverSheetsMobileUIPlugin = class UniverSheetsMobileUIPlugin extends Plugin
 			[IStatusBarService, { useClass: StatusBarService }],
 			[IMarkSelectionService, { useClass: MarkSelectionService }],
 			[HoverManagerService],
+			[HeaderUnhideRangeService],
 			[DragManagerService],
 			[SheetCanvasPopManagerService],
 			[CellPopupManagerService],
@@ -30580,6 +30713,7 @@ let UniverSheetsUIPlugin = class UniverSheetsUIPlugin extends Plugin {
 			[IStatusBarService, { useClass: StatusBarService }],
 			[IMarkSelectionService, { useClass: MarkSelectionService }],
 			[HoverManagerService],
+			[HeaderUnhideRangeService],
 			[DragManagerService],
 			[SheetCanvasPopManagerService],
 			[CellPopupManagerService],
@@ -30708,4 +30842,4 @@ UniverSheetsUIPlugin = __decorate([
 ], UniverSheetsUIPlugin);
 
 //#endregion
-export { AddRangeProtectionFromContextMenuCommand, AddRangeProtectionFromSheetBarCommand, AddRangeProtectionFromToolbarCommand, ApplyFormatPainterCommand, AutoFillUIController, AutoHeightController, AutoWidthController, BaseSelectionRenderService, 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, ExpandSelectionCommand, FormatPainterStatus, FormulaBar, FormulaEditorController, HeaderFreezeRenderController, HeaderMoveRenderController, HeaderResizeRenderController, HideColConfirmCommand, HideRowConfirmCommand, HoverManagerService, HoverRenderController, ICellEditorManagerService, IEditorBridgeService, IFormatPainterService, IFormulaEditorManagerService, IMarkSelectionService, IRepeatLastActionService, ISheetCellDropdownManagerService, ISheetClipboardService, ISheetSelectionRenderService, IStatusBarService, InsertRangeMoveDownConfirmCommand, InsertRangeMoveRightConfirmCommand, JumpOver, MarkSelectionService, MobileSheetBar, 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, RenderSheetContent, RenderSheetFooter, RenderSheetHeader, RepeatLastActionPermission, ResetRangeTextColorCommand, ResetScrollCommand, SELECTION_SHAPE_DEPTH, 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, SheetCopyDownCommand, SheetCopyRightCommand, SheetCutCommand, SheetMenuPosition, SheetPasteBesidesBorderCommand, SheetPasteColWidthCommand, SheetPasteCommand, SheetPasteFormatCommand, SheetPasteShortKeyCommand, SheetPasteValueCommand, SheetPermissionCheckUIController, SheetPermissionOpenDialogOperation, SheetPermissionOpenPanelOperation, SheetPermissionRenderManagerService, SheetPermissionUserManagerService, SheetPrintInterceptorService, 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, useActiveWorkbook, useActiveWorksheet, useHighlightRange, useKeyEventConfig, useWorkbooks, virtualizeDiscreteRanges, whenFormulaEditorActivated, whenSheetEditorActivated, whenSheetEditorFocused };
+export { AddRangeProtectionFromContextMenuCommand, AddRangeProtectionFromSheetBarCommand, AddRangeProtectionFromToolbarCommand, ApplyFormatPainterCommand, AutoFillUIController, AutoHeightController, AutoWidthController, BaseSelectionRenderService, 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, ExpandSelectionCommand, 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, ISheetSelectionRenderService, IStatusBarService, InsertRangeMoveDownConfirmCommand, InsertRangeMoveRightConfirmCommand, JumpOver, MarkSelectionService, MobileSheetBar, 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, RenderSheetContent, RenderSheetFooter, RenderSheetHeader, RepeatLastActionPermission, ResetRangeTextColorCommand, ResetScrollCommand, SELECTION_SHAPE_DEPTH, 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, SheetCopyDownCommand, SheetCopyRightCommand, SheetCutCommand, SheetMenuPosition, SheetPasteBesidesBorderCommand, SheetPasteColWidthCommand, SheetPasteCommand, SheetPasteFormatCommand, SheetPasteShortKeyCommand, SheetPasteValueCommand, SheetPermissionCheckUIController, SheetPermissionOpenDialogOperation, SheetPermissionOpenPanelOperation, SheetPermissionRenderManagerService, SheetPermissionUserManagerService, SheetPrintInterceptorService, 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, useActiveWorkbook, useActiveWorksheet, useHighlightRange, useKeyEventConfig, useWorkbooks, virtualizeDiscreteRanges, whenFormulaEditorActivated, whenSheetEditorActivated, whenSheetEditorFocused };