@univerjs/docs-ui 0.2.8 → 0.2.10

package/lib/es/index.js

@@ -2,11 +2,11 @@ var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: !0 });
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key != "symbol" ? key + "" : key, value);
-import { FOCUSING_DOC, FOCUSING_UNIVER_EDITOR, FOCUSING_COMMON_DRAWINGS, FOCUSING_UNIVER_EDITOR_STANDALONE_SINGLE_MODE, Tools, LRUMap, BaselineOffset, BooleanNumber, ColorKit, DataStreamTreeTokenType, CustomRangeType, skipParseTagNames, DataStreamTreeNodeType, createIdentifier, Inject, IUniverInstanceService, ILogService, ICommandService, Disposable, SliceBodyType, normalizeBody, UniverInstanceType, toDisposable, getBodySlice, RxDisposable, Direction, EDITOR_ACTIVATED, LocaleService, Injector, Optional, useDependency, DocumentFlavor, CommandType, JSONX, useObservable, PresetListType, ThemeService, HorizontalAlign, MemoryCursor, TextX, TextXActionType, UpdateDocsAttributeType, generateRandomId, OnLifecycle, LifecycleStages, connectInjector, IContextService, checkForSubstrings, IConfigService, isInternalEditorID, DisposableCollection, DEFAULT_EMPTY_DOCUMENT_VALUE, DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY, DOCS_NORMAL_EDITOR_UNIT_ID_KEY, DOCS_ZEN_EDITOR_UNIT_ID_KEY, fromEventSubject, QuickListTypeMap, Plugin, mergeOverrideWithDependencies, ObjectRelativeFromH, ObjectRelativeFromV } from "@univerjs/core";
+import { FOCUSING_DOC, FOCUSING_UNIVER_EDITOR, FOCUSING_COMMON_DRAWINGS, FOCUSING_UNIVER_EDITOR_STANDALONE_SINGLE_MODE, Tools, LRUMap, BaselineOffset, BooleanNumber, ColorKit, DataStreamTreeTokenType, CustomRangeType, skipParseTagNames, DataStreamTreeNodeType, createIdentifier, Inject, IUniverInstanceService, ILogService, ICommandService, Disposable, SliceBodyType, UniverInstanceType, DOCS_NORMAL_EDITOR_UNIT_ID_KEY, normalizeBody, toDisposable, getBodySlice, RxDisposable, Direction, EDITOR_ACTIVATED, LocaleService, Injector, Optional, useDependency, DocumentFlavor, CommandType, JSONX, useObservable, PresetListType, ThemeService, HorizontalAlign, MemoryCursor, TextX, TextXActionType, UpdateDocsAttributeType, generateRandomId, OnLifecycle, LifecycleStages, connectInjector, IContextService, checkForSubstrings, IConfigService, isInternalEditorID, DisposableCollection, DEFAULT_EMPTY_DOCUMENT_VALUE, DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY, DOCS_ZEN_EDITOR_UNIT_ID_KEY, fromEventSubject, QuickListTypeMap, Plugin, mergeOverrideWithDependencies, ObjectRelativeFromH, ObjectRelativeFromV } from "@univerjs/core";
 import { IClipboardInterfaceService, PLAIN_TEXT_CLIPBOARD_MIME_TYPE, HTML_CLIPBOARD_MIME_TYPE, IEditorService, KeyCode, MetaKeys, ILayoutService, ComponentManager, ISidebarService, IConfirmService, MenuGroup, MenuItemType, MenuPosition, getMenuHiddenObservable, FONT_FAMILY_LIST, FONT_SIZE_LIST, getHeaderFooterMenuHiddenObservable, CopyCommand, CutCommand, PasteCommand, FontFamily, FontFamilyItem, FontSize, BuiltInUIPart, IMenuService, IUIPartsService, IShortcutService, SetEditorResizeOperation, ICanvasPopupService, IContextMenuService } from "@univerjs/ui";
-import { getEmptyTableCell, getEmptyTableRow, genTableSource, getTableColumn, TextSelectionManagerService, DocCustomRangeService, getCursorWhenDelete, CutContentCommand, InnerPasteCommand, getDeleteSelection, DocSkeletonManagerService, VIEWPORT_KEY, getDocObject, MoveCursorOperation, MoveSelectionOperation, SelectAllOperation, neoGetDocObject, RichTextEditingMutation, SetDocZoomRatioOperation, SetInlineFormatBoldCommand, SetInlineFormatItalicCommand, SetInlineFormatUnderlineCommand, SetInlineFormatStrikethroughCommand, SetInlineFormatSubscriptCommand, SetInlineFormatSuperscriptCommand, AlignLeftCommand, AlignRightCommand, AlignCenterCommand, AlignJustifyCommand, OrderListCommand, BulletListCommand, TabCommand, CreateDocTableCommand, SetTextSelectionsOperation, SetInlineFormatCommand, SetInlineFormatFontFamilyCommand, SetInlineFormatFontSizeCommand, SetInlineFormatTextColorCommand, AlignOperationCommand, CheckListCommand, ResetInlineFormatTextBackgroundColorCommand, SetInlineFormatTextBackgroundColorCommand, getCommandSkeleton, getParagraphsInRange, getParagraphsInRanges, serializeDocRange, getRichTextEditPath, DeleteLeftCommand, DocTableInsertRowAboveCommand, DocTableInsertRowBellowCommand, DocTableInsertColumnLeftCommand, DocTableInsertColumnRightCommand, DocTableDeleteRowsCommand, DocTableDeleteColumnsCommand, DocTableDeleteTableCommand, EnterCommand, DeleteRightCommand, CoverContentCommand, DOCS_COMPONENT_MAIN_LAYER_INDEX, DOCS_COMPONENT_HEADER_LAYER_INDEX, DOCS_VIEW_KEY, DOCS_COMPONENT_DEFAULT_Z_INDEX, DOCS_COMPONENT_BACKGROUND_LAYER_INDEX, SetDocZoomRatioCommand, ChangeListNestingLevelCommand, ChangeListNestingLevelType, AfterSpaceCommand, QuickListCommand, ListOperationCommand, BreakLineCommand, DocAutoFormatService, ToggleCheckListCommand, DocTableTabCommand, DocTableShiftTabCommand, DocInterceptorService } from "@univerjs/docs";
-import { pixelToPt, ptToPixel, parseDataStreamToTree, DOC_RANGE_TYPE, NodePositionConvertToCursor, getAnchorBounding, IRenderManagerService, ITextSelectionRenderManager, Shape, DocumentEditArea, PageLayoutType, Vector2, Rect, Path, getNumberUnitValue, ScrollBar, Viewport, Layer, Documents, DocBackground, CURSOR_TYPE, pxToNum, getLineBounding, TRANSFORM_CHANGE_OBSERVABLE_TYPE, getParagraphByGlyph, GlyphType, isInSameTableCell } from "@univerjs/engine-render";
-import { takeUntil, Observable, combineLatest, map, fromEvent, BehaviorSubject, filter, throttleTime, Subject, debounceTime } from "rxjs";
+import { getEmptyTableCell, getEmptyTableRow, genTableSource, getTableColumn, TextSelectionManagerService, DocCustomRangeService, getCursorWhenDelete, CutContentCommand, InnerPasteCommand, getDeleteSelection, DocSkeletonManagerService, VIEWPORT_KEY, getDocObject, MoveCursorOperation, MoveSelectionOperation, SelectAllOperation, neoGetDocObject, RichTextEditingMutation, SetDocZoomRatioOperation, SetInlineFormatBoldCommand, SetInlineFormatItalicCommand, SetInlineFormatUnderlineCommand, SetInlineFormatStrikethroughCommand, SetInlineFormatSubscriptCommand, SetInlineFormatSuperscriptCommand, AlignLeftCommand, AlignRightCommand, AlignCenterCommand, AlignJustifyCommand, OrderListCommand, BulletListCommand, TabCommand, CreateDocTableCommand, SetTextSelectionsOperation, SetInlineFormatCommand, SetInlineFormatFontFamilyCommand, SetInlineFormatFontSizeCommand, SetInlineFormatTextColorCommand, AlignOperationCommand, CheckListCommand, ResetInlineFormatTextBackgroundColorCommand, SetInlineFormatTextBackgroundColorCommand, getCommandSkeleton, getParagraphsInRange, getParagraphsInRanges, serializeDocRange, getRichTextEditPath, DeleteLeftCommand, DocTableInsertRowAboveCommand, DocTableInsertRowBellowCommand, DocTableInsertColumnLeftCommand, DocTableInsertColumnRightCommand, DocTableDeleteRowsCommand, DocTableDeleteColumnsCommand, DocTableDeleteTableCommand, EnterCommand, DeleteRightCommand, CoverContentCommand, DOCS_COMPONENT_MAIN_LAYER_INDEX, DOCS_COMPONENT_HEADER_LAYER_INDEX, DOCS_VIEW_KEY, DOCS_COMPONENT_DEFAULT_Z_INDEX, DOCS_COMPONENT_BACKGROUND_LAYER_INDEX, SetDocZoomRatioCommand, ChangeListNestingLevelCommand, ChangeListNestingLevelType, DocTableTabCommand, AfterSpaceCommand, QuickListCommand, ListOperationCommand, BreakLineCommand, DocAutoFormatService, ToggleCheckListCommand, DocInterceptorService } from "@univerjs/docs";
+import { pixelToPt, ptToPixel, parseDataStreamToTree, DOC_RANGE_TYPE, NodePositionConvertToCursor, getAnchorBounding, IRenderManagerService, ITextSelectionRenderManager, Shape, DocumentEditArea, PageLayoutType, Vector2, Rect, Path, getNumberUnitValue, ScrollBar, Viewport, Layer, Documents, DocBackground, CURSOR_TYPE, pxToNum, getLineBounding, TRANSFORM_CHANGE_OBSERVABLE_TYPE, isInSameTableCell } from "@univerjs/engine-render";
+import { takeUntil, Observable, combineLatest, map, fromEvent, BehaviorSubject, filter, throttleTime, animationFrameScheduler, Subject, distinctUntilChanged, mergeMap, take } from "rxjs";
 import * as require$$0 from "react";
 import require$$0__default, { forwardRef, useRef, createElement, useState, useEffect, useMemo, useCallback } from "react";
 import { Checkbox, InputNumber, Button, Slider, Tooltip, ColorPicker } from "@univerjs/design";
@@ -81,7 +81,7 @@ function extractNodeStyle(node) {
     const cssRule = styles2[i], cssValue = styles2.getPropertyValue(cssRule);
     switch (cssRule) {
       case "font-family": {
-        docStyles.ff = cssValue;
+        docStyles.ff = cssValue.replace(/^"/g, "").replace(/"$/g, "");
         break;
       }
       case "font-size": {
@@ -108,10 +108,13 @@ function extractNodeStyle(node) {
         break;
       }
       case "color": {
-        const color = new ColorKit(cssValue);
-        color.isValid && (docStyles.cl = {
-          rgb: color.toRgbString()
-        });
+        try {
+          const color = new ColorKit(cssValue);
+          color.isValid && (docStyles.cl = {
+            rgb: color.toRgbString()
+          });
+        } catch {
+        }
         break;
       }
       case "background-color": {
@@ -152,6 +155,9 @@ const DEFAULT_TABLE_WIDTH = 600, _HtmlToUDMService = class _HtmlToUDMService {
     const pastePlugin = _HtmlToUDMService._pluginList.find((plugin) => plugin.checkPasteType(html)), dom = parseToDom(html), docData = {
       body: {
         dataStream: "",
+        paragraphs: [],
+        sectionBreaks: [],
+        tables: [],
         textRuns: []
       },
       tableSource: {}
@@ -159,11 +165,11 @@ const DEFAULT_TABLE_WIDTH = 600, _HtmlToUDMService = class _HtmlToUDMService {
     return pastePlugin && (this._styleRules = [...pastePlugin.stylesRules], this._afterProcessRules = [...pastePlugin.afterProcessRules]), this._tableCache = [], this._styleCache.clear(), this._process(null, dom.childNodes, docData), this._styleCache.clear(), this._styleRules = [], this._afterProcessRules = [], docData;
   }
   _process(parent, nodes, doc) {
-    var _a23, _b, _c;
+    var _a22, _b, _c;
     const body = doc.body;
     for (const node of nodes)
       if (node.nodeType === Node.TEXT_NODE) {
-        if (((_a23 = node.nodeValue) == null ? void 0 : _a23.trim()) === "")
+        if (((_a22 = node.nodeValue) == null ? void 0 : _a22.trim()) === "")
           continue;
         let text = (_b = node.nodeValue) == null ? void 0 : _b.replace(/[\r\n]/g, ""), style;
         if (parent && parent.nodeType === Node.ELEMENT_NODE && parent.tagName.toUpperCase() === "A") {
@@ -202,11 +208,11 @@ const DEFAULT_TABLE_WIDTH = 600, _HtmlToUDMService = class _HtmlToUDMService {
       }
   }
   _processBeforeTable(node, doc) {
-    var _a23;
+    var _a22;
     const tagName = node.tagName.toUpperCase(), body = doc.body;
     switch (tagName) {
       case "TABLE": {
-        body.dataStream[body.dataStream.length - 1] !== "\r" && (body.dataStream += "\r", (_a23 = body.paragraphs) == null || _a23.push({
+        body.dataStream[body.dataStream.length - 1] !== "\r" && (body.dataStream += "\r", body.paragraphs == null && (body.paragraphs = []), (_a22 = body.paragraphs) == null || _a22.push({
           startIndex: body.dataStream.length - 1
         }));
         const table = genTableSource(0, 0, DEFAULT_TABLE_WIDTH);
@@ -229,7 +235,7 @@ const DEFAULT_TABLE_WIDTH = 600, _HtmlToUDMService = class _HtmlToUDMService {
     }
   }
   _processAfterTable(node, doc) {
-    var _a23;
+    var _a22, _b;
     const tagName = node.tagName.toUpperCase(), body = doc.body;
     doc.tableSource == null && (doc.tableSource = {}), body.tables == null && (body.tables = []), body.sectionBreaks == null && (body.sectionBreaks = []);
     const { tableSource } = doc;
@@ -248,7 +254,9 @@ const DEFAULT_TABLE_WIDTH = 600, _HtmlToUDMService = class _HtmlToUDMService {
         break;
       }
       case "TD": {
-        (_a23 = body.sectionBreaks) == null || _a23.push({
+        body.dataStream[body.dataStream.length - 1] !== "\r" && ((_a22 = body.paragraphs) == null || _a22.push({
+          startIndex: body.dataStream.length
+        }), body.dataStream += "\r"), (_b = body.sectionBreaks) == null || _b.push({
           startIndex: body.dataStream.length
         }), body.dataStream += `
 ${DataStreamTreeTokenType.TABLE_CELL_END}`;
@@ -411,7 +419,7 @@ function convertBodyToHtml(body) {
 }
 __name(convertBodyToHtml, "convertBodyToHtml");
 function processNode(node, body, result) {
-  var _a23;
+  var _a22;
   switch (node.nodeType) {
     case DataStreamTreeNodeType.SECTION_BREAK: {
       for (const n2 of node.children)
@@ -419,7 +427,7 @@ function processNode(node, body, result) {
       break;
     }
     case DataStreamTreeNodeType.PARAGRAPH: {
-      const { children, startIndex, endIndex } = node, paragraph = (_a23 = body.paragraphs.find((p2) => p2.startIndex === endIndex)) != null ? _a23 : {}, { paragraphStyle = {} } = paragraph, { spaceAbove, spaceBelow, lineSpacing } = paragraphStyle, style = [];
+      const { children, startIndex, endIndex } = node, paragraph = (_a22 = body.paragraphs.find((p2) => p2.startIndex === endIndex)) != null ? _a22 : {}, { paragraphStyle = {} } = paragraph, { spaceAbove, spaceBelow, lineSpacing } = paragraphStyle, style = [];
       if (spaceAbove != null && (typeof spaceAbove == "number" ? style.push(`margin-top: ${spaceAbove}px`) : style.push(`margin-top: ${spaceAbove.v}px`)), spaceBelow != null && (typeof spaceBelow == "number" ? style.push(`margin-bottom: ${spaceBelow}px`) : style.push(`margin-bottom: ${spaceBelow.v}px`)), lineSpacing != null && style.push(`line-height: ${lineSpacing}`), result.html += `<p class="UniverNormal" ${style.length ? `style="${style.join("; ")};"` : ""}>`, children.length)
         for (const table of children)
           processNode(table, body, result);
@@ -467,18 +475,18 @@ const _UDMToHtmlService = class _UDMToHtmlService {
 };
 __name(_UDMToHtmlService, "UDMToHtmlService");
 let UDMToHtmlService = _UDMToHtmlService;
-var __defProp$l = Object.defineProperty, __getOwnPropDesc$l = Object.getOwnPropertyDescriptor, __decorateClass$l = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$l(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$k = Object.defineProperty, __getOwnPropDesc$k = Object.getOwnPropertyDescriptor, __decorateClass$k = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$k(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$l(target, key, result), result;
-}, "__decorateClass$l"), __decorateParam$l = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$l");
+  return kind && result && __defProp$k(target, key, result), result;
+}, "__decorateClass$k"), __decorateParam$k = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$k");
 HtmlToUDMService.use(PastePluginWord);
 HtmlToUDMService.use(PastePluginLark);
 HtmlToUDMService.use(PastePluginUniver);
 function getTableSlice(body, start, end) {
-  var _a23, _b, _c;
+  var _a22, _b, _c;
   const bodySlice = getBodySlice(body, start, end + 2), dataStream = DataStreamTreeTokenType.TABLE_START + DataStreamTreeTokenType.TABLE_ROW_START + DataStreamTreeTokenType.TABLE_CELL_START + bodySlice.dataStream + DataStreamTreeTokenType.TABLE_CELL_END + DataStreamTreeTokenType.TABLE_ROW_END + DataStreamTreeTokenType.TABLE_END;
-  return bodySlice.dataStream = dataStream, (_a23 = bodySlice.textRuns) == null || _a23.forEach((textRun) => {
+  return bodySlice.dataStream = dataStream, (_a22 = bodySlice.textRuns) == null || _a22.forEach((textRun) => {
     const { st, ed } = textRun;
     textRun.st = st + 3, textRun.ed = ed + 3;
   }), (_b = bodySlice.tables) == null || _b.forEach((table) => {
@@ -501,12 +509,13 @@ let DocClipboardService = (_a = class extends Disposable {
     this._univerInstanceService = _univerInstanceService, this._logService = _logService, this._commandService = _commandService, this._clipboardInterfaceService = _clipboardInterfaceService, this._textSelectionManagerService = _textSelectionManagerService, this._docCustomRangeService = _docCustomRangeService;
   }
   async copy(sliceType = SliceBodyType.copy) {
-    const { bodyList, needCache } = this._getDocumentBodyInRanges(sliceType);
-    if (bodyList.length === 0)
+    var _a22;
+    const { bodyList = [], needCache = !1, snapshot } = (_a22 = this._getDocumentBodyInRanges(sliceType)) != null ? _a22 : {};
+    if (bodyList.length === 0 || snapshot == null)
       return !1;
     try {
       const activeRange = this._textSelectionManagerService.getActiveTextRangeWithStyle(), isCopyInHeaderFooter = !!(activeRange != null && activeRange.segmentId);
-      this._setClipboardData(bodyList, !isCopyInHeaderFooter && needCache);
+      this._setClipboardData(bodyList, snapshot, !isCopyInHeaderFooter && needCache);
     } catch (e) {
       return this._logService.error("[DocClipboardService] copy failed", e), !1;
     }
@@ -520,16 +529,23 @@ let DocClipboardService = (_a = class extends Disposable {
     return this._paste(partDocData);
   }
   async legacyPaste(html, text) {
+    var _a22;
     const partDocData = this._genDocDataFromHtmlAndText(html, text);
+    if (((_a22 = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_DOC)) == null ? void 0 : _a22.getUnitId()) === DOCS_NORMAL_EDITOR_UNIT_ID_KEY)
+      if (text) {
+        const textDocData = this._generateBody(text);
+        return this._paste({ body: textDocData });
+      } else
+        partDocData.body.textRuns = [];
     return this._paste(partDocData);
   }
   async _cut() {
-    var _a23, _b, _c;
+    var _a22, _b, _c;
     const {
       segmentId,
       endOffset: activeEndOffset,
       style
-    } = (_a23 = this._textSelectionManagerService.getActiveTextRangeWithStyle()) != null ? _a23 : {}, textRanges = (_b = this._textSelectionManagerService.getCurrentTextRanges()) != null ? _b : [], rectRanges = (_c = this._textSelectionManagerService.getCurrentRectRanges()) != null ? _c : [];
+    } = (_a22 = this._textSelectionManagerService.getActiveTextRangeWithStyle()) != null ? _a22 : {}, textRanges = (_b = this._textSelectionManagerService.getCurrentTextRanges()) != null ? _b : [], rectRanges = (_c = this._textSelectionManagerService.getCurrentRectRanges()) != null ? _c : [];
     if (segmentId == null && this._logService.error("[DocClipboardController] segmentId is not existed"), textRanges.length === 0 && rectRanges.length === 0)
       return !1;
     this.copy(SliceBodyType.cut);
@@ -537,11 +553,13 @@ let DocClipboardService = (_a = class extends Disposable {
       let cursor = 0;
       if (rectRanges.length > 0)
         cursor = getCursorWhenDelete(textRanges, rectRanges);
-      else if (activeEndOffset != null)
+      else if (activeEndOffset != null) {
+        cursor = activeEndOffset;
         for (const range of textRanges) {
           const { startOffset, endOffset } = range;
           startOffset == null || endOffset == null || endOffset <= activeEndOffset && (cursor -= endOffset - startOffset);
         }
+      }
       const newTextRanges = [
         {
           startOffset: cursor,
@@ -555,12 +573,12 @@ let DocClipboardService = (_a = class extends Disposable {
     }
   }
   async _paste(docData) {
-    var _a23, _b;
+    var _a22, _b;
     const { body: _body } = docData;
     if (_body == null)
       return !1;
     let body = normalizeBody(_body);
-    const unitId = (_a23 = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_DOC)) == null ? void 0 : _a23.getUnitId();
+    const unitId = (_a22 = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_DOC)) == null ? void 0 : _a22.getUnitId();
     if (!unitId)
       return !1;
     this._clipboardHooks.forEach((hook) => {
@@ -594,11 +612,30 @@ let DocClipboardService = (_a = class extends Disposable {
       return this._logService.error("[DocClipboardController]", "clipboard is empty."), !1;
     }
   }
-  async _setClipboardData(documentBodyList, needCache = !0) {
+  async _setClipboardData(documentBodyList, snapshot, needCache = !0) {
+    var _a22, _b;
     const copyId = genId(), text = documentBodyList.length > 1 ? documentBodyList.map((body) => body.dataStream).join(`
 `) : documentBodyList[0].dataStream;
     let html = this._umdToHtml.convert(documentBodyList);
-    return documentBodyList.length === 1 && needCache && (html = html.replace(/(<[a-z]+)/, (_p0, p1) => `${p1} data-copy-id="${copyId}"`), copyContentCache.set(copyId, { body: documentBodyList[0] })), this._clipboardInterfaceService.write(text, html);
+    if (documentBodyList.length === 1 && needCache) {
+      html = html.replace(/(<[a-z]+)/, (_p0, p1) => `${p1} data-copy-id="${copyId}"`);
+      const body = documentBodyList[0], cache = { body };
+      if ((_a22 = body.customBlocks) != null && _a22.length) {
+        cache.drawings = {};
+        for (const block of body.customBlocks) {
+          const { blockId } = block, drawing = (_b = snapshot.drawings) == null ? void 0 : _b[blockId];
+          if (drawing) {
+            const id = Tools.generateRandomId(6);
+            block.blockId = id, cache.drawings[id] = {
+              ...Tools.deepClone(drawing),
+              drawingId: id
+            };
+          }
+        }
+      }
+      copyContentCache.set(copyId, cache);
+    }
+    return this._clipboardInterfaceService.write(text, html);
   }
   addClipboardHook(hook) {
     return this._clipboardHooks.push(hook), toDisposable(() => {
@@ -608,50 +645,45 @@ let DocClipboardService = (_a = class extends Disposable {
   }
   // eslint-disable-next-line max-lines-per-function
   _getDocumentBodyInRanges(sliceType) {
-    var _a23;
+    var _a22;
     const docDataModel = this._univerInstanceService.getCurrentUniverDocInstance(), allRanges = this._textSelectionManagerService.getDocRanges(), results = [];
     let needCache = !0;
     if (docDataModel == null || allRanges.length === 0)
+      return;
+    const segmentId = allRanges[0].segmentId, body = (_a22 = docDataModel == null ? void 0 : docDataModel.getSelfOrHeaderFooterModel(segmentId)) == null ? void 0 : _a22.getBody(), snapshot = docDataModel.getSnapshot();
+    if (body != null) {
+      for (const range of allRanges) {
+        const { startOffset, endOffset, collapsed, rangeType } = range;
+        if (collapsed || startOffset == null || endOffset == null)
+          continue;
+        if (rangeType === DOC_RANGE_TYPE.RECT) {
+          needCache = !1;
+          const { spanEntireRow } = range;
+          let bodySlice;
+          bodySlice = getTableSlice(body, startOffset, endOffset), results.push(bodySlice);
+          continue;
+        }
+        const deleteRange = getDeleteSelection({ startOffset, endOffset, collapsed }, body), docBody = docDataModel.getSelfOrHeaderFooterModel(segmentId).sliceBody(deleteRange.startOffset, deleteRange.endOffset, sliceType);
+        if (docBody != null) {
+          if (docBody.customRanges) {
+            const deleteRange2 = [];
+            docBody.customRanges.forEach((range2) => {
+              range2.startIndex === range2.endIndex && deleteRange2.push(range2);
+            }), docBody.customRanges = docBody.customRanges.filter((range2) => deleteRange2.indexOf(range2) === -1);
+            let text = "", cursor = 0;
+            deleteRange2.forEach((range2) => {
+              text += docBody.dataStream.slice(cursor, range2.endIndex), cursor = range2.endIndex + 1;
+            }), text += docBody.dataStream.slice(cursor, docBody.dataStream.length), docBody.dataStream = text;
+          }
+          results.push(docBody);
+        }
+      }
       return {
         bodyList: results,
-        needCache
-      };
-    const segmentId = allRanges[0].segmentId, body = (_a23 = docDataModel == null ? void 0 : docDataModel.getSelfOrHeaderFooterModel(segmentId)) == null ? void 0 : _a23.getBody();
-    if (body == null)
-      return {
-        bodyList: results,
-        needCache
+        needCache,
+        snapshot
       };
-    for (const range of allRanges) {
-      const { startOffset, endOffset, collapsed, rangeType } = range;
-      if (collapsed || startOffset == null || endOffset == null)
-        continue;
-      if (rangeType === DOC_RANGE_TYPE.RECT) {
-        needCache = !1;
-        const { spanEntireRow } = range;
-        let bodySlice;
-        bodySlice = getTableSlice(body, startOffset, endOffset), results.push(bodySlice);
-        continue;
-      }
-      const deleteRange = getDeleteSelection({ startOffset, endOffset, collapsed }, body), docBody = docDataModel.getSelfOrHeaderFooterModel(segmentId).sliceBody(deleteRange.startOffset, deleteRange.endOffset, sliceType);
-      if (docBody != null) {
-        if (docBody.customRanges) {
-          const deleteRange2 = [];
-          docBody.customRanges.forEach((range2) => {
-            range2.startIndex === range2.endIndex && deleteRange2.push(range2);
-          }), docBody.customRanges = docBody.customRanges.filter((range2) => deleteRange2.indexOf(range2) === -1);
-          let text = "", cursor = 0;
-          deleteRange2.forEach((range2) => {
-            text += docBody.dataStream.slice(cursor, range2.endIndex), cursor = range2.endIndex + 1;
-          }), text += docBody.dataStream.slice(cursor, docBody.dataStream.length), docBody.dataStream = text;
-        }
-        results.push(docBody);
-      }
     }
-    return {
-      bodyList: results,
-      needCache
-    };
   }
   async _genDocDataFromClipboardItems(items) {
     try {
@@ -705,19 +737,19 @@ let DocClipboardService = (_a = class extends Disposable {
     return this._htmlToUDM.convert(html);
   }
 }, __name(_a, "DocClipboardService"), _a);
-DocClipboardService = __decorateClass$l([
-  __decorateParam$l(0, IUniverInstanceService),
-  __decorateParam$l(1, ILogService),
-  __decorateParam$l(2, ICommandService),
-  __decorateParam$l(3, IClipboardInterfaceService),
-  __decorateParam$l(4, Inject(TextSelectionManagerService)),
-  __decorateParam$l(5, Inject(DocCustomRangeService))
+DocClipboardService = __decorateClass$k([
+  __decorateParam$k(0, IUniverInstanceService),
+  __decorateParam$k(1, ILogService),
+  __decorateParam$k(2, ICommandService),
+  __decorateParam$k(3, IClipboardInterfaceService),
+  __decorateParam$k(4, Inject(TextSelectionManagerService)),
+  __decorateParam$k(5, Inject(DocCustomRangeService))
 ], DocClipboardService);
-var __defProp$k = Object.defineProperty, __getOwnPropDesc$k = Object.getOwnPropertyDescriptor, __decorateClass$k = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$k(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$j = Object.defineProperty, __getOwnPropDesc$j = Object.getOwnPropertyDescriptor, __decorateClass$j = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$j(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$k(target, key, result), result;
-}, "__decorateClass$k"), __decorateParam$k = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$k");
+  return kind && result && __defProp$j(target, key, result), result;
+}, "__decorateClass$j"), __decorateParam$j = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$j");
 const ANCHOR_WIDTH = 1.5;
 var _a2;
 let DocBackScrollRenderController = (_a2 = class extends RxDisposable {
@@ -733,16 +765,16 @@ let DocBackScrollRenderController = (_a2 = class extends RxDisposable {
     });
   }
   scrollToRange(unitId, range) {
-    var _a23;
-    const docSkeletonManagerService = (_a23 = this._renderManagerService.getRenderById(unitId)) == null ? void 0 : _a23.with(DocSkeletonManagerService), skeleton = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getSkeleton();
+    var _a22;
+    const docSkeletonManagerService = (_a22 = this._renderManagerService.getRenderById(unitId)) == null ? void 0 : _a22.with(DocSkeletonManagerService), skeleton = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getSkeleton();
     if (!skeleton)
       return;
     const { startOffset } = range, anchorNodePosition = skeleton.findNodePositionByCharIndex(startOffset);
     this.scrollToNode(unitId, anchorNodePosition);
   }
   scrollToNode(unitId, startNodePosition) {
-    var _a23;
-    const docObject = this._getDocObject(), docSkeletonManagerService = (_a23 = this._renderManagerService.getRenderById(unitId)) == null ? void 0 : _a23.with(DocSkeletonManagerService), skeleton = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getSkeleton();
+    var _a22;
+    const docObject = this._getDocObject(), docSkeletonManagerService = (_a22 = this._renderManagerService.getRenderById(unitId)) == null ? void 0 : _a22.with(DocSkeletonManagerService), skeleton = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getSkeleton();
     if (docObject == null || skeleton == null)
       return;
     const documentOffsetConfig = docObject.document.getOffsetConfig(), { docsLeft, docsTop } = documentOffsetConfig, convertor = new NodePositionConvertToCursor(documentOffsetConfig, skeleton), { contentBoxPointGroup } = convertor.getRangePointData(startNodePosition, startNodePosition), { left: aLeft, top: aTop, height } = getAnchorBounding(contentBoxPointGroup), left = aLeft + docsLeft, top = aTop + docsTop, viewportMain = docObject.scene.getViewport(VIEWPORT_KEY.VIEW_MAIN), isEditor = !!this._editorService.getEditor(unitId);
@@ -772,11 +804,11 @@ let DocBackScrollRenderController = (_a2 = class extends RxDisposable {
     return getDocObject(this._univerInstanceService, this._renderManagerService);
   }
 }, __name(_a2, "DocBackScrollRenderController"), _a2);
-DocBackScrollRenderController = __decorateClass$k([
-  __decorateParam$k(1, Inject(TextSelectionManagerService)),
-  __decorateParam$k(2, IEditorService),
-  __decorateParam$k(3, Inject(IUniverInstanceService)),
-  __decorateParam$k(4, IRenderManagerService)
+DocBackScrollRenderController = __decorateClass$j([
+  __decorateParam$j(1, Inject(TextSelectionManagerService)),
+  __decorateParam$j(2, IEditorService),
+  __decorateParam$j(3, Inject(IUniverInstanceService)),
+  __decorateParam$j(4, IRenderManagerService)
 ], DocBackScrollRenderController);
 const DefaultToolbarConfig = {
   undo: !0,
@@ -885,11 +917,11 @@ const DefaultToolbarConfig = {
   binding: KeyCode.A | MetaKeys.CTRL_COMMAND,
   preconditions: /* @__PURE__ */ __name((contextService) => contextService.getContextValue(FOCUSING_UNIVER_EDITOR) && (contextService.getContextValue(FOCUSING_DOC) || contextService.getContextValue(EDITOR_ACTIVATED)), "preconditions")
 };
-var __defProp$j = Object.defineProperty, __getOwnPropDesc$j = Object.getOwnPropertyDescriptor, __decorateClass$j = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$j(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$i = Object.defineProperty, __getOwnPropDesc$i = Object.getOwnPropertyDescriptor, __decorateClass$i = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$i(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$j(target, key, result), result;
-}, "__decorateClass$j"), __decorateParam$j = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$j"), _a3;
+  return kind && result && __defProp$i(target, key, result), result;
+}, "__decorateClass$i"), __decorateParam$i = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$i"), _a3;
 let DocContainerUIController = (_a3 = class {
   constructor(_config, _localeService, _injector) {
     __publicField(this, "_docContainer");
@@ -929,15 +961,15 @@ let DocContainerUIController = (_a3 = class {
     return this._docContainer;
   }
 }, __name(_a3, "DocContainerUIController"), _a3);
-DocContainerUIController = __decorateClass$j([
-  __decorateParam$j(1, Inject(LocaleService)),
-  __decorateParam$j(2, Inject(Injector))
+DocContainerUIController = __decorateClass$i([
+  __decorateParam$i(1, Inject(LocaleService)),
+  __decorateParam$i(2, Inject(Injector))
 ], DocContainerUIController);
-var __defProp$i = Object.defineProperty, __getOwnPropDesc$i = Object.getOwnPropertyDescriptor, __decorateClass$i = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$i(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$h = Object.defineProperty, __getOwnPropDesc$h = Object.getOwnPropertyDescriptor, __decorateClass$h = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$h(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$i(target, key, result), result;
-}, "__decorateClass$i"), __decorateParam$i = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$i"), _a4;
+  return kind && result && __defProp$h(target, key, result), result;
+}, "__decorateClass$h"), __decorateParam$h = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$h"), _a4;
 let AppUIController = (_a4 = class extends RxDisposable {
   constructor(_config, _localeService, _injector, _textSelectionRenderManager, _layoutService) {
     super();
@@ -964,11 +996,11 @@ let AppUIController = (_a4 = class extends RxDisposable {
     return this._docContainerController;
   }
 }, __name(_a4, "AppUIController"), _a4);
-AppUIController = __decorateClass$i([
-  __decorateParam$i(1, Inject(LocaleService)),
-  __decorateParam$i(2, Inject(Injector)),
-  __decorateParam$i(3, ITextSelectionRenderManager),
-  __decorateParam$i(4, Optional(ILayoutService))
+AppUIController = __decorateClass$h([
+  __decorateParam$h(1, Inject(LocaleService)),
+  __decorateParam$h(2, Inject(Injector)),
+  __decorateParam$h(3, ITextSelectionRenderManager),
+  __decorateParam$h(4, Optional(ILayoutService))
 ], AppUIController);
 var __assign = function() {
   return __assign = Object.assign || function(t) {
@@ -999,15 +1031,15 @@ function replaceRuntimeIdsAndExtInAttrs(node, runtimeProps, extend) {
   var attrs = __assign({}, node.attrs);
   extend != null && extend.colorChannel1 && attrs.fill === "colorChannel1" && (attrs.fill = extend.colorChannel1);
   var defIds = runtimeProps.defIds;
-  return !defIds || defIds.length === 0 || (node.tag === "use" && attrs["xlink:href"] && (attrs["xlink:href"] = attrs["xlink:href"] + runtimeProps.idSuffix), Object.entries(attrs).forEach(function(_a23) {
-    var key = _a23[0], value = _a23[1];
+  return !defIds || defIds.length === 0 || (node.tag === "use" && attrs["xlink:href"] && (attrs["xlink:href"] = attrs["xlink:href"] + runtimeProps.idSuffix), Object.entries(attrs).forEach(function(_a22) {
+    var key = _a22[0], value = _a22[1];
     typeof value == "string" && (attrs[key] = value.replace(/url\(#(.*)\)/, "url(#$1".concat(runtimeProps.idSuffix, ")")));
   })), attrs;
 }
 __name(replaceRuntimeIdsAndExtInAttrs, "replaceRuntimeIdsAndExtInAttrs");
 function replaceRuntimeIdsInDefs(node, runtimeProps) {
-  var _a23, defIds = runtimeProps.defIds;
-  return !defIds || defIds.length === 0 ? node : node.tag === "defs" && (!((_a23 = node.children) === null || _a23 === void 0) && _a23.length) ? __assign(__assign({}, node), { children: node.children.map(function(child) {
+  var _a22, defIds = runtimeProps.defIds;
+  return !defIds || defIds.length === 0 ? node : node.tag === "defs" && (!((_a22 = node.children) === null || _a22 === void 0) && _a22.length) ? __assign(__assign({}, node), { children: node.children.map(function(child) {
     return typeof child.attrs.id == "string" && defIds && defIds.indexOf(child.attrs.id) > -1 ? __assign(__assign({}, child), { attrs: __assign(__assign({}, child.attrs), { id: child.attrs.id + runtimeProps.idSuffix }) }) : child;
   }) }) : node;
 }
@@ -1142,12 +1174,12 @@ const panel = "univer-panel", optionsSection = "univer-options-section", options
   optionsMarginSetting
 }, DocHeaderFooterOptions = /* @__PURE__ */ __name((props) => {
   const localeService = useDependency(LocaleService), univerInstanceService = useDependency(IUniverInstanceService), renderManagerService = useDependency(IRenderManagerService), commandService = useDependency(ICommandService), textSelectionRenderService = useDependency(ITextSelectionRenderManager), textSelectionManagerService = useDependency(TextSelectionManagerService), { unitId } = props, [options, setOptions] = useState({}), handleCheckboxChange = /* @__PURE__ */ __name((val, type) => {
-    var _a23;
+    var _a22;
     setOptions((prev) => ({
       ...prev,
       [type]: val ? BooleanNumber.TRUE : BooleanNumber.FALSE
     }));
-    const docDataModel = univerInstanceService.getUniverDocInstance(unitId), documentStyle = docDataModel == null ? void 0 : docDataModel.getSnapshot().documentStyle, docSkeletonManagerService = (_a23 = renderManagerService.getRenderById(unitId)) == null ? void 0 : _a23.with(DocSkeletonManagerService), viewModel = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getViewModel();
+    const docDataModel = univerInstanceService.getUniverDocInstance(unitId), documentStyle = docDataModel == null ? void 0 : docDataModel.getSnapshot().documentStyle, docSkeletonManagerService = (_a22 = renderManagerService.getRenderById(unitId)) == null ? void 0 : _a22.with(DocSkeletonManagerService), viewModel = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getViewModel();
     if (documentStyle == null || viewModel == null)
       return;
     const editArea = viewModel.getEditArea();
@@ -1181,12 +1213,12 @@ const panel = "univer-panel", optionsSection = "univer-options-section", options
       }
     }), textSelectionRenderService.removeAllRanges(), textSelectionRenderService.blur();
   }, "handleMarginChange"), closeHeaderFooter = /* @__PURE__ */ __name(() => {
-    var _a23;
+    var _a22;
     const renderObject = renderManagerService.getRenderById(unitId);
     if (renderObject == null)
       return;
     const { scene } = renderObject, transformer = scene.getTransformerByCreate(), docSkeletonManagerService = renderObject.with(DocSkeletonManagerService), skeleton = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getSkeleton(), viewModel = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getViewModel(), render2 = renderManagerService.getRenderById(unitId);
-    render2 == null || viewModel == null || skeleton == null || (textSelectionManagerService.replaceTextRanges([]), transformer.clearSelectedObjects(), textSelectionRenderService.setSegment(""), textSelectionRenderService.setSegmentPage(-1), viewModel.setEditArea(DocumentEditArea.BODY), skeleton.calculate(), (_a23 = render2.mainComponent) == null || _a23.makeDirty(!0));
+    render2 == null || viewModel == null || skeleton == null || (textSelectionManagerService.replaceTextRanges([]), transformer.clearSelectedObjects(), textSelectionRenderService.setSegment(""), textSelectionRenderService.setSegmentPage(-1), viewModel.setEditArea(DocumentEditArea.BODY), skeleton.calculate(), (_a22 = render2.mainComponent) == null || _a22.makeDirty(!0));
   }, "closeHeaderFooter");
   return useEffect(() => {
     const docDataModel = univerInstanceService.getUniverDocInstance(unitId), documentStyle = docDataModel == null ? void 0 : docDataModel.getSnapshot().documentStyle;
@@ -1264,8 +1296,8 @@ const panel = "univer-panel", optionsSection = "univer-options-section", options
     /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$5.optionsSection, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { onClick: closeHeaderFooter, children: localeService.t("headerFooter.closeHeaderFooter") }) })
   ] });
 }, "DocHeaderFooterOptions"), DocHeaderFooterPanel = /* @__PURE__ */ __name(() => {
-  var _a23;
-  const localeService = useDependency(LocaleService), renderManagerService = useDependency(IRenderManagerService), unitId = useDependency(IUniverInstanceService).getCurrentUniverDocInstance().getUnitId(), viewModel = ((_a23 = renderManagerService.getRenderById(unitId)) == null ? void 0 : _a23.with(DocSkeletonManagerService)).getViewModel(), [isEditHeaderFooter, setIsEditHeaderFooter] = useState(!0);
+  var _a22;
+  const localeService = useDependency(LocaleService), renderManagerService = useDependency(IRenderManagerService), unitId = useDependency(IUniverInstanceService).getCurrentUniverDocInstance().getUnitId(), viewModel = ((_a22 = renderManagerService.getRenderById(unitId)) == null ? void 0 : _a22.with(DocSkeletonManagerService)).getViewModel(), [isEditHeaderFooter, setIsEditHeaderFooter] = useState(!0);
   return useEffect(() => {
     const editArea = viewModel.getEditArea();
     setIsEditHeaderFooter(editArea !== DocumentEditArea.BODY);
@@ -1277,11 +1309,11 @@ const panel = "univer-panel", optionsSection = "univer-options-section", options
     };
   }, []), /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$5.panel, children: isEditHeaderFooter ? /* @__PURE__ */ jsxRuntimeExports.jsx(DocHeaderFooterOptions, { unitId }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$5.panelDisableText, children: localeService.t("headerFooter.disableText") }) });
 }, "DocHeaderFooterPanel");
-var __defProp$h = Object.defineProperty, __getOwnPropDesc$h = Object.getOwnPropertyDescriptor, __decorateClass$h = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$h(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$g = Object.defineProperty, __getOwnPropDesc$g = Object.getOwnPropertyDescriptor, __decorateClass$g = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$g(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$h(target, key, result), result;
-}, "__decorateClass$h"), __decorateParam$h = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$h");
+  return kind && result && __defProp$g(target, key, result), result;
+}, "__decorateClass$g"), __decorateParam$g = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$g");
 const HEADER_FOOTER_STROKE_COLOR = "rgba(58, 96, 247, 1)", HEADER_FOOTER_FILL_COLOR = "rgba(58, 96, 247, 0.08)";
 var HeaderFooterType = /* @__PURE__ */ ((HeaderFooterType2) => (HeaderFooterType2[HeaderFooterType2.FIRST_PAGE_HEADER = 0] = "FIRST_PAGE_HEADER", HeaderFooterType2[HeaderFooterType2.FIRST_PAGE_FOOTER = 1] = "FIRST_PAGE_FOOTER", HeaderFooterType2[HeaderFooterType2.DEFAULT_HEADER = 2] = "DEFAULT_HEADER", HeaderFooterType2[HeaderFooterType2.DEFAULT_FOOTER = 3] = "DEFAULT_FOOTER", HeaderFooterType2[HeaderFooterType2.EVEN_PAGE_HEADER = 4] = "EVEN_PAGE_HEADER", HeaderFooterType2[HeaderFooterType2.EVEN_PAGE_FOOTER = 5] = "EVEN_PAGE_FOOTER", HeaderFooterType2))(HeaderFooterType || {});
 function checkCreateHeaderFooterType(viewModel, editArea, segmentPage) {
@@ -1472,15 +1504,15 @@ let DocHeaderFooterController = (_a5 = class extends Disposable {
     return this._context.unit;
   }
 }, __name(_a5, "DocHeaderFooterController"), _a5);
-DocHeaderFooterController = __decorateClass$h([
-  __decorateParam$h(1, ICommandService),
-  __decorateParam$h(2, IEditorService),
-  __decorateParam$h(3, IUniverInstanceService),
-  __decorateParam$h(4, IRenderManagerService),
-  __decorateParam$h(5, Inject(DocSkeletonManagerService)),
-  __decorateParam$h(6, ITextSelectionRenderManager),
-  __decorateParam$h(7, Inject(LocaleService)),
-  __decorateParam$h(8, Inject(ComponentManager))
+DocHeaderFooterController = __decorateClass$g([
+  __decorateParam$g(1, ICommandService),
+  __decorateParam$g(2, IEditorService),
+  __decorateParam$g(3, IUniverInstanceService),
+  __decorateParam$g(4, IRenderManagerService),
+  __decorateParam$g(5, Inject(DocSkeletonManagerService)),
+  __decorateParam$g(6, ITextSelectionRenderManager),
+  __decorateParam$g(7, Inject(LocaleService)),
+  __decorateParam$g(8, Inject(ComponentManager))
 ], DocHeaderFooterController);
 const SidebarDocHeaderFooterPanelOperation = {
   id: "sidebar.operation.doc-header-footer-panel",
@@ -1586,8 +1618,8 @@ const CoreHeaderFooterCommandId = "doc.command.core-header-footer", CoreHeaderFo
   type: CommandType.COMMAND,
   // eslint-disable-next-line max-lines-per-function
   handler: /* @__PURE__ */ __name(async (accessor, params) => {
-    var _a23;
-    const commandService = accessor.get(ICommandService), univerInstanceService = accessor.get(IUniverInstanceService), renderManagerService = accessor.get(IRenderManagerService), { unitId, segmentId, createType, headerFooterProps } = params, docSkeletonManagerService = (_a23 = renderManagerService.getRenderById(unitId)) == null ? void 0 : _a23.with(DocSkeletonManagerService), docDataModel = univerInstanceService.getUniverDocInstance(unitId), docViewModel = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getViewModel();
+    var _a22;
+    const commandService = accessor.get(ICommandService), univerInstanceService = accessor.get(IUniverInstanceService), renderManagerService = accessor.get(IRenderManagerService), { unitId, segmentId, createType, headerFooterProps } = params, docSkeletonManagerService = (_a22 = renderManagerService.getRenderById(unitId)) == null ? void 0 : _a22.with(DocSkeletonManagerService), docDataModel = univerInstanceService.getUniverDocInstance(unitId), docViewModel = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getViewModel();
     if (docDataModel == null || docViewModel == null)
       return !1;
     const editArea = docViewModel.getEditArea(), { documentStyle } = docDataModel.getSnapshot(), isUpdateMargin = (headerFooterProps == null ? void 0 : headerFooterProps.marginFooter) != null || (headerFooterProps == null ? void 0 : headerFooterProps.marginHeader) != null, textRanges = [{
@@ -1628,9 +1660,9 @@ const CoreHeaderFooterCommandId = "doc.command.core-header-footer", CoreHeaderFo
 }, ZOOM_MAP = [50, 80, 100, 130, 150, 170, 200, 400], DOC_ZOOM_RANGE = [10, 400];
 function ZoomSlider() {
   const commandService = useDependency(ICommandService), univerInstanceService = useDependency(IUniverInstanceService), currentDoc$ = useMemo(() => univerInstanceService.getCurrentTypeOfUnit$(UniverInstanceType.UNIVER_DOC), []), documentDataModel = useObservable(currentDoc$), getCurrentZoom = useCallback(() => {
-    var _a23, _b;
+    var _a22, _b;
     if (!documentDataModel) return 100;
-    const currentZoom = ((_b = (_a23 = documentDataModel.getSettings()) == null ? void 0 : _a23.zoomRatio) != null ? _b : 1) * 100;
+    const currentZoom = ((_b = (_a22 = documentDataModel.getSettings()) == null ? void 0 : _a22.zoomRatio) != null ? _b : 1) * 100;
     return Math.round(currentZoom);
   }, [documentDataModel]), [zoom, setZoom] = useState(() => getCurrentZoom());
   useEffect(() => (setZoom(getCurrentZoom()), commandService.onCommandExecuted((commandInfo) => {
@@ -1903,6 +1935,25 @@ function getTableDisabledObservable(accessor) {
   });
 }
 __name(getTableDisabledObservable, "getTableDisabledObservable");
+function disableMenuWhenNoDocRange(accessor) {
+  const textSelectionManagerService = accessor.get(TextSelectionManagerService);
+  return new Observable((subscriber) => {
+    const subscription = textSelectionManagerService.textSelection$.subscribe((selection) => {
+      if (selection == null) {
+        subscriber.next(!0);
+        return;
+      }
+      const { textRanges, rectRanges } = selection;
+      if (textRanges.length === 0 && rectRanges.length === 0) {
+        subscriber.next(!0);
+        return;
+      }
+      subscriber.next(!1);
+    });
+    return () => subscription.unsubscribe();
+  });
+}
+__name(disableMenuWhenNoDocRange, "disableMenuWhenNoDocRange");
 function BoldMenuItemFactory(accessor) {
   const commandService = accessor.get(ICommandService);
   return {
@@ -1915,18 +1966,21 @@ function BoldMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a23;
+        var _a22;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === SetInlineFormatCommand.id) {
           const textRun = getFontStyleAtCursor(accessor);
-          if (textRun == null)
+          if (textRun == null) {
+            subscriber.next(!1);
             return;
-          const bl = (_a23 = textRun.ts) == null ? void 0 : _a23.bl;
+          }
+          const bl = (_a22 = textRun.ts) == null ? void 0 : _a22.bl;
           subscriber.next(bl === BooleanNumber.TRUE);
         }
       });
       return subscriber.next(!1), disposable.dispose;
     }),
+    disabled$: disableMenuWhenNoDocRange(accessor),
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
   };
 }
@@ -1943,18 +1997,21 @@ function ItalicMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a23;
+        var _a22;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === SetInlineFormatCommand.id) {
           const textRun = getFontStyleAtCursor(accessor);
-          if (textRun == null)
+          if (textRun == null) {
+            subscriber.next(!1);
             return;
-          const it = (_a23 = textRun.ts) == null ? void 0 : _a23.it;
+          }
+          const it = (_a22 = textRun.ts) == null ? void 0 : _a22.it;
           subscriber.next(it === BooleanNumber.TRUE);
         }
       });
       return subscriber.next(!1), disposable.dispose;
     }),
+    disabled$: disableMenuWhenNoDocRange(accessor),
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
   };
 }
@@ -1971,18 +2028,21 @@ function UnderlineMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a23;
+        var _a22;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === SetInlineFormatCommand.id) {
           const textRun = getFontStyleAtCursor(accessor);
-          if (textRun == null)
+          if (textRun == null) {
+            subscriber.next(!1);
             return;
-          const ul = (_a23 = textRun.ts) == null ? void 0 : _a23.ul;
+          }
+          const ul = (_a22 = textRun.ts) == null ? void 0 : _a22.ul;
           subscriber.next((ul == null ? void 0 : ul.s) === BooleanNumber.TRUE);
         }
       });
       return subscriber.next(!1), disposable.dispose;
     }),
+    disabled$: disableMenuWhenNoDocRange(accessor),
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
   };
 }
@@ -1999,18 +2059,21 @@ function StrikeThroughMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a23;
+        var _a22;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === SetInlineFormatCommand.id) {
           const textRun = getFontStyleAtCursor(accessor);
-          if (textRun == null)
+          if (textRun == null) {
+            subscriber.next(!1);
             return;
-          const st = (_a23 = textRun.ts) == null ? void 0 : _a23.st;
+          }
+          const st = (_a22 = textRun.ts) == null ? void 0 : _a22.st;
           subscriber.next((st == null ? void 0 : st.s) === BooleanNumber.TRUE);
         }
       });
       return subscriber.next(!1), disposable.dispose;
     }),
+    disabled$: disableMenuWhenNoDocRange(accessor),
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
   };
 }
@@ -2026,18 +2089,21 @@ function SubscriptMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a23;
+        var _a22;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === SetInlineFormatCommand.id) {
           const textRun = getFontStyleAtCursor(accessor);
-          if (textRun == null)
+          if (textRun == null) {
+            subscriber.next(!1);
             return;
-          const va = (_a23 = textRun.ts) == null ? void 0 : _a23.va;
+          }
+          const va = (_a22 = textRun.ts) == null ? void 0 : _a22.va;
           subscriber.next(va === BaselineOffset.SUBSCRIPT);
         }
       });
       return subscriber.next(!1), disposable.dispose;
     }),
+    disabled$: disableMenuWhenNoDocRange(accessor),
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
   };
 }
@@ -2053,18 +2119,21 @@ function SuperscriptMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a23;
+        var _a22;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === SetInlineFormatCommand.id) {
           const textRun = getFontStyleAtCursor(accessor);
-          if (textRun == null)
+          if (textRun == null) {
+            subscriber.next(!1);
             return;
-          const va = (_a23 = textRun.ts) == null ? void 0 : _a23.va;
+          }
+          const va = (_a22 = textRun.ts) == null ? void 0 : _a22.va;
           subscriber.next(va === BaselineOffset.SUPERSCRIPT);
         }
       });
       return subscriber.next(!1), disposable.dispose;
     }),
+    disabled$: disableMenuWhenNoDocRange(accessor),
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
   };
 }
@@ -2088,18 +2157,21 @@ function FontFamilySelectorMenuItemFactory(accessor) {
     // disabled$: getCurrentSheetDisabled$(accessor),
     value$: new Observable((subscriber) => {
       const defaultValue = FONT_FAMILY_LIST[0].value, disposable = commandService.onCommandExecuted((c) => {
-        var _a23;
+        var _a22;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === SetInlineFormatFontFamilyCommand.id) {
           const textRun = getFontStyleAtCursor(accessor);
-          if (textRun == null)
+          if (textRun == null) {
+            subscriber.next(defaultValue);
             return;
-          const ff = (_a23 = textRun.ts) == null ? void 0 : _a23.ff;
+          }
+          const ff = (_a22 = textRun.ts) == null ? void 0 : _a22.ff;
           subscriber.next(ff != null ? ff : defaultValue);
         }
       });
       return subscriber.next(defaultValue), disposable.dispose;
     }),
+    disabled$: disableMenuWhenNoDocRange(accessor),
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
   };
 }
@@ -2124,18 +2196,21 @@ function FontSizeSelectorMenuItemFactory(accessor) {
     // disabled$,
     value$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a23;
+        var _a22;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === SetInlineFormatFontSizeCommand.id) {
           const textRun = getFontStyleAtCursor(accessor);
-          if (textRun == null)
+          if (textRun == null) {
+            subscriber.next(14);
             return;
-          const fs = (_a23 = textRun.ts) == null ? void 0 : _a23.fs;
+          }
+          const fs = (_a22 = textRun.ts) == null ? void 0 : _a22.fs;
           subscriber.next(fs != null ? fs : 14);
         }
       });
       return subscriber.next(14), disposable.dispose;
     }),
+    disabled$: disableMenuWhenNoDocRange(accessor),
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
   };
 }
@@ -2166,6 +2241,7 @@ function TextColorSelectorMenuItemFactory(accessor) {
       });
       return subscriber.next(defaultColor), disposable.dispose;
     }),
+    disabled$: disableMenuWhenNoDocRange(accessor),
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
     // disabled$: getCurrentSheetDisabled$(accessor),
   };
@@ -2217,15 +2293,16 @@ function AlignLeftMenuItemFactory(accessor) {
     icon: "LeftJustifyingSingle",
     tooltip: "toolbar.alignLeft",
     positions: [MenuPosition.TOOLBAR_START],
+    disabled$: disableMenuWhenNoDocRange(accessor),
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a23;
+        var _a22;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === AlignOperationCommand.id) {
           const paragraph = getParagraphStyleAtCursor(accessor);
           if (paragraph == null)
             return;
-          const alignType = (_a23 = paragraph.paragraphStyle) == null ? void 0 : _a23.horizontalAlign;
+          const alignType = (_a22 = paragraph.paragraphStyle) == null ? void 0 : _a22.horizontalAlign;
           subscriber.next(alignType === HorizontalAlign.LEFT);
         }
       });
@@ -2246,18 +2323,19 @@ function AlignCenterMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a23;
+        var _a22;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === AlignOperationCommand.id) {
           const paragraph = getParagraphStyleAtCursor(accessor);
           if (paragraph == null)
             return;
-          const alignType = (_a23 = paragraph.paragraphStyle) == null ? void 0 : _a23.horizontalAlign;
+          const alignType = (_a22 = paragraph.paragraphStyle) == null ? void 0 : _a22.horizontalAlign;
           subscriber.next(alignType === HorizontalAlign.CENTER);
         }
       });
       return subscriber.next(!1), disposable.dispose;
     }),
+    disabled$: disableMenuWhenNoDocRange(accessor),
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
   };
 }
@@ -2273,18 +2351,19 @@ function AlignRightMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a23;
+        var _a22;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === AlignOperationCommand.id) {
           const paragraph = getParagraphStyleAtCursor(accessor);
           if (paragraph == null)
             return;
-          const alignType = (_a23 = paragraph.paragraphStyle) == null ? void 0 : _a23.horizontalAlign;
+          const alignType = (_a22 = paragraph.paragraphStyle) == null ? void 0 : _a22.horizontalAlign;
           subscriber.next(alignType === HorizontalAlign.RIGHT);
         }
       });
       return subscriber.next(!1), disposable.dispose;
     }),
+    disabled$: disableMenuWhenNoDocRange(accessor),
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
   };
 }
@@ -2300,18 +2379,19 @@ function AlignJustifyMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a23;
+        var _a22;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === AlignOperationCommand.id) {
           const paragraph = getParagraphStyleAtCursor(accessor);
           if (paragraph == null)
             return;
-          const alignType = (_a23 = paragraph.paragraphStyle) == null ? void 0 : _a23.horizontalAlign;
+          const alignType = (_a22 = paragraph.paragraphStyle) == null ? void 0 : _a22.horizontalAlign;
           subscriber.next(alignType === HorizontalAlign.JUSTIFIED);
         }
       });
       return subscriber.next(!1), disposable.dispose;
     }),
+    disabled$: disableMenuWhenNoDocRange(accessor),
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
   };
 }
@@ -2324,14 +2404,14 @@ const listValueFactory$ = /* @__PURE__ */ __name((accessor) => new Observable((s
       return;
     const docDataModel = univerInstanceService.getUniverDocInstance(unitId);
     docDataModel != null && (textSubscription = textSelectionManagerService.textSelection$.subscribe(() => {
-      var _a23, _b;
+      var _a22, _b;
       const range = textSelectionManagerService.getActiveTextRangeWithStyle();
       if (range) {
-        const doc = docDataModel.getSelfOrHeaderFooterModel(range == null ? void 0 : range.segmentId), paragraphs = getParagraphsInRange(range, (_b = (_a23 = doc.getBody()) == null ? void 0 : _a23.paragraphs) != null ? _b : []);
+        const doc = docDataModel.getSelfOrHeaderFooterModel(range == null ? void 0 : range.segmentId), paragraphs = getParagraphsInRange(range, (_b = (_a22 = doc.getBody()) == null ? void 0 : _a22.paragraphs) != null ? _b : []);
         let listType;
         if (paragraphs.every((p2) => {
-          var _a24;
-          return listType || (listType = (_a24 = p2.bullet) == null ? void 0 : _a24.listType), p2.bullet && p2.bullet.listType === listType;
+          var _a23;
+          return listType || (listType = (_a23 = p2.bullet) == null ? void 0 : _a23.listType), p2.bullet && p2.bullet.listType === listType;
         })) {
           subscriber.next(listType);
           return;
@@ -2362,6 +2442,7 @@ function OrderListMenuItemFactory(accessor) {
     tooltip: "toolbar.order",
     positions: [MenuPosition.TOOLBAR_START],
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC),
+    disabled$: disableMenuWhenNoDocRange(accessor),
     activated$: listValueFactory$(accessor).pipe(map((v) => v && v.indexOf("ORDER_LIST") === 0))
   };
 }
@@ -2383,6 +2464,7 @@ function BulletListMenuItemFactory(accessor) {
     icon: "UnorderSingle",
     tooltip: "toolbar.unorder",
     positions: [MenuPosition.TOOLBAR_START],
+    disabled$: disableMenuWhenNoDocRange(accessor),
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC),
     activated$: listValueFactory$(accessor).pipe(map((v) => v && v.indexOf("BULLET_LIST") === 0))
   };
@@ -2396,6 +2478,7 @@ function CheckListMenuItemFactory(accessor) {
     icon: "TodoList",
     tooltip: "toolbar.checklist",
     positions: [MenuPosition.TOOLBAR_START],
+    disabled$: disableMenuWhenNoDocRange(accessor),
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC),
     activated$: listValueFactory$(accessor).pipe(map((v) => v && v.indexOf("CHECK_LIST") === 0))
   };
@@ -2437,25 +2520,22 @@ function BackgroundColorSelectorMenuItemFactory(accessor) {
       });
       return subscriber.next(defaultColor), disposable.dispose;
     }),
+    disabled$: disableMenuWhenNoDocRange(accessor),
     hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
   };
 }
 __name(BackgroundColorSelectorMenuItemFactory, "BackgroundColorSelectorMenuItemFactory");
 function getFontStyleAtCursor(accessor) {
-  var _a23;
+  var _a22;
   const univerInstanceService = accessor.get(IUniverInstanceService), textSelectionService = accessor.get(TextSelectionManagerService), docDataModel = univerInstanceService.getCurrentUniverDocInstance(), activeTextRange = textSelectionService.getActiveTextRangeWithStyle();
   if (docDataModel == null || activeTextRange == null)
     return;
-  const { startOffset, segmentId } = activeTextRange, textRuns = (_a23 = docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody()) == null ? void 0 : _a23.textRuns;
+  const { startOffset, segmentId } = activeTextRange, textRuns = (_a22 = docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody()) == null ? void 0 : _a22.textRuns;
   if (textRuns == null)
     return;
   let textRun;
-  for (let i = 0; i < textRuns.length; i++) {
-    const curTextRun = textRuns[i], nextTextRun = textRuns[i + 1];
-    if (nextTextRun && nextTextRun.st === nextTextRun.ed && startOffset === nextTextRun.st) {
-      textRun = nextTextRun;
-      break;
-    }
+  for (let i = textRuns.length - 1; i >= 0; i--) {
+    const curTextRun = textRuns[i];
     if (curTextRun.st <= startOffset && startOffset <= curTextRun.ed) {
       textRun = curTextRun;
       break;
@@ -2465,11 +2545,11 @@ function getFontStyleAtCursor(accessor) {
 }
 __name(getFontStyleAtCursor, "getFontStyleAtCursor");
 function getParagraphStyleAtCursor(accessor) {
-  var _a23;
+  var _a22;
   const univerInstanceService = accessor.get(IUniverInstanceService), textSelectionService = accessor.get(TextSelectionManagerService), docDataModel = univerInstanceService.getCurrentUniverDocInstance(), activeTextRange = textSelectionService.getActiveTextRangeWithStyle();
   if (docDataModel == null || activeTextRange == null)
     return;
-  const { startOffset, segmentId } = activeTextRange, paragraphs = (_a23 = docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody()) == null ? void 0 : _a23.paragraphs;
+  const { startOffset, segmentId } = activeTextRange, paragraphs = (_a22 = docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody()) == null ? void 0 : _a22.paragraphs;
   if (paragraphs == null)
     return;
   let prevIndex = -1;
@@ -2486,6 +2566,10 @@ function whenDocOrEditor(contextService) {
   return contextService.getContextValue(FOCUSING_DOC) || contextService.getContextValue(EDITOR_ACTIVATED);
 }
 __name(whenDocOrEditor, "whenDocOrEditor");
+function whenFocusEditor(contextService) {
+  return contextService.getContextValue(EDITOR_ACTIVATED);
+}
+__name(whenFocusEditor, "whenFocusEditor");
 const DOC_CLIPBOARD_PRIORITY = 999, DocCopyCommand = {
   id: CopyCommand.id,
   name: "doc.command.copy",
@@ -2517,11 +2601,11 @@ const DOC_CLIPBOARD_PRIORITY = 999, DocCopyCommand = {
   id: "doc-paragraph-setting.command",
   type: CommandType.COMMAND,
   handler: /* @__PURE__ */ __name(async (accessor, config) => {
-    var _a23, _b, _c;
+    var _a22, _b, _c;
     const textSelectionManagerService = accessor.get(TextSelectionManagerService), univerInstanceService = accessor.get(IUniverInstanceService), commandService = accessor.get(ICommandService), docDataModel = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_DOC), docRanges = textSelectionManagerService.getDocRanges();
     if (!docDataModel || docRanges.length === 0 || !config)
       return !1;
-    const segmentId = docRanges[0].segmentId, unitId = docDataModel.getUnitId(), allParagraphs = (_b = (_a23 = docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody()) == null ? void 0 : _a23.paragraphs) != null ? _b : [], paragraphs = (_c = getParagraphsInRanges(docRanges, allParagraphs)) != null ? _c : [], serializedSelections = docRanges.map(serializeDocRange), doMutation = {
+    const segmentId = docRanges[0].segmentId, unitId = docDataModel.getUnitId(), allParagraphs = (_b = (_a22 = docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody()) == null ? void 0 : _a22.paragraphs) != null ? _b : [], paragraphs = (_c = getParagraphsInRanges(docRanges, allParagraphs)) != null ? _c : [], serializedSelections = docRanges.map(serializeDocRange), doMutation = {
       id: RichTextEditingMutation.id,
       params: {
         unitId,
@@ -2563,80 +2647,80 @@ const DOC_CLIPBOARD_PRIORITY = 999, DocCopyCommand = {
     return doMutation.params.actions = jsonX.editOp(textX.serialize(), path), !!commandService.syncExecuteCommand(doMutation.id, doMutation.params);
   }, "handler")
 }, useCurrentParagraph = /* @__PURE__ */ __name(() => {
-  var _a23, _b, _c;
+  var _a22, _b, _c;
   const textSelectionManagerService = useDependency(TextSelectionManagerService), docDataModel = useDependency(IUniverInstanceService).getCurrentUnitForType(UniverInstanceType.UNIVER_DOC), docRanges = useMemo(() => textSelectionManagerService.getDocRanges(), []);
   if (!docDataModel || docRanges.length === 0)
     return [];
-  const segmentId = docRanges[0].segmentId, paragraphs = (_b = (_a23 = docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody()) == null ? void 0 : _a23.paragraphs) != null ? _b : [];
+  const segmentId = docRanges[0].segmentId, paragraphs = (_b = (_a22 = docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody()) == null ? void 0 : _a22.paragraphs) != null ? _b : [];
   return (_c = getParagraphsInRanges(docRanges, paragraphs)) != null ? _c : [];
 }, "useCurrentParagraph"), useFirstParagraphHorizontalAlign = /* @__PURE__ */ __name((paragraph, defaultValue) => {
   const commandService = useDependency(ICommandService), [horizontalAlign, _horizontalAlignSet] = useState(() => {
-    var _a23, _b;
+    var _a22, _b;
     const firstParagraph = paragraph[0];
-    return firstParagraph ? String((_b = (_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.horizontalAlign) != null ? _b : defaultValue) : defaultValue;
+    return firstParagraph ? String((_b = (_a22 = firstParagraph.paragraphStyle) == null ? void 0 : _a22.horizontalAlign) != null ? _b : defaultValue) : defaultValue;
   });
   return [horizontalAlign, /* @__PURE__ */ __name((v) => (_horizontalAlignSet(v), commandService.executeCommand(DocParagraphSettingCommand.id, {
     horizontalAlign: Number(v)
   })), "horizontalAlignSet")];
 }, "useFirstParagraphHorizontalAlign"), useFirstParagraphIndentStart = /* @__PURE__ */ __name((paragraph) => {
   const commandService = useDependency(ICommandService), [indentStart, _indentStartSet] = useState(() => {
-    var _a23;
+    var _a22;
     const firstParagraph = paragraph[0];
-    return firstParagraph ? getNumberUnitValue((_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.indentStart, 0) : 0;
+    return firstParagraph ? getNumberUnitValue((_a22 = firstParagraph.paragraphStyle) == null ? void 0 : _a22.indentStart, 0) : 0;
   });
   return [indentStart, /* @__PURE__ */ __name((v) => (_indentStartSet(v), commandService.executeCommand(DocParagraphSettingCommand.id, {
     indentStart: { v }
   })), "indentStartSet")];
 }, "useFirstParagraphIndentStart"), useFirstParagraphIndentEnd = /* @__PURE__ */ __name((paragraph) => {
   const commandService = useDependency(ICommandService), [indentEnd, _indentEndSet] = useState(() => {
-    var _a23;
+    var _a22;
     const firstParagraph = paragraph[0];
-    return firstParagraph ? getNumberUnitValue((_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.indentEnd, 0) : 0;
+    return firstParagraph ? getNumberUnitValue((_a22 = firstParagraph.paragraphStyle) == null ? void 0 : _a22.indentEnd, 0) : 0;
   });
   return [indentEnd, /* @__PURE__ */ __name((v) => (_indentEndSet(v), commandService.executeCommand(DocParagraphSettingCommand.id, {
     indentEnd: { v }
   })), "indentEndSet")];
 }, "useFirstParagraphIndentEnd"), useFirstParagraphIndentFirstLine = /* @__PURE__ */ __name((paragraph) => {
   const commandService = useDependency(ICommandService), [indentFirstLine, _indentFirstLineSet] = useState(() => {
-    var _a23;
+    var _a22;
     const firstParagraph = paragraph[0];
-    return firstParagraph ? getNumberUnitValue((_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.indentFirstLine, 0) : 0;
+    return firstParagraph ? getNumberUnitValue((_a22 = firstParagraph.paragraphStyle) == null ? void 0 : _a22.indentFirstLine, 0) : 0;
   });
   return [indentFirstLine, /* @__PURE__ */ __name((v) => (_indentFirstLineSet(v), commandService.executeCommand(DocParagraphSettingCommand.id, {
     indentFirstLine: { v }
   })), "indentFirstLineSet")];
 }, "useFirstParagraphIndentFirstLine"), useFirstParagraphIndentHanging = /* @__PURE__ */ __name((paragraph) => {
   const commandService = useDependency(ICommandService), [hanging, _hangingSet] = useState(() => {
-    var _a23;
+    var _a22;
     const firstParagraph = paragraph[0];
-    return firstParagraph ? getNumberUnitValue((_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.hanging, 0) : 0;
+    return firstParagraph ? getNumberUnitValue((_a22 = firstParagraph.paragraphStyle) == null ? void 0 : _a22.hanging, 0) : 0;
   });
   return [hanging, /* @__PURE__ */ __name((v) => (_hangingSet(v), commandService.executeCommand(DocParagraphSettingCommand.id, {
     hanging: { v }
   })), "hangingSet")];
 }, "useFirstParagraphIndentHanging"), useFirstParagraphIndentSpaceAbove = /* @__PURE__ */ __name((paragraph) => {
   const commandService = useDependency(ICommandService), [spaceAbove, _spaceAboveSet] = useState(() => {
-    var _a23;
+    var _a22;
     const firstParagraph = paragraph[0];
-    return firstParagraph ? getNumberUnitValue((_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.spaceAbove, 0) : 0;
+    return firstParagraph ? getNumberUnitValue((_a22 = firstParagraph.paragraphStyle) == null ? void 0 : _a22.spaceAbove, 0) : 0;
   });
   return [spaceAbove, /* @__PURE__ */ __name((v) => (_spaceAboveSet(v), commandService.executeCommand(DocParagraphSettingCommand.id, {
     spaceAbove: { v }
   })), "spaceAboveSet")];
 }, "useFirstParagraphIndentSpaceAbove"), useFirstParagraphSpaceBelow = /* @__PURE__ */ __name((paragraph) => {
   const commandService = useDependency(ICommandService), [spaceBelow, _spaceBelowSet] = useState(() => {
-    var _a23;
+    var _a22;
     const firstParagraph = paragraph[0];
-    return firstParagraph ? getNumberUnitValue((_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.spaceBelow, 0) : 0;
+    return firstParagraph ? getNumberUnitValue((_a22 = firstParagraph.paragraphStyle) == null ? void 0 : _a22.spaceBelow, 0) : 0;
   });
   return [spaceBelow, /* @__PURE__ */ __name((v) => (_spaceBelowSet(v), commandService.executeCommand(DocParagraphSettingCommand.id, {
     spaceBelow: { v }
   })), "spaceBelowSet")];
 }, "useFirstParagraphSpaceBelow"), useFirstParagraphLineSpacing = /* @__PURE__ */ __name((paragraph) => {
   const commandService = useDependency(ICommandService), [lineSpacing, _lineSpacingSet] = useState(() => {
-    var _a23, _b;
+    var _a22, _b;
     const firstParagraph = paragraph[0];
-    return firstParagraph && (_b = (_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.lineSpacing) != null ? _b : 1;
+    return firstParagraph && (_b = (_a22 = firstParagraph.paragraphStyle) == null ? void 0 : _a22.lineSpacing) != null ? _b : 1;
   });
   return [lineSpacing, /* @__PURE__ */ __name((v) => (_lineSpacingSet(v), commandService.executeCommand(DocParagraphSettingCommand.id, {
     lineSpacing: v
@@ -2661,8 +2745,8 @@ const DOC_CLIPBOARD_PRIORITY = 999, DocCopyCommand = {
       onChange: /* @__PURE__ */ __name((v) => {
         onChange(v != null ? v : 0).finally(() => {
           setTimeout(() => {
-            var _a23;
-            (_a23 = ref.current) == null || _a23.focus();
+            var _a22;
+            (_a22 = ref.current) == null || _a22.focus();
           }, 2);
         });
       }, "onChange"),
@@ -2756,13 +2840,13 @@ function ParagraphSettingIndex() {
   const commandService = useDependency(ICommandService), localeService = useDependency(LocaleService), currentLocale = useObservable(localeService.currentLocale$), [key, keySet] = useState(""), rangeRef = useRef([]);
   return useEffect(() => {
     const dispose = commandService.onCommandExecuted((info) => {
-      var _a23;
+      var _a22;
       if (SetTextSelectionsOperation.id === info.id) {
         const ranges = info.params.ranges;
         isRangesEqual(ranges, rangeRef.current) || keySet(generateRandomId(4)), rangeRef.current = ranges;
       }
       if (RichTextEditingMutation.id === info.id) {
-        const params = info.params, ranges = (_a23 = params.textRanges) != null ? _a23 : [];
+        const params = info.params, ranges = (_a22 = params.textRanges) != null ? _a22 : [];
         params.trigger !== DocParagraphSettingCommand.id && isRangesIntersection(ranges, rangeRef.current) && keySet(generateRandomId(4));
       }
     });
@@ -2772,11 +2856,11 @@ function ParagraphSettingIndex() {
   }, [currentLocale]), /* @__PURE__ */ jsxRuntimeExports.jsx(ParagraphSetting, {}, key);
 }
 __name(ParagraphSettingIndex, "ParagraphSettingIndex");
-var __defProp$g = Object.defineProperty, __getOwnPropDesc$g = Object.getOwnPropertyDescriptor, __decorateClass$g = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$g(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$f = Object.defineProperty, __getOwnPropDesc$f = Object.getOwnPropertyDescriptor, __decorateClass$f = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$f(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$g(target, key, result), result;
-}, "__decorateClass$g"), __decorateParam$g = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$g");
+  return kind && result && __defProp$f(target, key, result), result;
+}, "__decorateClass$f"), __decorateParam$f = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$f");
 const paragraphSettingIndexKey = "doc_ui_paragraph-setting-panel";
 var _a6;
 let DocParagraphSettingController = (_a6 = class extends Disposable {
@@ -2797,11 +2881,11 @@ let DocParagraphSettingController = (_a6 = class extends Disposable {
     this._sidebarService.open(props);
   }
 }, __name(_a6, "DocParagraphSettingController"), _a6);
-DocParagraphSettingController = __decorateClass$g([
+DocParagraphSettingController = __decorateClass$f([
   OnLifecycle(LifecycleStages.Rendered, DocParagraphSettingController),
-  __decorateParam$g(0, ICommandService),
-  __decorateParam$g(1, Inject(ComponentManager)),
-  __decorateParam$g(2, Inject(ISidebarService))
+  __decorateParam$f(0, ICommandService),
+  __decorateParam$f(1, Inject(ComponentManager)),
+  __decorateParam$f(2, Inject(ISidebarService))
 ], DocParagraphSettingController);
 const DocParagraphSettingPanelOperation = {
   id: "sidebar.operation.doc-paragraph-setting-panel",
@@ -2828,14 +2912,14 @@ const getDisableWhenSelectionNotInTableObservable = /* @__PURE__ */ __name((acce
   const textSelectionManagerService = accessor.get(TextSelectionManagerService), univerInstanceService = accessor.get(IUniverInstanceService);
   return new Observable((subscriber) => {
     const observable = textSelectionManagerService.textSelection$.subscribe(() => {
-      var _a23;
+      var _a22;
       const rectRanges = textSelectionManagerService.getCurrentRectRanges(), activeRange = textSelectionManagerService.getActiveTextRangeWithStyle();
       if (rectRanges && rectRanges.length && inSameTable(rectRanges)) {
         subscriber.next(!1);
         return;
       }
       if (activeRange && (rectRanges == null || rectRanges.length === 0)) {
-        const { segmentId, startOffset, endOffset } = activeRange, docDataModel = univerInstanceService.getCurrentUniverDocInstance(), tables = (_a23 = docDataModel == null ? void 0 : docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody()) == null ? void 0 : _a23.tables;
+        const { segmentId, startOffset, endOffset } = activeRange, docDataModel = univerInstanceService.getCurrentUniverDocInstance(), tables = (_a22 = docDataModel == null ? void 0 : docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody()) == null ? void 0 : _a22.tables;
         if (tables && tables.length && tables.some((table) => {
           const { startIndex, endIndex } = table;
           return startOffset > startIndex && startOffset < endIndex || endOffset > startIndex && endOffset < endIndex;
@@ -3001,11 +3085,11 @@ function DeleteTableMenuItemFactory(accessor) {
   };
 }
 __name(DeleteTableMenuItemFactory, "DeleteTableMenuItemFactory");
-var __defProp$f = Object.defineProperty, __getOwnPropDesc$f = Object.getOwnPropertyDescriptor, __decorateClass$f = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$f(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$e = Object.defineProperty, __getOwnPropDesc$e = Object.getOwnPropertyDescriptor, __decorateClass$e = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$e(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$f(target, key, result), result;
-}, "__decorateClass$f"), __decorateParam$f = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$f"), _a7;
+  return kind && result && __defProp$e(target, key, result), result;
+}, "__decorateClass$e"), __decorateParam$e = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$e"), _a7;
 let DocUIController = (_a7 = class extends Disposable {
   constructor(_config, _injector, _componentManager, _commandService, _layoutService, _menuService, _uiPartsService, _univerInstanceService, _shortcutService) {
     super(), this._config = _config, this._injector = _injector, this._componentManager = _componentManager, this._commandService = _commandService, this._layoutService = _layoutService, this._menuService = _menuService, this._uiPartsService = _uiPartsService, this._univerInstanceService = _univerInstanceService, this._shortcutService = _shortcutService, this._init();
@@ -3015,9 +3099,9 @@ let DocUIController = (_a7 = class extends Disposable {
     this.disposeWithMe(componentManager.register(COLOR_PICKER_COMPONENT, ColorPicker)), this.disposeWithMe(componentManager.register(FONT_FAMILY_COMPONENT, FontFamily)), this.disposeWithMe(componentManager.register(FONT_FAMILY_ITEM_COMPONENT, FontFamilyItem)), this.disposeWithMe(componentManager.register(FONT_SIZE_COMPONENT, FontSize)), this.disposeWithMe(componentManager.register(BULLET_LIST_TYPE_COMPONENT, BulletListTypePicker)), this.disposeWithMe(componentManager.register(ORDER_LIST_TYPE_COMPONENT, OrderListTypePicker)), this.disposeWithMe(componentManager.register("TodoList", TodoList));
   }
   _initUiParts() {
-    var _a23, _b;
+    var _a22, _b;
     const workbook = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
-    (_b = (_a23 = this._config.layout) == null ? void 0 : _a23.docContainerConfig) != null && _b.footer && !workbook && this.disposeWithMe(this._uiPartsService.registerComponent(BuiltInUIPart.FOOTER, () => connectInjector(DocFooter, this._injector)));
+    (_b = (_a22 = this._config.layout) == null ? void 0 : _a22.docContainerConfig) != null && _b.footer && !workbook && this.disposeWithMe(this._uiPartsService.registerComponent(BuiltInUIPart.FOOTER, () => connectInjector(DocFooter, this._injector)));
   }
   _initMenus() {
     const { menu = {} } = this._config;
@@ -3104,16 +3188,16 @@ let DocUIController = (_a7 = class extends Disposable {
     );
   }
 }, __name(_a7, "DocUIController"), _a7);
-DocUIController = __decorateClass$f([
+DocUIController = __decorateClass$e([
   OnLifecycle(LifecycleStages.Rendered, DocUIController),
-  __decorateParam$f(1, Inject(Injector)),
-  __decorateParam$f(2, Inject(ComponentManager)),
-  __decorateParam$f(3, ICommandService),
-  __decorateParam$f(4, ILayoutService),
-  __decorateParam$f(5, IMenuService),
-  __decorateParam$f(6, IUIPartsService),
-  __decorateParam$f(7, IUniverInstanceService),
-  __decorateParam$f(8, IShortcutService)
+  __decorateParam$e(1, Inject(Injector)),
+  __decorateParam$e(2, Inject(ComponentManager)),
+  __decorateParam$e(3, ICommandService),
+  __decorateParam$e(4, ILayoutService),
+  __decorateParam$e(5, IMenuService),
+  __decorateParam$e(6, IUIPartsService),
+  __decorateParam$e(7, IUniverInstanceService),
+  __decorateParam$e(8, IShortcutService)
 ], DocUIController);
 const BreakLineShortcut = {
   id: EnterCommand.id,
@@ -3128,11 +3212,11 @@ const BreakLineShortcut = {
   preconditions: whenDocAndEditorFocused,
   binding: KeyCode.DELETE
 };
-var __defProp$e = Object.defineProperty, __getOwnPropDesc$e = Object.getOwnPropertyDescriptor, __decorateClass$e = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$e(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$d = Object.defineProperty, __getOwnPropDesc$d = Object.getOwnPropertyDescriptor, __decorateClass$d = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$d(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$e(target, key, result), result;
-}, "__decorateClass$e"), __decorateParam$e = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$e"), _a8;
+  return kind && result && __defProp$d(target, key, result), result;
+}, "__decorateClass$d"), __decorateParam$d = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$d"), _a8;
 let DocClipboardController = (_a8 = class extends RxDisposable {
   constructor(_commandService, _clipboardInterfaceService, _docClipboardService, _textSelectionRenderManager, _contextService) {
     super(), this._commandService = _commandService, this._clipboardInterfaceService = _clipboardInterfaceService, this._docClipboardService = _docClipboardService, this._textSelectionRenderManager = _textSelectionRenderManager, this._contextService = _contextService, this._init();
@@ -3141,30 +3225,32 @@ let DocClipboardController = (_a8 = class extends RxDisposable {
     [DocCopyCommand, DocCutCommand, DocPasteCommand].forEach((command) => this.disposeWithMe(this._commandService.registerMultipleCommand(command))), [InnerPasteCommand, CutContentCommand].forEach((command) => this.disposeWithMe(this._commandService.registerCommand(command))), this._initLegacyPasteCommand();
   }
   _initLegacyPasteCommand() {
-    var _a23;
-    (_a23 = this._textSelectionRenderManager) == null || _a23.onPaste$.pipe(takeUntil(this.dispose$)).subscribe((config) => {
-      var _a24, _b;
+    var _a22;
+    (_a22 = this._textSelectionRenderManager) == null || _a22.onPaste$.pipe(takeUntil(this.dispose$)).subscribe((config) => {
+      var _a23, _b;
       if (!whenDocOrEditor(this._contextService))
         return;
       config.event.preventDefault();
-      const clipboardEvent = config.event, htmlContent = (_a24 = clipboardEvent.clipboardData) == null ? void 0 : _a24.getData("text/html"), textContent = (_b = clipboardEvent.clipboardData) == null ? void 0 : _b.getData("text/plain");
-      this._docClipboardService.legacyPaste(htmlContent, textContent);
+      const clipboardEvent = config.event;
+      let htmlContent = (_a23 = clipboardEvent.clipboardData) == null ? void 0 : _a23.getData("text/html");
+      const textContent = (_b = clipboardEvent.clipboardData) == null ? void 0 : _b.getData("text/plain");
+      whenFocusEditor(this._contextService) && (htmlContent != null ? htmlContent : "").indexOf("</table>") > -1 && (htmlContent = ""), this._docClipboardService.legacyPaste(htmlContent, textContent);
     });
   }
 }, __name(_a8, "DocClipboardController"), _a8);
-DocClipboardController = __decorateClass$e([
+DocClipboardController = __decorateClass$d([
   OnLifecycle(LifecycleStages.Rendered, DocClipboardController),
-  __decorateParam$e(0, ICommandService),
-  __decorateParam$e(1, IClipboardInterfaceService),
-  __decorateParam$e(2, IDocClipboardService),
-  __decorateParam$e(3, ITextSelectionRenderManager),
-  __decorateParam$e(4, IContextService)
+  __decorateParam$d(0, ICommandService),
+  __decorateParam$d(1, IClipboardInterfaceService),
+  __decorateParam$d(2, IDocClipboardService),
+  __decorateParam$d(3, ITextSelectionRenderManager),
+  __decorateParam$d(4, IContextService)
 ], DocClipboardController);
-var __defProp$d = Object.defineProperty, __getOwnPropDesc$d = Object.getOwnPropertyDescriptor, __decorateClass$d = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$d(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$c = Object.defineProperty, __getOwnPropDesc$c = Object.getOwnPropertyDescriptor, __decorateClass$c = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$c(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$d(target, key, result), result;
-}, "__decorateClass$d"), __decorateParam$d = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$d"), _a9;
+  return kind && result && __defProp$c(target, key, result), result;
+}, "__decorateClass$c"), __decorateParam$c = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$c"), _a9;
 let DocEditorBridgeController = (_a9 = class extends Disposable {
   constructor(_univerInstanceService, _editorService, _commandService, _textSelectionRenderManager, _renderManagerService) {
     super();
@@ -3182,7 +3268,7 @@ let DocEditorBridgeController = (_a9 = class extends Disposable {
     }), this._commandExecutedListener(), this._initialSetValue(), this._initialBlur(), this._initialFocus(), this._initialValueChange();
   }
   _resize(unitId) {
-    var _a23, _b, _c;
+    var _a22, _b, _c;
     if (unitId == null)
       return;
     const editor = this._editorService.getEditor(unitId);
@@ -3191,7 +3277,7 @@ let DocEditorBridgeController = (_a9 = class extends Disposable {
     const editorDataModel = this._univerInstanceService.getUniverDocInstance(unitId);
     if (!editorDataModel)
       return;
-    const skeleton = (_a23 = this._renderManagerService.getRenderById(editorDataModel.getUnitId())) == null ? void 0 : _a23.with(DocSkeletonManagerService).getSkeleton();
+    const skeleton = (_a22 = this._renderManagerService.getRenderById(editorDataModel.getUnitId())) == null ? void 0 : _a22.with(DocSkeletonManagerService).getSkeleton();
     if (editor == null || editor.render == null || skeleton == null || editorDataModel == null)
       return;
     skeleton.calculate();
@@ -3224,8 +3310,8 @@ let DocEditorBridgeController = (_a9 = class extends Disposable {
       })
     ), this.disposeWithMe(
       this._textSelectionRenderManager.onBlur$.subscribe(() => {
-        var _a23;
-        const unitId = (_a23 = this._univerInstanceService.getCurrentUniverDocInstance()) == null ? void 0 : _a23.getUnitId();
+        var _a22;
+        const unitId = (_a22 = this._univerInstanceService.getCurrentUniverDocInstance()) == null ? void 0 : _a22.getUnitId();
         if (unitId == null)
           return;
         const editor = this._editorService.getEditor(unitId), focusEditor = this._editorService.getFocusEditor();
@@ -3273,8 +3359,8 @@ let DocEditorBridgeController = (_a9 = class extends Disposable {
     );
   }
   _valueChange() {
-    var _a23;
-    const unitId = (_a23 = this._univerInstanceService.getCurrentUniverDocInstance()) == null ? void 0 : _a23.getUnitId();
+    var _a22;
+    const unitId = (_a22 = this._univerInstanceService.getCurrentUniverDocInstance()) == null ? void 0 : _a22.getUnitId();
     if (unitId == null)
       return;
     const editor = this._editorService.getEditor(unitId);
@@ -3297,26 +3383,26 @@ let DocEditorBridgeController = (_a9 = class extends Disposable {
     );
   }
 }, __name(_a9, "DocEditorBridgeController"), _a9);
-DocEditorBridgeController = __decorateClass$d([
+DocEditorBridgeController = __decorateClass$c([
   OnLifecycle(LifecycleStages.Rendered, DocEditorBridgeController),
-  __decorateParam$d(0, IUniverInstanceService),
-  __decorateParam$d(1, IEditorService),
-  __decorateParam$d(2, ICommandService),
-  __decorateParam$d(3, ITextSelectionRenderManager),
-  __decorateParam$d(4, IRenderManagerService)
+  __decorateParam$c(0, IUniverInstanceService),
+  __decorateParam$c(1, IEditorService),
+  __decorateParam$c(2, ICommandService),
+  __decorateParam$c(3, ITextSelectionRenderManager),
+  __decorateParam$c(4, IRenderManagerService)
 ], DocEditorBridgeController);
-var __defProp$c = Object.defineProperty, __getOwnPropDesc$c = Object.getOwnPropertyDescriptor, __decorateClass$c = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$c(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$b = Object.defineProperty, __getOwnPropDesc$b = Object.getOwnPropertyDescriptor, __decorateClass$b = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$b(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$c(target, key, result), result;
-}, "__decorateClass$c"), __decorateParam$c = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$c"), _a10;
+  return kind && result && __defProp$b(target, key, result), result;
+}, "__decorateClass$b"), __decorateParam$b = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$b"), _a10;
 let DocRenderController = (_a10 = class extends RxDisposable {
   constructor(_context, _contextService, _commandService, _docSkeletonManagerService, _configService, _editorService, _renderManagerService) {
     super(), this._context = _context, this._contextService = _contextService, this._commandService = _commandService, this._docSkeletonManagerService = _docSkeletonManagerService, this._configService = _configService, this._editorService = _editorService, this._renderManagerService = _renderManagerService, this._addNewRender(), this._initRenderRefresh(), this._initCommandListener();
   }
   reRender(unitId) {
-    var _a23, _b;
-    const docSkeletonManagerService = (_a23 = this._renderManagerService.getRenderById(unitId)) == null ? void 0 : _a23.with(DocSkeletonManagerService), skeleton = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getSkeleton();
+    var _a22, _b;
+    const docSkeletonManagerService = (_a22 = this._renderManagerService.getRenderById(unitId)) == null ? void 0 : _a22.with(DocSkeletonManagerService), skeleton = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getSkeleton();
     if (!(!skeleton || skeleton.getViewModel().getDataModel().getSnapshot().disabled)) {
       if (skeleton.calculate(), this._editorService.isEditor(unitId)) {
         (_b = this._context.mainComponent) == null || _b.makeDirty();
@@ -3348,7 +3434,7 @@ let DocRenderController = (_a10 = class extends RxDisposable {
     }), this._configService.getConfig("hasScroll") !== !1 && new ScrollBar(viewMain), scene.addLayer(
       new Layer(scene, [], DOCS_COMPONENT_MAIN_LAYER_INDEX),
       new Layer(scene, [], DOCS_COMPONENT_HEADER_LAYER_INDEX)
-    ), this._addComponent(), unit.getShouldRenderLoopImmediately() && engine.runRenderLoop(() => {
+    ), this._addComponent(), engine.runRenderLoop(() => {
       scene.render();
     });
   }
@@ -3382,8 +3468,8 @@ let DocRenderController = (_a10 = class extends RxDisposable {
     }));
   }
   _recalculateSizeBySkeleton(skeleton) {
-    var _a23;
-    const { mainComponent, scene, unitId, components } = this._context, docsComponent = mainComponent, docBackground = components.get(DOCS_VIEW_KEY.BACKGROUND), pages = (_a23 = skeleton.getSkeletonData()) == null ? void 0 : _a23.pages;
+    var _a22;
+    const { mainComponent, scene, unitId, components } = this._context, docsComponent = mainComponent, docBackground = components.get(DOCS_VIEW_KEY.BACKGROUND), pages = (_a22 = skeleton.getSkeletonData()) == null ? void 0 : _a22.pages;
     if (pages == null)
       return;
     let width = 0, height = 0;
@@ -3394,21 +3480,21 @@ let DocRenderController = (_a10 = class extends RxDisposable {
     docsComponent.resize(width, height), docBackground.resize(width, height), this._editorService.isEditor(unitId) || scene.resize(width, height);
   }
 }, __name(_a10, "DocRenderController"), _a10);
-DocRenderController = __decorateClass$c([
-  __decorateParam$c(1, IContextService),
-  __decorateParam$c(2, ICommandService),
-  __decorateParam$c(3, Inject(DocSkeletonManagerService)),
-  __decorateParam$c(4, IConfigService),
-  __decorateParam$c(5, IEditorService),
-  __decorateParam$c(6, IRenderManagerService)
+DocRenderController = __decorateClass$b([
+  __decorateParam$b(1, IContextService),
+  __decorateParam$b(2, ICommandService),
+  __decorateParam$b(3, Inject(DocSkeletonManagerService)),
+  __decorateParam$b(4, IConfigService),
+  __decorateParam$b(5, IEditorService),
+  __decorateParam$b(6, IRenderManagerService)
 ], DocRenderController);
 const _DocPageLayoutService = class _DocPageLayoutService extends Disposable {
   constructor(_context) {
     super(), this._context = _context;
   }
   calculatePagePosition() {
-    var _a23, _b;
-    const docObject = neoGetDocObject(this._context), zoomRatio = (_b = (_a23 = this._context.unit.getSettings()) == null ? void 0 : _a23.zoomRatio) != null ? _b : 1, { document: docsComponent, scene, docBackground } = docObject, parent = scene == null ? void 0 : scene.getParent(), { width: docsWidth, height: docsHeight, pageMarginLeft, pageMarginTop } = docsComponent;
+    var _a22, _b;
+    const docObject = neoGetDocObject(this._context), zoomRatio = (_b = (_a22 = this._context.unit.getSettings()) == null ? void 0 : _a22.zoomRatio) != null ? _b : 1, { document: docsComponent, scene, docBackground } = docObject, parent = scene == null ? void 0 : scene.getParent(), { width: docsWidth, height: docsHeight, pageMarginLeft, pageMarginTop } = docsComponent;
     if (parent == null || docsWidth === Number.POSITIVE_INFINITY || docsHeight === Number.POSITIVE_INFINITY)
       return;
     const { width: engineWidth, height: engineHeight } = parent;
@@ -3422,11 +3508,11 @@ const _DocPageLayoutService = class _DocPageLayoutService extends Disposable {
 };
 __name(_DocPageLayoutService, "DocPageLayoutService");
 let DocPageLayoutService = _DocPageLayoutService;
-var __defProp$b = Object.defineProperty, __getOwnPropDesc$b = Object.getOwnPropertyDescriptor, __decorateClass$b = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$b(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$a = Object.defineProperty, __getOwnPropDesc$a = Object.getOwnPropertyDescriptor, __decorateClass$a = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$a(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$b(target, key, result), result;
-}, "__decorateClass$b"), __decorateParam$b = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$b"), _a11;
+  return kind && result && __defProp$a(target, key, result), result;
+}, "__decorateClass$a"), __decorateParam$a = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$a"), _a11;
 let DocZoomRenderController = (_a11 = class extends Disposable {
   constructor(_context, _contextService, _docSkeletonManagerService, _univerInstanceService, _commandService, _textSelectionManagerService, _editorService, _docPageLayoutService) {
     super(), this._context = _context, this._contextService = _contextService, this._docSkeletonManagerService = _docSkeletonManagerService, this._univerInstanceService = _univerInstanceService, this._commandService = _commandService, this._textSelectionManagerService = _textSelectionManagerService, this._editorService = _editorService, this._docPageLayoutService = _docPageLayoutService, this._initSkeletonListener(), this._initCommandExecutedListener(), this._initRenderRefresher(), setTimeout(() => this.updateViewZoom(1, !0), 20);
@@ -3474,25 +3560,25 @@ let DocZoomRenderController = (_a11 = class extends Disposable {
     }));
   }
   updateViewZoom(zoomRatio, needRefreshSelection = !0) {
-    var _a23;
+    var _a22;
     const docObject = neoGetDocObject(this._context);
-    docObject.scene.scale(zoomRatio, zoomRatio), this._docPageLayoutService.calculatePagePosition(), needRefreshSelection && !this._editorService.isEditor(this._context.unitId) && this._textSelectionManagerService.refreshSelection(), (_a23 = docObject.scene.getTransformer()) == null || _a23.clearSelectedObjects();
+    docObject.scene.scale(zoomRatio, zoomRatio), this._docPageLayoutService.calculatePagePosition(), needRefreshSelection && !this._editorService.isEditor(this._context.unitId) && this._textSelectionManagerService.refreshSelection(), (_a22 = docObject.scene.getTransformer()) == null || _a22.clearSelectedObjects();
   }
 }, __name(_a11, "DocZoomRenderController"), _a11);
-DocZoomRenderController = __decorateClass$b([
-  __decorateParam$b(1, IContextService),
-  __decorateParam$b(2, Inject(DocSkeletonManagerService)),
-  __decorateParam$b(3, IUniverInstanceService),
-  __decorateParam$b(4, ICommandService),
-  __decorateParam$b(5, Inject(TextSelectionManagerService)),
-  __decorateParam$b(6, IEditorService),
-  __decorateParam$b(7, Inject(DocPageLayoutService))
+DocZoomRenderController = __decorateClass$a([
+  __decorateParam$a(1, IContextService),
+  __decorateParam$a(2, Inject(DocSkeletonManagerService)),
+  __decorateParam$a(3, IUniverInstanceService),
+  __decorateParam$a(4, ICommandService),
+  __decorateParam$a(5, Inject(TextSelectionManagerService)),
+  __decorateParam$a(6, IEditorService),
+  __decorateParam$a(7, Inject(DocPageLayoutService))
 ], DocZoomRenderController);
-var __defProp$a = Object.defineProperty, __getOwnPropDesc$a = Object.getOwnPropertyDescriptor, __decorateClass$a = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$a(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$9 = Object.defineProperty, __getOwnPropDesc$9 = Object.getOwnPropertyDescriptor, __decorateClass$9 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$9(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$a(target, key, result), result;
-}, "__decorateClass$a"), __decorateParam$a = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$a"), _a12;
+  return kind && result && __defProp$9(target, key, result), result;
+}, "__decorateClass$9"), __decorateParam$9 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$9"), _a12;
 let DocTextSelectionRenderController = (_a12 = class extends Disposable {
   constructor(_context, _commandService, _editorService, _instanceSrv, _textSelectionRenderManager, _docSkeletonManagerService, _textSelectionManagerService) {
     super();
@@ -3564,9 +3650,9 @@ let DocTextSelectionRenderController = (_a12 = class extends Disposable {
     const updateCommandList = [SetDocZoomRatioOperation.id];
     this.disposeWithMe(
       this._commandService.onCommandExecuted((command) => {
-        var _a23;
+        var _a22;
         if (updateCommandList.includes(command.id)) {
-          const params = command.params, { unitId: documentId } = params, unitId = (_a23 = this._textSelectionManagerService.getCurrentSelection()) == null ? void 0 : _a23.unitId;
+          const params = command.params, { unitId: documentId } = params, unitId = (_a22 = this._textSelectionManagerService.getCurrentSelection()) == null ? void 0 : _a22.unitId;
           if (documentId !== unitId)
             return;
           this._textSelectionManagerService.refreshSelection();
@@ -3591,19 +3677,19 @@ let DocTextSelectionRenderController = (_a12 = class extends Disposable {
     }));
   }
 }, __name(_a12, "DocTextSelectionRenderController"), _a12);
-DocTextSelectionRenderController = __decorateClass$a([
-  __decorateParam$a(1, ICommandService),
-  __decorateParam$a(2, IEditorService),
-  __decorateParam$a(3, IUniverInstanceService),
-  __decorateParam$a(4, ITextSelectionRenderManager),
-  __decorateParam$a(5, Inject(DocSkeletonManagerService)),
-  __decorateParam$a(6, Inject(TextSelectionManagerService))
+DocTextSelectionRenderController = __decorateClass$9([
+  __decorateParam$9(1, ICommandService),
+  __decorateParam$9(2, IEditorService),
+  __decorateParam$9(3, IUniverInstanceService),
+  __decorateParam$9(4, ITextSelectionRenderManager),
+  __decorateParam$9(5, Inject(DocSkeletonManagerService)),
+  __decorateParam$9(6, Inject(TextSelectionManagerService))
 ], DocTextSelectionRenderController);
-var __defProp$9 = Object.defineProperty, __getOwnPropDesc$9 = Object.getOwnPropertyDescriptor, __decorateClass$9 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$9(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$8 = Object.defineProperty, __getOwnPropDesc$8 = Object.getOwnPropertyDescriptor, __decorateClass$8 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$8(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$9(target, key, result), result;
-}, "__decorateClass$9"), __decorateParam$9 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$9");
+  return kind && result && __defProp$8(target, key, result), result;
+}, "__decorateClass$8"), __decorateParam$8 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$8");
 function transformBound2OffsetBound(originBound, scene) {
   const topLeft = transformPosition2Offset(originBound.left, originBound.top, scene), bottomRight = transformPosition2Offset(originBound.right, originBound.bottom, scene);
   return {
@@ -3628,6 +3714,32 @@ function transformPosition2Offset(x, y, scene) {
   };
 }
 __name(transformPosition2Offset, "transformPosition2Offset");
+function transformOffset2Bound(offsetX, offsetY, scene) {
+  const { scaleX, scaleY } = scene.getAncestorScale(), viewMain = scene.getViewport(VIEWPORT_KEY.VIEW_MAIN);
+  if (!viewMain)
+    return {
+      x: offsetX,
+      y: offsetY
+    };
+  const { viewportScrollX: actualScrollX, viewportScrollY: actualScrollY } = viewMain, x = offsetX / scaleX + actualScrollX, y = offsetY / scaleY + actualScrollY;
+  return {
+    x,
+    y
+  };
+}
+__name(transformOffset2Bound, "transformOffset2Bound");
+const calcDocRangePositions$1 = /* @__PURE__ */ __name((range, currentRender) => {
+  const { scene, mainComponent, engine } = currentRender, skeleton = currentRender.with(DocSkeletonManagerService).getSkeleton(), startPosition = skeleton.findNodePositionByCharIndex(range.startOffset, !1, range.segmentId, range.segmentPage), endPosition = skeleton.findNodePositionByCharIndex(range.endOffset, !1, range.segmentId, range.segmentPage), document = mainComponent;
+  if (!endPosition || !startPosition)
+    return;
+  const documentOffsetConfig = document.getOffsetConfig(), { docsLeft, docsTop } = documentOffsetConfig, canvasElement = engine.getCanvasElement(), canvasClientRect = canvasElement.getBoundingClientRect(), widthOfCanvas = pxToNum(canvasElement.style.width), { top, left, width } = canvasClientRect, scaleAdjust = width / widthOfCanvas, { scaleX, scaleY } = scene.getAncestorScale(), convertor = new NodePositionConvertToCursor(documentOffsetConfig, skeleton), { borderBoxPointGroup } = convertor.getRangePointData(startPosition, endPosition);
+  return getLineBounding(borderBoxPointGroup).map((bound) => transformBound2OffsetBound(bound, scene)).map((i) => ({
+    left: (i.left + docsLeft * scaleX) * scaleAdjust + left,
+    right: (i.right + docsLeft * scaleX) * scaleAdjust + left,
+    top: (i.top + docsTop * scaleY) * scaleAdjust + top,
+    bottom: (i.bottom + docsTop * scaleY) * scaleAdjust + top
+  }));
+}, "calcDocRangePositions$1");
 var _a13;
 let DocCanvasPopManagerService = (_a13 = class extends Disposable {
   constructor(_globalPopupManagerService, _renderManagerService, _univerInstanceService, _commandService) {
@@ -3662,28 +3774,17 @@ let DocCanvasPopManagerService = (_a13 = class extends Disposable {
     };
   }
   _createRangePositionObserver(range, currentRender) {
-    var _a23;
-    const calc = /* @__PURE__ */ __name(() => {
-      const { scene, mainComponent, engine } = currentRender, skeleton = currentRender.with(DocSkeletonManagerService).getSkeleton(), startPosition = skeleton.findNodePositionByCharIndex(range.startOffset), endPosition = skeleton.findNodePositionByCharIndex(range.endOffset), document = mainComponent;
-      if (!endPosition || !startPosition)
-        return;
-      const documentOffsetConfig = document.getOffsetConfig(), { docsLeft, docsTop } = documentOffsetConfig, canvasElement = engine.getCanvasElement(), canvasClientRect = canvasElement.getBoundingClientRect(), widthOfCanvas = pxToNum(canvasElement.style.width), { top, left, width } = canvasClientRect, scaleAdjust = width / widthOfCanvas, { scaleX, scaleY } = scene.getAncestorScale(), convertor = new NodePositionConvertToCursor(documentOffsetConfig, skeleton), { contentBoxPointGroup } = convertor.getRangePointData(startPosition, endPosition);
-      return getLineBounding(contentBoxPointGroup).map((bound) => transformBound2OffsetBound(bound, scene)).map((i) => ({
-        left: (i.left + docsLeft * scaleX) * scaleAdjust + left,
-        right: (i.right + docsLeft * scaleX) * scaleAdjust + left,
-        top: (i.top + docsTop * scaleY) * scaleAdjust + top,
-        bottom: (i.bottom + docsTop * scaleY) * scaleAdjust + top
-      }));
-    }, "calc"), positions = (_a23 = calc()) != null ? _a23 : [], positions$ = new BehaviorSubject(positions), disposable = new DisposableCollection();
+    var _a22;
+    const positions = (_a22 = calcDocRangePositions$1(range, currentRender)) != null ? _a22 : [], positions$ = new BehaviorSubject(positions), disposable = new DisposableCollection();
     disposable.add(this._commandService.onCommandExecuted((commandInfo) => {
       if (commandInfo.id === SetDocZoomRatioOperation.id) {
-        const position = calc();
+        const position = calcDocRangePositions$1(range, currentRender);
         position && positions$.next(position);
       }
     }));
     const viewMain = currentRender.scene.getViewport(VIEWPORT_KEY.VIEW_MAIN);
     return viewMain && disposable.add(viewMain.onScrollAfter$.subscribeEvent(() => {
-      const position = calc();
+      const position = calcDocRangePositions$1(range, currentRender);
       position && positions$.next(position);
     })), {
       positions,
@@ -3743,17 +3844,17 @@ let DocCanvasPopManagerService = (_a13 = class extends Disposable {
     };
   }
 }, __name(_a13, "DocCanvasPopManagerService"), _a13);
-DocCanvasPopManagerService = __decorateClass$9([
-  __decorateParam$9(0, Inject(ICanvasPopupService)),
-  __decorateParam$9(1, IRenderManagerService),
-  __decorateParam$9(2, IUniverInstanceService),
-  __decorateParam$9(3, ICommandService)
+DocCanvasPopManagerService = __decorateClass$8([
+  __decorateParam$8(0, Inject(ICanvasPopupService)),
+  __decorateParam$8(1, IRenderManagerService),
+  __decorateParam$8(2, IUniverInstanceService),
+  __decorateParam$8(3, ICommandService)
 ], DocCanvasPopManagerService);
-var __defProp$8 = Object.defineProperty, __getOwnPropDesc$8 = Object.getOwnPropertyDescriptor, __decorateClass$8 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$8(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$7 = Object.defineProperty, __getOwnPropDesc$7 = Object.getOwnPropertyDescriptor, __decorateClass$7 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$7(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$8(target, key, result), result;
-}, "__decorateClass$8"), __decorateParam$8 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$8"), _a14;
+  return kind && result && __defProp$7(target, key, result), result;
+}, "__decorateClass$7"), __decorateParam$7 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$7"), _a14;
 let DocsRenderService = (_a14 = class extends RxDisposable {
   constructor(_instanceSrv, _renderManagerService) {
     super(), this._instanceSrv = _instanceSrv, this._renderManagerService = _renderManagerService, this._init();
@@ -3773,16 +3874,16 @@ let DocsRenderService = (_a14 = class extends RxDisposable {
     this._renderManagerService.removeRender(unitId);
   }
 }, __name(_a14, "DocsRenderService"), _a14);
-DocsRenderService = __decorateClass$8([
+DocsRenderService = __decorateClass$7([
   OnLifecycle(LifecycleStages.Ready, DocsRenderService),
-  __decorateParam$8(0, IUniverInstanceService),
-  __decorateParam$8(1, IRenderManagerService)
+  __decorateParam$7(0, IUniverInstanceService),
+  __decorateParam$7(1, IRenderManagerService)
 ], DocsRenderService);
-var __defProp$7 = Object.defineProperty, __getOwnPropDesc$7 = Object.getOwnPropertyDescriptor, __decorateClass$7 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$7(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$6 = Object.defineProperty, __getOwnPropDesc$6 = Object.getOwnPropertyDescriptor, __decorateClass$6 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$6(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$7(target, key, result), result;
-}, "__decorateClass$7"), __decorateParam$7 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$7");
+  return kind && result && __defProp$6(target, key, result), result;
+}, "__decorateClass$6"), __decorateParam$6 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$6");
 const SKIP_UNIT_IDS = [
   DEFAULT_EMPTY_DOCUMENT_VALUE,
   DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY,
@@ -3795,8 +3896,8 @@ let DocContextMenuRenderController = (_a15 = class extends Disposable {
     super(), this._context = _context, this._contextMenuService = _contextMenuService, this._textSelectionManagerService = _textSelectionManagerService, this._commandService = _commandService, SKIP_UNIT_IDS.includes(this._context.unitId) || (this._initPointerDown(), this._initEditChange());
   }
   _initPointerDown() {
-    var _a23, _b;
-    const documentsSubscription = ((_b = (_a23 = this._context) == null ? void 0 : _a23.mainComponent) == null ? void 0 : _b.onPointerDown$).subscribeEvent((event) => {
+    var _a22, _b;
+    const documentsSubscription = ((_b = (_a22 = this._context) == null ? void 0 : _a22.mainComponent) == null ? void 0 : _b.onPointerDown$).subscribeEvent((event) => {
       event.button === 2 && this._contextMenuService.triggerContextMenu(event, MenuPosition.CONTEXT_MENU);
     });
     this.disposeWithMe(documentsSubscription);
@@ -3809,16 +3910,16 @@ let DocContextMenuRenderController = (_a15 = class extends Disposable {
     );
   }
 }, __name(_a15, "DocContextMenuRenderController"), _a15);
-DocContextMenuRenderController = __decorateClass$7([
-  __decorateParam$7(1, IContextMenuService),
-  __decorateParam$7(2, Inject(TextSelectionManagerService)),
-  __decorateParam$7(3, ICommandService)
+DocContextMenuRenderController = __decorateClass$6([
+  __decorateParam$6(1, IContextMenuService),
+  __decorateParam$6(2, Inject(TextSelectionManagerService)),
+  __decorateParam$6(3, ICommandService)
 ], DocContextMenuRenderController);
-var __defProp$6 = Object.defineProperty, __getOwnPropDesc$6 = Object.getOwnPropertyDescriptor, __decorateClass$6 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$6(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$5 = Object.defineProperty, __getOwnPropDesc$5 = Object.getOwnPropertyDescriptor, __decorateClass$5 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$5(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$6(target, key, result), result;
-}, "__decorateClass$6"), __decorateParam$6 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$6"), _a16;
+  return kind && result && __defProp$5(target, key, result), result;
+}, "__decorateClass$5"), __decorateParam$5 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$5"), _a16;
 let DocResizeRenderController = (_a16 = class extends Disposable {
   constructor(_context, _docPageLayoutService, _textSelectionManagerService) {
     super(), this._context = _context, this._docPageLayoutService = _docPageLayoutService, this._textSelectionManagerService = _textSelectionManagerService;
@@ -3830,133 +3931,213 @@ let DocResizeRenderController = (_a16 = class extends Disposable {
     this.disposeWithMe(
       fromEventSubject(this._context.engine.onTransformChange$).pipe(
         filter((evt) => evt.type === TRANSFORM_CHANGE_OBSERVABLE_TYPE.resize),
-        throttleTime(16)
+        throttleTime(0, animationFrameScheduler)
       ).subscribe(() => {
         this._docPageLayoutService.calculatePagePosition(), this._textSelectionManagerService.refreshSelection();
       })
     );
   }
 }, __name(_a16, "DocResizeRenderController"), _a16);
-DocResizeRenderController = __decorateClass$6([
-  __decorateParam$6(1, Inject(DocPageLayoutService)),
-  __decorateParam$6(2, Inject(TextSelectionManagerService))
+DocResizeRenderController = __decorateClass$5([
+  __decorateParam$5(1, Inject(DocPageLayoutService)),
+  __decorateParam$5(2, Inject(TextSelectionManagerService))
 ], DocResizeRenderController);
-var __defProp$5 = Object.defineProperty, __getOwnPropDesc$5 = Object.getOwnPropertyDescriptor, __decorateClass$5 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$5(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$4 = Object.defineProperty, __getOwnPropDesc$4 = Object.getOwnPropertyDescriptor, __decorateClass$4 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$4(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$5(target, key, result), result;
-}, "__decorateClass$5"), __decorateParam$5 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$5"), _a17;
-let DocHoverManagerService = (_a17 = class extends Disposable {
-  constructor(_univerInstanceService, _renderManagerService) {
+  return kind && result && __defProp$4(target, key, result), result;
+}, "__decorateClass$4"), __decorateParam$4 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$4");
+const calcDocRangePositions = /* @__PURE__ */ __name((range, documents, skeleton, pageIndex) => {
+  var _a22, _b, _c, _d, _e;
+  const startPosition = skeleton.findNodePositionByCharIndex(range.startOffset, !1, range.segmentId, pageIndex), skeletonData = skeleton.getSkeletonData();
+  let end = range.endOffset;
+  if (range.segmentId) {
+    const root = (_e = Array.from((_b = (_a22 = skeletonData == null ? void 0 : skeletonData.skeFooters.get(range.segmentId)) == null ? void 0 : _a22.values()) != null ? _b : [])[0]) != null ? _e : Array.from((_d = (_c = skeletonData == null ? void 0 : skeletonData.skeHeaders.get(range.segmentId)) == null ? void 0 : _c.values()) != null ? _d : [])[0];
+    root && (end = Math.min(root.ed, end));
+  }
+  const endPosition = skeleton.findNodePositionByCharIndex(end, !1, range.segmentId, pageIndex);
+  if (!endPosition || !startPosition)
+    return;
+  const documentOffsetConfig = documents.getOffsetConfig(), convertor = new NodePositionConvertToCursor(documentOffsetConfig, skeleton), { borderBoxPointGroup } = convertor.getRangePointData(startPosition, endPosition);
+  return getLineBounding(borderBoxPointGroup).map((rect) => ({
+    top: rect.top + documentOffsetConfig.docsTop,
+    bottom: rect.bottom + documentOffsetConfig.docsTop,
+    left: rect.left + documentOffsetConfig.docsLeft,
+    right: rect.right + documentOffsetConfig.docsLeft
+  }));
+}, "calcDocRangePositions"), calcDocGlyphPosition = /* @__PURE__ */ __name((glyph, documents, skeleton, pageIndex = -1) => {
+  const start = skeleton.findPositionByGlyph(glyph, pageIndex);
+  if (!start)
+    return;
+  const documentOffsetConfig = documents.getOffsetConfig(), startPosition = { ...start, isBack: !0 }, convertor = new NodePositionConvertToCursor(documentOffsetConfig, skeleton), { borderBoxPointGroup } = convertor.getRangePointData(startPosition, startPosition), rect = getLineBounding(borderBoxPointGroup)[0];
+  return {
+    top: rect.top + documentOffsetConfig.docsTop,
+    bottom: rect.bottom + documentOffsetConfig.docsTop,
+    left: rect.left + documentOffsetConfig.docsLeft,
+    right: rect.left + documentOffsetConfig.docsLeft + glyph.width
+  };
+}, "calcDocGlyphPosition");
+var _a17;
+let DocEventManagerService = (_a17 = class extends Disposable {
+  constructor(_context, _docSkeletonManagerService) {
     super();
-    __publicField(this, "_activeCustomRanges$", new Subject());
-    __publicField(this, "activeCustomRanges$", this._activeCustomRanges$.asObservable());
-    __publicField(this, "_activeIndex$", new Subject());
-    __publicField(this, "activeIndex$", this._activeIndex$.asObservable());
-    __publicField(this, "_bullet$", new Subject());
-    __publicField(this, "bullet$", this._bullet$.asObservable());
-    __publicField(this, "_scrolling", !1);
-    this._univerInstanceService = _univerInstanceService, this._renderManagerService = _renderManagerService, this.disposeWithMe(() => {
-      this._activeCustomRanges$.complete(), this._activeIndex$.complete();
-    });
+    __publicField(this, "_hoverCustomRanges$", new Subject());
+    __publicField(this, "hoverCustomRanges$", this._hoverCustomRanges$.pipe(distinctUntilChanged((pre, aft) => pre.length === aft.length && pre.every((item, i) => aft[i].range.rangeId === item.range.rangeId && aft[i].segmentId === item.segmentId && aft[i].segmentPageIndex === item.segmentPageIndex))));
+    __publicField(this, "_clickCustomRanges$", new Subject());
+    __publicField(this, "clickCustomRanges$", this._clickCustomRanges$.asObservable());
+    __publicField(this, "_hoverBullet$", new Subject());
+    __publicField(this, "hoverBullet$", this._hoverBullet$.pipe(distinctUntilChanged((pre, aft) => (pre == null ? void 0 : pre.paragraph.startIndex) === (aft == null ? void 0 : aft.paragraph.startIndex) && (pre == null ? void 0 : pre.segmentId) === (aft == null ? void 0 : aft.segmentId) && (pre == null ? void 0 : pre.segmentPageIndex) === (aft == null ? void 0 : aft.segmentPageIndex))));
+    __publicField(this, "_clickBullet$", new Subject());
+    __publicField(this, "clickBullets$", this._clickBullet$.asObservable());
+    __publicField(this, "_customRangeDirty", !0);
+    __publicField(this, "_bulletDirty", !0);
+    /**
+     * cache the bounding of custom ranges,
+     * it will be updated when the doc-skeleton is recalculated
+     */
+    __publicField(this, "_customRangeBounds", []);
+    /**
+     * cache the bounding of bullets,
+     * it will be updated when the doc-skeleton is recalculated
+     */
+    __publicField(this, "_bulletBounds", []);
+    this._context = _context, this._docSkeletonManagerService = _docSkeletonManagerService, this._initResetDirty(), this._initEvents(), this._initPointer();
   }
-  _getTransformCoordForDocumentOffset(document, viewport, evtOffsetX, evtOffsetY) {
-    const { documentTransform } = document.getOffsetConfig(), originCoord = viewport.transformVector2SceneCoord(Vector2.FromArray([evtOffsetX, evtOffsetY]));
-    if (originCoord)
-      return documentTransform.clone().invert().applyPoint(originCoord);
+  get _skeleton() {
+    return this._docSkeletonManagerService.getSkeleton();
   }
-  _calcActiveCustomRanges(offsetX, offsetY) {
-    var _a23, _b;
-    const document = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_DOC);
-    if (!document) {
-      this._activeCustomRanges$.next([]);
-      return;
-    }
-    const currentRender = this._renderManagerService.getRenderById(document.getUnitId());
-    if (!currentRender)
-      return null;
-    const documentComponent = currentRender.mainComponent, skeleton = currentRender.with(DocSkeletonManagerService).getSkeleton(), { pageLayoutType = PageLayoutType.VERTICAL, pageMarginLeft, pageMarginTop, docsLeft, docsTop } = documentComponent.getOffsetConfig(), coord = this._getTransformCoordForDocumentOffset(
-      documentComponent,
-      currentRender.scene.getViewport(VIEWPORT_KEY.VIEW_MAIN),
-      offsetX,
-      offsetY
-    );
-    if (!coord)
-      return;
-    const node = skeleton.findNodeByCoord(
-      coord,
-      pageLayoutType,
-      pageMarginLeft,
-      pageMarginTop
-    );
-    if (node && node.node) {
-      const left = node.node.left + pageMarginLeft, right = node.node.left + node.node.width + pageMarginLeft;
-      let index = node.node.parent.st + node.node.parent.glyphGroup.indexOf(node.node);
-      const paragraph = getParagraphByGlyph(node.node, document.getBody());
-      if (paragraph && paragraph.bullet && index === paragraph.paragraphStart) {
-        this._bullet$.next(paragraph), this._activeIndex$.next(null), this._activeCustomRanges$.next([]);
-        return;
-      }
-      if (coord.x < left || coord.x > right) {
-        this._activeIndex$.next(null), this._activeCustomRanges$.next([]), this._bullet$.next(null);
-        return;
-      }
-      paragraph && paragraph.bullet && (index = index - 1), this._bullet$.next(null), this._activeIndex$.next(index);
-      const ranges = (_b = (_a23 = document.getCustomRanges()) == null ? void 0 : _a23.filter((range) => range.startIndex <= index && range.endIndex >= index)) != null ? _b : [];
-      this._activeCustomRanges$.next(ranges);
-    }
+  get _documents() {
+    return this._context.mainComponent;
   }
-  onMouseMove(evt) {
-    if (this._scrolling)
-      return;
-    const { offsetX, offsetY } = evt;
-    this._calcActiveCustomRanges(offsetX, offsetY);
+  dispose() {
+    this._hoverCustomRanges$.complete(), this._clickCustomRanges$.complete(), super.dispose();
   }
-  startScroll() {
-    this._scrolling || (this._scrolling = !0);
+  _initPointer() {
+    let preCursor = CURSOR_TYPE.TEXT;
+    this.disposeWithMe(this.hoverCustomRanges$.subscribe((ranges) => {
+      ranges.length ? (preCursor = this._context.scene.getCursor(), this._context.scene.setCursor(CURSOR_TYPE.POINTER)) : this._context.scene.setCursor(preCursor);
+    }));
   }
-  endScroll() {
-    this._scrolling = !1;
+  _initResetDirty() {
+    this.disposeWithMe(this._skeleton.dirty$.subscribe(() => {
+      this._customRangeDirty = !0, this._bulletDirty = !0;
+    })), this.disposeWithMe(
+      fromEventSubject(this._context.engine.onTransformChange$).pipe(
+        filter((evt) => evt.type === TRANSFORM_CHANGE_OBSERVABLE_TYPE.resize)
+      ).subscribe(() => {
+        this._customRangeDirty = !0, this._bulletDirty = !0;
+      })
+    );
   }
-}, __name(_a17, "DocHoverManagerService"), _a17);
-DocHoverManagerService = __decorateClass$5([
-  __decorateParam$5(0, IUniverInstanceService),
-  __decorateParam$5(1, IRenderManagerService)
-], DocHoverManagerService);
-var __defProp$4 = Object.defineProperty, __getOwnPropDesc$4 = Object.getOwnPropertyDescriptor, __decorateClass$4 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$4(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
-    (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$4(target, key, result), result;
-}, "__decorateClass$4"), __decorateParam$4 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$4"), _a18;
-let DocHoverRenderController = (_a18 = class extends Disposable {
-  constructor(_context, _docHoverManagerService) {
-    super(), this._context = _context, this._docHoverManagerService = _docHoverManagerService, this._initPointerDown(), this._initScroll();
+  _initEvents() {
+    this.disposeWithMe(fromEventSubject(this._context.scene.onPointerMove$).pipe(throttleTime(0, animationFrameScheduler)).subscribe((evt) => {
+      this._hoverCustomRanges$.next(
+        this._calcActiveRanges(evt)
+      ), this._hoverBullet$.next(
+        this._calcActiveBullet(evt)
+      );
+    }));
+    const onPointerDown$ = fromEventSubject(this._context.mainComponent.onPointerDown$), onPointerUp$ = fromEventSubject(this._context.scene.onPointerUp$);
+    this.disposeWithMe(onPointerDown$.pipe(
+      mergeMap((down) => onPointerUp$.pipe(take(1), map((up) => ({ down, up })))),
+      filter(({ down, up }) => down.target === up.target && up.timeStamp - down.timeStamp < 300)
+      // filter(({ down, up }) => down.offsetX === up.offsetX && down.offsetY === up.offsetY)
+    ).subscribe(({ down }) => {
+      if (down.button === 2)
+        return;
+      const ranges = this._calcActiveRanges(down);
+      ranges.length && this._clickCustomRanges$.next(ranges.pop());
+      const bullet = this._calcActiveBullet(down);
+      bullet && this._clickBullet$.next(bullet);
+    }));
   }
-  _initPointerDown() {
-    this.disposeWithMe(
-      fromEventSubject(this._context.scene.onPointerMove$).pipe(debounceTime(100)).subscribe((evt) => {
-        this._docHoverManagerService.onMouseMove(evt);
+  _buildCustomRangeBoundsBySegment(segmentId, segmentPage = -1) {
+    var _a22, _b, _c;
+    const customRanges = (_c = (_b = (_a22 = this._context.unit.getSelfOrHeaderFooterModel(segmentId)) == null ? void 0 : _a22.getBody()) == null ? void 0 : _b.customRanges) != null ? _c : [], layouts = [];
+    return customRanges.forEach((range) => {
+      const textRange = {
+        startOffset: range.startIndex,
+        endOffset: range.endIndex,
+        collapsed: !1,
+        segmentId
+      }, rects = calcDocRangePositions(textRange, this._documents, this._skeleton, segmentPage);
+      if (!rects)
+        return null;
+      layouts.push({
+        customRange: range,
+        rects,
+        segmentId,
+        segmentPageIndex: segmentPage
+      });
+    }), layouts;
+  }
+  _buildCustomRangeBounds() {
+    var _a22;
+    if (!this._customRangeDirty)
+      return;
+    this._customRangeDirty = !1;
+    const customRangeBounds = [];
+    customRangeBounds.push(...this._buildCustomRangeBoundsBySegment()), (_a22 = this._skeleton.getSkeletonData()) == null || _a22.pages.forEach((page, pageIndex) => {
+      page.headerId && customRangeBounds.push(...this._buildCustomRangeBoundsBySegment(page.headerId, pageIndex)), page.footerId && customRangeBounds.push(...this._buildCustomRangeBoundsBySegment(page.footerId, pageIndex));
+    }), this._customRangeBounds = customRangeBounds;
+  }
+  _calcActiveRanges(evt) {
+    this._buildCustomRangeBounds();
+    const { offsetX, offsetY } = evt, { x, y } = transformOffset2Bound(offsetX, offsetY, this._context.scene);
+    return this._customRangeBounds.filter((layout) => layout.rects.some((rect) => {
+      const { left, right, top, bottom } = rect;
+      return x >= left && x <= right && y >= top && y <= bottom;
+    })).map(
+      (range) => ({
+        segmentId: range.segmentId,
+        range: range.customRange,
+        segmentPageIndex: range.segmentPageIndex
       })
     );
   }
-  _initScroll() {
-    const viewMain = this._context.scene.getViewport(VIEWPORT_KEY.VIEW_MAIN);
-    viewMain && (this.disposeWithMe(fromEventSubject(viewMain.onScrollAfter$).pipe(debounceTime(60)).subscribe(() => {
-      this._docHoverManagerService.endScroll();
-    })), this.disposeWithMe(viewMain.onScrollBefore$.subscribeEvent(() => {
-      this._docHoverManagerService.startScroll();
-    })));
-  }
-}, __name(_a18, "DocHoverRenderController"), _a18);
-DocHoverRenderController = __decorateClass$4([
-  __decorateParam$4(1, Inject(DocHoverManagerService))
-], DocHoverRenderController);
+  _buildBulletBoundsBySegment(segmentId, segmentPage = -1) {
+    var _a22, _b;
+    const body = (_a22 = this._context.unit.getSelfOrHeaderFooterModel(segmentId)) == null ? void 0 : _a22.getBody(), paragraphs = (_b = body == null ? void 0 : body.paragraphs) != null ? _b : [], bounds = [];
+    return paragraphs.forEach((paragraph) => {
+      paragraph.bullet && paragraph.bullet.listType.indexOf("CHECK_LIST") === 0 && (/* @__PURE__ */ __name((pageIndex) => {
+        var _a23, _b2, _c;
+        const node = this._skeleton.findNodeByCharIndex(paragraph.startIndex, segmentId, pageIndex), divide = node == null ? void 0 : node.parent, line = divide == null ? void 0 : divide.parent, column = line == null ? void 0 : line.parent, targetLine = column == null ? void 0 : column.lines.find((l2) => l2.paragraphStart && l2.paragraphIndex === paragraph.startIndex), bulletNode = (_c = (_b2 = (_a23 = targetLine == null ? void 0 : targetLine.divides) == null ? void 0 : _a23[0]) == null ? void 0 : _b2.glyphGroup) == null ? void 0 : _c[0];
+        if (!bulletNode || !bulletNode)
+          return;
+        const rect = calcDocGlyphPosition(bulletNode, this._documents, this._skeleton, pageIndex);
+        rect && bounds.push({
+          rect,
+          segmentId,
+          segmentPageIndex: pageIndex,
+          paragraph
+        });
+      }, "calcRect"))(segmentPage);
+    }), bounds;
+  }
+  _buildBulletBounds() {
+    var _a22;
+    this._bulletDirty && (this._bulletDirty = !1, this._bulletBounds = [], this._bulletBounds.push(...this._buildBulletBoundsBySegment()), (_a22 = this._skeleton.getSkeletonData()) == null || _a22.pages.forEach((page, pageIndex) => {
+      page.headerId && this._bulletBounds.push(...this._buildBulletBoundsBySegment(page.headerId, pageIndex)), page.footerId && this._bulletBounds.push(...this._buildBulletBoundsBySegment(page.footerId, pageIndex));
+    }));
+  }
+  _calcActiveBullet(evt) {
+    this._buildBulletBounds();
+    const { offsetX, offsetY } = evt, { x, y } = transformOffset2Bound(offsetX, offsetY, this._context.scene);
+    return this._bulletBounds.find((layout) => {
+      const { left, right, top, bottom } = layout.rect;
+      return x >= left && x <= right && y >= top && y <= bottom;
+    });
+  }
+}, __name(_a17, "DocEventManagerService"), _a17);
+DocEventManagerService = __decorateClass$4([
+  __decorateParam$4(1, Inject(DocSkeletonManagerService))
+], DocEventManagerService);
 var __defProp$3 = Object.defineProperty, __getOwnPropDesc$3 = Object.getOwnPropertyDescriptor, __decorateClass$3 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
   for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$3(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
   return kind && result && __defProp$3(target, key, result), result;
-}, "__decorateClass$3"), __decorateParam$3 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$3"), _a19;
-let DocAutoFormatController = (_a19 = class extends Disposable {
+}, "__decorateClass$3"), __decorateParam$3 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$3"), _a18;
+let DocAutoFormatController = (_a18 = class extends Disposable {
   constructor(_docAutoFormatService) {
     super(), this._docAutoFormatService = _docAutoFormatService, this._initListTabAutoFormat(), this._initListSpaceAutoFormat(), this._initDefaultEnterFormat(), this._initExitListAutoFormat();
   }
@@ -3965,15 +4146,15 @@ let DocAutoFormatController = (_a19 = class extends Disposable {
       this._docAutoFormatService.registerAutoFormat({
         id: TabCommand.id,
         match: /* @__PURE__ */ __name((context) => {
-          var _a23;
+          var _a22;
           const { selection, paragraphs, unit } = context;
           if (paragraphs.length === 1 && selection.startOffset === paragraphs[0].paragraphStart && paragraphs[0].bullet) {
-            const allParagraphs = (_a23 = unit.getBody()) == null ? void 0 : _a23.paragraphs, bulletParagraphs = allParagraphs == null ? void 0 : allParagraphs.filter((p2) => {
-              var _a24;
-              return ((_a24 = p2.bullet) == null ? void 0 : _a24.listId) === paragraphs[0].bullet.listId;
+            const allParagraphs = (_a22 = unit.getBody()) == null ? void 0 : _a22.paragraphs, bulletParagraphs = allParagraphs == null ? void 0 : allParagraphs.filter((p2) => {
+              var _a23;
+              return ((_a23 = p2.bullet) == null ? void 0 : _a23.listId) === paragraphs[0].bullet.listId;
             });
             return (bulletParagraphs == null ? void 0 : bulletParagraphs.findIndex((p2) => p2.startIndex === paragraphs[0].startIndex)) !== 0;
-          } else if (paragraphs.length > 1)
+          } else if (paragraphs.length > 1 && paragraphs.some((p2) => p2.bullet))
             return !0;
           return !1;
         }, "match"),
@@ -3986,7 +4167,26 @@ let DocAutoFormatController = (_a19 = class extends Disposable {
               type: params != null && params.shift ? ChangeListNestingLevelType.decrease : ChangeListNestingLevelType.increase
             }
           }];
-        }
+        },
+        priority: 100
+      })
+    ), this.disposeWithMe(
+      this._docAutoFormatService.registerAutoFormat({
+        id: TabCommand.id,
+        match: /* @__PURE__ */ __name((context) => {
+          const { selection } = context, { startNodePosition, endNodePosition } = selection;
+          return !!(startNodePosition && endNodePosition && isInSameTableCell(startNodePosition, endNodePosition) || startNodePosition && !endNodePosition && startNodePosition.path.indexOf("cells") > -1);
+        }, "match"),
+        getMutations(context) {
+          const params = context.commandParams;
+          return [{
+            id: DocTableTabCommand.id,
+            params: {
+              shift: !!(params != null && params.shift)
+            }
+          }];
+        },
+        priority: 99
       })
     );
   }
@@ -3995,16 +4195,16 @@ let DocAutoFormatController = (_a19 = class extends Disposable {
       this._docAutoFormatService.registerAutoFormat({
         id: AfterSpaceCommand.id,
         match: /* @__PURE__ */ __name((context) => {
-          var _a23;
+          var _a22;
           const { selection, paragraphs, unit } = context;
           if (!selection.collapsed || paragraphs.length !== 1)
             return !1;
-          const text = (_a23 = unit.getBody()) == null ? void 0 : _a23.dataStream.slice(paragraphs[0].paragraphStart, paragraphs[0].paragraphEnd - 1);
+          const text = (_a22 = unit.getBody()) == null ? void 0 : _a22.dataStream.slice(paragraphs[0].paragraphStart, paragraphs[0].paragraphEnd - 1);
           return !!(text && Object.keys(QuickListTypeMap).includes(text));
         }, "match"),
         getMutations(context) {
-          var _a23;
-          const { paragraphs, unit } = context, text = (_a23 = unit.getBody()) == null ? void 0 : _a23.dataStream.slice(paragraphs[0].paragraphStart, paragraphs[0].paragraphEnd - 1);
+          var _a22;
+          const { paragraphs, unit } = context, text = (_a22 = unit.getBody()) == null ? void 0 : _a22.dataStream.slice(paragraphs[0].paragraphStart, paragraphs[0].paragraphEnd - 1);
           if (text && Object.keys(QuickListTypeMap).includes(text)) {
             const type = QuickListTypeMap[text];
             return [{
@@ -4059,7 +4259,7 @@ let DocAutoFormatController = (_a19 = class extends Disposable {
       })
     );
   }
-}, __name(_a19, "DocAutoFormatController"), _a19);
+}, __name(_a18, "DocAutoFormatController"), _a18);
 DocAutoFormatController = __decorateClass$3([
   OnLifecycle(LifecycleStages.Rendered, DocAutoFormatController),
   __decorateParam$3(0, Inject(DocAutoFormatService))
@@ -4068,40 +4268,22 @@ var __defProp$2 = Object.defineProperty, __getOwnPropDesc$2 = Object.getOwnPrope
   for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$2(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
   return kind && result && __defProp$2(target, key, result), result;
-}, "__decorateClass$2"), __decorateParam$2 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$2"), _a20;
-let DocChecklistRenderController = (_a20 = class extends Disposable {
-  constructor(_context, _docSkeletonManagerService, _commandService, _docHoverManagerService) {
-    super(), this._context = _context, this._docSkeletonManagerService = _docSkeletonManagerService, this._commandService = _commandService, this._docHoverManagerService = _docHoverManagerService, this._initPointerDownObserver(), this._initHoverCursor();
+}, "__decorateClass$2"), __decorateParam$2 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$2"), _a19;
+let DocChecklistRenderController = (_a19 = class extends Disposable {
+  constructor(_context, _docSkeletonManagerService, _commandService, _docEventManagerService, _textSelectionManagerService) {
+    super(), this._context = _context, this._docSkeletonManagerService = _docSkeletonManagerService, this._commandService = _commandService, this._docEventManagerService = _docEventManagerService, this._textSelectionManagerService = _textSelectionManagerService, this._initPointerDownObserver(), this._initHoverCursor();
   }
   _initPointerDownObserver() {
-    this.disposeWithMe(
-      this._context.mainComponent.onPointerDown$.subscribeEvent((evt) => {
-        const { offsetX, offsetY } = evt, documentComponent = this._context.mainComponent, coord = this._getTransformCoordForDocumentOffset(
-          documentComponent,
-          this._context.scene.getViewport(VIEWPORT_KEY.VIEW_MAIN),
-          offsetX,
-          offsetY
-        );
-        if (!coord)
-          return;
-        const { pageLayoutType = PageLayoutType.VERTICAL, pageMarginLeft, pageMarginTop } = documentComponent.getOffsetConfig(), node = this._docSkeletonManagerService.getSkeleton().findNodeByCoord(
-          coord,
-          pageLayoutType,
-          pageMarginLeft,
-          pageMarginTop
-        );
-        if (!node)
-          return;
-        const paragraph = getParagraphByGlyph(node.node, this._context.unit.getBody());
-        paragraph && paragraph.bullet && node.node.glyphType === GlyphType.LIST && (paragraph.bullet.listType === PresetListType.CHECK_LIST || paragraph.bullet.listType === PresetListType.CHECK_LIST_CHECKED) && this._commandService.executeCommand(ToggleCheckListCommand.id, {
-          index: paragraph.startIndex
-        });
-      })
-    );
+    this._docEventManagerService.clickBullets$.subscribe((paragraph) => {
+      this._commandService.executeCommand(ToggleCheckListCommand.id, {
+        index: paragraph.paragraph.startIndex,
+        segmentId: paragraph.segmentId
+      });
+    });
   }
   _initHoverCursor() {
     this.disposeWithMe(
-      this._docHoverManagerService.bullet$.subscribe((paragraph) => {
+      this._docEventManagerService.hoverBullet$.subscribe((paragraph) => {
         paragraph ? this._context.mainComponent.setCursor(CURSOR_TYPE.POINTER) : this._context.mainComponent.setCursor(CURSOR_TYPE.TEXT);
       })
     );
@@ -4111,11 +4293,12 @@ let DocChecklistRenderController = (_a20 = class extends Disposable {
     if (originCoord)
       return documentTransform.clone().invert().applyPoint(originCoord);
   }
-}, __name(_a20, "DocChecklistRenderController"), _a20);
+}, __name(_a19, "DocChecklistRenderController"), _a19);
 DocChecklistRenderController = __decorateClass$2([
   __decorateParam$2(1, Inject(DocSkeletonManagerService)),
   __decorateParam$2(2, ICommandService),
-  __decorateParam$2(3, Inject(DocHoverManagerService))
+  __decorateParam$2(3, Inject(DocEventManagerService)),
+  __decorateParam$2(4, Inject(TextSelectionManagerService))
 ], DocChecklistRenderController);
 const create = "univer-create", createItem = "univer-create-item", createLabel = "univer-create-label", createInput = "univer-create-input", styles = {
   create,
@@ -4171,8 +4354,8 @@ var __defProp$1 = Object.defineProperty, __getOwnPropDesc$1 = Object.getOwnPrope
   for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$1(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
   return kind && result && __defProp$1(target, key, result), result;
-}, "__decorateClass$1"), __decorateParam$1 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$1"), _a21;
-let DocTableController = (_a21 = class extends Disposable {
+}, "__decorateClass$1"), __decorateParam$1 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$1"), _a20;
+let DocTableController = (_a20 = class extends Disposable {
   constructor(_commandService, _componentManager) {
     super(), this._commandService = _commandService, this._componentManager = _componentManager, this._initialize();
   }
@@ -4190,41 +4373,20 @@ let DocTableController = (_a21 = class extends Disposable {
   }
   _init() {
   }
-}, __name(_a21, "DocTableController"), _a21);
+}, __name(_a20, "DocTableController"), _a20);
 DocTableController = __decorateClass$1([
   OnLifecycle(LifecycleStages.Rendered, DocTableController),
   __decorateParam$1(0, ICommandService),
   __decorateParam$1(1, Inject(ComponentManager))
 ], DocTableController);
-const DocTabCommand = {
-  id: "doc.tab.tab-in-doc",
-  type: CommandType.COMMAND,
-  handler: /* @__PURE__ */ __name(async (accessor) => {
-    const textSelectionManagerService = accessor.get(TextSelectionManagerService), commandService = accessor.get(ICommandService), activeTextRange = textSelectionManagerService.getActiveTextRangeWithStyle();
-    if (activeTextRange == null)
-      return !1;
-    const { startNodePosition, endNodePosition } = activeTextRange;
-    return startNodePosition && endNodePosition && isInSameTableCell(startNodePosition, endNodePosition) ? commandService.executeCommand(DocTableTabCommand.id) : !1;
-  }, "handler")
-}, DocShiftTabCommand = {
-  id: "doc.tab.shift-tab-in-doc",
-  type: CommandType.COMMAND,
-  handler: /* @__PURE__ */ __name(async (accessor) => {
-    const textSelectionManagerService = accessor.get(TextSelectionManagerService), commandService = accessor.get(ICommandService), activeTextRange = textSelectionManagerService.getActiveTextRangeWithStyle();
-    if (activeTextRange == null)
-      return !1;
-    const { startNodePosition, endNodePosition } = activeTextRange;
-    return startNodePosition && endNodePosition && isInSameTableCell(startNodePosition, endNodePosition) ? commandService.executeCommand(DocTableShiftTabCommand.id) : !1;
-  }, "handler")
-};
 var __defProp2 = Object.defineProperty, __getOwnPropDesc = Object.getOwnPropertyDescriptor, __decorateClass = /* @__PURE__ */ __name((decorators, target, key, kind) => {
   for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
   return kind && result && __defProp2(target, key, result), result;
-}, "__decorateClass"), __decorateParam = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam"), _a22;
-let UniverDocsUIPlugin = (_a22 = class extends Plugin {
+}, "__decorateClass"), __decorateParam = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam"), _a21;
+let UniverDocsUIPlugin = (_a21 = class extends Plugin {
   constructor(_config, _injector, _renderManagerSrv, _commandService, _logService) {
-    super(), this._config = _config, this._injector = _injector, this._renderManagerSrv = _renderManagerSrv, this._commandService = _commandService, this._logService = _logService, this._config = Tools.deepMerge({}, DefaultDocUiConfig, this._config), this._initDependencies(_injector), this._initializeShortcut(), this._initCommand(), this._registerCommands();
+    super(), this._config = _config, this._injector = _injector, this._renderManagerSrv = _renderManagerSrv, this._commandService = _commandService, this._logService = _logService, this._config = Tools.deepMerge({}, DefaultDocUiConfig, this._config), this._initDependencies(_injector), this._initializeShortcut(), this._initCommand();
   }
   onReady() {
     this._initRenderBasics(), this._markDocAsFocused();
@@ -4258,12 +4420,6 @@ let UniverDocsUIPlugin = (_a22 = class extends Plugin {
       this._injector.get(IShortcutService).registerShortcut(shortcut);
     });
   }
-  _registerCommands() {
-    [
-      DocTabCommand,
-      DocShiftTabCommand
-    ].forEach((command) => this.disposeWithMe(this._commandService.registerCommand(command)));
-  }
   _initDependencies(injector) {
     mergeOverrideWithDependencies([
       [DocUIController, { useFactory: /* @__PURE__ */ __name(() => this._injector.createInstance(DocUIController, this._config), "useFactory") }],
@@ -4275,7 +4431,6 @@ let UniverDocsUIPlugin = (_a22 = class extends Plugin {
       [AppUIController, { useFactory: /* @__PURE__ */ __name(() => this._injector.createInstance(AppUIController, this._config), "useFactory") }],
       [IDocClipboardService, { useClass: DocClipboardService }],
       [DocCanvasPopManagerService],
-      [DocHoverManagerService],
       [DocParagraphSettingController]
     ], this._config.override).forEach((d) => injector.add(d));
   }
@@ -4306,18 +4461,18 @@ let UniverDocsUIPlugin = (_a22 = class extends Plugin {
   }
   _initRenderModules() {
     [
+      [DocEventManagerService],
       [DocBackScrollRenderController],
       [DocTextSelectionRenderController],
       [DocHeaderFooterController],
       [DocResizeRenderController],
-      [DocHoverRenderController],
       [DocContextMenuRenderController],
       [DocChecklistRenderController]
     ].forEach((m2) => {
       this._renderManagerSrv.registerRenderModule(UniverInstanceType.UNIVER_DOC, m2);
     });
   }
-}, __name(_a22, "UniverDocsUIPlugin"), __publicField(_a22, "pluginName", DOC_UI_PLUGIN_NAME), __publicField(_a22, "type", UniverInstanceType.UNIVER_DOC), _a22);
+}, __name(_a21, "UniverDocsUIPlugin"), __publicField(_a21, "pluginName", DOC_UI_PLUGIN_NAME), __publicField(_a21, "type", UniverInstanceType.UNIVER_DOC), _a21);
 UniverDocsUIPlugin = __decorateClass([
   __decorateParam(1, Inject(Injector)),
   __decorateParam(2, IRenderManagerService),
@@ -4361,7 +4516,7 @@ export {
   DocCopyCommand,
   DocCreateTableOperation,
   DocCutCommand,
-  DocHoverManagerService,
+  DocEventManagerService,
   DocPasteCommand,
   DocRenderController,
   DocUIController,