@univerjs/docs-drawing-ui 0.7.0-beta.0 → 0.7.0-nightly.202504301607

package/lib/es/index.js

@@ -1,124 +1,124 @@
-var kt = Object.defineProperty;
-var Wt = (i, e, n) => e in i ? kt(i, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : i[e] = n;
-var Se = (i, e, n) => Wt(i, typeof e != "symbol" ? e + "" : e, n);
-import { CommandType as Y, ICommandService as $, IUniverInstanceService as q, TextX as On, JSONX as X, MemoryCursor as Ht, TextXActionType as Q, IUndoRedoService as Jn, BuildTextUtils as Gt, ArrangeTypeEnum as en, Tools as be, Inject as J, IContextService as et, LocaleService as fn, Disposable as Be, WrapTextType as Ke, PositionedObjectLayoutType as W, BooleanNumber as ae, DrawingTypeEnum as Ue, ObjectRelativeFromV as H, ObjectRelativeFromH as ne, FOCUSING_COMMON_DRAWINGS as sn, UniverInstanceType as _e, Direction as fe, DocumentFlavor as In, DOCS_ZEN_EDITOR_UNIT_ID_KEY as Pn, FOCUSING_UNIVER_EDITOR as jt, UndoCommand as Vt, RedoCommand as $t, DisposableCollection as zt, toDisposable as Oe, fromEventSubject as nt, generateRandomId as Xt, Injector as tt, DOC_DRAWING_PRINTING_COMPONENT_KEY as qt, throttle as An, COLORS as Kt, RxDisposable as Yt, LifecycleService as Zt, LifecycleStages as xn, DependentOn as Qt, IConfigService as Jt, Plugin as ei, merge as ni } from "@univerjs/core";
-import { IDocDrawingService as Fe, UniverDocsDrawingPlugin as ti } from "@univerjs/docs-drawing";
-import { IImageIoService as ii, IDrawingManagerService as we, DRAWING_IMAGE_ALLOW_IMAGE_LIST as ri, DRAWING_IMAGE_COUNT_LIMIT as Ln, ImageUploadStatusType as _n, DRAWING_IMAGE_ALLOW_SIZE as oi, getImageSize as si, getDrawingShapeKeyByDrawingSearch as ai, DRAWING_IMAGE_WIDTH_LIMIT as Un, DRAWING_IMAGE_HEIGHT_LIMIT as Bn, UniverDrawingPlugin as ci } from "@univerjs/drawing";
-import { DrawingCommonPanel as di, DrawingRenderService as it, ImageCropperObject as li, COMPONENT_IMAGE_POPUP_MENU as gi, OpenImageCropOperation as mi, ImageResetSizeOperation as ui, UniverDrawingUIPlugin as hi } from "@univerjs/drawing-ui";
-import { IRenderManagerService as ee, DocumentEditArea as Ge, getCurrentTypeOfRenderer as fi, CURSOR_TYPE as Fn, Liquid as rt, PageLayoutType as kn, DocumentSkeletonPageType as Wn, Vector2 as pi, Rect as wi, getColor as vi, TRANSFORM_CHANGE_OBSERVABLE_TYPE as Ii } from "@univerjs/engine-render";
-import { IMessageService as _i, ILocalFileService as Si, ISidebarService as Di, useDependency as Ie, getMenuHiddenObservable as ot, MenuItemType as st, RibbonStartGroup as Ci, KeyCode as je, ComponentManager as at, IMenuManagerService as Oi, IShortcutService as Pi, CanvasFloatDomService as Ti, PrintFloatDomSingle as yi, connectInjector as Mi, UniverUIPlugin as bi } from "@univerjs/ui";
-import { RichTextEditingMutation as te, DocSelectionManagerService as Tn, DocSkeletonManagerService as ie } from "@univerjs/docs";
-import { DocSelectionRenderService as Re, getRichTextEditPath as Ye, getCustomBlockIdsInSelections as Ri, docDrawingPositionToTransform as ct, VIEWPORT_KEY as dt, SetDocZoomRatioOperation as lt, DocPrintInterceptorService as Ni, NodePositionConvertToCursor as Hn, getOneTextSelectionRange as Gn, getAnchorBounding as Ei, TEXT_RANGE_LAYER_INDEX as Ai, getDocObject as xi, DocCanvasPopManagerService as Li, IEditorService as Ui } from "@univerjs/docs-ui";
-import { MessageType as jn, clsx as V, InputNumber as He, Select as Vn, Checkbox as Bi, RadioGroup as $n, Radio as Me, render as Fi, unmount as ki } from "@univerjs/design";
-import { BehaviorSubject as yn, debounceTime as gt, Observable as Wi, map as zn, switchMap as Hi, of as Gi, takeUntil as Xn, filter as qn } from "rxjs";
-import { jsxs as K, jsx as f } from "react/jsx-runtime";
-import { forwardRef as mt, useRef as ji, createElement as ut, useState as se, useEffect as Mn, useMemo as Vi } from "react";
-const $i = "docs-drawing-ui.config", Kn = {};
-var pe = function() {
-  return pe = Object.assign || function(i) {
-    for (var e, n = 1, t = arguments.length; n < t; n++) {
-      e = arguments[n];
+var kn = Object.defineProperty;
+var Fn = (i, e, t) => e in i ? kn(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t;
+var _e = (i, e, t) => Fn(i, typeof e != "symbol" ? e + "" : e, t);
+import { CommandType as q, ICommandService as G, IUniverInstanceService as z, TextX as Dt, JSONX as $, MemoryCursor as jn, TextXActionType as Y, IUndoRedoService as Zt, BuildTextUtils as Wn, ArrangeTypeEnum as Je, Tools as Ce, Inject as Z, IContextService as Qt, LocaleService as ft, Disposable as Ue, WrapTextType as qe, PositionedObjectLayoutType as F, BooleanNumber as se, DrawingTypeEnum as Le, ObjectRelativeFromV as j, ObjectRelativeFromH as J, FOCUSING_COMMON_DRAWINGS as rt, UniverInstanceType as Ie, Direction as he, DocumentFlavor as pt, DOCS_ZEN_EDITOR_UNIT_ID_KEY as yt, FOCUSING_UNIVER_EDITOR as Hn, UndoCommand as Gn, RedoCommand as Vn, DisposableCollection as $n, toDisposable as ye, fromEventSubject as Jt, generateRandomId as zn, Injector as en, DOC_DRAWING_PRINTING_COMPONENT_KEY as Xn, throttle as Et, COLORS as qn, RxDisposable as Kn, LifecycleService as Yn, LifecycleStages as Rt, DependentOn as Zn, IConfigService as Qn, Plugin as Jn, merge as ei } from "@univerjs/core";
+import { IDocDrawingService as Be, UniverDocsDrawingPlugin as ti } from "@univerjs/docs-drawing";
+import { IImageIoService as ni, IDrawingManagerService as ve, DRAWING_IMAGE_ALLOW_IMAGE_LIST as ii, DRAWING_IMAGE_COUNT_LIMIT as At, ImageUploadStatusType as wt, DRAWING_IMAGE_ALLOW_SIZE as ri, getImageSize as si, getDrawingShapeKeyByDrawingSearch as oi, DRAWING_IMAGE_WIDTH_LIMIT as Pt, DRAWING_IMAGE_HEIGHT_LIMIT as Lt, UniverDrawingPlugin as ai } from "@univerjs/drawing";
+import { DrawingCommonPanel as ci, DrawingRenderService as tn, ImageCropperObject as di, COMPONENT_IMAGE_POPUP_MENU as li, OpenImageCropOperation as ui, ImageResetSizeOperation as gi, UniverDrawingUIPlugin as fi } from "@univerjs/drawing-ui";
+import { IRenderManagerService as Q, DocumentEditArea as We, getCurrentTypeOfRenderer as hi, CURSOR_TYPE as Ut, Liquid as nn, PageLayoutType as Bt, DocumentSkeletonPageType as kt, Vector2 as mi, Rect as vi, getColor as pi, TRANSFORM_CHANGE_OBSERVABLE_TYPE as wi } from "@univerjs/engine-render";
+import { IMessageService as Ii, ILocalFileService as _i, ISidebarService as Si, useDependency as we, getMenuHiddenObservable as rn, MenuItemType as sn, RibbonStartGroup as Di, KeyCode as He, ComponentManager as on, IMenuManagerService as yi, IShortcutService as Oi, CanvasFloatDomService as Ti, PrintFloatDomSingle as Mi, connectInjector as bi, UniverUIPlugin as Ci } from "@univerjs/ui";
+import { RichTextEditingMutation as ee, DocSelectionManagerService as Ot, DocSkeletonManagerService as te } from "@univerjs/docs";
+import { DocSelectionRenderService as xe, getRichTextEditPath as Ke, getCustomBlockIdsInSelections as xi, docDrawingPositionToTransform as an, VIEWPORT_KEY as cn, SetDocZoomRatioOperation as dn, DocPrintInterceptorService as Ni, NodePositionConvertToCursor as Ft, getOneTextSelectionRange as jt, getAnchorBounding as Ei, TEXT_RANGE_LAYER_INDEX as Ri, getDocObject as Ai, DocCanvasPopManagerService as Pi, IEditorService as Li } from "@univerjs/docs-ui";
+import { MessageType as Wt, InputNumber as je, Select as Ht, Checkbox as Ui, clsx as ue, RadioGroup as Gt, Radio as be, render as Bi, unmount as ki } from "@univerjs/design";
+import { BehaviorSubject as Tt, debounceTime as ln, Observable as Fi, map as Vt, switchMap as ji, of as Wi, takeUntil as $t, filter as zt } from "rxjs";
+import { jsxs as X, jsx as m } from "react/jsx-runtime";
+import { forwardRef as un, useRef as Hi, createElement as gn, useState as re, useEffect as Mt, useMemo as Gi } from "react";
+const Vi = "docs-drawing-ui.config", Xt = {};
+var me = function() {
+  return me = Object.assign || function(i) {
+    for (var e, t = 1, n = arguments.length; t < n; t++) {
+      e = arguments[t];
       for (var r in e) Object.prototype.hasOwnProperty.call(e, r) && (i[r] = e[r]);
     }
     return i;
-  }, pe.apply(this, arguments);
-}, zi = function(i, e) {
-  var n = {};
-  for (var t in i) Object.prototype.hasOwnProperty.call(i, t) && e.indexOf(t) < 0 && (n[t] = i[t]);
+  }, me.apply(this, arguments);
+}, $i = function(i, e) {
+  var t = {};
+  for (var n in i) Object.prototype.hasOwnProperty.call(i, n) && e.indexOf(n) < 0 && (t[n] = i[n]);
   if (i != null && typeof Object.getOwnPropertySymbols == "function")
-    for (var r = 0, t = Object.getOwnPropertySymbols(i); r < t.length; r++)
-      e.indexOf(t[r]) < 0 && Object.prototype.propertyIsEnumerable.call(i, t[r]) && (n[t[r]] = i[t[r]]);
-  return n;
-}, ht = mt(function(i, e) {
-  var n = i.icon, t = i.id, r = i.className, o = i.extend, s = zi(i, ["icon", "id", "className", "extend"]), c = "univerjs-icon univerjs-icon-".concat(t, " ").concat(r || "").trim(), d = ji("_".concat(Ki()));
-  return ft(n, "".concat(t), { defIds: n.defIds, idSuffix: d.current }, pe({ ref: e, className: c }, s), o);
+    for (var r = 0, n = Object.getOwnPropertySymbols(i); r < n.length; r++)
+      e.indexOf(n[r]) < 0 && Object.prototype.propertyIsEnumerable.call(i, n[r]) && (t[n[r]] = i[n[r]]);
+  return t;
+}, fn = un(function(i, e) {
+  var t = i.icon, n = i.id, r = i.className, s = i.extend, o = $i(i, ["icon", "id", "className", "extend"]), c = "univerjs-icon univerjs-icon-".concat(n, " ").concat(r || "").trim(), d = Hi("_".concat(qi()));
+  return hn(t, "".concat(n), { defIds: t.defIds, idSuffix: d.current }, me({ ref: e, className: c }, o), s);
 });
-function ft(i, e, n, t, r) {
-  return ut(i.tag, pe(pe({ key: e }, Xi(i, n, r)), t), (qi(i, n).children || []).map(function(o, s) {
-    return ft(o, "".concat(e, "-").concat(i.tag, "-").concat(s), n, void 0, r);
+function hn(i, e, t, n, r) {
+  return gn(i.tag, me(me({ key: e }, zi(i, t, r)), n), (Xi(i, t).children || []).map(function(s, o) {
+    return hn(s, "".concat(e, "-").concat(i.tag, "-").concat(o), t, void 0, r);
   }));
 }
-function Xi(i, e, n) {
-  var t = pe({}, i.attrs);
-  n != null && n.colorChannel1 && t.fill === "colorChannel1" && (t.fill = n.colorChannel1), i.tag === "mask" && t.id && (t.id = t.id + e.idSuffix), Object.entries(t).forEach(function(o) {
-    var s = o[0], c = o[1];
-    s === "mask" && typeof c == "string" && (t[s] = c.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
+function zi(i, e, t) {
+  var n = me({}, i.attrs);
+  t != null && t.colorChannel1 && n.fill === "colorChannel1" && (n.fill = t.colorChannel1), i.tag === "mask" && n.id && (n.id = n.id + e.idSuffix), Object.entries(n).forEach(function(s) {
+    var o = s[0], c = s[1];
+    o === "mask" && typeof c == "string" && (n[o] = c.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
   });
   var r = e.defIds;
-  return !r || r.length === 0 || (i.tag === "use" && t["xlink:href"] && (t["xlink:href"] = t["xlink:href"] + e.idSuffix), Object.entries(t).forEach(function(o) {
-    var s = o[0], c = o[1];
-    typeof c == "string" && (t[s] = c.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
-  })), t;
+  return !r || r.length === 0 || (i.tag === "use" && n["xlink:href"] && (n["xlink:href"] = n["xlink:href"] + e.idSuffix), Object.entries(n).forEach(function(s) {
+    var o = s[0], c = s[1];
+    typeof c == "string" && (n[o] = c.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
+  })), n;
 }
-function qi(i, e) {
-  var n, t = e.defIds;
-  return !t || t.length === 0 ? i : i.tag === "defs" && (!((n = i.children) === null || n === void 0) && n.length) ? pe(pe({}, i), { children: i.children.map(function(r) {
-    return typeof r.attrs.id == "string" && t && t.indexOf(r.attrs.id) > -1 ? pe(pe({}, r), { attrs: pe(pe({}, r.attrs), { id: r.attrs.id + e.idSuffix }) }) : r;
+function Xi(i, e) {
+  var t, n = e.defIds;
+  return !n || n.length === 0 ? i : i.tag === "defs" && (!((t = i.children) === null || t === void 0) && t.length) ? me(me({}, i), { children: i.children.map(function(r) {
+    return typeof r.attrs.id == "string" && n && n.indexOf(r.attrs.id) > -1 ? me(me({}, r), { attrs: me(me({}, r.attrs), { id: r.attrs.id + e.idSuffix }) }) : r;
   }) }) : i;
 }
-function Ki() {
+function qi() {
   return Math.random().toString(36).substring(2, 8);
 }
-ht.displayName = "UniverIcon";
-var Yi = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M2.2498 3.65005C2.2498 2.87685 2.87661 2.25005 3.64981 2.25005H7.9998C8.33118 2.25005 8.5998 1.98142 8.5998 1.65005C8.5998 1.31868 8.33118 1.05005 7.9998 1.05005H3.64981C2.21387 1.05005 1.0498 2.21411 1.0498 3.65005V12.35C1.0498 13.786 2.21386 14.95 3.6498 14.95H12.3498C13.7857 14.95 14.9498 13.786 14.9498 12.3501V8.00005C14.9498 7.66868 14.6812 7.40005 14.3498 7.40005C14.0184 7.40005 13.7498 7.66868 13.7498 8.00005V9.23974L12.2385 8.1063C11.7252 7.72129 11.0068 7.7723 10.5531 8.22605L9.00869 9.77041L6.73916 7.8251C6.24387 7.40055 5.5095 7.41278 5.02864 7.85359L2.2498 10.4009V3.65005ZM2.2498 12.0287V12.35C2.2498 13.1232 2.87661 13.75 3.6498 13.75H12.3498C13.123 13.75 13.7498 13.1232 13.7498 12.3501V10.7397L11.5186 9.06631C11.4829 9.03956 11.433 9.04314 11.4016 9.07458L9.92249 10.5537L11.1015 11.5642C11.3531 11.7799 11.3822 12.1587 11.1666 12.4103C10.9509 12.6619 10.5721 12.691 10.3205 12.4753L5.9582 8.7362C5.92384 8.70674 5.87288 8.70758 5.83952 8.73816L2.2498 12.0287Z", fillRule: "evenodd", clipRule: "evenodd" } }, { tag: "path", attrs: { fill: "currentColor", d: "M11.8097 1.14783C12.1411 1.14783 12.4097 1.41646 12.4097 1.74783V3.297H14.1541C14.4855 3.297 14.7541 3.56563 14.7541 3.897C14.7541 4.22837 14.4855 4.497 14.1541 4.497H12.4097V6.24167C12.4097 6.57304 12.1411 6.84167 11.8097 6.84167C11.4783 6.84167 11.2097 6.57304 11.2097 6.24167V4.497H9.6603C9.32893 4.497 9.0603 4.22837 9.0603 3.897C9.0603 3.56563 9.32893 3.297 9.6603 3.297H11.2097V1.74783C11.2097 1.41646 11.4783 1.14783 11.8097 1.14783Z" } }] }, pt = mt(function(i, e) {
-  return ut(ht, Object.assign({}, i, {
+fn.displayName = "UniverIcon";
+var Ki = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width: "1em", height: "1em" }, children: [{ tag: "path", attrs: { fill: "currentColor", d: "M2.2498 3.65005C2.2498 2.87685 2.87661 2.25005 3.64981 2.25005H7.9998C8.33118 2.25005 8.5998 1.98142 8.5998 1.65005C8.5998 1.31868 8.33118 1.05005 7.9998 1.05005H3.64981C2.21387 1.05005 1.0498 2.21411 1.0498 3.65005V12.35C1.0498 13.786 2.21386 14.95 3.6498 14.95H12.3498C13.7857 14.95 14.9498 13.786 14.9498 12.3501V8.00005C14.9498 7.66868 14.6812 7.40005 14.3498 7.40005C14.0184 7.40005 13.7498 7.66868 13.7498 8.00005V9.23974L12.2385 8.1063C11.7252 7.72129 11.0068 7.7723 10.5531 8.22605L9.00869 9.77041L6.73916 7.8251C6.24387 7.40055 5.5095 7.41278 5.02864 7.85359L2.2498 10.4009V3.65005ZM2.2498 12.0287V12.35C2.2498 13.1232 2.87661 13.75 3.6498 13.75H12.3498C13.123 13.75 13.7498 13.1232 13.7498 12.3501V10.7397L11.5186 9.06631C11.4829 9.03956 11.433 9.04314 11.4016 9.07458L9.92249 10.5537L11.1015 11.5642C11.3531 11.7799 11.3822 12.1587 11.1666 12.4103C10.9509 12.6619 10.5721 12.691 10.3205 12.4753L5.9582 8.7362C5.92384 8.70674 5.87288 8.70758 5.83952 8.73816L2.2498 12.0287Z", fillRule: "evenodd", clipRule: "evenodd" } }, { tag: "path", attrs: { fill: "currentColor", d: "M11.8097 1.14783C12.1411 1.14783 12.4097 1.41646 12.4097 1.74783V3.297H14.1541C14.4855 3.297 14.7541 3.56563 14.7541 3.897C14.7541 4.22837 14.4855 4.497 14.1541 4.497H12.4097V6.24167C12.4097 6.57304 12.1411 6.84167 11.8097 6.84167C11.4783 6.84167 11.2097 6.57304 11.2097 6.24167V4.497H9.6603C9.32893 4.497 9.0603 4.22837 9.0603 3.897C9.0603 3.56563 9.32893 3.297 9.6603 3.297H11.2097V1.74783C11.2097 1.41646 11.4783 1.14783 11.8097 1.14783Z" } }] }, mn = un(function(i, e) {
+  return gn(fn, Object.assign({}, i, {
     id: "add-image-single",
     ref: e,
-    icon: Yi
+    icon: Ki
   }));
 });
-pt.displayName = "AddImageSingle";
-const bn = {
+mn.displayName = "AddImageSingle";
+const bt = {
   id: "doc.command.remove-doc-image",
-  type: Y.COMMAND,
+  type: q.COMMAND,
   // eslint-disable-next-line max-lines-per-function
   handler: (i, e) => {
-    var b, y, E, B;
-    const n = i.get($), t = i.get(q), r = i.get(ee), o = t.getCurrentUniverDocInstance();
-    if (e == null || o == null)
+    var C, M, E, U;
+    const t = i.get(G), n = i.get(z), r = i.get(Q), s = n.getCurrentUniverDocInstance();
+    if (e == null || s == null)
       return !1;
-    const s = r.getRenderById(e.unitId).with(Re), { drawings: c } = e, d = (b = s.getSegment()) != null ? b : "", a = new On(), l = X.getInstance(), m = (E = (y = o.getSelfOrHeaderFooterModel(d).getBody()) == null ? void 0 : y.customBlocks) != null ? E : [], g = c.map((N) => m.find((_) => _.blockId === N.drawingId)).filter((N) => !!N).sort((N, _) => N.startIndex > _.startIndex ? 1 : -1), h = c[0].unitId, u = new Ht();
-    u.reset();
-    const v = g[0].startIndex, w = [
+    const o = r.getRenderById(e.unitId).with(xe), { drawings: c } = e, d = (C = o.getSegment()) != null ? C : "", a = new Dt(), l = $.getInstance(), g = (E = (M = s.getSelfOrHeaderFooterModel(d).getBody()) == null ? void 0 : M.customBlocks) != null ? E : [], u = c.map((N) => g.find((I) => I.blockId === N.drawingId)).filter((N) => !!N).sort((N, I) => N.startIndex > I.startIndex ? 1 : -1), h = c[0].unitId, f = new jn();
+    f.reset();
+    const p = u[0].startIndex, v = [
       {
-        startOffset: v,
-        endOffset: v
+        startOffset: p,
+        endOffset: p
       }
-    ], I = {
-      id: te.id,
+    ], w = {
+      id: ee.id,
       params: {
         unitId: h,
         actions: [],
-        textRanges: w
+        textRanges: v
       }
-    }, O = [];
-    for (const N of g) {
-      const { startIndex: _ } = N;
-      _ > u.cursor && a.push({
-        t: Q.RETAIN,
-        len: _ - u.cursor
+    }, y = [];
+    for (const N of u) {
+      const { startIndex: I } = N;
+      I > f.cursor && a.push({
+        t: Y.RETAIN,
+        len: I - f.cursor
       }), a.push({
-        t: Q.DELETE,
+        t: Y.DELETE,
         len: 1
-      }), u.moveCursorTo(_ + 1);
+      }), f.moveCursorTo(I + 1);
     }
-    const C = Ye(o, d);
-    O.push(l.editOp(a.serialize(), C));
-    for (const N of g) {
-      const { blockId: _ } = N, L = ((B = o.getDrawings()) != null ? B : {})[_], x = o.getDrawingsOrder().indexOf(_), j = l.removeOp(["drawings", _], L), S = l.removeOp(["drawingsOrder", x], _);
-      O.push(j), O.push(S);
+    const D = Ke(s, d);
+    y.push(l.editOp(a.serialize(), D));
+    for (const N of u) {
+      const { blockId: I } = N, P = ((U = s.getDrawings()) != null ? U : {})[I], A = s.getDrawingsOrder().indexOf(I), H = l.removeOp(["drawings", I], P), _ = l.removeOp(["drawingsOrder", A], I);
+      y.push(H), y.push(_);
     }
-    return I.params.actions = O.reduce((N, _) => X.compose(N, _), null), !!n.syncExecuteCommand(I.id, I.params);
+    return w.params.actions = y.reduce((N, I) => $.compose(N, I), null), !!t.syncExecuteCommand(w.id, w.params);
   }
-}, wt = {
+}, vn = {
   id: "doc.command.delete-drawing",
-  type: Y.COMMAND,
+  type: q.COMMAND,
   handler: (i) => {
-    const e = i.get($), t = i.get(Fe).getFocusDrawings();
-    if (t.length === 0)
+    const e = i.get(G), n = i.get(Be).getFocusDrawings();
+    if (n.length === 0)
       return !1;
-    const { unitId: r } = t[0], o = t.map((s) => {
-      const { unitId: c, subUnitId: d, drawingId: a, drawingType: l } = s;
+    const { unitId: r } = n[0], s = n.map((o) => {
+      const { unitId: c, subUnitId: d, drawingId: a, drawingType: l } = o;
       return {
         unitId: c,
         subUnitId: d,
@@ -126,158 +126,158 @@ const bn = {
         drawingType: l
       };
     });
-    return e.executeCommand(bn.id, {
+    return e.executeCommand(bt.id, {
       unitId: r,
-      drawings: o
+      drawings: s
     });
   }
-}, vt = {
+}, pn = {
   id: "doc.command.group-doc-image",
-  type: Y.COMMAND,
+  type: q.COMMAND,
   handler: (i, e) => {
-    i.get($), i.get(Jn);
-    const n = i.get(Fe);
+    i.get(G), i.get(Zt);
+    const t = i.get(Be);
     if (!e) return !1;
-    const t = [];
-    e.forEach(({ parent: l, children: m }) => {
-      t.push(l.unitId), m.forEach((g) => {
-        t.push(g.unitId);
+    const n = [];
+    e.forEach(({ parent: l, children: g }) => {
+      n.push(l.unitId), g.forEach((u) => {
+        n.push(u.unitId);
       });
     });
-    const r = n.getGroupDrawingOp(e), { unitId: o, subUnitId: s, undo: c, redo: d, objects: a } = r;
+    const r = t.getGroupDrawingOp(e), { unitId: s, subUnitId: o, undo: c, redo: d, objects: a } = r;
     return !1;
   }
-}, Rn = {
+}, Ct = {
   id: "doc.command.insert-doc-image",
-  type: Y.COMMAND,
+  type: q.COMMAND,
   // eslint-disable-next-line max-lines-per-function
   handler: (i, e) => {
-    var y, E, B, N;
+    var M, E, U, N;
     if (e == null)
       return !1;
-    const n = i.get($), t = i.get(Tn), r = i.get(q), o = t.getActiveTextRange(), s = r.getCurrentUniverDocInstance();
-    if (o == null || s == null)
+    const t = i.get(G), n = i.get(Ot), r = i.get(z), s = n.getActiveTextRange(), o = r.getCurrentUniverDocInstance();
+    if (s == null || o == null)
       return !1;
-    const c = s.getUnitId(), { drawings: d } = e, { collapsed: a, startOffset: l, segmentId: m } = o, g = s.getSelfOrHeaderFooterModel(m).getBody();
-    if (g == null)
+    const c = o.getUnitId(), { drawings: d } = e, { collapsed: a, startOffset: l, segmentId: g } = s, u = o.getSelfOrHeaderFooterModel(g).getBody();
+    if (u == null)
       return !1;
-    const h = new On(), u = X.getInstance(), v = [], w = (E = (y = s.getSnapshot().drawingsOrder) == null ? void 0 : y.length) != null ? E : 0;
-    let I = 0;
+    const h = new Dt(), f = $.getInstance(), p = [], v = (E = (M = o.getSnapshot().drawingsOrder) == null ? void 0 : M.length) != null ? E : 0;
+    let w = 0;
     if (a)
       l > 0 && h.push({
-        t: Q.RETAIN,
+        t: Y.RETAIN,
         len: l
       });
     else {
-      const _ = Gt.selection.delete([o], g, 0, null, !1);
-      h.push(..._);
-      const L = Ri(g, [o]), G = (B = s.getDrawings()) != null ? B : {}, x = (N = s.getDrawingsOrder()) != null ? N : [], j = L.sort((S, D) => x.indexOf(S) > x.indexOf(D) ? -1 : x.indexOf(S) < x.indexOf(D) ? 1 : 0);
-      if (j.length > 0)
-        for (const S of j) {
-          const D = G[S], R = x.indexOf(S);
-          if (D == null || R < 0)
+      const I = Wn.selection.delete([s], u, 0, null, !1);
+      h.push(...I);
+      const P = xi(u, [s]), W = (U = o.getDrawings()) != null ? U : {}, A = (N = o.getDrawingsOrder()) != null ? N : [], H = P.sort((_, S) => A.indexOf(_) > A.indexOf(S) ? -1 : A.indexOf(_) < A.indexOf(S) ? 1 : 0);
+      if (H.length > 0)
+        for (const _ of H) {
+          const S = W[_], x = A.indexOf(_);
+          if (S == null || x < 0)
             continue;
-          const T = u.removeOp(["drawings", S], D), U = u.removeOp(["drawingsOrder", R], S);
-          v.push(T), v.push(U), I++;
+          const T = f.removeOp(["drawings", _], S), L = f.removeOp(["drawingsOrder", x], _);
+          p.push(T), p.push(L), w++;
         }
     }
     h.push({
-      t: Q.INSERT,
+      t: Y.INSERT,
       body: {
         dataStream: "\b".repeat(d.length),
-        customBlocks: d.map((_, L) => ({
-          startIndex: L,
-          blockId: _.drawingId
+        customBlocks: d.map((I, P) => ({
+          startIndex: P,
+          blockId: I.drawingId
         }))
       },
       len: d.length
     });
-    const O = Ye(s, m), C = u.editOp(h.serialize(), O);
-    v.push(C);
-    for (const _ of d) {
-      const { drawingId: L } = _, G = u.insertOp(["drawings", L], _), x = u.insertOp(["drawingsOrder", w - I], L);
-      v.push(G), v.push(x);
+    const y = Ke(o, g), D = f.editOp(h.serialize(), y);
+    p.push(D);
+    for (const I of d) {
+      const { drawingId: P } = I, W = f.insertOp(["drawings", P], I), A = f.insertOp(["drawingsOrder", v - w], P);
+      p.push(W), p.push(A);
     }
-    const P = {
-      id: te.id,
+    const O = {
+      id: ee.id,
       params: {
         unitId: c,
         actions: [],
         textRanges: []
       }
     };
-    return P.params.actions = v.reduce((_, L) => X.compose(_, L), null), !!n.syncExecuteCommand(P.id, P.params);
+    return O.params.actions = p.reduce((I, P) => $.compose(I, P), null), !!t.syncExecuteCommand(O.id, O.params);
   }
-}, It = {
+}, wn = {
   id: "doc.command.set-drawing-arrange",
-  type: Y.COMMAND,
+  type: q.COMMAND,
   handler: (i, e) => {
-    const n = i.get($), t = i.get(Fe);
+    const t = i.get(G), n = i.get(Be);
     if (e == null)
       return !1;
-    const { unitId: r, subUnitId: o, drawingIds: s, arrangeType: c } = e, d = { unitId: r, subUnitId: o, drawingIds: s };
+    const { unitId: r, subUnitId: s, drawingIds: o, arrangeType: c } = e, d = { unitId: r, subUnitId: s, drawingIds: o };
     let a;
-    if (c === en.forward ? a = t.getForwardDrawingsOp(d) : c === en.backward ? a = t.getBackwardDrawingOp(d) : c === en.front ? a = t.getFrontDrawingsOp(d) : c === en.back && (a = t.getBackDrawingsOp(d)), a == null)
+    if (c === Je.forward ? a = n.getForwardDrawingsOp(d) : c === Je.backward ? a = n.getBackwardDrawingOp(d) : c === Je.front ? a = n.getFrontDrawingsOp(d) : c === Je.back && (a = n.getBackDrawingsOp(d)), a == null)
       return !1;
     const { redo: l } = a;
     if (l == null)
       return !1;
-    const m = [];
-    let g = be.deepClone(l);
-    g = g.slice(3), g.unshift("drawingsOrder"), m.push(g);
+    const g = [];
+    let u = Ce.deepClone(l);
+    u = u.slice(3), u.unshift("drawingsOrder"), g.push(u);
     const h = {
-      id: te.id,
+      id: ee.id,
       params: {
         unitId: r,
         actions: [],
         textRanges: null
       }
     };
-    return h.params.actions = m.reduce((v, w) => X.compose(v, w), null), !!n.syncExecuteCommand(h.id, h.params);
+    return h.params.actions = g.reduce((p, v) => $.compose(p, v), null), !!t.syncExecuteCommand(h.id, h.params);
   }
-}, _t = {
+}, In = {
   id: "doc.command.ungroup-doc-image",
-  type: Y.COMMAND,
+  type: q.COMMAND,
   handler: (i, e) => {
-    i.get($), i.get(Jn);
-    const n = i.get(Fe);
+    i.get(G), i.get(Zt);
+    const t = i.get(Be);
     if (!e) return !1;
-    const t = [];
-    e.forEach(({ parent: l, children: m }) => {
-      t.push(l.unitId), m.forEach((g) => {
-        t.push(g.unitId);
+    const n = [];
+    e.forEach(({ parent: l, children: g }) => {
+      n.push(l.unitId), g.forEach((u) => {
+        n.push(u.unitId);
       });
     });
-    const r = n.getUngroupDrawingOp(e), { unitId: o, subUnitId: s, undo: c, redo: d, objects: a } = r;
+    const r = t.getUngroupDrawingOp(e), { unitId: s, subUnitId: o, undo: c, redo: d, objects: a } = r;
     return !1;
   }
 };
-class pn {
+class ht {
   constructor() {
-    Se(this, "_refreshDrawings$", new yn(null));
-    Se(this, "refreshDrawings$", this._refreshDrawings$.asObservable());
+    _e(this, "_refreshDrawings$", new Tt(null));
+    _e(this, "refreshDrawings$", this._refreshDrawings$.asObservable());
   }
   refreshDrawings(e) {
     this._refreshDrawings$.next(e);
   }
 }
-var Zi = Object.getOwnPropertyDescriptor, Qi = (i, e, n, t) => {
-  for (var r = t > 1 ? void 0 : t ? Zi(e, n) : e, o = i.length - 1, s; o >= 0; o--)
-    (s = i[o]) && (r = s(r) || r);
+var Yi = Object.getOwnPropertyDescriptor, Zi = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Yi(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = o(r) || r);
   return r;
-}, ue = (i, e) => (n, t) => e(n, t, i);
-let an = class extends Be {
-  constructor(i, e, n, t, r, o, s, c, d, a, l, m, g) {
-    super(), this._context = i, this._commandService = e, this._docSelectionManagerService = n, this._renderManagerSrv = t, this._imageIoService = r, this._docDrawingService = o, this._drawingManagerService = s, this._contextService = c, this._messageService = d, this._localeService = a, this._docSelectionRenderService = l, this._docRefreshDrawingsService = m, this._fileOpenerService = g, this._updateOrderListener(), this._groupDrawingListener(), this._focusDrawingListener(), this._transformDrawingListener(), this._editAreaChangeListener();
+}, ge = (i, e) => (t, n) => e(t, n, i);
+let st = class extends Ue {
+  constructor(i, e, t, n, r, s, o, c, d, a, l, g, u) {
+    super(), this._context = i, this._commandService = e, this._docSelectionManagerService = t, this._renderManagerSrv = n, this._imageIoService = r, this._docDrawingService = s, this._drawingManagerService = o, this._contextService = c, this._messageService = d, this._localeService = a, this._docSelectionRenderService = l, this._docRefreshDrawingsService = g, this._fileOpenerService = u, this._updateOrderListener(), this._groupDrawingListener(), this._focusDrawingListener(), this._transformDrawingListener(), this._editAreaChangeListener();
   }
   async insertDocImage() {
     const i = await this._fileOpenerService.openFile({
       multiple: !0,
-      accept: ri.map((n) => `.${n.replace("image/", "")}`).join(",")
+      accept: ii.map((t) => `.${t.replace("image/", "")}`).join(",")
     }), e = i.length;
-    return e > Ln ? (this._messageService.show({
-      type: jn.Error,
-      content: this._localeService.t("update-status.exceedMaxCount", String(Ln))
+    return e > At ? (this._messageService.show({
+      type: Wt.Error,
+      content: this._localeService.t("update-status.exceedMaxCount", String(At))
     }), !1) : e === 0 ? !1 : (await this._insertFloatImages(i), !0);
   }
   // eslint-disable-next-line max-lines-per-function
@@ -286,74 +286,74 @@ let an = class extends Be {
     try {
       e = await Promise.all(i.map((r) => this._imageIoService.saveImage(r)));
     } catch (r) {
-      const o = r.message;
-      let s = "";
-      switch (o) {
-        case _n.ERROR_EXCEED_SIZE:
-          s = this._localeService.t("update-status.exceedMaxSize", String(oi / (1024 * 1024)));
+      const s = r.message;
+      let o = "";
+      switch (s) {
+        case wt.ERROR_EXCEED_SIZE:
+          o = this._localeService.t("update-status.exceedMaxSize", String(ri / (1024 * 1024)));
           break;
-        case _n.ERROR_IMAGE_TYPE:
-          s = this._localeService.t("update-status.invalidImageType");
+        case wt.ERROR_IMAGE_TYPE:
+          o = this._localeService.t("update-status.invalidImageType");
           break;
-        case _n.ERROR_IMAGE:
-          s = this._localeService.t("update-status.invalidImage");
+        case wt.ERROR_IMAGE:
+          o = this._localeService.t("update-status.invalidImage");
           break;
       }
       this._messageService.show({
-        type: jn.Error,
-        content: s
+        type: Wt.Error,
+        content: o
       });
     }
     if (e.length === 0)
       return;
-    const { unitId: n } = this._context, t = [];
+    const { unitId: t } = this._context, n = [];
     for (const r of e) {
       if (r == null)
         continue;
-      const { imageId: o, imageSourceType: s, source: c, base64Cache: d } = r, { width: a, height: l, image: m } = await si(d || "");
-      this._imageIoService.addImageSourceCache(o, s, m);
-      let g = 1;
-      if (a > Un || l > Bn) {
-        const w = Un / a, I = Bn / l;
-        g = Math.min(w, I);
+      const { imageId: s, imageSourceType: o, source: c, base64Cache: d } = r, { width: a, height: l, image: g } = await si(d || "");
+      this._imageIoService.addImageSourceCache(s, o, g);
+      let u = 1;
+      if (a > Pt || l > Lt) {
+        const v = Pt / a, w = Lt / l;
+        u = Math.min(v, w);
       }
-      const h = this._getImagePosition(a * g, l * g);
+      const h = this._getImagePosition(a * u, l * u);
       if (h == null)
         return;
-      const u = {
-        unitId: n,
-        subUnitId: n,
-        drawingId: o,
-        drawingType: Ue.DRAWING_IMAGE,
-        imageSourceType: s,
+      const f = {
+        unitId: t,
+        subUnitId: t,
+        drawingId: s,
+        drawingType: Le.DRAWING_IMAGE,
+        imageSourceType: o,
         source: c,
-        transform: ct(h),
+        transform: an(h),
         docTransform: h,
-        behindDoc: ae.FALSE,
+        behindDoc: se.FALSE,
         title: "",
         description: "",
-        layoutType: W.INLINE,
+        layoutType: F.INLINE,
         // Insert inline drawing by default.
-        wrapText: Ke.BOTH_SIDES,
+        wrapText: qe.BOTH_SIDES,
         distB: 0,
         distL: 0,
         distR: 0,
         distT: 0
       };
-      this._isInsertInHeaderFooter() && (u.isMultiTransform = ae.TRUE, u.transforms = u.transform ? [u.transform] : null), t.push(u);
+      this._isInsertInHeaderFooter() && (f.isMultiTransform = se.TRUE, f.transforms = f.transform ? [f.transform] : null), n.push(f);
     }
-    this._commandService.executeCommand(Rn.id, {
-      unitId: n,
-      drawings: t
+    this._commandService.executeCommand(Ct.id, {
+      unitId: t,
+      drawings: n
     });
   }
   _isInsertInHeaderFooter() {
-    var t;
-    const { unitId: i } = this._context, e = (t = this._renderManagerSrv.getRenderById(i)) == null ? void 0 : t.with(ie).getViewModel(), n = e == null ? void 0 : e.getEditArea();
-    return n === Ge.HEADER || n === Ge.FOOTER;
+    var n;
+    const { unitId: i } = this._context, e = (n = this._renderManagerSrv.getRenderById(i)) == null ? void 0 : n.with(te).getViewModel(), t = e == null ? void 0 : e.getEditArea();
+    return t === We.HEADER || t === We.FOOTER;
   }
   _getImagePosition(i, e) {
-    const n = this._docSelectionRenderService.getActiveTextRange(), t = (n == null ? void 0 : n.getAbsolutePosition()) || {
+    const t = this._docSelectionRenderService.getActiveTextRange(), n = (t == null ? void 0 : t.getAbsolutePosition()) || {
       left: 0
     };
     return {
@@ -362,11 +362,11 @@ let an = class extends Be {
         height: e
       },
       positionH: {
-        relativeFrom: ne.PAGE,
-        posOffset: t.left
+        relativeFrom: J.PAGE,
+        posOffset: n.left
       },
       positionV: {
-        relativeFrom: H.PARAGRAPH,
+        relativeFrom: j.PARAGRAPH,
         posOffset: 0
       },
       angle: 0
@@ -374,33 +374,33 @@ let an = class extends Be {
   }
   _updateOrderListener() {
     this._drawingManagerService.featurePluginOrderUpdate$.subscribe((i) => {
-      const { unitId: e, subUnitId: n, drawingIds: t, arrangeType: r } = i;
-      this._commandService.executeCommand(It.id, {
+      const { unitId: e, subUnitId: t, drawingIds: n, arrangeType: r } = i;
+      this._commandService.executeCommand(wn.id, {
         unitId: e,
-        subUnitId: n,
-        drawingIds: t,
+        subUnitId: t,
+        drawingIds: n,
         arrangeType: r
       });
     });
   }
   _groupDrawingListener() {
     this._drawingManagerService.featurePluginGroupUpdate$.subscribe((i) => {
-      this._commandService.executeCommand(vt.id, i);
+      this._commandService.executeCommand(pn.id, i);
     }), this._drawingManagerService.featurePluginUngroupUpdate$.subscribe((i) => {
-      this._commandService.executeCommand(_t.id, i);
+      this._commandService.executeCommand(In.id, i);
     });
   }
   _getCurrentSceneAndTransformer() {
     const { scene: i, mainComponent: e } = this._context;
     if (i == null || e == null)
       return;
-    const n = i.getTransformerByCreate(), { docsLeft: t, docsTop: r } = e.getOffsetConfig();
-    return { scene: i, transformer: n, docsLeft: t, docsTop: r };
+    const t = i.getTransformerByCreate(), { docsLeft: n, docsTop: r } = e.getOffsetConfig();
+    return { scene: i, transformer: t, docsLeft: n, docsTop: r };
   }
   _transformDrawingListener() {
     const i = this._getCurrentSceneAndTransformer();
     if (i && i.transformer)
-      this.disposeWithMe(i.transformer.changeEnd$.pipe(gt(30)).subscribe((e) => {
+      this.disposeWithMe(i.transformer.changeEnd$.pipe(ln(30)).subscribe((e) => {
         this._docSelectionManagerService.refreshSelection();
       }));
     else
@@ -410,30 +410,30 @@ let an = class extends Be {
     this.disposeWithMe(
       this._drawingManagerService.focus$.subscribe((i) => {
         var r;
-        const { transformer: e, docsLeft: n, docsTop: t } = (r = this._getCurrentSceneAndTransformer()) != null ? r : {};
+        const { transformer: e, docsLeft: t, docsTop: n } = (r = this._getCurrentSceneAndTransformer()) != null ? r : {};
         if (i == null || i.length === 0)
-          this._contextService.setContextValue(sn, !1), this._docDrawingService.focusDrawing([]), e && e.resetProps({
+          this._contextService.setContextValue(rt, !1), this._docDrawingService.focusDrawing([]), e && e.resetProps({
             zeroTop: 0,
             zeroLeft: 0
           });
         else {
-          this._contextService.setContextValue(sn, !0), this._docDrawingService.focusDrawing(i), this._setDrawingSelections(i);
-          const o = this._docSelectionRenderService.getSegment(), s = this._findSegmentIdByDrawingId(i[0].drawingId);
-          o !== s && this._docSelectionRenderService.setSegment(s), e && e.resetProps({
-            zeroTop: t,
-            zeroLeft: n
+          this._contextService.setContextValue(rt, !0), this._docDrawingService.focusDrawing(i), this._setDrawingSelections(i);
+          const s = this._docSelectionRenderService.getSegment(), o = this._findSegmentIdByDrawingId(i[0].drawingId);
+          s !== o && this._docSelectionRenderService.setSegment(o), e && e.resetProps({
+            zeroTop: n,
+            zeroLeft: t
           });
         }
       })
     );
   }
   _findSegmentIdByDrawingId(i) {
-    var s, c, d;
-    const { unit: e } = this._context, { body: n, headers: t = {}, footers: r = {} } = e.getSnapshot();
-    if (((s = n == null ? void 0 : n.customBlocks) != null ? s : []).some((a) => a.blockId === i))
+    var o, c, d;
+    const { unit: e } = this._context, { body: t, headers: n = {}, footers: r = {} } = e.getSnapshot();
+    if (((o = t == null ? void 0 : t.customBlocks) != null ? o : []).some((a) => a.blockId === i))
       return "";
-    for (const a of Object.keys(t))
-      if ((c = t[a].body.customBlocks) != null && c.some((l) => l.blockId === i))
+    for (const a of Object.keys(n))
+      if ((c = n[a].body.customBlocks) != null && c.some((l) => l.blockId === i))
         return a;
     for (const a of Object.keys(r))
       if ((d = r[a].body.customBlocks) != null && d.some((l) => l.blockId === i))
@@ -443,23 +443,23 @@ let an = class extends Be {
   // Update drawings edit status and opacity. You can not edit header footer images when you are editing body. and vice verse.
   _updateDrawingsEditStatus() {
     var c;
-    const { unit: i, scene: e, unitId: n } = this._context, t = (c = this._renderManagerSrv.getRenderById(n)) == null ? void 0 : c.with(ie).getViewModel();
-    if (t == null || i == null)
+    const { unit: i, scene: e, unitId: t } = this._context, n = (c = this._renderManagerSrv.getRenderById(t)) == null ? void 0 : c.with(te).getViewModel();
+    if (n == null || i == null)
       return;
-    const r = i.getSnapshot(), { drawings: o = {} } = r, s = t.getEditArea() === Ge.BODY;
-    for (const d of Object.keys(o)) {
-      const a = o[d], l = ai({ unitId: n, drawingId: a.drawingId, subUnitId: n }), m = e.fuzzyMathObjects(l, !0);
-      if (m.length)
-        for (const g of m) {
-          e.detachTransformerFrom(g);
+    const r = i.getSnapshot(), { drawings: s = {} } = r, o = n.getEditArea() === We.BODY;
+    for (const d of Object.keys(s)) {
+      const a = s[d], l = oi({ unitId: t, drawingId: a.drawingId, subUnitId: t }), g = e.fuzzyMathObjects(l, !0);
+      if (g.length)
+        for (const u of g) {
+          e.detachTransformerFrom(u);
           try {
-            g.setOpacity(0.5);
+            u.setOpacity(0.5);
           } catch {
           }
-          if (s && a.isMultiTransform !== ae.TRUE || !s && a.isMultiTransform === ae.TRUE) {
-            a.allowTransform !== !1 && e.attachTransformerTo(g);
+          if (o && a.isMultiTransform !== se.TRUE || !o && a.isMultiTransform === se.TRUE) {
+            a.allowTransform !== !1 && e.attachTransformerTo(u);
             try {
-              g.setOpacity(1);
+              u.setOpacity(1);
             } catch {
             }
           }
@@ -467,77 +467,77 @@ let an = class extends Be {
     }
   }
   _editAreaChangeListener() {
-    var n;
-    const { unitId: i } = this._context, e = (n = this._renderManagerSrv.getRenderById(i)) == null ? void 0 : n.with(ie).getViewModel();
+    var t;
+    const { unitId: i } = this._context, e = (t = this._renderManagerSrv.getRenderById(i)) == null ? void 0 : t.with(te).getViewModel();
     e != null && (this._updateDrawingsEditStatus(), this.disposeWithMe(
       e.editAreaChange$.subscribe(() => {
         this._updateDrawingsEditStatus();
       })
-    ), this._docRefreshDrawingsService.refreshDrawings$.subscribe((t) => {
-      t != null && queueMicrotask(() => {
+    ), this._docRefreshDrawingsService.refreshDrawings$.subscribe((n) => {
+      n != null && queueMicrotask(() => {
         this._updateDrawingsEditStatus();
       });
     }), this.disposeWithMe(
-      this._commandService.onCommandExecuted(async (t) => {
-        t.id === te.id && queueMicrotask(() => {
+      this._commandService.onCommandExecuted(async (n) => {
+        n.id === ee.id && queueMicrotask(() => {
           this._updateDrawingsEditStatus();
         });
       })
     ));
   }
   _setDrawingSelections(i) {
-    var r, o;
-    const { unit: e } = this._context, n = (o = (r = e.getSnapshot().body) == null ? void 0 : r.customBlocks) != null ? o : [], t = i.map((s) => {
-      const c = s.drawingId, d = n.find((a) => a.blockId === c);
+    var r, s;
+    const { unit: e } = this._context, t = (s = (r = e.getSnapshot().body) == null ? void 0 : r.customBlocks) != null ? s : [], n = i.map((o) => {
+      const c = o.drawingId, d = t.find((a) => a.blockId === c);
       return d ? d.startIndex : null;
-    }).filter((s) => s !== null).map((s) => ({ startOffset: s, endOffset: s + 1 }));
-    this._docSelectionManagerService.replaceDocRanges(t);
+    }).filter((o) => o !== null).map((o) => ({ startOffset: o, endOffset: o + 1 }));
+    this._docSelectionManagerService.replaceDocRanges(n);
   }
 };
-an = Qi([
-  ue(1, $),
-  ue(2, J(Tn)),
-  ue(3, ee),
-  ue(4, ii),
-  ue(5, Fe),
-  ue(6, we),
-  ue(7, et),
-  ue(8, _i),
-  ue(9, J(fn)),
-  ue(10, J(Re)),
-  ue(11, J(pn)),
-  ue(12, Si)
-], an);
-const St = {
+st = Zi([
+  ge(1, G),
+  ge(2, Z(Ot)),
+  ge(3, Q),
+  ge(4, ni),
+  ge(5, Be),
+  ge(6, ve),
+  ge(7, Qt),
+  ge(8, Ii),
+  ge(9, Z(ft)),
+  ge(10, Z(xe)),
+  ge(11, Z(ht)),
+  ge(12, _i)
+], st);
+const _n = {
   id: "doc.command.insert-float-image",
-  type: Y.COMMAND,
+  type: q.COMMAND,
   handler: (i) => {
-    var t, r;
-    const e = i.get(q), n = i.get(ee);
-    return (r = (t = fi(_e.UNIVER_DOC, e, n)) == null ? void 0 : t.with(an).insertDocImage()) != null ? r : !1;
+    var n, r;
+    const e = i.get(z), t = i.get(Q);
+    return (r = (n = hi(Ie.UNIVER_DOC, e, t)) == null ? void 0 : n.with(st).insertDocImage()) != null ? r : !1;
   }
 };
-var he = /* @__PURE__ */ ((i) => (i.INLINE = "inline", i.BEHIND_TEXT = "behindText", i.IN_FRONT_OF_TEXT = "inFrontOfText", i.WRAP_SQUARE = "wrapSquare", i.WRAP_TOP_AND_BOTTOM = "wrapTopAndBottom", i))(he || {});
-const Ji = {
-  inline: W.INLINE,
-  wrapSquare: W.WRAP_SQUARE,
-  wrapTopAndBottom: W.WRAP_TOP_AND_BOTTOM,
-  inFrontOfText: W.WRAP_NONE,
-  behindText: W.WRAP_NONE
+var fe = /* @__PURE__ */ ((i) => (i.INLINE = "inline", i.BEHIND_TEXT = "behindText", i.IN_FRONT_OF_TEXT = "inFrontOfText", i.WRAP_SQUARE = "wrapSquare", i.WRAP_TOP_AND_BOTTOM = "wrapTopAndBottom", i))(fe || {});
+const Qi = {
+  inline: F.INLINE,
+  wrapSquare: F.WRAP_SQUARE,
+  wrapTopAndBottom: F.WRAP_TOP_AND_BOTTOM,
+  inFrontOfText: F.WRAP_NONE,
+  behindText: F.WRAP_NONE
 };
-function Dt(i, e, n, t, r, o, s) {
-  var h, u;
-  const c = new On(), d = X.getInstance(), a = [], l = o.getSelfOrHeaderFooterModel(e).getBody(), m = o.getSelfOrHeaderFooterModel(i).getBody();
-  if (l == null || m == null)
+function Sn(i, e, t, n, r, s, o) {
+  var h, f;
+  const c = new Dt(), d = $.getInstance(), a = [], l = s.getSelfOrHeaderFooterModel(e).getBody(), g = s.getSelfOrHeaderFooterModel(i).getBody();
+  if (l == null || g == null)
     return;
-  const g = (u = (h = l.customBlocks) == null ? void 0 : h.find((v) => v.blockId === r)) == null ? void 0 : u.startIndex;
-  if (g != null) {
-    if (t = Math.min(m.dataStream.length - 2, t), i === e) {
-      if (t < g ? (t > 0 && c.push({
-        t: Q.RETAIN,
-        len: t
+  const u = (f = (h = l.customBlocks) == null ? void 0 : h.find((p) => p.blockId === r)) == null ? void 0 : f.startIndex;
+  if (u != null) {
+    if (n = Math.min(g.dataStream.length - 2, n), i === e) {
+      if (n < u ? (n > 0 && c.push({
+        t: Y.RETAIN,
+        len: n
       }), c.push({
-        t: Q.INSERT,
+        t: Y.INSERT,
         body: {
           dataStream: "\b",
           customBlocks: [{
@@ -547,22 +547,22 @@ function Dt(i, e, n, t, r, o, s) {
         },
         len: 1
       }), c.push({
-        t: Q.RETAIN,
-        len: g - t
+        t: Y.RETAIN,
+        len: u - n
       }), c.push({
-        t: Q.DELETE,
+        t: Y.DELETE,
         len: 1
-      })) : (g > 0 && c.push({
-        t: Q.RETAIN,
-        len: g
+      })) : (u > 0 && c.push({
+        t: Y.RETAIN,
+        len: u
       }), c.push({
-        t: Q.DELETE,
+        t: Y.DELETE,
         len: 1
-      }), t - g - 1 > 0 && c.push({
-        t: Q.RETAIN,
-        len: t - g - 1
+      }), n - u - 1 > 0 && c.push({
+        t: Y.RETAIN,
+        len: n - u - 1
       }), c.push({
-        t: Q.INSERT,
+        t: Y.INSERT,
         body: {
           dataStream: "\b",
           customBlocks: [{
@@ -571,24 +571,24 @@ function Dt(i, e, n, t, r, o, s) {
           }]
         },
         len: 1
-      })), t !== g) {
-        const v = Ye(o, e), w = d.editOp(c.serialize(), v);
-        a.push(w);
+      })), n !== u) {
+        const p = Ke(s, e), v = d.editOp(c.serialize(), p);
+        a.push(v);
       }
     } else {
-      g > 0 && c.push({
-        t: Q.RETAIN,
-        len: g
+      u > 0 && c.push({
+        t: Y.RETAIN,
+        len: u
       }), c.push({
-        t: Q.DELETE,
+        t: Y.DELETE,
         len: 1
       });
-      let v = Ye(o, e), w = d.editOp(c.serialize(), v);
-      a.push(w), c.empty(), t > 0 && c.push({
-        t: Q.RETAIN,
-        len: t
+      let p = Ke(s, e), v = d.editOp(c.serialize(), p);
+      a.push(v), c.empty(), n > 0 && c.push({
+        t: Y.RETAIN,
+        len: n
       }), c.push({
-        t: Q.INSERT,
+        t: Y.INSERT,
         body: {
           dataStream: "\b",
           customBlocks: [{
@@ -597,176 +597,176 @@ function Dt(i, e, n, t, r, o, s) {
           }]
         },
         len: 1
-      }), v = Ye(o, i), w = d.editOp(c.serialize(), v), a.push(w), s.setSegment(i), s.setSegmentPage(n);
+      }), p = Ke(s, i), v = d.editOp(c.serialize(), p), a.push(v), o.setSegment(i), o.setSegmentPage(t);
     }
     return a;
   }
 }
-const Ct = {
+const Dn = {
   id: "doc.command.update-doc-drawing-wrapping-style",
-  type: Y.COMMAND,
+  type: q.COMMAND,
   // eslint-disable-next-line max-lines-per-function, complexity
   handler: (i, e) => {
-    var E, B;
+    var E, U;
     if (e == null)
       return !1;
-    const { drawings: n, wrappingStyle: t, unitId: r } = e, o = i.get($), s = i.get(q), d = i.get(ee).getRenderById(r), a = d == null ? void 0 : d.with(ie).getSkeleton().getSkeletonData(), l = d == null ? void 0 : d.with(ie).getViewModel(), m = d == null ? void 0 : d.scene, g = s.getCurrentUniverDocInstance();
-    if (g == null || a == null || m == null || l == null)
+    const { drawings: t, wrappingStyle: n, unitId: r } = e, s = i.get(G), o = i.get(z), d = i.get(Q).getRenderById(r), a = d == null ? void 0 : d.with(te).getSkeleton().getSkeletonData(), l = d == null ? void 0 : d.with(te).getViewModel(), g = d == null ? void 0 : d.scene, u = o.getCurrentUniverDocInstance();
+    if (u == null || a == null || g == null || l == null)
       return !1;
-    const h = l.getEditArea(), u = m.getTransformerByCreate(), { pages: v, skeHeaders: w, skeFooters: I } = a, O = X.getInstance(), C = [], { drawings: P = {} } = g.getSnapshot();
-    for (const N of n) {
-      const { drawingId: _ } = N, L = P[_].layoutType, G = Ji[t];
-      if (L !== G) {
-        const D = O.replaceOp(["drawings", _, "layoutType"], L, G);
-        C.push(D);
+    const h = l.getEditArea(), f = g.getTransformerByCreate(), { pages: p, skeHeaders: v, skeFooters: w } = a, y = $.getInstance(), D = [], { drawings: O = {} } = u.getSnapshot();
+    for (const N of t) {
+      const { drawingId: I } = N, P = O[I].layoutType, W = Qi[n];
+      if (P !== W) {
+        const S = y.replaceOp(["drawings", I, "layoutType"], P, W);
+        D.push(S);
       }
-      if (t === "behindText" || t === "inFrontOfText") {
-        const D = P[_].behindDoc, R = t === "behindText" ? ae.TRUE : ae.FALSE;
-        if (D !== R) {
-          const T = O.replaceOp(["drawings", _, "behindDoc"], D, R);
-          C.push(T);
+      if (n === "behindText" || n === "inFrontOfText") {
+        const S = O[I].behindDoc, x = n === "behindText" ? se.TRUE : se.FALSE;
+        if (S !== x) {
+          const T = y.replaceOp(["drawings", I, "behindDoc"], S, x);
+          D.push(T);
         }
       }
-      if (t === "inline")
+      if (n === "inline")
         continue;
-      let x = null, j = 0, S = 0;
-      for (const D of v) {
-        const { headerId: R, footerId: T, marginTop: U, marginLeft: F, marginBottom: M, pageWidth: A, pageHeight: z } = D;
+      let A = null, H = 0, _ = 0;
+      for (const S of p) {
+        const { headerId: x, footerId: T, marginTop: L, marginLeft: B, marginBottom: b, pageWidth: R, pageHeight: V } = S;
         switch (h) {
-          case Ge.HEADER: {
-            const k = (E = w.get(R)) == null ? void 0 : E.get(A);
-            k != null && k.skeDrawings.has(_) && (x = k.skeDrawings.get(_), j = k.marginTop, S = F);
+          case We.HEADER: {
+            const k = (E = v.get(x)) == null ? void 0 : E.get(R);
+            k != null && k.skeDrawings.has(I) && (A = k.skeDrawings.get(I), H = k.marginTop, _ = B);
             break;
           }
-          case Ge.FOOTER: {
-            const k = (B = I.get(T)) == null ? void 0 : B.get(A);
-            k != null && k.skeDrawings.has(_) && (x = k.skeDrawings.get(_), j = z - M + k.marginTop, S = F);
+          case We.FOOTER: {
+            const k = (U = w.get(T)) == null ? void 0 : U.get(R);
+            k != null && k.skeDrawings.has(I) && (A = k.skeDrawings.get(I), H = V - b + k.marginTop, _ = B);
             break;
           }
-          case Ge.BODY: {
-            D.skeDrawings.has(_) && (x = D.skeDrawings.get(_), j = U, S = F);
+          case We.BODY: {
+            S.skeDrawings.has(I) && (A = S.skeDrawings.get(I), H = L, _ = B);
             break;
           }
         }
-        if (x != null)
+        if (A != null)
           break;
       }
-      if (x != null) {
-        const { aTop: D, aLeft: R } = x, T = P[_].docTransform.positionH;
-        let U = R;
-        T.relativeFrom === ne.MARGIN ? U -= S : T.relativeFrom === ne.COLUMN && (U -= x.columnLeft);
-        const F = {
+      if (A != null) {
+        const { aTop: S, aLeft: x } = A, T = O[I].docTransform.positionH;
+        let L = x;
+        T.relativeFrom === J.MARGIN ? L -= _ : T.relativeFrom === J.COLUMN && (L -= A.columnLeft);
+        const B = {
           relativeFrom: T.relativeFrom,
-          posOffset: U
+          posOffset: L
         };
-        if (T.posOffset !== F.posOffset) {
-          const k = O.replaceOp(["drawings", _, "docTransform", "positionH"], T, F);
-          C.push(k);
+        if (T.posOffset !== B.posOffset) {
+          const k = y.replaceOp(["drawings", I, "docTransform", "positionH"], T, B);
+          D.push(k);
         }
-        const M = P[_].docTransform.positionV;
-        let A = D;
-        M.relativeFrom === H.PAGE ? A += j : M.relativeFrom === H.LINE ? A -= x.lineTop : M.relativeFrom === H.PARAGRAPH && (A -= x.blockAnchorTop);
-        const z = {
-          relativeFrom: M.relativeFrom,
-          posOffset: A
+        const b = O[I].docTransform.positionV;
+        let R = S;
+        b.relativeFrom === j.PAGE ? R += H : b.relativeFrom === j.LINE ? R -= A.lineTop : b.relativeFrom === j.PARAGRAPH && (R -= A.blockAnchorTop);
+        const V = {
+          relativeFrom: b.relativeFrom,
+          posOffset: R
         };
-        if (M.posOffset !== z.posOffset) {
-          const k = O.replaceOp(["drawings", _, "docTransform", "positionV"], M, z);
-          C.push(k);
+        if (b.posOffset !== V.posOffset) {
+          const k = y.replaceOp(["drawings", I, "docTransform", "positionV"], b, V);
+          D.push(k);
         }
       }
     }
-    const b = {
-      id: te.id,
+    const C = {
+      id: ee.id,
       params: {
         unitId: r,
         actions: [],
         textRanges: null
       }
     };
-    b.params.actions = C.reduce((N, _) => X.compose(N, _), null);
-    const y = o.syncExecuteCommand(b.id, b.params);
-    return u.refreshControls(), !!y;
+    C.params.actions = D.reduce((N, I) => $.compose(N, I), null);
+    const M = s.syncExecuteCommand(C.id, C.params);
+    return f.refreshControls(), !!M;
   }
-}, Ot = {
+}, yn = {
   id: "doc.command.update-doc-drawing-distance",
-  type: Y.COMMAND,
+  type: q.COMMAND,
   handler: (i, e) => {
     if (e == null)
       return !1;
-    const n = i.get($), r = i.get(q).getCurrentUniverDocInstance();
+    const t = i.get(G), r = i.get(z).getCurrentUniverDocInstance();
     if (r == null)
       return !1;
-    const { drawings: o, dist: s, unitId: c } = e, d = X.getInstance(), a = [], { drawings: l = {} } = r.getSnapshot();
-    for (const h of o) {
-      const { drawingId: u } = h;
-      for (const [v, w] of Object.entries(s)) {
-        const I = l[u][v];
-        if (I !== w) {
-          const O = d.replaceOp(["drawings", u, v], I, w);
-          a.push(O);
+    const { drawings: s, dist: o, unitId: c } = e, d = $.getInstance(), a = [], { drawings: l = {} } = r.getSnapshot();
+    for (const h of s) {
+      const { drawingId: f } = h;
+      for (const [p, v] of Object.entries(o)) {
+        const w = l[f][p];
+        if (w !== v) {
+          const y = d.replaceOp(["drawings", f, p], w, v);
+          a.push(y);
         }
       }
     }
-    const m = {
-      id: te.id,
+    const g = {
+      id: ee.id,
       params: {
         unitId: c,
         actions: [],
         textRanges: null
       }
     };
-    return m.params.actions = a.reduce((h, u) => X.compose(h, u), null), !!n.syncExecuteCommand(m.id, m.params);
+    return g.params.actions = a.reduce((h, f) => $.compose(h, f), null), !!t.syncExecuteCommand(g.id, g.params);
   }
-}, Pt = {
+}, On = {
   id: "doc.command.update-doc-drawing-wrap-text",
-  type: Y.COMMAND,
+  type: q.COMMAND,
   handler: (i, e) => {
     if (e == null)
       return !1;
-    const n = i.get($), r = i.get(q).getCurrentUniverDocInstance();
+    const t = i.get(G), r = i.get(z).getCurrentUniverDocInstance();
     if (r == null)
       return !1;
-    const { drawings: o, wrapText: s, unitId: c } = e, d = X.getInstance(), a = [], { drawings: l = {} } = r.getSnapshot();
-    for (const h of o) {
-      const { drawingId: u } = h, v = l[u].wrapText;
-      if (v !== s) {
-        const w = d.replaceOp(["drawings", u, "wrapText"], v, s);
-        a.push(w);
+    const { drawings: s, wrapText: o, unitId: c } = e, d = $.getInstance(), a = [], { drawings: l = {} } = r.getSnapshot();
+    for (const h of s) {
+      const { drawingId: f } = h, p = l[f].wrapText;
+      if (p !== o) {
+        const v = d.replaceOp(["drawings", f, "wrapText"], p, o);
+        a.push(v);
       }
     }
-    const m = {
-      id: te.id,
+    const g = {
+      id: ee.id,
       params: {
         unitId: c,
         actions: [],
         textRanges: null
       }
     };
-    return m.params.actions = a.reduce((h, u) => X.compose(h, u), null), !!n.syncExecuteCommand(m.id, m.params);
+    return g.params.actions = a.reduce((h, f) => $.compose(h, f), null), !!t.syncExecuteCommand(g.id, g.params);
   }
-}, Ze = {
+}, Ye = {
   id: "doc.command.update-drawing-doc-transform",
-  type: Y.COMMAND,
+  type: q.COMMAND,
   handler: (i, e) => {
     if (e == null)
       return !1;
-    const n = i.get($), t = i.get(q), o = i.get(ee).getRenderById(e.unitId), s = o == null ? void 0 : o.scene;
-    if (s == null)
+    const t = i.get(G), n = i.get(z), s = i.get(Q).getRenderById(e.unitId), o = s == null ? void 0 : s.scene;
+    if (o == null)
       return !1;
-    const c = s.getTransformerByCreate(), d = t.getCurrentUniverDocInstance();
+    const c = o.getTransformerByCreate(), d = n.getCurrentUniverDocInstance();
     if (d == null)
       return !1;
-    const { drawings: a, unitId: l } = e, m = X.getInstance(), g = [], { drawings: h = {} } = d.getSnapshot();
-    for (const w of a) {
-      const { drawingId: I, key: O, value: C } = w, P = h[I].docTransform[O];
-      if (!be.diffValue(P, C)) {
-        const b = m.replaceOp(["drawings", I, "docTransform", O], P, C);
-        g.push(b);
+    const { drawings: a, unitId: l } = e, g = $.getInstance(), u = [], { drawings: h = {} } = d.getSnapshot();
+    for (const v of a) {
+      const { drawingId: w, key: y, value: D } = v, O = h[w].docTransform[y];
+      if (!Ce.diffValue(O, D)) {
+        const C = g.replaceOp(["drawings", w, "docTransform", y], O, D);
+        u.push(C);
       }
     }
-    const u = {
-      id: te.id,
+    const f = {
+      id: ee.id,
       params: {
         unitId: l,
         actions: [],
@@ -774,157 +774,157 @@ const Ct = {
         debounce: !0
       }
     };
-    u.params.actions = g.reduce((w, I) => X.compose(w, I), null);
-    const v = n.syncExecuteCommand(u.id, u.params);
-    return c.refreshControls(), !!v;
+    f.params.actions = u.reduce((v, w) => $.compose(v, w), null);
+    const p = t.syncExecuteCommand(f.id, f.params);
+    return c.refreshControls(), !!p;
   }
-}, Tt = {
+}, Tn = {
   id: "doc.command.move-inline-drawing",
-  type: Y.COMMAND,
+  type: q.COMMAND,
   handler: (i, e) => {
-    var B, N;
+    var U, N;
     if (e == null)
       return !1;
-    const n = i.get(ee), t = (B = n.getRenderById(e.unitId)) == null ? void 0 : B.with(Re), r = i.get(pn), o = n.getRenderById(e.unitId), s = o == null ? void 0 : o.scene, c = o == null ? void 0 : o.with(ie).getSkeleton();
-    if (s == null || t == null)
+    const t = i.get(Q), n = (U = t.getRenderById(e.unitId)) == null ? void 0 : U.with(xe), r = i.get(ht), s = t.getRenderById(e.unitId), o = s == null ? void 0 : s.scene, c = s == null ? void 0 : s.with(te).getSkeleton();
+    if (o == null || n == null)
       return !1;
-    const d = s.getTransformerByCreate(), a = i.get($), m = i.get(q).getCurrentUniverDocInstance();
-    if (m == null)
+    const d = o.getTransformerByCreate(), a = i.get(G), g = i.get(z).getCurrentUniverDocInstance();
+    if (g == null)
       return !1;
-    const { drawing: g, unitId: h, offset: u, segmentId: v, segmentPage: w, needRefreshDrawings: I } = e;
-    if (I)
+    const { drawing: u, unitId: h, offset: f, segmentId: p, segmentPage: v, needRefreshDrawings: w } = e;
+    if (w)
       return r.refreshDrawings(c), d.refreshControls(), !0;
-    const O = [], { drawingId: C } = g, P = (N = t.getSegment()) != null ? N : "", b = Dt(
+    const y = [], { drawingId: D } = u, O = (N = n.getSegment()) != null ? N : "", C = Sn(
+      p,
+      O,
       v,
-      P,
-      w,
-      u,
-      C,
-      m,
-      t
+      f,
+      D,
+      g,
+      n
     );
-    if (b == null || b.length === 0)
+    if (C == null || C.length === 0)
       return r.refreshDrawings(c), d.refreshControls(), !1;
-    O.push(...b);
-    const y = {
-      id: te.id,
+    y.push(...C);
+    const M = {
+      id: ee.id,
       params: {
         unitId: h,
         actions: [],
         textRanges: null
       }
     };
-    y.params.actions = O.reduce((_, L) => X.compose(_, L), null);
-    const E = a.syncExecuteCommand(y.id, y.params);
+    M.params.actions = y.reduce((I, P) => $.compose(I, P), null);
+    const E = a.syncExecuteCommand(M.id, M.params);
     return d.refreshControls(), !!E;
   }
-}, yt = {
+}, Mn = {
   id: "doc.command.transform-non-inline-drawing",
-  type: Y.COMMAND,
+  type: q.COMMAND,
   // eslint-disable-next-line max-lines-per-function
   handler: (i, e) => {
-    var x, j;
+    var A, H;
     if (e == null)
       return !1;
-    const n = i.get(ee), t = (x = n.getRenderById(e.unitId)) == null ? void 0 : x.with(Re), r = n.getRenderById(e.unitId), o = r == null ? void 0 : r.scene;
-    if (o == null || t == null)
+    const t = i.get(Q), n = (A = t.getRenderById(e.unitId)) == null ? void 0 : A.with(xe), r = t.getRenderById(e.unitId), s = r == null ? void 0 : r.scene;
+    if (s == null || n == null)
       return !1;
-    const s = o.getTransformerByCreate(), c = i.get($), a = i.get(q).getCurrentUniverDocInstance();
+    const o = s.getTransformerByCreate(), c = i.get(G), a = i.get(z).getCurrentUniverDocInstance();
     if (a == null)
       return !1;
-    const { drawing: l, unitId: m, offset: g, docTransform: h, segmentId: u, segmentPage: v } = e, w = [], { drawingId: I } = l, O = (j = t.getSegment()) != null ? j : "", C = Dt(
+    const { drawing: l, unitId: g, offset: u, docTransform: h, segmentId: f, segmentPage: p } = e, v = [], { drawingId: w } = l, y = (H = n.getSegment()) != null ? H : "", D = Sn(
+      f,
+      y,
+      p,
       u,
-      O,
-      v,
-      g,
-      I,
+      w,
       a,
-      t
+      n
     );
-    if (C == null)
+    if (D == null)
       return !1;
-    C.length > 0 && w.push(...C);
-    const P = X.getInstance(), { drawings: b = {} } = a.getSnapshot(), y = b[I].docTransform, { positionH: E, positionV: B, size: N, angle: _ } = y;
-    if (!be.diffValue(E, h.positionH)) {
-      const S = P.replaceOp(["drawings", I, "docTransform", "positionH"], E, h.positionH);
-      w.push(S);
+    D.length > 0 && v.push(...D);
+    const O = $.getInstance(), { drawings: C = {} } = a.getSnapshot(), M = C[w].docTransform, { positionH: E, positionV: U, size: N, angle: I } = M;
+    if (!Ce.diffValue(E, h.positionH)) {
+      const _ = O.replaceOp(["drawings", w, "docTransform", "positionH"], E, h.positionH);
+      v.push(_);
     }
-    if (!be.diffValue(B, h.positionV)) {
-      const S = P.replaceOp(["drawings", I, "docTransform", "positionV"], B, h.positionV);
-      w.push(S);
+    if (!Ce.diffValue(U, h.positionV)) {
+      const _ = O.replaceOp(["drawings", w, "docTransform", "positionV"], U, h.positionV);
+      v.push(_);
     }
-    if (!be.diffValue(N, h.size)) {
-      const S = P.replaceOp(["drawings", I, "docTransform", "size"], N, h.size);
-      w.push(S);
+    if (!Ce.diffValue(N, h.size)) {
+      const _ = O.replaceOp(["drawings", w, "docTransform", "size"], N, h.size);
+      v.push(_);
     }
-    if (!be.diffValue(_, h.angle)) {
-      const S = P.replaceOp(["drawings", I, "docTransform", "angle"], _, h.angle);
-      w.push(S);
+    if (!Ce.diffValue(I, h.angle)) {
+      const _ = O.replaceOp(["drawings", w, "docTransform", "angle"], I, h.angle);
+      v.push(_);
     }
-    const L = {
-      id: te.id,
+    const P = {
+      id: ee.id,
       params: {
-        unitId: m,
+        unitId: g,
         actions: [],
         textRanges: null,
         debounce: !0
       }
     };
-    L.params.actions = w.reduce((S, D) => X.compose(S, D), null);
-    const G = c.syncExecuteCommand(L.id, L.params);
-    return s.refreshControls(), !!G;
+    P.params.actions = v.reduce((_, S) => $.compose(_, S), null);
+    const W = c.syncExecuteCommand(P.id, P.params);
+    return o.refreshControls(), !!W;
   }
-}, Qe = {
+}, Ze = {
   id: "doc.command.move-drawing",
-  type: Y.COMMAND,
+  type: q.COMMAND,
   handler: (i, e) => {
-    const n = i.get($), t = i.get(Fe), r = i.get(q), o = i.get(ee), { direction: s } = e, c = t.getFocusDrawings();
+    const t = i.get(G), n = i.get(Be), r = i.get(z), s = i.get(Q), { direction: o } = e, c = n.getFocusDrawings();
     if (c.length === 0)
       return !1;
-    const d = c[0].unitId, a = o.getRenderById(d), l = a == null ? void 0 : a.scene;
+    const d = c[0].unitId, a = s.getRenderById(d), l = a == null ? void 0 : a.scene;
     if (l == null)
       return !1;
-    const m = l.getTransformerByCreate(), g = r.getUniverDocInstance(d), h = c.map((v) => {
-      var y, E, B, N, _;
-      const { drawingId: w } = v, I = (y = g == null ? void 0 : g.getSnapshot().drawings) == null ? void 0 : y[w];
-      if (I == null || I.layoutType === W.INLINE)
+    const g = l.getTransformerByCreate(), u = r.getUniverDocInstance(d), h = c.map((p) => {
+      var M, E, U, N, I;
+      const { drawingId: v } = p, w = (M = u == null ? void 0 : u.getSnapshot().drawings) == null ? void 0 : M[v];
+      if (w == null || w.layoutType === F.INLINE)
         return null;
-      const { positionH: O, positionV: C } = I.docTransform, P = { ...O }, b = { ...C };
-      return s === fe.UP ? b.posOffset = ((E = b.posOffset) != null ? E : 0) - 2 : s === fe.DOWN ? b.posOffset = ((B = b.posOffset) != null ? B : 0) + 2 : s === fe.LEFT ? P.posOffset = ((N = P.posOffset) != null ? N : 0) - 2 : s === fe.RIGHT && (P.posOffset = ((_ = P.posOffset) != null ? _ : 0) + 2), {
-        drawingId: w,
-        key: s === fe.UP || s === fe.DOWN ? "positionV" : "positionH",
-        value: s === fe.UP || s === fe.DOWN ? b : P
+      const { positionH: y, positionV: D } = w.docTransform, O = { ...y }, C = { ...D };
+      return o === he.UP ? C.posOffset = ((E = C.posOffset) != null ? E : 0) - 2 : o === he.DOWN ? C.posOffset = ((U = C.posOffset) != null ? U : 0) + 2 : o === he.LEFT ? O.posOffset = ((N = O.posOffset) != null ? N : 0) - 2 : o === he.RIGHT && (O.posOffset = ((I = O.posOffset) != null ? I : 0) + 2), {
+        drawingId: v,
+        key: o === he.UP || o === he.DOWN ? "positionV" : "positionH",
+        value: o === he.UP || o === he.DOWN ? C : O
       };
-    }).filter((v) => v != null);
+    }).filter((p) => p != null);
     if (h.length === 0)
       return !1;
-    const u = n.syncExecuteCommand(Ze.id, {
+    const f = t.syncExecuteCommand(Ye.id, {
       unitId: d,
       subUnitId: d,
       drawings: h
     });
-    return m.refreshControls(), !!u;
+    return g.refreshControls(), !!f;
   }
-}, er = {
+}, Ji = {
   id: "doc.operation.clear-drawing-transformer",
-  type: Y.MUTATION,
+  type: q.MUTATION,
   handler: (i, e) => {
-    const n = i.get(ee);
-    return e.forEach((t) => {
-      var r, o;
-      (o = (r = n.getRenderById(t)) == null ? void 0 : r.scene.getTransformer()) == null || o.debounceRefreshControls();
+    const t = i.get(Q);
+    return e.forEach((n) => {
+      var r, s;
+      (s = (r = t.getRenderById(n)) == null ? void 0 : r.scene.getTransformer()) == null || s.debounceRefreshControls();
     }), !0;
   }
-}, Mt = "COMPONENT_DOC_DRAWING_PANEL", bt = {
+}, bn = "COMPONENT_DOC_DRAWING_PANEL", Cn = {
   id: "sidebar.operation.doc-image",
-  type: Y.COMMAND,
+  type: q.COMMAND,
   handler: async (i, e) => {
-    const n = i.get(Di), t = i.get(fn), r = i.get(we);
+    const t = i.get(Si), n = i.get(ft), r = i.get(ve);
     switch (e.value) {
       case "open":
-        n.open({
-          header: { title: t.t("docImage.panel.title") },
-          children: { label: Mt },
+        t.open({
+          header: { title: n.t("docImage.panel.title") },
+          children: { label: bn },
           onClose: () => {
             r.focusDrawing(null);
           },
@@ -933,637 +933,904 @@ const Ct = {
         break;
       case "close":
       default:
-        n.close();
+        t.close();
         break;
     }
     return !0;
   }
-}, Rt = {
+}, xn = {
   id: "doc.operation.edit-doc-image",
-  type: Y.OPERATION,
+  type: q.OPERATION,
   handler: (i, e) => {
-    const n = i.get(we), t = i.get($);
-    return e == null ? !1 : (n.focusDrawing([e]), t.executeCommand(bt.id, { value: "open" }), !0);
-  }
-}, nr = "univer-image-common-panel", tr = "univer-image-common-panel-grid", ir = "univer-image-common-panel-border", rr = "univer-image-common-panel-title", or = "univer-image-common-panel-subtitle", sr = "univer-image-common-panel-row", ar = "univer-image-common-panel-column", cr = "univer-image-common-panel-span2", dr = "univer-image-common-panel-input", p = {
-  imageCommonPanel: nr,
-  imageCommonPanelGrid: tr,
-  imageCommonPanelBorder: ir,
-  imageCommonPanelTitle: rr,
-  imageCommonPanelSubtitle: or,
-  imageCommonPanelRow: sr,
-  imageCommonPanelColumn: ar,
-  imageCommonPanelSpan2: cr,
-  imageCommonPanelInput: dr
-}, Yn = -1e3, Zn = 1e3, lr = (i) => {
-  const e = Ie($), n = Ie(fn), t = Ie(we), r = Ie(ee), o = Ie(q), { drawings: s } = i, c = s[0];
+    const t = i.get(ve), n = i.get(G);
+    return e == null ? !1 : (t.focusDrawing([e]), n.executeCommand(Cn.id, { value: "open" }), !0);
+  }
+}, qt = -1e3, Kt = 1e3, er = (i) => {
+  const e = we(G), t = we(ft), n = we(ve), r = we(Q), s = we(z), { drawings: o } = i, c = o[0];
   if (c == null)
     return;
-  const { unitId: d } = c, a = o.getUniverDocInstance(d), l = a == null ? void 0 : a.getSnapshot().documentStyle.documentFlavor, m = r.getRenderById(d), g = m == null ? void 0 : m.scene;
-  if (g == null)
+  const { unitId: d } = c, a = s.getUniverDocInstance(d), l = a == null ? void 0 : a.getSnapshot().documentStyle.documentFlavor, g = r.getRenderById(d), u = g == null ? void 0 : g.scene;
+  if (u == null)
     return;
-  const h = g.getTransformerByCreate(), u = [{
-    label: n.t("image-position.column"),
-    value: String(ne.COLUMN)
+  const h = u.getTransformerByCreate(), f = [{
+    label: t.t("image-position.column"),
+    value: String(J.COLUMN)
   }, {
-    label: n.t("image-position.page"),
-    value: String(ne.PAGE)
+    label: t.t("image-position.page"),
+    value: String(J.PAGE)
   }, {
-    label: n.t("image-position.margin"),
-    value: String(ne.MARGIN)
-  }], v = [{
-    label: n.t("image-position.line"),
-    value: String(H.LINE),
-    disabled: l === In.MODERN
+    label: t.t("image-position.margin"),
+    value: String(J.MARGIN)
+  }], p = [{
+    label: t.t("image-position.line"),
+    value: String(j.LINE),
+    disabled: l === pt.MODERN
   }, {
-    label: n.t("image-position.page"),
-    value: String(H.PAGE),
-    disabled: l === In.MODERN
+    label: t.t("image-position.page"),
+    value: String(j.PAGE),
+    disabled: l === pt.MODERN
   }, {
-    label: n.t("image-position.margin"),
-    value: String(H.MARGIN),
-    disabled: l === In.MODERN
+    label: t.t("image-position.margin"),
+    value: String(j.MARGIN),
+    disabled: l === pt.MODERN
   }, {
-    label: n.t("image-position.paragraph"),
-    value: String(H.PARAGRAPH)
-  }], [w, I] = se(!0), [O, C] = se({
-    relativeFrom: ne.PAGE,
+    label: t.t("image-position.paragraph"),
+    value: String(j.PARAGRAPH)
+  }], [v, w] = re(!0), [y, D] = re({
+    relativeFrom: J.PAGE,
     posOffset: 0
-  }), [P, b] = se({
-    relativeFrom: H.PAGE,
+  }), [O, C] = re({
+    relativeFrom: j.PAGE,
     posOffset: 0
-  }), [y, E] = se(!0), [B, N] = se(!0);
-  function _(D, R) {
-    var M;
-    D === "positionH" ? C(R) : b(R);
-    const T = t.getFocusDrawings();
+  }), [M, E] = re(!0), [U, N] = re(!0);
+  function I(S, x) {
+    var b;
+    S === "positionH" ? D(x) : C(x);
+    const T = n.getFocusDrawings();
     if (T.length === 0)
       return;
-    const U = T.map((A) => ({
-      unitId: A.unitId,
-      subUnitId: A.subUnitId,
-      drawingId: A.drawingId
+    const L = T.map((R) => ({
+      unitId: R.unitId,
+      subUnitId: R.subUnitId,
+      drawingId: R.drawingId
     }));
-    e.executeCommand(Ze.id, {
+    e.executeCommand(Ye.id, {
       unitId: T[0].unitId,
       subUnitId: T[0].unitId,
-      drawings: U.map((A) => ({
-        drawingId: A.drawingId,
-        key: D,
-        value: R
+      drawings: L.map((R) => ({
+        drawingId: R.drawingId,
+        key: S,
+        value: x
       }))
     });
-    const F = (M = r.getRenderById(d)) == null ? void 0 : M.with(Re);
-    F && F.blur(), h.refreshControls();
+    const B = (b = r.getRenderById(d)) == null ? void 0 : b.with(xe);
+    B && B.blur(), h.refreshControls();
   }
-  function L(D) {
-    var oe, De, Ce;
-    const R = O.relativeFrom, T = O.posOffset, U = Number(D);
-    if (R === U)
+  function P(S) {
+    var ie, Se, De;
+    const x = y.relativeFrom, T = y.posOffset, L = Number(S);
+    if (x === L)
       return;
-    const F = t.getFocusDrawings();
-    if (F.length === 0)
+    const B = n.getFocusDrawings();
+    if (B.length === 0)
       return;
-    const M = F[0].drawingId, A = F[0].unitId;
-    let z = null, k = 0;
-    const Z = (oe = r.getRenderById(A)) == null ? void 0 : oe.with(ie).getSkeleton(), ce = Z == null ? void 0 : Z.getSkeletonData();
-    if (ce == null)
+    const b = B[0].drawingId, R = B[0].unitId;
+    let V = null, k = 0;
+    const K = (ie = r.getRenderById(R)) == null ? void 0 : ie.with(te).getSkeleton(), oe = K == null ? void 0 : K.getSkeletonData();
+    if (oe == null)
       return;
-    const { pages: ke, skeHeaders: Ne, skeFooters: Ve } = ce;
-    for (const le of ke) {
-      const { marginLeft: Pe, skeDrawings: Te, headerId: Ee, footerId: Ae, pageWidth: ye } = le;
-      if (Te.has(M)) {
-        z = Te.get(M), k = Pe;
+    const { pages: ke, skeHeaders: Ne, skeFooters: Ge } = oe;
+    for (const ce of ke) {
+      const { marginLeft: Oe, skeDrawings: Te, headerId: Ee, footerId: Re, pageWidth: Me } = ce;
+      if (Te.has(b)) {
+        V = Te.get(b), k = Oe;
         break;
       }
-      const ge = (De = Ne.get(Ee)) == null ? void 0 : De.get(ye);
-      if (ge != null && ge.skeDrawings.has(M)) {
-        z = ge == null ? void 0 : ge.skeDrawings.get(M), k = Pe;
+      const de = (Se = Ne.get(Ee)) == null ? void 0 : Se.get(Me);
+      if (de != null && de.skeDrawings.has(b)) {
+        V = de == null ? void 0 : de.skeDrawings.get(b), k = Oe;
         break;
       }
-      const me = (Ce = Ve.get(Ae)) == null ? void 0 : Ce.get(ye);
-      if (me != null && me.skeDrawings.has(M)) {
-        z = me == null ? void 0 : me.skeDrawings.get(M), k = Pe;
+      const le = (De = Ge.get(Re)) == null ? void 0 : De.get(Me);
+      if (le != null && le.skeDrawings.has(b)) {
+        V = le == null ? void 0 : le.skeDrawings.get(b), k = Oe;
         break;
       }
     }
-    if (z == null)
+    if (V == null)
       return;
-    let de = 0;
-    R === ne.COLUMN ? de -= z.columnLeft : R === ne.MARGIN && (de -= k), U === ne.COLUMN ? de += z.columnLeft : U === ne.MARGIN ? de += k : ne.PAGE;
-    const re = {
-      relativeFrom: U,
-      posOffset: (T != null ? T : 0) - de
+    let ae = 0;
+    x === J.COLUMN ? ae -= V.columnLeft : x === J.MARGIN && (ae -= k), L === J.COLUMN ? ae += V.columnLeft : L === J.MARGIN ? ae += k : J.PAGE;
+    const ne = {
+      relativeFrom: L,
+      posOffset: (T != null ? T : 0) - ae
     };
-    _("positionH", re);
+    I("positionH", ne);
   }
-  function G(D) {
-    var Te, Ee, Ae, ye, ge, me;
-    const R = P.relativeFrom, T = P.posOffset, U = Number(D);
-    if (R === U)
+  function W(S) {
+    var Te, Ee, Re, Me, de, le;
+    const x = O.relativeFrom, T = O.posOffset, L = Number(S);
+    if (x === L)
       return;
-    const F = t.getFocusDrawings();
-    if (F.length === 0)
+    const B = n.getFocusDrawings();
+    if (B.length === 0)
       return;
-    const { drawingId: M, unitId: A } = F[0], z = o.getUniverDocInstance(A), k = (Te = r.getRenderById(A)) == null ? void 0 : Te.with(ie).getSkeleton(), Z = (Ee = r.getRenderById(A)) == null ? void 0 : Ee.with(Re), ce = Z == null ? void 0 : Z.getSegment(), ke = Z == null ? void 0 : Z.getSegmentPage(), Ne = (ye = (Ae = z == null ? void 0 : z.getSelfOrHeaderFooterModel(ce).getBody()) == null ? void 0 : Ae.customBlocks) == null ? void 0 : ye.find((xe) => xe.blockId === M);
-    if (Ne == null || k == null || Z == null)
+    const { drawingId: b, unitId: R } = B[0], V = s.getUniverDocInstance(R), k = (Te = r.getRenderById(R)) == null ? void 0 : Te.with(te).getSkeleton(), K = (Ee = r.getRenderById(R)) == null ? void 0 : Ee.with(xe), oe = K == null ? void 0 : K.getSegment(), ke = K == null ? void 0 : K.getSegmentPage(), Ne = (Me = (Re = V == null ? void 0 : V.getSelfOrHeaderFooterModel(oe).getBody()) == null ? void 0 : Re.customBlocks) == null ? void 0 : Me.find((Ae) => Ae.blockId === b);
+    if (Ne == null || k == null || K == null)
       return;
-    const { startIndex: Ve } = Ne, de = k.findNodeByCharIndex(Ve, ce, ke), re = (ge = de == null ? void 0 : de.parent) == null ? void 0 : ge.parent, oe = re == null ? void 0 : re.parent, De = oe == null ? void 0 : oe.lines.find((xe) => xe.paragraphIndex === (re == null ? void 0 : re.paragraphIndex) && xe.paragraphStart), Ce = (me = oe == null ? void 0 : oe.parent) == null ? void 0 : me.parent;
-    if (de == null || re == null || De == null || oe == null || Ce == null)
+    const { startIndex: Ge } = Ne, ae = k.findNodeByCharIndex(Ge, oe, ke), ne = (de = ae == null ? void 0 : ae.parent) == null ? void 0 : de.parent, ie = ne == null ? void 0 : ne.parent, Se = ie == null ? void 0 : ie.lines.find((Ae) => Ae.paragraphIndex === (ne == null ? void 0 : ne.paragraphIndex) && Ae.paragraphStart), De = (le = ie == null ? void 0 : ie.parent) == null ? void 0 : le.parent;
+    if (ae == null || ne == null || Se == null || ie == null || De == null)
       return;
-    let le = 0;
-    R === H.PARAGRAPH ? le -= De.top : R === H.LINE ? le -= re.top : R === H.PAGE && (le += Ce.marginTop), U === H.PARAGRAPH ? le += De.top : U === H.LINE ? le += re.top : U === H.PAGE && (le -= Ce.marginTop);
-    const Pe = {
-      relativeFrom: U,
-      posOffset: (T != null ? T : 0) - le
+    let ce = 0;
+    x === j.PARAGRAPH ? ce -= Se.top : x === j.LINE ? ce -= ne.top : x === j.PAGE && (ce += De.marginTop), L === j.PARAGRAPH ? ce += Se.top : L === j.LINE ? ce += ne.top : L === j.PAGE && (ce -= De.marginTop);
+    const Oe = {
+      relativeFrom: L,
+      posOffset: (T != null ? T : 0) - ce
     };
-    _("positionV", Pe);
+    I("positionV", Oe);
   }
-  function x(D) {
-    var A;
-    const R = a == null ? void 0 : a.getSnapshot(), T = (A = R == null ? void 0 : R.drawings) == null ? void 0 : A[D.drawingId];
+  function A(S) {
+    var R;
+    const x = a == null ? void 0 : a.getSnapshot(), T = (R = x == null ? void 0 : x.drawings) == null ? void 0 : R[S.drawingId];
     if (T == null)
       return;
-    const { layoutType: U } = T, {
-      positionH: F,
-      positionV: M
+    const { layoutType: L } = T, {
+      positionH: B,
+      positionV: b
     } = T.docTransform;
-    C(F), b(M), I(U === W.INLINE), E(M.relativeFrom === H.PARAGRAPH || M.relativeFrom === H.LINE);
+    D(B), C(b), w(L === F.INLINE), E(b.relativeFrom === j.PARAGRAPH || b.relativeFrom === j.LINE);
   }
-  function j() {
-    const D = t.getFocusDrawings();
-    D.length !== 0 && x(D[0]);
+  function H() {
+    const S = n.getFocusDrawings();
+    S.length !== 0 && A(S[0]);
   }
-  function S(D) {
-    E(D), G(String(D ? H.PARAGRAPH : H.PAGE));
+  function _(S) {
+    E(S), W(String(S ? j.PARAGRAPH : j.PAGE));
   }
-  return Mn(() => {
-    j();
-    const D = t.focus$.subscribe((T) => {
+  return Mt(() => {
+    H();
+    const S = n.focus$.subscribe((T) => {
       if (T.length === 0) {
         N(!1);
         return;
       }
-      N(!0), x(T[0]);
-    }), R = e.onCommandExecuted(async (T) => {
-      T.id === te.id && j();
+      N(!0), A(T[0]);
+    }), x = e.onCommandExecuted(async (T) => {
+      T.id === ee.id && H();
     });
     return () => {
-      D.unsubscribe(), R.dispose();
+      S.unsubscribe(), x.dispose();
     };
-  }, []), /* @__PURE__ */ K("div", { className: V(p.imageCommonPanelGrid, p.imageCommonPanelBorder), style: { display: B ? "block" : "none" }, children: [
-    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelTitle), children: /* @__PURE__ */ f("div", { children: n.t("image-position.title") }) }) }),
-    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSubtitle), children: /* @__PURE__ */ f("div", { children: n.t("image-position.horizontal") }) }) }),
-    /* @__PURE__ */ K("div", { className: p.imageCommonPanelRow, children: [
-      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-position.absolutePosition") }) }),
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
-          He,
+  }, []), /* @__PURE__ */ X(
+    "div",
+    {
+      className: `
+              univer-relative univer-mt-5 univer-w-full univer-border-t univer-border-solid univer-border-gray-200
+            `,
+      style: { display: U ? "block" : "none" },
+      children: [
+        /* @__PURE__ */ m(
+          "div",
           {
-            min: Yn,
-            max: Zn,
-            precision: 1,
-            disabled: w,
-            value: O.posOffset,
-            onChange: (D) => {
-              _("positionH", {
-                relativeFrom: O.relativeFrom,
-                posOffset: D
-              });
-            },
-            className: p.imageCommonPanelInput
+            className: `
+                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
+                `,
+            children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1 univer-text-gray-400", children: /* @__PURE__ */ m("div", { children: t.t("image-position.title") }) })
           }
-        ) }) })
-      ] }) }),
-      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-position.toTheRightOf") }) }),
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
-          Vn,
+        ),
+        /* @__PURE__ */ m(
+          "div",
           {
-            value: String(O.relativeFrom),
-            disabled: w,
-            options: u,
-            onChange: L
+            className: `
+                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
+                `,
+            children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1 univer-text-black", children: /* @__PURE__ */ m("div", { children: t.t("image-position.horizontal") }) })
           }
-        ) }) })
-      ] }) })
-    ] }),
-    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSubtitle), children: /* @__PURE__ */ f("div", { children: n.t("image-position.vertical") }) }) }),
-    /* @__PURE__ */ K("div", { className: p.imageCommonPanelRow, children: [
-      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-position.absolutePosition") }) }),
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
-          He,
+        ),
+        /* @__PURE__ */ X(
+          "div",
           {
-            min: Yn,
-            max: Zn,
-            precision: 1,
-            disabled: w,
-            value: P.posOffset,
-            onChange: (D) => {
-              _("positionV", {
-                relativeFrom: P.relativeFrom,
-                posOffset: D
-              });
-            },
-            className: p.imageCommonPanelInput
+            className: `
+                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
+                `,
+            children: [
+              /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1 univer-text-gray-400", children: /* @__PURE__ */ X("label", { children: [
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: t.t("image-position.absolutePosition") })
+                  }
+                ),
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
+                      je,
+                      {
+                        min: qt,
+                        max: Kt,
+                        precision: 1,
+                        disabled: v,
+                        value: y.posOffset,
+                        onChange: (S) => {
+                          I("positionH", {
+                            relativeFrom: y.relativeFrom,
+                            posOffset: S
+                          });
+                        }
+                      }
+                    ) })
+                  }
+                )
+              ] }) }),
+              /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ X("label", { children: [
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: t.t("image-position.toTheRightOf") })
+                  }
+                ),
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
+                      Ht,
+                      {
+                        value: String(y.relativeFrom),
+                        disabled: v,
+                        options: f,
+                        onChange: P
+                      }
+                    ) })
+                  }
+                )
+              ] }) })
+            ]
           }
-        ) }) })
-      ] }) }),
-      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-position.bellow") }) }),
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
-          Vn,
+        ),
+        /* @__PURE__ */ m(
+          "div",
           {
-            disabled: w,
-            value: String(P.relativeFrom),
-            options: v,
-            onChange: G
+            className: `
+                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
+                `,
+            children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1 univer-text-black", children: /* @__PURE__ */ m("div", { children: t.t("image-position.vertical") }) })
           }
-        ) }) })
-      ] }) })
-    ] }),
-    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSubtitle), children: /* @__PURE__ */ f("div", { children: n.t("image-position.options") }) }) }),
-    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, style: { marginBottom: "50px" }, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(Bi, { disabled: w, checked: y, onChange: S, children: n.t("image-position.moveObjectWithText") }) }) })
-  ] });
-}, nn = 0, tn = 100, gr = (i) => {
-  const e = Ie($), n = Ie(fn), t = Ie(we), r = Ie(ee), o = Ie(q), { drawings: s } = i, c = s[0];
+        ),
+        /* @__PURE__ */ X(
+          "div",
+          {
+            className: `
+                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
+                `,
+            children: [
+              /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ X("label", { children: [
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: t.t("image-position.absolutePosition") })
+                  }
+                ),
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
+                      je,
+                      {
+                        min: qt,
+                        max: Kt,
+                        precision: 1,
+                        disabled: v,
+                        value: O.posOffset,
+                        onChange: (S) => {
+                          I("positionV", {
+                            relativeFrom: O.relativeFrom,
+                            posOffset: S
+                          });
+                        }
+                      }
+                    ) })
+                  }
+                )
+              ] }) }),
+              /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ X("label", { children: [
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: t.t("image-position.bellow") })
+                  }
+                ),
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
+                      Ht,
+                      {
+                        disabled: v,
+                        value: String(O.relativeFrom),
+                        options: p,
+                        onChange: W
+                      }
+                    ) })
+                  }
+                )
+              ] }) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ m(
+          "div",
+          {
+            className: `
+                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
+                `,
+            children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1 univer-text-black", children: /* @__PURE__ */ m("div", { children: t.t("image-position.options") }) })
+          }
+        ),
+        /* @__PURE__ */ m(
+          "div",
+          {
+            className: `
+                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
+                `,
+            style: { marginBottom: "50px" },
+            children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(Ui, { disabled: v, checked: M, onChange: _, children: t.t("image-position.moveObjectWithText") }) })
+          }
+        )
+      ]
+    }
+  );
+}, et = 0, tt = 100, tr = (i) => {
+  const e = we(G), t = we(ft), n = we(ve), r = we(Q), s = we(z), { drawings: o } = i, c = o[0];
   if (c == null)
     return null;
-  const { unitId: d } = c, a = o.getUniverDocInstance(d), l = r.getRenderById(d);
+  const { unitId: d } = c, a = s.getUniverDocInstance(d), l = r.getRenderById(d);
   if ((l == null ? void 0 : l.scene) == null)
     return null;
-  const [g, h] = se(!0), [u, v] = se(!0), [w, I] = se(!0), [O, C] = se(he.INLINE), [P, b] = se(""), [y, E] = se({
+  const [u, h] = re(!0), [f, p] = re(!0), [v, w] = re(!0), [y, D] = re(fe.INLINE), [O, C] = re(""), [M, E] = re({
     distT: 0,
     distL: 0,
     distB: 0,
     distR: 0
-  }), [B, N] = se(!0);
-  function _(S) {
-    C(S);
-    const D = t.getFocusDrawings();
-    if (D.length === 0)
+  }), [U, N] = re(!0);
+  function I(_) {
+    D(_);
+    const S = n.getFocusDrawings();
+    if (S.length === 0)
       return;
-    const { unitId: R, subUnitId: T } = D[0], U = D.map(({ unitId: F, subUnitId: M, drawingId: A }) => ({
-      unitId: F,
-      subUnitId: M,
-      drawingId: A
+    const { unitId: x, subUnitId: T } = S[0], L = S.map(({ unitId: B, subUnitId: b, drawingId: R }) => ({
+      unitId: B,
+      subUnitId: b,
+      drawingId: R
     }));
-    e.executeCommand(Ct.id, {
-      unitId: R,
+    e.executeCommand(Dn.id, {
+      unitId: x,
       subUnitId: T,
-      drawings: U,
-      wrappingStyle: S
+      drawings: L,
+      wrappingStyle: _
     });
   }
-  function L(S) {
-    b(S);
-    const D = t.getFocusDrawings();
-    if (D.length === 0)
+  function P(_) {
+    C(_);
+    const S = n.getFocusDrawings();
+    if (S.length === 0)
       return;
-    const R = D.map((T) => ({
+    const x = S.map((T) => ({
       unitId: T.unitId,
       subUnitId: T.subUnitId,
       drawingId: T.drawingId
     }));
-    e.executeCommand(Pt.id, {
-      unitId: D[0].unitId,
-      subUnitId: D[0].unitId,
-      drawings: R,
-      wrapText: S
+    e.executeCommand(On.id, {
+      unitId: S[0].unitId,
+      subUnitId: S[0].unitId,
+      drawings: x,
+      wrapText: _
     });
   }
-  function G(S, D) {
-    if (S == null)
+  function W(_, S) {
+    if (_ == null)
       return;
-    const R = { ...y, [D]: S };
-    E(R);
-    const T = t.getFocusDrawings();
+    const x = { ...M, [S]: _ };
+    E(x);
+    const T = n.getFocusDrawings();
     if (T.length === 0)
       return;
-    const U = T.map((F) => ({
-      unitId: F.unitId,
-      subUnitId: F.subUnitId,
-      drawingId: F.drawingId
+    const L = T.map((B) => ({
+      unitId: B.unitId,
+      subUnitId: B.subUnitId,
+      drawingId: B.drawingId
     }));
-    e.executeCommand(Ot.id, {
+    e.executeCommand(yn.id, {
       unitId: T[0].unitId,
       subUnitId: T[0].unitId,
-      drawings: U,
+      drawings: L,
       dist: {
-        [D]: S
+        [S]: _
       }
     });
   }
-  function x() {
-    const S = t.getFocusDrawings();
-    S.length !== 0 && j(S[0]);
+  function A() {
+    const _ = n.getFocusDrawings();
+    _.length !== 0 && H(_[0]);
   }
-  function j(S) {
-    var Z, ce;
-    const D = (ce = (Z = a == null ? void 0 : a.getSnapshot()) == null ? void 0 : Z.drawings) == null ? void 0 : ce[S.drawingId];
-    if (D == null)
+  function H(_) {
+    var K, oe;
+    const S = (oe = (K = a == null ? void 0 : a.getSnapshot()) == null ? void 0 : K.drawings) == null ? void 0 : oe[_.drawingId];
+    if (S == null)
       return;
     const {
-      distT: R = 0,
+      distT: x = 0,
       distL: T = 0,
-      distB: U = 0,
-      distR: F = 0,
-      layoutType: M = W.INLINE,
-      behindDoc: A = ae.FALSE,
-      wrapText: z = Ke.BOTH_SIDES
-    } = D;
+      distB: L = 0,
+      distR: B = 0,
+      layoutType: b = F.INLINE,
+      behindDoc: R = se.FALSE,
+      wrapText: V = qe.BOTH_SIDES
+    } = S;
     if (E({
-      distT: R,
+      distT: x,
       distL: T,
-      distB: U,
-      distR: F
-    }), b(z), h(M !== W.WRAP_SQUARE), M === W.WRAP_NONE || M === W.INLINE ? v(!0) : v(!1), M === W.WRAP_NONE || M === W.INLINE || M === W.WRAP_TOP_AND_BOTTOM ? I(!0) : I(!1), M === W.WRAP_NONE)
-      A === ae.TRUE ? C(he.BEHIND_TEXT) : C(he.IN_FRONT_OF_TEXT);
+      distB: L,
+      distR: B
+    }), C(V), h(b !== F.WRAP_SQUARE), b === F.WRAP_NONE || b === F.INLINE ? p(!0) : p(!1), b === F.WRAP_NONE || b === F.INLINE || b === F.WRAP_TOP_AND_BOTTOM ? w(!0) : w(!1), b === F.WRAP_NONE)
+      R === se.TRUE ? D(fe.BEHIND_TEXT) : D(fe.IN_FRONT_OF_TEXT);
     else
-      switch (M) {
-        case W.INLINE:
-          C(he.INLINE);
+      switch (b) {
+        case F.INLINE:
+          D(fe.INLINE);
           break;
-        case W.WRAP_SQUARE:
-          C(he.WRAP_SQUARE);
+        case F.WRAP_SQUARE:
+          D(fe.WRAP_SQUARE);
           break;
-        case W.WRAP_TOP_AND_BOTTOM:
-          C(he.WRAP_TOP_AND_BOTTOM);
+        case F.WRAP_TOP_AND_BOTTOM:
+          D(fe.WRAP_TOP_AND_BOTTOM);
           break;
         default:
-          throw new Error(`Unsupported layout type: ${M}`);
+          throw new Error(`Unsupported layout type: ${b}`);
       }
   }
-  return Mn(() => {
-    x();
-    const S = t.focus$.subscribe((R) => {
-      if (R.length === 0) {
+  return Mt(() => {
+    A();
+    const _ = n.focus$.subscribe((x) => {
+      if (x.length === 0) {
         N(!1);
         return;
       }
-      N(!0), j(R[0]);
-    }), D = e.onCommandExecuted(async (R) => {
-      R.id === te.id && x();
+      N(!0), H(x[0]);
+    }), S = e.onCommandExecuted(async (x) => {
+      x.id === ee.id && A();
     });
     return () => {
-      S.unsubscribe(), D.dispose();
+      _.unsubscribe(), S.dispose();
     };
-  }, []), /* @__PURE__ */ K("div", { className: V(p.imageCommonPanelGrid, p.imageCommonPanelBorder), style: { display: B ? "block" : "none" }, children: [
-    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelTitle), children: /* @__PURE__ */ f("div", { children: n.t("image-text-wrap.title") }) }) }),
-    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSubtitle), children: /* @__PURE__ */ f("div", { children: n.t("image-text-wrap.wrappingStyle") }) }) }),
-    /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelRow), children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn), children: /* @__PURE__ */ K($n, { value: O, onChange: _, direction: "vertical", children: [
-      /* @__PURE__ */ f(Me, { value: he.INLINE, children: n.t("image-text-wrap.inline") }),
-      /* @__PURE__ */ f(Me, { value: he.WRAP_SQUARE, children: n.t("image-text-wrap.square") }),
-      /* @__PURE__ */ f(Me, { value: he.WRAP_TOP_AND_BOTTOM, children: n.t("image-text-wrap.topAndBottom") }),
-      /* @__PURE__ */ f(Me, { value: he.BEHIND_TEXT, children: n.t("image-text-wrap.behindText") }),
-      /* @__PURE__ */ f(Me, { value: he.IN_FRONT_OF_TEXT, children: n.t("image-text-wrap.inFrontText") })
-    ] }) }) }),
-    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSubtitle), children: /* @__PURE__ */ f("div", { children: n.t("image-text-wrap.wrapText") }) }) }),
-    /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelRow), children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn), children: /* @__PURE__ */ K($n, { disabled: g, value: P, onChange: L, direction: "horizontal", children: [
-      /* @__PURE__ */ f(Me, { value: Ke.BOTH_SIDES, children: n.t("image-text-wrap.bothSide") }),
-      /* @__PURE__ */ f(Me, { value: Ke.LEFT, children: n.t("image-text-wrap.leftOnly") }),
-      /* @__PURE__ */ f(Me, { value: Ke.RIGHT, children: n.t("image-text-wrap.rightOnly") })
-    ] }) }) }),
-    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSubtitle), children: /* @__PURE__ */ f("div", { children: n.t("image-text-wrap.distanceFromText") }) }) }),
-    /* @__PURE__ */ K("div", { className: p.imageCommonPanelRow, children: [
-      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-text-wrap.top") }) }),
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
-          He,
+  }, []), /* @__PURE__ */ X(
+    "div",
+    {
+      className: `
+              univer-relative univer-mt-5 univer-w-full univer-border-t univer-border-solid univer-border-gray-200
+            `,
+      style: { display: U ? "block" : "none" },
+      children: [
+        /* @__PURE__ */ m(
+          "div",
           {
-            min: nn,
-            max: tn,
-            disabled: u,
-            precision: 1,
-            value: y.distT,
-            onChange: (S) => {
-              G(S, "distT");
-            },
-            className: p.imageCommonPanelInput
+            className: `
+                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
+                `,
+            children: /* @__PURE__ */ m("div", { className: ue("univer-flex univer-items-center univer-gap-1 univer-text-gray-600"), children: /* @__PURE__ */ m("div", { children: t.t("image-text-wrap.title") }) })
           }
-        ) }) })
-      ] }) }),
-      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-text-wrap.left") }) }),
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
-          He,
+        ),
+        /* @__PURE__ */ m(
+          "div",
           {
-            min: nn,
-            max: tn,
-            disabled: w,
-            precision: 1,
-            value: y.distL,
-            onChange: (S) => {
-              G(S, "distL");
-            },
-            className: p.imageCommonPanelInput
+            className: `
+                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
+                `,
+            children: /* @__PURE__ */ m("div", { className: ue("univer-flex univer-items-center univer-gap-1 univer-text-black"), children: /* @__PURE__ */ m("div", { children: t.t("image-text-wrap.wrappingStyle") }) })
           }
-        ) }) })
-      ] }) })
-    ] }),
-    /* @__PURE__ */ K("div", { className: p.imageCommonPanelRow, children: [
-      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-text-wrap.bottom") }) }),
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
-          He,
+        ),
+        /* @__PURE__ */ m(
+          "div",
           {
-            min: nn,
-            max: tn,
-            disabled: u,
-            precision: 1,
-            value: y.distB,
-            onChange: (S) => {
-              G(S, "distB");
-            },
-            className: p.imageCommonPanelInput
+            className: ue(`
+                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
+                `),
+            children: /* @__PURE__ */ m("div", { className: ue("univer-flex univer-items-center univer-gap-1"), children: /* @__PURE__ */ X(Gt, { value: y, onChange: I, direction: "vertical", children: [
+              /* @__PURE__ */ m(be, { value: fe.INLINE, children: t.t("image-text-wrap.inline") }),
+              /* @__PURE__ */ m(be, { value: fe.WRAP_SQUARE, children: t.t("image-text-wrap.square") }),
+              /* @__PURE__ */ m(be, { value: fe.WRAP_TOP_AND_BOTTOM, children: t.t("image-text-wrap.topAndBottom") }),
+              /* @__PURE__ */ m(be, { value: fe.BEHIND_TEXT, children: t.t("image-text-wrap.behindText") }),
+              /* @__PURE__ */ m(be, { value: fe.IN_FRONT_OF_TEXT, children: t.t("image-text-wrap.inFrontText") })
+            ] }) })
           }
-        ) }) })
-      ] }) }),
-      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-text-wrap.right") }) }),
-        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
-          He,
+        ),
+        /* @__PURE__ */ m(
+          "div",
           {
-            min: nn,
-            max: tn,
-            disabled: w,
-            precision: 1,
-            value: y.distR,
-            onChange: (S) => {
-              G(S, "distR");
-            },
-            className: p.imageCommonPanelInput
+            className: `
+                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
+                `,
+            children: /* @__PURE__ */ m("div", { className: ue("univer-flex univer-items-center univer-gap-1 univer-text-black"), children: /* @__PURE__ */ m("div", { children: t.t("image-text-wrap.wrapText") }) })
           }
-        ) }) })
-      ] }) })
-    ] })
-  ] });
-}, mr = () => {
-  const i = Ie(we), e = i.getFocusDrawings(), [n, t] = se(e);
-  return Mn(() => {
-    const r = i.focus$.subscribe((o) => {
-      t(o);
+        ),
+        /* @__PURE__ */ m(
+          "div",
+          {
+            className: ue(`
+                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
+                `),
+            children: /* @__PURE__ */ m("div", { className: ue("univer-flex univer-items-center univer-gap-1"), children: /* @__PURE__ */ X(Gt, { disabled: u, value: O, onChange: P, direction: "horizontal", children: [
+              /* @__PURE__ */ m(be, { value: qe.BOTH_SIDES, children: t.t("image-text-wrap.bothSide") }),
+              /* @__PURE__ */ m(be, { value: qe.LEFT, children: t.t("image-text-wrap.leftOnly") }),
+              /* @__PURE__ */ m(be, { value: qe.RIGHT, children: t.t("image-text-wrap.rightOnly") })
+            ] }) })
+          }
+        ),
+        /* @__PURE__ */ m(
+          "div",
+          {
+            className: `
+                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
+                `,
+            children: /* @__PURE__ */ m("div", { className: ue("univer-flex univer-items-center univer-gap-1 univer-text-black"), children: /* @__PURE__ */ m("div", { children: t.t("image-text-wrap.distanceFromText") }) })
+          }
+        ),
+        /* @__PURE__ */ X(
+          "div",
+          {
+            className: `
+                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
+                `,
+            children: [
+              /* @__PURE__ */ m("div", { className: ue("univer-flex univer-items-center univer-gap-1"), children: /* @__PURE__ */ X("label", { children: [
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: t.t("image-text-wrap.top") })
+                  }
+                ),
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
+                      je,
+                      {
+                        min: et,
+                        max: tt,
+                        disabled: f,
+                        precision: 1,
+                        value: M.distT,
+                        onChange: (_) => {
+                          W(_, "distT");
+                        }
+                      }
+                    ) })
+                  }
+                )
+              ] }) }),
+              /* @__PURE__ */ m("div", { className: ue("univer-flex univer-items-center univer-gap-1"), children: /* @__PURE__ */ X("label", { children: [
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: t.t("image-text-wrap.left") })
+                  }
+                ),
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
+                      je,
+                      {
+                        min: et,
+                        max: tt,
+                        disabled: v,
+                        precision: 1,
+                        value: M.distL,
+                        onChange: (_) => {
+                          W(_, "distL");
+                        }
+                      }
+                    ) })
+                  }
+                )
+              ] }) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ X(
+          "div",
+          {
+            className: `
+                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
+                `,
+            children: [
+              /* @__PURE__ */ m("div", { className: ue("univer-flex univer-items-center univer-gap-1"), children: /* @__PURE__ */ X("label", { children: [
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: t.t("image-text-wrap.bottom") })
+                  }
+                ),
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
+                      je,
+                      {
+                        min: et,
+                        max: tt,
+                        disabled: f,
+                        precision: 1,
+                        value: M.distB,
+                        onChange: (_) => {
+                          W(_, "distB");
+                        }
+                      }
+                    ) })
+                  }
+                )
+              ] }) }),
+              /* @__PURE__ */ m("div", { className: ue("univer-flex univer-items-center univer-gap-1"), children: /* @__PURE__ */ X("label", { children: [
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: t.t("image-text-wrap.right") })
+                  }
+                ),
+                /* @__PURE__ */ m(
+                  "div",
+                  {
+                    className: `
+                              univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start
+                              univer-justify-start
+                            `,
+                    children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
+                      je,
+                      {
+                        min: et,
+                        max: tt,
+                        disabled: v,
+                        precision: 1,
+                        value: M.distR,
+                        onChange: (_) => {
+                          W(_, "distR");
+                        }
+                      }
+                    ) })
+                  }
+                )
+              ] }) })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}, nr = () => {
+  const i = we(ve), e = i.getFocusDrawings(), [t, n] = re(e);
+  return Mt(() => {
+    const r = i.focus$.subscribe((s) => {
+      n(s);
     });
     return () => {
       r.unsubscribe();
     };
-  }, []), !!(n != null && n.length) && /* @__PURE__ */ K("div", { className: p.imageCommonPanel, children: [
-    /* @__PURE__ */ f(di, { drawings: n, hasAlign: !1, hasCropper: !1, hasGroup: !1, hasTransform: !1 }),
-    /* @__PURE__ */ f(gr, { drawings: n }),
-    /* @__PURE__ */ f(lr, { drawings: n })
+  }, []), !!(t != null && t.length) && /* @__PURE__ */ X("div", { className: "univer-p-2 univer-text-center univer-text-sm", children: [
+    /* @__PURE__ */ m(ci, { drawings: t, hasAlign: !1, hasCropper: !1, hasGroup: !1, hasTransform: !1 }),
+    /* @__PURE__ */ m(tr, { drawings: t }),
+    /* @__PURE__ */ m(er, { drawings: t })
   ] });
-}, Nt = "addition-and-subtraction-single", Et = "doc.menu.image", At = St.id, ur = (i) => {
-  const e = i.get(Tn), n = i.get(q);
-  return new Wi((t) => {
+}, Nn = "addition-and-subtraction-single", En = "doc.menu.image", Rn = _n.id, ir = (i) => {
+  const e = i.get(Ot), t = i.get(z);
+  return new Fi((n) => {
     const r = e.textSelection$.subscribe(() => {
-      var s;
-      const o = e.getActiveTextRange();
-      if (o) {
-        const { segmentId: c, startOffset: d, endOffset: a } = o, l = n.getCurrentUniverDocInstance(), m = (s = l == null ? void 0 : l.getSelfOrHeaderFooterModel(c).getBody()) == null ? void 0 : s.tables;
-        if (m && m.length && m.some((g) => {
-          const { startIndex: h, endIndex: u } = g;
-          return d >= h && d < u || a >= h && a < u;
+      var o;
+      const s = e.getActiveTextRange();
+      if (s) {
+        const { segmentId: c, startOffset: d, endOffset: a } = s, l = t.getCurrentUniverDocInstance(), g = (o = l == null ? void 0 : l.getSelfOrHeaderFooterModel(c).getBody()) == null ? void 0 : o.tables;
+        if (g && g.length && g.some((u) => {
+          const { startIndex: h, endIndex: f } = u;
+          return d >= h && d < f || a >= h && a < f;
         })) {
-          t.next(!0);
+          n.next(!0);
           return;
         }
       } else {
-        t.next(!0);
+        n.next(!0);
         return;
       }
-      t.next(!1);
+      n.next(!1);
     });
     return () => r.unsubscribe();
   });
 };
-function hr(i) {
+function rr(i) {
   return {
-    id: Et,
-    type: st.SUBITEMS,
-    icon: Nt,
+    id: En,
+    type: sn.SUBITEMS,
+    icon: Nn,
     tooltip: "docImage.title",
-    disabled$: ur(i),
-    hidden$: ot(i, _e.UNIVER_DOC, void 0, Pn)
+    disabled$: ir(i),
+    hidden$: rn(i, Ie.UNIVER_DOC, void 0, yt)
   };
 }
-function fr(i) {
+function sr(i) {
   return {
-    id: At,
+    id: Rn,
     title: "docImage.upload.float",
-    type: st.BUTTON,
-    hidden$: ot(i, _e.UNIVER_DOC, void 0, Pn)
+    type: sn.BUTTON,
+    hidden$: rn(i, Ie.UNIVER_DOC, void 0, yt)
   };
 }
-const pr = {
-  [Ci.LAYOUT]: {
-    [Et]: {
+const or = {
+  [Di.LAYOUT]: {
+    [En]: {
       order: 0,
-      menuItemFactory: hr,
-      [At]: {
+      menuItemFactory: rr,
+      [Rn]: {
         order: 0,
-        menuItemFactory: fr
+        menuItemFactory: sr
       }
     }
   }
 };
-function Je(i) {
-  return i.getContextValue(jt) && i.getContextValue(sn);
+function Qe(i) {
+  return i.getContextValue(Hn) && i.getContextValue(rt);
 }
-const wr = {
-  id: Qe.id,
+const ar = {
+  id: Ze.id,
   description: "shortcut.drawing-move-down",
   group: "4_drawing-view",
-  binding: je.ARROW_DOWN,
+  binding: He.ARROW_DOWN,
   priority: 100,
-  preconditions: Je,
+  preconditions: Qe,
   staticParameters: {
-    direction: fe.DOWN
+    direction: he.DOWN
   }
-}, vr = {
-  id: Qe.id,
+}, cr = {
+  id: Ze.id,
   description: "shortcut.drawing-move-up",
   group: "4_drawing-view",
-  binding: je.ARROW_UP,
+  binding: He.ARROW_UP,
   priority: 100,
-  preconditions: Je,
+  preconditions: Qe,
   staticParameters: {
-    direction: fe.UP
+    direction: he.UP
   }
-}, Ir = {
-  id: Qe.id,
+}, dr = {
+  id: Ze.id,
   description: "shortcut.drawing-move-left",
   group: "4_drawing-view",
-  binding: je.ARROW_LEFT,
+  binding: He.ARROW_LEFT,
   priority: 100,
-  preconditions: Je,
+  preconditions: Qe,
   staticParameters: {
-    direction: fe.LEFT
+    direction: he.LEFT
   }
-}, _r = {
-  id: Qe.id,
+}, lr = {
+  id: Ze.id,
   description: "shortcut.drawing-move-right",
   group: "4_drawing-view",
-  binding: je.ARROW_RIGHT,
+  binding: He.ARROW_RIGHT,
   priority: 100,
-  preconditions: Je,
+  preconditions: Qe,
   staticParameters: {
-    direction: fe.RIGHT
+    direction: he.RIGHT
   }
-}, Sr = {
-  id: wt.id,
+}, ur = {
+  id: vn.id,
   description: "shortcut.drawing-delete",
   group: "4_drawing-view",
   // when focusing on any other input tag do not trigger this shortcut
-  preconditions: Je,
-  binding: je.DELETE,
-  mac: je.BACKSPACE
+  preconditions: Qe,
+  binding: He.DELETE,
+  mac: He.BACKSPACE
 };
-var Dr = Object.getOwnPropertyDescriptor, Cr = (i, e, n, t) => {
-  for (var r = t > 1 ? void 0 : t ? Dr(e, n) : e, o = i.length - 1, s; o >= 0; o--)
-    (s = i[o]) && (r = s(r) || r);
+var gr = Object.getOwnPropertyDescriptor, fr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? gr(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = o(r) || r);
   return r;
-}, rn = (i, e) => (n, t) => e(n, t, i);
-let cn = class extends Be {
-  constructor(i, e, n, t) {
-    super(), this._componentManager = i, this._menuManagerService = e, this._commandService = n, this._shortcutService = t, this._init();
+}, nt = (i, e) => (t, n) => e(t, n, i);
+let ot = class extends Ue {
+  constructor(i, e, t, n) {
+    super(), this._componentManager = i, this._menuManagerService = e, this._commandService = t, this._shortcutService = n, this._init();
   }
   _initCustomComponents() {
     const i = this._componentManager;
-    this.disposeWithMe(i.register(Nt, pt)), this.disposeWithMe(i.register(Mt, mr));
+    this.disposeWithMe(i.register(Nn, mn)), this.disposeWithMe(i.register(bn, nr));
   }
   _initMenus() {
-    this._menuManagerService.mergeMenu(pr);
+    this._menuManagerService.mergeMenu(or);
   }
   _initCommands() {
     [
-      St,
-      Rn,
+      _n,
       Ct,
-      Ot,
-      Pt,
-      Ze,
-      Tt,
-      yt,
-      bn,
+      Dn,
+      yn,
+      On,
+      Ye,
+      Tn,
+      Mn,
       bt,
-      er,
-      Rt,
-      vt,
-      _t,
-      Qe,
-      wt,
-      It
+      Cn,
+      Ji,
+      xn,
+      pn,
+      In,
+      Ze,
+      vn,
+      wn
     ].forEach((i) => this.disposeWithMe(this._commandService.registerCommand(i)));
   }
   _initShortcuts() {
     [
       // sheet drawing shortcuts
-      wr,
-      vr,
-      Ir,
-      _r,
-      Sr
+      ar,
+      cr,
+      dr,
+      lr,
+      ur
     ].forEach((i) => {
       this.disposeWithMe(this._shortcutService.registerShortcut(i));
     });
@@ -1572,48 +1839,48 @@ let cn = class extends Be {
     this._initCommands(), this._initCustomComponents(), this._initMenus(), this._initShortcuts();
   }
 };
-cn = Cr([
-  rn(0, J(at)),
-  rn(1, Oi),
-  rn(2, $),
-  rn(3, Pi)
-], cn);
-var Or = Object.getOwnPropertyDescriptor, Pr = (i, e, n, t) => {
-  for (var r = t > 1 ? void 0 : t ? Or(e, n) : e, o = i.length - 1, s; o >= 0; o--)
-    (s = i[o]) && (r = s(r) || r);
+ot = fr([
+  nt(0, Z(on)),
+  nt(1, yi),
+  nt(2, G),
+  nt(3, Oi)
+], ot);
+var hr = Object.getOwnPropertyDescriptor, mr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? hr(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = o(r) || r);
   return r;
-}, ze = (i, e) => (n, t) => e(n, t, i);
-function Tr(i) {
-  var t, r, o, s;
-  if (X.isNoop(i) || !Array.isArray(i))
+}, $e = (i, e) => (t, n) => e(t, n, i);
+function vr(i) {
+  var n, r, s, o;
+  if ($.isNoop(i) || !Array.isArray(i))
     return null;
   const e = i.find((c) => Array.isArray(c) && (c == null ? void 0 : c[0]) === "drawings");
   if (e == null || !Array.isArray(e) || e.length < 3 || typeof e[1] == "string" && typeof e[2] != "object" || Array.isArray(e[1]) && typeof e[1][1] != "object")
     return null;
-  const n = [];
+  const t = [];
   if (Array.isArray(e == null ? void 0 : e[1]))
     for (const c of e)
-      Array.isArray(c) && n.push({
-        type: (t = c == null ? void 0 : c[1]) != null && t.i ? "add" : "remove",
+      Array.isArray(c) && t.push({
+        type: (n = c == null ? void 0 : c[1]) != null && n.i ? "add" : "remove",
         drawingId: c == null ? void 0 : c[0],
         drawing: (r = c == null ? void 0 : c[1]) == null ? void 0 : r.i
       });
   else
-    n.push({
-      type: (o = e[2]) != null && o.i ? "add" : "remove",
+    t.push({
+      type: (s = e[2]) != null && s.i ? "add" : "remove",
       drawingId: e[1],
-      drawing: (s = e[2]) == null ? void 0 : s.i
+      drawing: (o = e[2]) == null ? void 0 : o.i
     });
-  return n;
+  return t;
 }
-function yr(i) {
+function pr(i) {
   if (!Array.isArray(i) || i.length < 3 || i[0] !== "drawingsOrder")
     return [];
   const e = [];
-  for (let n = 1; n < i.length; n++) {
-    const t = i[n];
-    if (Array.isArray(t) && typeof t[0] == "number" && typeof t[1] == "object")
-      e.push(t[0]);
+  for (let t = 1; t < i.length; t++) {
+    const n = i[t];
+    if (Array.isArray(n) && typeof n[0] == "number" && typeof n[1] == "object")
+      e.push(n[0]);
     else {
       e.length = 0;
       break;
@@ -1621,9 +1888,9 @@ function yr(i) {
   }
   return e;
 }
-let dn = class extends Be {
-  constructor(i, e, n, t, r) {
-    super(), this._univerInstanceService = i, this._commandService = e, this._drawingManagerService = n, this._docDrawingService = t, this._renderManagerService = r, this._initialize();
+let at = class extends Ue {
+  constructor(i, e, t, n, r) {
+    super(), this._univerInstanceService = i, this._commandService = e, this._drawingManagerService = t, this._docDrawingService = n, this._renderManagerService = r, this._initialize();
   }
   _initialize() {
     this._commandExecutedListener();
@@ -1631,29 +1898,29 @@ let dn = class extends Be {
   _commandExecutedListener() {
     this.disposeWithMe(
       this._commandService.beforeCommandExecuted((i) => {
-        if (i.id !== te.id)
+        if (i.id !== ee.id)
           return;
-        const e = i.params, { unitId: n, actions: t } = e, r = Tr(t);
+        const e = i.params, { unitId: t, actions: n } = e, r = vr(n);
         if (r != null)
-          for (const { type: o, drawingId: s, drawing: c } of r)
-            o === "add" ? this._addDrawings(n, [c]) : this._removeDrawings(n, [s]);
+          for (const { type: s, drawingId: o, drawing: c } of r)
+            s === "add" ? this._addDrawings(t, [c]) : this._removeDrawings(t, [o]);
       })
     ), this.disposeWithMe(
       this._commandService.onCommandExecuted((i) => {
-        if (i.id !== te.id)
+        if (i.id !== ee.id)
           return;
-        const e = i.params, { unitId: n, actions: t } = e;
-        yr(t).length > 0 && this._updateDrawingsOrder(n);
+        const e = i.params, { unitId: t, actions: n } = e;
+        pr(n).length > 0 && this._updateDrawingsOrder(t);
       })
     ), this.disposeWithMe(
       this._commandService.onCommandExecuted((i) => {
-        var s;
-        if (i.id !== Vt.id && i.id !== $t.id)
+        var o;
+        if (i.id !== Gn.id && i.id !== Vn.id)
           return;
-        const e = (s = this._univerInstanceService.getCurrentUniverDocInstance()) == null ? void 0 : s.getUnitId(), n = this._drawingManagerService.getFocusDrawings();
-        if (e == null || n.length === 0)
+        const e = (o = this._univerInstanceService.getCurrentUniverDocInstance()) == null ? void 0 : o.getUnitId(), t = this._drawingManagerService.getFocusDrawings();
+        if (e == null || t.length === 0)
           return;
-        const t = this._renderManagerService.getRenderById(e), r = t == null ? void 0 : t.scene;
+        const n = this._renderManagerService.getRenderById(e), r = n == null ? void 0 : n.scene;
         if (r == null)
           return !1;
         r.getTransformerByCreate().refreshControls();
@@ -1661,72 +1928,72 @@ let dn = class extends Be {
     );
   }
   _addDrawings(i, e) {
-    const n = this._drawingManagerService, t = this._docDrawingService, r = this._docDrawingService.getBatchAddOp(e), { subUnitId: o, redo: s, objects: c } = r;
-    n.applyJson1(i, o, s), t.applyJson1(i, o, s), n.addNotification(c), t.addNotification(c);
+    const t = this._drawingManagerService, n = this._docDrawingService, r = this._docDrawingService.getBatchAddOp(e), { subUnitId: s, redo: o, objects: c } = r;
+    t.applyJson1(i, s, o), n.applyJson1(i, s, o), t.addNotification(c), n.addNotification(c);
   }
   _removeDrawings(i, e) {
-    const n = this._drawingManagerService, t = this._docDrawingService, r = this._docDrawingService.getBatchRemoveOp(e.map((d) => ({
+    const t = this._drawingManagerService, n = this._docDrawingService, r = this._docDrawingService.getBatchRemoveOp(e.map((d) => ({
       unitId: i,
       subUnitId: i,
       drawingId: d
-    }))), { subUnitId: o, redo: s, objects: c } = r;
-    n.applyJson1(i, o, s), t.applyJson1(i, o, s), n.removeNotification(c), t.removeNotification(c);
+    }))), { subUnitId: s, redo: o, objects: c } = r;
+    t.applyJson1(i, s, o), n.applyJson1(i, s, o), t.removeNotification(c), n.removeNotification(c);
   }
   _updateDrawingsOrder(i) {
     const e = this._univerInstanceService.getUniverDocInstance(i);
     if (e == null)
       return;
-    const n = e.getSnapshot().drawingsOrder;
-    if (n == null)
+    const t = e.getSnapshot().drawingsOrder;
+    if (t == null)
       return;
-    const t = this._drawingManagerService, r = this._docDrawingService;
-    t.setDrawingOrder(i, i, n), r.setDrawingOrder(i, i, n);
-    const o = {
+    const n = this._drawingManagerService, r = this._docDrawingService;
+    n.setDrawingOrder(i, i, t), r.setDrawingOrder(i, i, t);
+    const s = {
       unitId: i,
       subUnitId: i,
-      drawingIds: n
+      drawingIds: t
     };
-    t.orderNotification(o), r.orderNotification(o);
+    n.orderNotification(s), r.orderNotification(s);
   }
 };
-dn = Pr([
-  ze(0, q),
-  ze(1, $),
-  ze(2, we),
-  ze(3, Fe),
-  ze(4, ee)
-], dn);
-var Mr = Object.getOwnPropertyDescriptor, br = (i, e, n, t) => {
-  for (var r = t > 1 ? void 0 : t ? Mr(e, n) : e, o = i.length - 1, s; o >= 0; o--)
-    (s = i[o]) && (r = s(r) || r);
+at = mr([
+  $e(0, z),
+  $e(1, G),
+  $e(2, ve),
+  $e(3, Be),
+  $e(4, Q)
+], at);
+var wr = Object.getOwnPropertyDescriptor, Ir = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? wr(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = o(r) || r);
   return r;
-}, We = (i, e) => (n, t) => e(n, t, i);
-function xt(i, e, n = 1, t = 0) {
-  const { top: r, left: o, bottom: s, right: c } = i, d = c - o, a = s - r, l = e.getViewport(dt.VIEW_MAIN), { viewportScrollX: m, viewportScrollY: g } = l, { scaleX: h, scaleY: u } = e.getAncestorScale();
+}, Fe = (i, e) => (t, n) => e(t, n, i);
+function An(i, e, t = 1, n = 0) {
+  const { top: r, left: s, bottom: o, right: c } = i, d = c - s, a = o - r, l = e.getViewport(cn.VIEW_MAIN), { viewportScrollX: g, viewportScrollY: u } = l, { scaleX: h, scaleY: f } = e.getAncestorScale();
   return {
-    startX: (o - m) * h,
-    startY: (r - g) * u,
-    endX: (o + d - m) * h,
-    endY: (r + a - g) * u,
+    startX: (s - g) * h,
+    startY: (r - u) * f,
+    endX: (s + d - g) * h,
+    endY: (r + a - u) * f,
     width: d * h,
-    height: a * u,
-    rotate: t,
+    height: a * f,
+    rotate: n,
     absolute: {
       left: !1,
       top: !1
     },
-    opacity: n != null ? n : 1
+    opacity: t != null ? t : 1
   };
 }
-function Sn(i, e) {
-  const { top: n, left: t, width: r, height: o, angle: s, opacity: c } = i;
-  return xt({ top: n, left: t, bottom: n + o, right: t + r }, e.scene, c, s);
+function It(i, e) {
+  const { top: t, left: n, width: r, height: s, angle: o, opacity: c } = i;
+  return An({ top: t, left: n, bottom: t + s, right: n + r }, e.scene, c, o);
 }
-let ln = class extends Be {
-  constructor(e, n, t, r, o, s) {
+let ct = class extends Ue {
+  constructor(e, t, n, r, s, o) {
     super();
-    Se(this, "_domLayerInfoMap", /* @__PURE__ */ new Map());
-    this._renderManagerService = e, this._drawingManagerService = n, this._drawingRenderService = t, this._canvasFloatDomService = r, this._univerInstanceService = o, this._commandService = s, this._initialize();
+    _e(this, "_domLayerInfoMap", /* @__PURE__ */ new Map());
+    this._renderManagerService = e, this._drawingManagerService = t, this._drawingRenderService = n, this._canvasFloatDomService = r, this._univerInstanceService = s, this._commandService = o, this._initialize();
   }
   dispose() {
     super.dispose();
@@ -1737,11 +2004,11 @@ let ln = class extends Be {
   _getSceneAndTransformerByDrawingSearch(e) {
     if (e == null)
       return;
-    const n = this._renderManagerService.getRenderById(e);
-    if (n == null)
+    const t = this._renderManagerService.getRenderById(e);
+    if (t == null)
       return null;
-    const t = n.scene, r = t.getTransformerByCreate();
-    return { scene: t, transformer: r, renderUnit: n, canvas: n.engine.getCanvasElement() };
+    const n = t.scene, r = n.getTransformerByCreate();
+    return { scene: n, transformer: r, renderUnit: t, canvas: t.engine.getCanvasElement() };
   }
   _drawingAddRemoveListener() {
     this.disposeWithMe(
@@ -1750,182 +2017,182 @@ let ln = class extends Be {
       })
     ), this.disposeWithMe(
       this._drawingManagerService.remove$.subscribe((e) => {
-        e.forEach((n) => {
-          this._removeDom(n.drawingId);
+        e.forEach((t) => {
+          this._removeDom(t.drawingId);
         });
       })
     );
   }
   _insertRects(e) {
-    e.forEach(async (n) => {
-      const { unitId: t } = n;
-      if (!this._univerInstanceService.getUnit(t, _e.UNIVER_DOC))
+    e.forEach(async (t) => {
+      const { unitId: n } = t;
+      if (!this._univerInstanceService.getUnit(n, Ie.UNIVER_DOC))
         return;
-      const o = this._getSceneAndTransformerByDrawingSearch(t);
-      if (o == null)
-        return;
-      const s = this._drawingManagerService.getDrawingByParam(n);
+      const s = this._getSceneAndTransformerByDrawingSearch(n);
       if (s == null)
         return;
-      const c = await this._drawingRenderService.renderFloatDom(s, o.scene);
+      const o = this._drawingManagerService.getDrawingByParam(t);
+      if (o == null)
+        return;
+      const c = await this._drawingRenderService.renderFloatDom(o, s.scene);
       if (!(c == null || c.length === 0))
         for (const d of c) {
           this._addHoverForRect(d);
-          const a = new zt(), l = Sn(d, o.renderUnit), m = new yn(l), g = o.canvas, h = s.data, u = {
+          const a = new $n(), l = It(d, s.renderUnit), g = new Tt(l), u = s.canvas, h = o.data, f = {
             dispose: a,
             rect: d,
-            position$: m,
-            unitId: t
+            position$: g,
+            unitId: n
           };
           this._canvasFloatDomService.addFloatDom({
-            position$: m,
-            id: s.drawingId,
-            componentKey: s.componentKey,
-            onPointerDown: (w) => {
-              g.dispatchEvent(new PointerEvent(w.type, w));
+            position$: g,
+            id: o.drawingId,
+            componentKey: o.componentKey,
+            onPointerDown: (v) => {
+              u.dispatchEvent(new PointerEvent(v.type, v));
             },
-            onPointerMove: (w) => {
-              g.dispatchEvent(new PointerEvent(w.type, w));
+            onPointerMove: (v) => {
+              u.dispatchEvent(new PointerEvent(v.type, v));
             },
-            onPointerUp: (w) => {
-              g.dispatchEvent(new PointerEvent(w.type, w));
+            onPointerUp: (v) => {
+              u.dispatchEvent(new PointerEvent(v.type, v));
             },
-            onWheel: (w) => {
-              g.dispatchEvent(new WheelEvent(w.type, w));
+            onWheel: (v) => {
+              u.dispatchEvent(new WheelEvent(v.type, v));
             },
             data: h,
-            unitId: t
+            unitId: n
           });
-          const v = d.onTransformChange$.subscribeEvent(() => {
-            const w = Sn(d, o.renderUnit);
-            m.next(
-              w
+          const p = d.onTransformChange$.subscribeEvent(() => {
+            const v = It(d, s.renderUnit);
+            g.next(
+              v
             );
           });
           a.add(() => {
-            this._canvasFloatDomService.removeFloatDom(s.drawingId);
-          }), v && a.add(v), this._domLayerInfoMap.set(s.drawingId, u);
+            this._canvasFloatDomService.removeFloatDom(o.drawingId);
+          }), p && a.add(p), this._domLayerInfoMap.set(o.drawingId, f);
         }
     });
   }
   _addHoverForRect(e) {
     this.disposeWithMe(
-      Oe(
+      ye(
         e.onPointerEnter$.subscribeEvent(() => {
-          e.cursor = Fn.GRAB;
+          e.cursor = Ut.GRAB;
         })
       )
     ), this.disposeWithMe(
-      Oe(
+      ye(
         e.onPointerLeave$.subscribeEvent(() => {
-          e.cursor = Fn.DEFAULT;
+          e.cursor = Ut.DEFAULT;
         })
       )
     );
   }
   _removeDom(e) {
-    const n = this._domLayerInfoMap.get(e);
-    if (!n)
+    const t = this._domLayerInfoMap.get(e);
+    if (!t)
       return;
-    const { unitId: t } = n;
-    this._domLayerInfoMap.delete(e), n.dispose.dispose();
-    const r = this._getSceneAndTransformerByDrawingSearch(t);
-    r && r.scene.removeObject(n.rect);
+    const { unitId: n } = t;
+    this._domLayerInfoMap.delete(e), t.dispose.dispose();
+    const r = this._getSceneAndTransformerByDrawingSearch(n);
+    r && r.scene.removeObject(t.rect);
   }
   _initScrollAndZoomEvent() {
-    const e = (n) => {
-      const t = this._getSceneAndTransformerByDrawingSearch(n);
-      t && this._domLayerInfoMap.forEach((r) => {
-        if (r.unitId !== n) return;
-        const o = Sn(r.rect, t.renderUnit);
-        r.position$.next(o);
+    const e = (t) => {
+      const n = this._getSceneAndTransformerByDrawingSearch(t);
+      n && this._domLayerInfoMap.forEach((r) => {
+        if (r.unitId !== t) return;
+        const s = It(r.rect, n.renderUnit);
+        r.position$.next(s);
       });
     };
     this.disposeWithMe(
-      this._univerInstanceService.getCurrentTypeOfUnit$(_e.UNIVER_DOC).pipe(
-        zn((n) => {
-          if (!n) return null;
-          const t = n.getUnitId(), r = this._renderManagerService.getRenderById(t);
-          return r ? { render: r, unitId: t } : null;
+      this._univerInstanceService.getCurrentTypeOfUnit$(Ie.UNIVER_DOC).pipe(
+        Vt((t) => {
+          if (!t) return null;
+          const n = t.getUnitId(), r = this._renderManagerService.getRenderById(n);
+          return r ? { render: r, unitId: n } : null;
         }),
-        Hi(
-          (n) => n ? nt(n.render.scene.getViewport(dt.VIEW_MAIN).onScrollAfter$).pipe(zn(() => ({ unitId: n.unitId }))) : Gi(null)
+        ji(
+          (t) => t ? Jt(t.render.scene.getViewport(cn.VIEW_MAIN).onScrollAfter$).pipe(Vt(() => ({ unitId: t.unitId }))) : Wi(null)
         )
-      ).subscribe((n) => {
-        if (!n) return;
-        const { unitId: t } = n;
-        e(t);
+      ).subscribe((t) => {
+        if (!t) return;
+        const { unitId: n } = t;
+        e(n);
       })
-    ), this.disposeWithMe(this._commandService.onCommandExecuted((n) => {
-      if (n.id === lt.id) {
-        const t = n.params, { unitId: r } = t;
+    ), this.disposeWithMe(this._commandService.onCommandExecuted((t) => {
+      if (t.id === dn.id) {
+        const n = t.params, { unitId: r } = n;
         e(r);
       }
     }));
   }
-  insertFloatDom(e, n) {
-    var v, w, I;
-    const t = this._univerInstanceService.getCurrentUnitOfType(_e.UNIVER_DOC);
-    if (!t) return !1;
-    const r = this._getSceneAndTransformerByDrawingSearch(t.getUnitId());
+  insertFloatDom(e, t) {
+    var p, v, w;
+    const n = this._univerInstanceService.getCurrentUnitOfType(Ie.UNIVER_DOC);
+    if (!n) return !1;
+    const r = this._getSceneAndTransformerByDrawingSearch(n.getUnitId());
     if (!r) return !1;
-    const c = (v = r.renderUnit.with(ie).getSkeleton().getSkeletonData()) == null ? void 0 : v.pages[0];
+    const c = (p = r.renderUnit.with(te).getSkeleton().getSkeletonData()) == null ? void 0 : p.pages[0];
     if (!c) return !1;
-    const { pageWidth: d, marginLeft: a, marginRight: l } = c, m = d - a - l, g = {
+    const { pageWidth: d, marginLeft: a, marginRight: l } = c, g = d - a - l, u = {
       size: {
-        width: (w = n.width) != null ? w : m,
-        height: n.height
+        width: (v = t.width) != null ? v : g,
+        height: t.height
       },
       positionH: {
-        relativeFrom: ne.PAGE,
+        relativeFrom: J.PAGE,
         posOffset: 0
       },
       positionV: {
-        relativeFrom: H.PAGE,
+        relativeFrom: j.PAGE,
         posOffset: 0
       },
       angle: 0
-    }, h = (I = n.drawingId) != null ? I : Xt(), u = {
-      unitId: t.getUnitId(),
+    }, h = (w = t.drawingId) != null ? w : zn(), f = {
+      unitId: n.getUnitId(),
       drawings: [
         {
           drawingId: h,
-          drawingType: Ue.DRAWING_DOM,
-          subUnitId: t.getUnitId(),
-          unitId: t.getUnitId(),
+          drawingType: Le.DRAWING_DOM,
+          subUnitId: n.getUnitId(),
+          unitId: n.getUnitId(),
           ...e,
           title: "",
           description: "",
-          docTransform: g,
-          layoutType: W.INLINE,
-          transform: ct(g)
+          docTransform: u,
+          layoutType: F.INLINE,
+          transform: an(u)
         }
       ]
     };
-    return this._commandService.syncExecuteCommand(Rn.id, u), h;
+    return this._commandService.syncExecuteCommand(Ct.id, f), h;
   }
 };
-ln = br([
-  We(0, ee),
-  We(1, we),
-  We(2, J(it)),
-  We(3, J(Ti)),
-  We(4, q),
-  We(5, $)
-], ln);
-const Rr = (i) => {
-  const { floatDomInfos: e, scene: n, offset: t, bound: r } = i, o = r.right - r.left, s = r.bottom - r.top, c = Vi(() => e.map((d) => {
-    const { width: a = 0, height: l = 0, left: m = 0, top: g = 0 } = d.transform, u = xt(
+ct = Ir([
+  Fe(0, Q),
+  Fe(1, ve),
+  Fe(2, Z(tn)),
+  Fe(3, Z(Ti)),
+  Fe(4, z),
+  Fe(5, G)
+], ct);
+const _r = (i) => {
+  const { floatDomInfos: e, scene: t, offset: n, bound: r } = i, s = r.right - r.left, o = r.bottom - r.top, c = Gi(() => e.map((d) => {
+    const { width: a = 0, height: l = 0, left: g = 0, top: u = 0 } = d.transform, f = An(
       {
-        left: m,
-        right: m + a,
-        top: g,
-        bottom: g + l
+        left: g,
+        right: g + a,
+        top: u,
+        bottom: u + l
       },
-      n
-    ), v = {
-      position$: new yn(u),
-      position: u,
+      t
+    ), p = {
+      position$: new Tt(f),
+      position: f,
       id: d.drawingId,
       componentKey: d.componentKey,
       onPointerMove: () => {
@@ -1939,30 +2206,30 @@ const Rr = (i) => {
       unitId: d.unitId,
       data: d.data
     };
-    return [d.drawingId, v];
-  }).filter(([d, a]) => !(a.position.endX < 0 || a.position.endY < 0 || a.position.startX > o || a.position.startY > s)), [e, n, t, o, s]);
-  return /* @__PURE__ */ f("div", { style: { position: "absolute", top: 0, left: 0 }, children: c.map(([d, a]) => /* @__PURE__ */ f(yi, { layer: a, id: d, position: a.position }, d)) });
+    return [d.drawingId, p];
+  }).filter(([d, a]) => !(a.position.endX < 0 || a.position.endY < 0 || a.position.startX > s || a.position.startY > o)), [e, t, n, s, o]);
+  return /* @__PURE__ */ m("div", { style: { position: "absolute", top: 0, left: 0 }, children: c.map(([d, a]) => /* @__PURE__ */ m(Mi, { layer: a, id: d, position: a.position }, d)) });
 };
-var Nr = Object.getOwnPropertyDescriptor, Er = (i, e, n, t) => {
-  for (var r = t > 1 ? void 0 : t ? Nr(e, n) : e, o = i.length - 1, s; o >= 0; o--)
-    (s = i[o]) && (r = s(r) || r);
+var Sr = Object.getOwnPropertyDescriptor, Dr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Sr(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = o(r) || r);
   return r;
-}, Xe = (i, e) => (n, t) => e(n, t, i);
-let gn = class extends Be {
-  constructor(i, e, n, t, r) {
-    super(), this._docPrintInterceptorService = i, this._drawingRenderService = e, this._drawingManagerService = n, this._componetManager = t, this._injector = r, this._initPrinting(), this._initPrintingDom();
+}, ze = (i, e) => (t, n) => e(t, n, i);
+let dt = class extends Ue {
+  constructor(i, e, t, n, r) {
+    super(), this._docPrintInterceptorService = i, this._drawingRenderService = e, this._drawingManagerService = t, this._componetManager = n, this._injector = r, this._initPrinting(), this._initPrintingDom();
   }
   _initPrinting() {
     this.disposeWithMe(
       this._docPrintInterceptorService.interceptor.intercept(
         this._docPrintInterceptorService.interceptor.getInterceptPoints().PRINTING_COMPONENT_COLLECT,
         {
-          handler: (i, e, n) => {
-            const { unitId: t, scene: r } = e, o = this._drawingManagerService.getDrawingDataForUnit(t), s = o == null ? void 0 : o[t];
-            return s && s.order.forEach((c) => {
-              const d = s.data[c];
-              d.drawingType !== Ue.DRAWING_CHART && d.drawingType !== Ue.DRAWING_DOM && this._drawingRenderService.renderDrawing(d, r);
-            }), n();
+          handler: (i, e, t) => {
+            const { unitId: n, scene: r } = e, s = this._drawingManagerService.getDrawingDataForUnit(n), o = s == null ? void 0 : s[n];
+            return o && o.order.forEach((c) => {
+              const d = o.data[c];
+              d.drawingType !== Le.DRAWING_CHART && d.drawingType !== Le.DRAWING_DOM && this._drawingRenderService.renderDrawing(d, r);
+            }), t();
           }
         }
       )
@@ -1973,17 +2240,17 @@ let gn = class extends Be {
       this._docPrintInterceptorService.interceptor.intercept(
         this._docPrintInterceptorService.interceptor.getInterceptPoints().PRINTING_DOM_COLLECT,
         {
-          handler: (i, e, n) => {
-            const { unitId: t } = e, r = this._drawingManagerService.getDrawingDataForUnit(t), o = r == null ? void 0 : r[t];
-            if (o) {
-              const s = o.order.map((d) => {
-                const a = o.data[d];
-                if (a.drawingType === Ue.DRAWING_CHART)
+          handler: (i, e, t) => {
+            const { unitId: n } = e, r = this._drawingManagerService.getDrawingDataForUnit(n), s = r == null ? void 0 : r[n];
+            if (s) {
+              const o = s.order.map((d) => {
+                const a = s.data[d];
+                if (a.drawingType === Le.DRAWING_CHART)
                   return {
                     ...a,
-                    componentKey: this._componetManager.get(qt)
+                    componentKey: this._componetManager.get(Xn)
                   };
-                if (a.drawingType === Ue.DRAWING_DOM) {
+                if (a.drawingType === Le.DRAWING_DOM) {
                   const l = this._docPrintInterceptorService.getPrintComponent(a.componentKey);
                   return {
                     ...a,
@@ -1991,13 +2258,13 @@ let gn = class extends Be {
                   };
                 }
                 return null;
-              }).filter(Boolean), c = Mi(Rr, this._injector);
-              return Fi(
-                /* @__PURE__ */ f(
+              }).filter(Boolean), c = bi(_r, this._injector);
+              return Bi(
+                /* @__PURE__ */ m(
                   c,
                   {
-                    unitId: t,
-                    floatDomInfos: s,
+                    unitId: n,
+                    floatDomInfos: o,
                     scene: e.scene,
                     skeleton: e.skeleton,
                     offset: e.offset,
@@ -2007,7 +2274,7 @@ let gn = class extends Be {
                 e.root
               ), i == null || i.add(() => {
                 ki(e.root);
-              }), n(i);
+              }), t(i);
             }
           }
         }
@@ -2015,32 +2282,32 @@ let gn = class extends Be {
     );
   }
 };
-gn = Er([
-  Xe(0, J(Ni)),
-  Xe(1, J(it)),
-  Xe(2, we),
-  Xe(3, J(at)),
-  Xe(4, J(tt))
-], gn);
-var Ar = Object.getOwnPropertyDescriptor, xr = (i, e, n, t) => {
-  for (var r = t > 1 ? void 0 : t ? Ar(e, n) : e, o = i.length - 1, s; o >= 0; o--)
-    (s = i[o]) && (r = s(r) || r);
+dt = Dr([
+  ze(0, Z(Ni)),
+  ze(1, Z(tn)),
+  ze(2, ve),
+  ze(3, Z(on)),
+  ze(4, Z(en))
+], dt);
+var yr = Object.getOwnPropertyDescriptor, Or = (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 = o(r) || r);
   return r;
-}, on = (i, e) => (n, t) => e(n, t, i);
-const Lr = "__InlineDrawingAnchor__";
-function Qn(i) {
+}, it = (i, e) => (t, n) => e(t, n, i);
+const Tr = "__InlineDrawingAnchor__";
+function Yt(i) {
   const { path: e } = i;
-  return e.some((n) => n === "cells");
+  return e.some((t) => t === "cells");
 }
-let mn = class extends Be {
-  constructor(e, n, t, r) {
+let lt = class extends Ue {
+  constructor(e, t, n, r) {
     super();
-    Se(this, "_liquid", new rt());
-    Se(this, "_listenerOnImageMap", /* @__PURE__ */ new Set());
+    _e(this, "_liquid", new nn());
+    _e(this, "_listenerOnImageMap", /* @__PURE__ */ new Set());
     // Use to cache the drawings is under transforming or scaling.
-    Se(this, "_transformerCache", /* @__PURE__ */ new Map());
-    Se(this, "_anchorShape");
-    this._commandService = e, this._univerInstanceService = n, this._drawingManagerService = t, this._renderManagerService = r, this._init();
+    _e(this, "_transformerCache", /* @__PURE__ */ new Map());
+    _e(this, "_anchorShape");
+    this._commandService = e, this._univerInstanceService = t, this._drawingManagerService = n, this._renderManagerService = r, this._init();
   }
   _init() {
     this._listenDrawingFocus();
@@ -2049,9 +2316,9 @@ let mn = class extends Be {
     this.disposeWithMe(
       this._drawingManagerService.add$.subscribe((e) => {
         if (e.length !== 0)
-          for (const n of e) {
-            const { unitId: t } = n;
-            this._listenerOnImageMap.has(t) || (this._listenTransformerChange(t), this._listenerOnImageMap.add(t));
+          for (const t of e) {
+            const { unitId: n } = t;
+            this._listenerOnImageMap.has(n) || (this._listenTransformerChange(n), this._listenerOnImageMap.add(n));
           }
       })
     );
@@ -2060,75 +2327,75 @@ let mn = class extends Be {
   // eslint-disable-next-line max-lines-per-function
   _listenTransformerChange(e) {
     var r;
-    const n = (r = this._getSceneAndTransformerByDrawingSearch(e)) == null ? void 0 : r.transformer;
-    if (n == null)
+    const t = (r = this._getSceneAndTransformerByDrawingSearch(e)) == null ? void 0 : r.transformer;
+    if (t == null)
       return;
     this.disposeWithMe(
-      Oe(
-        n.changeStart$.subscribe((o) => {
+      ye(
+        t.changeStart$.subscribe((s) => {
           var c;
           this._transformerCache.clear();
-          const { objects: s } = o;
-          for (const d of s.values()) {
-            const { oKey: a, width: l, height: m, left: g, top: h, angle: u } = d, v = this._drawingManagerService.getDrawingOKey(a);
-            if (v == null)
+          const { objects: o } = s;
+          for (const d of o.values()) {
+            const { oKey: a, width: l, height: g, left: u, top: h, angle: f } = d, p = this._drawingManagerService.getDrawingOKey(a);
+            if (p == null)
               continue;
-            const w = this._univerInstanceService.getUniverDocInstance(v.unitId), I = (c = w == null ? void 0 : w.getSnapshot().drawings) == null ? void 0 : c[v.drawingId];
-            if ((I == null ? void 0 : I.layoutType) === W.INLINE)
+            const v = this._univerInstanceService.getUniverDocInstance(p.unitId), w = (c = v == null ? void 0 : v.getSnapshot().drawings) == null ? void 0 : c[p.drawingId];
+            if ((w == null ? void 0 : w.layoutType) === F.INLINE)
               try {
                 d.setOpacity(0.2);
               } catch {
               }
-            I != null && this._transformerCache.set(v.drawingId, {
-              drawing: I,
+            w != null && this._transformerCache.set(p.drawingId, {
+              drawing: w,
               top: h,
-              left: g,
+              left: u,
               width: l,
-              height: m,
-              angle: u
+              height: g,
+              angle: f
             });
           }
         })
       )
     );
-    const t = An(this._updateMultipleDrawingDocTransform.bind(this), 50);
-    An(this._nonInlineDrawingTransform.bind(this), 50), this.disposeWithMe(
-      Oe(
-        n.changing$.subscribe((o) => {
-          const { objects: s, offsetX: c, offsetY: d } = o;
-          if (s.size > 1)
-            t(s);
-          else if (s.size === 1) {
-            const a = this._transformerCache.values().next().value, l = s.values().next().value, { width: m, height: g, top: h, left: u, angle: v } = l;
-            if (a && m === a.width && g === a.height && h === a.top && u === a.left && v === a.angle)
+    const n = Et(this._updateMultipleDrawingDocTransform.bind(this), 50);
+    Et(this._nonInlineDrawingTransform.bind(this), 50), this.disposeWithMe(
+      ye(
+        t.changing$.subscribe((s) => {
+          const { objects: o, offsetX: c, offsetY: d } = s;
+          if (o.size > 1)
+            n(o);
+          else if (o.size === 1) {
+            const a = this._transformerCache.values().next().value, l = o.values().next().value, { width: g, height: u, top: h, left: f, angle: p } = l;
+            if (a && g === a.width && u === a.height && h === a.top && f === a.left && p === a.angle)
               return;
-            a && (a.drawing.layoutType, W.INLINE), a && a.drawing.layoutType === W.INLINE && c != null && d != null && this._updateInlineDrawingAnchor(a.drawing, c, d);
+            a && (a.drawing.layoutType, F.INLINE), a && a.drawing.layoutType === F.INLINE && c != null && d != null && this._updateInlineDrawingAnchor(a.drawing, c, d);
           }
         })
       )
     ), this.disposeWithMe(
-      Oe(
+      ye(
         // eslint-disable-next-line complexity
-        n.changeEnd$.subscribe((o) => {
-          const { objects: s, offsetX: c, offsetY: d } = o;
-          for (const a of s.values()) {
+        t.changeEnd$.subscribe((s) => {
+          const { objects: o, offsetX: c, offsetY: d } = s;
+          for (const a of o.values()) {
             const l = this._drawingManagerService.getDrawingOKey(a.oKey);
             if (l == null)
               continue;
-            const m = this._transformerCache.get(l == null ? void 0 : l.drawingId);
-            if ((m == null ? void 0 : m.drawing.layoutType) === W.INLINE)
+            const g = this._transformerCache.get(l == null ? void 0 : l.drawingId);
+            if ((g == null ? void 0 : g.drawing.layoutType) === F.INLINE)
               try {
                 a.setOpacity(1);
               } catch {
               }
           }
-          if (this._anchorShape && this._anchorShape.hide(), s.size > 1)
-            this._updateMultipleDrawingDocTransform(s);
-          else if (s.size === 1) {
-            const a = this._transformerCache.values().next().value, l = s.values().next().value, { width: m, height: g, top: h, left: u, angle: v } = l;
-            if (a && m === a.width && g === a.height && h === a.top && u === a.left && v === a.angle)
+          if (this._anchorShape && this._anchorShape.hide(), o.size > 1)
+            this._updateMultipleDrawingDocTransform(o);
+          else if (o.size === 1) {
+            const a = this._transformerCache.values().next().value, l = o.values().next().value, { width: g, height: u, top: h, left: f, angle: p } = l;
+            if (a && g === a.width && u === a.height && h === a.top && f === a.left && p === a.angle)
               return;
-            a && a.drawing.layoutType === W.INLINE ? m !== a.width || g !== a.height || v !== a.angle ? this._updateDrawingSize(a, l) : c != null && d != null && this._moveInlineDrawing(a.drawing, c, d) : a && this._nonInlineDrawingTransform(a.drawing, l);
+            a && a.drawing.layoutType === F.INLINE ? g !== a.width || u !== a.height || p !== a.angle ? this._updateDrawingSize(a, l) : c != null && d != null && this._moveInlineDrawing(a.drawing, c, d) : a && this._nonInlineDrawingTransform(a.drawing, l);
           }
           this._transformerCache.clear();
         })
@@ -2139,168 +2406,168 @@ let mn = class extends Be {
   _updateMultipleDrawingDocTransform(e) {
     if (e.size < 1)
       return;
-    const n = [];
-    let t, r;
-    for (const o of e.values()) {
-      const { oKey: s, left: c, top: d, angle: a } = o;
-      let { width: l, height: m } = o;
-      const g = this._drawingManagerService.getDrawingOKey(s);
-      if (g == null)
+    const t = [];
+    let n, r;
+    for (const s of e.values()) {
+      const { oKey: o, left: c, top: d, angle: a } = s;
+      let { width: l, height: g } = s;
+      const u = this._drawingManagerService.getDrawingOKey(o);
+      if (u == null)
         continue;
-      t == null && (t = g.unitId), r == null && (r = g.subUnitId);
-      const h = this._transformerCache.get(g.drawingId);
+      n == null && (n = u.unitId), r == null && (r = u.subUnitId);
+      const h = this._transformerCache.get(u.drawingId);
       if (h == null)
         continue;
-      const { drawing: u, top: v, left: w, width: I, height: O, angle: C } = h, { width: P, height: b } = this._getPageContentSize(u);
-      if (l = Math.min(l, P), m = Math.min(m, b), (I !== l || O !== m) && n.push({
-        drawingId: g.drawingId,
+      const { drawing: f, top: p, left: v, width: w, height: y, angle: D } = h, { width: O, height: C } = this._getPageContentSize(f);
+      if (l = Math.min(l, O), g = Math.min(g, C), (w !== l || y !== g) && t.push({
+        drawingId: u.drawingId,
         key: "size",
         value: {
           width: l,
-          height: m
+          height: g
         }
-      }), C !== a && n.push({
-        drawingId: g.drawingId,
+      }), D !== a && t.push({
+        drawingId: u.drawingId,
         key: "angle",
         value: a
-      }), v !== d || w !== c) {
-        const y = d - v, E = c - w;
-        y !== 0 && n.push({
-          drawingId: g.drawingId,
+      }), p !== d || v !== c) {
+        const M = d - p, E = c - v;
+        M !== 0 && t.push({
+          drawingId: u.drawingId,
           key: "positionV",
           value: {
-            relativeFrom: u.docTransform.positionV.relativeFrom,
-            posOffset: u.docTransform.positionV.posOffset + y
+            relativeFrom: f.docTransform.positionV.relativeFrom,
+            posOffset: f.docTransform.positionV.posOffset + M
           }
-        }), E !== 0 && n.push({
-          drawingId: g.drawingId,
+        }), E !== 0 && t.push({
+          drawingId: u.drawingId,
           key: "positionH",
           value: {
-            relativeFrom: u.docTransform.positionH.relativeFrom,
-            posOffset: u.docTransform.positionH.posOffset + E
+            relativeFrom: f.docTransform.positionH.relativeFrom,
+            posOffset: f.docTransform.positionH.posOffset + E
           }
         });
       }
     }
-    n.length > 0 && t && r && this._commandService.executeCommand(Ze.id, {
-      unitId: t,
+    t.length > 0 && n && r && this._commandService.executeCommand(Ye.id, {
+      unitId: n,
       subUnitId: r,
-      drawings: n
+      drawings: t
     });
   }
   // TODO: @JOCS, Use to draw and update the drawing anchor.
   _updateDrawingAnchor(e) {
     if (this._transformerCache.size !== 1)
       return;
-    const n = this._transformerCache.values().next().value, t = e.values().next().value;
-    this._getDrawingAnchor(n.drawing, t);
+    const t = this._transformerCache.values().next().value, n = e.values().next().value;
+    this._getDrawingAnchor(t.drawing, n);
   }
-  _updateInlineDrawingAnchor(e, n, t) {
-    var o;
+  _updateInlineDrawingAnchor(e, t, n) {
+    var s;
     if (this._transformerCache.size !== 1)
       return;
-    const { contentBoxPointGroup: r } = (o = this._getInlineDrawingAnchor(e, n, t)) != null ? o : {};
+    const { contentBoxPointGroup: r } = (s = this._getInlineDrawingAnchor(e, t, n)) != null ? s : {};
     r != null && this._createOrUpdateInlineAnchor(e.unitId, r);
   }
-  _getInlineDrawingAnchor(e, n, t) {
-    var x, j;
-    const r = this._renderManagerService.getRenderById(e.unitId), o = r == null ? void 0 : r.with(ie).getSkeleton();
+  _getInlineDrawingAnchor(e, t, n) {
+    var A, H;
+    const r = this._renderManagerService.getRenderById(e.unitId), s = r == null ? void 0 : r.with(te).getSkeleton();
     if (r == null)
       return;
-    const { mainComponent: s, scene: c } = r, d = s, a = c.getViewports()[0], {
-      pageLayoutType: l = kn.VERTICAL,
-      pageMarginLeft: m,
-      pageMarginTop: g
+    const { mainComponent: o, scene: c } = r, d = o, a = c.getViewports()[0], {
+      pageLayoutType: l = Bt.VERTICAL,
+      pageMarginLeft: g,
+      pageMarginTop: u
     } = d.getOffsetConfig();
-    let h = null, u = !1, v = -1, w = "";
-    const I = 0.5, O = this._getTransformCoordForDocumentOffset(d, a, n, t);
-    if (O == null)
+    let h = null, f = !1, p = -1, v = "";
+    const w = 0.5, y = this._getTransformCoordForDocumentOffset(d, a, t, n);
+    if (y == null)
       return;
-    const C = (x = this._renderManagerService.getRenderById(e.unitId)) == null ? void 0 : x.with(Re);
-    if (C == null)
+    const D = (A = this._renderManagerService.getRenderById(e.unitId)) == null ? void 0 : A.with(xe);
+    if (D == null)
       return;
-    const P = o == null ? void 0 : o.findNodeByCoord(O, l, m, g, {
+    const O = s == null ? void 0 : s.findNodeByCoord(y, l, g, u, {
       strict: !1,
-      segmentId: C.getSegment(),
-      segmentPage: C.getSegmentPage()
+      segmentId: D.getSegment(),
+      segmentPage: D.getSegmentPage()
     });
-    if (P) {
-      const { node: S, ratioX: D, segmentPage: R, segmentId: T } = P;
-      u = D < I, h = S, v = R, w = T;
+    if (O) {
+      const { node: _, ratioX: S, segmentPage: x, segmentId: T } = O;
+      f = S < w, h = _, p = x, v = T;
     }
     if (h == null)
       return;
-    const b = o == null ? void 0 : o.findPositionByGlyph(h, v), y = this._getDocObject();
-    if (b == null || o == null || y == null || Qn(b))
+    const C = s == null ? void 0 : s.findPositionByGlyph(h, p), M = this._getDocObject();
+    if (C == null || s == null || M == null || Yt(C))
       return;
     const E = {
-      ...b,
-      isBack: u
-    }, B = y.document.getOffsetConfig(), N = new Hn(B, o), { cursorList: _, contentBoxPointGroup: L } = N.getRangePointData(E, E), { startOffset: G } = (j = Gn(_)) != null ? j : {};
-    if (G != null)
-      return { offset: G, contentBoxPointGroup: L, segmentId: w, segmentPage: v };
+      ...C,
+      isBack: f
+    }, U = M.document.getOffsetConfig(), N = new Ft(U, s), { cursorList: I, contentBoxPointGroup: P } = N.getRangePointData(E, E), { startOffset: W } = (H = jt(I)) != null ? H : {};
+    if (W != null)
+      return { offset: W, contentBoxPointGroup: P, segmentId: v, segmentPage: p };
   }
   // eslint-disable-next-line max-lines-per-function, complexity
-  _getDrawingAnchor(e, n) {
-    var De, Ce, le, Pe, Te, Ee, Ae, ye, ge, me, xe;
-    const t = this._renderManagerService.getRenderById(e.unitId), r = t == null ? void 0 : t.with(ie).getSkeleton(), o = r == null ? void 0 : r.getSkeletonData();
-    if (o == null || t == null)
+  _getDrawingAnchor(e, t) {
+    var Se, De, ce, Oe, Te, Ee, Re, Me, de, le, Ae;
+    const n = this._renderManagerService.getRenderById(e.unitId), r = n == null ? void 0 : n.with(te).getSkeleton(), s = r == null ? void 0 : r.getSkeletonData();
+    if (s == null || n == null)
       return;
-    const { pages: s, skeHeaders: c, skeFooters: d } = o, { mainComponent: a, scene: l } = t, m = a, g = l.getViewports()[0], { pageLayoutType: h = kn.VERTICAL, pageMarginLeft: u, pageMarginTop: v, docsLeft: w, docsTop: I } = m.getOffsetConfig(), { left: O, top: C, angle: P } = n;
-    let { width: b, height: y } = n;
-    const { positionV: E, positionH: B } = e.docTransform, { width: N, height: _ } = this._getPageContentSize(e);
-    b = Math.min(b, N), y = Math.min(y, _);
-    let L = null, G = "", x = -1;
-    const j = !1, S = {
+    const { pages: o, skeHeaders: c, skeFooters: d } = s, { mainComponent: a, scene: l } = n, g = a, u = l.getViewports()[0], { pageLayoutType: h = Bt.VERTICAL, pageMarginLeft: f, pageMarginTop: p, docsLeft: v, docsTop: w } = g.getOffsetConfig(), { left: y, top: D, angle: O } = t;
+    let { width: C, height: M } = t;
+    const { positionV: E, positionH: U } = e.docTransform, { width: N, height: I } = this._getPageContentSize(e);
+    C = Math.min(C, N), M = Math.min(M, I);
+    let P = null, W = "", A = -1;
+    const H = !1, _ = {
       ...e.docTransform,
       size: {
-        width: b,
-        height: y
+        width: C,
+        height: M
       },
-      angle: P
-    }, { x: D, y: R } = l.getViewportScrollXY(g), T = this._getTransformCoordForDocumentOffset(m, g, O - D, C - R);
+      angle: O
+    }, { x: S, y: x } = l.getViewportScrollXY(u), T = this._getTransformCoordForDocumentOffset(g, u, y - S, D - x);
     if (T == null)
       return;
-    const U = (De = this._renderManagerService.getRenderById(e.unitId)) == null ? void 0 : De.with(Re);
-    if (U == null)
+    const L = (Se = this._renderManagerService.getRenderById(e.unitId)) == null ? void 0 : Se.with(xe);
+    if (L == null)
       return;
-    const F = r == null ? void 0 : r.findNodeByCoord(T, h, u, v, {
+    const B = r == null ? void 0 : r.findNodeByCoord(T, h, f, p, {
       strict: !1,
-      segmentId: U.getSegment(),
-      segmentPage: U.getSegmentPage()
+      segmentId: L.getSegment(),
+      segmentPage: L.getSegmentPage()
     });
-    if (F) {
-      const { node: ve, segmentPage: wn, segmentId: vn } = F;
-      L = ve, x = wn, G = vn;
+    if (B) {
+      const { node: pe, segmentPage: mt, segmentId: vt } = B;
+      P = pe, A = mt, W = vt;
     }
-    if (L == null)
+    if (P == null)
       return;
-    const M = (Ce = L.parent) == null ? void 0 : Ce.parent, A = M == null ? void 0 : M.parent, z = (le = A == null ? void 0 : A.lines.find((ve) => ve.paragraphIndex === (M == null ? void 0 : M.paragraphIndex) && ve.paragraphStart)) != null ? le : A == null ? void 0 : A.lines[0], k = (Pe = A == null ? void 0 : A.parent) == null ? void 0 : Pe.parent;
-    if (M == null || A == null || z == null || k == null)
+    const b = (De = P.parent) == null ? void 0 : De.parent, R = b == null ? void 0 : b.parent, V = (ce = R == null ? void 0 : R.lines.find((pe) => pe.paragraphIndex === (b == null ? void 0 : b.paragraphIndex) && pe.paragraphStart)) != null ? ce : R == null ? void 0 : R.lines[0], k = (Oe = R == null ? void 0 : R.parent) == null ? void 0 : Oe.parent;
+    if (b == null || R == null || V == null || k == null)
       return;
     this._liquid.reset();
-    const Z = k.type;
-    for (const ve of s) {
-      const { headerId: wn, footerId: vn, pageHeight: Ut, pageWidth: Nn, marginLeft: En, marginBottom: Bt } = ve, Ft = s.indexOf(ve);
-      if (x > -1 && Ft === x) {
-        switch (Z) {
-          case Wn.HEADER: {
-            const $e = (Te = c.get(wn)) == null ? void 0 : Te.get(Nn);
-            if ($e)
+    const K = k.type;
+    for (const pe of o) {
+      const { headerId: mt, footerId: vt, pageHeight: Ln, pageWidth: xt, marginLeft: Nt, marginBottom: Un } = pe, Bn = o.indexOf(pe);
+      if (A > -1 && Bn === A) {
+        switch (K) {
+          case kt.HEADER: {
+            const Ve = (Te = c.get(mt)) == null ? void 0 : Te.get(xt);
+            if (Ve)
               this._liquid.translatePagePadding({
-                marginTop: $e.marginTop,
-                marginLeft: En
+                marginTop: Ve.marginTop,
+                marginLeft: Nt
               });
             else
               throw new Error("header skeleton not found");
             break;
           }
-          case Wn.FOOTER: {
-            const $e = (Ee = d.get(vn)) == null ? void 0 : Ee.get(Nn);
-            if ($e)
+          case kt.FOOTER: {
+            const Ve = (Ee = d.get(vt)) == null ? void 0 : Ee.get(xt);
+            if (Ve)
               this._liquid.translatePagePadding({
-                marginTop: Ut - Bt + $e.marginTop,
-                marginLeft: En
+                marginTop: Ln - Un + Ve.marginTop,
+                marginLeft: Nt
               });
             else
               throw new Error("footer skeleton not found");
@@ -2309,135 +2576,135 @@ let mn = class extends Be {
         }
         break;
       }
-      if (this._liquid.translatePagePadding(ve), ve === k)
+      if (this._liquid.translatePagePadding(pe), pe === k)
         break;
-      this._liquid.restorePagePadding(ve), this._liquid.translatePage(ve, h, u, v);
+      this._liquid.restorePagePadding(pe), this._liquid.translatePage(pe, h, f, p);
     }
-    switch (E.relativeFrom === H.LINE ? L = M.divides[0].glyphGroup[0] : L = (me = (ge = (ye = (Ae = z.divides) == null ? void 0 : Ae[0]) == null ? void 0 : ye.glyphGroup) == null ? void 0 : ge[0]) != null ? me : L, S.positionH = {
-      relativeFrom: B.relativeFrom,
-      posOffset: O - this._liquid.x - w
-    }, B.relativeFrom) {
-      case ne.MARGIN: {
-        S.positionH.posOffset = O - this._liquid.x - w - k.marginLeft;
+    switch (E.relativeFrom === j.LINE ? P = b.divides[0].glyphGroup[0] : P = (le = (de = (Me = (Re = V.divides) == null ? void 0 : Re[0]) == null ? void 0 : Me.glyphGroup) == null ? void 0 : de[0]) != null ? le : P, _.positionH = {
+      relativeFrom: U.relativeFrom,
+      posOffset: y - this._liquid.x - v
+    }, U.relativeFrom) {
+      case J.MARGIN: {
+        _.positionH.posOffset = y - this._liquid.x - v - k.marginLeft;
         break;
       }
-      case ne.COLUMN: {
-        S.positionH.posOffset = O - this._liquid.x - w - A.left;
+      case J.COLUMN: {
+        _.positionH.posOffset = y - this._liquid.x - v - R.left;
         break;
       }
     }
-    switch (S.positionV = {
+    switch (_.positionV = {
       relativeFrom: E.relativeFrom,
-      posOffset: C - this._liquid.y - I
+      posOffset: D - this._liquid.y - w
     }, E.relativeFrom) {
-      case H.PAGE: {
-        S.positionV.posOffset = C - this._liquid.y - I - k.marginTop;
+      case j.PAGE: {
+        _.positionV.posOffset = D - this._liquid.y - w - k.marginTop;
         break;
       }
-      case H.LINE: {
-        S.positionV.posOffset = C - this._liquid.y - I - M.top;
+      case j.LINE: {
+        _.positionV.posOffset = D - this._liquid.y - w - b.top;
         break;
       }
-      case H.PARAGRAPH: {
-        S.positionV.posOffset = C - this._liquid.y - I - z.top;
+      case j.PARAGRAPH: {
+        _.positionV.posOffset = D - this._liquid.y - w - V.top;
         break;
       }
     }
-    if (L == null)
+    if (P == null)
       return;
-    const ce = r == null ? void 0 : r.findPositionByGlyph(L, x), ke = this._getDocObject();
-    if (ce == null || r == null || ke == null || Qn(ce))
+    const oe = r == null ? void 0 : r.findPositionByGlyph(P, A), ke = this._getDocObject();
+    if (oe == null || r == null || ke == null || Yt(oe))
       return;
     const Ne = {
-      ...ce,
-      isBack: j
-    }, Ve = ke.document.getOffsetConfig(), de = new Hn(Ve, r), { cursorList: re } = de.getRangePointData(Ne, Ne), { startOffset: oe } = (xe = Gn(re)) != null ? xe : {};
-    if (oe != null)
-      return { offset: oe, docTransform: S, segmentId: G, segmentPage: x };
+      ...oe,
+      isBack: H
+    }, Ge = ke.document.getOffsetConfig(), ae = new Ft(Ge, r), { cursorList: ne } = ae.getRangePointData(Ne, Ne), { startOffset: ie } = (Ae = jt(ne)) != null ? Ae : {};
+    if (ie != null)
+      return { offset: ie, docTransform: _, segmentId: W, segmentPage: A };
   }
   // Update drawing when use transformer to resize it.
-  _updateDrawingSize(e, n) {
-    const t = [], { drawing: r, width: o, height: s, angle: c } = e, { unitId: d, subUnitId: a } = r;
-    let { width: l, height: m, angle: g } = n;
-    const { width: h, height: u } = this._getPageContentSize(r);
-    l = Math.min(h, l), m = Math.min(u, m), (l !== o || m !== s) && t.push({
+  _updateDrawingSize(e, t) {
+    const n = [], { drawing: r, width: s, height: o, angle: c } = e, { unitId: d, subUnitId: a } = r;
+    let { width: l, height: g, angle: u } = t;
+    const { width: h, height: f } = this._getPageContentSize(r);
+    l = Math.min(h, l), g = Math.min(f, g), (l !== s || g !== o) && n.push({
       drawingId: r.drawingId,
       key: "size",
       value: {
         width: l,
-        height: m
+        height: g
       }
-    }), g !== c && t.push({
+    }), u !== c && n.push({
       drawingId: r.drawingId,
       key: "angle",
-      value: g
-    }), t.length > 0 && d && a && this._commandService.executeCommand(Ze.id, {
+      value: u
+    }), n.length > 0 && d && a && this._commandService.executeCommand(Ye.id, {
       unitId: d,
       subUnitId: a,
-      drawings: t
+      drawings: n
     });
   }
   // Update inline drawing when use transformer to move it.
-  _moveInlineDrawing(e, n, t) {
-    const r = this._getInlineDrawingAnchor(e, n, t), { offset: o, segmentId: s, segmentPage: c } = r != null ? r : {};
-    return this._commandService.executeCommand(Tt.id, {
+  _moveInlineDrawing(e, t, n) {
+    const r = this._getInlineDrawingAnchor(e, t, n), { offset: s, segmentId: o, segmentPage: c } = r != null ? r : {};
+    return this._commandService.executeCommand(Tn.id, {
       unitId: e.unitId,
       subUnitId: e.unitId,
       drawing: e,
-      offset: o,
-      segmentId: s,
+      offset: s,
+      segmentId: o,
       segmentPage: c,
-      needRefreshDrawings: o == null
+      needRefreshDrawings: s == null
     });
   }
   // Limit the drawing to the page area, mainly in the vertical direction,
   // and the upper and lower limits cannot exceed the page margin area.
-  _limitDrawingInPage(e, n) {
-    const t = this._renderManagerService.getRenderById(e.unitId), { left: r, top: o, width: s, height: c, angle: d } = n, a = t == null ? void 0 : t.with(ie).getSkeleton(), l = a == null ? void 0 : a.getSkeletonData(), { pages: m } = l != null ? l : {};
-    if (l == null || t == null || m == null)
+  _limitDrawingInPage(e, t) {
+    const n = this._renderManagerService.getRenderById(e.unitId), { left: r, top: s, width: o, height: c, angle: d } = t, a = n == null ? void 0 : n.with(te).getSkeleton(), l = a == null ? void 0 : a.getSkeletonData(), { pages: g } = l != null ? l : {};
+    if (l == null || n == null || g == null)
       return {
         left: r,
-        top: o,
-        width: s,
+        top: s,
+        width: o,
         height: c,
         angle: d
       };
-    const { mainComponent: g } = t, h = g, { top: u, pageLayoutType: v, pageMarginLeft: w, pageMarginTop: I } = h;
-    let O = o;
+    const { mainComponent: u } = n, h = u, { top: f, pageLayoutType: p, pageMarginLeft: v, pageMarginTop: w } = h;
+    let y = s;
     this._liquid.reset();
-    for (const C of m) {
-      const { marginBottom: P, pageHeight: b } = C, y = m.indexOf(C), E = m[y + 1];
+    for (const D of g) {
+      const { marginBottom: O, pageHeight: C } = D, M = g.indexOf(D), E = g[M + 1];
       if (E == null)
         continue;
-      if (be.hasIntersectionBetweenTwoRanges(
-        o,
-        o + c,
-        this._liquid.y + u + b - P,
-        this._liquid.y + u + b + I + E.marginTop
+      if (Ce.hasIntersectionBetweenTwoRanges(
+        s,
+        s + c,
+        this._liquid.y + f + C - O,
+        this._liquid.y + f + C + w + E.marginTop
       )) {
-        const N = o + c / 2, _ = this._liquid.y + u + b + I / 2;
-        N < _ ? O = Math.min(o, this._liquid.y + u + b - P - c) : O = Math.max(o, this._liquid.y + u + b + I + E.marginTop);
+        const N = s + c / 2, I = this._liquid.y + f + C + w / 2;
+        N < I ? y = Math.min(s, this._liquid.y + f + C - O - c) : y = Math.max(s, this._liquid.y + f + C + w + E.marginTop);
       }
-      this._liquid.translatePage(C, v, w, I);
+      this._liquid.translatePage(D, p, v, w);
     }
     return {
       left: r,
-      top: O,
-      width: s,
+      top: y,
+      width: o,
       height: c,
       angle: d
     };
   }
-  _nonInlineDrawingTransform(e, n, t = !1) {
-    const r = e.isMultiTransform === ae.TRUE ? n : this._limitDrawingInPage(e, n);
-    if (t && r.top !== n.top)
+  _nonInlineDrawingTransform(e, t, n = !1) {
+    const r = e.isMultiTransform === se.TRUE ? t : this._limitDrawingInPage(e, t);
+    if (n && r.top !== t.top)
       return;
-    const o = this._getDrawingAnchor(e, r), { offset: s, docTransform: c, segmentId: d, segmentPage: a } = o != null ? o : {};
-    return s == null || c == null ? this._updateMultipleDrawingDocTransform(/* @__PURE__ */ new Map([[e.drawingId, n]])) : this._commandService.executeCommand(yt.id, {
+    const s = this._getDrawingAnchor(e, r), { offset: o, docTransform: c, segmentId: d, segmentPage: a } = s != null ? s : {};
+    return o == null || c == null ? this._updateMultipleDrawingDocTransform(/* @__PURE__ */ new Map([[e.drawingId, t]])) : this._commandService.executeCommand(Mn.id, {
       unitId: e.unitId,
       subUnitId: e.unitId,
       drawing: e,
-      offset: s,
+      offset: o,
       docTransform: c,
       segmentId: d,
       segmentPage: a
@@ -2446,50 +2713,50 @@ let mn = class extends Be {
   _getSceneAndTransformerByDrawingSearch(e) {
     if (e == null)
       return;
-    const n = this._renderManagerService.getRenderById(e), t = n == null ? void 0 : n.scene;
-    if (t == null)
+    const t = this._renderManagerService.getRenderById(e), n = t == null ? void 0 : t.scene;
+    if (n == null)
       return;
-    const r = t.getTransformerByCreate();
-    return { scene: t, transformer: r };
+    const r = n.getTransformerByCreate();
+    return { scene: n, transformer: r };
   }
-  _getTransformCoordForDocumentOffset(e, n, t, r) {
-    const { documentTransform: o } = e.getOffsetConfig(), s = n.transformVector2SceneCoord(pi.FromArray([t, r]));
-    if (s)
-      return o.clone().invert().applyPoint(s);
+  _getTransformCoordForDocumentOffset(e, t, n, r) {
+    const { documentTransform: s } = e.getOffsetConfig(), o = t.transformVector2SceneCoord(mi.FromArray([n, r]));
+    if (o)
+      return s.clone().invert().applyPoint(o);
   }
-  _createOrUpdateInlineAnchor(e, n) {
-    const t = this._renderManagerService.getRenderById(e);
-    if (t == null)
+  _createOrUpdateInlineAnchor(e, t) {
+    const n = this._renderManagerService.getRenderById(e);
+    if (n == null)
       return;
-    const { mainComponent: r, scene: o } = t, s = r, {
+    const { mainComponent: r, scene: s } = n, o = r, {
       docsLeft: c,
       docsTop: d
-    } = s.getOffsetConfig(), a = Ei(n), { left: l, top: m, height: g } = a, h = l + c, u = m + d;
+    } = o.getOffsetConfig(), a = Ei(t), { left: l, top: g, height: u } = a, h = l + c, f = g + d;
     if (this._anchorShape) {
-      this._anchorShape.transformByState({ left: h, top: u, height: g }), this._anchorShape.show();
+      this._anchorShape.transformByState({ left: h, top: f, height: u }), this._anchorShape.show();
       return;
     }
-    const v = 6, w = new wi(Lr + be.generateRandomId(v), {
+    const p = 6, v = new vi(Tr + Ce.generateRandomId(p), {
       left: h,
-      top: u,
-      height: g,
+      top: f,
+      height: u,
       strokeWidth: 2,
-      stroke: vi(Kt.darkGray, 1),
+      stroke: pi(qn.darkGray, 1),
       evented: !1
     });
-    this._anchorShape = w, o.addObject(w, Ai);
+    this._anchorShape = v, s.addObject(v, Ri);
   }
   _getDocObject() {
-    return xi(this._univerInstanceService, this._renderManagerService);
+    return Ai(this._univerInstanceService, this._renderManagerService);
   }
   _getPageContentSize(e) {
-    const n = this._renderManagerService.getRenderById(e.unitId), t = n == null ? void 0 : n.with(ie).getSkeleton(), r = 500, o = 500, s = t == null ? void 0 : t.getSkeletonData();
-    if (s == null || n == null)
+    const t = this._renderManagerService.getRenderById(e.unitId), n = t == null ? void 0 : t.with(te).getSkeleton(), r = 500, s = 500, o = n == null ? void 0 : n.getSkeletonData();
+    if (o == null || t == null)
       return {
         width: r,
-        height: o
+        height: s
       };
-    const { pages: c } = s;
+    const { pages: c } = o;
     let d = null;
     for (const a of c) {
       const { skeDrawings: l } = a;
@@ -2499,171 +2766,171 @@ let mn = class extends Be {
       }
     }
     if (d) {
-      const { pageWidth: a, pageHeight: l, marginLeft: m, marginBottom: g, marginRight: h, marginTop: u } = d;
+      const { pageWidth: a, pageHeight: l, marginLeft: g, marginBottom: u, marginRight: h, marginTop: f } = d;
       return {
-        width: Math.max(r, a - m - h),
-        height: Math.max(o, l - u - g)
+        width: Math.max(r, a - g - h),
+        height: Math.max(s, l - f - u)
       };
     } else
       return {
         width: r,
-        height: o
+        height: s
       };
   }
 };
-mn = xr([
-  on(0, $),
-  on(1, q),
-  on(2, we),
-  on(3, ee)
-], mn);
-var Ur = Object.getOwnPropertyDescriptor, Br = (i, e, n, t) => {
-  for (var r = t > 1 ? void 0 : t ? Ur(e, n) : e, o = i.length - 1, s; o >= 0; o--)
-    (s = i[o]) && (r = s(r) || r);
+lt = Or([
+  it(0, G),
+  it(1, z),
+  it(2, ve),
+  it(3, Q)
+], lt);
+var Mr = Object.getOwnPropertyDescriptor, br = (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 = o(r) || r);
   return r;
-}, qe = (i, e) => (n, t) => e(n, t, i);
-let un = class extends Yt {
-  constructor(e, n, t, r, o) {
+}, Xe = (i, e) => (t, n) => e(t, n, i);
+let ut = class extends Kn {
+  constructor(e, t, n, r, s) {
     super();
-    Se(this, "_initImagePopupMenu", /* @__PURE__ */ new Set());
-    this._drawingManagerService = e, this._canvasPopManagerService = n, this._renderManagerService = t, this._univerInstanceService = r, this._contextService = o, this._init();
+    _e(this, "_initImagePopupMenu", /* @__PURE__ */ new Set());
+    this._drawingManagerService = e, this._canvasPopManagerService = t, this._renderManagerService = n, this._univerInstanceService = r, this._contextService = s, this._init();
   }
   _init() {
-    this._univerInstanceService.getCurrentTypeOfUnit$(_e.UNIVER_DOC).pipe(Xn(this.dispose$)).subscribe((e) => this._create(e)), this._univerInstanceService.getTypeOfUnitDisposed$(_e.UNIVER_DOC).pipe(Xn(this.dispose$)).subscribe((e) => this._dispose(e)), this._univerInstanceService.getAllUnitsForType(_e.UNIVER_DOC).forEach((e) => this._create(e));
+    this._univerInstanceService.getCurrentTypeOfUnit$(Ie.UNIVER_DOC).pipe($t(this.dispose$)).subscribe((e) => this._create(e)), this._univerInstanceService.getTypeOfUnitDisposed$(Ie.UNIVER_DOC).pipe($t(this.dispose$)).subscribe((e) => this._dispose(e)), this._univerInstanceService.getAllUnitsForType(Ie.UNIVER_DOC).forEach((e) => this._create(e));
   }
   _dispose(e) {
-    const n = e.getUnitId();
-    this._renderManagerService.removeRender(n);
+    const t = e.getUnitId();
+    this._renderManagerService.removeRender(t);
   }
   _create(e) {
     if (!e)
       return;
-    const n = e.getUnitId();
-    this._renderManagerService.has(n) && !this._initImagePopupMenu.has(n) && (this._popupMenuListener(n), this._initImagePopupMenu.add(n));
+    const t = e.getUnitId();
+    this._renderManagerService.has(t) && !this._initImagePopupMenu.has(t) && (this._popupMenuListener(t), this._initImagePopupMenu.add(t));
   }
   _hasCropObject(e) {
-    const n = e.getAllObjects();
-    for (const t of n)
-      if (t instanceof li)
+    const t = e.getAllObjects();
+    for (const n of t)
+      if (n instanceof di)
         return !0;
     return !1;
   }
   // eslint-disable-next-line max-lines-per-function
   _popupMenuListener(e) {
-    var o;
-    const n = (o = this._renderManagerService.getRenderById(e)) == null ? void 0 : o.scene;
-    if (!n)
-      return;
-    const t = n.getTransformerByCreate();
+    var s;
+    const t = (s = this._renderManagerService.getRenderById(e)) == null ? void 0 : s.scene;
     if (!t)
       return;
+    const n = t.getTransformerByCreate();
+    if (!n)
+      return;
     const r = [];
     this.disposeWithMe(
-      Oe(
-        t.createControl$.subscribe(() => {
-          if (this._hasCropObject(n))
+      ye(
+        n.createControl$.subscribe(() => {
+          if (this._hasCropObject(t))
             return;
-          const s = t.getSelectedObjectMap();
-          if (r.forEach((I) => I.dispose()), r.length = 0, s.size > 1)
+          const o = n.getSelectedObjectMap();
+          if (r.forEach((w) => w.dispose()), r.length = 0, o.size > 1)
             return;
-          const c = s.values().next().value;
+          const c = o.values().next().value;
           if (!c)
             return;
           const d = c.oKey, a = this._drawingManagerService.getDrawingOKey(d);
-          if (!a || a.drawingType === Ue.DRAWING_DOM)
+          if (!a || a.drawingType === Le.DRAWING_DOM)
             return;
-          const { unitId: l, subUnitId: m, drawingId: g, drawingType: h } = a, u = this._canvasPopManagerService.attachPopupToObject(
+          const { unitId: l, subUnitId: g, drawingId: u, drawingType: h } = a, f = this._canvasPopManagerService.attachPopupToObject(
             c,
             {
-              componentKey: gi,
+              componentKey: li,
               direction: "horizontal",
               offset: [2, 0],
               extraProps: {
-                menuItems: this._getImageMenuItems(l, m, g, h)
+                menuItems: this._getImageMenuItems(l, g, u, h)
               }
             },
             l
           );
-          r.push(this.disposeWithMe(u)), !this._drawingManagerService.getFocusDrawings().find((I) => I.unitId === l && I.subUnitId === m && I.drawingId === g) && this._drawingManagerService.focusDrawing([{
+          r.push(this.disposeWithMe(f)), !this._drawingManagerService.getFocusDrawings().find((w) => w.unitId === l && w.subUnitId === g && w.drawingId === u) && this._drawingManagerService.focusDrawing([{
             unitId: l,
-            subUnitId: m,
-            drawingId: g
+            subUnitId: g,
+            drawingId: u
           }]);
         })
       )
     ), this.disposeWithMe(
-      Oe(
-        t.clearControl$.subscribe(() => {
-          r.forEach((s) => s.dispose()), r.length = 0, this._contextService.setContextValue(sn, !1), this._drawingManagerService.focusDrawing(null);
+      ye(
+        n.clearControl$.subscribe(() => {
+          r.forEach((o) => o.dispose()), r.length = 0, this._contextService.setContextValue(rt, !1), this._drawingManagerService.focusDrawing(null);
         })
       )
     ), this.disposeWithMe(
-      Oe(
-        t.changing$.subscribe(() => {
-          r.forEach((s) => s.dispose()), r.length = 0;
+      ye(
+        n.changing$.subscribe(() => {
+          r.forEach((o) => o.dispose()), r.length = 0;
         })
       )
     ), this.disposeWithMe(
-      Oe(
-        t.changeStart$.subscribe(() => {
-          r.forEach((s) => s.dispose()), r.length = 0;
+      ye(
+        n.changeStart$.subscribe(() => {
+          r.forEach((o) => o.dispose()), r.length = 0;
         })
       )
     );
   }
-  _getImageMenuItems(e, n, t, r) {
+  _getImageMenuItems(e, t, n, r) {
     return [
       {
         label: "image-popup.edit",
         index: 0,
-        commandId: Rt.id,
-        commandParams: { unitId: e, subUnitId: n, drawingId: t },
+        commandId: xn.id,
+        commandParams: { unitId: e, subUnitId: t, drawingId: n },
         // disable: !!SHEET_EDITOR_UNITS.includes(unitId) || drawingType === DrawingTypeEnum.DRAWING_DOM,
         disable: !0
       },
       {
         label: "image-popup.delete",
         index: 1,
-        commandId: bn.id,
-        commandParams: { unitId: e, drawings: [{ unitId: e, subUnitId: n, drawingId: t }] },
+        commandId: bt.id,
+        commandParams: { unitId: e, drawings: [{ unitId: e, subUnitId: t, drawingId: n }] },
         disable: !1
       },
       {
         label: "image-popup.crop",
         index: 2,
-        commandId: mi.id,
-        commandParams: { unitId: e, subUnitId: n, drawingId: t },
+        commandId: ui.id,
+        commandParams: { unitId: e, subUnitId: t, drawingId: n },
         disable: !0
         // TODO: @JOCS, feature is not ready.
       },
       {
         label: "image-popup.reset",
         index: 3,
-        commandId: ui.id,
-        commandParams: [{ unitId: e, subUnitId: n, drawingId: t }],
+        commandId: gi.id,
+        commandParams: [{ unitId: e, subUnitId: t, drawingId: n }],
         disable: !0
         // TODO: @JOCS, feature is not ready.
       }
     ];
   }
 };
-un = Br([
-  qe(0, we),
-  qe(1, J(Li)),
-  qe(2, ee),
-  qe(3, q),
-  qe(4, et)
-], un);
-var Fr = Object.getOwnPropertyDescriptor, kr = (i, e, n, t) => {
-  for (var r = t > 1 ? void 0 : t ? Fr(e, n) : e, o = i.length - 1, s; o >= 0; o--)
-    (s = i[o]) && (r = s(r) || r);
+ut = br([
+  Xe(0, ve),
+  Xe(1, Z(Pi)),
+  Xe(2, Q),
+  Xe(3, z),
+  Xe(4, Qt)
+], ut);
+var Cr = Object.getOwnPropertyDescriptor, xr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Cr(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = o(r) || r);
   return r;
-}, Le = (i, e) => (n, t) => e(n, t, i);
-let Cn = class extends Be {
-  constructor(e, n, t, r, o, s, c, d) {
+}, Pe = (i, e) => (t, n) => e(t, n, i);
+let St = class extends Ue {
+  constructor(e, t, n, r, s, o, c, d) {
     super();
-    Se(this, "_liquid", new rt());
-    this._context = e, this._docSkeletonManagerService = n, this._commandService = t, this._editorService = r, this._drawingManagerService = o, this._docRefreshDrawingsService = s, this._univerInstanceService = c, this._lifecycleService = d, this._initialize(), this._commandExecutedListener();
+    _e(this, "_liquid", new nn());
+    this._context = e, this._docSkeletonManagerService = t, this._commandService = n, this._editorService = r, this._drawingManagerService = s, this._docRefreshDrawingsService = o, this._univerInstanceService = c, this._lifecycleService = d, this._initialize(), this._commandExecutedListener();
   }
   _initialize() {
     this._initialRenderRefresh(), this._drawingInitializeListener(), this._initResize();
@@ -2676,18 +2943,18 @@ let Cn = class extends Be {
     });
   }
   _commandExecutedListener() {
-    const e = [te.id, lt.id];
+    const e = [ee.id, dn.id];
     this.disposeWithMe(
-      this._commandService.onCommandExecuted((n) => {
-        if (e.includes(n.id)) {
-          const t = n.params, { unitId: r } = t, { unitId: o, mainComponent: s } = this._context;
-          if (r !== o)
+      this._commandService.onCommandExecuted((t) => {
+        if (e.includes(t.id)) {
+          const n = t.params, { unitId: r } = n, { unitId: s, mainComponent: o } = this._context;
+          if (r !== s)
             return;
           const c = this._docSkeletonManagerService.getSkeleton();
           if (c == null)
             return;
-          if (this._editorService.isEditor(o) && o !== Pn) {
-            s == null || s.makeDirty();
+          if (this._editorService.isEditor(s) && s !== yt) {
+            o == null || o.makeDirty();
             return;
           }
           this._refreshDrawing(c);
@@ -2697,169 +2964,169 @@ let Cn = class extends Be {
   }
   _initResize() {
     this.disposeWithMe(
-      nt(this._context.engine.onTransformChange$).pipe(
-        qn((e) => e.type === Ii.resize),
-        gt(16)
+      Jt(this._context.engine.onTransformChange$).pipe(
+        zt((e) => e.type === wi.resize),
+        ln(16)
       ).subscribe(() => {
-        var t;
-        const e = this._docSkeletonManagerService.getSkeleton(), { scene: n } = this._context;
-        (t = n.getTransformer()) == null || t.refreshControls(), this._refreshDrawing(e);
+        var n;
+        const e = this._docSkeletonManagerService.getSkeleton(), { scene: t } = this._context;
+        (n = t.getTransformer()) == null || n.refreshControls(), this._refreshDrawing(e);
       })
     );
   }
   _refreshDrawing(e) {
-    var O, C;
-    const n = e == null ? void 0 : e.getSkeletonData(), { mainComponent: t, unitId: r } = this._context, o = t;
-    if (!n)
+    var y, D;
+    const t = e == null ? void 0 : e.getSkeletonData(), { mainComponent: n, unitId: r } = this._context, s = n;
+    if (!t)
       return;
-    const { left: s, top: c, pageLayoutType: d, pageMarginLeft: a, pageMarginTop: l } = o, { pages: m, skeHeaders: g, skeFooters: h } = n, u = {};
+    const { left: o, top: c, pageLayoutType: d, pageMarginLeft: a, pageMarginTop: l } = s, { pages: g, skeHeaders: u, skeFooters: h } = t, f = {};
     this._liquid.reset();
-    for (let P = 0, b = m.length; P < b; P++) {
-      const y = m[P], { headerId: E, footerId: B, pageWidth: N } = y;
+    for (let O = 0, C = g.length; O < C; O++) {
+      const M = g[O], { headerId: E, footerId: U, pageWidth: N } = M;
       if (E) {
-        const _ = (O = g.get(E)) == null ? void 0 : O.get(N);
-        _ && this._calculateDrawingPosition(
+        const I = (y = u.get(E)) == null ? void 0 : y.get(N);
+        I && this._calculateDrawingPosition(
           r,
-          _,
-          s,
+          I,
+          o,
           c,
-          u,
-          _.marginTop,
-          y.marginLeft
+          f,
+          I.marginTop,
+          M.marginLeft
         );
       }
-      if (B) {
-        const _ = (C = h.get(B)) == null ? void 0 : C.get(N);
-        _ && this._calculateDrawingPosition(
+      if (U) {
+        const I = (D = h.get(U)) == null ? void 0 : D.get(N);
+        I && this._calculateDrawingPosition(
           r,
-          _,
-          s,
+          I,
+          o,
           c,
-          u,
-          y.pageHeight - y.marginBottom + _.marginTop,
-          y.marginLeft
+          f,
+          M.pageHeight - M.marginBottom + I.marginTop,
+          M.marginLeft
         );
       }
-      this._calculateDrawingPosition(r, y, s, c, u, y.marginTop, y.marginLeft), this._liquid.translatePage(y, d, a, l);
+      this._calculateDrawingPosition(r, M, o, c, f, M.marginTop, M.marginLeft), this._liquid.translatePage(M, d, a, l);
     }
-    const v = Object.values(u), w = v.filter((P) => !P.isMultiTransform), I = v.filter((P) => P.isMultiTransform);
-    w.length > 0 && this._drawingManagerService.refreshTransform(w), this._handleMultiDrawingsTransform(I);
+    const p = Object.values(f), v = p.filter((O) => !O.isMultiTransform), w = p.filter((O) => O.isMultiTransform);
+    v.length > 0 && this._drawingManagerService.refreshTransform(v), this._handleMultiDrawingsTransform(w);
   }
   _handleMultiDrawingsTransform(e) {
-    const { scene: n, unitId: t } = this._context, r = n.getTransformerByCreate();
+    const { scene: t, unitId: n } = this._context, r = t.getTransformerByCreate();
     e.forEach((d) => {
       const a = this._drawingManagerService.getDrawingByParam(d);
       a != null && (a.transform = d.transform, a.transforms = d.transforms, a.isMultiTransform = d.isMultiTransform);
     });
-    const s = [...r.getSelectedObjectMap().keys()], c = Object.values(this._drawingManagerService.getDrawingData(t, t)).filter((d) => d.isMultiTransform === ae.TRUE);
+    const o = [...r.getSelectedObjectMap().keys()], c = Object.values(this._drawingManagerService.getDrawingData(n, n)).filter((d) => d.isMultiTransform === se.TRUE);
     this._drawingManagerService.removeNotification(c), e.length > 0 && this._drawingManagerService.addNotification(e);
-    for (const d of s) {
-      const a = n.getObject(d);
+    for (const d of o) {
+      const a = t.getObject(d);
       a && r.setSelectedControl(a);
     }
   }
-  _calculateDrawingPosition(e, n, t, r, o, s, c) {
-    const { skeDrawings: d } = n;
+  _calculateDrawingPosition(e, t, n, r, s, o, c) {
+    const { skeDrawings: d } = t;
     this._liquid.translatePagePadding({
-      marginTop: s,
+      marginTop: o,
       marginLeft: c
     }), d.forEach((a) => {
-      const { aLeft: l, aTop: m, height: g, width: h, angle: u, drawingId: v, drawingOrigin: w } = a, I = w.layoutType === W.WRAP_NONE && w.behindDoc === ae.TRUE, { isMultiTransform: O = ae.FALSE } = w, C = {
-        left: l + t + this._liquid.x,
-        top: m + r + this._liquid.y,
+      const { aLeft: l, aTop: g, height: u, width: h, angle: f, drawingId: p, drawingOrigin: v } = a, w = v.layoutType === F.WRAP_NONE && v.behindDoc === se.TRUE, { isMultiTransform: y = se.FALSE } = v, D = {
+        left: l + n + this._liquid.x,
+        top: g + r + this._liquid.y,
         width: h,
-        height: g,
-        angle: u
+        height: u,
+        angle: f
       };
-      o[v] == null ? o[v] = {
+      s[p] == null ? s[p] = {
         unitId: e,
         subUnitId: e,
-        drawingId: v,
-        behindText: I,
-        transform: C,
-        transforms: [C],
-        isMultiTransform: O
-      } : O === ae.TRUE && o[v].transforms.push(C);
+        drawingId: p,
+        behindText: w,
+        transform: D,
+        transforms: [D],
+        isMultiTransform: y
+      } : y === se.TRUE && s[p].transforms.push(D);
     }), this._liquid.restorePagePadding({
-      marginTop: s,
+      marginTop: o,
       marginLeft: c
     });
   }
   _drawingInitializeListener() {
     const e = () => {
-      const n = this._docSkeletonManagerService.getSkeleton();
-      n != null && (this._refreshDrawing(n), this._drawingManagerService.initializeNotification(this._context.unitId));
+      const t = this._docSkeletonManagerService.getSkeleton();
+      t != null && (this._refreshDrawing(t), this._drawingManagerService.initializeNotification(this._context.unitId));
     };
-    this._lifecycleService.stage >= xn.Rendered ? this._docSkeletonManagerService.getSkeleton() ? e() : setTimeout(e, 500) : this._lifecycleService.lifecycle$.pipe(qn((n) => n === xn.Rendered)).subscribe(e);
+    this._lifecycleService.stage >= Rt.Rendered ? this._docSkeletonManagerService.getSkeleton() ? e() : setTimeout(e, 500) : this._lifecycleService.lifecycle$.pipe(zt((t) => t === Rt.Rendered)).subscribe(e);
   }
 };
-Cn = kr([
-  Le(1, J(ie)),
-  Le(2, $),
-  Le(3, Ui),
-  Le(4, we),
-  Le(5, J(pn)),
-  Le(6, q),
-  Le(7, J(Zt))
-], Cn);
-var Wr = Object.defineProperty, Hr = Object.getOwnPropertyDescriptor, Gr = (i, e, n) => e in i ? Wr(i, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : i[e] = n, jr = (i, e, n, t) => {
-  for (var r = t > 1 ? void 0 : t ? Hr(e, n) : e, o = i.length - 1, s; o >= 0; o--)
-    (s = i[o]) && (r = s(r) || r);
+St = xr([
+  Pe(1, Z(te)),
+  Pe(2, G),
+  Pe(3, Li),
+  Pe(4, ve),
+  Pe(5, Z(ht)),
+  Pe(6, z),
+  Pe(7, Z(Yn))
+], St);
+var Nr = Object.defineProperty, Er = Object.getOwnPropertyDescriptor, Rr = (i, e, t) => e in i ? Nr(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t, Ar = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Er(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (r = o(r) || r);
   return r;
-}, Dn = (i, e) => (n, t) => e(n, t, i), Lt = (i, e, n) => Gr(i, typeof e != "symbol" ? e + "" : e, n);
-const Vr = "DOC_DRAWING_UI_PLUGIN";
-let hn = class extends ei {
-  constructor(i = Kn, e, n, t) {
-    super(), this._config = i, this._injector = e, this._renderManagerSrv = n, this._configService = t;
-    const { ...r } = ni(
+}, _t = (i, e) => (t, n) => e(t, n, i), Pn = (i, e, t) => Rr(i, typeof e != "symbol" ? e + "" : e, t);
+const Pr = "DOC_DRAWING_UI_PLUGIN";
+let gt = class extends Jn {
+  constructor(i = Xt, e, t, n) {
+    super(), this._config = i, this._injector = e, this._renderManagerSrv = t, this._configService = n;
+    const { ...r } = ei(
       {},
-      Kn,
+      Xt,
       this._config
     );
-    this._configService.setConfig($i, r);
+    this._configService.setConfig(Vi, r);
   }
   onStarting() {
     [
-      [cn],
-      [un],
-      [mn],
-      [dn],
-      [pn],
-      [ln],
-      [gn]
+      [ot],
+      [ut],
+      [lt],
+      [at],
+      [ht],
+      [ct],
+      [dt]
     ].forEach((e) => this._injector.add(e));
   }
   onReady() {
     [
-      [an],
-      [Cn]
-    ].forEach((i) => this._renderManagerSrv.registerRenderModule(_e.UNIVER_DOC, i)), this._injector.get(dn), this._injector.get(cn), this._injector.get(mn), this._injector.get(gn);
+      [st],
+      [St]
+    ].forEach((i) => this._renderManagerSrv.registerRenderModule(Ie.UNIVER_DOC, i)), this._injector.get(at), this._injector.get(ot), this._injector.get(lt), this._injector.get(dt);
   }
   onRendered() {
-    this._injector.get(un), this._injector.get(ln);
+    this._injector.get(ut), this._injector.get(ct);
   }
 };
-Lt(hn, "type", _e.UNIVER_DOC);
-Lt(hn, "pluginName", Vr);
-hn = jr([
-  Qt(hi, ci, ti, bi),
-  Dn(1, J(tt)),
-  Dn(2, ee),
-  Dn(3, Jt)
-], hn);
+Pn(gt, "type", Ie.UNIVER_DOC);
+Pn(gt, "pluginName", Pr);
+gt = Ar([
+  Zn(fi, ai, ti, Ci),
+  _t(1, Z(en)),
+  _t(2, Q),
+  _t(3, Qn)
+], gt);
 export {
-  er as ClearDocDrawingTransformerOperation,
-  Et as DOCS_IMAGE_MENU_ID,
-  wt as DeleteDocDrawingsCommand,
-  ln as DocFloatDomController,
-  Rt as EditDocDrawingOperation,
-  vt as GroupDocDrawingCommand,
-  Rn as InsertDocDrawingCommand,
-  St as InsertDocImageCommand,
-  Qe as MoveDocDrawingsCommand,
-  bn as RemoveDocDrawingCommand,
-  It as SetDocDrawingArrangeCommand,
-  bt as SidebarDocDrawingOperation,
-  _t as UngroupDocDrawingCommand,
-  hn as UniverDocsDrawingUIPlugin
+  Ji as ClearDocDrawingTransformerOperation,
+  En as DOCS_IMAGE_MENU_ID,
+  vn as DeleteDocDrawingsCommand,
+  ct as DocFloatDomController,
+  xn as EditDocDrawingOperation,
+  pn as GroupDocDrawingCommand,
+  Ct as InsertDocDrawingCommand,
+  _n as InsertDocImageCommand,
+  Ze as MoveDocDrawingsCommand,
+  bt as RemoveDocDrawingCommand,
+  wn as SetDocDrawingArrangeCommand,
+  Cn as SidebarDocDrawingOperation,
+  In as UngroupDocDrawingCommand,
+  gt as UniverDocsDrawingUIPlugin
 };