@univerjs/docs-ui 0.1.0-beta.5 → 0.1.2

package/lib/es/index.js

@@ -1,14 +1,16 @@
-var Le = Object.defineProperty;
-var Ne = (e, t, n) => t in e ? Le(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
-var h = (e, t, n) => (Ne(e, typeof t != "symbol" ? t + "" : t, n), n);
-import { FOCUSING_DOC as m, Direction as b, EDITOR_ACTIVATED as ge, LocaleService as ee, RxDisposable as Ce, ICommandService as _, BooleanNumber as u, UniverInstanceType as S, BaselineOffset as E, ThemeService as Ue, IUniverInstanceService as te, OnLifecycle as Se, LifecycleStages as Oe, Disposable as Te, Tools as ve, LRUMap as Fe, ColorKit as se, ILogService as Re, toDisposable as $e, CommandType as ne, IContextService as we, Plugin as Be, PluginType as je, DOCS_NORMAL_EDITOR_UNIT_ID_KEY as He, DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY as Ve } from "@univerjs/core";
-import { Inject as y, Injector as Y, Optional as We, createIdentifier as ze } from "@wendellhu/redi";
-import { KeyCode as g, MetaKeys as w, LayoutService as Ye, MenuGroup as O, MenuItemType as T, MenuPosition as v, getMenuHiddenObservable as R, FONT_FAMILY_LIST as ae, FONT_SIZE_LIST as ke, ComponentManager as Ge, FontFamily as Ke, FontFamilyItem as Ze, FontSize as Xe, IShortcutService as ye, IMenuService as qe, IUIController as Je, IClipboardInterfaceService as oe, PLAIN_TEXT_CLIPBOARD_MIME_TYPE as Qe, HTML_CLIPBOARD_MIME_TYPE as et, CopyCommand as tt, CutCommand as nt, PasteCommand as ot } from "@univerjs/ui";
-import { MoveCursorOperation as k, MoveSelectionOperation as G, SelectAllOperation as rt, SetInlineFormatBoldCommand as it, SetTextSelectionsOperation as x, SetInlineFormatCommand as A, SetInlineFormatItalicCommand as st, SetInlineFormatUnderlineCommand as at, SetInlineFormatStrikethroughCommand as ct, SetInlineFormatSubscriptCommand as lt, SetInlineFormatSuperscriptCommand as dt, SetInlineFormatFontFamilyCommand as ce, SetInlineFormatFontSizeCommand as le, SetInlineFormatTextColorCommand as de, OrderListCommand as ut, BulletListCommand as pt, TextSelectionManagerService as Ie, BreakLineCommand as ht, DeleteLeftCommand as ft, DeleteRightCommand as mt, CutContentCommand as be, InnerPasteCommand as xe } from "@univerjs/docs";
-import { ITextSelectionRenderManager as De } from "@univerjs/engine-render";
-import { ColorPicker as _t } from "@univerjs/design";
-import { Observable as I, takeUntil as gt } from "rxjs";
-const Ct = {
+var Et = Object.defineProperty;
+var Dt = (i, e, t) => e in i ? Et(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t;
+var S = (i, e, t) => (Dt(i, typeof e != "symbol" ? e + "" : e, t), t);
+import { FOCUSING_DOC as ye, FOCUSING_UNIVER_EDITOR as ze, FOCUSING_UNIVER_EDITOR_SINGLE_MODE as xt, Direction as j, EDITOR_ACTIVATED as _t, LocaleService as Ve, RxDisposable as ce, ICommandService as O, BooleanNumber as m, UniverInstanceType as I, BaselineOffset as K, ThemeService as Pt, IUniverInstanceService as M, OnLifecycle as P, LifecycleStages as U, Disposable as H, Tools as pt, LRUMap as Ut, ColorKit as qe, ILogService as gt, toDisposable as N, CommandType as ke, IContextService as Lt, IConfigService as Nt, DEFAULT_DOCUMENT_SUB_COMPONENT_ID as $t, IFloatingObjectManagerService as At, Plugin as wt, PluginType as Bt } from "@univerjs/core";
+import { Inject as v, Injector as Ee, Optional as Ft, createIdentifier as jt } from "@wendellhu/redi";
+import { KeyCode as T, MetaKeys as ae, ILayoutService as ft, MenuGroup as y, MenuItemType as E, MenuPosition as D, getMenuHiddenObservable as x, FONT_FAMILY_LIST as Ke, FONT_SIZE_LIST as Wt, ComponentManager as zt, FontFamily as Vt, FontFamilyItem as kt, FontSize as Ht, IEditorService as $, IMenuService as Yt, IUIController as Xt, IClipboardInterfaceService as He, PLAIN_TEXT_CLIPBOARD_MIME_TYPE as Gt, HTML_CLIPBOARD_MIME_TYPE as Zt, CopyCommand as qt, CutCommand as Kt, PasteCommand as Jt, SetEditorResizeOperation as Qt, IShortcutService as en } from "@univerjs/ui";
+import { MoveCursorOperation as De, MoveSelectionOperation as xe, SelectAllOperation as tn, SetInlineFormatBoldCommand as nn, SetTextSelectionsOperation as W, SetInlineFormatCommand as J, SetInlineFormatItalicCommand as rn, SetInlineFormatUnderlineCommand as on, SetInlineFormatStrikethroughCommand as sn, SetInlineFormatSubscriptCommand as cn, SetInlineFormatSuperscriptCommand as an, SetInlineFormatFontFamilyCommand as Je, SetInlineFormatFontSizeCommand as Qe, SetInlineFormatTextColorCommand as et, OrderListCommand as ln, BulletListCommand as dn, TextSelectionManagerService as le, BreakLineCommand as un, DeleteLeftCommand as hn, DeleteRightCommand as _n, CutContentCommand as St, InnerPasteCommand as mt, DocSkeletonManagerService as Q, VIEWPORT_KEY as Pe, CoverContentCommand as pn, RichTextEditingMutation as Ye, DOCS_COMPONENT_MAIN_LAYER_INDEX as tt, DOCS_COMPONENT_HEADER_LAYER_INDEX as gn, DOCS_VIEW_KEY as nt, DOCS_COMPONENT_DEFAULT_Z_INDEX as fn, SetDocZoomRatioOperation as Xe, SetDocZoomRatioCommand as Sn, getDocObject as vt, getDocObjectById as mn } from "@univerjs/docs";
+import { ITextSelectionRenderManager as de, ptToPixel as rt, ScrollBar as Fe, PageLayoutType as it, IRenderManagerService as Y, Viewport as vn, EVENT_TYPE as Cn, Layer as ot, Documents as On, Liquid as Rn, Rect as bn, CURSOR_TYPE as st, NodePositionConvertToCursor as In, getAnchorBounding as Tn } from "@univerjs/engine-render";
+import { connectInjector as Mn } from "@wendellhu/redi/react-bindings";
+import { ColorPicker as yn } from "@univerjs/design";
+import En from "react";
+import { Observable as A, takeUntil as oe, BehaviorSubject as Dn } from "rxjs";
+const xn = {
   undo: !0,
   redo: !0,
   // Undo redo
@@ -36,7 +38,7 @@ const Ct = {
   // 'Wrap mode'
   textRotateMode: !0
   // 'Text Rotation Mode'
-}, St = {
+}, Pn = {
   outerLeft: !1,
   outerRight: !1,
   header: !0,
@@ -49,83 +51,90 @@ const Ct = {
   frozenContent: !1,
   infoBar: !0,
   toolbar: !0
-}, Ot = {
+}, Un = {
   layout: {
-    docContainerConfig: St,
-    toolbarConfig: Ct
+    docContainerConfig: Pn,
+    toolbarConfig: xn
   }
-}, Tt = "DocUI", vt = {
-  id: k.id,
-  binding: g.ARROW_UP,
-  preconditions: (e) => e.getContextValue(m),
+}, Ln = "DocUI";
+function L(i) {
+  return i.getContextValue(ye) && i.getContextValue(ze);
+}
+function Nn(i) {
+  return i.getContextValue(ye) && i.getContextValue(ze) && !i.getContextValue(xt);
+}
+const $n = {
+  id: De.id,
+  binding: T.ARROW_UP,
+  preconditions: L,
   staticParameters: {
-    direction: b.UP
+    direction: j.UP
   }
-}, Rt = {
-  id: k.id,
-  binding: g.ARROW_DOWN,
-  preconditions: (e) => e.getContextValue(m),
+}, An = {
+  id: De.id,
+  binding: T.ARROW_DOWN,
+  preconditions: L,
   staticParameters: {
-    direction: b.DOWN
+    direction: j.DOWN
   }
-}, yt = {
-  id: k.id,
-  binding: g.ARROW_LEFT,
-  preconditions: (e) => e.getContextValue(m),
+}, wn = {
+  id: De.id,
+  binding: T.ARROW_LEFT,
+  preconditions: L,
   staticParameters: {
-    direction: b.LEFT
+    direction: j.LEFT
   }
-}, It = {
-  id: k.id,
-  binding: g.ARROW_RIGHT,
-  preconditions: (e) => e.getContextValue(m),
+}, Bn = {
+  id: De.id,
+  binding: T.ARROW_RIGHT,
+  preconditions: L,
   staticParameters: {
-    direction: b.RIGHT
+    direction: j.RIGHT
   }
-}, bt = {
-  id: G.id,
-  binding: g.ARROW_UP | w.SHIFT,
-  preconditions: (e) => e.getContextValue(m),
+}, Fn = {
+  id: xe.id,
+  binding: T.ARROW_UP | ae.SHIFT,
+  preconditions: L,
   staticParameters: {
-    direction: b.UP
+    direction: j.UP
   }
-}, xt = {
-  id: G.id,
-  binding: g.ARROW_DOWN | w.SHIFT,
-  preconditions: (e) => e.getContextValue(m),
+}, jn = {
+  id: xe.id,
+  binding: T.ARROW_DOWN | ae.SHIFT,
+  preconditions: L,
   staticParameters: {
-    direction: b.DOWN
+    direction: j.DOWN
   }
-}, Dt = {
-  id: G.id,
-  binding: g.ARROW_LEFT | w.SHIFT,
-  preconditions: (e) => e.getContextValue(m),
+}, Wn = {
+  id: xe.id,
+  binding: T.ARROW_LEFT | ae.SHIFT,
+  preconditions: L,
   staticParameters: {
-    direction: b.LEFT
+    direction: j.LEFT
   }
-}, Pt = {
-  id: G.id,
-  binding: g.ARROW_RIGHT | w.SHIFT,
-  preconditions: (e) => e.getContextValue(m),
+}, zn = {
+  id: xe.id,
+  binding: T.ARROW_RIGHT | ae.SHIFT,
+  preconditions: L,
   staticParameters: {
-    direction: b.RIGHT
+    direction: j.RIGHT
   }
-}, Mt = {
-  id: rt.id,
-  binding: g.A | w.CTRL_COMMAND,
-  preconditions: (e) => e.getContextValue(m) || e.getContextValue(ge)
+}, Vn = {
+  id: tn.id,
+  binding: T.A | ae.CTRL_COMMAND,
+  preconditions: (i) => i.getContextValue(ze) && (i.getContextValue(ye) || i.getContextValue(_t))
 };
-var Et = Object.defineProperty, At = Object.getOwnPropertyDescriptor, Lt = (e, t, n, o) => {
-  for (var r = o > 1 ? void 0 : o ? At(t, n) : t, i = e.length - 1, s; i >= 0; i--)
-    (s = e[i]) && (r = (o ? s(t, n, r) : s(r)) || r);
-  return o && r && Et(t, n, r), r;
-}, ue = (e, t) => (n, o) => t(n, o, e);
-let J = class {
-  constructor(e, t, n) {
-    h(this, "_docContainer");
+var kn = Object.defineProperty, Hn = Object.getOwnPropertyDescriptor, Yn = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Hn(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = (n ? o(e, t, r) : o(r)) || r);
+  return n && r && kn(e, t, r), r;
+}, ct = (i, e) => (t, n) => e(t, n, i);
+let je = class {
+  constructor(i, e, t) {
+    S(this, "_docContainer");
     // 获取SheetContainer组件
-    h(this, "getComponent", (e) => {
-      if (this._docContainer = e, !e.getContentRef().current)
+    S(this, "getComponent", (i) => {
+      if (this._docContainer = i, !i.getContentRef().current)
         throw new Error("container is not ready");
     });
     /**
@@ -135,10 +144,10 @@ let J = class {
      * e: {target: HTMLSelectElement } reference from  https://stackoverflow.com/a/48443771
      *
      */
-    h(this, "changeLocale", (e) => {
-      this._localeService.setLocale(e);
+    S(this, "changeLocale", (i) => {
+      this._localeService.setLocale(i);
     });
-    this._config = e, this._localeService = t, this._injector = n;
+    this._config = i, this._localeService = e, this._injector = t;
   }
   getUIConfig() {
     return {
@@ -151,27 +160,27 @@ let J = class {
   getContentRef() {
     return this._docContainer.getContentRef();
   }
-  UIDidMount(e) {
+  UIDidMount(i) {
     if (this._docContainer)
-      return e(this._docContainer);
+      return i(this._docContainer);
   }
   getDocContainer() {
     return this._docContainer;
   }
 };
-J = Lt([
-  ue(1, y(ee)),
-  ue(2, y(Y))
-], J);
-var Nt = Object.defineProperty, Ut = Object.getOwnPropertyDescriptor, Ft = (e, t, n, o) => {
-  for (var r = o > 1 ? void 0 : o ? Ut(t, n) : t, i = e.length - 1, s; i >= 0; i--)
-    (s = e[i]) && (r = (o ? s(t, n, r) : s(r)) || r);
-  return o && r && Nt(t, n, r), r;
-}, H = (e, t) => (n, o) => t(n, o, e);
-let F = class extends Ce {
-  constructor(t, n, o, r, i) {
+je = Yn([
+  ct(1, v(Ve)),
+  ct(2, v(Ee))
+], je);
+var Xn = Object.defineProperty, Gn = Object.getOwnPropertyDescriptor, Zn = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Gn(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = (n ? o(e, t, r) : o(r)) || r);
+  return n && r && Xn(e, t, r), r;
+}, pe = (i, e) => (t, n) => e(t, n, i);
+let ie = class extends ce {
+  constructor(e, t, n, r, s) {
     super();
-    h(this, "_docContainerController");
+    S(this, "_docContainerController");
     /**
      * Change language
      * @param {string} locale new language
@@ -179,364 +188,409 @@ let F = class extends Ce {
      * e: {target: HTMLSelectElement } reference from  https://stackoverflow.com/a/48443771
      *
      */
-    h(this, "changeLocale", (t) => {
-      this._localeService.setLocale(t);
+    S(this, "changeLocale", (e) => {
+      this._localeService.setLocale(e);
     });
-    this._localeService = n, this._injector = o, this._textSelectionRenderManager = r, this._layoutService = i, this._docContainerController = this._injector.createInstance(J, t), this._registerContainer();
+    this._localeService = t, this._injector = n, this._textSelectionRenderManager = r, this._layoutService = s, this._docContainerController = this._injector.createInstance(je, e), this._registerContainer();
   }
   _registerContainer() {
     this._layoutService && this.disposeWithMe(
       // the content editable div should be regarded as part of the applications container
-      this._layoutService.registerContainer(this._textSelectionRenderManager.__getEditorContainer())
+      this._layoutService.registerContainerElement(this._textSelectionRenderManager.__getEditorContainer())
     );
   }
   getDocContainerController() {
     return this._docContainerController;
   }
 };
-F = Ft([
-  H(1, y(ee)),
-  H(2, y(Y)),
-  H(3, De),
-  H(4, We(Ye))
-], F);
-const K = "UI_PLUGIN_DOCS", Pe = `${K}_COLOR_PICKER_COMPONENT`, Me = `${K}_FONT_FAMILY_COMPONENT`, Ee = `${K}_FONT_FAMILY_ITEM_COMPONENT`, Ae = `${K}_FONT_SIZE_COMPONENT`;
-function $t(e) {
-  const t = e.get(_);
+ie = Zn([
+  pe(1, v(Ve)),
+  pe(2, v(Ee)),
+  pe(3, de),
+  pe(4, Ft(ft))
+], ie);
+const Ue = "UI_PLUGIN_DOCS", Ct = `${Ue}_COLOR_PICKER_COMPONENT`, Ot = `${Ue}_FONT_FAMILY_COMPONENT`, Rt = `${Ue}_FONT_FAMILY_ITEM_COMPONENT`, bt = `${Ue}_FONT_SIZE_COMPONENT`;
+var It = { exports: {} }, Le = {};
+/**
+ * @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 qn = En, Kn = Symbol.for("react.element"), Jn = Symbol.for("react.fragment"), Qn = Object.prototype.hasOwnProperty, er = qn.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, tr = { key: !0, ref: !0, __self: !0, __source: !0 };
+function Tt(i, e, t) {
+  var n, r = {}, s = null, o = null;
+  t !== void 0 && (s = "" + t), e.key !== void 0 && (s = "" + e.key), e.ref !== void 0 && (o = e.ref);
+  for (n in e)
+    Qn.call(e, n) && !tr.hasOwnProperty(n) && (r[n] = e[n]);
+  if (i && i.defaultProps)
+    for (n in e = i.defaultProps, e)
+      r[n] === void 0 && (r[n] = e[n]);
+  return { $$typeof: Kn, type: i, key: s, ref: o, props: r, _owner: er.current };
+}
+Le.Fragment = Jn;
+Le.jsx = Tt;
+Le.jsxs = Tt;
+It.exports = Le;
+var nr = It.exports;
+const rr = "univer-docs-ui-canvas-background", ir = {
+  docsUiCanvasBackground: rr
+}, or = () => /* @__PURE__ */ nr.jsx("div", { className: ir.docsUiCanvasBackground });
+function sr(i) {
+  const e = i.get(O);
   return {
-    id: it.id,
-    group: O.TOOLBAR_FORMAT,
-    type: T.BUTTON,
+    id: nn.id,
+    group: y.TOOLBAR_FORMAT,
+    type: E.BUTTON,
     icon: "BoldSingle",
     title: "Set bold",
     tooltip: "toolbar.bold",
-    positions: [v.TOOLBAR_START],
-    activated$: new I((n) => {
-      const o = t.onCommandExecuted((r) => {
-        var s;
-        const i = r.id;
-        if (i === x.id || i === A.id) {
-          const a = D(e);
-          if (a == null)
+    positions: [D.TOOLBAR_START],
+    activated$: new A((t) => {
+      const n = e.onCommandExecuted((r) => {
+        var o;
+        const s = r.id;
+        if (s === W.id || s === J.id) {
+          const c = z(i);
+          if (c == null)
             return;
-          const c = (s = a.ts) == null ? void 0 : s.bl;
-          n.next(c === u.TRUE);
+          const l = (o = c.ts) == null ? void 0 : o.bl;
+          t.next(l === m.TRUE);
         }
       });
-      return n.next(!1), o.dispose;
+      return t.next(!1), n.dispose;
     }),
-    hidden$: R(e, S.DOC)
+    hidden$: x(i, I.DOC)
   };
 }
-function wt(e) {
-  const t = e.get(_);
+function cr(i) {
+  const e = i.get(O);
   return {
-    id: st.id,
-    group: O.TOOLBAR_FORMAT,
-    type: T.BUTTON,
+    id: rn.id,
+    group: y.TOOLBAR_FORMAT,
+    type: E.BUTTON,
     icon: "ItalicSingle",
     title: "Set italic",
     tooltip: "toolbar.italic",
-    positions: [v.TOOLBAR_START],
-    activated$: new I((n) => {
-      const o = t.onCommandExecuted((r) => {
-        var s;
-        const i = r.id;
-        if (i === x.id || i === A.id) {
-          const a = D(e);
-          if (a == null)
+    positions: [D.TOOLBAR_START],
+    activated$: new A((t) => {
+      const n = e.onCommandExecuted((r) => {
+        var o;
+        const s = r.id;
+        if (s === W.id || s === J.id) {
+          const c = z(i);
+          if (c == null)
             return;
-          const c = (s = a.ts) == null ? void 0 : s.it;
-          n.next(c === u.TRUE);
+          const l = (o = c.ts) == null ? void 0 : o.it;
+          t.next(l === m.TRUE);
         }
       });
-      return n.next(!1), o.dispose;
+      return t.next(!1), n.dispose;
     }),
-    hidden$: R(e, S.DOC)
+    hidden$: x(i, I.DOC)
   };
 }
-function Bt(e) {
-  const t = e.get(_);
+function ar(i) {
+  const e = i.get(O);
   return {
-    id: at.id,
-    group: O.TOOLBAR_FORMAT,
-    type: T.BUTTON,
+    id: on.id,
+    group: y.TOOLBAR_FORMAT,
+    type: E.BUTTON,
     icon: "UnderlineSingle",
     title: "Set underline",
     tooltip: "toolbar.underline",
-    positions: [v.TOOLBAR_START],
-    activated$: new I((n) => {
-      const o = t.onCommandExecuted((r) => {
-        var s;
-        const i = r.id;
-        if (i === x.id || i === A.id) {
-          const a = D(e);
-          if (a == null)
+    positions: [D.TOOLBAR_START],
+    activated$: new A((t) => {
+      const n = e.onCommandExecuted((r) => {
+        var o;
+        const s = r.id;
+        if (s === W.id || s === J.id) {
+          const c = z(i);
+          if (c == null)
             return;
-          const c = (s = a.ts) == null ? void 0 : s.ul;
-          n.next((c == null ? void 0 : c.s) === u.TRUE);
+          const l = (o = c.ts) == null ? void 0 : o.ul;
+          t.next((l == null ? void 0 : l.s) === m.TRUE);
         }
       });
-      return n.next(!1), o.dispose;
+      return t.next(!1), n.dispose;
     }),
-    hidden$: R(e, S.DOC)
+    hidden$: x(i, I.DOC)
   };
 }
-function jt(e) {
-  const t = e.get(_);
+function lr(i) {
+  const e = i.get(O);
   return {
-    id: ct.id,
-    group: O.TOOLBAR_FORMAT,
-    type: T.BUTTON,
+    id: sn.id,
+    group: y.TOOLBAR_FORMAT,
+    type: E.BUTTON,
     icon: "StrikethroughSingle",
     title: "Set strike through",
     tooltip: "toolbar.strikethrough",
-    positions: [v.TOOLBAR_START],
-    activated$: new I((n) => {
-      const o = t.onCommandExecuted((r) => {
-        var s;
-        const i = r.id;
-        if (i === x.id || i === A.id) {
-          const a = D(e);
-          if (a == null)
+    positions: [D.TOOLBAR_START],
+    activated$: new A((t) => {
+      const n = e.onCommandExecuted((r) => {
+        var o;
+        const s = r.id;
+        if (s === W.id || s === J.id) {
+          const c = z(i);
+          if (c == null)
             return;
-          const c = (s = a.ts) == null ? void 0 : s.st;
-          n.next((c == null ? void 0 : c.s) === u.TRUE);
+          const l = (o = c.ts) == null ? void 0 : o.st;
+          t.next((l == null ? void 0 : l.s) === m.TRUE);
         }
       });
-      return n.next(!1), o.dispose;
+      return t.next(!1), n.dispose;
     }),
-    hidden$: R(e, S.DOC)
+    hidden$: x(i, I.DOC)
   };
 }
-function Ht(e) {
-  const t = e.get(_);
+function dr(i) {
+  const e = i.get(O);
   return {
-    id: lt.id,
-    group: O.TOOLBAR_FORMAT,
-    type: T.BUTTON,
+    id: cn.id,
+    group: y.TOOLBAR_FORMAT,
+    type: E.BUTTON,
     icon: "SubscriptSingle",
     tooltip: "toolbar.subscript",
-    positions: [v.TOOLBAR_START],
-    activated$: new I((n) => {
-      const o = t.onCommandExecuted((r) => {
-        var s;
-        const i = r.id;
-        if (i === x.id || i === A.id) {
-          const a = D(e);
-          if (a == null)
+    positions: [D.TOOLBAR_START],
+    activated$: new A((t) => {
+      const n = e.onCommandExecuted((r) => {
+        var o;
+        const s = r.id;
+        if (s === W.id || s === J.id) {
+          const c = z(i);
+          if (c == null)
             return;
-          const c = (s = a.ts) == null ? void 0 : s.va;
-          n.next(c === E.SUBSCRIPT);
+          const l = (o = c.ts) == null ? void 0 : o.va;
+          t.next(l === K.SUBSCRIPT);
         }
       });
-      return n.next(!1), o.dispose;
+      return t.next(!1), n.dispose;
     }),
-    hidden$: R(e, S.DOC)
+    hidden$: x(i, I.DOC)
   };
 }
-function Vt(e) {
-  const t = e.get(_);
+function ur(i) {
+  const e = i.get(O);
   return {
-    id: dt.id,
-    group: O.TOOLBAR_FORMAT,
-    type: T.BUTTON,
+    id: an.id,
+    group: y.TOOLBAR_FORMAT,
+    type: E.BUTTON,
     icon: "SuperscriptSingle",
     tooltip: "toolbar.superscript",
-    positions: [v.TOOLBAR_START],
-    activated$: new I((n) => {
-      const o = t.onCommandExecuted((r) => {
-        var s;
-        const i = r.id;
-        if (i === x.id || i === A.id) {
-          const a = D(e);
-          if (a == null)
+    positions: [D.TOOLBAR_START],
+    activated$: new A((t) => {
+      const n = e.onCommandExecuted((r) => {
+        var o;
+        const s = r.id;
+        if (s === W.id || s === J.id) {
+          const c = z(i);
+          if (c == null)
             return;
-          const c = (s = a.ts) == null ? void 0 : s.va;
-          n.next(c === E.SUPERSCRIPT);
+          const l = (o = c.ts) == null ? void 0 : o.va;
+          t.next(l === K.SUPERSCRIPT);
         }
       });
-      return n.next(!1), o.dispose;
+      return t.next(!1), n.dispose;
     }),
-    hidden$: R(e, S.DOC)
+    hidden$: x(i, I.DOC)
   };
 }
-function Wt(e) {
-  const t = e.get(_);
+function hr(i) {
+  const e = i.get(O);
   return {
-    id: ce.id,
+    id: Je.id,
     tooltip: "toolbar.font",
-    group: O.TOOLBAR_FORMAT,
-    type: T.SELECTOR,
-    label: Me,
-    positions: [v.TOOLBAR_START],
-    selections: ae.map((n) => ({
+    group: y.TOOLBAR_FORMAT,
+    type: E.SELECTOR,
+    label: Ot,
+    positions: [D.TOOLBAR_START],
+    selections: Ke.map((t) => ({
       label: {
-        name: Ee,
+        name: Rt,
         hoverable: !0
       },
-      value: n.value
+      value: t.value
     })),
     // disabled$: getCurrentSheetDisabled$(accessor),
-    value$: new I((n) => {
-      const o = ae[0].value, r = t.onCommandExecuted((i) => {
-        var a;
-        const s = i.id;
-        if (s === x.id || s === ce.id) {
-          const c = D(e);
-          if (c == null)
+    value$: new A((t) => {
+      const n = Ke[0].value, r = e.onCommandExecuted((s) => {
+        var c;
+        const o = s.id;
+        if (o === W.id || o === Je.id) {
+          const l = z(i);
+          if (l == null)
             return;
-          const l = (a = c.ts) == null ? void 0 : a.ff;
-          n.next(l != null ? l : o);
+          const d = (c = l.ts) == null ? void 0 : c.ff;
+          t.next(d != null ? d : n);
         }
       });
-      return n.next(o), r.dispose;
+      return t.next(n), r.dispose;
     }),
-    hidden$: R(e, S.DOC)
+    hidden$: x(i, I.DOC)
   };
 }
-function zt(e) {
-  const t = e.get(_);
+function _r(i) {
+  const e = i.get(O);
   return {
-    id: le.id,
-    group: O.TOOLBAR_FORMAT,
-    type: T.SELECTOR,
+    id: Qe.id,
+    group: y.TOOLBAR_FORMAT,
+    type: E.SELECTOR,
     tooltip: "toolbar.fontSize",
     label: {
-      name: Ae,
+      name: bt,
       props: {
         min: 1,
         max: 400
         // disabled$,
       }
     },
-    positions: [v.TOOLBAR_START],
-    selections: ke,
+    positions: [D.TOOLBAR_START],
+    selections: Wt,
     // disabled$,
-    value$: new I((n) => {
-      const r = t.onCommandExecuted((i) => {
-        var a;
-        const s = i.id;
-        if (s === x.id || s === le.id) {
-          const c = D(e);
-          if (c == null)
+    value$: new A((t) => {
+      const r = e.onCommandExecuted((s) => {
+        var c;
+        const o = s.id;
+        if (o === W.id || o === Qe.id) {
+          const l = z(i);
+          if (l == null)
             return;
-          const l = (a = c.ts) == null ? void 0 : a.fs;
-          n.next(l != null ? l : 14);
+          const d = (c = l.ts) == null ? void 0 : c.fs;
+          t.next(d != null ? d : 14);
         }
       });
-      return n.next(14), r.dispose;
+      return t.next(14), r.dispose;
     }),
-    hidden$: R(e, S.DOC)
+    hidden$: x(i, I.DOC)
   };
 }
-function Yt(e) {
-  const t = e.get(_), n = e.get(Ue);
+function pr(i) {
+  const e = i.get(O), t = i.get(Pt);
   return {
-    id: de.id,
+    id: et.id,
     icon: "FontColor",
     tooltip: "toolbar.textColor.main",
-    group: O.TOOLBAR_FORMAT,
-    type: T.BUTTON_SELECTOR,
-    positions: [v.TOOLBAR_START],
+    group: y.TOOLBAR_FORMAT,
+    type: E.BUTTON_SELECTOR,
+    positions: [D.TOOLBAR_START],
     selections: [
       {
         label: {
-          name: Pe,
+          name: Ct,
           hoverable: !1
         }
       }
     ],
-    value$: new I((o) => {
-      const r = n.getCurrentTheme().textColor, i = t.onCommandExecuted((s) => {
-        if (s.id === de.id) {
-          const a = s.params.value;
-          o.next(a != null ? a : r);
+    value$: new A((n) => {
+      const r = t.getCurrentTheme().textColor, s = e.onCommandExecuted((o) => {
+        if (o.id === et.id) {
+          const c = o.params.value;
+          n.next(c != null ? c : r);
         }
       });
-      return o.next(r), i.dispose;
+      return n.next(r), s.dispose;
     }),
-    hidden$: R(e, S.DOC)
+    hidden$: x(i, I.DOC)
     // disabled$: getCurrentSheetDisabled$(accessor),
   };
 }
-function kt(e) {
+function gr(i) {
   return {
-    id: ut.id,
-    group: O.TOOLBAR_LAYOUT,
-    type: T.BUTTON,
+    id: ln.id,
+    group: y.TOOLBAR_LAYOUT,
+    type: E.BUTTON,
     icon: "OrderSingle",
     tooltip: "toolbar.order",
-    positions: [v.TOOLBAR_START],
-    hidden$: R(e, S.DOC)
+    positions: [D.TOOLBAR_START],
+    hidden$: x(i, I.DOC)
   };
 }
-function Gt(e) {
+function fr(i) {
   return {
-    id: pt.id,
-    group: O.TOOLBAR_LAYOUT,
-    type: T.BUTTON,
+    id: dn.id,
+    group: y.TOOLBAR_LAYOUT,
+    type: E.BUTTON,
     icon: "UnorderSingle",
     tooltip: "toolbar.unorder",
-    positions: [v.TOOLBAR_START],
-    hidden$: R(e, S.DOC)
+    positions: [D.TOOLBAR_START],
+    hidden$: x(i, I.DOC)
   };
 }
-function D(e) {
-  var c;
-  const t = e.get(te), n = e.get(Ie), o = t.getCurrentUniverDocInstance(), r = n.getActiveRange();
-  if (o == null || r == null)
+function z(i) {
+  var l;
+  const e = i.get(M), t = i.get(le), n = e.getCurrentUniverDocInstance(), r = t.getActiveRange();
+  if (n == null || r == null)
     return;
-  const i = (c = o.getBody()) == null ? void 0 : c.textRuns;
-  if (i == null)
+  const s = (l = n.getBody()) == null ? void 0 : l.textRuns;
+  if (s == null)
     return;
-  const { startOffset: s } = r;
-  return i.find(({ st: l, ed: p }) => s >= l && s < p);
+  const { startOffset: o } = r;
+  return s.find(({ st: d, ed: u }) => o >= d && o < u);
 }
-var Kt = Object.defineProperty, Zt = Object.getOwnPropertyDescriptor, Xt = (e, t, n, o) => {
-  for (var r = o > 1 ? void 0 : o ? Zt(t, n) : t, i = e.length - 1, s; i >= 0; i--)
-    (s = e[i]) && (r = (o ? s(t, n, r) : s(r)) || r);
-  return o && r && Kt(t, n, r), r;
-}, M = (e, t) => (n, o) => t(n, o, e);
-let V = class extends Te {
-  constructor(e, t, n, o, r, i) {
-    super(), this._injector = e, this._componentManager = t, this._commandService = n, this._shortcutService = o, this._menuService = r, this._uiController = i, this._init();
+var Sr = Object.defineProperty, mr = Object.getOwnPropertyDescriptor, vr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? mr(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = (n ? o(e, t, r) : o(r)) || r);
+  return n && r && Sr(e, t, r), r;
+}, V = (i, e) => (t, n) => e(t, n, i);
+let fe = class extends H {
+  constructor(i, e, t, n, r, s, o) {
+    super(), this._injector = i, this._componentManager = e, this._layoutService = t, this._editorService = n, this._menuService = r, this._uiController = s, this._currentUniverService = o, this._init();
   }
   _initCustomComponents() {
-    const e = this._componentManager;
-    this.disposeWithMe(e.register(Pe, _t)), this.disposeWithMe(e.register(Me, Ke)), this.disposeWithMe(e.register(Ee, Ze)), this.disposeWithMe(e.register(Ae, Xe));
+    const i = this._componentManager;
+    this.disposeWithMe(i.register(Ct, yn)), this.disposeWithMe(i.register(Ot, Vt)), this.disposeWithMe(i.register(Rt, kt)), this.disposeWithMe(i.register(bt, Ht));
   }
   _initMenus() {
     [
-      $t,
-      wt,
-      Bt,
-      jt,
-      Ht,
-      Vt,
-      zt,
-      Wt,
-      Yt,
-      kt,
-      Gt
-    ].forEach((e) => {
-      this.disposeWithMe(this._menuService.addMenuItem(this._injector.invoke(e)));
+      sr,
+      cr,
+      ar,
+      lr,
+      dr,
+      ur,
+      _r,
+      hr,
+      pr,
+      gr,
+      fr
+    ].forEach((i) => {
+      this.disposeWithMe(this._menuService.addMenuItem(this._injector.invoke(i)));
     });
   }
   _init() {
-    this._initCustomComponents(), this._initMenus();
+    this._initCustomComponents(), this._initMenus(), this._initDocBackground();
+  }
+  _initDocBackground() {
+    const i = this._currentUniverService.getAllUniverDocsInstance()[0].getUnitId();
+    if (i == null)
+      return;
+    this._editorService.isEditor(i) || this.disposeWithMe(
+      this._uiController.registerContentComponent(() => Mn(or, this._injector))
+    );
+  }
+  _initFocusHandler() {
+    this.disposeWithMe(
+      this._layoutService.registerFocusHandler(I.DOC, () => {
+        this._injector.get(de).focus();
+      })
+    );
   }
 };
-V = Xt([
-  Se(Oe.Rendered, V),
-  M(0, y(Y)),
-  M(1, y(Ge)),
-  M(2, _),
-  M(3, ye),
-  M(4, qe),
-  M(5, Je)
-], V);
-const Nn = {
+fe = vr([
+  P(U.Rendered, fe),
+  V(0, v(Ee)),
+  V(1, v(zt)),
+  V(2, ft),
+  V(3, $),
+  V(4, Yt),
+  V(5, Xt),
+  V(6, M)
+], fe);
+const xi = {
   toolbar: {
     undo: "Undo",
     redo: "Redo",
@@ -547,6 +601,7 @@ const Nn = {
     strikethrough: "Strikethrough",
     subscript: "Subscript",
     superscript: "Superscript",
+    underline: "Underline",
     textColor: {
       main: "Text color",
       right: "Choose color"
@@ -555,7 +610,7 @@ const Nn = {
     order: "Ordered list",
     unorder: "Unordered list"
   }
-}, qt = {
+}, Cr = {
   toolbar: {
     undo: "撤销",
     redo: "重做",
@@ -575,519 +630,1220 @@ const Nn = {
     order: "有序列表",
     unorder: "无序列表"
   }
-}, Jt = {
-  id: ht.id,
-  preconditions: (e) => e.getContextValue(m),
-  binding: g.ENTER
-}, Qt = {
-  id: ft.id,
-  preconditions: (e) => e.getContextValue(m),
-  binding: g.BACKSPACE
-}, en = {
-  id: mt.id,
-  preconditions: (e) => e.getContextValue(m),
-  binding: g.DELETE
-}, tn = 10, nn = 6;
-function on() {
-  return ve.generateRandomId(nn);
+}, Or = {
+  id: un.id,
+  preconditions: Nn,
+  binding: T.ENTER
+}, Rr = {
+  id: hn.id,
+  preconditions: L,
+  binding: T.BACKSPACE
+}, br = {
+  id: _n.id,
+  preconditions: L,
+  binding: T.DELETE
+}, Ir = 10, Tr = 6;
+function Mr() {
+  return pt.generateRandomId(Tr);
 }
-function rn(e) {
-  const t = e.match(/data-copy-id="([^\s]+)"/);
-  return t && t[1] ? t[1] : null;
+function yr(i) {
+  const e = i.match(/data-copy-id="([^\s]+)"/);
+  return e && e[1] ? e[1] : null;
 }
-class sn {
+class Er {
   constructor() {
-    h(this, "_cache", new Fe(tn));
+    S(this, "_cache", new Ut(Ir));
   }
-  set(t, n) {
-    this._cache.set(t, n);
+  set(e, t) {
+    this._cache.set(e, t);
   }
-  get(t) {
-    return this._cache.get(t);
+  get(e) {
+    return this._cache.get(e);
   }
   clear() {
     this._cache.clear();
   }
 }
-const pe = new sn();
-function re(e) {
-  const t = e.style, n = {}, o = e.tagName.toLowerCase();
-  switch (o) {
+const at = new Er();
+function Ge(i) {
+  const e = i.style, t = {}, n = i.tagName.toLowerCase();
+  switch (n) {
     case "b":
     case "em":
     case "strong": {
-      n.bl = u.TRUE;
+      t.bl = m.TRUE;
       break;
     }
     case "s": {
-      n.st = {
-        s: u.TRUE
+      t.st = {
+        s: m.TRUE
       };
       break;
     }
     case "u": {
-      n.ul = {
-        s: u.TRUE
+      t.ul = {
+        s: m.TRUE
       };
       break;
     }
     case "i": {
-      n.it = u.TRUE;
+      t.it = m.TRUE;
       break;
     }
     case "sub":
     case "sup": {
-      n.va = o === "sup" ? E.SUPERSCRIPT : E.SUBSCRIPT;
+      t.va = n === "sup" ? K.SUPERSCRIPT : K.SUBSCRIPT;
       break;
     }
   }
-  for (let r = 0; r < t.length; r++) {
-    const i = t[r], s = t.getPropertyValue(i);
-    switch (i) {
+  for (let r = 0; r < e.length; r++) {
+    const s = e[r], o = e.getPropertyValue(s);
+    switch (s) {
       case "font-family": {
-        n.ff = s;
+        t.ff = o;
         break;
       }
       case "font-size": {
-        const a = Number.parseInt(s);
-        Number.isNaN(a) || s.endsWith("pt") && (n.fs = a);
+        const c = Number.parseInt(o);
+        Number.isNaN(c) || o.endsWith("pt") && (t.fs = c);
         break;
       }
       case "font-style": {
-        s === "italic" && (n.it = u.TRUE);
+        o === "italic" && (t.it = m.TRUE);
         break;
       }
       case "font-weight": {
-        Number(s) > 400 && (n.bl = u.TRUE);
+        Number(o) > 400 && (t.bl = m.TRUE);
         break;
       }
       case "text-decoration": {
-        /underline/.test(s) ? n.ul = {
-          s: u.TRUE
-        } : /overline/.test(s) ? n.ol = {
-          s: u.TRUE
-        } : /line-through/.test(s) && (n.st = {
-          s: u.TRUE
+        /underline/.test(o) ? t.ul = {
+          s: m.TRUE
+        } : /overline/.test(o) ? t.ol = {
+          s: m.TRUE
+        } : /line-through/.test(o) && (t.st = {
+          s: m.TRUE
         });
         break;
       }
       case "color": {
-        const a = new se(s);
-        a.isValid && (n.cl = {
-          rgb: a.toRgbString()
+        const c = new qe(o);
+        c.isValid && (t.cl = {
+          rgb: c.toRgbString()
         });
         break;
       }
       case "background-color": {
-        const a = new se(s);
-        a.isValid && (n.bg = {
-          rgb: a.toRgbString()
+        const c = new qe(o);
+        c.isValid && (t.bg = {
+          rgb: c.toRgbString()
         });
         break;
       }
     }
   }
-  return n;
+  return t;
 }
-function an(e) {
-  const t = new DOMParser(), n = `<x-univer id="univer-root">${e}</x-univer>`;
-  return t.parseFromString(n, "text/html").querySelector("#univer-root");
+function Dr(i) {
+  const e = new DOMParser(), t = `<x-univer id="univer-root">${i}</x-univer>`;
+  return e.parseFromString(t, "text/html").querySelector("#univer-root");
 }
-function he(e, t) {
-  const n = e.tagName.toLowerCase();
-  return typeof t == "string" ? n === t : Array.isArray(t) ? t.some((o) => o === n) : t(e);
+function lt(i, e) {
+  const t = i.tagName.toLowerCase();
+  return typeof e == "string" ? t === e : Array.isArray(e) ? e.some((n) => n === t) : e(i);
 }
-const z = class z {
+const Me = class Me {
   constructor() {
-    h(this, "_styleCache", /* @__PURE__ */ new Map());
-    h(this, "_styleRules", []);
-    h(this, "_afterProcessRules", []);
+    S(this, "_styleCache", /* @__PURE__ */ new Map());
+    S(this, "_styleRules", []);
+    S(this, "_afterProcessRules", []);
   }
-  static use(t) {
-    if (this._pluginList.includes(t))
-      throw new Error(`Univer paste plugin ${t.name} already added`);
-    this._pluginList.push(t);
+  static use(e) {
+    if (this._pluginList.includes(e))
+      throw new Error(`Univer paste plugin ${e.name} already added`);
+    this._pluginList.push(e);
   }
-  convert(t) {
-    const n = z._pluginList.find((i) => i.checkPasteType(t)), o = an(t), r = {
+  convert(e) {
+    const t = Me._pluginList.find((s) => s.checkPasteType(e)), n = Dr(e), r = {
       dataStream: "",
       textRuns: []
     };
-    return n && (this._styleRules = [...n.stylesRules], this._afterProcessRules = [...n.afterProcessRules]), this._styleCache.clear(), this._process(null, o == null ? void 0 : o.childNodes, r), this._styleCache.clear(), this._styleRules = [], this._afterProcessRules = [], r;
+    return t && (this._styleRules = [...t.stylesRules], this._afterProcessRules = [...t.afterProcessRules]), this._styleCache.clear(), this._process(null, n == null ? void 0 : n.childNodes, r), this._styleCache.clear(), this._styleRules = [], this._afterProcessRules = [], r;
   }
-  _process(t, n, o) {
+  _process(e, t, n) {
     var r;
-    for (const i of n)
-      if (i.nodeType === Node.TEXT_NODE) {
-        const s = (r = i.nodeValue) == null ? void 0 : r.replace(/[\r\n]/g, "");
-        let a;
-        t && this._styleCache.has(t) && (a = this._styleCache.get(t)), o.dataStream += s, a && Object.getOwnPropertyNames(a).length && o.textRuns.push({
-          st: o.dataStream.length - s.length,
-          ed: o.dataStream.length,
-          ts: a
+    for (const s of t)
+      if (s.nodeType === Node.TEXT_NODE) {
+        const o = (r = s.nodeValue) == null ? void 0 : r.replace(/[\r\n]/g, "");
+        let c;
+        e && this._styleCache.has(e) && (c = this._styleCache.get(e)), n.dataStream += o, c && Object.getOwnPropertyNames(c).length && n.textRuns.push({
+          st: n.dataStream.length - o.length,
+          ed: n.dataStream.length,
+          ts: c
         });
-      } else if (i.nodeType === Node.ELEMENT_NODE) {
-        const s = t ? this._styleCache.get(t) : {}, a = this._styleRules.find(({ filter: C }) => he(i, C)), c = a ? a.getStyle(i) : re(i);
-        this._styleCache.set(i, { ...s, ...c });
-        const { childNodes: l } = i;
-        this._process(i, l, o);
-        const p = this._afterProcessRules.find(
-          ({ filter: C }) => he(i, C)
+      } else if (s.nodeType === Node.ELEMENT_NODE) {
+        const o = e ? this._styleCache.get(e) : {}, c = this._styleRules.find(({ filter: _ }) => lt(s, _)), l = c ? c.getStyle(s) : Ge(s);
+        this._styleCache.set(s, { ...o, ...l });
+        const { childNodes: d } = s;
+        this._process(s, d, n);
+        const u = this._afterProcessRules.find(
+          ({ filter: _ }) => lt(s, _)
         );
-        p && p.handler(o, i);
+        u && u.handler(n, s);
       }
   }
 };
-h(z, "_pluginList", []);
-let $ = z;
-const cn = {
+S(Me, "_pluginList", []);
+let se = Me;
+const xr = {
   name: "univer-doc-paste-plugin-lark",
-  checkPasteType(e) {
-    return /lark-record-clipboard/i.test(e);
+  checkPasteType(i) {
+    return /lark-record-clipboard/i.test(i);
   },
   // TODO: @JOCS, support inline code copy from lark.
   stylesRules: [
     {
       filter: ["s"],
-      getStyle(e) {
-        const t = re(e);
+      getStyle(i) {
+        const e = Ge(i);
         return {
           st: {
-            s: u.TRUE
+            s: m.TRUE
           },
-          ...t
+          ...e
         };
       }
     }
   ],
   afterProcessRules: [
     {
-      filter(e) {
-        return e.tagName === "DIV" && /ace-line/i.test(e.className);
+      filter(i) {
+        return i.tagName === "DIV" && /ace-line/i.test(i.className);
       },
-      handler(e) {
-        e.paragraphs == null && (e.paragraphs = []), e.paragraphs.push({
-          startIndex: e.dataStream.length
-        }), e.dataStream += "\r";
+      handler(i) {
+        i.paragraphs == null && (i.paragraphs = []), i.paragraphs.push({
+          startIndex: i.dataStream.length
+        }), i.dataStream += "\r";
       }
     }
   ]
 };
-function ln(e) {
-  const t = e.style, n = {};
-  for (let o = 0; o < t.length; o++) {
-    const r = t[o], i = t.getPropertyValue(r);
+function Pr(i) {
+  const e = i.style, t = {};
+  for (let n = 0; n < e.length; n++) {
+    const r = e[n], s = e.getPropertyValue(r);
     switch (r) {
       case "margin-top": {
-        const s = Number.parseInt(i);
-        n.spaceAbove = /pt/.test(i) ? fe(s) : s;
+        const o = Number.parseInt(s);
+        t.spaceAbove = /pt/.test(s) ? rt(o) : o;
         break;
       }
       case "margin-bottom": {
-        const s = Number.parseInt(i);
-        n.spaceBelow = /pt/.test(i) ? fe(s) : s;
+        const o = Number.parseInt(s);
+        t.spaceBelow = /pt/.test(s) ? rt(o) : o;
         break;
       }
     }
   }
-  return Object.getOwnPropertyNames(n).length ? n : null;
-}
-function fe(e) {
-  return e / 0.75;
+  return Object.getOwnPropertyNames(t).length ? t : null;
 }
-const dn = {
+const Ur = {
   name: "univer-doc-paste-plugin-word",
-  checkPasteType(e) {
-    return /word|mso/i.test(e);
+  checkPasteType(i) {
+    return /word|mso/i.test(i);
   },
   stylesRules: [
     {
       filter: ["b"],
-      getStyle(e) {
-        const t = re(e);
-        return { bl: u.TRUE, ...t };
+      getStyle(i) {
+        const e = Ge(i);
+        return { bl: m.TRUE, ...e };
       }
     }
   ],
   afterProcessRules: [
     {
-      filter(e) {
-        return e.tagName === "P" && /mso/i.test(e.className);
+      filter(i) {
+        return i.tagName === "P" && /mso/i.test(i.className);
       },
-      handler(e, t) {
-        e.paragraphs == null && (e.paragraphs = []);
-        const n = {
-          startIndex: e.dataStream.length
-        }, o = ln(t);
-        o && (n.paragraphStyle = o), e.paragraphs.push(n), e.dataStream += "\r";
+      handler(i, e) {
+        i.paragraphs == null && (i.paragraphs = []);
+        const t = {
+          startIndex: i.dataStream.length
+        }, n = Pr(e);
+        n && (t.paragraphStyle = n), i.paragraphs.push(t), i.dataStream += "\r";
       }
     }
   ]
 };
-function un(e, t) {
-  const { st: n, ed: o, ts: r = {} } = t, { ff: i, fs: s, it: a, bl: c, ul: l, st: p, ol: C, bg: L, cl: j, va: P } = r;
-  let d = e.slice(n, o);
-  const f = [];
-  return a === u.TRUE && (d = `<i>${d}</i>`), P === E.SUPERSCRIPT ? d = `<sup>${d}</sup>` : P === E.SUBSCRIPT && (d = `<sub>${d}</sub>`), (l == null ? void 0 : l.s) === u.TRUE && (d = `<u>${d}</u>`), (p == null ? void 0 : p.s) === u.TRUE && (d = `<s>${d}</s>`), c === u.TRUE && (d = `<strong>${d}</strong>`), i && f.push(`font-family: ${i}`), j && f.push(`color: ${j.rgb}`), s && f.push(`font-size: ${s}px`), C && f.push("text-decoration: overline"), L && f.push(`background: ${L.rgb}`), f.length ? `<span style="${f.join(";")}">${d}</span>` : d;
+function Lr(i, e) {
+  const { st: t, ed: n, ts: r = {} } = e, { ff: s, fs: o, it: c, bl: l, ul: d, st: u, ol: _, bg: g, cl: f, va: p } = r;
+  let a = i.slice(t, n);
+  const h = [];
+  return c === m.TRUE && (a = `<i>${a}</i>`), p === K.SUPERSCRIPT ? a = `<sup>${a}</sup>` : p === K.SUBSCRIPT && (a = `<sub>${a}</sub>`), (d == null ? void 0 : d.s) === m.TRUE && (a = `<u>${a}</u>`), (u == null ? void 0 : u.s) === m.TRUE && (a = `<s>${a}</s>`), l === m.TRUE && (a = `<strong>${a}</strong>`), s && h.push(`font-family: ${s}`), f && h.push(`color: ${f.rgb}`), o && h.push(`font-size: ${o}px`), _ && h.push("text-decoration: overline"), g && h.push(`background: ${g.rgb}`), h.length ? `<span style="${h.join(";")}">${a}</span>` : a;
 }
-function me(e, t = !0) {
-  const { dataStream: n, textRuns: o = [], paragraphs: r = [] } = e;
-  let i = 0;
-  const s = [], a = [];
-  for (const c of o) {
-    const { st: l, ed: p } = c;
-    if (l !== i && s.push(n.slice(i, l)), s.push(un(n, c)), i = p, t)
-      for (const C of r) {
-        const { startIndex: L, paragraphStyle: j = {} } = C;
-        if (L >= l && L <= p) {
-          const { spaceAbove: P, spaceBelow: d } = j, f = [];
-          P != null && (typeof P == "number" ? f.push(`margin-top: ${P}px`) : f.push(`margin-top: ${P.v}px`)), d != null && (typeof d == "number" ? f.push(`margin-bottom: ${d}px`) : f.push(`margin-bottom: ${d.v}px`)), a.push(
-            `<p className="UniverNormal" ${f.length ? `style="${f.join(";")}"` : ""}>${s.join("")}</p>`
-          ), s.length = 0;
+function dt(i, e = !0) {
+  const { dataStream: t, textRuns: n = [], paragraphs: r = [] } = i;
+  let s = 0;
+  const o = [], c = [];
+  for (const l of n) {
+    const { st: d, ed: u } = l;
+    if (d !== s && o.push(t.slice(s, d)), o.push(Lr(t, l)), s = u, e)
+      for (const _ of r) {
+        const { startIndex: g, paragraphStyle: f = {} } = _;
+        if (g >= d && g <= u) {
+          const { spaceAbove: p, spaceBelow: a } = f, h = [];
+          p != null && (typeof p == "number" ? h.push(`margin-top: ${p}px`) : h.push(`margin-top: ${p.v}px`)), a != null && (typeof a == "number" ? h.push(`margin-bottom: ${a}px`) : h.push(`margin-bottom: ${a.v}px`)), c.push(
+            `<p className="UniverNormal" ${h.length ? `style="${h.join(";")}"` : ""}>${o.join("")}</p>`
+          ), o.length = 0;
         }
       }
   }
-  return i < n.length && s.push(n.slice(i, n.length)), a.join("") + s.join("");
+  return s < t.length && o.push(t.slice(s, t.length)), c.join("") + o.join("");
 }
-class pn {
-  convert(t) {
-    if (t.length === 0)
+class Nr {
+  convert(e) {
+    if (e.length === 0)
       throw new Error("The bodyList length at least to be 1");
-    if (t.length === 1)
-      return me(t[0]);
-    let n = "";
-    for (const o of t)
-      n += '<p className="UniverNormal">', n += me(o, !1), n += "</p>";
-    return n;
+    if (e.length === 1)
+      return dt(e[0]);
+    let t = "";
+    for (const n of e)
+      t += '<p className="UniverNormal">', t += dt(n, !1), t += "</p>";
+    return t;
   }
 }
-var hn = Object.defineProperty, fn = Object.getOwnPropertyDescriptor, mn = (e, t, n, o) => {
-  for (var r = o > 1 ? void 0 : o ? fn(t, n) : t, i = e.length - 1, s; i >= 0; i--)
-    (s = e[i]) && (r = (o ? s(t, n, r) : s(r)) || r);
-  return o && r && hn(t, n, r), r;
-}, N = (e, t) => (n, o) => t(n, o, e);
-$.use(dn);
-$.use(cn);
-function _n(e) {
-  const t = e.replace(/\n/g, "\r"), n = [];
-  for (let o = 0; o < t.length; o++)
-    t[o] === "\r" && n.push({ startIndex: o });
+var $r = Object.defineProperty, Ar = Object.getOwnPropertyDescriptor, wr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Ar(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = (n ? o(e, t, r) : o(r)) || r);
+  return n && r && $r(e, t, r), r;
+}, ee = (i, e) => (t, n) => e(t, n, i);
+se.use(Ur);
+se.use(xr);
+function Br(i) {
+  const e = i.replace(/\n/g, "\r"), t = [];
+  for (let n = 0; n < e.length; n++)
+    e[n] === "\r" && t.push({ startIndex: n });
   return {
-    dataStream: t,
-    paragraphs: n
+    dataStream: e,
+    paragraphs: t
   };
 }
-const B = ze("doc.clipboard-service");
-let Q = class extends Te {
-  constructor(t, n, o, r, i) {
+const ue = jt("doc.clipboard-service");
+let We = class extends H {
+  constructor(e, t, n, r, s) {
     super();
-    h(this, "_clipboardHooks", []);
-    h(this, "_htmlToUDM", new $());
-    h(this, "_umdToHtml", new pn());
-    this._currentUniverService = t, this._logService = n, this._commandService = o, this._clipboardInterfaceService = r, this._textSelectionManagerService = i;
+    S(this, "_clipboardHooks", []);
+    S(this, "_htmlToUDM", new se());
+    S(this, "_umdToHtml", new Nr());
+    this._currentUniverService = e, this._logService = t, this._commandService = n, this._clipboardInterfaceService = r, this._textSelectionManagerService = s;
   }
   async copy() {
-    const t = this._getDocumentBodyInRanges();
+    const e = this._getDocumentBodyInRanges();
+    if (e.length === 0)
+      return !1;
     try {
-      this._setClipboardData(t);
-    } catch (n) {
-      return this._logService.error("[DocClipboardService] copy failed", n), !1;
+      this._setClipboardData(e);
+    } catch (t) {
+      return this._logService.error("[DocClipboardService] copy failed", t), !1;
     }
     return !0;
   }
   async cut() {
     return this._cut();
   }
-  async paste(t) {
-    const n = await this._generateBodyFromClipboardItems(t);
-    return this._paste(n);
+  async paste(e) {
+    const t = await this._generateBodyFromClipboardItems(e);
+    return this._paste(t);
   }
-  async legacyPaste(t, n) {
-    const o = this._generateBodyFromHtmlAndText(t, n);
-    return this._paste(o);
+  async legacyPaste(e, t) {
+    const n = this._generateBodyFromHtmlAndText(e, t);
+    return this._paste(n);
   }
   async _cut() {
-    var i;
+    var s;
     const {
-      segmentId: t,
-      endOffset: n,
-      style: o
-    } = (i = this._textSelectionManagerService.getActiveRange()) != null ? i : {}, r = this._textSelectionManagerService.getSelections();
-    if (t == null && this._logService.error("[DocClipboardController] segmentId is not existed"), n == null || r == null)
+      segmentId: e,
+      endOffset: t,
+      style: n
+    } = (s = this._textSelectionManagerService.getActiveRange()) != null ? s : {}, r = this._textSelectionManagerService.getSelections();
+    if (e == null && this._logService.error("[DocClipboardController] segmentId is not existed"), t == null || r == null)
       return !1;
     this.copy();
     try {
-      let s = n;
-      for (const c of r) {
-        const { startOffset: l, endOffset: p } = c;
-        l == null || p == null || p <= n && (s -= p - l);
+      let o = t;
+      for (const l of r) {
+        const { startOffset: d, endOffset: u } = l;
+        d == null || u == null || u <= t && (o -= u - d);
       }
-      const a = [
+      const c = [
         {
-          startOffset: s,
-          endOffset: s,
-          style: o
+          startOffset: o,
+          endOffset: o,
+          style: n
         }
       ];
-      return this._commandService.executeCommand(be.id, { segmentId: t, textRanges: a });
+      return this._commandService.executeCommand(St.id, { segmentId: e, textRanges: c });
     } catch {
       return this._logService.error("[DocClipboardController] cut content failed"), !1;
     }
   }
-  async _paste(t) {
-    var s;
-    const { segmentId: n, endOffset: o, style: r } = (s = this._textSelectionManagerService.getActiveRange()) != null ? s : {}, i = this._textSelectionManagerService.getSelections();
-    if (n == null && this._logService.error("[DocClipboardController] segmentId does not exist!"), o == null || i == null)
+  async _paste(e) {
+    var o;
+    const { segmentId: t, endOffset: n, style: r } = (o = this._textSelectionManagerService.getActiveRange()) != null ? o : {}, s = this._textSelectionManagerService.getSelections();
+    if (t == null && this._logService.error("[DocClipboardController] segmentId does not exist!"), n == null || s == null)
       return !1;
     try {
-      let a = o;
-      for (const l of i) {
-        const { startOffset: p, endOffset: C } = l;
-        p == null || C == null || C <= o && (a += t.dataStream.length - (C - p));
+      let c = n;
+      for (const d of s) {
+        const { startOffset: u, endOffset: _ } = d;
+        u == null || _ == null || _ <= n && (c += e.dataStream.length - (_ - u));
       }
-      const c = [
+      const l = [
         {
-          startOffset: a,
-          endOffset: a,
+          startOffset: c,
+          endOffset: c,
           style: r
         }
       ];
-      return this._commandService.executeCommand(xe.id, { body: t, segmentId: n, textRanges: c });
+      return this._commandService.executeCommand(mt.id, { body: e, segmentId: t, textRanges: l });
     } catch {
       return this._logService.error("[DocClipboardController]", "clipboard is empty."), !1;
     }
   }
-  async _setClipboardData(t) {
-    const n = on(), o = t.length > 1 ? t.map((i) => i.dataStream).join(`
-`) : t[0].dataStream;
-    let r = this._umdToHtml.convert(t);
-    return t.length === 1 && (r = r.replace(/(<[a-z]+)/, (i, s) => `${s} data-copy-id="${n}"`), pe.set(n, t[0])), this._clipboardInterfaceService.write(o, r);
+  async _setClipboardData(e) {
+    const t = Mr(), n = e.length > 1 ? e.map((s) => s.dataStream).join(`
+`) : e[0].dataStream;
+    let r = this._umdToHtml.convert(e);
+    return e.length === 1 && (r = r.replace(/(<[a-z]+)/, (s, o) => `${o} data-copy-id="${t}"`), at.set(t, e[0])), this._clipboardInterfaceService.write(n, r);
   }
-  addClipboardHook(t) {
-    return this._clipboardHooks.push(t), $e(() => {
-      const n = this._clipboardHooks.indexOf(t);
-      n > -1 && this._clipboardHooks.splice(n, 1);
+  addClipboardHook(e) {
+    return this._clipboardHooks.push(e), N(() => {
+      const t = this._clipboardHooks.indexOf(e);
+      t > -1 && this._clipboardHooks.splice(t, 1);
     });
   }
   _getDocumentBodyInRanges() {
-    const t = this._textSelectionManagerService.getSelections(), n = this._currentUniverService.getCurrentUniverDocInstance(), o = [];
-    if (t == null)
-      return o;
-    for (const r of t) {
-      const { startOffset: i, endOffset: s, collapsed: a } = r;
-      if (a || i == null || s == null)
+    const e = this._textSelectionManagerService.getSelections(), t = this._currentUniverService.getCurrentUniverDocInstance(), n = [];
+    if (e == null)
+      return n;
+    for (const r of e) {
+      const { startOffset: s, endOffset: o, collapsed: c } = r;
+      if (c || s == null || o == null)
         continue;
-      const c = n.sliceBody(i, s);
-      c != null && o.push(c);
+      const l = t.sliceBody(s, o);
+      l != null && n.push(l);
     }
-    return o;
+    return n;
   }
-  async _generateBodyFromClipboardItems(t) {
+  async _generateBodyFromClipboardItems(e) {
     try {
-      let n = "", o = "";
-      for (const r of t)
-        for (const i of r.types)
-          i === Qe ? o = await r.getType(i).then((s) => s && s.text()) : i === et && (n = await r.getType(i).then((s) => s && s.text()));
-      return this._generateBodyFromHtmlAndText(n, o);
-    } catch (n) {
-      return Promise.reject(n);
+      let t = "", n = "";
+      for (const r of e)
+        for (const s of r.types)
+          s === Gt ? n = await r.getType(s).then((o) => o && o.text()) : s === Zt && (t = await r.getType(s).then((o) => o && o.text()));
+      return this._generateBodyFromHtmlAndText(t, n);
+    } catch (t) {
+      return Promise.reject(t);
     }
   }
-  _generateBodyFromHtmlAndText(t, n) {
-    if (!t) {
-      if (n)
-        return _n(n);
+  _generateBodyFromHtmlAndText(e, t) {
+    if (!e) {
+      if (t)
+        return Br(t);
       throw new Error("[DocClipboardService] html and text cannot be both empty!");
     }
-    const o = rn(t);
-    if (o) {
-      const r = pe.get(o);
+    const n = yr(e);
+    if (n) {
+      const r = at.get(n);
       if (r)
         return r;
     }
-    return this._htmlToUDM.convert(t);
+    return this._htmlToUDM.convert(e);
   }
 };
-Q = mn([
-  N(0, te),
-  N(1, Re),
-  N(2, _),
-  N(3, oe),
-  N(4, y(Ie))
-], Q);
-function Z(e) {
-  return e.getContextValue(m) || e.getContextValue(ge);
+We = wr([
+  ee(0, M),
+  ee(1, gt),
+  ee(2, O),
+  ee(3, He),
+  ee(4, v(le))
+], We);
+function Ne(i) {
+  return i.getContextValue(ye) || i.getContextValue(_t);
 }
-const ie = 999, gn = {
-  id: tt.id,
+const Ze = 999, Fr = {
+  id: qt.id,
   name: "doc.command.copy",
-  type: ne.COMMAND,
+  type: ke.COMMAND,
   multi: !0,
-  priority: ie,
-  preconditions: Z,
-  handler: async (e) => e.get(B).copy()
-}, Cn = {
-  id: nt.id,
+  priority: Ze,
+  preconditions: Ne,
+  handler: async (i) => i.get(ue).copy()
+}, jr = {
+  id: Kt.id,
   name: "doc.command.cut",
-  type: ne.COMMAND,
+  type: ke.COMMAND,
   multi: !0,
-  priority: ie,
-  preconditions: Z,
-  handler: async (e) => e.get(B).cut()
-}, Sn = {
-  id: ot.id,
+  priority: Ze,
+  preconditions: Ne,
+  handler: async (i) => i.get(ue).cut()
+}, Wr = {
+  id: Jt.id,
   name: "doc.command.paste",
-  type: ne.COMMAND,
+  type: ke.COMMAND,
   multi: !0,
-  priority: ie,
-  preconditions: Z,
-  handler: async (e) => {
-    const t = e.get(B), o = await e.get(oe).read();
-    return o.length === 0 ? !1 : t.paste(o);
+  priority: Ze,
+  preconditions: Ne,
+  handler: async (i) => {
+    const e = i.get(ue), n = await i.get(He).read();
+    return n.length === 0 ? !1 : e.paste(n);
   }
 };
-var On = Object.defineProperty, Tn = Object.getOwnPropertyDescriptor, vn = (e, t, n, o) => {
-  for (var r = o > 1 ? void 0 : o ? Tn(t, n) : t, i = e.length - 1, s; i >= 0; i--)
-    (s = e[i]) && (r = (o ? s(t, n, r) : s(r)) || r);
-  return o && r && On(t, n, r), r;
-}, U = (e, t) => (n, o) => t(n, o, e);
-let W = class extends Ce {
-  constructor(e, t, n, o, r) {
-    super(), this._commandService = e, this._clipboardInterfaceService = t, this._docClipboardService = n, this._textSelectionRenderManager = o, this._contextService = r, this._init();
+var zr = Object.defineProperty, Vr = Object.getOwnPropertyDescriptor, kr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Vr(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = (n ? o(e, t, r) : o(r)) || r);
+  return n && r && zr(e, t, r), r;
+}, te = (i, e) => (t, n) => e(t, n, i);
+let Se = class extends ce {
+  constructor(i, e, t, n, r) {
+    super(), this._commandService = i, this._clipboardInterfaceService = e, this._docClipboardService = t, this._textSelectionRenderManager = n, this._contextService = r, this._init();
   }
   _init() {
-    [gn, Cn, Sn].forEach((e) => this.disposeWithMe(this._commandService.registerMultipleCommand(e))), [xe, be].forEach((e) => this.disposeWithMe(this._commandService.registerCommand(e))), this._initLegacyPasteCommand();
+    [Fr, jr, Wr].forEach((i) => this.disposeWithMe(this._commandService.registerMultipleCommand(i))), [mt, St].forEach((i) => this.disposeWithMe(this._commandService.registerCommand(i))), this._initLegacyPasteCommand();
   }
   _initLegacyPasteCommand() {
-    var e;
-    this._clipboardInterfaceService.supportClipboard || (e = this._textSelectionRenderManager) == null || e.onPaste$.pipe(gt(this.dispose$)).subscribe((t) => {
-      var i, s;
-      if (!Z(this._contextService))
+    var i;
+    this._clipboardInterfaceService.supportClipboard || (i = this._textSelectionRenderManager) == null || i.onPaste$.pipe(oe(this.dispose$)).subscribe((e) => {
+      var s, o;
+      if (!Ne(this._contextService))
         return;
-      t.event.preventDefault();
-      const n = t.event, o = (i = n.clipboardData) == null ? void 0 : i.getData("text/html"), r = (s = n.clipboardData) == null ? void 0 : s.getData("text/plain");
-      this._docClipboardService.legacyPaste(o, r);
+      e.event.preventDefault();
+      const t = e.event, n = (s = t.clipboardData) == null ? void 0 : s.getData("text/html"), r = (o = t.clipboardData) == null ? void 0 : o.getData("text/plain");
+      this._docClipboardService.legacyPaste(n, r);
     });
   }
 };
-W = vn([
-  Se(Oe.Steady, W),
-  U(0, _),
-  U(1, oe),
-  U(2, B),
-  U(3, De),
-  U(4, we)
-], W);
-var Rn = Object.defineProperty, yn = Object.getOwnPropertyDescriptor, In = (e, t, n, o) => {
-  for (var r = o > 1 ? void 0 : o ? yn(t, n) : t, i = e.length - 1, s; i >= 0; i--)
-    (s = e[i]) && (r = (o ? s(t, n, r) : s(r)) || r);
-  return o && r && Rn(t, n, r), r;
-}, X = (e, t) => (n, o) => t(n, o, e), q;
-let _e = (q = class extends Be {
-  constructor(e, t, n, o) {
-    super(Tt), this._config = e, this._injector = t, this._localeService = n, this._logService = o, this._localeService.load({
-      zhCN: qt
-    }), this._config = ve.deepMerge({}, Ot, this._config), this._initDependencies(t), this._initializeCommands();
+Se = kr([
+  P(U.Steady, Se),
+  te(0, O),
+  te(1, He),
+  te(2, ue),
+  te(3, de),
+  te(4, Lt)
+], Se);
+var Hr = Object.defineProperty, Yr = Object.getOwnPropertyDescriptor, Xr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Yr(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = (n ? o(e, t, r) : o(r)) || r);
+  return n && r && Hr(e, t, r), r;
+}, ne = (i, e) => (t, n) => e(t, n, i);
+let me = class extends H {
+  constructor(e, t, n, r, s) {
+    super();
+    S(this, "_initialEditors", /* @__PURE__ */ new Set());
+    this._currentUniverService = e, this._docSkeletonManagerService = t, this._editorService = n, this._commandService = r, this._textSelectionRenderManager = s, this._initialize();
+  }
+  _initialize() {
+    this.disposeWithMe(
+      this._editorService.resize$.subscribe((e) => {
+        this._resize(e);
+      })
+    ), this._editorService.getAllEditor().forEach((e) => {
+      const t = e.editorUnitId;
+      this._initialEditors.has(t) || (this._initialEditors.add(t), this._resize(t));
+    }), this._commandExecutedListener(), this._initialSetValue(), this._initialBlur(), this._initialFocus(), this._initialValueChange();
+  }
+  _resize(e) {
+    var w, B, F;
+    if (e == null)
+      return;
+    const t = this._editorService.getEditor(e);
+    if ((t == null ? void 0 : t.cancelDefaultResizeListener) === !0)
+      return;
+    const n = (w = this._docSkeletonManagerService.getSkeletonByUnitId(e)) == null ? void 0 : w.skeleton, r = this._currentUniverService.getUniverDocInstance(e);
+    if (t == null || t.render == null || n == null || r == null)
+      return;
+    const { marginTop: s = 0, marginBottom: o = 0, marginLeft: c = 0, marginRight: l = 0 } = r.getSnapshot().documentStyle, { scene: d, mainComponent: u } = t.render;
+    let { actualHeight: _, actualWidth: g } = n.getActualSize();
+    _ += s + o, g += c + l;
+    const { width: f, height: p } = t.getBoundingClientRect(), a = d.getViewport(Pe.VIEW_MAIN);
+    let h = a == null ? void 0 : a.getScrollBar();
+    const C = Math.max(g, f), R = Math.max(_, p);
+    d.transformByState({
+      width: C,
+      height: R
+    }), u == null || u.resize(C, R), t.isSingle() ? g > f ? h == null ? a && new Fe(a, { barSize: 8, enableVertical: !1 }) : a == null || a.resetSizeAndScrollBar() : (h = null, a == null || a.scrollTo({ x: 0, y: 0 }), (F = a == null ? void 0 : a.getScrollBar()) == null || F.dispose()) : _ > p ? h == null ? a && new Fe(a, { enableHorizontal: !1, barSize: 8 }) : a == null || a.resetSizeAndScrollBar() : (h = null, a == null || a.scrollTo({ x: 0, y: 0 }), (B = a == null ? void 0 : a.getScrollBar()) == null || B.dispose());
+  }
+  _initialSetValue() {
+    this.disposeWithMe(
+      this._editorService.setValue$.subscribe((e) => {
+        this._commandService.executeCommand(pn.id, {
+          unitId: e.editorUnitId,
+          body: e.body,
+          segmentId: null
+        });
+      })
+    );
+  }
+  _initialBlur() {
+    this.disposeWithMe(
+      this._editorService.blur$.subscribe(() => {
+        this._textSelectionRenderManager.removeAllTextRanges(), this._textSelectionRenderManager.blur();
+      })
+    );
+  }
+  _initialFocus() {
+    this.disposeWithMe(
+      this._editorService.focus$.subscribe((e) => {
+        this._textSelectionRenderManager.removeAllTextRanges(), this._textSelectionRenderManager.addTextRanges([e]);
+      })
+    );
+  }
+  _initialValueChange() {
+    this.disposeWithMe(
+      this._textSelectionRenderManager.onCompositionupdate$.subscribe(this._valueChange.bind(this))
+    ), this.disposeWithMe(
+      this._textSelectionRenderManager.onInput$.subscribe(this._valueChange.bind(this))
+    ), this.disposeWithMe(
+      this._textSelectionRenderManager.onKeydown$.subscribe(this._valueChange.bind(this))
+    ), this.disposeWithMe(
+      this._textSelectionRenderManager.onPaste$.subscribe(this._valueChange.bind(this))
+    );
+  }
+  _valueChange() {
+    const e = this._currentUniverService.getCurrentUniverDocInstance().getUnitId();
+    if (e == null)
+      return;
+    const t = this._editorService.getEditor(e);
+    t == null || t.isSheetEditor() || this._editorService.refreshValueChange(e);
+  }
+  /**
+   * Listen to document edits to refresh the size of the normula editor.
+   */
+  _commandExecutedListener() {
+    const e = [Ye.id, Qt.id];
+    this.disposeWithMe(
+      this._commandService.onCommandExecuted((t) => {
+        if (e.includes(t.id)) {
+          const n = t.params, { unitId: r } = n;
+          if (this._editorService.isSheetEditor(r))
+            return;
+          this._resize(r), this._valueChange();
+        }
+      })
+    );
+  }
+};
+me = Xr([
+  P(U.Rendered, me),
+  ne(0, M),
+  ne(1, v(Q)),
+  ne(2, $),
+  ne(3, O),
+  ne(4, de)
+], me);
+var Gr = Object.defineProperty, Zr = Object.getOwnPropertyDescriptor, qr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Zr(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = (n ? o(e, t, r) : o(r)) || r);
+  return n && r && Gr(e, t, r), r;
+}, ge = (i, e) => (t, n) => e(t, n, i);
+let ve = class extends ce {
+  constructor(e, t, n, r) {
+    super();
+    S(this, "_docRenderMap", /* @__PURE__ */ new Set());
+    this._docSkeletonManagerService = e, this._renderManagerService = t, this._commandService = n, this._editorService = r, this._initialRenderRefresh(), this._commandExecutedListener();
+  }
+  _initialRenderRefresh() {
+    this._docSkeletonManagerService.currentSkeletonBefore$.pipe(oe(this.dispose$)).subscribe((e) => {
+      this._create(e);
+    });
+  }
+  _create(e) {
+    if (e == null)
+      return;
+    const { skeleton: t, unitId: n } = e;
+    let r = this._renderManagerService.getRenderById(n);
+    r == null && (this._renderManagerService.create(n), r = this._renderManagerService.getRenderById(n));
+    const { mainComponent: s } = r;
+    s.changeSkeleton(t), this._recalculateSizeBySkeleton(r, t);
+  }
+  _recalculateSizeBySkeleton(e, t) {
+    var u;
+    const { mainComponent: n, scene: r, unitId: s } = e, o = n, c = (u = t.getSkeletonData()) == null ? void 0 : u.pages;
+    if (c == null)
+      return;
+    let l = 0, d = 0;
+    for (let _ = 0, g = c.length; _ < g; _++) {
+      const f = c[_], { pageWidth: p, pageHeight: a } = f;
+      o.pageLayoutType === it.VERTICAL ? (d += a, d += o.pageMarginTop, _ === g - 1 && (d += o.pageMarginTop), l = Math.max(l, p)) : o.pageLayoutType === it.HORIZONTAL && (l += p, _ !== g - 1 && (l += o.pageMarginLeft), d = Math.max(d, a));
+    }
+    o.resize(l, d), this._editorService.isEditor(s) || r.resize(l, d);
+  }
+  _commandExecutedListener() {
+    const e = [Ye.id];
+    this.disposeWithMe(
+      this._commandService.onCommandExecuted((t) => {
+        var n;
+        if (e.includes(t.id)) {
+          const r = t.params, { unitId: s } = r, o = this._docSkeletonManagerService.getSkeletonByUnitId(s);
+          if (o == null)
+            return;
+          const { skeleton: c } = o, l = this._renderManagerService.getRenderById(s);
+          if (l == null)
+            return;
+          if (c.calculate(), this._editorService.isEditor(s)) {
+            (n = l.mainComponent) == null || n.makeDirty();
+            return;
+          }
+          this._recalculateSizeBySkeleton(l, c);
+        }
+      })
+    );
+  }
+};
+ve = qr([
+  P(U.Rendered, ve),
+  ge(0, v(Q)),
+  ge(1, Y),
+  ge(2, O),
+  ge(3, $)
+], ve);
+var Kr = Object.defineProperty, Jr = Object.getOwnPropertyDescriptor, Qr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Jr(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = (n ? o(e, t, r) : o(r)) || r);
+  return n && r && Kr(e, t, r), r;
+}, $e = (i, e) => (t, n) => e(t, n, i);
+let Ce = class extends ce {
+  constructor(e, t, n) {
+    super();
+    S(this, "_scene");
+    S(this, "_currentDocumentModel");
+    S(this, "_fps$", new Dn(""));
+    S(this, "fps$", this._fps$.asObservable());
+    this._renderManagerService = e, this._configService = t, this._currentUniverService = n, this._initialize();
+  }
+  _initialize() {
+    this._renderManagerService.createRender$.pipe(oe(this.dispose$)).subscribe((e) => {
+      this._create(e);
+    }), this._currentUniverService.currentDoc$.pipe(oe(this.dispose$)).subscribe((e) => {
+      this._create(e == null ? void 0 : e.getUnitId());
+    }), this._currentUniverService.getAllUniverDocsInstance().forEach((e) => {
+      this._create(e.getUnitId());
+    });
+  }
+  dispose() {
+    this._fps$.complete();
+  }
+  _create(e) {
+    if (e == null)
+      return;
+    const t = this._currentUniverService.getUniverDocInstance(e);
+    t != null && (this._currentDocumentModel = t, this._renderManagerService.has(e) || this._addNewRender());
+  }
+  _addNewRender() {
+    const e = this._currentDocumentModel, t = e.getUnitId(), n = e.getContainer(), r = e.getParentRenderUnitId();
+    if (n != null && r != null)
+      throw new Error("container or parentRenderUnitId can only exist one");
+    n == null && r != null ? this._renderManagerService.createRenderWithParent(t, r) : this._renderManagerService.createRender(t);
+    const s = this._renderManagerService.getRenderById(t);
+    if (s == null)
+      return;
+    const { scene: o, engine: c } = s;
+    o.openTransformer(), this._scene = o;
+    const l = new vn(Pe.VIEW_MAIN, o, {
+      left: 0,
+      top: 0,
+      bottom: 0,
+      right: 0,
+      isWheelPreventDefaultX: !0
+    });
+    o.attachControl(), o.on(Cn.wheel, (_, g) => {
+      const f = _;
+      if (f.ctrlKey) {
+        const p = Math.abs(f.deltaX);
+        let a = p < 40 ? 0.2 : p < 80 ? 0.4 : 0.2;
+        a *= f.deltaY > 0 ? -1 : 1, o.scaleX < 1 && (a /= 2), o.scaleX + a > 4 ? o.scale(4, 4) : o.scaleX + a < 0.1 ? o.scale(0.1, 0.1) : f.preventDefault();
+      } else
+        l.onMouseWheel(f, g);
+    }), this._configService.getConfig("hasScroll") !== !1 && new Fe(l), o.addLayer(
+      new ot(o, [], tt),
+      new ot(o, [], gn)
+    ), this._addComponent(s), this._currentDocumentModel.getShouldRenderLoopImmediately() && c.runRenderLoop(() => {
+      o.render(), this._fps$.next(Math.round(c.getFps()).toString());
+    }), this._renderManagerService.setCurrent(t);
+  }
+  _addComponent(e) {
+    const t = this._scene, n = this._currentDocumentModel, r = new On(nt.MAIN, void 0, {
+      pageMarginLeft: n.documentStyle.marginLeft || 0,
+      pageMarginTop: n.documentStyle.marginTop || 0
+    });
+    r.zIndex = fn, e.mainComponent = r, e.components.set(nt.MAIN, r), t.addObjects([r], tt);
+  }
+};
+Ce = Qr([
+  P(U.Starting, Ce),
+  $e(0, Y),
+  $e(1, Nt),
+  $e(2, M)
+], Ce);
+var ei = Object.defineProperty, ti = Object.getOwnPropertyDescriptor, ni = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? ti(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = (n ? o(e, t, r) : o(r)) || r);
+  return n && r && ei(e, t, r), r;
+}, Z = (i, e) => (t, n) => e(t, n, i);
+let Oe = class extends H {
+  constructor(e, t, n, r, s, o) {
+    super();
+    S(this, "_liquid", new Rn());
+    S(this, "_pageMarginCache", /* @__PURE__ */ new Map());
+    this._docSkeletonManagerService = e, this._currentUniverService = t, this._renderManagerService = n, this._commandService = r, this._floatingObjectManagerService = s, this._editorService = o, this._initialize(), this._commandExecutedListener();
+  }
+  _initialize() {
+    this._initialRenderRefresh(), this._updateOnPluginChange();
+  }
+  _updateOnPluginChange() {
+    this._floatingObjectManagerService.pluginUpdate$.subscribe((e) => {
+      const t = this._docSkeletonManagerService.getCurrent();
+      if (t == null)
+        return;
+      const { unitId: n, skeleton: r } = t, s = this._renderManagerService.getRenderById(n);
+      if (s == null)
+        return;
+      const { mainComponent: o, components: c, scene: l } = s, d = o, { left: u, top: _ } = d;
+      e.forEach((g) => {
+        const { unitId: f, subUnitId: p, floatingObjectId: a, floatingObject: h } = g, { left: C = 0, top: R = 0, width: w = 0, height: B = 0, angle: F, flipX: X, flipY: G, skewX: he, skewY: _e } = h, b = this._pageMarginCache.get(a), Mt = (b == null ? void 0 : b.marginLeft) || 0, yt = (b == null ? void 0 : b.marginTop) || 0;
+        r == null || r.getViewModel().getDataModel().updateDrawing(a, {
+          left: C - u - Mt,
+          top: R - _ - yt,
+          height: B,
+          width: w
+        });
+      }), r == null || r.calculate(), o == null || o.makeDirty();
+    });
+  }
+  _initialRenderRefresh() {
+    this._docSkeletonManagerService.currentSkeleton$.subscribe((e) => {
+      if (e == null)
+        return;
+      const { skeleton: t, unitId: n } = e, r = this._renderManagerService.getRenderById(n);
+      if (r == null)
+        return;
+      const { mainComponent: s } = r;
+      s.changeSkeleton(t), this._refreshFloatingObject(n, t, r);
+    });
+  }
+  _commandExecutedListener() {
+    const e = [Ye.id, Xe.id];
+    this.disposeWithMe(
+      this._commandService.onCommandExecuted((t) => {
+        var n;
+        if (e.includes(t.id)) {
+          const r = t.params, { unitId: s } = r, o = this._docSkeletonManagerService.getCurrent();
+          if (o == null)
+            return;
+          const { unitId: c, skeleton: l } = o;
+          if (s !== c)
+            return;
+          const d = this._renderManagerService.getRenderById(c);
+          if (d == null)
+            return;
+          if (this._editorService.isEditor(c)) {
+            (n = d.mainComponent) == null || n.makeDirty();
+            return;
+          }
+          this._refreshFloatingObject(c, l, d);
+        }
+      })
+    );
+  }
+  _refreshFloatingObject(e, t, n) {
+    const r = t == null ? void 0 : t.getSkeletonData(), { mainComponent: s, scene: o } = n, c = s;
+    if (!r)
+      return;
+    const { left: l, top: d, pageLayoutType: u, pageMarginLeft: _, pageMarginTop: g } = c, { pages: f } = r, p = [];
+    o.getAncestorScale(), this._liquid.reset(), this._pageMarginCache.clear();
+    for (let a = 0, h = f.length; a < h; a++) {
+      const C = f[a], { skeDrawings: R, marginLeft: w, marginTop: B } = C;
+      this._liquid.translatePagePadding(C), R.forEach((F) => {
+        const { aLeft: X, aTop: G, height: he, width: _e, objectId: b } = F;
+        p.push({
+          unitId: e,
+          subUnitId: $t,
+          floatingObjectId: b,
+          floatingObject: {
+            left: X + l + this._liquid.x,
+            top: G + d + this._liquid.y,
+            width: _e,
+            height: he
+          }
+        }), this._pageMarginCache.set(b, {
+          marginLeft: this._liquid.x,
+          marginTop: this._liquid.y
+        });
+      }), this._liquid.translatePage(C, u, _, g);
+    }
+    this._floatingObjectManagerService.BatchAddOrUpdate(p);
+  }
+};
+Oe = ni([
+  P(U.Steady, Oe),
+  Z(0, v(Q)),
+  Z(1, M),
+  Z(2, Y),
+  Z(3, O),
+  Z(4, At),
+  Z(5, $)
+], Oe);
+var ri = Object.defineProperty, ii = Object.getOwnPropertyDescriptor, oi = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? ii(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = (n ? o(e, t, r) : o(r)) || r);
+  return n && r && ri(e, t, r), r;
+}, Ae = (i, e) => (t, n) => e(t, n, i);
+const si = "rgba(198, 198, 198, 1)", ci = "rgba(255, 255, 255, 1)";
+let Re = class extends H {
+  constructor(i, e, t) {
+    super(), this._renderManagerService = i, this._editorService = e, this._currentUniverService = t, this._initialize(), this._commandExecutedListener();
+  }
+  _initialize() {
+    this._initialRenderRefresh();
+  }
+  _initialRenderRefresh() {
+    this._renderManagerService.currentRender$.subscribe((i) => {
+      var s;
+      if (i == null)
+        return;
+      const e = this._renderManagerService.getRenderById(i);
+      if (this._editorService.isEditor(i) || this._currentUniverService.getUniverDocInstance(i) == null || e == null)
+        return;
+      const { mainComponent: t } = e, n = t, r = (s = n.getSkeleton()) == null ? void 0 : s.getPageSize();
+      this.disposeWithMe(
+        N(
+          n.onPageRenderObservable.add((o) => {
+            var a, h, C, R;
+            if (this._editorService.isEditor(i))
+              return;
+            const { page: c, pageLeft: l, pageTop: d, ctx: u } = o, { width: _, pageWidth: g, height: f, pageHeight: p } = c;
+            u.save(), u.translate(l - 0.5, d - 0.5), bn.drawWith(u, {
+              width: (h = (a = r == null ? void 0 : r.width) != null ? a : g) != null ? h : _,
+              height: (R = (C = r == null ? void 0 : r.height) != null ? C : p) != null ? R : f,
+              strokeWidth: 1,
+              stroke: si,
+              fill: ci,
+              zIndex: 3
+            }), u.restore();
+          })
+        )
+      );
+    });
+  }
+  _commandExecutedListener() {
+  }
+};
+Re = oi([
+  P(U.Rendered, Re),
+  Ae(0, Y),
+  Ae(1, $),
+  Ae(2, M)
+], Re);
+var ai = Object.defineProperty, li = Object.getOwnPropertyDescriptor, di = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? li(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = (n ? o(e, t, r) : o(r)) || r);
+  return n && r && ai(e, t, r), r;
+}, q = (i, e) => (t, n) => e(t, n, i);
+let be = class extends H {
+  constructor(e, t, n, r, s, o) {
+    super();
+    S(this, "_initializedRender", /* @__PURE__ */ new Set());
+    this._docSkeletonManagerService = e, this._currentUniverService = t, this._commandService = n, this._renderManagerService = r, this._textSelectionManagerService = s, this._editorService = o, this._initialize();
+  }
+  dispose() {
+    super.dispose();
+  }
+  _initialize() {
+    this._skeletonListener(), this._commandExecutedListener(), this._initialRenderRefresh();
+  }
+  _initialRenderRefresh() {
+    this._docSkeletonManagerService.currentSkeleton$.subscribe((e) => {
+      if (e == null)
+        return;
+      const { unitId: t } = e, n = this._renderManagerService.getRenderById(t);
+      if (n == null || this._initializedRender.has(t) || this._editorService.isEditor(t))
+        return;
+      this._initializedRender.add(t);
+      const { scene: r } = n;
+      this.disposeWithMe(
+        N(
+          r.onMouseWheelObserver.add((s) => {
+            if (!s.ctrlKey)
+              return;
+            const o = Math.abs(s.deltaX);
+            let c = o < 40 ? 0.2 : o < 80 ? 0.4 : 0.2;
+            c *= s.deltaY > 0 ? -1 : 1, r.scaleX < 1 && (c /= 2);
+            const l = this._currentUniverService.getCurrentUniverDocInstance(), d = l.zoomRatio;
+            let u = +Number.parseFloat(`${d + c}`).toFixed(1);
+            u = u >= 4 ? 4 : u <= 0.1 ? 0.1 : u, this._commandService.executeCommand(Sn.id, {
+              zoomRatio: u,
+              unitId: l.getUnitId()
+            }), s.preventDefault();
+          })
+        )
+      );
+    });
+  }
+  // private _zoomEventBinding() {
+  //     const scene = this._getDocObject()?.scene;
+  //     if (scene == null) {
+  //         return;
+  //     }
+  //     const viewportMain = scene.getViewport(VIEWPORT_KEY.VIEW_MAIN);
+  // }
+  _skeletonListener() {
+    this.disposeWithMe(
+      N(
+        this._docSkeletonManagerService.currentSkeleton$.subscribe((e) => {
+          if (e == null)
+            return;
+          const n = this._currentUniverService.getCurrentUniverDocInstance().zoomRatio || 1;
+          this._updateViewZoom(n, !1);
+        })
+      )
+    );
+  }
+  _commandExecutedListener() {
+    const e = [Xe.id];
+    this.disposeWithMe(
+      this._commandService.onCommandExecuted((t) => {
+        if (e.includes(t.id)) {
+          const n = this._currentUniverService.getCurrentUniverDocInstance(), r = t.params, { unitId: s } = r;
+          if (s !== n.getUnitId())
+            return;
+          const o = n.zoomRatio || 1;
+          this._updateViewZoom(o);
+        }
+      })
+    );
+  }
+  _updateViewZoom(e, t = !0) {
+    var r;
+    const n = this._getDocObject();
+    n != null && (n.scene.scale(e, e), this._calculatePagePosition(n, e), t && this._textSelectionManagerService.refreshSelection(), (r = n.scene.getTransformer()) == null || r.hideControl());
+  }
+  _calculatePagePosition(e, t) {
+    const { document: n, scene: r } = e, s = r == null ? void 0 : r.getParent(), { width: o, height: c, pageMarginLeft: l, pageMarginTop: d } = n;
+    if (s == null || o === Number.POSITIVE_INFINITY || c === Number.POSITIVE_INFINITY)
+      return;
+    const { width: u, height: _ } = s;
+    let g = 0, f = 0, p = 0, a = 0, h = Number.POSITIVE_INFINITY;
+    u > (o + l * 2) * t ? (g = u / 2 - o * t / 2, g /= t, p = (u - l * 2) / t, h = 0) : (g = l, p = o + l * 2, h = (p - u / t) / 2), _ > c ? (f = _ / 2 - c / 2, a = (_ - d * 2) / t) : (f = d, a = c + d * 2), r.resize(p, a + 200), n.translate(g, f);
+    const C = r.getViewport(Pe.VIEW_MAIN);
+    if (h !== Number.POSITIVE_INFINITY && C != null) {
+      const R = C.getBarScroll(h, 0).x;
+      C.scrollTo({
+        x: R
+      });
+    }
+    return this;
+  }
+  _getDocObject() {
+    return vt(this._currentUniverService, this._renderManagerService);
+  }
+};
+be = di([
+  P(U.Rendered, be),
+  q(0, v(Q)),
+  q(1, M),
+  q(2, O),
+  q(3, Y),
+  q(4, v(le)),
+  q(5, $)
+], be);
+var ui = Object.defineProperty, hi = Object.getOwnPropertyDescriptor, _i = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? hi(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = (n ? o(e, t, r) : o(r)) || r);
+  return n && r && ui(e, t, r), r;
+}, k = (i, e) => (t, n) => e(t, n, i);
+let Ie = class extends H {
+  constructor(e, t, n, r, s, o, c) {
+    super();
+    S(this, "_loadedMap", /* @__PURE__ */ new WeakSet());
+    this._docSkeletonManagerService = e, this._currentUniverService = t, this._commandService = n, this._renderManagerService = r, this._textSelectionRenderManager = s, this._textSelectionManagerService = o, this._editorService = c, this._initialize();
+  }
+  _initialize() {
+    this._init(), this._skeletonListener(), this._commandExecutedListener();
+  }
+  _init() {
+    this.disposeWithMe(
+      this._renderManagerService.currentRender$.subscribe((e) => {
+        this._create(e);
+      })
+    ), this._renderManagerService.getRenderAll().forEach((e, t) => {
+      this._create(t);
+    });
+  }
+  _create(e) {
+    if (e == null || this._currentUniverService.getUniverDocInstance(e) == null)
+      return;
+    const t = this._getDocObjectById(e);
+    t == null || t.document == null || this._loadedMap.has(t.document) || (this._initialMain(e), this._loadedMap.add(t.document));
+  }
+  _initialMain(e) {
+    const t = this._getDocObjectById(e);
+    if (t == null)
+      return;
+    const { document: n, scene: r } = t;
+    this.disposeWithMe(
+      N(
+        n.onPointerEnterObserver.add(() => {
+          this._isEditorReadOnly(e) || (n.cursor = st.TEXT);
+        })
+      )
+    ), this.disposeWithMe(
+      N(
+        n.onPointerLeaveObserver.add(() => {
+          n.cursor = st.DEFAULT, r.resetCursor();
+        })
+      )
+    ), this.disposeWithMe(
+      N(
+        n == null ? void 0 : n.onPointerDownObserver.add((s, o) => {
+          if (this._isEditorReadOnly(e))
+            return;
+          this._currentUniverService.getCurrentUniverDocInstance().getUnitId() !== e && this._currentUniverService.setCurrentUniverDocInstance(e), this._textSelectionRenderManager.eventTrigger(s), this._setEditorFocus(e), s.button !== 2 && o.stopPropagation();
+        })
+      )
+    ), this.disposeWithMe(
+      N(
+        n == null ? void 0 : n.onDblclickObserver.add((s) => {
+          this._textSelectionRenderManager.handleDblClick(s);
+        })
+      )
+    ), this.disposeWithMe(
+      N(
+        n == null ? void 0 : n.onTripleClickObserver.add((s) => {
+          this._textSelectionRenderManager.handleTripleClick(s);
+        })
+      )
+    );
+  }
+  _isEditorReadOnly(e) {
+    const t = this._editorService.getEditor(e);
+    return t ? t.isReadOnly() : !1;
+  }
+  _setEditorFocus(e) {
+    if (this._currentUniverService.getAllUniverSheetsInstance().length > 0) {
+      const n = this._currentUniverService.getCurrentUniverSheetInstance();
+      this._editorService.setOperationSheetUnitId(n.getUnitId());
+    }
+    this._editorService.focusStyle(e);
+  }
+  _commandExecutedListener() {
+    const e = [Xe.id];
+    this.disposeWithMe(
+      this._commandService.onCommandExecuted((t) => {
+        var n;
+        if (e.includes(t.id)) {
+          const r = t.params, { unitId: s } = r, o = (n = this._textSelectionManagerService.getCurrentSelection()) == null ? void 0 : n.unitId;
+          if (s !== o)
+            return;
+          this._textSelectionManagerService.refreshSelection();
+        }
+      })
+    );
+  }
+  _skeletonListener() {
+    this.disposeWithMe(
+      this._docSkeletonManagerService.currentSkeleton$.subscribe((e) => {
+        if (e == null)
+          return;
+        const { unitId: t, skeleton: n } = e, r = this._renderManagerService.getRenderById(t);
+        if (r == null)
+          return;
+        const { scene: s, mainComponent: o } = r;
+        this._textSelectionRenderManager.changeRuntime(n, s, o), this._textSelectionManagerService.setCurrentSelectionNotRefresh({
+          unitId: t,
+          subUnitId: ""
+        });
+      })
+    );
+  }
+  _getDocObjectById(e) {
+    return mn(e, this._renderManagerService);
+  }
+};
+Ie = _i([
+  P(U.Rendered, Ie),
+  k(0, v(Q)),
+  k(1, M),
+  k(2, O),
+  k(3, Y),
+  k(4, de),
+  k(5, v(le)),
+  k(6, $)
+], Ie);
+var pi = Object.defineProperty, gi = Object.getOwnPropertyDescriptor, fi = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? gi(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = (n ? o(e, t, r) : o(r)) || r);
+  return n && r && pi(e, t, r), r;
+}, re = (i, e) => (t, n) => e(t, n, i);
+const ut = 1.5;
+let Te = class extends ce {
+  constructor(i, e, t, n, r) {
+    super(), this._docSkeletonManagerService = i, this._textSelectionManagerService = e, this._editorService = t, this._currentUniverService = n, this._renderManagerService = r, this._init();
+  }
+  _init() {
+    this._textSelectionManagerService.textSelection$.pipe(oe(this.dispose$)).subscribe((i) => {
+      if (i == null)
+        return;
+      const { isEditing: e, unitId: t } = i;
+      e && this._scrollToSelection(t);
+    });
+  }
+  // Let the selection show on the current screen.
+  _scrollToSelection(i) {
+    var b;
+    const e = this._textSelectionManagerService.getActiveRange(), t = this._getDocObject(), n = (b = this._docSkeletonManagerService.getCurrent()) == null ? void 0 : b.skeleton;
+    if (e == null || t == null || n == null)
+      return;
+    const { collapsed: r, startNodePosition: s } = e;
+    if (!r)
+      return;
+    const o = t.document.getOffsetConfig(), { docsLeft: c, docsTop: l } = o, d = new In(o, n), { contentBoxPointGroup: u } = d.getRangePointData(s, s), { left: _, top: g, height: f } = Tn(u), p = _ + c, a = g + l, h = t.scene.getViewport(Pe.VIEW_MAIN), C = !!this._editorService.getEditor(i);
+    if (h == null)
+      return;
+    const {
+      left: R,
+      top: w,
+      right: B,
+      bottom: F
+    } = h.getBounding().viewBound;
+    let X = 0, G = 0;
+    const he = C ? 0 : 100;
+    a < w ? X = a - w : a > F - f && (X = a - F + f + he), p < R ? G = p - R : p > B - ut && (G = p - B + ut);
+    const _e = h.getBarScroll(G, X);
+    h.scrollBy(_e);
+  }
+  _getDocObject() {
+    return vt(this._currentUniverService, this._renderManagerService);
+  }
+};
+Te = fi([
+  P(U.Rendered, Te),
+  re(0, v(Q)),
+  re(1, v(le)),
+  re(2, $),
+  re(3, M),
+  re(4, Y)
+], Te);
+var Si = Object.defineProperty, mi = Object.getOwnPropertyDescriptor, vi = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? mi(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = (n ? o(e, t, r) : o(r)) || r);
+  return n && r && Si(e, t, r), r;
+}, we = (i, e) => (t, n) => e(t, n, i), Be;
+let ht = (Be = class extends wt {
+  constructor(i, e, t, n) {
+    super(Ln), this._config = i, this._injector = e, this._localeService = t, this._logService = n, this._localeService.load({
+      zhCN: Cr
+    }), this._config = pt.deepMerge({}, Un, this._config), this._initDependencies(e), this._initializeCommands();
   }
   onRendered() {
     this._initModules(), this._markDocAsFocused();
@@ -1096,67 +1852,78 @@ let _e = (q = class extends Be {
   }
   _initializeCommands() {
     [
-      vt,
-      Rt,
-      It,
-      yt,
-      bt,
-      xt,
-      Dt,
-      Pt,
-      Mt,
-      Qt,
-      en,
-      Jt
-    ].forEach((e) => {
-      this._injector.get(ye).registerShortcut(e);
+      $n,
+      An,
+      Bn,
+      wn,
+      Fn,
+      jn,
+      Wn,
+      zn,
+      Vn,
+      Rr,
+      br,
+      Or
+    ].forEach((i) => {
+      this._injector.get(en).registerShortcut(i);
     });
   }
-  _initDependencies(e) {
+  _initDependencies(i) {
     [
-      [V],
-      [W],
+      // Controller
+      [fe],
+      [Se],
+      [me],
+      [ve],
+      [Oe],
+      [Re],
+      [be],
+      [Ie],
+      [Te],
       [
         // controllers
-        F,
+        ie,
         {
-          useFactory: () => this._injector.createInstance(F, this._config)
+          useFactory: () => this._injector.createInstance(ie, this._config)
         }
       ],
       [
-        B,
+        ue,
         {
-          useClass: Q
+          useClass: We
         }
-      ]
-    ].forEach((n) => {
-      e.add(n);
+      ],
+      // Render views
+      [Ce]
+    ].forEach((t) => {
+      i.add(t);
     });
   }
   _markDocAsFocused() {
-    const e = this._injector.get(te);
+    const i = this._injector.get(M), e = this._injector.get($);
     try {
-      const t = e.getCurrentUniverDocInstance(), n = t.getUnitId();
-      n !== He && n !== Ve && e.focusUniverInstance(t.getUnitId());
+      const t = i.getCurrentUniverDocInstance(), n = t.getUnitId();
+      e.isEditor(n) || i.focusUniverInstance(t.getUnitId());
     } catch (t) {
       this._logService.warn(t);
     }
   }
   _initModules() {
-    this._injector.get(F);
-  }
-}, h(q, "type", je.Doc), q);
-_e = In([
-  X(1, y(Y)),
-  X(2, y(ee)),
-  X(3, Re)
-], _e);
+    this._injector.get(ie);
+  }
+}, S(Be, "type", Bt.Doc), Be);
+ht = vi([
+  we(1, v(Ee)),
+  we(2, v(Ve)),
+  we(3, gt)
+], ht);
 export {
-  Tt as DOC_UI_PLUGIN_NAME,
-  St as DefaultDocContainerConfig,
-  Ot as DefaultDocUiConfig,
-  Ct as DefaultToolbarConfig,
-  _e as UniverDocsUIPlugin,
-  Nn as enUS,
-  qt as zhCN
+  Ln as DOC_UI_PLUGIN_NAME,
+  Pn as DefaultDocContainerConfig,
+  Un as DefaultDocUiConfig,
+  xn as DefaultToolbarConfig,
+  Ce as DocCanvasView,
+  ht as UniverDocsUIPlugin,
+  xi as enUS,
+  Cr as zhCN
 };