@univerjs/docs-ui 0.2.6 → 0.2.7

package/lib/es/index.js

@@ -2,13 +2,14 @@ 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, createIdentifier, Inject, IUniverInstanceService, ILogService, ICommandService, Disposable, SliceBodyType, normalizeBody, UniverInstanceType, toDisposable, RxDisposable, Direction, EDITOR_ACTIVATED, LocaleService, Injector, Optional, useDependency, useObservable, CommandType, DocumentFlavor, JSONX, ThemeService, HorizontalAlign, connectInjector, OnLifecycle, LifecycleStages, 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, Plugin, ObjectRelativeFromH, ObjectRelativeFromV } from "@univerjs/core";
-import { IClipboardInterfaceService, PLAIN_TEXT_CLIPBOARD_MIME_TYPE, HTML_CLIPBOARD_MIME_TYPE, IEditorService, KeyCode, MetaKeys, ILayoutService, ISidebarService, ComponentManager, 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 { TextSelectionManagerService, DocCustomRangeService, CutContentCommand, InnerPasteCommand, getDeleteSelection, DocSkeletonManagerService, VIEWPORT_KEY, getDocObject, MoveCursorOperation, MoveSelectionOperation, SelectAllOperation, SetDocZoomRatioOperation, neoGetDocObject, RichTextEditingMutation, SetInlineFormatBoldCommand, SetTextSelectionsOperation, SetInlineFormatCommand, SetInlineFormatItalicCommand, SetInlineFormatUnderlineCommand, SetInlineFormatStrikethroughCommand, SetInlineFormatSubscriptCommand, SetInlineFormatSuperscriptCommand, SetInlineFormatFontFamilyCommand, SetInlineFormatFontSizeCommand, SetInlineFormatTextColorCommand, AlignLeftCommand, AlignOperationCommand, AlignCenterCommand, AlignRightCommand, AlignJustifyCommand, OrderListCommand, BulletListCommand, ResetInlineFormatTextBackgroundColorCommand, SetInlineFormatTextBackgroundColorCommand, DeleteLeftCommand, BreakLineCommand, 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, DocInterceptorService } from "@univerjs/docs";
-import { pixelToPt, ptToPixel, NodePositionConvertToCursor, getAnchorBounding, IRenderManagerService, ITextSelectionRenderManager, Shape, DocumentEditArea, PageLayoutType, Vector2, Rect, Path, ScrollBar, Viewport, Layer, Documents, DocBackground, CURSOR_TYPE, pxToNum, getLineBounding, TRANSFORM_CHANGE_OBSERVABLE_TYPE } from "@univerjs/engine-render";
-import { takeUntil, Observable, combineLatest, fromEvent, BehaviorSubject, map, filter, throttleTime, debounceTime } from "rxjs";
-import require$$0, { useMemo, useCallback, useState, useEffect } from "react";
-import { Slider, Checkbox, InputNumber, Button, ColorPicker } from "@univerjs/design";
+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 { 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 * 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";
 import clsx from "clsx";
 function whenDocAndEditorFocused(contextService) {
   return contextService.getContextValue(FOCUSING_DOC) && contextService.getContextValue(FOCUSING_UNIVER_EDITOR) && !contextService.getContextValue(FOCUSING_COMMON_DRAWINGS);
@@ -135,8 +136,9 @@ function matchFilter(node, filter2) {
   return typeof filter2 == "string" ? tagName === filter2 : Array.isArray(filter2) ? filter2.some((name) => name === tagName) : filter2(node);
 }
 __name(matchFilter, "matchFilter");
-const _HtmlToUDMService = class _HtmlToUDMService {
+const DEFAULT_TABLE_WIDTH = 600, _HtmlToUDMService = class _HtmlToUDMService {
   constructor() {
+    __publicField(this, "_tableCache", []);
     __publicField(this, "_styleCache", /* @__PURE__ */ new Map());
     __publicField(this, "_styleRules", []);
     __publicField(this, "_afterProcessRules", []);
@@ -147,37 +149,41 @@ const _HtmlToUDMService = class _HtmlToUDMService {
     this._pluginList.push(plugin);
   }
   convert(html) {
-    const pastePlugin = _HtmlToUDMService._pluginList.find((plugin) => plugin.checkPasteType(html)), dom = parseToDom(html), newDocBody = {
-      dataStream: "",
-      textRuns: []
+    const pastePlugin = _HtmlToUDMService._pluginList.find((plugin) => plugin.checkPasteType(html)), dom = parseToDom(html), docData = {
+      body: {
+        dataStream: "",
+        textRuns: []
+      },
+      tableSource: {}
     };
-    return pastePlugin && (this._styleRules = [...pastePlugin.stylesRules], this._afterProcessRules = [...pastePlugin.afterProcessRules]), this._styleCache.clear(), this._process(null, dom == null ? void 0 : dom.childNodes, newDocBody), this._styleCache.clear(), this._styleRules = [], this._afterProcessRules = [], newDocBody;
+    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 _a19, _b, _c;
+    var _a23, _b, _c;
+    const body = doc.body;
     for (const node of nodes)
       if (node.nodeType === Node.TEXT_NODE) {
-        if (((_a19 = node.nodeValue) == null ? void 0 : _a19.trim()) === "")
+        if (((_a23 = node.nodeValue) == null ? void 0 : _a23.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") {
           const id = Tools.generateRandomId();
-          text = `${DataStreamTreeTokenType.CUSTOM_RANGE_START}${text}${DataStreamTreeTokenType.CUSTOM_RANGE_END}`, doc.customRanges = [
-            ...(_c = doc.customRanges) != null ? _c : [],
+          text = `${DataStreamTreeTokenType.CUSTOM_RANGE_START}${text}${DataStreamTreeTokenType.CUSTOM_RANGE_END}`, body.customRanges = [
+            ...(_c = body.customRanges) != null ? _c : [],
             {
-              startIndex: doc.dataStream.length,
-              endIndex: doc.dataStream.length + text.length - 1,
+              startIndex: body.dataStream.length,
+              endIndex: body.dataStream.length + text.length - 1,
               rangeId: id,
               rangeType: CustomRangeType.HYPERLINK
             }
-          ], doc.payloads = {
-            ...doc.payloads,
+          ], body.payloads = {
+            ...body.payloads,
             [id]: parent.href
           };
         }
-        parent && this._styleCache.has(parent) && (style = this._styleCache.get(parent)), doc.dataStream += text, style && Object.getOwnPropertyNames(style).length && doc.textRuns.push({
-          st: doc.dataStream.length - text.length,
-          ed: doc.dataStream.length,
+        parent && this._styleCache.has(parent) && (style = this._styleCache.get(parent)), body.dataStream += text, style && Object.getOwnPropertyNames(style).length && body.textRuns.push({
+          st: body.dataStream.length - text.length,
+          ed: body.dataStream.length,
           ts: style
         });
       } else {
@@ -187,7 +193,7 @@ const _HtmlToUDMService = class _HtmlToUDMService {
           const parentStyles = parent ? this._styleCache.get(parent) : {}, styleRule = this._styleRules.find(({ filter: filter2 }) => matchFilter(node, filter2)), nodeStyles = styleRule ? styleRule.getStyle(node) : extractNodeStyle(node);
           this._styleCache.set(node, { ...parentStyles, ...nodeStyles });
           const { childNodes } = node;
-          this._process(node, childNodes, doc);
+          this._processBeforeTable(node, doc), this._process(node, childNodes, doc), this._processAfterTable(node, doc);
           const afterProcessRule = this._afterProcessRules.find(
             ({ filter: filter2 }) => matchFilter(node, filter2)
           );
@@ -195,6 +201,61 @@ const _HtmlToUDMService = class _HtmlToUDMService {
         }
       }
   }
+  _processBeforeTable(node, doc) {
+    var _a23;
+    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({
+          startIndex: body.dataStream.length - 1
+        }));
+        const table = genTableSource(0, 0, DEFAULT_TABLE_WIDTH);
+        this._tableCache.push({
+          table,
+          startIndex: body.dataStream.length
+        }), body.dataStream += DataStreamTreeTokenType.TABLE_START;
+        break;
+      }
+      case "TR": {
+        const row = getEmptyTableRow(0);
+        this._tableCache[this._tableCache.length - 1].table.tableRows.push(row), body.dataStream += DataStreamTreeTokenType.TABLE_ROW_START;
+        break;
+      }
+      case "TD": {
+        const cell = getEmptyTableCell(), lastTable = this._tableCache[this._tableCache.length - 1].table;
+        lastTable.tableRows[lastTable.tableRows.length - 1].tableCells.push(cell), body.dataStream += DataStreamTreeTokenType.TABLE_CELL_START;
+        break;
+      }
+    }
+  }
+  _processAfterTable(node, doc) {
+    var _a23;
+    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;
+    switch (tagName) {
+      case "TABLE": {
+        const tableCache = this._tableCache.pop(), { startIndex, table } = tableCache, colCount = table.tableRows[0].tableCells.length, tableColumn = getTableColumn(DEFAULT_TABLE_WIDTH / colCount), tableColumns = [...new Array(colCount).fill(null).map(() => Tools.deepClone(tableColumn))];
+        table.tableColumns = tableColumns, tableSource[table.tableId] = table, body.dataStream += DataStreamTreeTokenType.TABLE_END, body.tables.push({
+          startIndex,
+          endIndex: body.dataStream.length - 1,
+          tableId: table.tableId
+        });
+        break;
+      }
+      case "TR": {
+        body.dataStream += DataStreamTreeTokenType.TABLE_ROW_END;
+        break;
+      }
+      case "TD": {
+        (_a23 = body.sectionBreaks) == null || _a23.push({
+          startIndex: body.dataStream.length
+        }), body.dataStream += `
+${DataStreamTreeTokenType.TABLE_CELL_END}`;
+        break;
+      }
+    }
+  }
 };
 __name(_HtmlToUDMService, "HtmlToUDMService"), __publicField(_HtmlToUDMService, "_pluginList", []);
 let HtmlToUDMService = _HtmlToUDMService;
@@ -224,9 +285,10 @@ const wordPastePlugin$1 = {
         return el.tagName === "DIV" && /ace-line/i.test(el.className);
       },
       handler(doc) {
-        doc.paragraphs == null && (doc.paragraphs = []), doc.paragraphs.push({
-          startIndex: doc.dataStream.length
-        }), doc.dataStream += "\r";
+        const body = doc.body;
+        body.paragraphs == null && (body.paragraphs = []), body.paragraphs.push({
+          startIndex: body.dataStream.length
+        }), body.dataStream += "\r";
       }
     }
   ]
@@ -247,8 +309,8 @@ function getParagraphStyle(el) {
         break;
       }
       case "line-height": {
-        const lineHeightValue = Number.parseFloat(cssValue);
-        paragraphStyle.lineSpacing = lineHeightValue;
+        let lineHeightValue = Number.parseFloat(cssValue);
+        cssValue.endsWith("%") && (lineHeightValue /= 100), paragraphStyle.lineSpacing = lineHeightValue;
         break;
       }
     }
@@ -276,11 +338,12 @@ const wordPastePlugin = {
         return el.tagName === "P";
       },
       handler(doc, el) {
-        doc.paragraphs == null && (doc.paragraphs = []);
+        const body = doc.body;
+        body.paragraphs == null && (body.paragraphs = []);
         const paragraph = {
-          startIndex: doc.dataStream.length
+          startIndex: body.dataStream.length
         }, paragraphStyle = getParagraphStyle(el);
-        paragraphStyle && (paragraph.paragraphStyle = paragraphStyle), doc.paragraphs.push(paragraph), doc.dataStream += "\r";
+        paragraphStyle && (paragraph.paragraphStyle = paragraphStyle), body.paragraphs.push(paragraph), body.dataStream += "\r";
       }
     }
   ]
@@ -296,11 +359,12 @@ const wordPastePlugin = {
         return el.tagName === "P" && /UniverNormal/i.test(el.className);
       },
       handler(doc, el) {
-        doc.paragraphs == null && (doc.paragraphs = []);
+        const body = doc.body;
+        body.paragraphs == null && (body.paragraphs = []);
         const paragraph = {
-          startIndex: doc.dataStream.length
+          startIndex: body.dataStream.length
         }, paragraphStyle = getParagraphStyle(el);
-        paragraphStyle && (paragraph.paragraphStyle = paragraphStyle), doc.paragraphs.push(paragraph), doc.dataStream += "\r";
+        paragraphStyle && (paragraph.paragraphStyle = paragraphStyle), body.paragraphs.push(paragraph), body.dataStream += "\r";
       }
     }
   ]
@@ -330,42 +394,102 @@ function getBodySliceHtml(body, startIndex, endIndex) {
   return cursorIndex !== endIndex && spanList.push(dataStream.slice(cursorIndex, endIndex)), spanList.join("");
 }
 __name(getBodySliceHtml, "getBodySliceHtml");
-function convertBodyToHtml(body, withParagraphInfo = !0) {
-  var _a19;
-  if (withParagraphInfo && ((_a19 = body.paragraphs) != null && _a19.length)) {
-    const { dataStream, paragraphs = [] } = body;
-    let result = "", cursorIndex = -1;
-    for (const paragraph of paragraphs) {
-      const { startIndex, paragraphStyle = {} } = paragraph, { spaceAbove, spaceBelow, lineSpacing } = paragraphStyle, style = [];
-      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}`), startIndex > cursorIndex + 1 ? result += `<p class="UniverNormal" ${style.length ? `style="${style.join("; ")};"` : ""}>${getBodySliceHtml(body, cursorIndex + 1, startIndex)}</p>` : result += `<p class="UniverNormal" ${style.length ? `style="${style.join("; ")};"` : ""}></p>`, cursorIndex = startIndex;
-    }
-    return cursorIndex !== dataStream.length && (result += getBodySliceHtml(body, cursorIndex, dataStream.length)), result;
-  } else
-    return getBodySliceHtml(body, 0, body.dataStream.length);
+function convertBodyToHtml(body) {
+  const { paragraphs = [], sectionBreaks = [] } = body;
+  let { dataStream } = body;
+  dataStream.endsWith(`\r
+`) || (dataStream += `\r
+`, paragraphs.push({
+    startIndex: dataStream.length - 2
+  }), sectionBreaks.push({
+    startIndex: dataStream.length - 1
+  }), body.dataStream = dataStream, body.paragraphs = paragraphs, body.sectionBreaks = sectionBreaks);
+  const result = { html: "" }, nodeList = parseDataStreamToTree(dataStream);
+  for (const node of nodeList)
+    processNode(node, body, result);
+  return result.html;
 }
 __name(convertBodyToHtml, "convertBodyToHtml");
+function processNode(node, body, result) {
+  var _a23;
+  switch (node.nodeType) {
+    case DataStreamTreeNodeType.SECTION_BREAK: {
+      for (const n2 of node.children)
+        processNode(n2, 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 = [];
+      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);
+      result.html += `${getBodySliceHtml(body, startIndex, endIndex)}</p>`;
+      break;
+    }
+    case DataStreamTreeNodeType.TABLE: {
+      const { children } = node;
+      result.html += '<table class="UniverTable" style="width: 100%; border-collapse: collapse;"><tbody>';
+      for (const row of children)
+        processNode(row, body, result);
+      result.html += "</tbody></table>";
+      break;
+    }
+    case DataStreamTreeNodeType.TABLE_ROW: {
+      const { children } = node;
+      result.html += '<tr class="UniverTableRow">';
+      for (const cell of children)
+        processNode(cell, body, result);
+      result.html += "</tr>";
+      break;
+    }
+    case DataStreamTreeNodeType.TABLE_CELL: {
+      const { children } = node;
+      result.html += '<td class="UniverTableCell">';
+      for (const n2 of children)
+        processNode(n2, body, result);
+      result.html += "</td>";
+      break;
+    }
+    default:
+      throw new Error(`Unknown node type: ${node.nodeType}`);
+  }
+}
+__name(processNode, "processNode");
 const _UDMToHtmlService = class _UDMToHtmlService {
   convert(bodyList) {
     if (bodyList.length === 0)
       throw new Error("The bodyList length at least to be 1");
-    if (bodyList.length === 1)
-      return convertBodyToHtml(bodyList[0]);
     let html = "";
-    for (const body of bodyList)
-      html += '<p className="UniverNormal">', html += convertBodyToHtml(body, !1), html += "</p>";
+    for (const body of Tools.deepClone(bodyList))
+      html += convertBodyToHtml(body);
     return html;
   }
 };
 __name(_UDMToHtmlService, "UDMToHtmlService");
 let UDMToHtmlService = _UDMToHtmlService;
-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$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--)
     (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$l(target, key, result), result;
+}, "__decorateClass$l"), __decorateParam$l = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$l");
 HtmlToUDMService.use(PastePluginWord);
 HtmlToUDMService.use(PastePluginLark);
 HtmlToUDMService.use(PastePluginUniver);
+function getTableSlice(body, start, end) {
+  var _a23, _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) => {
+    const { st, ed } = textRun;
+    textRun.st = st + 3, textRun.ed = ed + 3;
+  }), (_b = bodySlice.tables) == null || _b.forEach((table) => {
+    const { startIndex, endIndex } = table;
+    table.startIndex = startIndex + 3, table.endIndex = endIndex + 3;
+  }), (_c = bodySlice.paragraphs) == null || _c.forEach((paragraph) => {
+    const { startIndex } = paragraph;
+    paragraph.startIndex = startIndex + 3;
+  }), bodySlice;
+}
+__name(getTableSlice, "getTableSlice");
 const IDocClipboardService = createIdentifier("doc.clipboard-service");
 var _a;
 let DocClipboardService = (_a = class extends Disposable {
@@ -377,12 +501,12 @@ 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 documentBodyList = this._getDocumentBodyInRanges(sliceType);
-    if (documentBodyList.length === 0)
+    const { bodyList, needCache } = this._getDocumentBodyInRanges(sliceType);
+    if (bodyList.length === 0)
       return !1;
     try {
-      const activeRange = this._textSelectionManagerService.getActiveRange(), isCopyInHeaderFooter = !!(activeRange != null && activeRange.segmentId);
-      this._setClipboardData(documentBodyList, !isCopyInHeaderFooter);
+      const activeRange = this._textSelectionManagerService.getActiveTextRangeWithStyle(), isCopyInHeaderFooter = !!(activeRange != null && activeRange.segmentId);
+      this._setClipboardData(bodyList, !isCopyInHeaderFooter && needCache);
     } catch (e) {
       return this._logService.error("[DocClipboardService] copy failed", e), !1;
     }
@@ -392,51 +516,57 @@ let DocClipboardService = (_a = class extends Disposable {
     return this._cut();
   }
   async paste(items) {
-    const body = await this._generateBodyFromClipboardItems(items);
-    return this._paste(body);
+    const partDocData = await this._genDocDataFromClipboardItems(items);
+    return this._paste(partDocData);
   }
   async legacyPaste(html, text) {
-    const body = this._generateBodyFromHtmlAndText(html, text);
-    return this._paste(body);
+    const partDocData = this._genDocDataFromHtmlAndText(html, text);
+    return this._paste(partDocData);
   }
   async _cut() {
-    var _a19;
+    var _a23, _b, _c;
     const {
       segmentId,
       endOffset: activeEndOffset,
       style
-    } = (_a19 = this._textSelectionManagerService.getActiveRange()) != null ? _a19 : {}, ranges = this._textSelectionManagerService.getCurrentSelections();
-    if (segmentId == null && this._logService.error("[DocClipboardController] segmentId is not existed"), activeEndOffset == null || ranges == null)
+    } = (_a23 = this._textSelectionManagerService.getActiveTextRangeWithStyle()) != null ? _a23 : {}, 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);
     try {
-      let cursor = activeEndOffset;
-      for (const range of ranges) {
-        const { startOffset, endOffset } = range;
-        startOffset == null || endOffset == null || endOffset <= activeEndOffset && (cursor -= endOffset - startOffset);
-      }
-      const textRanges = [
+      let cursor = 0;
+      if (rectRanges.length > 0)
+        cursor = getCursorWhenDelete(textRanges, rectRanges);
+      else if (activeEndOffset != null)
+        for (const range of textRanges) {
+          const { startOffset, endOffset } = range;
+          startOffset == null || endOffset == null || endOffset <= activeEndOffset && (cursor -= endOffset - startOffset);
+        }
+      const newTextRanges = [
         {
           startOffset: cursor,
           endOffset: cursor,
           style
         }
       ];
-      return this._commandService.executeCommand(CutContentCommand.id, { segmentId, textRanges });
+      return this._commandService.executeCommand(CutContentCommand.id, { segmentId, textRanges: newTextRanges });
     } catch {
       return this._logService.error("[DocClipboardController] cut content failed"), !1;
     }
   }
-  async _paste(_body) {
-    var _a19, _b;
+  async _paste(docData) {
+    var _a23, _b;
+    const { body: _body } = docData;
+    if (_body == null)
+      return !1;
     let body = normalizeBody(_body);
-    const unitId = (_a19 = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_DOC)) == null ? void 0 : _a19.getUnitId();
+    const unitId = (_a23 = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_DOC)) == null ? void 0 : _a23.getUnitId();
     if (!unitId)
       return !1;
     this._clipboardHooks.forEach((hook) => {
       hook.onBeforePaste && (body = hook.onBeforePaste(body));
     }), body.customRanges = (_b = body.customRanges) == null ? void 0 : _b.map((range) => this._docCustomRangeService.copyCustomRange(unitId, range));
-    const activeRange = this._textSelectionManagerService.getActiveRange(), { segmentId, endOffset: activeEndOffset, style } = activeRange || {}, ranges = this._textSelectionManagerService.getCurrentSelections();
+    const activeRange = this._textSelectionManagerService.getActiveTextRangeWithStyle(), { segmentId, endOffset: activeEndOffset, style } = activeRange || {}, ranges = this._textSelectionManagerService.getCurrentTextRanges();
     if (segmentId == null && this._logService.error("[DocClipboardController] segmentId does not exist!"), activeEndOffset == null || ranges == null)
       return !1;
     try {
@@ -452,7 +582,14 @@ let DocClipboardService = (_a = class extends Disposable {
           style
         }
       ];
-      return this._commandService.executeCommand(InnerPasteCommand.id, { body, segmentId, textRanges });
+      return this._commandService.executeCommand(InnerPasteCommand.id, {
+        doc: {
+          ...docData,
+          body
+        },
+        segmentId,
+        textRanges
+      });
     } catch {
       return this._logService.error("[DocClipboardController]", "clipboard is empty."), !1;
     }
@@ -461,7 +598,7 @@ let DocClipboardService = (_a = class extends Disposable {
     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, documentBodyList[0])), this._clipboardInterfaceService.write(text, html);
+    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);
   }
   addClipboardHook(hook) {
     return this._clipboardHooks.push(hook), toDisposable(() => {
@@ -469,15 +606,33 @@ let DocClipboardService = (_a = class extends Disposable {
       index > -1 && this._clipboardHooks.splice(index, 1);
     });
   }
+  // eslint-disable-next-line max-lines-per-function
   _getDocumentBodyInRanges(sliceType) {
-    const ranges = this._textSelectionManagerService.getCurrentSelections(), activeRange = this._textSelectionManagerService.getActiveRange(), docDataModel = this._univerInstanceService.getCurrentUniverDocInstance(), results = [], body = docDataModel == null ? void 0 : docDataModel.getBody();
-    if (ranges == null || docDataModel == null || body == null || activeRange == null)
-      return results;
-    const { segmentId } = activeRange;
-    for (const range of ranges) {
-      const { startOffset, endOffset, collapsed } = range;
+    var _a23;
+    const docDataModel = this._univerInstanceService.getCurrentUniverDocInstance(), allRanges = this._textSelectionManagerService.getDocRanges(), results = [];
+    let needCache = !0;
+    if (docDataModel == null || allRanges.length === 0)
+      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
+      };
+    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) {
@@ -493,15 +648,18 @@ let DocClipboardService = (_a = class extends Disposable {
         results.push(docBody);
       }
     }
-    return results;
+    return {
+      bodyList: results,
+      needCache
+    };
   }
-  async _generateBodyFromClipboardItems(items) {
+  async _genDocDataFromClipboardItems(items) {
     try {
       let html = "", text = "";
       for (const clipboardItem of items)
         for (const type of clipboardItem.types)
           type === PLAIN_TEXT_CLIPBOARD_MIME_TYPE ? text = await clipboardItem.getType(type).then((blob) => blob && blob.text()) : type === HTML_CLIPBOARD_MIME_TYPE && (html = await clipboardItem.getType(type).then((blob) => blob && blob.text()));
-      return this._generateBodyFromHtmlAndText(html, text);
+      return this._genDocDataFromHtmlAndText(html, text);
     } catch (e) {
       return Promise.reject(e);
     }
@@ -532,10 +690,10 @@ let DocClipboardService = (_a = class extends Disposable {
       paragraphs
     };
   }
-  _generateBodyFromHtmlAndText(html, text) {
+  _genDocDataFromHtmlAndText(html, text) {
     if (!html) {
       if (text)
-        return this._generateBody(text);
+        return { body: this._generateBody(text) };
       throw new Error("[DocClipboardService] html and text cannot be both empty!");
     }
     const copyId = extractId(html);
@@ -547,19 +705,19 @@ let DocClipboardService = (_a = class extends Disposable {
     return this._htmlToUDM.convert(html);
   }
 }, __name(_a, "DocClipboardService"), _a);
-DocClipboardService = __decorateClass$h([
-  __decorateParam$h(0, IUniverInstanceService),
-  __decorateParam$h(1, ILogService),
-  __decorateParam$h(2, ICommandService),
-  __decorateParam$h(3, IClipboardInterfaceService),
-  __decorateParam$h(4, Inject(TextSelectionManagerService)),
-  __decorateParam$h(5, Inject(DocCustomRangeService))
+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);
-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$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$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$k(target, key, result), result;
+}, "__decorateClass$k"), __decorateParam$k = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$k");
 const ANCHOR_WIDTH = 1.5;
 var _a2;
 let DocBackScrollRenderController = (_a2 = class extends RxDisposable {
@@ -575,16 +733,16 @@ let DocBackScrollRenderController = (_a2 = class extends RxDisposable {
     });
   }
   scrollToRange(unitId, range) {
-    var _a19;
-    const docSkeletonManagerService = (_a19 = this._renderManagerService.getRenderById(unitId)) == null ? void 0 : _a19.with(DocSkeletonManagerService), skeleton = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getSkeleton();
+    var _a23;
+    const docSkeletonManagerService = (_a23 = this._renderManagerService.getRenderById(unitId)) == null ? void 0 : _a23.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 _a19;
-    const docObject = this._getDocObject(), docSkeletonManagerService = (_a19 = this._renderManagerService.getRenderById(unitId)) == null ? void 0 : _a19.with(DocSkeletonManagerService), skeleton = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getSkeleton();
+    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();
     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);
@@ -604,7 +762,7 @@ let DocBackScrollRenderController = (_a2 = class extends RxDisposable {
   }
   // Let the selection show on the current screen.
   _scrollToSelection(unitId) {
-    const activeTextRange = this._textSelectionManagerService.getActiveRange();
+    const activeTextRange = this._textSelectionManagerService.getActiveTextRangeWithStyle();
     if (activeTextRange == null)
       return;
     const { collapsed, startNodePosition } = activeTextRange;
@@ -614,11 +772,11 @@ let DocBackScrollRenderController = (_a2 = class extends RxDisposable {
     return getDocObject(this._univerInstanceService, this._renderManagerService);
   }
 }, __name(_a2, "DocBackScrollRenderController"), _a2);
-DocBackScrollRenderController = __decorateClass$g([
-  __decorateParam$g(1, Inject(TextSelectionManagerService)),
-  __decorateParam$g(2, IEditorService),
-  __decorateParam$g(3, Inject(IUniverInstanceService)),
-  __decorateParam$g(4, IRenderManagerService)
+DocBackScrollRenderController = __decorateClass$k([
+  __decorateParam$k(1, Inject(TextSelectionManagerService)),
+  __decorateParam$k(2, IEditorService),
+  __decorateParam$k(3, Inject(IUniverInstanceService)),
+  __decorateParam$k(4, IRenderManagerService)
 ], DocBackScrollRenderController);
 const DefaultToolbarConfig = {
   undo: !0,
@@ -727,11 +885,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$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$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$f(target, key, result), result;
-}, "__decorateClass$f"), __decorateParam$f = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$f"), _a3;
+  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;
 let DocContainerUIController = (_a3 = class {
   constructor(_config, _localeService, _injector) {
     __publicField(this, "_docContainer");
@@ -771,15 +929,15 @@ let DocContainerUIController = (_a3 = class {
     return this._docContainer;
   }
 }, __name(_a3, "DocContainerUIController"), _a3);
-DocContainerUIController = __decorateClass$f([
-  __decorateParam$f(1, Inject(LocaleService)),
-  __decorateParam$f(2, Inject(Injector))
+DocContainerUIController = __decorateClass$j([
+  __decorateParam$j(1, Inject(LocaleService)),
+  __decorateParam$j(2, Inject(Injector))
 ], DocContainerUIController);
-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$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$e(target, key, result), result;
-}, "__decorateClass$e"), __decorateParam$e = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$e"), _a4;
+  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;
 let AppUIController = (_a4 = class extends RxDisposable {
   constructor(_config, _localeService, _injector, _textSelectionRenderManager, _layoutService) {
     super();
@@ -806,83 +964,100 @@ let AppUIController = (_a4 = class extends RxDisposable {
     return this._docContainerController;
   }
 }, __name(_a4, "AppUIController"), _a4);
-AppUIController = __decorateClass$e([
-  __decorateParam$e(1, Inject(LocaleService)),
-  __decorateParam$e(2, Inject(Injector)),
-  __decorateParam$e(3, ITextSelectionRenderManager),
-  __decorateParam$e(4, Optional(ILayoutService))
+AppUIController = __decorateClass$i([
+  __decorateParam$i(1, Inject(LocaleService)),
+  __decorateParam$i(2, Inject(Injector)),
+  __decorateParam$i(3, ITextSelectionRenderManager),
+  __decorateParam$i(4, Optional(ILayoutService))
 ], AppUIController);
-const COMPONENT_PREFIX = "UI_PLUGIN_DOCS", COLOR_PICKER_COMPONENT = `${COMPONENT_PREFIX}_COLOR_PICKER_COMPONENT`, FONT_FAMILY_COMPONENT = `${COMPONENT_PREFIX}_FONT_FAMILY_COMPONENT`, FONT_FAMILY_ITEM_COMPONENT = `${COMPONENT_PREFIX}_FONT_FAMILY_ITEM_COMPONENT`, FONT_SIZE_COMPONENT = `${COMPONENT_PREFIX}_FONT_SIZE_COMPONENT`;
-var jsxRuntime = { exports: {} }, reactJsxRuntime_production_min = {};
-/**
- * @license React
- * react-jsx-runtime.production.min.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-var f = require$$0, k = Symbol.for("react.element"), l = Symbol.for("react.fragment"), m = Object.prototype.hasOwnProperty, n = f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, p = { key: !0, ref: !0, __self: !0, __source: !0 };
-function q(c, a, g) {
-  var b, d = {}, e = null, h = null;
-  g !== void 0 && (e = "" + g), a.key !== void 0 && (e = "" + a.key), a.ref !== void 0 && (h = a.ref);
-  for (b in a) m.call(a, b) && !p.hasOwnProperty(b) && (d[b] = a[b]);
-  if (c && c.defaultProps) for (b in a = c.defaultProps, a) d[b] === void 0 && (d[b] = a[b]);
-  return { $$typeof: k, type: c, key: e, ref: h, props: d, _owner: n.current };
-}
-__name(q, "q");
-reactJsxRuntime_production_min.Fragment = l;
-reactJsxRuntime_production_min.jsx = q;
-reactJsxRuntime_production_min.jsxs = q;
-jsxRuntime.exports = reactJsxRuntime_production_min;
-var jsxRuntimeExports = jsxRuntime.exports;
-const docCountBar = "univer-doc-count-bar", styles$2 = {
-  docCountBar
-}, 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 _a19, _b;
-    if (!documentDataModel) return 100;
-    const currentZoom = ((_b = (_a19 = documentDataModel.getSettings()) == null ? void 0 : _a19.zoomRatio) != null ? _b : 1) * 100;
-    return Math.round(currentZoom);
-  }, [documentDataModel]), [zoom, setZoom] = useState(() => getCurrentZoom());
-  useEffect(() => (setZoom(getCurrentZoom()), commandService.onCommandExecuted((commandInfo) => {
-    if (commandInfo.id === SetDocZoomRatioOperation.id) {
-      const currentZoom = getCurrentZoom();
-      setZoom(currentZoom);
-    }
-  }).dispose), [commandService, getCurrentZoom]);
-  function handleChange(value) {
-    if (setZoom(value), documentDataModel == null)
-      return;
-    const zoomRatio = value / 100;
-    commandService.executeCommand(SetDocZoomRatioOperation.id, {
-      unitId: documentDataModel.getUnitId(),
-      zoomRatio
-    });
-  }
-  return __name(handleChange, "handleChange"), /* @__PURE__ */ jsxRuntimeExports.jsx(
-    Slider,
-    {
-      min: DOC_ZOOM_RANGE[0],
-      value: zoom,
-      shortcuts: ZOOM_MAP,
-      onChange: handleChange
+var __assign = function() {
+  return __assign = Object.assign || function(t) {
+    for (var s, i = 1, n2 = arguments.length; i < n2; i++) {
+      s = arguments[i];
+      for (var p2 in s) Object.prototype.hasOwnProperty.call(s, p2) && (t[p2] = s[p2]);
     }
-  );
+    return t;
+  }, __assign.apply(this, arguments);
+}, __rest = function(s, e) {
+  var t = {};
+  for (var p2 in s) Object.prototype.hasOwnProperty.call(s, p2) && e.indexOf(p2) < 0 && (t[p2] = s[p2]);
+  if (s != null && typeof Object.getOwnPropertySymbols == "function")
+    for (var i = 0, p2 = Object.getOwnPropertySymbols(s); i < p2.length; i++)
+      e.indexOf(p2[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p2[i]) && (t[p2[i]] = s[p2[i]]);
+  return t;
+}, IconBase = forwardRef(function(props, ref) {
+  var icon = props.icon, id = props.id, className = props.className, extend = props.extend, restProps = __rest(props, ["icon", "id", "className", "extend"]), cls = "univerjs-icon univerjs-icon-".concat(id, " ").concat(className || "").trim(), idSuffix = useRef("_".concat(generateShortUuid()));
+  return render(icon, "".concat(id), { defIds: icon.defIds, idSuffix: idSuffix.current }, __assign({ ref, className: cls }, restProps), extend);
+});
+function render(node, id, runtimeProps, rootProps, extend) {
+  return createElement(node.tag, __assign(__assign({ key: id }, replaceRuntimeIdsAndExtInAttrs(node, runtimeProps, extend)), rootProps), (replaceRuntimeIdsInDefs(node, runtimeProps).children || []).map(function(child, index) {
+    return render(child, "".concat(id, "-").concat(node.tag, "-").concat(index), runtimeProps, void 0, extend);
+  }));
 }
-__name(ZoomSlider, "ZoomSlider");
-function CountBar(props) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("section", { className: styles$2.docCountBar, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ZoomSlider, {}) });
+__name(render, "render");
+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];
+    typeof value == "string" && (attrs[key] = value.replace(/url\(#(.*)\)/, "url(#$1".concat(runtimeProps.idSuffix, ")")));
+  })), attrs;
 }
-__name(CountBar, "CountBar");
-const docFooterContainer = "univer-doc-footer-container", styles$1 = {
-  docFooterContainer
-}, DocFooter = /* @__PURE__ */ __name(() => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.docFooterContainer, children: [
-  /* @__PURE__ */ jsxRuntimeExports.jsx("div", {}),
-  /* @__PURE__ */ jsxRuntimeExports.jsx(CountBar, {})
-] }), "DocFooter"), COLLAB_CURSOR_LABEL_HEIGHT = 18, COLLAB_CURSOR_LABEL_MAX_WIDTH = 200, COLLAB_CURSOR_LABEL_TEXT_PADDING_LR = 6, COLLAB_CURSOR_LABEL_TEXT_PADDING_TB = 4;
+__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) {
+    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;
+}
+__name(replaceRuntimeIdsInDefs, "replaceRuntimeIdsInDefs");
+function generateShortUuid() {
+  return Math.random().toString(36).substring(2, 8);
+}
+__name(generateShortUuid, "generateShortUuid");
+IconBase.displayName = "UniverIcon";
+var element$4 = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M1.9999 1.89941C1.66853 1.89941 1.3999 2.16804 1.3999 2.49941 1.3999 2.83078 1.66853 3.09941 1.9999 3.09941H13.9999C14.3313 3.09941 14.5999 2.83078 14.5999 2.49941 14.5999 2.16804 14.3313 1.89941 13.9999 1.89941H1.9999zM1.9999 5.56641C1.66853 5.56641 1.3999 5.83504 1.3999 6.16641 1.3999 6.49778 1.66853 6.76641 1.9999 6.76641H13.9999C14.3313 6.76641 14.5999 6.49778 14.5999 6.16641 14.5999 5.83504 14.3313 5.56641 13.9999 5.56641H1.9999zM1.3999 9.8334C1.3999 9.50203 1.66853 9.2334 1.9999 9.2334H13.9999C14.3313 9.2334 14.5999 9.50203 14.5999 9.8334 14.5999 10.1648 14.3313 10.4334 13.9999 10.4334H1.9999C1.66853 10.4334 1.3999 10.1648 1.3999 9.8334zM1.9999 12.9004C1.66853 12.9004 1.3999 13.169 1.3999 13.5004 1.3999 13.8318 1.66853 14.1004 1.9999 14.1004H13.9999C14.3313 14.1004 14.5999 13.8318 14.5999 13.5004 14.5999 13.169 14.3313 12.9004 13.9999 12.9004H1.9999z" } }] }, AlignTextBothSingle = forwardRef(function(props, ref) {
+  return createElement(IconBase, Object.assign({}, props, {
+    id: "align-text-both-single",
+    ref,
+    icon: element$4
+  }));
+});
+AlignTextBothSingle.displayName = "AlignTextBothSingle";
+var element$3 = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M1.9999 1.89941C1.66853 1.89941 1.3999 2.16804 1.3999 2.49941 1.3999 2.83078 1.66853 3.09941 1.9999 3.09941H13.9999C14.3313 3.09941 14.5999 2.83078 14.5999 2.49941 14.5999 2.16804 14.3313 1.89941 13.9999 1.89941H1.9999zM3.33315 5.56641C3.00178 5.56641 2.73315 5.83504 2.73315 6.16641 2.73315 6.49778 3.00178 6.76641 3.33315 6.76641H12.6665C12.9979 6.76641 13.2665 6.49778 13.2665 6.16641 13.2665 5.83504 12.9979 5.56641 12.6665 5.56641H3.33315zM1.3999 9.8334C1.3999 9.50203 1.66853 9.2334 1.9999 9.2334H13.9999C14.3313 9.2334 14.5999 9.50203 14.5999 9.8334 14.5999 10.1648 14.3313 10.4334 13.9999 10.4334H1.9999C1.66853 10.4334 1.3999 10.1648 1.3999 9.8334zM3.33315 12.9004C3.00178 12.9004 2.73315 13.169 2.73315 13.5004 2.73315 13.8318 3.00178 14.1004 3.33315 14.1004H12.6665C12.9979 14.1004 13.2665 13.8318 13.2665 13.5004 13.2665 13.169 12.9979 12.9004 12.6665 12.9004H3.33315z" } }] }, HorizontallySingle = forwardRef(function(props, ref) {
+  return createElement(IconBase, Object.assign({}, props, {
+    id: "horizontally-single",
+    ref,
+    icon: element$3
+  }));
+});
+HorizontallySingle.displayName = "HorizontallySingle";
+var element$2 = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M1.9999 1.89941C1.66853 1.89941 1.3999 2.16804 1.3999 2.49941 1.3999 2.83078 1.66853 3.09941 1.9999 3.09941H13.9999C14.3313 3.09941 14.5999 2.83078 14.5999 2.49941 14.5999 2.16804 14.3313 1.89941 13.9999 1.89941H1.9999zM1.9999 5.56641C1.66853 5.56641 1.3999 5.83504 1.3999 6.16641 1.3999 6.49778 1.66853 6.76641 1.9999 6.76641H11.3332C11.6646 6.76641 11.9332 6.49778 11.9332 6.16641 11.9332 5.83504 11.6646 5.56641 11.3332 5.56641H1.9999zM1.3999 9.8334C1.3999 9.50203 1.66853 9.2334 1.9999 9.2334H13.9999C14.3313 9.2334 14.5999 9.50203 14.5999 9.8334 14.5999 10.1648 14.3313 10.4334 13.9999 10.4334H1.9999C1.66853 10.4334 1.3999 10.1648 1.3999 9.8334zM1.9999 12.9004C1.66853 12.9004 1.3999 13.169 1.3999 13.5004 1.3999 13.8318 1.66853 14.1004 1.9999 14.1004H11.3332C11.6646 14.1004 11.9332 13.8318 11.9332 13.5004 11.9332 13.169 11.6646 12.9004 11.3332 12.9004H1.9999z" } }] }, LeftJustifyingSingle = forwardRef(function(props, ref) {
+  return createElement(IconBase, Object.assign({}, props, {
+    id: "left-justifying-single",
+    ref,
+    icon: element$2
+  }));
+});
+LeftJustifyingSingle.displayName = "LeftJustifyingSingle";
+var element$1 = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M1.9999 1.89941C1.66853 1.89941 1.3999 2.16804 1.3999 2.49941 1.3999 2.83078 1.66853 3.09941 1.9999 3.09941H13.9999C14.3313 3.09941 14.5999 2.83078 14.5999 2.49941 14.5999 2.16804 14.3313 1.89941 13.9999 1.89941H1.9999zM4.66665 5.56641C4.33528 5.56641 4.06665 5.83504 4.06665 6.16641 4.06665 6.49778 4.33528 6.76641 4.66665 6.76641H14C14.3314 6.76641 14.6 6.49778 14.6 6.16641 14.6 5.83504 14.3314 5.56641 14 5.56641H4.66665zM1.3999 9.8334C1.3999 9.50203 1.66853 9.2334 1.9999 9.2334H13.9999C14.3313 9.2334 14.5999 9.50203 14.5999 9.8334 14.5999 10.1648 14.3313 10.4334 13.9999 10.4334H1.9999C1.66853 10.4334 1.3999 10.1648 1.3999 9.8334zM4.66665 12.9004C4.33528 12.9004 4.06665 13.169 4.06665 13.5004 4.06665 13.8318 4.33528 14.1004 4.66665 14.1004H14C14.3314 14.1004 14.6 13.8318 14.6 13.5004 14.6 13.169 14.3314 12.9004 14 12.9004H4.66665z" } }] }, RightJustifyingSingle = forwardRef(function(props, ref) {
+  return createElement(IconBase, Object.assign({}, props, {
+    id: "right-justifying-single",
+    ref,
+    icon: element$1
+  }));
+});
+RightJustifyingSingle.displayName = "RightJustifyingSingle";
+var element = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M4.96372 2.59116C5.19803 2.35684 5.19803 1.97695 4.96372 1.74263 4.7294 1.50832 4.3495 1.50832 4.11519 1.74263L2.53945 3.31837 1.96372 2.74263C1.7294 2.50832 1.3495 2.50832 1.11519 2.74263.880874 2.97695.880874 3.35684 1.11519 3.59116L2.11519 4.59116C2.3495 4.82547 2.7294 4.82547 2.96372 4.59116L4.96372 2.59116zM14.4605 2.56689H6.8981C6.56672 2.56689 6.2981 2.83552 6.2981 3.16689 6.2981 3.49827 6.56672 3.76689 6.8981 3.76689H14.4605C14.7918 3.76689 15.0605 3.49827 15.0605 3.16689 15.0605 2.83552 14.7918 2.56689 14.4605 2.56689zM6.8981 7.2334C6.56672 7.2334 6.2981 7.50203 6.2981 7.8334 6.2981 8.16477 6.56672 8.4334 6.8981 8.4334H14.4605C14.7918 8.4334 15.0605 8.16477 15.0605 7.8334 15.0605 7.50203 14.7918 7.2334 14.4605 7.2334H6.8981zM6.2981 12.4999C6.2981 12.1685 6.56672 11.8999 6.8981 11.8999H14.4605C14.7918 11.8999 15.0605 12.1685 15.0605 12.4999 15.0605 12.8313 14.7918 13.0999 14.4605 13.0999H6.8981C6.56672 13.0999 6.2981 12.8313 6.2981 12.4999z" } }, { tag: "path", attrs: { fill: "currentColor", d: "M2.87279 5.8999C1.80504 5.8999.939453 6.76549.939453 7.83324.939453 8.90099 1.80504 9.76657 2.87279 9.76657 3.94054 9.76657 4.80612 8.90099 4.80612 7.83324 4.80612 6.76549 3.94054 5.8999 2.87279 5.8999zM2.13945 7.83324C2.13945 7.42823 2.46778 7.0999 2.87279 7.0999 3.2778 7.0999 3.60612 7.42823 3.60612 7.83324 3.60612 8.23824 3.2778 8.56657 2.87279 8.56657 2.46778 8.56657 2.13945 8.23824 2.13945 7.83324zM.939453 12.5002C.939453 11.4325 1.80504 10.5669 2.87279 10.5669 3.94054 10.5669 4.80612 11.4325 4.80612 12.5002 4.80612 13.568 3.94054 14.4336 2.87279 14.4336 1.80504 14.4336.939453 13.568.939453 12.5002zM2.87279 11.7669C2.46778 11.7669 2.13945 12.0952 2.13945 12.5002 2.13945 12.9052 2.46778 13.2336 2.87279 13.2336 3.2778 13.2336 3.60612 12.9052 3.60612 12.5002 3.60612 12.0952 3.2778 11.7669 2.87279 11.7669z", fillRule: "evenodd", clipRule: "evenodd" } }] }, TodoList = forwardRef(function(props, ref) {
+  return createElement(IconBase, Object.assign({}, props, {
+    id: "todo-list",
+    ref,
+    icon: element
+  }));
+});
+TodoList.displayName = "TodoList";
+const COMPONENT_PREFIX = "UI_PLUGIN_DOCS", COLOR_PICKER_COMPONENT = `${COMPONENT_PREFIX}_COLOR_PICKER_COMPONENT`, FONT_FAMILY_COMPONENT = `${COMPONENT_PREFIX}_FONT_FAMILY_COMPONENT`, FONT_FAMILY_ITEM_COMPONENT = `${COMPONENT_PREFIX}_FONT_FAMILY_ITEM_COMPONENT`, FONT_SIZE_COMPONENT = `${COMPONENT_PREFIX}_FONT_SIZE_COMPONENT`, COLLAB_CURSOR_LABEL_HEIGHT = 18, COLLAB_CURSOR_LABEL_MAX_WIDTH = 200, COLLAB_CURSOR_LABEL_TEXT_PADDING_LR = 6, COLLAB_CURSOR_LABEL_TEXT_PADDING_TB = 4;
 function drawBubble(ctx, props) {
   let { radius, width, height } = props;
   radius = radius != null ? radius : 0, width = width != null ? width : 30, height = height != null ? height : 30;
@@ -914,10 +1089,10 @@ const _TextBubbleShape = class _TextBubbleShape extends Shape {
     const offsetX = COLLAB_CURSOR_LABEL_TEXT_PADDING_LR, offsetY = COLLAB_CURSOR_LABEL_HEIGHT - COLLAB_CURSOR_LABEL_TEXT_PADDING_TB, maxTextWidth = COLLAB_CURSOR_LABEL_MAX_WIDTH - 2 * COLLAB_CURSOR_LABEL_TEXT_PADDING_LR;
     if (textWidth > maxTextWidth) {
       let truncatedText = "", currentWidth = 0;
-      for (const element of text) {
-        const charWidth = ctx.measureText(element).width;
+      for (const element2 of text) {
+        const charWidth = ctx.measureText(element2).width;
         if (currentWidth + charWidth <= maxTextWidth - ctx.measureText("...").width)
-          truncatedText += element, currentWidth += charWidth;
+          truncatedText += element2, currentWidth += charWidth;
         else {
           truncatedText += "...";
           break;
@@ -934,7 +1109,32 @@ const _TextBubbleShape = class _TextBubbleShape extends Shape {
 };
 __name(_TextBubbleShape, "TextBubbleShape");
 let TextBubbleShape = _TextBubbleShape;
-const COMPONENT_DOC_HEADER_FOOTER_PANEL = "COMPONENT_DOC_HEADER_FOOTER_PANEL", panel = "univer-panel", optionsSection = "univer-options-section", optionsFormItem = "univer-options-form-item", optionsInput = "univer-options-input", optionsMarginSetting = "univer-options-margin-setting", styles = {
+const COMPONENT_DOC_HEADER_FOOTER_PANEL = "COMPONENT_DOC_HEADER_FOOTER_PANEL";
+var jsxRuntime = { exports: {} }, reactJsxRuntime_production_min = {};
+/**
+ * @license React
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var f = require$$0__default, k = Symbol.for("react.element"), l = Symbol.for("react.fragment"), m = Object.prototype.hasOwnProperty, n = f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, p = { key: !0, ref: !0, __self: !0, __source: !0 };
+function q(c, a, g) {
+  var b, d = {}, e = null, h = null;
+  g !== void 0 && (e = "" + g), a.key !== void 0 && (e = "" + a.key), a.ref !== void 0 && (h = a.ref);
+  for (b in a) m.call(a, b) && !p.hasOwnProperty(b) && (d[b] = a[b]);
+  if (c && c.defaultProps) for (b in a = c.defaultProps, a) d[b] === void 0 && (d[b] = a[b]);
+  return { $$typeof: k, type: c, key: e, ref: h, props: d, _owner: n.current };
+}
+__name(q, "q");
+reactJsxRuntime_production_min.Fragment = l;
+reactJsxRuntime_production_min.jsx = q;
+reactJsxRuntime_production_min.jsxs = q;
+jsxRuntime.exports = reactJsxRuntime_production_min;
+var jsxRuntimeExports = jsxRuntime.exports;
+const panel = "univer-panel", optionsSection = "univer-options-section", optionsFormItem = "univer-options-form-item", optionsInput = "univer-options-input", optionsMarginSetting = "univer-options-margin-setting", styles$5 = {
   panel,
   optionsSection,
   optionsFormItem,
@@ -942,12 +1142,12 @@ const COMPONENT_DOC_HEADER_FOOTER_PANEL = "COMPONENT_DOC_HEADER_FOOTER_PANEL", p
   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 _a19;
+    var _a23;
     setOptions((prev) => ({
       ...prev,
       [type]: val ? BooleanNumber.TRUE : BooleanNumber.FALSE
     }));
-    const docDataModel = univerInstanceService.getUniverDocInstance(unitId), documentStyle = docDataModel == null ? void 0 : docDataModel.getSnapshot().documentStyle, docSkeletonManagerService = (_a19 = renderManagerService.getRenderById(unitId)) == null ? void 0 : _a19.with(DocSkeletonManagerService), viewModel = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getViewModel();
+    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();
     if (documentStyle == null || viewModel == null)
       return;
     const editArea = viewModel.getEditArea();
@@ -979,19 +1179,24 @@ const COMPONENT_DOC_HEADER_FOOTER_PANEL = "COMPONENT_DOC_HEADER_FOOTER_PANEL", p
       headerFooterProps: {
         [type]: val
       }
-    }), textSelectionRenderService.removeAllTextRanges(), textSelectionRenderService.blur();
+    }), textSelectionRenderService.removeAllRanges(), textSelectionRenderService.blur();
   }, "handleMarginChange"), closeHeaderFooter = /* @__PURE__ */ __name(() => {
-    var _a19;
+    var _a23;
     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(), render = renderManagerService.getRenderById(unitId);
-    render == null || viewModel == null || skeleton == null || (textSelectionManagerService.replaceTextRanges([]), transformer.clearSelectedObjects(), textSelectionRenderService.setSegment(""), textSelectionRenderService.setSegmentPage(-1), viewModel.setEditArea(DocumentEditArea.BODY), skeleton.calculate(), (_a19 = render.mainComponent) == null || _a19.makeDirty(!0));
+    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));
   }, "closeHeaderFooter");
   return useEffect(() => {
     const docDataModel = univerInstanceService.getUniverDocInstance(unitId), documentStyle = docDataModel == null ? void 0 : docDataModel.getSnapshot().documentStyle;
     if (documentStyle) {
-      const { marginHeader, marginFooter, useFirstPageHeaderFooter, evenAndOddHeaders } = documentStyle;
+      const {
+        marginHeader = 0,
+        marginFooter = 0,
+        useFirstPageHeaderFooter = BooleanNumber.FALSE,
+        evenAndOddHeaders = BooleanNumber.FALSE
+      } = documentStyle;
       setOptions({
         marginHeader,
         marginFooter,
@@ -999,9 +1204,9 @@ const COMPONENT_DOC_HEADER_FOOTER_PANEL = "COMPONENT_DOC_HEADER_FOOTER_PANEL", p
         evenAndOddHeaders
       });
     }
-  }, [unitId]), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles.options, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles.optionsSection, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles.optionsFormItem, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+  }, [unitId]), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$5.options, children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$5.optionsSection, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$5.optionsFormItem, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
         Checkbox,
         {
           checked: options.useFirstPageHeaderFooter === BooleanNumber.TRUE,
@@ -1011,7 +1216,7 @@ const COMPONENT_DOC_HEADER_FOOTER_PANEL = "COMPONENT_DOC_HEADER_FOOTER_PANEL", p
           children: localeService.t("headerFooter.firstPageCheckBox")
         }
       ) }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles.optionsFormItem, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$5.optionsFormItem, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
         Checkbox,
         {
           checked: options.evenAndOddHeaders === BooleanNumber.TRUE,
@@ -1022,8 +1227,8 @@ const COMPONENT_DOC_HEADER_FOOTER_PANEL = "COMPONENT_DOC_HEADER_FOOTER_PANEL", p
         }
       ) })
     ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: clsx(styles.optionsSection, styles.optionsMarginSetting), children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles.optionsMarginItem, children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: clsx(styles$5.optionsSection, styles$5.optionsMarginSetting), children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$5.optionsMarginItem, children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: localeService.t("headerFooter.headerTopMargin") }),
         /* @__PURE__ */ jsxRuntimeExports.jsx(
           InputNumber,
@@ -1035,11 +1240,11 @@ const COMPONENT_DOC_HEADER_FOOTER_PANEL = "COMPONENT_DOC_HEADER_FOOTER_PANEL", p
             onChange: /* @__PURE__ */ __name((val) => {
               handleMarginChange(val, "marginHeader");
             }, "onChange"),
-            className: styles.optionsInput
+            className: styles$5.optionsInput
           }
         )
       ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles.optionsMarginItem, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$5.optionsMarginItem, children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: localeService.t("headerFooter.footerBottomMargin") }),
         /* @__PURE__ */ jsxRuntimeExports.jsx(
           InputNumber,
@@ -1051,16 +1256,16 @@ const COMPONENT_DOC_HEADER_FOOTER_PANEL = "COMPONENT_DOC_HEADER_FOOTER_PANEL", p
             onChange: /* @__PURE__ */ __name((val) => {
               handleMarginChange(val, "marginFooter");
             }, "onChange"),
-            className: styles.optionsInput
+            className: styles$5.optionsInput
           }
         )
       ] })
     ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles.optionsSection, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { onClick: closeHeaderFooter, children: localeService.t("headerFooter.closeHeaderFooter") }) })
+    /* @__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 _a19;
-  const localeService = useDependency(LocaleService), renderManagerService = useDependency(IRenderManagerService), unitId = useDependency(IUniverInstanceService).getCurrentUniverDocInstance().getUnitId(), viewModel = ((_a19 = renderManagerService.getRenderById(unitId)) == null ? void 0 : _a19.with(DocSkeletonManagerService)).getViewModel(), [isEditHeaderFooter, setIsEditHeaderFooter] = useState(!0);
+  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);
   return useEffect(() => {
     const editArea = viewModel.getEditArea();
     setIsEditHeaderFooter(editArea !== DocumentEditArea.BODY);
@@ -1070,35 +1275,13 @@ const COMPONENT_DOC_HEADER_FOOTER_PANEL = "COMPONENT_DOC_HEADER_FOOTER_PANEL", p
     return () => {
       subscription.unsubscribe();
     };
-  }, []), /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles.panel, children: isEditHeaderFooter ? /* @__PURE__ */ jsxRuntimeExports.jsx(DocHeaderFooterOptions, { unitId }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles.panelDisableText, children: localeService.t("headerFooter.disableText") }) });
-}, "DocHeaderFooterPanel"), SidebarDocHeaderFooterPanelOperation = {
-  id: "sidebar.operation.doc-header-footer-panel",
-  type: CommandType.COMMAND,
-  handler: /* @__PURE__ */ __name(async (accessor, params) => {
-    const sidebarService = accessor.get(ISidebarService), localeService = accessor.get(LocaleService);
-    switch (params.value) {
-      case "open":
-        sidebarService.open({
-          header: { title: localeService.t("headerFooter.panel") },
-          children: { label: COMPONENT_DOC_HEADER_FOOTER_PANEL },
-          onClose: /* @__PURE__ */ __name(() => {
-          }, "onClose"),
-          width: 400
-        });
-        break;
-      case "close":
-      default:
-        sidebarService.close();
-        break;
-    }
-    return !0;
-  }, "handler")
-};
-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--)
+  }, []), /* @__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--)
     (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");
+  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");
 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) {
@@ -1159,14 +1342,7 @@ let DocHeaderFooterController = (_a5 = class extends Disposable {
     this._context = _context, this._commandService = _commandService, this._editorService = _editorService, this._instanceSrv = _instanceSrv, this._renderManagerService = _renderManagerService, this._docSkeletonManagerService = _docSkeletonManagerService, this._textSelectionRenderManager = _textSelectionRenderManager, this._localeService = _localeService, this._componentManager = _componentManager, this._initialize();
   }
   _initialize() {
-    this._context.unit.getSnapshot().documentStyle.documentFlavor === DocumentFlavor.TRADITIONAL && (this._init(), this._drawHeaderFooterLabel(), this._registerCommands(), this._initCustomComponents());
-  }
-  _registerCommands() {
-    [
-      CoreHeaderFooterCommand,
-      OpenHeaderFooterPanelCommand,
-      SidebarDocHeaderFooterPanelOperation
-    ].forEach((command) => this.disposeWithMe(this._commandService.registerCommand(command)));
+    this._context.unit.getSnapshot().documentStyle.documentFlavor === DocumentFlavor.TRADITIONAL && (this._init(), this._drawHeaderFooterLabel(), this._initCustomComponents());
   }
   _initCustomComponents() {
     const componentManager = this._componentManager;
@@ -1296,16 +1472,39 @@ let DocHeaderFooterController = (_a5 = class extends Disposable {
     return this._context.unit;
   }
 }, __name(_a5, "DocHeaderFooterController"), _a5);
-DocHeaderFooterController = __decorateClass$d([
-  __decorateParam$d(1, ICommandService),
-  __decorateParam$d(2, IEditorService),
-  __decorateParam$d(3, IUniverInstanceService),
-  __decorateParam$d(4, IRenderManagerService),
-  __decorateParam$d(5, Inject(DocSkeletonManagerService)),
-  __decorateParam$d(6, ITextSelectionRenderManager),
-  __decorateParam$d(7, Inject(LocaleService)),
-  __decorateParam$d(8, Inject(ComponentManager))
+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);
+const SidebarDocHeaderFooterPanelOperation = {
+  id: "sidebar.operation.doc-header-footer-panel",
+  type: CommandType.OPERATION,
+  handler: /* @__PURE__ */ __name(async (accessor, params) => {
+    const sidebarService = accessor.get(ISidebarService), localeService = accessor.get(LocaleService);
+    switch (params.value) {
+      case "open":
+        sidebarService.open({
+          header: { title: localeService.t("headerFooter.panel") },
+          children: { label: COMPONENT_DOC_HEADER_FOOTER_PANEL },
+          onClose: /* @__PURE__ */ __name(() => {
+          }, "onClose"),
+          width: 400
+        });
+        break;
+      case "close":
+      default:
+        sidebarService.close();
+        break;
+    }
+    return !0;
+  }, "handler")
+};
 function getEmptyHeaderFooterBody() {
   return {
     dataStream: `\r
@@ -1387,8 +1586,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 _a19;
-    const commandService = accessor.get(ICommandService), univerInstanceService = accessor.get(IUniverInstanceService), renderManagerService = accessor.get(IRenderManagerService), { unitId, segmentId, createType, headerFooterProps } = params, docSkeletonManagerService = (_a19 = renderManagerService.getRenderById(unitId)) == null ? void 0 : _a19.with(DocSkeletonManagerService), docDataModel = univerInstanceService.getUniverDocInstance(unitId), docViewModel = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getViewModel();
+    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();
     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 = [{
@@ -1424,55 +1623,334 @@ const CoreHeaderFooterCommandId = "doc.command.core-header-footer", CoreHeaderFo
   id: "doc.command.open-header-footer-panel",
   type: CommandType.COMMAND,
   handler: /* @__PURE__ */ __name(async (accessor, _params) => accessor.get(ICommandService).executeCommand(SidebarDocHeaderFooterPanelOperation.id, { value: "open" }), "handler")
-};
-function BoldMenuItemFactory(accessor) {
-  const commandService = accessor.get(ICommandService);
-  return {
-    id: SetInlineFormatBoldCommand.id,
-    group: MenuGroup.TOOLBAR_FORMAT,
-    type: MenuItemType.BUTTON,
-    icon: "BoldSingle",
-    title: "Set bold",
-    tooltip: "toolbar.bold",
-    positions: [MenuPosition.TOOLBAR_START],
-    activated$: new Observable((subscriber) => {
-      const disposable = commandService.onCommandExecuted((c) => {
-        var _a19;
-        const id = c.id;
-        if (id === SetTextSelectionsOperation.id || id === SetInlineFormatCommand.id) {
-          const textRun = getFontStyleAtCursor(accessor);
-          if (textRun == null)
-            return;
-          const bl = (_a19 = textRun.ts) == null ? void 0 : _a19.bl;
-          subscriber.next(bl === BooleanNumber.TRUE);
-        }
-      });
-      return subscriber.next(!1), disposable.dispose;
-    }),
-    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
-  };
-}
-__name(BoldMenuItemFactory, "BoldMenuItemFactory");
-function ItalicMenuItemFactory(accessor) {
-  const commandService = accessor.get(ICommandService);
-  return {
-    id: SetInlineFormatItalicCommand.id,
-    group: MenuGroup.TOOLBAR_FORMAT,
-    type: MenuItemType.BUTTON,
-    icon: "ItalicSingle",
-    title: "Set italic",
-    tooltip: "toolbar.italic",
-    positions: [MenuPosition.TOOLBAR_START],
-    activated$: new Observable((subscriber) => {
-      const disposable = commandService.onCommandExecuted((c) => {
-        var _a19;
-        const id = c.id;
-        if (id === SetTextSelectionsOperation.id || id === SetInlineFormatCommand.id) {
-          const textRun = getFontStyleAtCursor(accessor);
-          if (textRun == null)
-            return;
-          const it = (_a19 = textRun.ts) == null ? void 0 : _a19.it;
-          subscriber.next(it === BooleanNumber.TRUE);
+}, docCountBar = "univer-doc-count-bar", styles$4 = {
+  docCountBar
+}, 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;
+    if (!documentDataModel) return 100;
+    const currentZoom = ((_b = (_a23 = documentDataModel.getSettings()) == null ? void 0 : _a23.zoomRatio) != null ? _b : 1) * 100;
+    return Math.round(currentZoom);
+  }, [documentDataModel]), [zoom, setZoom] = useState(() => getCurrentZoom());
+  useEffect(() => (setZoom(getCurrentZoom()), commandService.onCommandExecuted((commandInfo) => {
+    if (commandInfo.id === SetDocZoomRatioOperation.id) {
+      const currentZoom = getCurrentZoom();
+      setZoom(currentZoom);
+    }
+  }).dispose), [commandService, getCurrentZoom]);
+  function handleChange(value) {
+    if (setZoom(value), documentDataModel == null)
+      return;
+    const zoomRatio = value / 100;
+    commandService.executeCommand(SetDocZoomRatioOperation.id, {
+      unitId: documentDataModel.getUnitId(),
+      zoomRatio
+    });
+  }
+  return __name(handleChange, "handleChange"), /* @__PURE__ */ jsxRuntimeExports.jsx(
+    Slider,
+    {
+      min: DOC_ZOOM_RANGE[0],
+      value: zoom,
+      shortcuts: ZOOM_MAP,
+      onChange: handleChange
+    }
+  );
+}
+__name(ZoomSlider, "ZoomSlider");
+function CountBar(props) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("section", { className: styles$4.docCountBar, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ZoomSlider, {}) });
+}
+__name(CountBar, "CountBar");
+const docFooterContainer = "univer-doc-footer-container", styles$3 = {
+  docFooterContainer
+}, DocFooter = /* @__PURE__ */ __name(() => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$3.docFooterContainer, children: [
+  /* @__PURE__ */ jsxRuntimeExports.jsx("div", {}),
+  /* @__PURE__ */ jsxRuntimeExports.jsx(CountBar, {})
+] }), "DocFooter"), BoldShortCut = {
+  id: SetInlineFormatBoldCommand.id,
+  binding: KeyCode.B | MetaKeys.CTRL_COMMAND,
+  preconditions: whenDocAndEditorFocused
+}, ItalicShortCut = {
+  id: SetInlineFormatItalicCommand.id,
+  binding: KeyCode.I | MetaKeys.CTRL_COMMAND,
+  preconditions: whenDocAndEditorFocused
+}, UnderlineShortCut = {
+  id: SetInlineFormatUnderlineCommand.id,
+  binding: KeyCode.U | MetaKeys.CTRL_COMMAND,
+  preconditions: whenDocAndEditorFocused
+}, StrikeThroughShortCut = {
+  id: SetInlineFormatStrikethroughCommand.id,
+  binding: KeyCode.X | MetaKeys.SHIFT | MetaKeys.CTRL_COMMAND,
+  preconditions: whenDocAndEditorFocused
+}, SubscriptShortCut = {
+  id: SetInlineFormatSubscriptCommand.id,
+  binding: KeyCode.COMMA | MetaKeys.CTRL_COMMAND,
+  preconditions: whenDocAndEditorFocused
+}, SuperscriptShortCut = {
+  id: SetInlineFormatSuperscriptCommand.id,
+  binding: KeyCode.PERIOD | MetaKeys.CTRL_COMMAND,
+  preconditions: whenDocAndEditorFocused
+}, AlignLeftShortCut = {
+  id: AlignLeftCommand.id,
+  binding: KeyCode.L | MetaKeys.CTRL_COMMAND | MetaKeys.SHIFT,
+  preconditions: whenDocAndEditorFocused
+}, AlignRightShortCut = {
+  id: AlignRightCommand.id,
+  binding: KeyCode.R | MetaKeys.CTRL_COMMAND | MetaKeys.SHIFT,
+  preconditions: whenDocAndEditorFocused
+}, AlignCenterShortCut = {
+  id: AlignCenterCommand.id,
+  binding: KeyCode.E | MetaKeys.CTRL_COMMAND | MetaKeys.SHIFT,
+  preconditions: whenDocAndEditorFocused
+}, AlignJustifyShortCut = {
+  id: AlignJustifyCommand.id,
+  binding: KeyCode.J | MetaKeys.CTRL_COMMAND | MetaKeys.SHIFT,
+  preconditions: whenDocAndEditorFocused
+}, OrderListShortCut = {
+  id: OrderListCommand.id,
+  binding: KeyCode.Digit7 | MetaKeys.CTRL_COMMAND | MetaKeys.SHIFT,
+  preconditions: whenDocAndEditorFocused
+}, BulletListShortCut = {
+  id: BulletListCommand.id,
+  binding: KeyCode.Digit8 | MetaKeys.CTRL_COMMAND | MetaKeys.SHIFT,
+  preconditions: whenDocAndEditorFocused
+}, TabShortCut = {
+  id: TabCommand.id,
+  binding: KeyCode.TAB,
+  preconditions: whenDocAndEditorFocused
+}, ShiftTabShortCut = {
+  id: TabCommand.id,
+  binding: KeyCode.TAB | MetaKeys.SHIFT,
+  preconditions: whenDocAndEditorFocused,
+  staticParameters: {
+    shift: !0
+  }
+}, docListTypePicker = "univer-doc-list-type-picker", docListTypePickerItem = "univer-doc-list-type-picker-item", docListTypePickerItemActive = "univer-doc-list-type-picker-item-active", styles$2 = {
+  docListTypePicker,
+  docListTypePickerItem,
+  docListTypePickerItemActive
+}, ListTypePicker = /* @__PURE__ */ __name((props) => {
+  const { value, onChange, options } = props;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$2.docListTypePicker, children: options.map((item) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "img",
+    {
+      className: styles$2.docListTypePickerItem + (value === item.value ? ` ${styles$2.docListTypePickerItemActive}` : ""),
+      onClick: /* @__PURE__ */ __name(() => {
+        onChange(item.value);
+      }, "onClick"),
+      src: item.img
+    },
+    item.value
+  )) });
+}, "ListTypePicker"), orderListOptions = [
+  {
+    value: PresetListType.ORDER_LIST,
+    img: "data:image/jpeg;base64,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"
+  },
+  {
+    value: PresetListType.ORDER_LIST_1,
+    img: "data:image/jpeg;base64,/9j/4AAQSkZJRgABAgEA2ADYAAD/2wCEAAEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAf/CABEIAPQA2AMBEQACEQEDEQH/xAAyAAEAAgMBAQEAAAAAAAAAAAAABwkGCAoFAwQBAQADAQAAAAAAAAAAAAAAAAACAwQB/9oADAMBAAIQAxAAAADv4AAAAAAAAAAAAAAAAAAAAAAAAAAAABB8+ThDoAAAAAAAAAAAqz0V6b2Q8ProwxXgAAAAAAAAAAD4HNNuzyjHt82S7Ked1gPIAAAAAAABlxsQAAcz+7PlvO9F2K/6mJHwAAAAAAAB+0ycAAg2cdIrY2n57AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABh/eZhzoAAAAAAAAAAAA50dtHRdivAAAAAAAAAAA11nGlnVVJkexTLnR1ivxggoAAAAAycnUAAAAqZ0V6sWQ0NuhuPVPo4xX+YYIAAAAAeoZ0AAAARLLlQOmqwmmem1kbmM1oAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGId5X1dDSa2HQbjvAAAAAAAAAAAHmFS2mrUGyPR1ivx8h0AAyEmEAAAAAAAHh9c+Wyjzjo6xX+KRiAAe0ScAAAAAAAD8ZofdDSy2F5+S4AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACI5co5103P5battFd5mS4AAAAAAAAAACn7TVaznt5wNufK+d6PMV/wCIiQAAAAAAAHtEnAAgiceeLZT0m4r6CtdPR5iv88g0AAAAAAAGQkwgApU1Uw1Lli9Nlbt1fQ3jvAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAH/8QAKRAAAAYCAQQCAgIDAAAAAAAAAAUGBwgXBAkDAQIKFhVAIGAwODY5UP/aAAgBAQABCAD/ALTfSSZF03SeJkkL9jYTs+T8I1I3jJonRjMma0p3J2TI6a+zPNy4ObQNdmxJNfY6YuN0ye/N6aH/AO7O/IeTqSYRhqhcBQcyGN81QIlHHxkFAoD7hPjvh4fZFEPZFEPZFEPZFEPZFEPZFEPZFEPZFEPZFEPZFEPZFEPZFEPZFEPZFEPZFEPZFEEKdnOYqivHy/x0P/3Z35DyJO7JexCwY19pbg4ODF4OHGxhkoVK5mRkZeRXiPFeI8V4jxXiPFeI8V4jxXiPFeI8V4jxXiPFeI8V4jxXiPFeI8V4jxXiPBcjU2VZnDn4H4tLGlh2JVLurZoEfBp0FTtEX8/5CfqyMcNAOPhmxi3n2isz5NeG9rkb4v8Ary2Xb4tpG93FrGls9Uc/H1bcjd2XOn+U8nDZ65xa8Jg+Qpz9EEYapH/LQsjHMKk2ZZ+BYawFhrAWGsBYawFhrAWGsBYawFhrAWGsBYawFhrAI1ZKQ1UhbgZ/8O7Ka7nQI1+Oc+TLtrpLYxdtUnHZmP4/fYwfDs62t4cXd1nbyv3NHThCJOg5Kcc8Lckry6oToqhOiqE6KoToqhOiqE6KoToqhOiqE6KoToqhOgmb4mIzLGNMT+F9WLaiS7SrhjHwRfj5Q9S2AXIo+YSAkaIyvm8cgWVipEx+VtsmldsRlx+3uCrOqBQS3XXTWFsA49oEbFW8xzqnXB3E6Zc1NQy7+wd5XLgkxvm4+j6Zj2zygen5AyB2B9ORn98unR6CUKo2yCMhzzTEtdRC11ELXUQtdRC11EEq4JyeH2AV5f0FP/jahHi4/wCqJIib3d1e/wAgXVIyxUFCT/PE+YUioRUIqEVCKhCebj4E4wzb6Jjh9piX5xf3674NIzWjFnHjukdVTGu04kiZp7QpK/rr7Ps00ZmmWz5PlweQVhGqbuZNRdlKx8yWXSr+x610SBdxr5wzZ1gyO+vtqgY9uwTshs2CPNTVHNojDA6OPG5w+A6LtmLutvsy6UZuj0vSRIgZZnx5dn54t4W8LeFvC3hbwt4W8LeFvC3hbwt4W8LeFvBPOP8APHGGU/jJeSjOxEZNdSCfkqaicW+3nJl1IVomibRhG0RjOM5tn6cbqbZNFzCkIN8TkzyozweGqFEKoUQqhRCqFEKoUQqhRCqFEKoUQqhRCqFEKoUQqhRCqFEKoUQqhRCqFEEq3xyRn2AaZf4boNaL77NUKwbctTxRE8hXg4uPh4YNtfPdpyRyu2euvkr5p27O5cbQsz9m/8QAPhAAAQQBAgMGBAMFBQkAAAAABAIDBQYBAAcIEhMRFJSl1NUVldPlCSFAICIjM2AWJDBZtxAXMkFQVVe0tf/aAAgBAQAJPwD/AK1fgJrdjYEyuhbvUN2OnYawU1dtCIkqwWSLOxcYmUiZ0AZ0yLnIJyUhix8suNHqSQPl39RsNvDxPcVO+EHKSeymy21sEp0ObzHnpiXJK42zlMXWK4FIuN/EzwIOwFhi8xhIQscgiRGtkHKXbh04h4bbSNo9VhKpHVHa2TElt1YO606qy9fjWZSywEfMVIUCMl7POWeSJEjWTPiz7ppZBOfhlF30n1cAXFehD2AYyWq16NxNbU2OXwwO7ksqrySp60GHP5SS4JtlU4NL/cVLSz+oHYwY4w2K4XhpvBKxmXHXWh1v4T1VMNOvvONtZXltDjzq0pwpxec/5ily/wBWuJDSktStC3j2Ot1ZJx+T4k6u6sVXvIi+dOWiURFolsYcThzOGlOp5MYVlxCOlIzdWr8ue3ytI6ZslEiGFI5GHXmEcj7zieVl51pPZ2NuuIxhWdTcu0y1LyTTTTUkY22222Y8lDbaEvYShCE4wlCE4wlKcYxjGMY1PzXzQ76+p+a+aHfX1PzXzQ76+p+a+aHfX1PzXzQ76+p+a+aHfX1PzXzQ76+p+a+aHfX1PzXzQ76+p+a+aHfX1PzXzQ76+p+a+aHfX1PzXzQ76+p+a+aHfX1PzXzQ76+p+a+aHfX1LyhQ7nfuowQeW+yvkjjFo52nXVIVyrSlaeZOeVSUqx2ZxjP7X+Ypcv8AVriQ0tb9440OMihxxYLGHHHB9qtuWXHdwbAS2ytp1kGuH3CozhhPeGFIjoyScZypbK1sMtDjDtNsDjsNoZYYYZRhtpllpvCW2mmm0pQ22hKUIQnCU4wnGMf7IvqEFPukPud+kUc7z7inXV8iDEoTzLUpXKhKUp7exKcYxjGojzCU9bqI8wlPW6iPMJT1uojzCU9bqI8wlPW6iPMJT1uojzCU9bqI8wlPW6iPMJT1uojzCU9bqI8wlPW6iPMJT1uojzCU9bqI8wlPW6iPMJT1uojzCU9bqN6BbHU6TvfD3eTqtLZc/hvFONK5mnFp/eRns7e3HYrGM4/Z2wrNBte/d0J3E3inIFghk7cG7GSM3LFWSfU+S+h6RfkrJOGLWwhhvL0mTnDeMKThM7t7J1vbfamM2U4KqLSpezS8nTK7OInHN075uQ3P1WvxsVe7CuWLiIoSqSNijEV2elAzz+8R4b5v9LXmn3yPgZ+Rqk6dTLNC2gOFtMQkdctWpYqDNOYjp+LQYIuRhzFsyISSh1EjNYfayr9UMqM4bfxdqGdeAgG0NiQVT4vdoAD82k6MZxleEqvcUoEuyuMISVNXPdaDWSpqPrwuMfp9q/8AfXv3D1ZaNqdtFnx0cJYLjKnhQ0YRKEystAhqhK6qRXaJ4PM1FlSUNCnxwBwx5QzqfxbuO/a/iTvMABapXbnhz3BA2q2Y2in5YQc9ijm0KoqZr90/smtTUXPPRJFbj5Y0Y5kUowZz4zI7iI3u3Z4H7pUh6fvyqGDg5nc7ai7iSDldet8fHJyMixxseDBSrh5RUlMnotbwExLTJ9ffnZbPTte1H4lOzsfEOIYQt1yKs7JVjngcvKdaV3WQVtxEimBcyWT2V8r60YZR26e6BbHc+k702neTqnisufw3kONK5mnFp/eRns7e3HYrGM4l/L4v0Wpfy+L9FqX8vi/Ral/L4v0Wpfy+L9FqX8vi/Ral/L4v0Wpfy+L9FqX8vi/Ral/L4v0Wpfy+L9FqS64j/fOq13MBrn6QBTzf8RkVt1PK62hX7q8dvZ2Z7U5zjP8AgiB53TNnaftxS7BJxzUxGUiSu8ooMm6FxJLTwEiTCxIsj8BGlUOQ6rQTBrlw5aOQTDSPGFxd8Tm49lp0bf7zulMcUtwqW2YLkpDNT0qXt7E1SSjIqt7dBjvOPxXfJiWGZikd7ZMEj1MhCWSfuGwcXCbSQ221rstlmblJ2SIhJOXiTJtu1WB4iXsEPJTQUmXW5Up51JlddinRl5EUxpCpWXtfFqjiZvkcKjrEQm2uw7IBklLGsuuIGQNKVo7cruLzrRGMPVo5tWE5U2Mfpb7Y5XR6ix1Noex0H2iEcinW3kY7VspwrmbV2pyrGOzOcKwbNeIB9u0bNeIB9u0bNeIB9u0bNeIB9u0bNeIB9u0bNeIB9u0bNeIB9u0bNeIB9u0bNeIB9u0bNeIB9u0bNeIB9u0TKOEC9bpoIeEWznrsOjr50tBMrz2IeVlPK4nsVhOc9uMZTn/BpcVuBtbuLDqhLXVpfDyRzRsEMGhliliOjnxUxDyYoUxAzkWUHLQc0ABLxRgkgGMQ3vnx27n7DxbrKheF/cLimsTvDzgcZ3Dwsc7RqfBU456MHcxnKQXLApl5KltlYfacWhVNfpNx3vq22tKtcFEmNh0CJq+0tajalSIamUsIQWKqoMXBxIIuR49OGXOllWG0c3Zih/2FLjYoLho4INu5G2026m0/YCCdeLsu5pDtMm7JDwE5uzMOOTQkS7JN2WsNWW91+TQuNkAHHf6vr1htuaXULLbMVSpApk7XZs1yGNmMV6sxq3h0SFhmu5/DYUFb7KS5IkZhTzeHMrTw7W3YePD3Ftu1ZNOusqm2RVsjYyKhy3ZuDnnqzUfjMUWLP5hZsVdeaYi5+PmYRB0rgJZapyYmK/tZNn8UXBvLT58nJku8OG68rHS81t61LTC+tIL23s1sjWMPNqIfmJ47cQ7HSCiMNtfqMpw+HGHlM5UnmTh0cV15vKk5/wCJOFoT2p/54/LR1ckdxZHczcarEk1avj1mJzE1mRDGi0IixnXmkPoaeXh57C+Z5XZnOMdmkuDm720viC4crh0kqbbm6xBRL5kOCY50VoeRE2DeNE40hC+qgkIPLqmmcoyvSGXCBe69NBCXFs565g46+dLTjK89iHlZTyuJ7FYTnPbjGU5ChfDne46ChfDne46ChfDne46ChfDne46ChfDne46GjGxyu9dRY7JaHsdAMghHIp015GO1bKcK5m1dqcqxjsznCsfoP+xy3/oEa/8AN28//wBmO0nviOG7Z7fbiYu7rXOQzCRlvj5qAr/eksN4wKUTaNsayNlJJKeRqbiiFMYQSKk/RHdO993/ALx0ev0+gUwT/K6rPNzdHk/mJ5ebm/Ps5c2Hyn7nqw+U/c9WHyn7nqw+U/c9WHyn7nqZ733TvH93+HdDqdcV8b+b357l5etz/wAtXNy8v5dvNj9AtTaDgyg1uJxjKm0lMLYUtOM/llScLyrGM/lnOPz/AC1erbuZW67ZrrfF2Obr7WLGQuxutSJoA0DVmTXj1jYE6YAkcMVInuLSwwO8QttpW2t72k3O4n7orafYnavc2sydKvW2fCjta/HRlSbs9RlRwJKBse4BcBByU7HSYOHVvVIOxAOqGtLynf6du0Tt7tft7ErmbRaJlbuWBWMutChhBBitESEvNS8gQLFQUFFCmS85LmBRUUEWeWww5+GP+I/YuFNLGZVXEQBsyC5COVMdt12QuwkUxMlRD1SEZHfK+OO3MaPSIhKziI8leREXUW87b21D7Ysg2OTHycRLgKS1MVqyQxzbMhB2OEJVgeSjTGkqxzMmCOlxpgJpO49p3SnNrZQTiJ4VtzdxbAdP3e6cN25OY0pymyk7NkLlLOVtJKTMRX/jLiijDj3LUytTEVBRqMfp53b8Xh6oXFDTd2OK2p3KesEPJ3vbisnxQuYGsBxFYsEdYjM12UvmcQtjMhIp6Yerz6zMKYySCbXqNQKHWyJCSkDHQK/VqjUq1GqfJJIdXkWMhYKDiQ1LWrPdwo8EbP8AKZa7MRC4Lhc3a48txJrhujW4oqFis1QQ6cJcKr4Dw4YyIdirzVAr7fcRGmhTK8bEPchEU4KK60Gfu7NbucJt6ypbrTcvXJ1uHjKjHmYR2tlJYm95Z6TAbcwnLctHxjmcrS2jLGm+t3EIozpc/T6vdmHHun1OVfJz8nLz8i+Xt7eVXZ2Zr3m32zVe82+2ar3m32zVe82+2ar3m32zVe82+2ar3m32zVe82+2ar3m32zVe82+2ar3m32zVe82+2ar3m32zVe82+2ar3m32zVe82+2ahu6d77x/ePiPX6fQFfJ/ldxZ5ubo8n8xPLzc359nLn9i2jU3bXb+MwfMSTiFEnnlkPIEiK9X4xvOCJmyWGTeGioOJG/imHEtYWtgdL5DL9p4JvwpZAsKwUfh9r57YXEBxUwQhGDa7Z9yprAxDVep8w62PMBsZT8G+H4jV1av2UvMXu21TIXb7bLb6FYr9Pp9fYWxGQ0Ywtx5SEKecfLMMMLfJkZWVkSS5WZlSzZaWNNkjSinsNGWat727qcQ9hGxlayIyq7dIoNuANU0w8hxI0gxtrd/476UsJehEpx3lHemE6UhLxseaI0p3KsNpcJGcZQpzKUrVhGFLxleUoWrCe3OEqz+WTYXxB3t2jYXxB3t2jYXxB3t2jYXxB3t2jYXxB3t2jYXxB3t2jYXxB3t2jYXxB3t2jYXxB3t2jYXxB3t2jYXxB3t2jYXxB3t2jYXxB3t2jYXxB3t2jYXxB3t2jYXxB3t2iYxwcXvXUQO8Wt7PXDIHRyJdCZRnsW8nKuZxPYnCs47c4wnP7G+FG2nqW124E9uVdYK/VqUtUJd7KxGRcTt+8/DBNPAHDVsMu9MmBTLT4JjNkwyoV9GXsJ/Ff4cWWWUIaaaa4RdtG2mmm04Q2222jbTCUIQnGEoQnGEpTjGMYxjGMa4qduuJiRkjq8Xt5K0bayubVDUuJjxJjFpHl24GvV1iV+KPvRBI5JaCFANx5KUuNIfVhSly2x20MUVwQ8F0k807iMsUHT5NT+7e6dXey6pkyHl7Q7YRK/LtY5Do26TYJDA5sWtkb+pv//EAD0RAAIBAQUEBgUJCQAAAAAAAAECEQMABBIhMUBBUWETIjJxkaEjQmCBsRQzNFNzgrLB8ENQUlRykpPR8f/aAAgBAgEBPwD99MjqquRCvOE5EGNdDkRwMHaaNA1Qzl1p00PXZjplOQ3nlI/K17pUqa0DSBh0LEkmW7JBIJgHPcB5Woelu9aidUHTU+MjtD35D7xO1Xv5q5/Yj8NO1w+kAbmVwe6J+IFjkSOBPx2m9/NXP7Efhp2uXVNWsdKVJv7m0Hvg7U1R3ChmJCCFB9UZCB4CxqqKAooGlmx1SYAJHZCwTkOcZjT2XKlYxAiRIkESDoRO7ntZ9NdMXr3Yx30208DpwCnjtFMIzqHbAhPWaJga+J0HCZs14ooxWndqTIDAZxiZgN+I5id2seQvNNAtKtTXAtUGUmQrDWOWo4CNBMWuefyhDo1BifdkPxbRdaS1qyo3ZgsQMiY3Tz3xnExxs16cMVpU6dMAkBRTBbWIYkGTxyGdr5j6C79IAHlsQAAgwMoGQMa87XXqUrzVOUU+jU8Wfd44fHw2dHamwdDhZcwR+vEWN8qnMLSV/rFpjH3ySc/dZ6zuioxkIWI4ksZJJ1Mk2qVEFCnRpmc8dVoIlzouYBIXugwCPbBRJAkCSBJyAkxJO4DfavR6CoFDh+qGkCIMnIiTBynXQg2vAFSnSvIAlh0dUD6xRkfvAeGHjtIteqSUaxRJw4VOZk52o9a6XlT6hRxyJOfiFjaRqO+1/wDpB/oX4WpdS53hv42RBziCfJj4eG01qpr1MZAUkAQDllzNrw6qlKhTYMtMYnZTIao2sHeBJiOMbvZ5EZ2CICzMYAH604nQC3yMzgNegKmmDFnPDTXlFqlN6TFHEMPMbiDvB42rIrUqVdFChupUVRAWou8AaYgCfDjtF2rJR6ViDjNMrTIAIDHjmIzjMbptmTGZJPeST8STa/fsFYzUWiBU3mctec4j7532ode63pD6oWoOREz5KNopo1RwiCWOn5k8AN5sWpXSQkVbxoXPYpneFG8j/pHZszM7FmJZmMknf+vLQWu/Vu97c6FVQcyZHliHjtF1rpQLsyFiwCgggEDfnzy04W6S5/y9T/If92qtRbD0NNk1xSxadIiSdM7Vj0NCnQ0ZvS1e89lT3CJ7h7T/AP/EADcRAAIBAgIGBwYFBQAAAAAAAAECEQMhAEESMUBRYXEiMoGRscHwE0JSYHKhBDNDktFQU4LS4f/aAAgBAwEBPwD+tBgSQDdYkbp1bS9QIQoBZjqUeZy++KLuxqBzdWiBEDXIHdxxU6FRKmR6DduqfHsG1UevW+s+LY/Efl8mGBcDltNHr1vrPi2K9wiDW7juGvxG1BVUkgQWMnicBCahdogCEAm28mwvyyPD5XBB1EHK2/a+pWj3aonkw/nxbhtDEhSVEtFhx9XwKbkS1VwxvCmAOEDX2RikzaT02MlDY7xx+3G+K9vZtmrj738toquUQka7AcJz9Z4FFSJdmYkSTpW7OGKMe1qaJlYse0Yq9J6Sb20jyH/J2ggMCCJB1jAoJqlyPhLdHuEeOAiqxYCCQBwAEAQOzCqxqM7CPdQWMLvtv77kfOBMAm5gTA1nlxxTf2izoxci958MUzou9I5dJfpOV90987VRcuktrkjdipatSbfK+v3bV+H/AC/8j5YfpV6a/CCx4eoG1U0FNdGZuTOKYJZ6jAgsYUGxCjhx5ZTn8vEhQSTAGs49vmKdQr8UffdHbhWDgMpkH1BxTYh3psSY6Sk6ypy4x/O0VEL6IEaIYFgZuButz+2LAbgO4AYofqEdUudHlfyj0MVLVaTb5U8vTHaGYKCx1DEPWu0pTyX3m3Twz8J62AAoAAgDUMVb1aIzBJ7BB8jtFWm1QKAQACSZzOXdfvxo1/7i/tH+uEDidNg26BEb8hhOnUapkOgnZrI8uZ+Z/wD/2Q=="
+  },
+  {
+    value: PresetListType.ORDER_LIST_2,
+    img: "data:image/jpeg;base64,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"
+  },
+  {
+    value: PresetListType.ORDER_LIST_3,
+    img: "data:image/jpeg;base64,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"
+  },
+  {
+    value: PresetListType.ORDER_LIST_4,
+    img: "data:image/jpeg;base64,/9j/4AAQSkZJRgABAgEA2ADYAAD/2wCEAAEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAf/CABEIAPQA2AMBEQACEQEDEQH/xAAzAAEAAgMBAQEAAAAAAAAAAAAABwkGCAoFBAMBAQADAQEAAAAAAAAAAAAAAAACAwQBBf/aAAwDAQACEAMQAAAA7+AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAcdPpZewDzdXrAAAAAAAAAAAA1LsjURpqk6Pb3clw8g1gAAAAAAABlxsQADmI355/r7oddHoOx3bt1T/ExEAAAAAAAH2mTgAgicZ3hKBpx842KhIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAV8XQ0+theRkuAAAAAAAAAAAAjOXOevZR0wYdAxggoAAAAAycnUAAAAA5n92e/PHfNse+YYIAAAAAeoZ0AAAAAag2wwbrfemYAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAqn0V2sZ7AAAAAAAAAAAABThpquPzWjHyHQADISYQAAAAAAADm620dGGK/wBU8UjEAA9ok4AAAAAAAA0BuhFkuWo57AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAK1769Hbob20zsdosAAAAAAAAAAAHMbvz3kZLqHtdPUXg0D4iJAAAAAAAAe0ScADl69DPZznnU3or6sPP0jzyDQAAAAAAAZCTCACnPTVDE45Fzs2wlbJnsAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAH/xAApEAABAwQCAAYCAwEAAAAAAAAGAAUXBAcICQMWAgoQFUBgASAZMDg6/9oACAEBAAEIAPqmeu33Nu3+fN6rh46sD8zlLEyk498jOzKJgwvxCv8A5Mv+r/W/TFOmE3tRfTy9+QxXcnCSuxsu16EHLycLC983D2QiXZCJdkIl2QiXZCJdkIl2QiXZCJdkIl2QiXZCJdkIl2QiXZCJdkIl2QiQK9vNYVNdPV/pvHr3PNrLDAjToF0vl58e6Kmp6KisTZRp0m7r7XWlaOTYniNxZs8GvTxKpp+Gsp6ikqI8D1Hgeo8D1Hgeo8D1Hgeo8D1Hgeo8D1Hgeo8D1Hgeo8D1Hgeo8D1Hgem4NG2qs4a+g/RtxisE0ZAP+VDer24wWByPqbd117/HiPjRyZG8WXXJ9uzt2b4p69GVmnPTbsqyM2EF2dDLkN8l7svaEmuOMXgJND/+2d+XqZONY1DblX0EhmCkMwUhmCkMwUhmCkMwUhmCkMwUhmCkMwUhmCDTIkdSRtoK/wDr0P8A+2d+SZ8k8fiC9hNjayJ5aad8balrq4oHVFA6ooHVFA6ooHVFA6ooHVFA6ooHVFA6ooHUzW+ZmNypnSk/rxpwesPidcTJy6FoAzWniYB5unmwce+4E+zqpHdp4PrP8Hyi3Ne+TPvBthgdRehU7VDGw17pSSuRKVyJSuRKVyJSuRIVuC8vj9QNdX8G4P8A1G2MVS+slE6NjHWIhZ/fmesaVEKiFRCohUQoetx7C8Ubt8J8wCEHzY8G7HOXIfVNa/IjYRjTsMe/ruxjZ3aPWu12Wr7ocXmBRf8APLx/jmwW2pYkbBq8yErMfI8ws8NA9frSw/v/AC514RcHHyc3MDkITm95hu1mTuGXo5Vnt7dX16l5S8peUvKXlLyl5S8peUvKXlLyl5S8peUvIeuP788UbT+vmMQ8ZuFeHTcAmv8ACVqiV+7UMGm3ZFrVpcHfR3pOSvanOh4YoIlFBEooIlFBEooIlFBEooIlFBEooIlFBEooIlFBEooIlFBEooIlFBEhW3zyxv1A6Vf6badct6s9qvEQpsP4sXfMGeLw+Lw/jGLT3cBpyoF84dgt/sEMnrqbKsZMwwf7N//EADkQAAAGAAMGBAMGBgMBAAAAAAECAwQFBgAHEggRE5Sl1RSV1OUJFdMQICEzQGAWFyIjJFkwMbe2/9oACAEBAAk/AP2pPKrfDz+Hdmjs5ZObXtfaVOtv0LvYMwbbMRmYR/nstWZO2xknGzISmWyKtfmIiMj5es198q3eHsLYszINpeAscTGz0HKszio0k4eXZoyEZINTiBRO2esnCDlA4gAmSVKO4N+79SqxD+VWXU3MVtjIKlSbT1+fplhMuqwYTHIYf4lvMnX4Q3DEyhE3x1SkPwxKJSyGaXxGahmJnrm9Zp5kZeXZ27PCKLIZYWJ4DxmRynO0yJbUe7+HWZ6Ym+DMLtkFBEVXBjs8+NgrMmzbK+ZEI9VVNKs4imPHKVAcOEXCp3SbFlDIPaExVWRaFXWy/kOE2IVId/2KHSWSiJJVJVI5k1E1E2axiKJnKIGIchgAxDlEDFMACAgIYn5rzR99fE/NeaPvr4n5rzR99fE/NeaPvr4n5rzR99fE/NeaPvr4n5rzR99fE/NeaPvr4n5rzR99fE/NeaPvr4n5rzR99fE/NeaPvr4n5rzR99fE/NeaPvr4n5rzR99fE/NeaPvr4l5R03U8dxEHD92uifRHPDk1pKqmIbScpTl1FHSYpTBuEAH7s7Lx0VnPeU9oTahkawuqnLVzJaipzhItFZb5bIxKKsgwh8xpuKQnCLMULjA5dun0csm+jTqbcHxRWjNogk1aNGu1uzbtmrZumVJBu3QSyxIkigikQiaSSZCppplKQhSlKABmDmjdNmL4m+VTqoEu+ddqaWe0qbStXsLt7CfxBZo+s19OyTrifkIurwoqNvGCpnwJ5JdczNNwOaJR2q3FbGyJ5fp1uyrMygWmLZkDBL2lKKPXGtk/lyge9BFOZJExq6ZFYqovHDdkrgnEbukVW66eoxNaK6ZklSayGKcuohjF1EMUxd+8pgEAHER1CU9biI6hKetxEdQlPW4iOoSnrcRHUJT1uIjqEp63ER1CU9biI6hKetxEdQlPW4iOoSnrcRHUJT1uIjqEp63ER1CU9biI6hKetxEdQlPW4iOoSnrcRvAdocThK+Mfq6OKkdFT+2s6USNqSUOX+og7t+8NxgAQ+5lbV0Noe0VBGhTmbIoOV7W8pzckKRGvlcOHKrVnHlJXYcuhi1bHMDU2tQ3inniMZW1nMV/lJbUL3lnIziTsslR7g1UaLN7DXZGPdsnsdIpLMGK5VUVwDjsma4lFVqgdPJSgn2lkK6NURzlPCpGuiMIMUpACik+EwopvhryytbGZI3CaGtqqV4ZD5KczEf3daJyQzHuzFdfKzJSgVyTtmaGaL4jssa3jqvFNEk4pp4uVUSjU5KxzEJFeMVTakdqvFUGq2U1PyUf7NeckBl7XMuYRjPpXCng/d5hsZ+pZly8zOP2s/baw/p7eKkJCIgam0PIpShgh0UlW7dp+pywoNhzVpMU4hKVmNO1KDl7rTYl44VdvmNTskgxcytbQkHCplJEIV0xM/EqRXhlyIIlT/wBily/9a2kPtW4DtDwfCV4aSujiv2qKn9tYiiRtSShy/wBRB3b94bjAAhL9Pi/RYl+nxfosS/T4v0WJfp8X6LEv0+L9FiX6fF+ixL9Pi/RYl+nxfosS/T4v0WJfp8X6LEv0+L9FiS47RfxnFS8GwS18Jg6WT/uItU1S6VUyG/pOG/duHeURAf8Aj/2KXL/1raQxnPlrK5/U2CbWa05OsbhCOcxIKBdpMXCUpI1VN4aWQbFbSsQ7ciLbWzaTMM7dkQby8aq6wddNu64PEO3MmRYOAuk4JoMqmsQN50SgbUmbeUTAG4RAwPZrmGPbsPZrmGPbsPZrmGPbsPZrmGPbsPZrmGPbsPZrmGPbsPZrmGPbsPZrmGPbsPZrmGPbsPZrmGPbsPZrmGPbsOZRRw143DI4WaHRHjoKtz6ypMkTjuIsYS6VC7jAUR3gAlH/AI4+zM7XtcZrSGc2cS09Y3M4xe3aTnLbYXS8AyXRSJBRwyV1nDEj0DKpkRUbJAfc3KI0uaR2kcxIJaEm5p1aph5WGir2Ji4CXnYWrLLCxjZ2bg4dlFyLkp1WgN/FqMWLJ3IyDl1+8Nl/NWSQt+XC18W2iEXgJVCN01OYtia7et/IFiSNGRGHVqMreFbfGKx9+ONYRrD/AEEfrfqn9bLs/WrYukM8JeOUrrdS0nvje0ZhxKbhCzCsDlCMBnW4woxpURTFQqx9e9YQD7CIqOGvheGRwVQ6I8d43bn1lSUROO4ixhLpULuMBRHeACUWULy77uOGULy77uOGULy77uOGULy77uOGULy77uOG0Ym3deK4h26LsiwcBm4cE0GVerEDedEoG1Jm3lEwBuEQMH6H/WfL/wD3ecOJiKaTc0R4rDw7mQaISkslHJFWkFIyPVWI7fkYInKq8O1RVK1SMVRcSEEB+xx4Txfh/wDI4PH4fAdIOfyuKjq1cHR+YXTq1fju0jYek+54sPSfc8WHpPueLD0n3PFh6T7niZ8X4TxH+P8ALuBxOO1Xbfm+OW06eNr/ACzatOn8N+oP0OYFkQutN2enWz22y3TjIs1WewzqatU0awrypjfNk5MitqcIg1TL4UU2iJhHUc+M2c1azfNnCJhIiPoEE9jj06zIVWbs9igCnXeN1JSvNnMjbpdvcGEaqsxtURwWXAiXKsnISX7dywzpzVf58XKVolFrmSVfrNksTixRjeJWTYqRdhttWWduZZaZZMIdnD/M3z18cW5WxDmR4vwvfi1poioQFVEtlGOWVIkJgBQ6aR8w0CqqFLvEiZlkSnMAFFVMBE4TtyqebuXKR3V+yIzkqS2X2b1Uj03xItWTeV872WiZSPZyaiMbLr1ufmxrz91HNLESJXl4gj79RKR0HAwfxA6fMTc3MPm0ZEQ8RGXLKJ7JSkpJPVUGcfHR7NBZ2+fO1kWzRsiquuqmkmc4bY+yqiiiQ6qqqu0LlGmmkmmUTqKKKHt4FIQhQExzmEClKAiIgACOFS3XIzZh2ZblRNqHaJpLNyrlJmXd56AzEr9Py6ir4xKFYv01DHvNGmWzyPeyRn0dT3oMzuYumtniH2J8bwLJ084Wvh8XwyCi3D4mk+jXo069B9O/fpNu3DXure2Yr3VvbMV7q3tmK91b2zFe6t7ZivdW9sxXure2Yr3VvbMV7q3tmK91b2zFe6t7ZivdW9sxXure2Yr3VvbMV7q3tmK91b2zEN4TxfiP8j5jx+HwGq7n8rwKOrVwdH5hdOrV+O7SP3IZnY6beNvCvU+216RKc8fPVmzWjKeFnoZ8RM6ah2cpFPXbFyUihDmQXOBTlEQMGwzkh5VM96xJ3Ch5A7eWdEnkLnrsmrXi12rKldw+sOWFZaZsU+tWmUnncBP15TMYJ6WlWDxH5cWAZRbRRpXrJYox39hiFWex71okZUTAmVRy2URIZQSlOYCAY4CcSkOYC7xAph/AXsLzD7t2HsLzD7t2HsLzD7t2HsLzD7t2HsLzD7t2HsLzD7t2HsLzD7t2HsLzD7t2HsLzD7t2HsLzD7t2HsLzD7t2HsLzD7t2HsLzD7t2HsLzD7t2HsLzD7t2HsLzD7t2HMYo3a+K4hG6zs6w8dm4bk0FVZIkHcdYom1KF3FAwhvEAKP3M5KNkxftlLOZxnRATl6rEla49zYmStXkaudKLZAds4LFzVZbvHbWSSWZvUDA3USOmZQo/FA2WyCYogBy7J9XExBENwGKB6mcgmL/ANhrIYu8P6imDeA7Ydv249onLlu5TyejXVMisuMnsonj1Nyi4la1RIt6+ilJNsC/i4Y0RF1CJjpcTTzqFlbA3iZeL2yrpl3s+ZPVlOLv+zeykbOSIt0i0Xs674rKHYSLamyMdf20vCRNtcWaOcS8Y2r6LyKcvliQ7eD/AHN//8QAPBEAAQMCAwUDCQQLAAAAAAAAAQIDERIhAAQxEzJAQVFgYXEUI3ORk6Gy0eEzU4HBECI0QkNUZHKCkrH/2gAIAQIBAT8A7KM5ZpTKUrHnn0rU2ZNgkAjQxBEG8mCehgiCQdRY8S02XXENj95QB7hqo/gJOMw/GaCkbrJShIGkIP6w8CZHeIxnEBLtadx5IcSeUne99/8ALicp5pt7MkCUihudCox80i3InHliz/Cy/svrhavKsqpUJC2FTCBAoIvAkwIuf7MbBzZbanzcxMjrTMTMVW8eI2iygN1GgGQnlN7+8/oS4tFQQopChCo5jofXjaLo2dRomaZtOv8A28aTfXte0w48TQBSN5ajCU85J+QOMywhkMlCivaJKioxB3SCkRYGeZNo4oKUElIUQk3KQSAT3jQ/jjN/ZZP0I+Fvi839lk/Qj4W8ULCQspVQTAVBpJ6TpyPqPFOOrcS2lUQ2mlMCLQBfroMF9wtBkkUAyBAnWYJ6SZ7YhicuX9omyoo5m4Gs2N5iN288WGkHKqevWHaBe0Qk6db8Wn9gX6cfCnH5cUHiGCxAgrrq5zAEdOWEZhSGVshKSFzc6iQAfHQR0PXs8wwp+uFJSECVFRIEX6A6QZnHkf8AUZf2n0w7l3GYKoKVaLSaknum1/EX5aHickJRmgLktEADnZWNi7905/or5YILWSU27ZbiwptB3kgFJJKdU6HXr1PE5IkJzJBghqQehAUQceVZj71fr+mEKOZYf2sFbKa0OQArRRpJAEg0wB+YHE5Z9LO0C0lQcTSQDFrz7jjaZP8Al3PaH54XmQWy0y0GkK3rlSleKrGOsza0xbCHW0sONloKWo2ctIFuZuI5Ra9+/tN//8QAOBEAAQIEAQcKBAcBAAAAAAAAAQIRAxIhMQATQEFhcYGRIjJRUmCSobHR8CNy0uEQNEJTY3PB8f/aAAgBAwEBPwDsouKsLJTzEFIVre+h9W4dOL1zlapEqV0Dx0eOIcP4RBusEnfbhQ7cQFEolN0EpO63puzmNy1IhA3LqboHsna2rGQT14ne+2EjIxQHJTEDOes/ifqxOmeR+Uztufi1c4lTNM3KZn1fgpKVM4di41HEqZpmE3S1fbU2U7XriJRc1NgKk7B64hRFLK5gBKWbSL0OsNqzpgSCwcWLVGw4g8+N8581Z3B58b5z5qxMl5XEwqQ9eGdJQElRDuoudtbccCGkLK25R102t2xynxBDlNQ82iz8NDvejZ2VqEZKP0lD766d2dn8wn+v6s7KHiCI9kytxr44VDClpW5dOjRTyvXp7PRIghs4JmLBsZb+OJ3cIiJW4Dgi4IY+/LTnMbnQfn/1OJ0ddPeHrgMuOFJqEpIUoWJYhnsbjhqzmOAVQgbFbHYSnGRhdQePrhQyUSHI4CzKpLki4D1018Oh85iw1LlKSAUl67vTEsf9xPd+2EwjNOtU6hajAbvKzYUhRiJUFkJAqn3Sul/+dpv/2Q=="
+  },
+  {
+    value: PresetListType.ORDER_LIST_5,
+    img: "data:image/jpeg;base64,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"
+  }
+], OrderListTypePicker = /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+  ListTypePicker,
+  {
+    ...props,
+    options: orderListOptions
+  }
+), "OrderListTypePicker"), bulletOptions = [
+  {
+    value: PresetListType.BULLET_LIST,
+    img: "data:image/jpeg;base64,/9j/4AAQSkZJRgABAgEA2ADYAAD/2wCEAAEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAf/CABEIAPQA2AMBEQACEQEDEQH/xAA1AAEAAQUBAQEAAAAAAAAAAAAACAYHCQoLBQEEAQEAAwEBAQAAAAAAAAAAAAAAAgMEBQEG/9oADAMBAAIQAxAAAADf4AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABqsdDPqc9DNtjc/TtT8/QAAAAAAAAAAAOK79Ryrce+XH897UXy/VAiSAAAAAAAVcSIAAOYl3efgD2U5/cd3Ts4XQAosAAAAAAA/aVOAAeUY+bq8gtVnreAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMDeun4ZAaZzkqmAAAAAAAAAABi10VyprlKGuWA/XTnwyXCmCxQAAAABU5fUAAAEVrIwCthloz2YMNdOwbjvHmFCAAAAAHqFdAAAAEMLYQithmby3eiAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAClvfNZDfQMkdE8uua0AAAAAAAAAACyM48YT6bljcG5unfj5G0U+WdAAKhLwgAAAAAAsjOPGE+m5Y3Bubp34+RtHilsQAD2i5wAAAAAAPD9YYdNQmDXKfNMwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAIY2w199lOwVjumZVMAAAAAAAAAAAchX6PmQAuhP6mfXr+c6YFlwAAAAAAD2i5wABxwfpeXFSyMra5djz5rqAR9AAAAAAAKhLwgAGKnRXrRbs+y3h0ZWM9gAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA//xAAnEAABBAIBAwMFAQAAAAAAAAAGAAUIFwcJBAEQFgMKYBogMDhAFf/aAAgBAQABCAD4pu19wryoQHzpFCI3TfZtz6FfpGPTSb7hn15vHrPFGXf9GYsiFmXstZOyqeLDuQyzEeW8XZVAu/khEvJCJeSES8kIl5IRLyQiXkhEvJCJeSES8kIl5IRLyQiXkhEvJCJeSESBXt55hU18fl/bvp1TZQhBKPJObQ9aFNU2TJvyixzms1714HqvA9V4HqvA9V4HqvA9V4HqvA9V4HqvA9V4HqvA9V4HqvA9V4HpuDRtq5no8/gfa+MTITs7mOkvXUJq/wCpX6pp1YWBiFmdvHhj5aX7LZby9yqe4W1Eunre4XwP6XJyDzIHz3xLPbGxEVg38+67OJfHTVnMjKYFCuO4TFCKWBY/ACyyy8CN2/8AiEZgHYyceY1Dblz+BYZgrDMFYZgrDMFYZgrDMFYZgrDMFYZgrDMFYZgg0yJHUkbeBz/wThjGzzLiPIGMLzqr2ENGRAplhNKjJ2VcZ4VCnnI+XoWvjtsz2Ov+zBv7PLTx3xt5LXy6oHVVA6qoHVVA6qoHVVA6qoHVVA6qoHVVA6qoHUzY+ZmNy4zpxPwy515w2nS0t7dKAH9vvrKFSRnJilnZ2geam1iYPlxyXNuPwkxPHn6uXW8vq5dby1vboYubQzbJIHgH+eTP63yC7+z8/ZCYfcqduQxsPPdOJa5ErXIla5ErXIla5EhXILy+P3Aa+X+aTP63yC7+z8/ZCYfchZ/95n5jSqhVQqoVUKqFD2OP8F44bt+cmHGUxGyARI/pyNMy+nI0zKH2sCDMCCQxLom/H5qbAIp6/cf8PIUnunu9IZeV+lwesLZ/xS2A4+5GQ4w/0bPJqGM9ppZoz2RLWLNI0gZNLCmeRrvbyt5W8reVvK3lbyt5W8reVvK3lbyt5W8h7I/+88cNp+6cEYS+GssM7RuM1B6LphM6WGDI2BneqCJVQRKqCJVQRKqCJVQRKqCJVQRKqCJVQRKqCJVQRKqCJVQRKqCJCuPnljfuA6cv7dlun6KOztga+Rlrr7PDKPlfq8bprR0/RT1iMDvyMT/Jv//EADsQAAEEAQIDBgMDCwUBAAAAAAQCAwUGAQAHEhOlCBEUlNTVldPlEBUjFyAhIiQwM0BXYLYJFpeo19j/2gAIAQEACT8A/tSEq9w7QsKGA/uduPbGlTVL2jIlBg5OPqsXXhnx0Wy+Pw5TR8qqRNYgKiguOELCsUuRKRlf7al++8misFpjs1bbDNUyrDqneQ7S80bNTeF/WyjIz0M43lrhRnGcJT3QlUpXaEmAH/yZbk1RtcJS94DYoMgyQrUvXjCiW6luG5GiOSkdiKNcrVvdakwYuLq0ixDQs7/MEkmXbcncC4Xu2klvqJJdsdrsEhOTOXX14wpxSTzn0YzwpxhKcYShCcYTjT5I14203Dpd+p5AbSnymrPULHG2CBWOwj9Yh3EpHi8A+O/n57mu7PH3fmT818UO+fqfmvih3z9T818UO+fqfmvih3z9T818UO+fqfmvih3z9T818UO+fqfmvih3z9T818UO+fqfmvih3z9T818UO+fqfmvih3z9T818UO+fqfmvih3z9T818UO+fqXlCh3PHcxgg8t9lfBHGLRxtOuqQrhWlK08Sc8KkpVjuzjGfzqdKy/ZM30u85fqXdYSKcdr221hucs7MTW01qWC24PV1w03JEi0FySUwLZqr93NxxZs1FWMON1S5aL7JOx1yib1dbpMx5AkDuRY6jIplIHaqpvkoabszspPx4jV8ci1ujVurIkWZE0Calq6JI/bEdQlPW6iOoSnrdRHUJT1uojqEp63UR1CU9bqI6hKet1EdQlPW6iOoSnrdRHUJT1uojqEp63UR1CU9bqI6hKet1EdQlPW6iOoSnrdRHUJT1uo3kFsczlO+MPd4Oa0tlz8N4pxpXE04tP6yM93f347lYxnH5sPFWGvzYJMZMwU5HiS0PLxpjSmC4+TjD2SAjwSmVrZJEKYdYfaUpt1tSFZxnsI9mf77dKyaprG19fxXcEZdS9xNU3A2KeyjmJxnDDME2xjHEnDeEqUnMLE1yAiBkBxUHAxocRDxgjec5QLHxkeyOEEMjKs5QwMw00nOc9ycd+f7u2M223Iqm1tiNo26Hbf7Rs3MwnZngbuCkZyQrm3ETU1/wC8N1ioptx1g2XrzZoYxbkfIJhZCqSMTYJd7sCdtetRrTkhYNlqiBuJsnudIhDcRZEdtjapMVup4lnWGlCCP3FcrxLdaQzCyBK8ZTEWnbzcbbOzEUDfbYjccD7m3P2V3DBcKYKrVtis8OViluAHOQM4whsaVYENGIHjJ6JnoKI/lzDI22C7cRNGiJWOVluRhlbwX2o7PmTccQlaHAz4WPvZcoEewtJMeUI0aNnBA7eowOMgdt9tazEkrDaU199WYmPak7lajON15a5O22w2ZskmvLq0eNk3ks4bHS00jWGoxv8A1FuzZ2g9qt8IEdxxsGasPZmqQW6NN3GLBbThh20fc8XE0keTeypbUDHnjMYZcPPUd9j3ILY8HyneW07wc08Vlz8N5DjSuJpxaf1kZ7u/vx3KxjOJfp8X6LUv0+L9FqX6fF+i1L9Pi/Ral+nxfotS/T4v0Wpfp8X6LUv0+L9FqX6fF+i1L9Pi/Ral+nxfotSXPEf8ZzWvBgNcfKAKeb/EZFbdTwutoV+qvHf3d2e9Oc4z+4KFjk7w7bTlahZg5t54Gv3NlLUzQbMYOP8AtBItYvEXXrAQKz3OlMxqx21JU5hWJFjZ/wD1COzRFR2026+0t8IGgpnclNPDDiK/uvtoQW60JfYO9V9MPPlvV7LjqJA8mRDj81SRrkzK3+n7Y0GvMeIm7je7FFVeuRrecZ5aSZaYKEDS+QrHKEFw6okx/KRxWnn1obVX5+D7HvZk2vtHZv7FMtY4uRgTd6rjbJQlnebfeKipPOSGKq2EmRokS+oYFUsE9DILZCsdatMOF9i32xyuTzFjqbQ9jkPtEI4FOtvIx3rZThXE2rvTlWMd2c4Vg2a8wD7do2a8wD7do2a8wD7do2a8wD7do2a8wD7do2a8wD7do2a8wD7do2a8wD7do2a8wD7do2a8wD7do2a8wD7domUcIF53LQQ8ItnPPYdHXxpaCZXnuQ8rKeFxPcrCc578YynP7nYmpbkSEIwseuXLCpSrbi1planHcDwW4VQPgrgDHJKXg5cH98OQBhrbL8hFGZbTjW1l+3uIri3F12G343j3E3LqUPh1ttrLLVQkptiuSIuG20J8HORsqIrhQpxla2WFNRcdBwcMCLGRENDgjRkVFRoLKBwo+NjgmmBAQRB222BRBWWmB2UIaabQhKU4/u5g4mHpNWsNulRoxth6SIja3ElzJzEeyUSEK6c6KE62I2SYIw4+ptLxLDeVOo2T7bv/ABvsP/8ASetk+27/AMb7D/8A0nqhb+VCY2tq0TbrATvBV9vICNMjZiWVDCsQ71L3T3AKIObKRlx9s0OPYSx3KbJdc/Cx/L/0R3X/AMDnvt/ojRf88e+1DLhAvheWghLi2c88wcdfGlpxlee5Dysp4XE9ysJznvxjKchQvlzvcdBQvlzvcdBQvlzvcdBQvlzvcdBQvlzvcdDRjY5XiuYsdktD2OQGQQjgU6a8jHetlOFcTau9OVYx3ZzhWP339Ed1/wDA577f6I0X/PHvtI8J4vw/7Ryefy+QUwT/AAuazxcXJ4P4ieHi4v093Dmw9J+p6sPSfqerD0n6nqw9J+p6sPSfqepnxfhPEfs/3dyOZzxXxv4vjnuHh53H/DVxcPD+jv4sfvg/vGvWqDlq5PR/iCw/Hws4ARGSgfiwHxThfFAlPseIDJHLY4+YO+y8lDiexx/2F7VP/uOuxx/2F7VP/uOtj/yUWG/QYFctsh+Uvd+9fe0LGHqkwg/CblX+4ggcg5WX/ERgwZbnfy3n3Ge5v+4Nz4+mDTTpAtQqYA70/uBejBFCoNHp9OjuZKyrUdk0PMvLLQLBQiSxFTMqBgsbL3Zl7TGKVkrDT1lw5tfmxNic1SclNVHN0wA6vDXC7gZVwZznOVN83GU4UrdGOuw0P4Fq4VI0ciA3BoJ8gh9QoFzp0mlmVivEuCHMx0uwg2tzqwDnK9Ny4wrr6f5iYKOqxVqlartBCrKU/HVLZ+syRkfRYaMZSrIzCy4tCbBPviIaalbTNTcxlCVnqTjU3IR1WGt8JV94YUVS3Bbfs3ZJcAG/wJoHGlg0lqGy5N1xZCXExdriYKYaQp4BCVfbXurfTNV7q30zVe6t9M1XurfTNV7q30zVe6t9M1XurfTNV7q30zVe6t9M1XurfTNV7q30zVe6t9M1XurfTNV7q30zVe6t9M1DeE8X4j9o+8efy+QK+T/C8CzxcXJ4P4ieHi4v093Dn82NkAS9stw7DEQBh4mQ/wDc1FfPeOoNyAR3cCoy3U8mGsAOW8/htH+GeS0Sw+w1qNKPM3Nv0JFz5Izb6mq9RRCkSV+tkg4P+IPHVenhzM0U4hSXVpDSMLxmPjtOfabC+YO9u0bC+YO9u0bC+YO9u0bC+YO9u0bC+YO9u0bC+YO9u0bC+YO9u0bC+YO9u0bC+YO9u0bC+YO9u0bC+YO9u0bC+YO9u0bC+YO9u0bC+YO9u0bC+YO9u0TGODi+K5iB3i1vZ54ZA6OBLoTKM9y3k5VxOJ7k4VnHfnGE5/NAmKLvFU4oiJo2+dA8CNcYiOceWY1XrICeO/FXintyC1lpgplts6NUVKKq09WSpmULK7cdBzR8FZwzN52UsWLW4FzU9y3avjcDMQ0VlnizltNveZw7hOOblKs5SDL3veG2x6Yu675X1IT9ylYhBfjUVqvBAstRNLqmCUsPkREK14uafCjiLNLTr8VFOA/3N//EADoRAAEDAAYFCQYGAwAAAAAAAAECAxEABCExQVESQGFxkRATFBUiMmBysQVCUoGh0jNTgpKiwSMkQ//aAAgBAgEBPwDwpVanzo5xyQg91IsKts4J+p2C/odWiOaHFU8Zn60rVS5oFxskoHeSbSnaDinDMYk2kawlISlKU3JAA3AQORQCkqSblJIM5EQdZqlYS62lBMOIABBNqgBGkM5xyOyOSt1hLSFIBlxQgAXpB945WXZnZOsgkGQYIuIsIp0l+I55yPMZ43/WhJJkkknE2nxcGG20hVZWpJUJS0gAuEZqJsTOR4zYP9JfZ/zNHBZ0VJ/UBbG6N4o6yppQBhSVCULTalacwfUYboJ1eqoC6w0k3aRO/RBVHzijqy44tZvUoncMB8hA5EnTqbgP/FaFJOQcOiRum2M41hpzmnEOfCoEjMXEfMSKVhkgl1vtMrOklQtCZvSrIg2W+s0SlSyEpBUTcAJPAUdhhgMSC4tQW6BB0AB2UTnicrcCJ1ht51r8NZTN4vSd6TI+cTQ1x8ggKCZv0EpSeMTwNL7T4vAkgC8kDiYp1c/8bX7l/ZTq5/42v3L+yj9Vcq4SVlBCiQNEqNwm2Up1hHfR50+o5faXca859NYR30edPqOX2l3GvOfTWASCCLwZG8U6bWvzf4N/ZTpta/N/g39lHX3XgA4vSAMjspEH9IHiBplx5Wi2mYvNwG8+gvOAp1a7HfbnLtRxj+qOsuMq0XExkb0q3H+rxiBrLDQZaSgC2JUc1G8n0GQAHI+0HmloIEwSk5KAsPGw5iRrLTgdbQse8kE7DiN4MjkdcDTa1n3QY2nADaTGssVlxgnRgpN6DcdoyO3iDFOskx+EZy0xHHRn6UfrLj57ViRcgXDacSdpuwjxP//EADYRAAECAQYLBgcBAAAAAAAAAAECEQMAITFBUZEQEhMyQGFxgaGx8BQiYHLB0QQjQ1Ki0uGC/9oACAEDAQE/APCkaPiHFTOqsmgatZ5cstEd8c8GuZpQo+OcVTBVRFB9jwOqvSCXJJpJJO/ACQQRSCCNo0mNDKFEgd1RcGx6jZq1b8EGGVqBI7oLk2tULddg3aVkobviJumuo4eLzEUokQgCBMVqzQdVvVVPz0z9xYsnB3FmveSFhYcTETKSaQbD1xcaRFJTDURSzXkD1khISlKRUONZ3mfARixkkfUSoH/Id+Q0hacdKk2jjUdxlDW4xFTLTMQa2oItcWcmkSAHJAFpkj5kTKN3EgpQaHNZ2Uj+g6SpCF5yQddd4nkIEMTsT5iSLvfxgSwJsBN0u0w7F3D9pdph2LuH7ShxUxCQkKDB5wPQnSF5qvKeRw/DZyvL6jSF5qvKeRw/DZyvL6jSCHBBoM0shC+38le8shC+38le8kw0IJKQxM1JPMnxAtaUB1FrBWdgl2lL5qmtme7+yQtKw6S9orG0dCzSYiytZUdg1Crq3BDWULCr9YrHVekrSUKKTUeFR3ifAhJUoJFZ4VncJ9JiQkxKZiKCKdmsdBnl2UvnhrWnuf1lDhJh0Tk0k07NQ6Pif//Z"
+  },
+  {
+    value: PresetListType.BULLET_LIST_1,
+    img: "data:image/jpeg;base64,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"
+  },
+  {
+    value: PresetListType.BULLET_LIST_2,
+    img: "data:image/jpeg;base64,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"
+  },
+  {
+    value: PresetListType.BULLET_LIST_3,
+    img: "data:image/jpeg;base64,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"
+  },
+  {
+    value: PresetListType.BULLET_LIST_4,
+    img: "data:image/jpeg;base64,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"
+  },
+  {
+    value: PresetListType.BULLET_LIST_5,
+    img: "data:image/jpeg;base64,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"
+  }
+], BulletListTypePicker = /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+  ListTypePicker,
+  {
+    ...props,
+    options: bulletOptions
+  }
+), "BulletListTypePicker"), ORDER_LIST_TYPE_COMPONENT = `${COMPONENT_PREFIX}_ORDER_LIST_TYPE_COMPONENT`, BULLET_LIST_TYPE_COMPONENT = `${COMPONENT_PREFIX}_BULLET_LIST_TYPE_COMPONENT`, COMPONENT_DOC_CREATE_TABLE_CONFIRM = "COMPONENT_DOC_CREATE_TABLE_CONFIRM", COMPONENT_DOC_CREATE_TABLE_CONFIRM_ID = "doc.component.create-table-confirm", DocCreateTableOperation = {
+  id: "doc.operation.create-table",
+  type: CommandType.COMMAND,
+  handler: /* @__PURE__ */ __name(async (accessor) => {
+    const localeService = accessor.get(LocaleService), confirmService = accessor.get(IConfirmService), commandService = accessor.get(ICommandService), tableCreateParams = {
+      rowCount: 3,
+      colCount: 5
+    }, handleRowColChange = /* @__PURE__ */ __name((rowCount, colCount) => {
+      tableCreateParams.rowCount = rowCount, tableCreateParams.colCount = colCount;
+    }, "handleRowColChange");
+    return await confirmService.open({
+      id: COMPONENT_DOC_CREATE_TABLE_CONFIRM_ID,
+      children: {
+        label: {
+          name: COMPONENT_DOC_CREATE_TABLE_CONFIRM,
+          props: {
+            handleRowColChange,
+            tableCreateParams
+          }
+        }
+      },
+      width: 400,
+      title: { title: localeService.t("toolbar.table.insert") },
+      onConfirm: /* @__PURE__ */ __name(() => {
+        commandService.executeCommand(CreateDocTableCommand.id, tableCreateParams), confirmService.close(COMPONENT_DOC_CREATE_TABLE_CONFIRM_ID);
+      }, "onConfirm"),
+      onClose: /* @__PURE__ */ __name(() => {
+        confirmService.close(COMPONENT_DOC_CREATE_TABLE_CONFIRM_ID);
+      }, "onClose")
+    }), !0;
+  }, "handler")
+};
+function getInsertTableHiddenObservable(accessor) {
+  const univerInstanceService = accessor.get(IUniverInstanceService), renderManagerService = accessor.get(IRenderManagerService);
+  return new Observable((subscriber) => {
+    const subscription = univerInstanceService.focused$.subscribe((unitId) => {
+      if (unitId == null || univerInstanceService.getUnitType(unitId) !== UniverInstanceType.UNIVER_DOC)
+        return subscriber.next(!0);
+      const currentRender2 = renderManagerService.getRenderById(unitId);
+      if (currentRender2 == null)
+        return subscriber.next(!0);
+      currentRender2.with(DocSkeletonManagerService).getViewModel().editAreaChange$.subscribe((editArea) => {
+        subscriber.next(editArea === DocumentEditArea.HEADER || editArea === DocumentEditArea.FOOTER);
+      });
+    }), currentRender = renderManagerService.getCurrentTypeOfRenderer(UniverInstanceType.UNIVER_DOC);
+    if (currentRender == null)
+      return subscriber.next(!0);
+    const viewModel = currentRender.with(DocSkeletonManagerService).getViewModel();
+    return subscriber.next(viewModel.getEditArea() !== DocumentEditArea.BODY), () => subscription.unsubscribe();
+  });
+}
+__name(getInsertTableHiddenObservable, "getInsertTableHiddenObservable");
+function getTableDisabledObservable(accessor) {
+  const textSelectionManagerService = accessor.get(TextSelectionManagerService), univerInstanceService = accessor.get(IUniverInstanceService);
+  return new Observable((subscriber) => {
+    const subscription = textSelectionManagerService.textSelection$.subscribe((selection) => {
+      if (selection == null) {
+        subscriber.next(!0);
+        return;
+      }
+      const { textRanges } = selection;
+      if (textRanges.length !== 1) {
+        subscriber.next(!0);
+        return;
+      }
+      const textRange = textRanges[0], { collapsed, anchorNodePosition, startOffset } = textRange;
+      if (!collapsed || startOffset == null) {
+        subscriber.next(!0);
+        return;
+      }
+      const docDataModel = univerInstanceService.getCurrentUniverDocInstance();
+      if (docDataModel == null) {
+        subscriber.next(!0);
+        return;
+      }
+      const docSkeletonManagerService = getCommandSkeleton(accessor, docDataModel.getUnitId());
+      if (docSkeletonManagerService == null) {
+        subscriber.next(!0);
+        return;
+      }
+      if (docSkeletonManagerService.getViewModel().getCustomRangeRaw(startOffset)) {
+        subscriber.next(!0);
+        return;
+      }
+      if (anchorNodePosition != null) {
+        const { path } = anchorNodePosition;
+        if (path.indexOf("cells") !== -1) {
+          subscriber.next(!0);
+          return;
+        }
+      }
+      subscriber.next(!1);
+    });
+    return () => subscription.unsubscribe();
+  });
+}
+__name(getTableDisabledObservable, "getTableDisabledObservable");
+function BoldMenuItemFactory(accessor) {
+  const commandService = accessor.get(ICommandService);
+  return {
+    id: SetInlineFormatBoldCommand.id,
+    group: MenuGroup.TOOLBAR_FORMAT,
+    type: MenuItemType.BUTTON,
+    icon: "BoldSingle",
+    title: "Set bold",
+    tooltip: "toolbar.bold",
+    positions: [MenuPosition.TOOLBAR_START],
+    activated$: new Observable((subscriber) => {
+      const disposable = commandService.onCommandExecuted((c) => {
+        var _a23;
+        const id = c.id;
+        if (id === SetTextSelectionsOperation.id || id === SetInlineFormatCommand.id) {
+          const textRun = getFontStyleAtCursor(accessor);
+          if (textRun == null)
+            return;
+          const bl = (_a23 = textRun.ts) == null ? void 0 : _a23.bl;
+          subscriber.next(bl === BooleanNumber.TRUE);
+        }
+      });
+      return subscriber.next(!1), disposable.dispose;
+    }),
+    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
+  };
+}
+__name(BoldMenuItemFactory, "BoldMenuItemFactory");
+function ItalicMenuItemFactory(accessor) {
+  const commandService = accessor.get(ICommandService);
+  return {
+    id: SetInlineFormatItalicCommand.id,
+    group: MenuGroup.TOOLBAR_FORMAT,
+    type: MenuItemType.BUTTON,
+    icon: "ItalicSingle",
+    title: "Set italic",
+    tooltip: "toolbar.italic",
+    positions: [MenuPosition.TOOLBAR_START],
+    activated$: new Observable((subscriber) => {
+      const disposable = commandService.onCommandExecuted((c) => {
+        var _a23;
+        const id = c.id;
+        if (id === SetTextSelectionsOperation.id || id === SetInlineFormatCommand.id) {
+          const textRun = getFontStyleAtCursor(accessor);
+          if (textRun == null)
+            return;
+          const it = (_a23 = textRun.ts) == null ? void 0 : _a23.it;
+          subscriber.next(it === BooleanNumber.TRUE);
         }
       });
       return subscriber.next(!1), disposable.dispose;
@@ -1493,13 +1971,13 @@ function UnderlineMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a19;
+        var _a23;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === SetInlineFormatCommand.id) {
           const textRun = getFontStyleAtCursor(accessor);
           if (textRun == null)
             return;
-          const ul = (_a19 = textRun.ts) == null ? void 0 : _a19.ul;
+          const ul = (_a23 = textRun.ts) == null ? void 0 : _a23.ul;
           subscriber.next((ul == null ? void 0 : ul.s) === BooleanNumber.TRUE);
         }
       });
@@ -1521,13 +1999,13 @@ function StrikeThroughMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a19;
+        var _a23;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === SetInlineFormatCommand.id) {
           const textRun = getFontStyleAtCursor(accessor);
           if (textRun == null)
             return;
-          const st = (_a19 = textRun.ts) == null ? void 0 : _a19.st;
+          const st = (_a23 = textRun.ts) == null ? void 0 : _a23.st;
           subscriber.next((st == null ? void 0 : st.s) === BooleanNumber.TRUE);
         }
       });
@@ -1548,13 +2026,13 @@ function SubscriptMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a19;
+        var _a23;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === SetInlineFormatCommand.id) {
           const textRun = getFontStyleAtCursor(accessor);
           if (textRun == null)
             return;
-          const va = (_a19 = textRun.ts) == null ? void 0 : _a19.va;
+          const va = (_a23 = textRun.ts) == null ? void 0 : _a23.va;
           subscriber.next(va === BaselineOffset.SUBSCRIPT);
         }
       });
@@ -1575,13 +2053,13 @@ function SuperscriptMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a19;
+        var _a23;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === SetInlineFormatCommand.id) {
           const textRun = getFontStyleAtCursor(accessor);
           if (textRun == null)
             return;
-          const va = (_a19 = textRun.ts) == null ? void 0 : _a19.va;
+          const va = (_a23 = textRun.ts) == null ? void 0 : _a23.va;
           subscriber.next(va === BaselineOffset.SUPERSCRIPT);
         }
       });
@@ -1610,13 +2088,13 @@ function FontFamilySelectorMenuItemFactory(accessor) {
     // disabled$: getCurrentSheetDisabled$(accessor),
     value$: new Observable((subscriber) => {
       const defaultValue = FONT_FAMILY_LIST[0].value, disposable = commandService.onCommandExecuted((c) => {
-        var _a19;
+        var _a23;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === SetInlineFormatFontFamilyCommand.id) {
           const textRun = getFontStyleAtCursor(accessor);
           if (textRun == null)
             return;
-          const ff = (_a19 = textRun.ts) == null ? void 0 : _a19.ff;
+          const ff = (_a23 = textRun.ts) == null ? void 0 : _a23.ff;
           subscriber.next(ff != null ? ff : defaultValue);
         }
       });
@@ -1646,13 +2124,13 @@ function FontSizeSelectorMenuItemFactory(accessor) {
     // disabled$,
     value$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a19;
+        var _a23;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === SetInlineFormatFontSizeCommand.id) {
           const textRun = getFontStyleAtCursor(accessor);
           if (textRun == null)
             return;
-          const fs = (_a19 = textRun.ts) == null ? void 0 : _a19.fs;
+          const fs = (_a23 = textRun.ts) == null ? void 0 : _a23.fs;
           subscriber.next(fs != null ? fs : 14);
         }
       });
@@ -1705,6 +2183,31 @@ function HeaderFooterMenuItemFactory(accessor) {
   };
 }
 __name(HeaderFooterMenuItemFactory, "HeaderFooterMenuItemFactory");
+const TableIcon = "GridSingle", TABLE_MENU_ID = "doc.menu.table";
+function TableMenuFactory(accessor) {
+  return {
+    id: TABLE_MENU_ID,
+    type: MenuItemType.SUBITEMS,
+    positions: [MenuPosition.TOOLBAR_START],
+    group: MenuGroup.TOOLBAR_LAYOUT,
+    icon: TableIcon,
+    tooltip: "toolbar.table.main",
+    disabled$: getTableDisabledObservable(accessor),
+    // Do not show header footer menu and insert table at zen mode.
+    hidden$: combineLatest(getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC), getInsertTableHiddenObservable(accessor), getHeaderFooterMenuHiddenObservable(accessor), (one, two, three) => one || two || three)
+  };
+}
+__name(TableMenuFactory, "TableMenuFactory");
+function InsertTableMenuFactory(_accessor) {
+  return {
+    id: DocCreateTableOperation.id,
+    title: "toolbar.table.insert",
+    type: MenuItemType.BUTTON,
+    positions: [TABLE_MENU_ID],
+    hidden$: getMenuHiddenObservable(_accessor, UniverInstanceType.UNIVER_DOC)
+  };
+}
+__name(InsertTableMenuFactory, "InsertTableMenuFactory");
 function AlignLeftMenuItemFactory(accessor) {
   const commandService = accessor.get(ICommandService);
   return {
@@ -1716,13 +2219,13 @@ function AlignLeftMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a19;
+        var _a23;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === AlignOperationCommand.id) {
           const paragraph = getParagraphStyleAtCursor(accessor);
           if (paragraph == null)
             return;
-          const alignType = (_a19 = paragraph.paragraphStyle) == null ? void 0 : _a19.horizontalAlign;
+          const alignType = (_a23 = paragraph.paragraphStyle) == null ? void 0 : _a23.horizontalAlign;
           subscriber.next(alignType === HorizontalAlign.LEFT);
         }
       });
@@ -1743,13 +2246,13 @@ function AlignCenterMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a19;
+        var _a23;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === AlignOperationCommand.id) {
           const paragraph = getParagraphStyleAtCursor(accessor);
           if (paragraph == null)
             return;
-          const alignType = (_a19 = paragraph.paragraphStyle) == null ? void 0 : _a19.horizontalAlign;
+          const alignType = (_a23 = paragraph.paragraphStyle) == null ? void 0 : _a23.horizontalAlign;
           subscriber.next(alignType === HorizontalAlign.CENTER);
         }
       });
@@ -1770,13 +2273,13 @@ function AlignRightMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a19;
+        var _a23;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === AlignOperationCommand.id) {
           const paragraph = getParagraphStyleAtCursor(accessor);
           if (paragraph == null)
             return;
-          const alignType = (_a19 = paragraph.paragraphStyle) == null ? void 0 : _a19.horizontalAlign;
+          const alignType = (_a23 = paragraph.paragraphStyle) == null ? void 0 : _a23.horizontalAlign;
           subscriber.next(alignType === HorizontalAlign.RIGHT);
         }
       });
@@ -1797,13 +2300,13 @@ function AlignJustifyMenuItemFactory(accessor) {
     positions: [MenuPosition.TOOLBAR_START],
     activated$: new Observable((subscriber) => {
       const disposable = commandService.onCommandExecuted((c) => {
-        var _a19;
+        var _a23;
         const id = c.id;
         if (id === SetTextSelectionsOperation.id || id === AlignOperationCommand.id) {
           const paragraph = getParagraphStyleAtCursor(accessor);
           if (paragraph == null)
             return;
-          const alignType = (_a19 = paragraph.paragraphStyle) == null ? void 0 : _a19.horizontalAlign;
+          const alignType = (_a23 = paragraph.paragraphStyle) == null ? void 0 : _a23.horizontalAlign;
           subscriber.next(alignType === HorizontalAlign.JUSTIFIED);
         }
       });
@@ -1813,15 +2316,53 @@ function AlignJustifyMenuItemFactory(accessor) {
   };
 }
 __name(AlignJustifyMenuItemFactory, "AlignJustifyMenuItemFactory");
+const listValueFactory$ = /* @__PURE__ */ __name((accessor) => new Observable((subscriber) => {
+  const univerInstanceService = accessor.get(IUniverInstanceService), textSelectionManagerService = accessor.get(TextSelectionManagerService);
+  let textSubscription;
+  const subscription = univerInstanceService.focused$.subscribe((unitId) => {
+    if (textSubscription == null || textSubscription.unsubscribe(), unitId == null)
+      return;
+    const docDataModel = univerInstanceService.getUniverDocInstance(unitId);
+    docDataModel != null && (textSubscription = textSelectionManagerService.textSelection$.subscribe(() => {
+      var _a23, _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 : []);
+        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;
+        })) {
+          subscriber.next(listType);
+          return;
+        }
+      }
+      subscriber.next(void 0);
+    }));
+  });
+  return () => {
+    subscription.unsubscribe(), textSubscription == null || textSubscription.unsubscribe();
+  };
+}), "listValueFactory$");
 function OrderListMenuItemFactory(accessor) {
   return {
     id: OrderListCommand.id,
     group: MenuGroup.TOOLBAR_LAYOUT,
-    type: MenuItemType.BUTTON,
+    type: MenuItemType.BUTTON_SELECTOR,
+    selections: [
+      {
+        label: {
+          name: ORDER_LIST_TYPE_COMPONENT,
+          hoverable: !1
+        },
+        value$: listValueFactory$(accessor)
+      }
+    ],
     icon: "OrderSingle",
     tooltip: "toolbar.order",
     positions: [MenuPosition.TOOLBAR_START],
-    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
+    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC),
+    activated$: listValueFactory$(accessor).pipe(map((v) => v && v.indexOf("ORDER_LIST") === 0))
   };
 }
 __name(OrderListMenuItemFactory, "OrderListMenuItemFactory");
@@ -1829,14 +2370,37 @@ function BulletListMenuItemFactory(accessor) {
   return {
     id: BulletListCommand.id,
     group: MenuGroup.TOOLBAR_LAYOUT,
-    type: MenuItemType.BUTTON,
+    type: MenuItemType.BUTTON_SELECTOR,
+    selections: [
+      {
+        label: {
+          name: BULLET_LIST_TYPE_COMPONENT,
+          hoverable: !1
+        },
+        value$: listValueFactory$(accessor)
+      }
+    ],
     icon: "UnorderSingle",
     tooltip: "toolbar.unorder",
     positions: [MenuPosition.TOOLBAR_START],
-    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
+    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC),
+    activated$: listValueFactory$(accessor).pipe(map((v) => v && v.indexOf("BULLET_LIST") === 0))
   };
 }
 __name(BulletListMenuItemFactory, "BulletListMenuItemFactory");
+function CheckListMenuItemFactory(accessor) {
+  return {
+    id: CheckListCommand.id,
+    group: MenuGroup.TOOLBAR_LAYOUT,
+    type: MenuItemType.BUTTON,
+    icon: "TodoList",
+    tooltip: "toolbar.checklist",
+    positions: [MenuPosition.TOOLBAR_START],
+    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC),
+    activated$: listValueFactory$(accessor).pipe(map((v) => v && v.indexOf("CHECK_LIST") === 0))
+  };
+}
+__name(CheckListMenuItemFactory, "CheckListMenuItemFactory");
 function ResetBackgroundColorMenuItemFactory(accessor) {
   return {
     id: ResetInlineFormatTextBackgroundColorCommand.id,
@@ -1878,11 +2442,11 @@ function BackgroundColorSelectorMenuItemFactory(accessor) {
 }
 __name(BackgroundColorSelectorMenuItemFactory, "BackgroundColorSelectorMenuItemFactory");
 function getFontStyleAtCursor(accessor) {
-  var _a19;
-  const univerInstanceService = accessor.get(IUniverInstanceService), textSelectionService = accessor.get(TextSelectionManagerService), docDataModel = univerInstanceService.getCurrentUniverDocInstance(), activeTextRange = textSelectionService.getActiveRange();
+  var _a23;
+  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 = (_a19 = docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody()) == null ? void 0 : _a19.textRuns;
+  const { startOffset, segmentId } = activeTextRange, textRuns = (_a23 = docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody()) == null ? void 0 : _a23.textRuns;
   if (textRuns == null)
     return;
   let textRun;
@@ -1901,11 +2465,11 @@ function getFontStyleAtCursor(accessor) {
 }
 __name(getFontStyleAtCursor, "getFontStyleAtCursor");
 function getParagraphStyleAtCursor(accessor) {
-  var _a19;
-  const univerInstanceService = accessor.get(IUniverInstanceService), textSelectionService = accessor.get(TextSelectionManagerService), docDataModel = univerInstanceService.getCurrentUniverDocInstance(), activeTextRange = textSelectionService.getActiveRange();
+  var _a23;
+  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 = (_a19 = docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody()) == null ? void 0 : _a19.paragraphs;
+  const { startOffset, segmentId } = activeTextRange, paragraphs = (_a23 = docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody()) == null ? void 0 : _a23.paragraphs;
   if (paragraphs == null)
     return;
   let prevIndex = -1;
@@ -1949,17 +2513,344 @@ const DOC_CLIPBOARD_PRIORITY = 999, DocCopyCommand = {
     const docClipboardService = accessor.get(IDocClipboardService), clipboardItems = await accessor.get(IClipboardInterfaceService).read();
     return clipboardItems.length === 0 ? !1 : docClipboardService.paste(clipboardItems);
   }, "handler")
+}, DocParagraphSettingCommand = {
+  id: "doc-paragraph-setting.command",
+  type: CommandType.COMMAND,
+  handler: /* @__PURE__ */ __name(async (accessor, config) => {
+    var _a23, _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 = {
+      id: RichTextEditingMutation.id,
+      params: {
+        unitId,
+        actions: [],
+        textRanges: serializedSelections
+      }
+    }, memoryCursor = new MemoryCursor();
+    memoryCursor.reset();
+    const textX = new TextX(), jsonX = JSONX.getInstance();
+    for (const paragraph of paragraphs) {
+      const { startIndex } = paragraph;
+      textX.push({
+        t: TextXActionType.RETAIN,
+        len: startIndex - memoryCursor.cursor,
+        segmentId
+      });
+      const paragraphStyle = {
+        ...paragraph.paragraphStyle,
+        ...config
+      };
+      textX.push({
+        t: TextXActionType.RETAIN,
+        len: 1,
+        body: {
+          dataStream: "",
+          paragraphs: [
+            {
+              ...paragraph,
+              paragraphStyle,
+              startIndex: 0
+            }
+          ]
+        },
+        segmentId,
+        coverType: UpdateDocsAttributeType.REPLACE
+      }), memoryCursor.moveCursorTo(startIndex + 1);
+    }
+    const path = getRichTextEditPath(docDataModel, segmentId);
+    return doMutation.params.actions = jsonX.editOp(textX.serialize(), path), !!commandService.syncExecuteCommand(doMutation.id, doMutation.params);
+  }, "handler")
+}, useCurrentParagraph = /* @__PURE__ */ __name(() => {
+  var _a23, _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 : [];
+  return (_c = getParagraphsInRanges(docRanges, paragraphs)) != null ? _c : [];
+}, "useCurrentParagraph"), useFirstParagraphHorizontalAlign = /* @__PURE__ */ __name((paragraph, defaultValue) => {
+  const commandService = useDependency(ICommandService), [horizontalAlign, _horizontalAlignSet] = useState(() => {
+    var _a23, _b;
+    const firstParagraph = paragraph[0];
+    return firstParagraph ? String((_b = (_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.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;
+    const firstParagraph = paragraph[0];
+    return firstParagraph ? getNumberUnitValue((_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.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;
+    const firstParagraph = paragraph[0];
+    return firstParagraph ? getNumberUnitValue((_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.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;
+    const firstParagraph = paragraph[0];
+    return firstParagraph ? getNumberUnitValue((_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.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;
+    const firstParagraph = paragraph[0];
+    return firstParagraph ? getNumberUnitValue((_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.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;
+    const firstParagraph = paragraph[0];
+    return firstParagraph ? getNumberUnitValue((_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.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;
+    const firstParagraph = paragraph[0];
+    return firstParagraph ? getNumberUnitValue((_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.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;
+    const firstParagraph = paragraph[0];
+    return firstParagraph && (_b = (_a23 = firstParagraph.paragraphStyle) == null ? void 0 : _a23.lineSpacing) != null ? _b : 1;
+  });
+  return [lineSpacing, /* @__PURE__ */ __name((v) => (_lineSpacingSet(v), commandService.executeCommand(DocParagraphSettingCommand.id, {
+    lineSpacing: v
+  })), "lineSpacingSet")];
+}, "useFirstParagraphLineSpacing"), paragraphSettingIconList = "univer-paragraph-setting-icon-list", paragraphSettingIconListItem = "univer-paragraph-setting-icon-list-item", paragraphSettingIconListActive = "univer-paragraph-setting-icon-list-active", paragraphSettingTitle = "univer-paragraph-setting-title", paragraphSettingLabel = "univer-paragraph-setting-label", paragraphSettingMtBase = "univer-paragraph-setting-mt-base", paragraphSettingFlexCol = "univer-paragraph-setting-flex-col", styles$1 = {
+  paragraphSettingIconList,
+  paragraphSettingIconListItem,
+  paragraphSettingIconListActive,
+  paragraphSettingTitle,
+  paragraphSettingLabel,
+  paragraphSettingMtBase,
+  paragraphSettingFlexCol
+}, AutoFocusInputNumber = /* @__PURE__ */ __name((props) => {
+  const { value, onChange, className = "", min = 0, max = 100 } = props, ref = require$$0.useRef(null);
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    InputNumber,
+    {
+      ref,
+      min,
+      max,
+      value,
+      onChange: /* @__PURE__ */ __name((v) => {
+        onChange(v != null ? v : 0).finally(() => {
+          setTimeout(() => {
+            var _a23;
+            (_a23 = ref.current) == null || _a23.focus();
+          }, 2);
+        });
+      }, "onChange"),
+      className
+    }
+  );
+}, "AutoFocusInputNumber");
+function ParagraphSetting() {
+  const localeService = useDependency(LocaleService), alignmentOptions = useMemo(
+    () => [
+      { label: localeService.t("toolbar.alignLeft"), value: String(HorizontalAlign.LEFT), icon: /* @__PURE__ */ jsxRuntimeExports.jsx(LeftJustifyingSingle, {}) },
+      { label: localeService.t("toolbar.alignCenter"), value: String(HorizontalAlign.CENTER), icon: /* @__PURE__ */ jsxRuntimeExports.jsx(HorizontallySingle, {}) },
+      { label: localeService.t("toolbar.alignRight"), value: String(HorizontalAlign.RIGHT), icon: /* @__PURE__ */ jsxRuntimeExports.jsx(RightJustifyingSingle, {}) },
+      { label: localeService.t("toolbar.alignJustify"), value: String(HorizontalAlign.JUSTIFIED), icon: /* @__PURE__ */ jsxRuntimeExports.jsx(AlignTextBothSingle, {}) }
+    ],
+    []
+  ), currentParagraph = useCurrentParagraph(), [horizontalAlignValue, horizontalAlignSet] = useFirstParagraphHorizontalAlign(currentParagraph, alignmentOptions[0].value), [indentStart, indentStartSet] = useFirstParagraphIndentStart(currentParagraph), [indentEnd, indentEndSet] = useFirstParagraphIndentEnd(currentParagraph), [indentFirstLine, indentFirstLineSet] = useFirstParagraphIndentFirstLine(currentParagraph), [hanging, hangingSet] = useFirstParagraphIndentHanging(currentParagraph), [spaceAbove, spaceAboveSet] = useFirstParagraphIndentSpaceAbove(currentParagraph), [spaceBelow, spaceBelowSet] = useFirstParagraphSpaceBelow(currentParagraph), [lineSpacing, lineSpacingSet] = useFirstParagraphLineSpacing(currentParagraph);
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.paragraphSetting, children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$1.paragraphSettingTitle, children: localeService.t("doc.paragraphSetting.alignment") }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${styles$1.paragraphSettingIconList} ${styles$1.paragraphSettingMtBase}`, children: alignmentOptions.map((item) => /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip, { title: item.label, placement: "bottom", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "span",
+      {
+        className: clsx(
+          styles$1.paragraphSettingIconListItem,
+          { [styles$1.paragraphSettingIconListActive]: horizontalAlignValue === item.value }
+        ),
+        onClick: /* @__PURE__ */ __name(() => horizontalAlignSet(item.value), "onClick"),
+        children: item.icon
+      }
+    ) }, item.value)) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$1.paragraphSettingTitle, children: localeService.t("doc.paragraphSetting.indentation") }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.paragraphSettingFlexCol, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.paragraphSettingLabel, children: [
+          localeService.t("doc.paragraphSetting.left"),
+          "(px)"
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(AutoFocusInputNumber, { className: styles$1.paragraphSettingMtBase, value: indentStart, onChange: /* @__PURE__ */ __name((v) => indentStartSet(v != null ? v : 0), "onChange") })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.paragraphSettingFlexCol, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.paragraphSettingLabel, children: [
+          localeService.t("doc.paragraphSetting.right"),
+          "(px)"
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(AutoFocusInputNumber, { className: styles$1.paragraphSettingMtBase, value: indentEnd, onChange: /* @__PURE__ */ __name((v) => indentEndSet(v != null ? v : 0), "onChange") })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.paragraphSettingFlexCol, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.paragraphSettingLabel, children: [
+          localeService.t("doc.paragraphSetting.firstLine"),
+          "(px)"
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(AutoFocusInputNumber, { className: styles$1.paragraphSettingMtBase, value: indentFirstLine, onChange: /* @__PURE__ */ __name((v) => indentFirstLineSet(v != null ? v : 0), "onChange") })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.paragraphSettingFlexCol, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.paragraphSettingLabel, children: [
+          localeService.t("doc.paragraphSetting.hanging"),
+          "(px)"
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(AutoFocusInputNumber, { className: styles$1.paragraphSettingMtBase, value: hanging, onChange: /* @__PURE__ */ __name((v) => hangingSet(v != null ? v : 0), "onChange") })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$1.paragraphSettingTitle, children: localeService.t("doc.paragraphSetting.spacing") }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.paragraphSettingFlexCol, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.paragraphSettingLabel, children: [
+          localeService.t("doc.paragraphSetting.before"),
+          "(px)"
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(AutoFocusInputNumber, { className: styles$1.paragraphSettingMtBase, value: spaceAbove, onChange: /* @__PURE__ */ __name((v) => spaceAboveSet(v != null ? v : 0), "onChange") })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.paragraphSettingFlexCol, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.paragraphSettingLabel, children: [
+          localeService.t("doc.paragraphSetting.after"),
+          "(px)"
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(AutoFocusInputNumber, { className: styles$1.paragraphSettingMtBase, value: spaceBelow, onChange: /* @__PURE__ */ __name((v) => spaceBelowSet(v != null ? v : 0), "onChange") })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.paragraphSettingFlexCol, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$1.paragraphSettingLabel, children: localeService.t("doc.paragraphSetting.lineSpace") }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(AutoFocusInputNumber, { min: 1, max: 5, className: styles$1.paragraphSettingMtBase, value: lineSpacing, onChange: /* @__PURE__ */ __name((v) => lineSpacingSet(v != null ? v : 0), "onChange") })
+      ] })
+    ] })
+  ] });
+}
+__name(ParagraphSetting, "ParagraphSetting");
+const isRangesEqual = /* @__PURE__ */ __name((oldRanges, ranges) => ranges.length === oldRanges.length && oldRanges.some((oldRange) => ranges.some((range) => range.startOffset === oldRange.startOffset && range.endOffset === oldRange.endOffset)), "isRangesEqual"), isRangesIntersection = /* @__PURE__ */ __name((oldRanges, ranges) => oldRanges.some((oldRange) => ranges.some((range) => {
+  const { startOffset: activeStart, endOffset: activeEnd } = oldRange, { startOffset: compareStart, endOffset: compareEnd } = range;
+  return activeStart == null || activeEnd == null || compareStart == null || compareEnd == null ? !1 : activeStart <= compareEnd && activeEnd >= compareStart;
+})), "isRangesIntersection");
+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;
+      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 : [];
+        params.trigger !== DocParagraphSettingCommand.id && isRangesIntersection(ranges, rangeRef.current) && keySet(generateRandomId(4));
+      }
+    });
+    return () => dispose.dispose();
+  }, []), useEffect(() => {
+    keySet(generateRandomId(4));
+  }, [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--)
+    (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");
+const paragraphSettingIndexKey = "doc_ui_paragraph-setting-panel";
+var _a6;
+let DocParagraphSettingController = (_a6 = class extends Disposable {
+  constructor(_commandService, _componentManager, _sidebarService) {
+    super(), this._commandService = _commandService, this._componentManager = _componentManager, this._sidebarService = _sidebarService, this._init();
+  }
+  _init() {
+    this.disposeWithMe(this._componentManager.register(paragraphSettingIndexKey, ParagraphSettingIndex));
+  }
+  openPanel() {
+    const props = {
+      header: { title: "doc.slider.paragraphSetting" },
+      children: {
+        label: paragraphSettingIndexKey
+      },
+      width: 300
+    };
+    this._sidebarService.open(props);
+  }
+}, __name(_a6, "DocParagraphSettingController"), _a6);
+DocParagraphSettingController = __decorateClass$g([
+  OnLifecycle(LifecycleStages.Rendered, DocParagraphSettingController),
+  __decorateParam$g(0, ICommandService),
+  __decorateParam$g(1, Inject(ComponentManager)),
+  __decorateParam$g(2, Inject(ISidebarService))
+], DocParagraphSettingController);
+const DocParagraphSettingPanelOperation = {
+  id: "sidebar.operation.doc-paragraph-setting-panel",
+  type: CommandType.OPERATION,
+  handler: /* @__PURE__ */ __name((accessor) => (accessor.get(DocParagraphSettingController).openPanel(), !0), "handler")
 }, getDisableOnCollapsedObservable = /* @__PURE__ */ __name((accessor) => {
   const textSelectionManagerService = accessor.get(TextSelectionManagerService);
   return new Observable((subscriber) => {
-    const observable = textSelectionManagerService.textSelection$.subscribe((selections) => {
-      const range = textSelectionManagerService.getActiveRange();
+    const observable = textSelectionManagerService.textSelection$.subscribe(() => {
+      const range = textSelectionManagerService.getActiveTextRangeWithStyle();
       range && !range.collapsed ? subscriber.next(!1) : subscriber.next(!0);
     });
     return () => observable.unsubscribe();
   });
-}, "getDisableOnCollapsedObservable"), CopyMenuFactory = /* @__PURE__ */ __name((accessor) => ({
-  id: DocCopyCommand.id,
+}, "getDisableOnCollapsedObservable");
+function inSameTable(rectRanges) {
+  if (rectRanges.length < 2)
+    return !0;
+  const tableIds = rectRanges.map((rectRange) => rectRange.tableId);
+  return tableIds.every((tableId) => tableId === tableIds[0]);
+}
+__name(inSameTable, "inSameTable");
+const getDisableWhenSelectionNotInTableObservable = /* @__PURE__ */ __name((accessor) => {
+  const textSelectionManagerService = accessor.get(TextSelectionManagerService), univerInstanceService = accessor.get(IUniverInstanceService);
+  return new Observable((subscriber) => {
+    const observable = textSelectionManagerService.textSelection$.subscribe(() => {
+      var _a23;
+      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;
+        if (tables && tables.length && tables.some((table) => {
+          const { startIndex, endIndex } = table;
+          return startOffset > startIndex && startOffset < endIndex || endOffset > startIndex && endOffset < endIndex;
+        })) {
+          subscriber.next(!1);
+          return;
+        }
+      }
+      subscriber.next(!0);
+    });
+    return () => observable.unsubscribe();
+  });
+}, "getDisableWhenSelectionNotInTableObservable"), CopyMenuFactory = /* @__PURE__ */ __name((accessor) => ({
+  id: DocCopyCommand.name,
+  commandId: DocCopyCommand.id,
   group: MenuGroup.CONTEXT_MENU_FORMAT,
   type: MenuItemType.BUTTON,
   icon: "Copy",
@@ -1967,7 +2858,14 @@ const DOC_CLIPBOARD_PRIORITY = 999, DocCopyCommand = {
   positions: [MenuPosition.CONTEXT_MENU],
   disabled$: getDisableOnCollapsedObservable(accessor),
   hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
-}), "CopyMenuFactory"), CutMenuFactory = /* @__PURE__ */ __name((accessor) => ({
+}), "CopyMenuFactory"), ParagraphSettingMenuFactory = /* @__PURE__ */ __name((accessor) => ({
+  id: DocParagraphSettingPanelOperation.id,
+  type: MenuItemType.BUTTON,
+  icon: "MenuSingle24",
+  title: "doc.menu.paragraphSetting",
+  positions: [MenuPosition.CONTEXT_MENU],
+  hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
+}), "ParagraphSettingMenuFactory"), CutMenuFactory = /* @__PURE__ */ __name((accessor) => ({
   id: DocCutCommand.id,
   group: MenuGroup.CONTEXT_MENU_FORMAT,
   type: MenuItemType.BUTTON,
@@ -1980,85 +2878,146 @@ const DOC_CLIPBOARD_PRIORITY = 999, DocCopyCommand = {
   id: DocPasteCommand.id,
   group: MenuGroup.CONTEXT_MENU_FORMAT,
   type: MenuItemType.BUTTON,
-  icon: "PasteSpecial",
-  title: "rightClick.paste",
-  positions: [MenuPosition.CONTEXT_MENU],
-  hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
-}), "PasteMenuFactory"), DeleteMenuFactory = /* @__PURE__ */ __name((accessor) => ({
-  id: DeleteLeftCommand.id,
-  group: MenuGroup.CONTEXT_MENU_FORMAT,
-  type: MenuItemType.BUTTON,
-  icon: "PasteSpecial",
-  title: "rightClick.delete",
-  positions: [MenuPosition.CONTEXT_MENU],
-  disabled$: getDisableOnCollapsedObservable(accessor),
-  hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
-}), "DeleteMenuFactory"), BoldShortCut = {
-  id: SetInlineFormatBoldCommand.id,
-  binding: KeyCode.B | MetaKeys.CTRL_COMMAND,
-  preconditions: whenDocAndEditorFocused
-}, ItalicShortCut = {
-  id: SetInlineFormatItalicCommand.id,
-  binding: KeyCode.I | MetaKeys.CTRL_COMMAND,
-  preconditions: whenDocAndEditorFocused
-}, UnderlineShortCut = {
-  id: SetInlineFormatUnderlineCommand.id,
-  binding: KeyCode.U | MetaKeys.CTRL_COMMAND,
-  preconditions: whenDocAndEditorFocused
-}, StrikeThroughShortCut = {
-  id: SetInlineFormatStrikethroughCommand.id,
-  binding: KeyCode.X | MetaKeys.SHIFT | MetaKeys.CTRL_COMMAND,
-  preconditions: whenDocAndEditorFocused
-}, SubscriptShortCut = {
-  id: SetInlineFormatSubscriptCommand.id,
-  binding: KeyCode.COMMA | MetaKeys.CTRL_COMMAND,
-  preconditions: whenDocAndEditorFocused
-}, SuperscriptShortCut = {
-  id: SetInlineFormatSuperscriptCommand.id,
-  binding: KeyCode.PERIOD | MetaKeys.CTRL_COMMAND,
-  preconditions: whenDocAndEditorFocused
-}, AlignLeftShortCut = {
-  id: AlignLeftCommand.id,
-  binding: KeyCode.L | MetaKeys.CTRL_COMMAND | MetaKeys.SHIFT,
-  preconditions: whenDocAndEditorFocused
-}, AlignRightShortCut = {
-  id: AlignRightCommand.id,
-  binding: KeyCode.R | MetaKeys.CTRL_COMMAND | MetaKeys.SHIFT,
-  preconditions: whenDocAndEditorFocused
-}, AlignCenterShortCut = {
-  id: AlignCenterCommand.id,
-  binding: KeyCode.E | MetaKeys.CTRL_COMMAND | MetaKeys.SHIFT,
-  preconditions: whenDocAndEditorFocused
-}, AlignJustifyShortCut = {
-  id: AlignJustifyCommand.id,
-  binding: KeyCode.J | MetaKeys.CTRL_COMMAND | MetaKeys.SHIFT,
-  preconditions: whenDocAndEditorFocused
-}, OrderListShortCut = {
-  id: OrderListCommand.id,
-  binding: KeyCode.Digit7 | MetaKeys.CTRL_COMMAND | MetaKeys.SHIFT,
-  preconditions: whenDocAndEditorFocused
-}, BulletListShortCut = {
-  id: BulletListCommand.id,
-  binding: KeyCode.Digit8 | MetaKeys.CTRL_COMMAND | MetaKeys.SHIFT,
-  preconditions: whenDocAndEditorFocused
-};
-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--)
+  icon: "PasteSpecial",
+  title: "rightClick.paste",
+  positions: [MenuPosition.CONTEXT_MENU],
+  hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
+}), "PasteMenuFactory"), DeleteMenuFactory = /* @__PURE__ */ __name((accessor) => ({
+  id: DeleteLeftCommand.id,
+  group: MenuGroup.CONTEXT_MENU_FORMAT,
+  type: MenuItemType.BUTTON,
+  icon: "PasteSpecial",
+  title: "rightClick.delete",
+  positions: [MenuPosition.CONTEXT_MENU],
+  disabled$: getDisableOnCollapsedObservable(accessor),
+  hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
+}), "DeleteMenuFactory"), TABLE_INSERT_MENU_ID = "doc.menu.table-insert";
+function TableInsertMenuItemFactory(accessor) {
+  return {
+    id: TABLE_INSERT_MENU_ID,
+    group: MenuGroup.CONTEXT_MENU_LAYOUT,
+    type: MenuItemType.SUBITEMS,
+    title: "table.insert",
+    icon: "Insert",
+    positions: [MenuPosition.CONTEXT_MENU],
+    hidden$: combineLatest(getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC), getDisableWhenSelectionNotInTableObservable(accessor), (one, two) => one || two)
+  };
+}
+__name(TableInsertMenuItemFactory, "TableInsertMenuItemFactory");
+function InsertRowBeforeMenuItemFactory(accessor) {
+  return {
+    id: DocTableInsertRowAboveCommand.id,
+    type: MenuItemType.BUTTON,
+    title: "table.insertRowAbove",
+    icon: "InsertRowAbove",
+    positions: [TABLE_INSERT_MENU_ID],
+    disabled$: getDisableWhenSelectionNotInTableObservable(accessor),
+    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
+  };
+}
+__name(InsertRowBeforeMenuItemFactory, "InsertRowBeforeMenuItemFactory");
+function InsertRowAfterMenuItemFactory(accessor) {
+  return {
+    id: DocTableInsertRowBellowCommand.id,
+    type: MenuItemType.BUTTON,
+    positions: [TABLE_INSERT_MENU_ID],
+    title: "table.insertRowBelow",
+    icon: "InsertRowBelow",
+    disabled$: getDisableWhenSelectionNotInTableObservable(accessor),
+    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
+  };
+}
+__name(InsertRowAfterMenuItemFactory, "InsertRowAfterMenuItemFactory");
+function InsertColumnLeftMenuItemFactory(accessor) {
+  return {
+    id: DocTableInsertColumnLeftCommand.id,
+    type: MenuItemType.BUTTON,
+    title: "table.insertColumnLeft",
+    icon: "LeftInsertColumn",
+    positions: [TABLE_INSERT_MENU_ID],
+    disabled$: getDisableWhenSelectionNotInTableObservable(accessor),
+    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
+  };
+}
+__name(InsertColumnLeftMenuItemFactory, "InsertColumnLeftMenuItemFactory");
+function InsertColumnRightMenuItemFactory(accessor) {
+  return {
+    id: DocTableInsertColumnRightCommand.id,
+    type: MenuItemType.BUTTON,
+    positions: [TABLE_INSERT_MENU_ID],
+    title: "table.insertColumnRight",
+    icon: "RightInsertColumn",
+    disabled$: getDisableWhenSelectionNotInTableObservable(accessor),
+    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
+  };
+}
+__name(InsertColumnRightMenuItemFactory, "InsertColumnRightMenuItemFactory");
+const TABLE_DELETE_MENU_ID = "doc.menu.table-delete";
+function TableDeleteMenuItemFactory(accessor) {
+  return {
+    id: TABLE_DELETE_MENU_ID,
+    group: MenuGroup.CONTEXT_MENU_LAYOUT,
+    type: MenuItemType.SUBITEMS,
+    title: "table.delete",
+    icon: "Reduce",
+    positions: [MenuPosition.CONTEXT_MENU],
+    hidden$: combineLatest(getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC), getDisableWhenSelectionNotInTableObservable(accessor), (one, two) => one || two)
+  };
+}
+__name(TableDeleteMenuItemFactory, "TableDeleteMenuItemFactory");
+function DeleteRowsMenuItemFactory(accessor) {
+  return {
+    id: DocTableDeleteRowsCommand.id,
+    type: MenuItemType.BUTTON,
+    title: "table.deleteRows",
+    icon: "DeleteRow",
+    positions: [TABLE_DELETE_MENU_ID],
+    disabled$: getDisableWhenSelectionNotInTableObservable(accessor),
+    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
+  };
+}
+__name(DeleteRowsMenuItemFactory, "DeleteRowsMenuItemFactory");
+function DeleteColumnsMenuItemFactory(accessor) {
+  return {
+    id: DocTableDeleteColumnsCommand.id,
+    type: MenuItemType.BUTTON,
+    positions: [TABLE_DELETE_MENU_ID],
+    title: "table.deleteColumns",
+    icon: "DeleteColumn",
+    disabled$: getDisableWhenSelectionNotInTableObservable(accessor),
+    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
+  };
+}
+__name(DeleteColumnsMenuItemFactory, "DeleteColumnsMenuItemFactory");
+function DeleteTableMenuItemFactory(accessor) {
+  return {
+    id: DocTableDeleteTableCommand.id,
+    type: MenuItemType.BUTTON,
+    positions: [TABLE_DELETE_MENU_ID],
+    title: "table.deleteTable",
+    icon: "GridSingle",
+    disabled$: getDisableWhenSelectionNotInTableObservable(accessor),
+    hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_DOC)
+  };
+}
+__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--)
     (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"), _a6;
-let DocUIController = (_a6 = class extends Disposable {
-  constructor(_config, _injector, _componentManager, _layoutService, _menuService, _uiPartsService, _univerInstanceService, _shortcutService) {
-    super(), this._config = _config, this._injector = _injector, this._componentManager = _componentManager, this._layoutService = _layoutService, this._menuService = _menuService, this._uiPartsService = _uiPartsService, this._univerInstanceService = _univerInstanceService, this._shortcutService = _shortcutService, this._init();
+  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;
+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();
   }
   _initCustomComponents() {
     const componentManager = this._componentManager;
-    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(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 _a19, _b;
+    var _a23, _b;
     const workbook = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET);
-    (_b = (_a19 = this._config.layout) == null ? void 0 : _a19.docContainerConfig) != null && _b.footer && !workbook && this.disposeWithMe(this._uiPartsService.registerComponent(BuiltInUIPart.FOOTER, () => connectInjector(DocFooter, this._injector)));
+    (_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)));
   }
   _initMenus() {
     const { menu = {} } = this._config;
@@ -2073,12 +3032,15 @@ let DocUIController = (_a6 = class extends Disposable {
       FontFamilySelectorMenuItemFactory,
       TextColorSelectorMenuItemFactory,
       HeaderFooterMenuItemFactory,
+      TableMenuFactory,
+      InsertTableMenuFactory,
       AlignLeftMenuItemFactory,
       AlignCenterMenuItemFactory,
       AlignRightMenuItemFactory,
       AlignJustifyMenuItemFactory,
       OrderListMenuItemFactory,
       BulletListMenuItemFactory,
+      CheckListMenuItemFactory,
       ResetBackgroundColorMenuItemFactory,
       BackgroundColorSelectorMenuItemFactory
     ].forEach((factory) => {
@@ -2087,7 +3049,17 @@ let DocUIController = (_a6 = class extends Disposable {
       CopyMenuFactory,
       CutMenuFactory,
       PasteMenuFactory,
-      DeleteMenuFactory
+      DeleteMenuFactory,
+      ParagraphSettingMenuFactory,
+      TableInsertMenuItemFactory,
+      InsertRowBeforeMenuItemFactory,
+      InsertRowAfterMenuItemFactory,
+      InsertColumnLeftMenuItemFactory,
+      InsertColumnRightMenuItemFactory,
+      TableDeleteMenuItemFactory,
+      DeleteRowsMenuItemFactory,
+      DeleteColumnsMenuItemFactory,
+      DeleteTableMenuItemFactory
     ].forEach((factory) => {
       try {
         this.disposeWithMe(this._menuService.addMenuItem(this._injector.invoke(factory), menu));
@@ -2108,13 +3080,21 @@ let DocUIController = (_a6 = class extends Disposable {
       AlignRightShortCut,
       AlignLeftShortCut,
       OrderListShortCut,
-      BulletListShortCut
+      BulletListShortCut,
+      TabShortCut
     ].forEach((shortcut) => {
       this.disposeWithMe(this._shortcutService.registerShortcut(shortcut));
     });
   }
   _init() {
-    this._initCustomComponents(), this._initMenus(), this._initFocusHandler(), this._initUiParts(), this._initShortCut();
+    this._initCustomComponents(), this._initMenus(), this._initFocusHandler(), this._initCommands(), this._initUiParts(), this._initShortCut();
+  }
+  _initCommands() {
+    [
+      CoreHeaderFooterCommand,
+      OpenHeaderFooterPanelCommand,
+      SidebarDocHeaderFooterPanelOperation
+    ].forEach((command) => this.disposeWithMe(this._commandService.registerCommand(command)));
   }
   _initFocusHandler() {
     this.disposeWithMe(
@@ -2123,19 +3103,20 @@ let DocUIController = (_a6 = class extends Disposable {
       })
     );
   }
-}, __name(_a6, "DocUIController"), _a6);
-DocUIController = __decorateClass$c([
+}, __name(_a7, "DocUIController"), _a7);
+DocUIController = __decorateClass$f([
   OnLifecycle(LifecycleStages.Rendered, DocUIController),
-  __decorateParam$c(1, Inject(Injector)),
-  __decorateParam$c(2, Inject(ComponentManager)),
-  __decorateParam$c(3, ILayoutService),
-  __decorateParam$c(4, IMenuService),
-  __decorateParam$c(5, IUIPartsService),
-  __decorateParam$c(6, IUniverInstanceService),
-  __decorateParam$c(7, IShortcutService)
+  __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)
 ], DocUIController);
 const BreakLineShortcut = {
-  id: BreakLineCommand.id,
+  id: EnterCommand.id,
   preconditions: whenDocAndEditorFocusedWithBreakLine,
   binding: KeyCode.ENTER
 }, DeleteLeftShortcut = {
@@ -2147,12 +3128,12 @@ const BreakLineShortcut = {
   preconditions: whenDocAndEditorFocused,
   binding: KeyCode.DELETE
 };
-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$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$b(target, key, result), result;
-}, "__decorateClass$b"), __decorateParam$b = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$b"), _a7;
-let DocClipboardController = (_a7 = class extends RxDisposable {
+  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;
+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();
   }
@@ -2160,31 +3141,31 @@ let DocClipboardController = (_a7 = 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 _a19;
-    (_a19 = this._textSelectionRenderManager) == null || _a19.onPaste$.pipe(takeUntil(this.dispose$)).subscribe((config) => {
-      var _a20, _b;
+    var _a23;
+    (_a23 = this._textSelectionRenderManager) == null || _a23.onPaste$.pipe(takeUntil(this.dispose$)).subscribe((config) => {
+      var _a24, _b;
       if (!whenDocOrEditor(this._contextService))
         return;
       config.event.preventDefault();
-      const clipboardEvent = config.event, htmlContent = (_a20 = clipboardEvent.clipboardData) == null ? void 0 : _a20.getData("text/html"), textContent = (_b = clipboardEvent.clipboardData) == null ? void 0 : _b.getData("text/plain");
+      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);
     });
   }
-}, __name(_a7, "DocClipboardController"), _a7);
-DocClipboardController = __decorateClass$b([
+}, __name(_a8, "DocClipboardController"), _a8);
+DocClipboardController = __decorateClass$e([
   OnLifecycle(LifecycleStages.Rendered, DocClipboardController),
-  __decorateParam$b(0, ICommandService),
-  __decorateParam$b(1, IClipboardInterfaceService),
-  __decorateParam$b(2, IDocClipboardService),
-  __decorateParam$b(3, ITextSelectionRenderManager),
-  __decorateParam$b(4, IContextService)
+  __decorateParam$e(0, ICommandService),
+  __decorateParam$e(1, IClipboardInterfaceService),
+  __decorateParam$e(2, IDocClipboardService),
+  __decorateParam$e(3, ITextSelectionRenderManager),
+  __decorateParam$e(4, IContextService)
 ], DocClipboardController);
-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$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$a(target, key, result), result;
-}, "__decorateClass$a"), __decorateParam$a = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$a"), _a8;
-let DocEditorBridgeController = (_a8 = class extends Disposable {
+  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;
+let DocEditorBridgeController = (_a9 = class extends Disposable {
   constructor(_univerInstanceService, _editorService, _commandService, _textSelectionRenderManager, _renderManagerService) {
     super();
     __publicField(this, "_initialEditors", /* @__PURE__ */ new Set());
@@ -2201,7 +3182,7 @@ let DocEditorBridgeController = (_a8 = class extends Disposable {
     }), this._commandExecutedListener(), this._initialSetValue(), this._initialBlur(), this._initialFocus(), this._initialValueChange();
   }
   _resize(unitId) {
-    var _a19, _b, _c;
+    var _a23, _b, _c;
     if (unitId == null)
       return;
     const editor = this._editorService.getEditor(unitId);
@@ -2210,7 +3191,7 @@ let DocEditorBridgeController = (_a8 = class extends Disposable {
     const editorDataModel = this._univerInstanceService.getUniverDocInstance(unitId);
     if (!editorDataModel)
       return;
-    const skeleton = (_a19 = this._renderManagerService.getRenderById(editorDataModel.getUnitId())) == null ? void 0 : _a19.with(DocSkeletonManagerService).getSkeleton();
+    const skeleton = (_a23 = this._renderManagerService.getRenderById(editorDataModel.getUnitId())) == null ? void 0 : _a23.with(DocSkeletonManagerService).getSkeleton();
     if (editor == null || editor.render == null || skeleton == null || editorDataModel == null)
       return;
     skeleton.calculate();
@@ -2239,12 +3220,12 @@ let DocEditorBridgeController = (_a8 = class extends Disposable {
   _initialBlur() {
     this.disposeWithMe(
       this._editorService.blur$.subscribe(() => {
-        this._textSelectionRenderManager.removeAllTextRanges(), this._textSelectionRenderManager.blur();
+        this._textSelectionRenderManager.removeAllRanges(), this._textSelectionRenderManager.blur();
       })
     ), this.disposeWithMe(
       this._textSelectionRenderManager.onBlur$.subscribe(() => {
-        var _a19;
-        const unitId = (_a19 = this._univerInstanceService.getCurrentUniverDocInstance()) == null ? void 0 : _a19.getUnitId();
+        var _a23;
+        const unitId = (_a23 = this._univerInstanceService.getCurrentUniverDocInstance()) == null ? void 0 : _a23.getUnitId();
         if (unitId == null)
           return;
         const editor = this._editorService.getEditor(unitId), focusEditor = this._editorService.getFocusEditor();
@@ -2255,7 +3236,7 @@ let DocEditorBridgeController = (_a8 = class extends Disposable {
   _initialFocus() {
     this.disposeWithMe(
       this._editorService.focus$.subscribe((textRange) => {
-        this._textSelectionRenderManager.removeAllTextRanges(), this._textSelectionRenderManager.addTextRanges([textRange]);
+        this._textSelectionRenderManager.removeAllRanges(), this._textSelectionRenderManager.addDocRanges([textRange]);
       })
     );
     const focusExcepts = [
@@ -2274,7 +3255,7 @@ let DocEditorBridgeController = (_a8 = class extends Disposable {
         this._editorService.changeSpreadsheetFocusState(!1);
       })
     ), this._univerInstanceService.getAllUnitsForType(UniverInstanceType.UNIVER_SHEET).forEach((unit) => {
-      const unitId = unit.getUnitId(), render = this._renderManagerService.getRenderById(unitId), canvasEle = render == null ? void 0 : render.engine.getCanvas().getCanvasEle();
+      const unitId = unit.getUnitId(), render2 = this._renderManagerService.getRenderById(unitId), canvasEle = render2 == null ? void 0 : render2.engine.getCanvas().getCanvasEle();
       canvasEle != null && fromEvent(canvasEle, "mousedown").subscribe((evt) => {
         this._editorService.changeSpreadsheetFocusState(!0), evt.stopPropagation();
       });
@@ -2292,8 +3273,8 @@ let DocEditorBridgeController = (_a8 = class extends Disposable {
     );
   }
   _valueChange() {
-    var _a19;
-    const unitId = (_a19 = this._univerInstanceService.getCurrentUniverDocInstance()) == null ? void 0 : _a19.getUnitId();
+    var _a23;
+    const unitId = (_a23 = this._univerInstanceService.getCurrentUniverDocInstance()) == null ? void 0 : _a23.getUnitId();
     if (unitId == null)
       return;
     const editor = this._editorService.getEditor(unitId);
@@ -2315,27 +3296,27 @@ let DocEditorBridgeController = (_a8 = class extends Disposable {
       })
     );
   }
-}, __name(_a8, "DocEditorBridgeController"), _a8);
-DocEditorBridgeController = __decorateClass$a([
+}, __name(_a9, "DocEditorBridgeController"), _a9);
+DocEditorBridgeController = __decorateClass$d([
   OnLifecycle(LifecycleStages.Rendered, DocEditorBridgeController),
-  __decorateParam$a(0, IUniverInstanceService),
-  __decorateParam$a(1, IEditorService),
-  __decorateParam$a(2, ICommandService),
-  __decorateParam$a(3, ITextSelectionRenderManager),
-  __decorateParam$a(4, IRenderManagerService)
+  __decorateParam$d(0, IUniverInstanceService),
+  __decorateParam$d(1, IEditorService),
+  __decorateParam$d(2, ICommandService),
+  __decorateParam$d(3, ITextSelectionRenderManager),
+  __decorateParam$d(4, IRenderManagerService)
 ], DocEditorBridgeController);
-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$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$9(target, key, result), result;
-}, "__decorateClass$9"), __decorateParam$9 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$9"), _a9;
-let DocRenderController = (_a9 = class extends RxDisposable {
-  constructor(_context, _commandService, _docSkeletonManagerService, _configService, _editorService, _renderManagerService) {
-    super(), this._context = _context, this._commandService = _commandService, this._docSkeletonManagerService = _docSkeletonManagerService, this._configService = _configService, this._editorService = _editorService, this._renderManagerService = _renderManagerService, this._addNewRender(), this._initRenderRefresh(), this._initCommandListener();
+  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;
+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 _a19, _b;
-    const docSkeletonManagerService = (_a19 = this._renderManagerService.getRenderById(unitId)) == null ? void 0 : _a19.with(DocSkeletonManagerService), skeleton = docSkeletonManagerService == null ? void 0 : docSkeletonManagerService.getSkeleton();
+    var _a23, _b;
+    const docSkeletonManagerService = (_a23 = this._renderManagerService.getRenderById(unitId)) == null ? void 0 : _a23.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();
@@ -2355,6 +3336,8 @@ let DocRenderController = (_a9 = class extends RxDisposable {
       isWheelPreventDefaultX: !0
     });
     scene.attachControl(), scene.onMouseWheel$.subscribeEvent((evt, state) => {
+      if (!this._contextService.getContextValue(FOCUSING_DOC))
+        return;
       const e = evt;
       if (e.ctrlKey) {
         const deltaFactor = Math.abs(e.deltaX);
@@ -2399,8 +3382,8 @@ let DocRenderController = (_a9 = class extends RxDisposable {
     }));
   }
   _recalculateSizeBySkeleton(skeleton) {
-    var _a19;
-    const { mainComponent, scene, unitId, components } = this._context, docsComponent = mainComponent, docBackground = components.get(DOCS_VIEW_KEY.BACKGROUND), pages = (_a19 = skeleton.getSkeletonData()) == null ? void 0 : _a19.pages;
+    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;
     if (pages == null)
       return;
     let width = 0, height = 0;
@@ -2410,21 +3393,22 @@ let DocRenderController = (_a9 = class extends RxDisposable {
     }
     docsComponent.resize(width, height), docBackground.resize(width, height), this._editorService.isEditor(unitId) || scene.resize(width, height);
   }
-}, __name(_a9, "DocRenderController"), _a9);
-DocRenderController = __decorateClass$9([
-  __decorateParam$9(1, ICommandService),
-  __decorateParam$9(2, Inject(DocSkeletonManagerService)),
-  __decorateParam$9(3, IConfigService),
-  __decorateParam$9(4, IEditorService),
-  __decorateParam$9(5, IRenderManagerService)
+}, __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);
 const _DocPageLayoutService = class _DocPageLayoutService extends Disposable {
   constructor(_context) {
     super(), this._context = _context;
   }
   calculatePagePosition() {
-    var _a19, _b;
-    const docObject = neoGetDocObject(this._context), zoomRatio = (_b = (_a19 = this._context.unit.getSettings()) == null ? void 0 : _a19.zoomRatio) != null ? _b : 1, { document: docsComponent, scene, docBackground } = docObject, parent = scene == null ? void 0 : scene.getParent(), { width: docsWidth, height: docsHeight, pageMarginLeft, pageMarginTop } = docsComponent;
+    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;
     if (parent == null || docsWidth === Number.POSITIVE_INFINITY || docsHeight === Number.POSITIVE_INFINITY)
       return;
     const { width: engineWidth, height: engineHeight } = parent;
@@ -2438,17 +3422,14 @@ const _DocPageLayoutService = class _DocPageLayoutService extends Disposable {
 };
 __name(_DocPageLayoutService, "DocPageLayoutService");
 let DocPageLayoutService = _DocPageLayoutService;
-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$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$8(target, key, result), result;
-}, "__decorateClass$8"), __decorateParam$8 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$8"), _a10;
-let DocZoomRenderController = (_a10 = class extends Disposable {
-  constructor(_context, _docSkeletonManagerService, _univerInstanceService, _commandService, _textSelectionManagerService, _editorService, _docPageLayoutService) {
-    super(), this._context = _context, this._docSkeletonManagerService = _docSkeletonManagerService, this._univerInstanceService = _univerInstanceService, this._commandService = _commandService, this._textSelectionManagerService = _textSelectionManagerService, this._editorService = _editorService, this._docPageLayoutService = _docPageLayoutService, this._init();
-  }
-  _init() {
-    this._initSkeletonListener(), this._initCommandExecutedListener(), this._initRenderRefresher(), setTimeout(() => this.updateViewZoom(1, !0), 20);
+  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;
+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);
   }
   _initRenderRefresher() {
     this._docSkeletonManagerService.currentSkeleton$.subscribe((param) => {
@@ -2456,7 +3437,7 @@ let DocZoomRenderController = (_a10 = class extends Disposable {
         return;
       const { unitId, scene } = this._context;
       this._editorService.isEditor(unitId) || this.disposeWithMe(scene.onMouseWheel$.subscribeEvent((e) => {
-        if (!e.ctrlKey)
+        if (!e.ctrlKey || !this._contextService.getContextValue(FOCUSING_DOC))
           return;
         const documentModel = this._univerInstanceService.getCurrentUniverDocInstance();
         if (!documentModel)
@@ -2486,37 +3467,33 @@ let DocZoomRenderController = (_a10 = class extends Disposable {
   _initCommandExecutedListener() {
     const updateCommandList = [SetDocZoomRatioOperation.id];
     this.disposeWithMe(this._commandService.onCommandExecuted((command) => {
-      if (updateCommandList.includes(command.id)) {
-        const documentModel = this._univerInstanceService.getCurrentUniverDocInstance();
-        if (!documentModel) return;
-        const params = command.params, { unitId } = params;
-        if (unitId !== documentModel.getUnitId())
-          return;
-        const zoomRatio = documentModel.zoomRatio || 1;
+      if (updateCommandList.includes(command.id) && command.params.unitId === this._context.unitId) {
+        const zoomRatio = this._context.unit.zoomRatio || 1;
         this.updateViewZoom(zoomRatio);
       }
     }));
   }
   updateViewZoom(zoomRatio, needRefreshSelection = !0) {
-    var _a19;
+    var _a23;
     const docObject = neoGetDocObject(this._context);
-    docObject.scene.scale(zoomRatio, zoomRatio), this._docPageLayoutService.calculatePagePosition(), needRefreshSelection && !this._editorService.isEditor(this._context.unitId) && this._textSelectionManagerService.refreshSelection(), (_a19 = docObject.scene.getTransformer()) == null || _a19.clearSelectedObjects();
-  }
-}, __name(_a10, "DocZoomRenderController"), _a10);
-DocZoomRenderController = __decorateClass$8([
-  __decorateParam$8(1, Inject(DocSkeletonManagerService)),
-  __decorateParam$8(2, IUniverInstanceService),
-  __decorateParam$8(3, ICommandService),
-  __decorateParam$8(4, Inject(TextSelectionManagerService)),
-  __decorateParam$8(5, IEditorService),
-  __decorateParam$8(6, Inject(DocPageLayoutService))
+    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();
+  }
+}, __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);
-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$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$7(target, key, result), result;
-}, "__decorateClass$7"), __decorateParam$7 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$7"), _a11;
-let DocTextSelectionRenderController = (_a11 = class extends Disposable {
+  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;
+let DocTextSelectionRenderController = (_a12 = class extends Disposable {
   constructor(_context, _commandService, _editorService, _instanceSrv, _textSelectionRenderManager, _docSkeletonManagerService, _textSelectionManagerService) {
     super();
     __publicField(this, "_loadedMap", /* @__PURE__ */ new WeakSet());
@@ -2555,7 +3532,7 @@ let DocTextSelectionRenderController = (_a11 = class extends Disposable {
         ), viewModel = this._docSkeletonManagerService.getViewModel(), preEditArea = viewModel.getEditArea();
         preEditArea !== DocumentEditArea.BODY && editArea !== DocumentEditArea.BODY && editArea !== preEditArea && viewModel.setEditArea(editArea);
       }
-      if (this._textSelectionRenderManager.eventTrigger(evt), this._editorService.getEditor(unitId)) {
+      if (this._textSelectionRenderManager.onPointDown(evt), this._editorService.getEditor(unitId)) {
         this._setEditorFocus(unitId);
         const { offsetX: offsetX2, offsetY: offsetY2 } = evt;
         setTimeout(() => {
@@ -2587,9 +3564,9 @@ let DocTextSelectionRenderController = (_a11 = class extends Disposable {
     const updateCommandList = [SetDocZoomRatioOperation.id];
     this.disposeWithMe(
       this._commandService.onCommandExecuted((command) => {
-        var _a19;
+        var _a23;
         if (updateCommandList.includes(command.id)) {
-          const params = command.params, { unitId: documentId } = params, unitId = (_a19 = this._textSelectionManagerService.getCurrentSelection()) == null ? void 0 : _a19.unitId;
+          const params = command.params, { unitId: documentId } = params, unitId = (_a23 = this._textSelectionManagerService.getCurrentSelection()) == null ? void 0 : _a23.unitId;
           if (documentId !== unitId)
             return;
           this._textSelectionManagerService.refreshSelection();
@@ -2598,37 +3575,35 @@ let DocTextSelectionRenderController = (_a11 = class extends Disposable {
     );
   }
   _skeletonListener() {
-    this.disposeWithMe(
-      this._docSkeletonManagerService.currentSkeleton$.subscribe((skeleton) => {
-        if (skeleton == null)
-          return;
-        const { scene, mainComponent, unitId } = this._context;
-        this._textSelectionRenderManager.changeRuntime(skeleton, scene, mainComponent), this._textSelectionManagerService.setCurrentSelectionNotRefresh({
-          unitId,
-          subUnitId: ""
-        }), isInternalEditorID(unitId) || this._textSelectionManagerService.replaceTextRanges([
-          {
-            startOffset: 0,
-            endOffset: 0
-          }
-        ], !1);
-      })
-    );
+    let init = !1;
+    this.disposeWithMe(this._docSkeletonManagerService.currentSkeleton$.subscribe((skeleton) => {
+      if (!skeleton) return;
+      const { scene, mainComponent, unitId } = this._context, isInternalEditor = isInternalEditorID(unitId);
+      (init || !isInternalEditorID(this._context.unitId)) && (this._textSelectionRenderManager.changeRuntime(skeleton, scene, mainComponent), this._textSelectionManagerService.setCurrentSelectionNotRefresh({
+        unitId,
+        subUnitId: ""
+      }), isInternalEditor || this._textSelectionManagerService.replaceTextRanges([
+        {
+          startOffset: 0,
+          endOffset: 0
+        }
+      ], !1)), init = !0;
+    }));
   }
-}, __name(_a11, "DocTextSelectionRenderController"), _a11);
-DocTextSelectionRenderController = __decorateClass$7([
-  __decorateParam$7(1, ICommandService),
-  __decorateParam$7(2, IEditorService),
-  __decorateParam$7(3, IUniverInstanceService),
-  __decorateParam$7(4, ITextSelectionRenderManager),
-  __decorateParam$7(5, Inject(DocSkeletonManagerService)),
-  __decorateParam$7(6, Inject(TextSelectionManagerService))
+}, __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);
-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$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$6(target, key, result), result;
-}, "__decorateClass$6"), __decorateParam$6 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$6");
+  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");
 function transformBound2OffsetBound(originBound, scene) {
   const topLeft = transformPosition2Offset(originBound.left, originBound.top, scene), bottomRight = transformPosition2Offset(originBound.right, originBound.bottom, scene);
   return {
@@ -2653,8 +3628,8 @@ function transformPosition2Offset(x, y, scene) {
   };
 }
 __name(transformPosition2Offset, "transformPosition2Offset");
-var _a12;
-let DocCanvasPopManagerService = (_a12 = class extends Disposable {
+var _a13;
+let DocCanvasPopManagerService = (_a13 = class extends Disposable {
   constructor(_globalPopupManagerService, _renderManagerService, _univerInstanceService, _commandService) {
     super(), this._globalPopupManagerService = _globalPopupManagerService, this._renderManagerService = _renderManagerService, this._univerInstanceService = _univerInstanceService, this._commandService = _commandService;
   }
@@ -2687,19 +3662,19 @@ let DocCanvasPopManagerService = (_a12 = class extends Disposable {
     };
   }
   _createRangePositionObserver(range, currentRender) {
-    var _a19;
+    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), { borderBoxPointGroup } = convertor.getRangePointData(startPosition, endPosition);
-      return getLineBounding(borderBoxPointGroup).map((bound) => transformBound2OffsetBound(bound, scene)).map((i) => ({
+      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 = (_a19 = calc()) != null ? _a19 : [], positions$ = new BehaviorSubject(positions), disposable = new DisposableCollection();
+    }, "calc"), positions = (_a23 = calc()) != null ? _a23 : [], positions$ = new BehaviorSubject(positions), disposable = new DisposableCollection();
     disposable.add(this._commandService.onCommandExecuted((commandInfo) => {
       if (commandInfo.id === SetDocZoomRatioOperation.id) {
         const position = calc();
@@ -2765,24 +3740,24 @@ let DocCanvasPopManagerService = (_a12 = class extends Disposable {
       }, "dispose")
     };
   }
-}, __name(_a12, "DocCanvasPopManagerService"), _a12);
-DocCanvasPopManagerService = __decorateClass$6([
-  __decorateParam$6(0, Inject(ICanvasPopupService)),
-  __decorateParam$6(1, IRenderManagerService),
-  __decorateParam$6(2, IUniverInstanceService),
-  __decorateParam$6(3, ICommandService)
+}, __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);
-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$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$5(target, key, result), result;
-}, "__decorateClass$5"), __decorateParam$5 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$5"), _a13;
-let DocsRenderService = (_a13 = class extends RxDisposable {
+  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;
+let DocsRenderService = (_a14 = class extends RxDisposable {
   constructor(_instanceSrv, _renderManagerService) {
     super(), this._instanceSrv = _instanceSrv, this._renderManagerService = _renderManagerService, this._init();
   }
   _init() {
-    this._renderManagerService.createRender$.pipe(takeUntil(this.dispose$)).subscribe((unitId) => this._createRenderWithId(unitId)), this._instanceSrv.getTypeOfUnitAdded$(UniverInstanceType.UNIVER_DOC).pipe(takeUntil(this.dispose$)).subscribe((doc) => this._createRenderer(doc)), this._instanceSrv.getAllUnitsForType(UniverInstanceType.UNIVER_DOC).forEach((documentModel) => this._createRenderer(documentModel)), this._instanceSrv.getTypeOfUnitDisposed$(UniverInstanceType.UNIVER_DOC).pipe(takeUntil(this.dispose$)).subscribe((doc) => this._disposeRenderer(doc));
+    this._renderManagerService.createRender$.pipe(takeUntil(this.dispose$)).subscribe((unitId) => this._createRenderWithId(unitId)), this._instanceSrv.getAllUnitsForType(UniverInstanceType.UNIVER_DOC).forEach((documentModel) => this._createRenderer(documentModel)), this._instanceSrv.getTypeOfUnitAdded$(UniverInstanceType.UNIVER_DOC).pipe(takeUntil(this.dispose$)).subscribe((doc) => this._createRenderer(doc)), this._instanceSrv.getTypeOfUnitDisposed$(UniverInstanceType.UNIVER_DOC).pipe(takeUntil(this.dispose$)).subscribe((doc) => this._disposeRenderer(doc));
   }
   _createRenderer(doc) {
     const unitId = doc.getUnitId();
@@ -2795,31 +3770,31 @@ let DocsRenderService = (_a13 = class extends RxDisposable {
     const unitId = doc.getUnitId();
     this._renderManagerService.removeRender(unitId);
   }
-}, __name(_a13, "DocsRenderService"), _a13);
-DocsRenderService = __decorateClass$5([
+}, __name(_a14, "DocsRenderService"), _a14);
+DocsRenderService = __decorateClass$8([
   OnLifecycle(LifecycleStages.Ready, DocsRenderService),
-  __decorateParam$5(0, IUniverInstanceService),
-  __decorateParam$5(1, IRenderManagerService)
+  __decorateParam$8(0, IUniverInstanceService),
+  __decorateParam$8(1, IRenderManagerService)
 ], DocsRenderService);
-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--)
+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$4(target, key, result), result;
-}, "__decorateClass$4"), __decorateParam$4 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$4");
+  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");
 const SKIP_UNIT_IDS$1 = [
   DEFAULT_EMPTY_DOCUMENT_VALUE,
   DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY,
   DOCS_NORMAL_EDITOR_UNIT_ID_KEY,
   DOCS_ZEN_EDITOR_UNIT_ID_KEY
 ];
-var _a14;
-let DocContextMenuRenderController = (_a14 = class extends Disposable {
+var _a15;
+let DocContextMenuRenderController = (_a15 = class extends Disposable {
   constructor(_context, _contextMenuService, _textSelectionManagerService, _commandService) {
     super(), this._context = _context, this._contextMenuService = _contextMenuService, this._textSelectionManagerService = _textSelectionManagerService, this._commandService = _commandService, SKIP_UNIT_IDS$1.includes(this._context.unitId) || (this._initPointerDown(), this._initEditChange());
   }
   _initPointerDown() {
-    var _a19, _b;
-    const documentsSubscription = ((_b = (_a19 = this._context) == null ? void 0 : _a19.mainComponent) == null ? void 0 : _b.onPointerDown$).subscribeEvent((event) => {
+    var _a23, _b;
+    const documentsSubscription = ((_b = (_a23 = this._context) == null ? void 0 : _a23.mainComponent) == null ? void 0 : _b.onPointerDown$).subscribeEvent((event) => {
       event.button === 2 && this._contextMenuService.triggerContextMenu(event, MenuPosition.CONTEXT_MENU);
     });
     this.disposeWithMe(documentsSubscription);
@@ -2831,24 +3806,24 @@ let DocContextMenuRenderController = (_a14 = class extends Disposable {
       })
     );
   }
-}, __name(_a14, "DocContextMenuRenderController"), _a14);
-DocContextMenuRenderController = __decorateClass$4([
-  __decorateParam$4(1, IContextMenuService),
-  __decorateParam$4(2, Inject(TextSelectionManagerService)),
-  __decorateParam$4(3, ICommandService)
+}, __name(_a15, "DocContextMenuRenderController"), _a15);
+DocContextMenuRenderController = __decorateClass$7([
+  __decorateParam$7(1, IContextMenuService),
+  __decorateParam$7(2, Inject(TextSelectionManagerService)),
+  __decorateParam$7(3, ICommandService)
 ], DocContextMenuRenderController);
-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--)
+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$3(target, key, result), result;
-}, "__decorateClass$3"), __decorateParam$3 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$3");
+  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,
   DOCS_NORMAL_EDITOR_UNIT_ID_KEY
 ];
-var _a15;
-let DocResizeRenderController = (_a15 = class extends Disposable {
+var _a16;
+let DocResizeRenderController = (_a16 = class extends Disposable {
   constructor(_context, _docPageLayoutService, _textSelectionManagerService) {
     super(), this._context = _context, this._docPageLayoutService = _docPageLayoutService, this._textSelectionManagerService = _textSelectionManagerService, SKIP_UNIT_IDS.includes(this._context.unitId) || this._initResize();
   }
@@ -2862,23 +3837,25 @@ let DocResizeRenderController = (_a15 = class extends Disposable {
       })
     );
   }
-}, __name(_a15, "DocResizeRenderController"), _a15);
-DocResizeRenderController = __decorateClass$3([
-  __decorateParam$3(1, Inject(DocPageLayoutService)),
-  __decorateParam$3(2, Inject(TextSelectionManagerService))
+}, __name(_a16, "DocResizeRenderController"), _a16);
+DocResizeRenderController = __decorateClass$6([
+  __decorateParam$6(1, Inject(DocPageLayoutService)),
+  __decorateParam$6(2, Inject(TextSelectionManagerService))
 ], DocResizeRenderController);
-var __defProp$2 = Object.defineProperty, __getOwnPropDesc$2 = Object.getOwnPropertyDescriptor, __decorateClass$2 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$2(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$2(target, key, result), result;
-}, "__decorateClass$2"), __decorateParam$2 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$2"), _a16;
-let DocHoverManagerService = (_a16 = class extends Disposable {
+  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) {
     super();
-    __publicField(this, "_activeCustomRanges$", new BehaviorSubject([]));
+    __publicField(this, "_activeCustomRanges$", new Subject());
     __publicField(this, "activeCustomRanges$", this._activeCustomRanges$.asObservable());
-    __publicField(this, "_activeIndex$", new BehaviorSubject(null));
+    __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();
@@ -2890,7 +3867,7 @@ let DocHoverManagerService = (_a16 = class extends Disposable {
       return documentTransform.clone().invert().applyPoint(originCoord);
   }
   _calcActiveCustomRanges(offsetX, offsetY) {
-    var _a19, _b;
+    var _a23, _b;
     const document = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_DOC);
     if (!document) {
       this._activeCustomRanges$.next([]);
@@ -2915,15 +3892,18 @@ let DocHoverManagerService = (_a16 = class extends Disposable {
     );
     if (node && node.node) {
       const left = node.node.left + pageMarginLeft, right = node.node.left + node.node.width + pageMarginLeft;
-      if (coord.x < left || coord.x > right) {
-        this._activeIndex$.next(null), this._activeCustomRanges$.next([]);
+      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;
       }
-      const index = node.node.parent.st + node.node.parent.glyphGroup.indexOf(node.node);
-      index !== this._activeIndex$.value && this._activeIndex$.next(index);
-      const ranges = (_b = (_a19 = document.getCustomRanges()) == null ? void 0 : _a19.filter((range) => range.startIndex <= index && range.endIndex >= index)) != null ? _b : [], currentRanges = this._activeCustomRanges$.value;
-      if (currentRanges.length === ranges.length && currentRanges.every((range, i) => range.rangeId === ranges[i].rangeId))
+      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);
     }
   }
@@ -2939,23 +3919,23 @@ let DocHoverManagerService = (_a16 = class extends Disposable {
   endScroll() {
     this._scrolling = !1;
   }
-}, __name(_a16, "DocHoverManagerService"), _a16);
-DocHoverManagerService = __decorateClass$2([
-  __decorateParam$2(0, IUniverInstanceService),
-  __decorateParam$2(1, IRenderManagerService)
+}, __name(_a17, "DocHoverManagerService"), _a17);
+DocHoverManagerService = __decorateClass$5([
+  __decorateParam$5(0, IUniverInstanceService),
+  __decorateParam$5(1, IRenderManagerService)
 ], DocHoverManagerService);
-var __defProp$1 = Object.defineProperty, __getOwnPropDesc$1 = Object.getOwnPropertyDescriptor, __decorateClass$1 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$1(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$1(target, key, result), result;
-}, "__decorateClass$1"), __decorateParam$1 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$1"), _a17;
-let DocHoverRenderController = (_a17 = class extends Disposable {
+  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();
   }
   _initPointerDown() {
     this.disposeWithMe(
-      fromEventSubject(this._context.scene.onPointerMove$).pipe(debounceTime(200)).subscribe((evt) => {
+      fromEventSubject(this._context.scene.onPointerMove$).pipe(debounceTime(100)).subscribe((evt) => {
         this._docHoverManagerService.onMouseMove(evt);
       })
     );
@@ -2968,18 +3948,284 @@ let DocHoverRenderController = (_a17 = class extends Disposable {
       this._docHoverManagerService.startScroll();
     })));
   }
-}, __name(_a17, "DocHoverRenderController"), _a17);
-DocHoverRenderController = __decorateClass$1([
-  __decorateParam$1(1, Inject(DocHoverManagerService))
+}, __name(_a18, "DocHoverRenderController"), _a18);
+DocHoverRenderController = __decorateClass$4([
+  __decorateParam$4(1, Inject(DocHoverManagerService))
 ], DocHoverRenderController);
+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 {
+  constructor(_docAutoFormatService) {
+    super(), this._docAutoFormatService = _docAutoFormatService, this._initListTabAutoFormat(), this._initListSpaceAutoFormat(), this._initDefaultEnterFormat(), this._initExitListAutoFormat();
+  }
+  _initListTabAutoFormat() {
+    this.disposeWithMe(
+      this._docAutoFormatService.registerAutoFormat({
+        id: TabCommand.id,
+        match: /* @__PURE__ */ __name((context) => {
+          var _a23;
+          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;
+            });
+            return (bulletParagraphs == null ? void 0 : bulletParagraphs.findIndex((p2) => p2.startIndex === paragraphs[0].startIndex)) !== 0;
+          } else if (paragraphs.length > 1)
+            return !0;
+          return !1;
+        }, "match"),
+        // traverse all paragraphs, set paragraph
+        getMutations(context) {
+          const params = context.commandParams;
+          return [{
+            id: ChangeListNestingLevelCommand.id,
+            params: {
+              type: params != null && params.shift ? ChangeListNestingLevelType.decrease : ChangeListNestingLevelType.increase
+            }
+          }];
+        }
+      })
+    );
+  }
+  _initListSpaceAutoFormat() {
+    this.disposeWithMe(
+      this._docAutoFormatService.registerAutoFormat({
+        id: AfterSpaceCommand.id,
+        match: /* @__PURE__ */ __name((context) => {
+          var _a23;
+          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);
+          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);
+          if (text && Object.keys(QuickListTypeMap).includes(text)) {
+            const type = QuickListTypeMap[text];
+            return [{
+              id: QuickListCommand.id,
+              params: {
+                listType: type,
+                paragraph: paragraphs[0]
+              }
+            }];
+          }
+          return [];
+        }
+      })
+    );
+  }
+  _initExitListAutoFormat() {
+    this.disposeWithMe(
+      this._docAutoFormatService.registerAutoFormat({
+        id: EnterCommand.id,
+        match: /* @__PURE__ */ __name((context) => {
+          const { paragraphs } = context;
+          return !!(paragraphs.length === 1 && paragraphs[0].bullet && paragraphs[0].paragraphStart === paragraphs[0].paragraphEnd);
+        }, "match"),
+        getMutations: /* @__PURE__ */ __name((context) => {
+          const bullet = context.paragraphs[0].bullet;
+          return bullet ? bullet.nestingLevel > 0 ? [{
+            id: ChangeListNestingLevelCommand.id,
+            params: {
+              type: ChangeListNestingLevelType.decrease
+            }
+          }] : [{
+            id: ListOperationCommand.id,
+            params: {
+              listType: context.paragraphs[0].bullet.listType
+            }
+          }] : [];
+        }, "getMutations")
+      })
+    );
+  }
+  _initDefaultEnterFormat() {
+    this.disposeWithMe(
+      this._docAutoFormatService.registerAutoFormat({
+        id: EnterCommand.id,
+        match: /* @__PURE__ */ __name(() => !0, "match"),
+        getMutations() {
+          return [{
+            id: BreakLineCommand.id
+          }];
+        },
+        priority: -9999
+      })
+    );
+  }
+}, __name(_a19, "DocAutoFormatController"), _a19);
+DocAutoFormatController = __decorateClass$3([
+  OnLifecycle(LifecycleStages.Rendered, DocAutoFormatController),
+  __decorateParam$3(0, Inject(DocAutoFormatService))
+], DocAutoFormatController);
+var __defProp$2 = Object.defineProperty, __getOwnPropDesc$2 = Object.getOwnPropertyDescriptor, __decorateClass$2 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  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();
+  }
+  _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
+        });
+      })
+    );
+  }
+  _initHoverCursor() {
+    this.disposeWithMe(
+      this._docHoverManagerService.bullet$.subscribe((paragraph) => {
+        paragraph ? this._context.mainComponent.setCursor(CURSOR_TYPE.POINTER) : this._context.mainComponent.setCursor(CURSOR_TYPE.TEXT);
+      })
+    );
+  }
+  _getTransformCoordForDocumentOffset(document, viewport, evtOffsetX, evtOffsetY) {
+    const { documentTransform } = document.getOffsetConfig(), originCoord = viewport.transformVector2SceneCoord(Vector2.FromArray([evtOffsetX, evtOffsetY]));
+    if (originCoord)
+      return documentTransform.clone().invert().applyPoint(originCoord);
+  }
+}, __name(_a20, "DocChecklistRenderController"), _a20);
+DocChecklistRenderController = __decorateClass$2([
+  __decorateParam$2(1, Inject(DocSkeletonManagerService)),
+  __decorateParam$2(2, ICommandService),
+  __decorateParam$2(3, Inject(DocHoverManagerService))
+], DocChecklistRenderController);
+const create = "univer-create", createItem = "univer-create-item", createLabel = "univer-create-label", createInput = "univer-create-input", styles = {
+  create,
+  createItem,
+  createLabel,
+  createInput
+}, DocCreateTableConfirm = /* @__PURE__ */ __name(({
+  handleRowColChange,
+  tableCreateParams
+}) => {
+  const localeService = useDependency(LocaleService), [rowCount, setRowCount] = useState(3), [colCount, setColCount] = useState(5);
+  function handleInputChange(rowCount2, colCount2) {
+    setRowCount(rowCount2), setColCount(colCount2), handleRowColChange(rowCount2, colCount2);
+  }
+  return __name(handleInputChange, "handleInputChange"), useEffect(() => {
+    setRowCount(tableCreateParams.rowCount), setColCount(tableCreateParams.colCount);
+  }, [tableCreateParams]), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles.create, children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles.createItem, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: styles.createLabel, children: localeService.t("toolbar.table.rowCount") }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        InputNumber,
+        {
+          min: 1,
+          max: 20,
+          precision: 0,
+          value: rowCount,
+          onChange: /* @__PURE__ */ __name((val) => {
+            handleInputChange(val, colCount);
+          }, "onChange"),
+          className: styles.createInput
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles.createItem, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: styles.createLabel, children: localeService.t("toolbar.table.colCount") }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        InputNumber,
+        {
+          min: 1,
+          max: 20,
+          precision: 0,
+          value: colCount,
+          onChange: /* @__PURE__ */ __name((val) => {
+            handleInputChange(rowCount, val);
+          }, "onChange"),
+          className: styles.createInput
+        }
+      )
+    ] })
+  ] });
+}, "DocCreateTableConfirm");
+var __defProp$1 = Object.defineProperty, __getOwnPropDesc$1 = Object.getOwnPropertyDescriptor, __decorateClass$1 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  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 {
+  constructor(_commandService, _componentManager) {
+    super(), this._commandService = _commandService, this._componentManager = _componentManager, this._initialize();
+  }
+  _initialize() {
+    this._init(), this._registerCommands(), this._initCustomComponents();
+  }
+  _registerCommands() {
+    [
+      DocCreateTableOperation
+    ].forEach((command) => this.disposeWithMe(this._commandService.registerCommand(command)));
+  }
+  _initCustomComponents() {
+    const componentManager = this._componentManager;
+    this.disposeWithMe(componentManager.register(COMPONENT_DOC_CREATE_TABLE_CONFIRM, DocCreateTableConfirm));
+  }
+  _init() {
+  }
+}, __name(_a21, "DocTableController"), _a21);
+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"), _a18;
-let UniverDocsUIPlugin = (_a18 = class extends Plugin {
-  constructor(_config, _injector, _renderManagerSrv, _logService) {
-    super(), this._config = _config, this._injector = _injector, this._renderManagerSrv = _renderManagerSrv, this._logService = _logService, this._config = Tools.deepMerge({}, DefaultDocUiConfig, this._config), this._initDependencies(_injector), this._initializeCommands();
+}, "__decorateClass"), __decorateParam = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam"), _a22;
+let UniverDocsUIPlugin = (_a22 = 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();
   }
   onReady() {
     this._initRenderBasics(), this._markDocAsFocused();
@@ -2987,7 +4233,12 @@ let UniverDocsUIPlugin = (_a18 = class extends Plugin {
   onRendered() {
     this._initUI(), this._initRenderModules();
   }
-  _initializeCommands() {
+  _initCommand() {
+    [DocParagraphSettingCommand, DocParagraphSettingPanelOperation].forEach((e) => {
+      this._commandService.registerCommand(e);
+    });
+  }
+  _initializeShortcut() {
     [
       MoveCursorUpShortcut,
       MoveCursorDownShortcut,
@@ -3000,22 +4251,34 @@ let UniverDocsUIPlugin = (_a18 = class extends Plugin {
       SelectAllShortcut,
       DeleteLeftShortcut,
       DeleteRightShortcut,
-      BreakLineShortcut
+      BreakLineShortcut,
+      ShiftTabShortCut
+      // TabShortcut,
+      // ShiftTabShortcut,
     ].forEach((shortcut) => {
       this._injector.get(IShortcutService).registerShortcut(shortcut);
     });
   }
-  _initDependencies(injector) {
+  _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") }],
       [DocClipboardController],
       [DocEditorBridgeController],
+      [DocAutoFormatController],
+      [DocTableController],
       [DocsRenderService],
       [AppUIController, { useFactory: /* @__PURE__ */ __name(() => this._injector.createInstance(AppUIController, this._config), "useFactory") }],
       [IDocClipboardService, { useClass: DocClipboardService }],
       [DocCanvasPopManagerService],
-      [DocHoverManagerService]
-    ].forEach((d) => injector.add(d));
+      [DocHoverManagerService],
+      [DocParagraphSettingController]
+    ], this._config.override).forEach((d) => injector.add(d));
   }
   _markDocAsFocused() {
     const currentService = this._injector.get(IUniverInstanceService), editorService = this._injector.get(IEditorService);
@@ -3049,16 +4312,18 @@ let UniverDocsUIPlugin = (_a18 = class extends Plugin {
       [DocHeaderFooterController],
       [DocResizeRenderController],
       [DocHoverRenderController],
-      [DocContextMenuRenderController]
+      [DocContextMenuRenderController],
+      [DocChecklistRenderController]
     ].forEach((m2) => {
       this._renderManagerSrv.registerRenderModule(UniverInstanceType.UNIVER_DOC, m2);
     });
   }
-}, __name(_a18, "UniverDocsUIPlugin"), __publicField(_a18, "pluginName", DOC_UI_PLUGIN_NAME), __publicField(_a18, "type", UniverInstanceType.UNIVER_DOC), _a18);
+}, __name(_a22, "UniverDocsUIPlugin"), __publicField(_a22, "pluginName", DOC_UI_PLUGIN_NAME), __publicField(_a22, "type", UniverInstanceType.UNIVER_DOC), _a22);
 UniverDocsUIPlugin = __decorateClass([
   __decorateParam(1, Inject(Injector)),
   __decorateParam(2, IRenderManagerService),
-  __decorateParam(3, ILogService)
+  __decorateParam(3, ICommandService),
+  __decorateParam(4, ILogService)
 ], UniverDocsUIPlugin);
 function docDrawingPositionToTransform(position) {
   return {
@@ -3095,10 +4360,12 @@ export {
   DocBackScrollRenderController,
   DocCanvasPopManagerService,
   DocCopyCommand,
+  DocCreateTableOperation,
   DocCutCommand,
   DocHoverManagerService,
   DocPasteCommand,
   DocRenderController,
+  DocUIController,
   DocsRenderService,
   IDocClipboardService,
   PastePluginLark,