@univerjs/docs-drawing-ui 0.7.0-nightly.202505081607 → 0.7.0-nightly.202505101606

package/lib/index.js

@@ -1,45 +1,45 @@
 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";
+var Wn = (i, e, t) => e in i ? kn(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t;
+var Ie = (i, e, t) => Wn(i, typeof e != "symbol" ? e + "" : e, t);
+import { CommandType as q, ICommandService as j, IUniverInstanceService as z, TextX as Dt, JSONX as $, MemoryCursor as Hn, TextXActionType as Y, IUndoRedoService as Zt, BuildTextUtils as Gn, ArrangeTypeEnum as Qe, Tools as be, Inject as Z, IContextService as Qt, LocaleService as gt, Disposable as Le, WrapTextType as Xe, PositionedObjectLayoutType as k, BooleanNumber as se, DrawingTypeEnum as Pe, ObjectRelativeFromV as W, ObjectRelativeFromH as J, FOCUSING_COMMON_DRAWINGS as it, UniverInstanceType as we, Direction as fe, DocumentFlavor as pt, DOCS_ZEN_EDITOR_UNIT_ID_KEY as Ot, FOCUSING_UNIVER_EDITOR as jn, UndoCommand as Vn, RedoCommand as $n, DisposableCollection as zn, toDisposable as De, fromEventSubject as Jt, generateRandomId as Xn, Injector as en, DOC_DRAWING_PRINTING_COMPONENT_KEY as qn, throttle as Et, COLORS as Kn, RxDisposable as Yn, LifecycleService as Zn, LifecycleStages as Rt, DependentOn as Qn, IConfigService as Jn, Plugin as ei, merge as ti } from "@univerjs/core";
+import { IDocDrawingService as Ue, UniverDocsDrawingPlugin as ni } from "@univerjs/docs-drawing";
+import { IImageIoService as ii, IDrawingManagerService as me, DRAWING_IMAGE_ALLOW_IMAGE_LIST as ri, DRAWING_IMAGE_COUNT_LIMIT as At, ImageUploadStatusType as vt, DRAWING_IMAGE_ALLOW_SIZE as si, getImageSize as oi, getDrawingShapeKeyByDrawingSearch as ai, DRAWING_IMAGE_WIDTH_LIMIT as Pt, DRAWING_IMAGE_HEIGHT_LIMIT as Lt, UniverDrawingPlugin as ci } from "@univerjs/drawing";
+import { DrawingCommonPanel as di, DrawingRenderService as tn, ImageCropperObject as li, COMPONENT_IMAGE_POPUP_MENU as ui, OpenImageCropOperation as gi, ImageResetSizeOperation as fi, UniverDrawingUIPlugin as hi } from "@univerjs/drawing-ui";
+import { IRenderManagerService as Q, DocumentEditArea as We, getCurrentTypeOfRenderer as mi, CURSOR_TYPE as Ut, Liquid as nn, PageLayoutType as Bt, DocumentSkeletonPageType as Ft, Vector2 as pi, Rect as vi, getColor as wi, TRANSFORM_CHANGE_OBSERVABLE_TYPE as Ii } from "@univerjs/engine-render";
+import { IMessageService as _i, ILocalFileService as Si, ISidebarService as Di, useDependency as ve, getMenuHiddenObservable as rn, MenuItemType as sn, RibbonStartGroup as Oi, KeyCode as He, ComponentManager as on, IMenuManagerService as yi, IShortcutService as Ti, CanvasFloatDomService as Mi, PrintFloatDomSingle as bi, connectInjector as xi, UniverUIPlugin as Ci } from "@univerjs/ui";
+import { RichTextEditingMutation as ee, DocSelectionManagerService as yt, DocSkeletonManagerService as te } from "@univerjs/docs";
+import { DocSelectionRenderService as xe, getRichTextEditPath as qe, getCustomBlockIdsInSelections as Ni, docDrawingPositionToTransform as an, VIEWPORT_KEY as cn, SetDocZoomRatioOperation as dn, DocPrintInterceptorService as Ei, NodePositionConvertToCursor as kt, getOneTextSelectionRange as Wt, getAnchorBounding as Ri, TEXT_RANGE_LAYER_INDEX as Ai, getDocObject as Pi, DocCanvasPopManagerService as Li, IEditorService as Ui } from "@univerjs/docs-ui";
+import { MessageType as Ht, clsx as _t, InputNumber as ke, Select as Gt, Checkbox as Bi, borderTopClassName as ln, RadioGroup as jt, Radio as Me, render as Fi, unmount as ki } from "@univerjs/design";
+import { BehaviorSubject as Tt, debounceTime as un, Observable as Wi, map as Vt, switchMap as Hi, of as Gi, 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) {
+import { forwardRef as gn, useRef as ji, createElement as fn, useState as re, useEffect as Mt, useMemo as Vi } from "react";
+const $i = "docs-drawing-ui.config", Xt = {};
+var he = function() {
+  return he = 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;
-  }, me.apply(this, arguments);
-}, $i = function(i, e) {
+  }, he.apply(this, arguments);
+}, zi = 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, 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);
+}, hn = gn(function(i, e) {
+  var t = i.icon, n = i.id, r = i.className, s = i.extend, o = zi(i, ["icon", "id", "className", "extend"]), c = "univerjs-icon univerjs-icon-".concat(n, " ").concat(r || "").trim(), d = ji("_".concat(Ki()));
+  return mn(t, "".concat(n), { defIds: t.defIds, idSuffix: d.current }, he({ ref: e, className: c }, o), s);
 });
-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 mn(i, e, t, n, r) {
+  return fn(i.tag, he(he({ key: e }, Xi(i, t, r)), n), (qi(i, t).children || []).map(function(s, o) {
+    return mn(s, "".concat(e, "-").concat(i.tag, "-").concat(o), t, void 0, r);
   }));
 }
-function zi(i, e, t) {
-  var n = me({}, i.attrs);
+function Xi(i, e, t) {
+  var n = he({}, 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, ")")));
@@ -50,48 +50,48 @@ function zi(i, e, t) {
     typeof c == "string" && (n[o] = c.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
   })), n;
 }
-function Xi(i, e) {
+function qi(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;
+  return !n || n.length === 0 ? i : i.tag === "defs" && (!((t = i.children) === null || t === void 0) && t.length) ? he(he({}, i), { children: i.children.map(function(r) {
+    return typeof r.attrs.id == "string" && n && n.indexOf(r.attrs.id) > -1 ? he(he({}, r), { attrs: he(he({}, r.attrs), { id: r.attrs.id + e.idSuffix }) }) : r;
   }) }) : i;
 }
-function qi() {
+function Ki() {
   return Math.random().toString(36).substring(2, 8);
 }
-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, {
+hn.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" } }] }, pn = gn(function(i, e) {
+  return fn(hn, Object.assign({}, i, {
     id: "add-image-single",
     ref: e,
-    icon: Ki
+    icon: Yi
   }));
 });
-mn.displayName = "AddImageSingle";
+pn.displayName = "AddImageSingle";
 const bt = {
   id: "doc.command.remove-doc-image",
   type: q.COMMAND,
   // eslint-disable-next-line max-lines-per-function
   handler: (i, e) => {
-    var C, M, E, U;
-    const t = i.get(G), n = i.get(z), r = i.get(Q), s = n.getCurrentUniverDocInstance();
+    var x, M, E, U;
+    const t = i.get(j), n = i.get(z), r = i.get(Q), s = n.getCurrentUniverDocInstance();
     if (e == null || s == null)
       return !1;
-    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();
+    const o = r.getRenderById(e.unitId).with(xe), { drawings: c } = e, d = (x = o.getSegment()) != null ? x : "", 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 Hn();
     f.reset();
-    const p = u[0].startIndex, v = [
+    const v = u[0].startIndex, p = [
       {
-        startOffset: p,
-        endOffset: p
+        startOffset: v,
+        endOffset: v
       }
     ], w = {
       id: ee.id,
       params: {
         unitId: h,
         actions: [],
-        textRanges: v
+        textRanges: p
       }
-    }, y = [];
+    }, O = [];
     for (const N of u) {
       const { startIndex: I } = N;
       I > f.cursor && a.push({
@@ -102,19 +102,19 @@ const bt = {
         len: 1
       }), f.moveCursorTo(I + 1);
     }
-    const D = Ke(s, d);
-    y.push(l.editOp(a.serialize(), D));
+    const D = qe(s, d);
+    O.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(_);
+      const { blockId: I } = N, P = ((U = s.getDrawings()) != null ? U : {})[I], A = s.getDrawingsOrder().indexOf(I), G = l.removeOp(["drawings", I], P), _ = l.removeOp(["drawingsOrder", A], I);
+      O.push(G), O.push(_);
     }
-    return w.params.actions = y.reduce((N, I) => $.compose(N, I), null), !!t.syncExecuteCommand(w.id, w.params);
+    return w.params.actions = O.reduce((N, I) => $.compose(N, I), null), !!t.syncExecuteCommand(w.id, w.params);
   }
 }, vn = {
   id: "doc.command.delete-drawing",
   type: q.COMMAND,
   handler: (i) => {
-    const e = i.get(G), n = i.get(Be).getFocusDrawings();
+    const e = i.get(j), n = i.get(Ue).getFocusDrawings();
     if (n.length === 0)
       return !1;
     const { unitId: r } = n[0], s = n.map((o) => {
@@ -131,12 +131,12 @@ const bt = {
       drawings: s
     });
   }
-}, pn = {
+}, wn = {
   id: "doc.command.group-doc-image",
   type: q.COMMAND,
   handler: (i, e) => {
-    i.get(G), i.get(Zt);
-    const t = i.get(Be);
+    i.get(j), i.get(Zt);
+    const t = i.get(Ue);
     if (!e) return !1;
     const n = [];
     e.forEach(({ parent: l, children: g }) => {
@@ -147,7 +147,7 @@ const bt = {
     const r = t.getGroupDrawingOp(e), { unitId: s, subUnitId: o, undo: c, redo: d, objects: a } = r;
     return !1;
   }
-}, Ct = {
+}, xt = {
   id: "doc.command.insert-doc-image",
   type: q.COMMAND,
   // eslint-disable-next-line max-lines-per-function
@@ -155,13 +155,13 @@ const bt = {
     var M, E, U, N;
     if (e == null)
       return !1;
-    const t = i.get(G), n = i.get(Ot), r = i.get(z), s = n.getActiveTextRange(), o = r.getCurrentUniverDocInstance();
+    const t = i.get(j), n = i.get(yt), r = i.get(z), s = n.getActiveTextRange(), o = r.getCurrentUniverDocInstance();
     if (s == null || o == null)
       return !1;
     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 Dt(), f = $.getInstance(), p = [], v = (E = (M = o.getSnapshot().drawingsOrder) == null ? void 0 : M.length) != null ? E : 0;
+    const h = new Dt(), f = $.getInstance(), v = [], p = (E = (M = o.getSnapshot().drawingsOrder) == null ? void 0 : M.length) != null ? E : 0;
     let w = 0;
     if (a)
       l > 0 && h.push({
@@ -169,16 +169,16 @@ const bt = {
         len: l
       });
     else {
-      const I = Wn.selection.delete([s], u, 0, null, !1);
+      const I = Gn.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)
+      const P = Ni(u, [s]), H = (U = o.getDrawings()) != null ? U : {}, A = (N = o.getDrawingsOrder()) != null ? N : [], G = P.sort((_, S) => A.indexOf(_) > A.indexOf(S) ? -1 : A.indexOf(_) < A.indexOf(S) ? 1 : 0);
+      if (G.length > 0)
+        for (const _ of G) {
+          const S = H[_], C = A.indexOf(_);
+          if (S == null || C < 0)
             continue;
-          const T = f.removeOp(["drawings", _], S), L = f.removeOp(["drawingsOrder", x], _);
-          p.push(T), p.push(L), w++;
+          const T = f.removeOp(["drawings", _], S), L = f.removeOp(["drawingsOrder", C], _);
+          v.push(T), v.push(L), w++;
         }
     }
     h.push({
@@ -192,13 +192,13 @@ const bt = {
       },
       len: d.length
     });
-    const y = Ke(o, g), D = f.editOp(h.serialize(), y);
-    p.push(D);
+    const O = qe(o, g), D = f.editOp(h.serialize(), O);
+    v.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 { drawingId: P } = I, H = f.insertOp(["drawings", P], I), A = f.insertOp(["drawingsOrder", p - w], P);
+      v.push(H), v.push(A);
     }
-    const O = {
+    const y = {
       id: ee.id,
       params: {
         unitId: c,
@@ -206,24 +206,24 @@ const bt = {
         textRanges: []
       }
     };
-    return O.params.actions = p.reduce((I, P) => $.compose(I, P), null), !!t.syncExecuteCommand(O.id, O.params);
+    return y.params.actions = v.reduce((I, P) => $.compose(I, P), null), !!t.syncExecuteCommand(y.id, y.params);
   }
-}, wn = {
+}, In = {
   id: "doc.command.set-drawing-arrange",
   type: q.COMMAND,
   handler: (i, e) => {
-    const t = i.get(G), n = i.get(Be);
+    const t = i.get(j), n = i.get(Ue);
     if (e == null)
       return !1;
     const { unitId: r, subUnitId: s, drawingIds: o, arrangeType: c } = e, d = { unitId: r, subUnitId: s, drawingIds: o };
     let a;
-    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)
+    if (c === Qe.forward ? a = n.getForwardDrawingsOp(d) : c === Qe.backward ? a = n.getBackwardDrawingOp(d) : c === Qe.front ? a = n.getFrontDrawingsOp(d) : c === Qe.back && (a = n.getBackDrawingsOp(d)), a == null)
       return !1;
     const { redo: l } = a;
     if (l == null)
       return !1;
     const g = [];
-    let u = Ce.deepClone(l);
+    let u = be.deepClone(l);
     u = u.slice(3), u.unshift("drawingsOrder"), g.push(u);
     const h = {
       id: ee.id,
@@ -233,14 +233,14 @@ const bt = {
         textRanges: null
       }
     };
-    return h.params.actions = g.reduce((p, v) => $.compose(p, v), null), !!t.syncExecuteCommand(h.id, h.params);
+    return h.params.actions = g.reduce((v, p) => $.compose(v, p), null), !!t.syncExecuteCommand(h.id, h.params);
   }
-}, In = {
+}, _n = {
   id: "doc.command.ungroup-doc-image",
   type: q.COMMAND,
   handler: (i, e) => {
-    i.get(G), i.get(Zt);
-    const t = i.get(Be);
+    i.get(j), i.get(Zt);
+    const t = i.get(Ue);
     if (!e) return !1;
     const n = [];
     e.forEach(({ parent: l, children: g }) => {
@@ -252,31 +252,31 @@ const bt = {
     return !1;
   }
 };
-class ht {
+class ft {
   constructor() {
-    _e(this, "_refreshDrawings$", new Tt(null));
-    _e(this, "refreshDrawings$", this._refreshDrawings$.asObservable());
+    Ie(this, "_refreshDrawings$", new Tt(null));
+    Ie(this, "refreshDrawings$", this._refreshDrawings$.asObservable());
   }
   refreshDrawings(e) {
     this._refreshDrawings$.next(e);
   }
 }
-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--)
+var Zi = Object.getOwnPropertyDescriptor, Qi = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Zi(e, t) : e, s = i.length - 1, o; s >= 0; s--)
     (o = i[s]) && (r = o(r) || r);
   return r;
-}, ge = (i, e) => (t, n) => e(t, n, i);
-let st = class extends Ue {
+}, ue = (i, e) => (t, n) => e(t, n, i);
+let rt = class extends Le {
   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: ii.map((t) => `.${t.replace("image/", "")}`).join(",")
+      accept: ri.map((t) => `.${t.replace("image/", "")}`).join(",")
     }), e = i.length;
     return e > At ? (this._messageService.show({
-      type: Wt.Error,
+      type: Ht.Error,
       content: this._localeService.t("update-status.exceedMaxCount", String(At))
     }), !1) : e === 0 ? !1 : (await this._insertFloatImages(i), !0);
   }
@@ -289,18 +289,18 @@ let st = class extends Ue {
       const s = r.message;
       let o = "";
       switch (s) {
-        case wt.ERROR_EXCEED_SIZE:
-          o = this._localeService.t("update-status.exceedMaxSize", String(ri / (1024 * 1024)));
+        case vt.ERROR_EXCEED_SIZE:
+          o = this._localeService.t("update-status.exceedMaxSize", String(si / (1024 * 1024)));
           break;
-        case wt.ERROR_IMAGE_TYPE:
+        case vt.ERROR_IMAGE_TYPE:
           o = this._localeService.t("update-status.invalidImageType");
           break;
-        case wt.ERROR_IMAGE:
+        case vt.ERROR_IMAGE:
           o = this._localeService.t("update-status.invalidImage");
           break;
       }
       this._messageService.show({
-        type: Wt.Error,
+        type: Ht.Error,
         content: o
       });
     }
@@ -310,12 +310,12 @@ let st = class extends Ue {
     for (const r of e) {
       if (r == null)
         continue;
-      const { imageId: s, imageSourceType: o, source: c, base64Cache: d } = r, { width: a, height: l, image: g } = await si(d || "");
+      const { imageId: s, imageSourceType: o, source: c, base64Cache: d } = r, { width: a, height: l, image: g } = await oi(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 p = Pt / a, w = Lt / l;
+        u = Math.min(p, w);
       }
       const h = this._getImagePosition(a * u, l * u);
       if (h == null)
@@ -324,7 +324,7 @@ let st = class extends Ue {
         unitId: t,
         subUnitId: t,
         drawingId: s,
-        drawingType: Le.DRAWING_IMAGE,
+        drawingType: Pe.DRAWING_IMAGE,
         imageSourceType: o,
         source: c,
         transform: an(h),
@@ -332,9 +332,9 @@ let st = class extends Ue {
         behindDoc: se.FALSE,
         title: "",
         description: "",
-        layoutType: F.INLINE,
+        layoutType: k.INLINE,
         // Insert inline drawing by default.
-        wrapText: qe.BOTH_SIDES,
+        wrapText: Xe.BOTH_SIDES,
         distB: 0,
         distL: 0,
         distR: 0,
@@ -342,7 +342,7 @@ let st = class extends Ue {
       };
       this._isInsertInHeaderFooter() && (f.isMultiTransform = se.TRUE, f.transforms = f.transform ? [f.transform] : null), n.push(f);
     }
-    this._commandService.executeCommand(Ct.id, {
+    this._commandService.executeCommand(xt.id, {
       unitId: t,
       drawings: n
     });
@@ -366,7 +366,7 @@ let st = class extends Ue {
         posOffset: n.left
       },
       positionV: {
-        relativeFrom: j.PARAGRAPH,
+        relativeFrom: W.PARAGRAPH,
         posOffset: 0
       },
       angle: 0
@@ -375,7 +375,7 @@ let st = class extends Ue {
   _updateOrderListener() {
     this._drawingManagerService.featurePluginOrderUpdate$.subscribe((i) => {
       const { unitId: e, subUnitId: t, drawingIds: n, arrangeType: r } = i;
-      this._commandService.executeCommand(wn.id, {
+      this._commandService.executeCommand(In.id, {
         unitId: e,
         subUnitId: t,
         drawingIds: n,
@@ -385,9 +385,9 @@ let st = class extends Ue {
   }
   _groupDrawingListener() {
     this._drawingManagerService.featurePluginGroupUpdate$.subscribe((i) => {
-      this._commandService.executeCommand(pn.id, i);
+      this._commandService.executeCommand(wn.id, i);
     }), this._drawingManagerService.featurePluginUngroupUpdate$.subscribe((i) => {
-      this._commandService.executeCommand(In.id, i);
+      this._commandService.executeCommand(_n.id, i);
     });
   }
   _getCurrentSceneAndTransformer() {
@@ -400,7 +400,7 @@ let st = class extends Ue {
   _transformDrawingListener() {
     const i = this._getCurrentSceneAndTransformer();
     if (i && i.transformer)
-      this.disposeWithMe(i.transformer.changeEnd$.pipe(ln(30)).subscribe((e) => {
+      this.disposeWithMe(i.transformer.changeEnd$.pipe(un(30)).subscribe((e) => {
         this._docSelectionManagerService.refreshSelection();
       }));
     else
@@ -412,12 +412,12 @@ let st = class extends Ue {
         var r;
         const { transformer: e, docsLeft: t, docsTop: n } = (r = this._getCurrentSceneAndTransformer()) != null ? r : {};
         if (i == null || i.length === 0)
-          this._contextService.setContextValue(rt, !1), this._docDrawingService.focusDrawing([]), e && e.resetProps({
+          this._contextService.setContextValue(it, !1), this._docDrawingService.focusDrawing([]), e && e.resetProps({
             zeroTop: 0,
             zeroLeft: 0
           });
         else {
-          this._contextService.setContextValue(rt, !0), this._docDrawingService.focusDrawing(i), this._setDrawingSelections(i);
+          this._contextService.setContextValue(it, !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,
@@ -448,7 +448,7 @@ let st = class extends Ue {
       return;
     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);
+      const a = s[d], l = ai({ unitId: t, drawingId: a.drawingId, subUnitId: t }), g = e.fuzzyMathObjects(l, !0);
       if (g.length)
         for (const u of g) {
           e.detachTransformerFrom(u);
@@ -494,43 +494,43 @@ let st = class extends Ue {
     this._docSelectionManagerService.replaceDocRanges(n);
   }
 };
-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 = {
+rt = Qi([
+  ue(1, j),
+  ue(2, Z(yt)),
+  ue(3, Q),
+  ue(4, ii),
+  ue(5, Ue),
+  ue(6, me),
+  ue(7, Qt),
+  ue(8, _i),
+  ue(9, Z(gt)),
+  ue(10, Z(xe)),
+  ue(11, Z(ft)),
+  ue(12, Si)
+], rt);
+const Sn = {
   id: "doc.command.insert-float-image",
   type: q.COMMAND,
   handler: (i) => {
     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;
+    return (r = (n = mi(we.UNIVER_DOC, e, t)) == null ? void 0 : n.with(rt).insertDocImage()) != null ? r : !1;
   }
 };
-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
+var ge = /* @__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))(ge || {});
+const Ji = {
+  inline: k.INLINE,
+  wrapSquare: k.WRAP_SQUARE,
+  wrapTopAndBottom: k.WRAP_TOP_AND_BOTTOM,
+  inFrontOfText: k.WRAP_NONE,
+  behindText: k.WRAP_NONE
 };
-function Sn(i, e, t, n, r, s, o) {
+function Dn(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 u = (f = (h = l.customBlocks) == null ? void 0 : h.find((p) => p.blockId === r)) == null ? void 0 : f.startIndex;
+  const u = (f = (h = l.customBlocks) == null ? void 0 : h.find((v) => v.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({
@@ -572,8 +572,8 @@ function Sn(i, e, t, n, r, s, o) {
         },
         len: 1
       })), n !== u) {
-        const p = Ke(s, e), v = d.editOp(c.serialize(), p);
-        a.push(v);
+        const v = qe(s, e), p = d.editOp(c.serialize(), v);
+        a.push(p);
       }
     } else {
       u > 0 && c.push({
@@ -583,8 +583,8 @@ function Sn(i, e, t, n, r, s, o) {
         t: Y.DELETE,
         len: 1
       });
-      let p = Ke(s, e), v = d.editOp(c.serialize(), p);
-      a.push(v), c.empty(), n > 0 && c.push({
+      let v = qe(s, e), p = d.editOp(c.serialize(), v);
+      a.push(p), c.empty(), n > 0 && c.push({
         t: Y.RETAIN,
         len: n
       }), c.push({
@@ -597,12 +597,12 @@ function Sn(i, e, t, n, r, s, o) {
           }]
         },
         len: 1
-      }), p = Ke(s, i), v = d.editOp(c.serialize(), p), a.push(v), o.setSegment(i), o.setSegmentPage(t);
+      }), v = qe(s, i), p = d.editOp(c.serialize(), v), a.push(p), o.setSegment(i), o.setSegmentPage(t);
     }
     return a;
   }
 }
-const Dn = {
+const On = {
   id: "doc.command.update-doc-drawing-wrapping-style",
   type: q.COMMAND,
   // eslint-disable-next-line max-lines-per-function, complexity
@@ -610,41 +610,41 @@ const Dn = {
     var E, U;
     if (e == null)
       return !1;
-    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();
+    const { drawings: t, wrappingStyle: n, unitId: r } = e, s = i.get(j), 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(), f = g.getTransformerByCreate(), { pages: p, skeHeaders: v, skeFooters: w } = a, y = $.getInstance(), D = [], { drawings: O = {} } = u.getSnapshot();
+    const h = l.getEditArea(), f = g.getTransformerByCreate(), { pages: v, skeHeaders: p, skeFooters: w } = a, O = $.getInstance(), D = [], { drawings: y = {} } = 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);
+      const { drawingId: I } = N, P = y[I].layoutType, H = Ji[n];
+      if (P !== H) {
+        const S = O.replaceOp(["drawings", I, "layoutType"], P, H);
         D.push(S);
       }
       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);
+        const S = y[I].behindDoc, C = n === "behindText" ? se.TRUE : se.FALSE;
+        if (S !== C) {
+          const T = O.replaceOp(["drawings", I, "behindDoc"], S, C);
           D.push(T);
         }
       }
       if (n === "inline")
         continue;
-      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;
+      let A = null, G = 0, _ = 0;
+      for (const S of v) {
+        const { headerId: C, footerId: T, marginTop: L, marginLeft: B, marginBottom: b, pageWidth: R, pageHeight: V } = S;
         switch (h) {
           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);
+            const F = (E = p.get(C)) == null ? void 0 : E.get(R);
+            F != null && F.skeDrawings.has(I) && (A = F.skeDrawings.get(I), G = F.marginTop, _ = B);
             break;
           }
           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);
+            const F = (U = w.get(T)) == null ? void 0 : U.get(R);
+            F != null && F.skeDrawings.has(I) && (A = F.skeDrawings.get(I), G = V - b + F.marginTop, _ = B);
             break;
           }
           case We.BODY: {
-            S.skeDrawings.has(I) && (A = S.skeDrawings.get(I), H = L, _ = B);
+            S.skeDrawings.has(I) && (A = S.skeDrawings.get(I), G = L, _ = B);
             break;
           }
         }
@@ -652,31 +652,31 @@ const Dn = {
           break;
       }
       if (A != null) {
-        const { aTop: S, aLeft: x } = A, T = O[I].docTransform.positionH;
-        let L = x;
+        const { aTop: S, aLeft: C } = A, T = y[I].docTransform.positionH;
+        let L = C;
         T.relativeFrom === J.MARGIN ? L -= _ : T.relativeFrom === J.COLUMN && (L -= A.columnLeft);
         const B = {
           relativeFrom: T.relativeFrom,
           posOffset: L
         };
         if (T.posOffset !== B.posOffset) {
-          const k = y.replaceOp(["drawings", I, "docTransform", "positionH"], T, B);
-          D.push(k);
+          const F = O.replaceOp(["drawings", I, "docTransform", "positionH"], T, B);
+          D.push(F);
         }
-        const b = O[I].docTransform.positionV;
+        const b = y[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);
+        b.relativeFrom === W.PAGE ? R += G : b.relativeFrom === W.LINE ? R -= A.lineTop : b.relativeFrom === W.PARAGRAPH && (R -= A.blockAnchorTop);
         const V = {
           relativeFrom: b.relativeFrom,
           posOffset: R
         };
         if (b.posOffset !== V.posOffset) {
-          const k = y.replaceOp(["drawings", I, "docTransform", "positionV"], b, V);
-          D.push(k);
+          const F = O.replaceOp(["drawings", I, "docTransform", "positionV"], b, V);
+          D.push(F);
         }
       }
     }
-    const C = {
+    const x = {
       id: ee.id,
       params: {
         unitId: r,
@@ -684,8 +684,8 @@ const Dn = {
         textRanges: null
       }
     };
-    C.params.actions = D.reduce((N, I) => $.compose(N, I), null);
-    const M = s.syncExecuteCommand(C.id, C.params);
+    x.params.actions = D.reduce((N, I) => $.compose(N, I), null);
+    const M = s.syncExecuteCommand(x.id, x.params);
     return f.refreshControls(), !!M;
   }
 }, yn = {
@@ -694,17 +694,17 @@ const Dn = {
   handler: (i, e) => {
     if (e == null)
       return !1;
-    const t = i.get(G), r = i.get(z).getCurrentUniverDocInstance();
+    const t = i.get(j), r = i.get(z).getCurrentUniverDocInstance();
     if (r == null)
       return !1;
     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);
+      for (const [v, p] of Object.entries(o)) {
+        const w = l[f][v];
+        if (w !== p) {
+          const O = d.replaceOp(["drawings", f, v], w, p);
+          a.push(O);
         }
       }
     }
@@ -718,21 +718,21 @@ const Dn = {
     };
     return g.params.actions = a.reduce((h, f) => $.compose(h, f), null), !!t.syncExecuteCommand(g.id, g.params);
   }
-}, On = {
+}, Tn = {
   id: "doc.command.update-doc-drawing-wrap-text",
   type: q.COMMAND,
   handler: (i, e) => {
     if (e == null)
       return !1;
-    const t = i.get(G), r = i.get(z).getCurrentUniverDocInstance();
+    const t = i.get(j), r = i.get(z).getCurrentUniverDocInstance();
     if (r == null)
       return !1;
     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 { drawingId: f } = h, v = l[f].wrapText;
+      if (v !== o) {
+        const p = d.replaceOp(["drawings", f, "wrapText"], v, o);
+        a.push(p);
       }
     }
     const g = {
@@ -745,24 +745,24 @@ const Dn = {
     };
     return g.params.actions = a.reduce((h, f) => $.compose(h, f), null), !!t.syncExecuteCommand(g.id, g.params);
   }
-}, Ye = {
+}, Ke = {
   id: "doc.command.update-drawing-doc-transform",
   type: q.COMMAND,
   handler: (i, e) => {
     if (e == null)
       return !1;
-    const t = i.get(G), n = i.get(z), s = i.get(Q).getRenderById(e.unitId), o = s == null ? void 0 : s.scene;
+    const t = i.get(j), 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 = o.getTransformerByCreate(), d = n.getCurrentUniverDocInstance();
     if (d == null)
       return !1;
     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);
+    for (const p of a) {
+      const { drawingId: w, key: O, value: D } = p, y = h[w].docTransform[O];
+      if (!be.diffValue(y, D)) {
+        const x = g.replaceOp(["drawings", w, "docTransform", O], y, D);
+        u.push(x);
       }
     }
     const f = {
@@ -774,38 +774,38 @@ const Dn = {
         debounce: !0
       }
     };
-    f.params.actions = u.reduce((v, w) => $.compose(v, w), null);
-    const p = t.syncExecuteCommand(f.id, f.params);
-    return c.refreshControls(), !!p;
+    f.params.actions = u.reduce((p, w) => $.compose(p, w), null);
+    const v = t.syncExecuteCommand(f.id, f.params);
+    return c.refreshControls(), !!v;
   }
-}, Tn = {
+}, Mn = {
   id: "doc.command.move-inline-drawing",
   type: q.COMMAND,
   handler: (i, e) => {
     var U, N;
     if (e == null)
       return !1;
-    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();
+    const t = i.get(Q), n = (U = t.getRenderById(e.unitId)) == null ? void 0 : U.with(xe), r = i.get(ft), 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 = o.getTransformerByCreate(), a = i.get(G), g = i.get(z).getCurrentUniverDocInstance();
+    const d = o.getTransformerByCreate(), a = i.get(j), g = i.get(z).getCurrentUniverDocInstance();
     if (g == null)
       return !1;
-    const { drawing: u, unitId: h, offset: f, segmentId: p, segmentPage: v, needRefreshDrawings: w } = e;
+    const { drawing: u, unitId: h, offset: f, segmentId: v, segmentPage: p, needRefreshDrawings: w } = e;
     if (w)
       return r.refreshDrawings(c), d.refreshControls(), !0;
-    const y = [], { drawingId: D } = u, O = (N = n.getSegment()) != null ? N : "", C = Sn(
-      p,
-      O,
+    const O = [], { drawingId: D } = u, y = (N = n.getSegment()) != null ? N : "", x = Dn(
       v,
+      y,
+      p,
       f,
       D,
       g,
       n
     );
-    if (C == null || C.length === 0)
+    if (x == null || x.length === 0)
       return r.refreshDrawings(c), d.refreshControls(), !1;
-    y.push(...C);
+    O.push(...x);
     const M = {
       id: ee.id,
       params: {
@@ -814,28 +814,28 @@ const Dn = {
         textRanges: null
       }
     };
-    M.params.actions = y.reduce((I, P) => $.compose(I, P), null);
+    M.params.actions = O.reduce((I, P) => $.compose(I, P), null);
     const E = a.syncExecuteCommand(M.id, M.params);
     return d.refreshControls(), !!E;
   }
-}, Mn = {
+}, bn = {
   id: "doc.command.transform-non-inline-drawing",
   type: q.COMMAND,
   // eslint-disable-next-line max-lines-per-function
   handler: (i, e) => {
-    var A, H;
+    var A, G;
     if (e == null)
       return !1;
     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 o = s.getTransformerByCreate(), c = i.get(G), a = i.get(z).getCurrentUniverDocInstance();
+    const o = s.getTransformerByCreate(), c = i.get(j), a = i.get(z).getCurrentUniverDocInstance();
     if (a == null)
       return !1;
-    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(
+    const { drawing: l, unitId: g, offset: u, docTransform: h, segmentId: f, segmentPage: v } = e, p = [], { drawingId: w } = l, O = (G = n.getSegment()) != null ? G : "", D = Dn(
       f,
-      y,
-      p,
+      O,
+      v,
       u,
       w,
       a,
@@ -843,23 +843,23 @@ const Dn = {
     );
     if (D == null)
       return !1;
-    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(_);
+    D.length > 0 && p.push(...D);
+    const y = $.getInstance(), { drawings: x = {} } = a.getSnapshot(), M = x[w].docTransform, { positionH: E, positionV: U, size: N, angle: I } = M;
+    if (!be.diffValue(E, h.positionH)) {
+      const _ = y.replaceOp(["drawings", w, "docTransform", "positionH"], E, h.positionH);
+      p.push(_);
     }
-    if (!Ce.diffValue(U, h.positionV)) {
-      const _ = O.replaceOp(["drawings", w, "docTransform", "positionV"], U, h.positionV);
-      v.push(_);
+    if (!be.diffValue(U, h.positionV)) {
+      const _ = y.replaceOp(["drawings", w, "docTransform", "positionV"], U, h.positionV);
+      p.push(_);
     }
-    if (!Ce.diffValue(N, h.size)) {
-      const _ = O.replaceOp(["drawings", w, "docTransform", "size"], N, h.size);
-      v.push(_);
+    if (!be.diffValue(N, h.size)) {
+      const _ = y.replaceOp(["drawings", w, "docTransform", "size"], N, h.size);
+      p.push(_);
     }
-    if (!Ce.diffValue(I, h.angle)) {
-      const _ = O.replaceOp(["drawings", w, "docTransform", "angle"], I, h.angle);
-      v.push(_);
+    if (!be.diffValue(I, h.angle)) {
+      const _ = y.replaceOp(["drawings", w, "docTransform", "angle"], I, h.angle);
+      p.push(_);
     }
     const P = {
       id: ee.id,
@@ -870,42 +870,42 @@ const Dn = {
         debounce: !0
       }
     };
-    P.params.actions = v.reduce((_, S) => $.compose(_, S), null);
-    const W = c.syncExecuteCommand(P.id, P.params);
-    return o.refreshControls(), !!W;
+    P.params.actions = p.reduce((_, S) => $.compose(_, S), null);
+    const H = c.syncExecuteCommand(P.id, P.params);
+    return o.refreshControls(), !!H;
   }
-}, Ze = {
+}, Ye = {
   id: "doc.command.move-drawing",
   type: q.COMMAND,
   handler: (i, e) => {
-    const t = i.get(G), n = i.get(Be), r = i.get(z), s = i.get(Q), { direction: o } = e, c = n.getFocusDrawings();
+    const t = i.get(j), n = i.get(Ue), 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 = s.getRenderById(d), l = a == null ? void 0 : a.scene;
     if (l == null)
       return !1;
-    const g = l.getTransformerByCreate(), u = r.getUniverDocInstance(d), h = c.map((p) => {
+    const g = l.getTransformerByCreate(), u = r.getUniverDocInstance(d), h = c.map((v) => {
       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)
+      const { drawingId: p } = v, w = (M = u == null ? void 0 : u.getSnapshot().drawings) == null ? void 0 : M[p];
+      if (w == null || w.layoutType === k.INLINE)
         return null;
-      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
+      const { positionH: O, positionV: D } = w.docTransform, y = { ...O }, x = { ...D };
+      return o === fe.UP ? x.posOffset = ((E = x.posOffset) != null ? E : 0) - 2 : o === fe.DOWN ? x.posOffset = ((U = x.posOffset) != null ? U : 0) + 2 : o === fe.LEFT ? y.posOffset = ((N = y.posOffset) != null ? N : 0) - 2 : o === fe.RIGHT && (y.posOffset = ((I = y.posOffset) != null ? I : 0) + 2), {
+        drawingId: p,
+        key: o === fe.UP || o === fe.DOWN ? "positionV" : "positionH",
+        value: o === fe.UP || o === fe.DOWN ? x : y
       };
-    }).filter((p) => p != null);
+    }).filter((v) => v != null);
     if (h.length === 0)
       return !1;
-    const f = t.syncExecuteCommand(Ye.id, {
+    const f = t.syncExecuteCommand(Ke.id, {
       unitId: d,
       subUnitId: d,
       drawings: h
     });
     return g.refreshControls(), !!f;
   }
-}, Ji = {
+}, er = {
   id: "doc.operation.clear-drawing-transformer",
   type: q.MUTATION,
   handler: (i, e) => {
@@ -915,16 +915,16 @@ const Dn = {
       (s = (r = t.getRenderById(n)) == null ? void 0 : r.scene.getTransformer()) == null || s.debounceRefreshControls();
     }), !0;
   }
-}, bn = "COMPONENT_DOC_DRAWING_PANEL", Cn = {
+}, xn = "COMPONENT_DOC_DRAWING_PANEL", Cn = {
   id: "sidebar.operation.doc-image",
   type: q.COMMAND,
   handler: async (i, e) => {
-    const t = i.get(Si), n = i.get(ft), r = i.get(ve);
+    const t = i.get(Di), n = i.get(gt), r = i.get(me);
     switch (e.value) {
       case "open":
         t.open({
           header: { title: n.t("docImage.panel.title") },
-          children: { label: bn },
+          children: { label: xn },
           onClose: () => {
             r.focusDrawing(null);
           },
@@ -938,15 +938,15 @@ const Dn = {
     }
     return !0;
   }
-}, xn = {
+}, Nn = {
   id: "doc.operation.edit-doc-image",
   type: q.OPERATION,
   handler: (i, e) => {
-    const t = i.get(ve), n = i.get(G);
+    const t = i.get(me), n = i.get(j);
     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];
+}, qt = -1e3, Kt = 1e3, tr = (i) => {
+  const e = ve(j), t = ve(gt), n = ve(me), r = ve(Q), s = ve(z), { drawings: o } = i, c = o[0];
   if (c == null)
     return;
   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;
@@ -961,31 +961,31 @@ const Dn = {
   }, {
     label: t.t("image-position.margin"),
     value: String(J.MARGIN)
-  }], p = [{
+  }], v = [{
     label: t.t("image-position.line"),
-    value: String(j.LINE),
+    value: String(W.LINE),
     disabled: l === pt.MODERN
   }, {
     label: t.t("image-position.page"),
-    value: String(j.PAGE),
+    value: String(W.PAGE),
     disabled: l === pt.MODERN
   }, {
     label: t.t("image-position.margin"),
-    value: String(j.MARGIN),
+    value: String(W.MARGIN),
     disabled: l === pt.MODERN
   }, {
     label: t.t("image-position.paragraph"),
-    value: String(j.PARAGRAPH)
-  }], [v, w] = re(!0), [y, D] = re({
+    value: String(W.PARAGRAPH)
+  }], [p, w] = re(!0), [O, D] = re({
     relativeFrom: J.PAGE,
     posOffset: 0
-  }), [O, C] = re({
-    relativeFrom: j.PAGE,
+  }), [y, x] = re({
+    relativeFrom: W.PAGE,
     posOffset: 0
   }), [M, E] = re(!0), [U, N] = re(!0);
-  function I(S, x) {
+  function I(S, C) {
     var b;
-    S === "positionH" ? D(x) : C(x);
+    S === "positionH" ? D(C) : x(C);
     const T = n.getFocusDrawings();
     if (T.length === 0)
       return;
@@ -994,75 +994,75 @@ const Dn = {
       subUnitId: R.subUnitId,
       drawingId: R.drawingId
     }));
-    e.executeCommand(Ye.id, {
+    e.executeCommand(Ke.id, {
       unitId: T[0].unitId,
       subUnitId: T[0].unitId,
       drawings: L.map((R) => ({
         drawingId: R.drawingId,
         key: S,
-        value: x
+        value: C
       }))
     });
     const B = (b = r.getRenderById(d)) == null ? void 0 : b.with(xe);
     B && B.blur(), h.refreshControls();
   }
   function P(S) {
-    var ie, Se, De;
-    const x = y.relativeFrom, T = y.posOffset, L = Number(S);
-    if (x === L)
+    var ie, _e, Se;
+    const C = O.relativeFrom, T = O.posOffset, L = Number(S);
+    if (C === L)
       return;
     const B = n.getFocusDrawings();
     if (B.length === 0)
       return;
     const b = B[0].drawingId, R = B[0].unitId;
-    let V = null, k = 0;
+    let V = null, F = 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: 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;
+    const { pages: Be, skeHeaders: Ce, skeFooters: Ge } = oe;
+    for (const ce of Be) {
+      const { marginLeft: Oe, skeDrawings: ye, headerId: Ne, footerId: Ee, pageWidth: Te } = ce;
+      if (ye.has(b)) {
+        V = ye.get(b), F = Oe;
         break;
       }
-      const de = (Se = Ne.get(Ee)) == null ? void 0 : Se.get(Me);
+      const de = (_e = Ce.get(Ne)) == null ? void 0 : _e.get(Te);
       if (de != null && de.skeDrawings.has(b)) {
-        V = de == null ? void 0 : de.skeDrawings.get(b), k = Oe;
+        V = de == null ? void 0 : de.skeDrawings.get(b), F = Oe;
         break;
       }
-      const le = (De = Ge.get(Re)) == null ? void 0 : De.get(Me);
+      const le = (Se = Ge.get(Ee)) == null ? void 0 : Se.get(Te);
       if (le != null && le.skeDrawings.has(b)) {
-        V = le == null ? void 0 : le.skeDrawings.get(b), k = Oe;
+        V = le == null ? void 0 : le.skeDrawings.get(b), F = Oe;
         break;
       }
     }
     if (V == null)
       return;
     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;
+    C === J.COLUMN ? ae -= V.columnLeft : C === J.MARGIN && (ae -= F), L === J.COLUMN ? ae += V.columnLeft : L === J.MARGIN ? ae += F : J.PAGE;
     const ne = {
       relativeFrom: L,
       posOffset: (T != null ? T : 0) - ae
     };
     I("positionH", ne);
   }
-  function W(S) {
-    var Te, Ee, Re, Me, de, le;
-    const x = O.relativeFrom, T = O.posOffset, L = Number(S);
-    if (x === L)
+  function H(S) {
+    var ye, Ne, Ee, Te, de, le;
+    const C = y.relativeFrom, T = y.posOffset, L = Number(S);
+    if (C === L)
       return;
     const B = n.getFocusDrawings();
     if (B.length === 0)
       return;
-    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)
+    const { drawingId: b, unitId: R } = B[0], V = s.getUniverDocInstance(R), F = (ye = r.getRenderById(R)) == null ? void 0 : ye.with(te).getSkeleton(), K = (Ne = r.getRenderById(R)) == null ? void 0 : Ne.with(xe), oe = K == null ? void 0 : K.getSegment(), Be = K == null ? void 0 : K.getSegmentPage(), Ce = (Te = (Ee = V == null ? void 0 : V.getSelfOrHeaderFooterModel(oe).getBody()) == null ? void 0 : Ee.customBlocks) == null ? void 0 : Te.find((Re) => Re.blockId === b);
+    if (Ce == null || F == null || K == null)
       return;
-    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)
+    const { startIndex: Ge } = Ce, ae = F.findNodeByCharIndex(Ge, oe, Be), ne = (de = ae == null ? void 0 : ae.parent) == null ? void 0 : de.parent, ie = ne == null ? void 0 : ne.parent, _e = ie == null ? void 0 : ie.lines.find((Re) => Re.paragraphIndex === (ne == null ? void 0 : ne.paragraphIndex) && Re.paragraphStart), Se = (le = ie == null ? void 0 : ie.parent) == null ? void 0 : le.parent;
+    if (ae == null || ne == null || _e == null || ie == null || Se == null)
       return;
     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);
+    C === W.PARAGRAPH ? ce -= _e.top : C === W.LINE ? ce -= ne.top : C === W.PAGE && (ce += Se.marginTop), L === W.PARAGRAPH ? ce += _e.top : L === W.LINE ? ce += ne.top : L === W.PAGE && (ce -= Se.marginTop);
     const Oe = {
       relativeFrom: L,
       posOffset: (T != null ? T : 0) - ce
@@ -1071,98 +1071,88 @@ const Dn = {
   }
   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];
+    const C = a == null ? void 0 : a.getSnapshot(), T = (R = C == null ? void 0 : C.drawings) == null ? void 0 : R[S.drawingId];
     if (T == null)
       return;
     const { layoutType: L } = T, {
       positionH: B,
       positionV: b
     } = T.docTransform;
-    D(B), C(b), w(L === F.INLINE), E(b.relativeFrom === j.PARAGRAPH || b.relativeFrom === j.LINE);
+    D(B), x(b), w(L === k.INLINE), E(b.relativeFrom === W.PARAGRAPH || b.relativeFrom === W.LINE);
   }
-  function H() {
+  function G() {
     const S = n.getFocusDrawings();
     S.length !== 0 && A(S[0]);
   }
   function _(S) {
-    E(S), W(String(S ? j.PARAGRAPH : j.PAGE));
+    E(S), H(String(S ? W.PARAGRAPH : W.PAGE));
   }
   return Mt(() => {
-    H();
+    G();
     const S = n.focus$.subscribe((T) => {
       if (T.length === 0) {
         N(!1);
         return;
       }
       N(!0), A(T[0]);
-    }), x = e.onCommandExecuted(async (T) => {
-      T.id === ee.id && H();
+    }), C = e.onCommandExecuted(async (T) => {
+      T.id === ee.id && G();
     });
     return () => {
-      S.unsubscribe(), x.dispose();
+      S.unsubscribe(), C.dispose();
     };
   }, []), /* @__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" },
+      className: _t("univer-relative univer-mt-5 univer-w-full", ln, {
+        "univer-hidden": !U
+      }),
       children: [
+        /* @__PURE__ */ m("div", { className: "univer-relative univer-mt-2.5 univer-flex univer-h-full", 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__ */ 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-gray-400", children: /* @__PURE__ */ m("div", { children: t.t("image-position.title") }) })
-          }
-        ),
-        /* @__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.horizontal") }) })
+            className: "univer-relative univer-mt-2.5 univer-flex univer-h-full",
+            children: /* @__PURE__ */ m(
+              "div",
+              {
+                className: `
+                      univer-flex univer-items-center univer-gap-1 univer-text-gray-900
+                      dark:univer-text-white
+                    `,
+                children: /* @__PURE__ */ m("div", { children: t.t("image-position.horizontal") })
+              }
+            )
           }
         ),
         /* @__PURE__ */ X(
           "div",
           {
-            className: `
-                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
-                `,
+            className: "univer-relative univer-mt-2.5 univer-flex univer-h-full",
             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
-                            `,
+                    className: "univer-relative univer-mt-2.5 univer-flex univer-h-full",
                     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
-                            `,
+                    className: "univer-relative univer-mt-2.5 univer-flex univer-h-full",
                     children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
-                      je,
+                      ke,
                       {
                         min: qt,
                         max: Kt,
                         precision: 1,
-                        disabled: v,
-                        value: y.posOffset,
+                        disabled: p,
+                        value: O.posOffset,
                         onChange: (S) => {
                           I("positionH", {
-                            relativeFrom: y.relativeFrom,
+                            relativeFrom: O.relativeFrom,
                             posOffset: S
                           });
                         }
@@ -1172,28 +1162,16 @@ const Dn = {
                 )
               ] }) }),
               /* @__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", 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: 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
-                            `,
+                    className: "univer-relative univer-mt-2.5 univer-flex univer-h-full",
                     children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
-                      Ht,
+                      Gt,
                       {
-                        value: String(y.relativeFrom),
-                        disabled: v,
+                        value: String(O.relativeFrom),
+                        disabled: p,
                         options: f,
                         onChange: P
                       }
@@ -1204,122 +1182,89 @@ const Dn = {
             ]
           }
         ),
-        /* @__PURE__ */ m(
+        /* @__PURE__ */ m("div", { className: "univer-relative univer-mt-2.5 univer-flex univer-h-full", 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 univer-text-black", children: /* @__PURE__ */ m("div", { children: t.t("image-position.vertical") }) })
+                      univer-flex univer-items-center univer-gap-1 univer-text-gray-900
+                      dark:univer-text-white
+                    `,
+            children: /* @__PURE__ */ m("div", { children: t.t("image-position.vertical") })
           }
-        ),
-        /* @__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",
+        ) }),
+        /* @__PURE__ */ X("div", { className: "univer-relative univer-mt-2.5 univer-flex univer-h-full", 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", 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",
+                children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
+                  ke,
                   {
-                    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") })
+                    min: qt,
+                    max: Kt,
+                    precision: 1,
+                    disabled: p,
+                    value: y.posOffset,
+                    onChange: (S) => {
+                      I("positionV", {
+                        relativeFrom: y.relativeFrom,
+                        posOffset: S
+                      });
+                    }
                   }
-                ),
-                /* @__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",
+                ) })
+              }
+            )
+          ] }) }),
+          /* @__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", 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",
+                children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
+                  Gt,
                   {
-                    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
-                      }
-                    ) })
+                    disabled: p,
+                    value: String(y.relativeFrom),
+                    options: v,
+                    onChange: H
                   }
-                )
-              ] }) })
-            ]
-          }
-        ),
-        /* @__PURE__ */ m(
+                ) })
+              }
+            )
+          ] }) })
+        ] }),
+        /* @__PURE__ */ m("div", { className: "univer-relative univer-mt-2.5 univer-flex univer-h-full", 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 univer-text-black", children: /* @__PURE__ */ m("div", { children: t.t("image-position.options") }) })
+                      univer-flex univer-items-center univer-gap-1 univer-text-gray-900
+                      dark:univer-text-white
+                    `,
+            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") }) })
+            className: "univer-relative univer-mb-12 univer-mt-2.5 univer-flex univer-h-full",
+            children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(Bi, { disabled: p, 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];
+}, Je = 0, et = 100, nr = (i) => {
+  const e = ve(j), t = ve(gt), n = ve(me), r = ve(Q), s = ve(z), { drawings: o } = i, c = o[0];
   if (c == null)
     return null;
   const { unitId: d } = c, a = s.getUniverDocInstance(d), l = r.getRenderById(d);
   if ((l == null ? void 0 : l.scene) == null)
     return null;
-  const [u, h] = re(!0), [f, p] = re(!0), [v, w] = re(!0), [y, D] = re(fe.INLINE), [O, C] = re(""), [M, E] = re({
+  const [u, h] = re(!0), [f, v] = re(!0), [p, w] = re(!0), [O, D] = re(ge.INLINE), [y, x] = re(""), [M, E] = re({
     distT: 0,
     distL: 0,
     distB: 0,
@@ -1330,40 +1275,40 @@ const Dn = {
     const S = n.getFocusDrawings();
     if (S.length === 0)
       return;
-    const { unitId: x, subUnitId: T } = S[0], L = S.map(({ unitId: B, subUnitId: b, drawingId: R }) => ({
+    const { unitId: C, subUnitId: T } = S[0], L = S.map(({ unitId: B, subUnitId: b, drawingId: R }) => ({
       unitId: B,
       subUnitId: b,
       drawingId: R
     }));
-    e.executeCommand(Dn.id, {
-      unitId: x,
+    e.executeCommand(On.id, {
+      unitId: C,
       subUnitId: T,
       drawings: L,
       wrappingStyle: _
     });
   }
   function P(_) {
-    C(_);
+    x(_);
     const S = n.getFocusDrawings();
     if (S.length === 0)
       return;
-    const x = S.map((T) => ({
+    const C = S.map((T) => ({
       unitId: T.unitId,
       subUnitId: T.subUnitId,
       drawingId: T.drawingId
     }));
-    e.executeCommand(On.id, {
+    e.executeCommand(Tn.id, {
       unitId: S[0].unitId,
       subUnitId: S[0].unitId,
-      drawings: x,
+      drawings: C,
       wrapText: _
     });
   }
-  function W(_, S) {
+  function H(_, S) {
     if (_ == null)
       return;
-    const x = { ...M, [S]: _ };
-    E(x);
+    const C = { ...M, [S]: _ };
+    E(C);
     const T = n.getFocusDrawings();
     if (T.length === 0)
       return;
@@ -1383,39 +1328,39 @@ const Dn = {
   }
   function A() {
     const _ = n.getFocusDrawings();
-    _.length !== 0 && H(_[0]);
+    _.length !== 0 && G(_[0]);
   }
-  function H(_) {
+  function G(_) {
     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: x = 0,
+      distT: C = 0,
       distL: T = 0,
       distB: L = 0,
       distR: B = 0,
-      layoutType: b = F.INLINE,
+      layoutType: b = k.INLINE,
       behindDoc: R = se.FALSE,
-      wrapText: V = qe.BOTH_SIDES
+      wrapText: V = Xe.BOTH_SIDES
     } = S;
     if (E({
-      distT: x,
+      distT: C,
       distL: T,
       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);
+    }), x(V), h(b !== k.WRAP_SQUARE), b === k.WRAP_NONE || b === k.INLINE ? v(!0) : v(!1), b === k.WRAP_NONE || b === k.INLINE || b === k.WRAP_TOP_AND_BOTTOM ? w(!0) : w(!1), b === k.WRAP_NONE)
+      R === se.TRUE ? D(ge.BEHIND_TEXT) : D(ge.IN_FRONT_OF_TEXT);
     else
       switch (b) {
-        case F.INLINE:
-          D(fe.INLINE);
+        case k.INLINE:
+          D(ge.INLINE);
           break;
-        case F.WRAP_SQUARE:
-          D(fe.WRAP_SQUARE);
+        case k.WRAP_SQUARE:
+          D(ge.WRAP_SQUARE);
           break;
-        case F.WRAP_TOP_AND_BOTTOM:
-          D(fe.WRAP_TOP_AND_BOTTOM);
+        case k.WRAP_TOP_AND_BOTTOM:
+          D(ge.WRAP_TOP_AND_BOTTOM);
           break;
         default:
           throw new Error(`Unsupported layout type: ${b}`);
@@ -1423,14 +1368,14 @@ const Dn = {
   }
   return Mt(() => {
     A();
-    const _ = n.focus$.subscribe((x) => {
-      if (x.length === 0) {
+    const _ = n.focus$.subscribe((C) => {
+      if (C.length === 0) {
         N(!1);
         return;
       }
-      N(!0), H(x[0]);
-    }), S = e.onCommandExecuted(async (x) => {
-      x.id === ee.id && A();
+      N(!0), G(C[0]);
+    }), S = e.onCommandExecuted(async (C) => {
+      C.id === ee.id && A();
     });
     return () => {
       _.unsubscribe(), S.dispose();
@@ -1438,149 +1383,110 @@ const Dn = {
   }, []), /* @__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" },
+      className: _t("univer-relative univer-mt-5 univer-w-full", ln, {
+        "univer-hidden": !U
+      }),
       children: [
-        /* @__PURE__ */ m(
+        /* @__PURE__ */ m("div", { className: "univer-relative univer-mt-2.5 univer-flex univer-h-full", 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: ue("univer-flex univer-items-center univer-gap-1 univer-text-gray-600"), children: /* @__PURE__ */ m("div", { children: t.t("image-text-wrap.title") }) })
+                      univer-flex univer-items-center univer-gap-1 univer-text-gray-600
+                      dark:univer-text-gray-200
+                    `,
+            children: /* @__PURE__ */ m("div", { children: t.t("image-text-wrap.title") })
           }
-        ),
-        /* @__PURE__ */ m(
+        ) }),
+        /* @__PURE__ */ m("div", { className: "univer-relative univer-mt-2.5 univer-flex univer-h-full", 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: ue("univer-flex univer-items-center univer-gap-1 univer-text-black"), children: /* @__PURE__ */ m("div", { children: t.t("image-text-wrap.wrappingStyle") }) })
+                      univer-flex univer-items-center univer-gap-1 univer-text-gray-900
+                      dark:univer-text-white
+                    `,
+            children: /* @__PURE__ */ m("div", { children: t.t("image-text-wrap.wrappingStyle") })
           }
-        ),
-        /* @__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, { 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__ */ m(
+        ) }),
+        /* @__PURE__ */ m("div", { className: "univer-relative univer-mt-2.5 univer-flex univer-h-full", children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ X(jt, { value: O, onChange: I, direction: "vertical", children: [
+          /* @__PURE__ */ m(Me, { value: ge.INLINE, children: t.t("image-text-wrap.inline") }),
+          /* @__PURE__ */ m(Me, { value: ge.WRAP_SQUARE, children: t.t("image-text-wrap.square") }),
+          /* @__PURE__ */ m(Me, { value: ge.WRAP_TOP_AND_BOTTOM, children: t.t("image-text-wrap.topAndBottom") }),
+          /* @__PURE__ */ m(Me, { value: ge.BEHIND_TEXT, children: t.t("image-text-wrap.behindText") }),
+          /* @__PURE__ */ m(Me, { value: ge.IN_FRONT_OF_TEXT, children: t.t("image-text-wrap.inFrontText") })
+        ] }) }) }),
+        /* @__PURE__ */ m("div", { className: "univer-relative univer-mt-2.5 univer-flex univer-h-full", 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: ue("univer-flex univer-items-center univer-gap-1 univer-text-black"), children: /* @__PURE__ */ m("div", { children: t.t("image-text-wrap.wrapText") }) })
+                      univer-flex univer-items-center univer-gap-1 univer-text-gray-900
+                      dark:univer-text-white
+                    `,
+            children: /* @__PURE__ */ m("div", { children: t.t("image-text-wrap.wrapText") })
           }
-        ),
+        ) }),
         /* @__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") })
+            className: "univer-relative univer-mt-2.5 univer-flex univer-h-full",
+            children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ X(jt, { disabled: u, value: y, onChange: P, direction: "horizontal", children: [
+              /* @__PURE__ */ m(Me, { value: Xe.BOTH_SIDES, children: t.t("image-text-wrap.bothSide") }),
+              /* @__PURE__ */ m(Me, { value: Xe.LEFT, children: t.t("image-text-wrap.leftOnly") }),
+              /* @__PURE__ */ m(Me, { value: Xe.RIGHT, children: t.t("image-text-wrap.rightOnly") })
             ] }) })
           }
         ),
-        /* @__PURE__ */ m(
+        /* @__PURE__ */ m("div", { className: "univer-relative univer-mt-2.5 univer-flex univer-h-full", 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: ue("univer-flex univer-items-center univer-gap-1 univer-text-black"), children: /* @__PURE__ */ m("div", { children: t.t("image-text-wrap.distanceFromText") }) })
+                      univer-flex univer-items-center univer-gap-1 univer-text-gray-900
+                      dark:univer-text-white
+                    `,
+            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
-                `,
+            className: "univer-relative univer-mt-2.5 univer-flex univer-h-full",
             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",
+              /* @__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", 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", children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
+                  ke,
                   {
-                    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");
-                        }
-                      }
-                    ) })
+                    min: Je,
+                    max: et,
+                    disabled: f,
+                    precision: 1,
+                    value: M.distT,
+                    onChange: (_) => {
+                      H(_, "distT");
+                    }
                   }
-                )
+                ) }) })
               ] }) }),
-              /* @__PURE__ */ m("div", { className: ue("univer-flex univer-items-center univer-gap-1"), children: /* @__PURE__ */ X("label", { children: [
+              /* @__PURE__ */ m("div", { className: _t("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
-                            `,
+                    className: "univer-relative univer-mt-2.5 univer-flex univer-h-full",
                     children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: t.t("image-text-wrap.left") })
                   }
                 ),
-                /* @__PURE__ */ m(
-                  "div",
+                /* @__PURE__ */ m("div", { className: "univer-relative univer-mt-2.5 univer-flex univer-h-full", children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
+                  ke,
                   {
-                    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");
-                        }
-                      }
-                    ) })
+                    min: Je,
+                    max: et,
+                    disabled: p,
+                    precision: 1,
+                    value: M.distL,
+                    onChange: (_) => {
+                      H(_, "distL");
+                    }
                   }
-                )
+                ) }) })
               ] }) })
             ]
           }
@@ -1588,77 +1494,39 @@ const Dn = {
         /* @__PURE__ */ X(
           "div",
           {
-            className: `
-                  univer-relative univer-mt-2.5 univer-flex univer-h-full univer-items-start univer-justify-start
-                `,
+            className: "univer-relative univer-mt-2.5 univer-flex univer-h-full",
             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",
+              /* @__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", 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", children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
+                  ke,
                   {
-                    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");
-                        }
-                      }
-                    ) })
+                    min: Je,
+                    max: et,
+                    disabled: f,
+                    precision: 1,
+                    value: M.distB,
+                    onChange: (_) => {
+                      H(_, "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",
+              /* @__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", 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", children: /* @__PURE__ */ m("div", { className: "univer-flex univer-items-center univer-gap-1", children: /* @__PURE__ */ m(
+                  ke,
                   {
-                    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");
-                        }
-                      }
-                    ) })
+                    min: Je,
+                    max: et,
+                    disabled: p,
+                    precision: 1,
+                    value: M.distR,
+                    onChange: (_) => {
+                      H(_, "distR");
+                    }
                   }
-                )
+                ) }) })
               ] }) })
             ]
           }
@@ -1666,8 +1534,8 @@ const Dn = {
       ]
     }
   );
-}, nr = () => {
-  const i = we(ve), e = i.getFocusDrawings(), [t, n] = re(e);
+}, ir = () => {
+  const i = ve(me), e = i.getFocusDrawings(), [t, n] = re(e);
   return Mt(() => {
     const r = i.focus$.subscribe((s) => {
       n(s);
@@ -1676,13 +1544,13 @@ const Dn = {
       r.unsubscribe();
     };
   }, []), !!(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 })
+    /* @__PURE__ */ m(di, { drawings: t, hasAlign: !1, hasCropper: !1, hasGroup: !1, hasTransform: !1 }),
+    /* @__PURE__ */ m(nr, { drawings: t }),
+    /* @__PURE__ */ m(tr, { drawings: 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) => {
+}, En = "addition-and-subtraction-single", Rn = "doc.menu.image", An = Sn.id, rr = (i) => {
+  const e = i.get(yt), t = i.get(z);
+  return new Wi((n) => {
     const r = e.textSelection$.subscribe(() => {
       var o;
       const s = e.getActiveTextRange();
@@ -1704,133 +1572,133 @@ const Dn = {
     return () => r.unsubscribe();
   });
 };
-function rr(i) {
+function sr(i) {
   return {
-    id: En,
+    id: Rn,
     type: sn.SUBITEMS,
-    icon: Nn,
+    icon: En,
     tooltip: "docImage.title",
-    disabled$: ir(i),
-    hidden$: rn(i, Ie.UNIVER_DOC, void 0, yt)
+    disabled$: rr(i),
+    hidden$: rn(i, we.UNIVER_DOC, void 0, Ot)
   };
 }
-function sr(i) {
+function or(i) {
   return {
-    id: Rn,
+    id: An,
     title: "docImage.upload.float",
     type: sn.BUTTON,
-    hidden$: rn(i, Ie.UNIVER_DOC, void 0, yt)
+    hidden$: rn(i, we.UNIVER_DOC, void 0, Ot)
   };
 }
-const or = {
-  [Di.LAYOUT]: {
-    [En]: {
+const ar = {
+  [Oi.LAYOUT]: {
+    [Rn]: {
       order: 0,
-      menuItemFactory: rr,
-      [Rn]: {
+      menuItemFactory: sr,
+      [An]: {
         order: 0,
-        menuItemFactory: sr
+        menuItemFactory: or
       }
     }
   }
 };
-function Qe(i) {
-  return i.getContextValue(Hn) && i.getContextValue(rt);
+function Ze(i) {
+  return i.getContextValue(jn) && i.getContextValue(it);
 }
-const ar = {
-  id: Ze.id,
+const cr = {
+  id: Ye.id,
   description: "shortcut.drawing-move-down",
   group: "4_drawing-view",
   binding: He.ARROW_DOWN,
   priority: 100,
-  preconditions: Qe,
+  preconditions: Ze,
   staticParameters: {
-    direction: he.DOWN
+    direction: fe.DOWN
   }
-}, cr = {
-  id: Ze.id,
+}, dr = {
+  id: Ye.id,
   description: "shortcut.drawing-move-up",
   group: "4_drawing-view",
   binding: He.ARROW_UP,
   priority: 100,
-  preconditions: Qe,
+  preconditions: Ze,
   staticParameters: {
-    direction: he.UP
+    direction: fe.UP
   }
-}, dr = {
-  id: Ze.id,
+}, lr = {
+  id: Ye.id,
   description: "shortcut.drawing-move-left",
   group: "4_drawing-view",
   binding: He.ARROW_LEFT,
   priority: 100,
-  preconditions: Qe,
+  preconditions: Ze,
   staticParameters: {
-    direction: he.LEFT
+    direction: fe.LEFT
   }
-}, lr = {
-  id: Ze.id,
+}, ur = {
+  id: Ye.id,
   description: "shortcut.drawing-move-right",
   group: "4_drawing-view",
   binding: He.ARROW_RIGHT,
   priority: 100,
-  preconditions: Qe,
+  preconditions: Ze,
   staticParameters: {
-    direction: he.RIGHT
+    direction: fe.RIGHT
   }
-}, ur = {
+}, gr = {
   id: vn.id,
   description: "shortcut.drawing-delete",
   group: "4_drawing-view",
   // when focusing on any other input tag do not trigger this shortcut
-  preconditions: Qe,
+  preconditions: Ze,
   binding: He.DELETE,
   mac: He.BACKSPACE
 };
-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--)
+var fr = Object.getOwnPropertyDescriptor, hr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? fr(e, t) : e, s = i.length - 1, o; s >= 0; s--)
     (o = i[s]) && (r = o(r) || r);
   return r;
-}, nt = (i, e) => (t, n) => e(t, n, i);
-let ot = class extends Ue {
+}, tt = (i, e) => (t, n) => e(t, n, i);
+let st = class extends Le {
   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(Nn, mn)), this.disposeWithMe(i.register(bn, nr));
+    this.disposeWithMe(i.register(En, pn)), this.disposeWithMe(i.register(xn, ir));
   }
   _initMenus() {
-    this._menuManagerService.mergeMenu(or);
+    this._menuManagerService.mergeMenu(ar);
   }
   _initCommands() {
     [
-      _n,
-      Ct,
-      Dn,
-      yn,
+      Sn,
+      xt,
       On,
-      Ye,
+      yn,
       Tn,
+      Ke,
       Mn,
+      bn,
       bt,
       Cn,
-      Ji,
-      xn,
-      pn,
-      In,
-      Ze,
+      er,
+      Nn,
+      wn,
+      _n,
+      Ye,
       vn,
-      wn
+      In
     ].forEach((i) => this.disposeWithMe(this._commandService.registerCommand(i)));
   }
   _initShortcuts() {
     [
       // sheet drawing shortcuts
-      ar,
       cr,
       dr,
       lr,
-      ur
+      ur,
+      gr
     ].forEach((i) => {
       this.disposeWithMe(this._shortcutService.registerShortcut(i));
     });
@@ -1839,17 +1707,17 @@ let ot = class extends Ue {
     this._initCommands(), this._initCustomComponents(), this._initMenus(), this._initShortcuts();
   }
 };
-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--)
+st = hr([
+  tt(0, Z(on)),
+  tt(1, yi),
+  tt(2, j),
+  tt(3, Ti)
+], st);
+var mr = Object.getOwnPropertyDescriptor, pr = (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;
-}, $e = (i, e) => (t, n) => e(t, n, i);
+}, Ve = (i, e) => (t, n) => e(t, n, i);
 function vr(i) {
   var n, r, s, o;
   if ($.isNoop(i) || !Array.isArray(i))
@@ -1873,7 +1741,7 @@ function vr(i) {
     });
   return t;
 }
-function pr(i) {
+function wr(i) {
   if (!Array.isArray(i) || i.length < 3 || i[0] !== "drawingsOrder")
     return [];
   const e = [];
@@ -1888,7 +1756,7 @@ function pr(i) {
   }
   return e;
 }
-let at = class extends Ue {
+let ot = class extends Le {
   constructor(i, e, t, n, r) {
     super(), this._univerInstanceService = i, this._commandService = e, this._drawingManagerService = t, this._docDrawingService = n, this._renderManagerService = r, this._initialize();
   }
@@ -1910,12 +1778,12 @@ let at = class extends Ue {
         if (i.id !== ee.id)
           return;
         const e = i.params, { unitId: t, actions: n } = e;
-        pr(n).length > 0 && this._updateDrawingsOrder(t);
+        wr(n).length > 0 && this._updateDrawingsOrder(t);
       })
     ), this.disposeWithMe(
       this._commandService.onCommandExecuted((i) => {
         var o;
-        if (i.id !== Gn.id && i.id !== Vn.id)
+        if (i.id !== Vn.id && i.id !== $n.id)
           return;
         const e = (o = this._univerInstanceService.getCurrentUniverDocInstance()) == null ? void 0 : o.getUnitId(), t = this._drawingManagerService.getFocusDrawings();
         if (e == null || t.length === 0)
@@ -1956,19 +1824,19 @@ let at = class extends Ue {
     n.orderNotification(s), r.orderNotification(s);
   }
 };
-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--)
+ot = pr([
+  Ve(0, z),
+  Ve(1, j),
+  Ve(2, me),
+  Ve(3, Ue),
+  Ve(4, Q)
+], ot);
+var Ir = Object.getOwnPropertyDescriptor, _r = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Ir(e, t) : e, s = i.length - 1, o; s >= 0; s--)
     (o = i[s]) && (r = o(r) || r);
   return r;
 }, Fe = (i, e) => (t, n) => e(t, n, i);
-function An(i, e, t = 1, n = 0) {
+function Pn(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: (s - g) * h,
@@ -1985,14 +1853,14 @@ function An(i, e, t = 1, n = 0) {
     opacity: t != null ? t : 1
   };
 }
-function It(i, e) {
+function wt(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);
+  return Pn({ top: t, left: n, bottom: t + s, right: n + r }, e.scene, c, o);
 }
-let ct = class extends Ue {
+let at = class extends Le {
   constructor(e, t, n, r, s, o) {
     super();
-    _e(this, "_domLayerInfoMap", /* @__PURE__ */ new Map());
+    Ie(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() {
@@ -2026,7 +1894,7 @@ let ct = class extends Ue {
   _insertRects(e) {
     e.forEach(async (t) => {
       const { unitId: n } = t;
-      if (!this._univerInstanceService.getUnit(n, Ie.UNIVER_DOC))
+      if (!this._univerInstanceService.getUnit(n, we.UNIVER_DOC))
         return;
       const s = this._getSceneAndTransformerByDrawingSearch(n);
       if (s == null)
@@ -2038,7 +1906,7 @@ let ct = class extends Ue {
       if (!(c == null || c.length === 0))
         for (const d of c) {
           this._addHoverForRect(d);
-          const a = new $n(), l = It(d, s.renderUnit), g = new Tt(l), u = s.canvas, h = o.data, f = {
+          const a = new zn(), l = wt(d, s.renderUnit), g = new Tt(l), u = s.canvas, h = o.data, f = {
             dispose: a,
             rect: d,
             position$: g,
@@ -2048,42 +1916,42 @@ let ct = class extends Ue {
             position$: g,
             id: o.drawingId,
             componentKey: o.componentKey,
-            onPointerDown: (v) => {
-              u.dispatchEvent(new PointerEvent(v.type, v));
+            onPointerDown: (p) => {
+              u.dispatchEvent(new PointerEvent(p.type, p));
             },
-            onPointerMove: (v) => {
-              u.dispatchEvent(new PointerEvent(v.type, v));
+            onPointerMove: (p) => {
+              u.dispatchEvent(new PointerEvent(p.type, p));
             },
-            onPointerUp: (v) => {
-              u.dispatchEvent(new PointerEvent(v.type, v));
+            onPointerUp: (p) => {
+              u.dispatchEvent(new PointerEvent(p.type, p));
             },
-            onWheel: (v) => {
-              u.dispatchEvent(new WheelEvent(v.type, v));
+            onWheel: (p) => {
+              u.dispatchEvent(new WheelEvent(p.type, p));
             },
             data: h,
             unitId: n
           });
-          const p = d.onTransformChange$.subscribeEvent(() => {
-            const v = It(d, s.renderUnit);
+          const v = d.onTransformChange$.subscribeEvent(() => {
+            const p = wt(d, s.renderUnit);
             g.next(
-              v
+              p
             );
           });
           a.add(() => {
             this._canvasFloatDomService.removeFloatDom(o.drawingId);
-          }), p && a.add(p), this._domLayerInfoMap.set(o.drawingId, f);
+          }), v && a.add(v), this._domLayerInfoMap.set(o.drawingId, f);
         }
     });
   }
   _addHoverForRect(e) {
     this.disposeWithMe(
-      ye(
+      De(
         e.onPointerEnter$.subscribeEvent(() => {
           e.cursor = Ut.GRAB;
         })
       )
     ), this.disposeWithMe(
-      ye(
+      De(
         e.onPointerLeave$.subscribeEvent(() => {
           e.cursor = Ut.DEFAULT;
         })
@@ -2104,19 +1972,19 @@ let ct = class extends Ue {
       const n = this._getSceneAndTransformerByDrawingSearch(t);
       n && this._domLayerInfoMap.forEach((r) => {
         if (r.unitId !== t) return;
-        const s = It(r.rect, n.renderUnit);
+        const s = wt(r.rect, n.renderUnit);
         r.position$.next(s);
       });
     };
     this.disposeWithMe(
-      this._univerInstanceService.getCurrentTypeOfUnit$(Ie.UNIVER_DOC).pipe(
+      this._univerInstanceService.getCurrentTypeOfUnit$(we.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;
         }),
-        ji(
-          (t) => t ? Jt(t.render.scene.getViewport(cn.VIEW_MAIN).onScrollAfter$).pipe(Vt(() => ({ unitId: t.unitId }))) : Wi(null)
+        Hi(
+          (t) => t ? Jt(t.render.scene.getViewport(cn.VIEW_MAIN).onScrollAfter$).pipe(Vt(() => ({ unitId: t.unitId }))) : Gi(null)
         )
       ).subscribe((t) => {
         if (!t) return;
@@ -2131,16 +1999,16 @@ let ct = class extends Ue {
     }));
   }
   insertFloatDom(e, t) {
-    var p, v, w;
-    const n = this._univerInstanceService.getCurrentUnitOfType(Ie.UNIVER_DOC);
+    var v, p, w;
+    const n = this._univerInstanceService.getCurrentUnitOfType(we.UNIVER_DOC);
     if (!n) return !1;
     const r = this._getSceneAndTransformerByDrawingSearch(n.getUnitId());
     if (!r) return !1;
-    const c = (p = r.renderUnit.with(te).getSkeleton().getSkeletonData()) == null ? void 0 : p.pages[0];
+    const c = (v = r.renderUnit.with(te).getSkeleton().getSkeletonData()) == null ? void 0 : v.pages[0];
     if (!c) return !1;
     const { pageWidth: d, marginLeft: a, marginRight: l } = c, g = d - a - l, u = {
       size: {
-        width: (v = t.width) != null ? v : g,
+        width: (p = t.width) != null ? p : g,
         height: t.height
       },
       positionH: {
@@ -2148,41 +2016,41 @@ let ct = class extends Ue {
         posOffset: 0
       },
       positionV: {
-        relativeFrom: j.PAGE,
+        relativeFrom: W.PAGE,
         posOffset: 0
       },
       angle: 0
-    }, h = (w = t.drawingId) != null ? w : zn(), f = {
+    }, h = (w = t.drawingId) != null ? w : Xn(), f = {
       unitId: n.getUnitId(),
       drawings: [
         {
           drawingId: h,
-          drawingType: Le.DRAWING_DOM,
+          drawingType: Pe.DRAWING_DOM,
           subUnitId: n.getUnitId(),
           unitId: n.getUnitId(),
           ...e,
           title: "",
           description: "",
           docTransform: u,
-          layoutType: F.INLINE,
+          layoutType: k.INLINE,
           transform: an(u)
         }
       ]
     };
-    return this._commandService.syncExecuteCommand(Ct.id, f), h;
+    return this._commandService.syncExecuteCommand(xt.id, f), h;
   }
 };
-ct = Ir([
+at = _r([
   Fe(0, Q),
-  Fe(1, ve),
+  Fe(1, me),
   Fe(2, Z(tn)),
-  Fe(3, Z(Ti)),
+  Fe(3, Z(Mi)),
   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(
+  Fe(5, j)
+], at);
+const Sr = (i) => {
+  const { floatDomInfos: e, scene: t, offset: n, bound: r } = i, s = r.right - r.left, o = r.bottom - r.top, c = Vi(() => e.map((d) => {
+    const { width: a = 0, height: l = 0, left: g = 0, top: u = 0 } = d.transform, f = Pn(
       {
         left: g,
         right: g + a,
@@ -2190,7 +2058,7 @@ const _r = (i) => {
         bottom: u + l
       },
       t
-    ), p = {
+    ), v = {
       position$: new Tt(f),
       position: f,
       id: d.drawingId,
@@ -2206,16 +2074,16 @@ const _r = (i) => {
       unitId: d.unitId,
       data: d.data
     };
-    return [d.drawingId, p];
+    return [d.drawingId, v];
   }).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)) });
+  return /* @__PURE__ */ m("div", { style: { position: "absolute", top: 0, left: 0 }, children: c.map(([d, a]) => /* @__PURE__ */ m(bi, { layer: a, id: d, position: a.position }, d)) });
 };
-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--)
+var Dr = Object.getOwnPropertyDescriptor, Or = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Dr(e, t) : e, s = i.length - 1, o; s >= 0; s--)
     (o = i[s]) && (r = o(r) || r);
   return r;
-}, ze = (i, e) => (t, n) => e(t, n, i);
-let dt = class extends Ue {
+}, $e = (i, e) => (t, n) => e(t, n, i);
+let ct = class extends Le {
   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();
   }
@@ -2228,7 +2096,7 @@ let dt = class extends Ue {
             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);
+              d.drawingType !== Pe.DRAWING_CHART && d.drawingType !== Pe.DRAWING_DOM && this._drawingRenderService.renderDrawing(d, r);
             }), t();
           }
         }
@@ -2245,12 +2113,12 @@ let dt = class extends Ue {
             if (s) {
               const o = s.order.map((d) => {
                 const a = s.data[d];
-                if (a.drawingType === Le.DRAWING_CHART)
+                if (a.drawingType === Pe.DRAWING_CHART)
                   return {
                     ...a,
-                    componentKey: this._componetManager.get(Xn)
+                    componentKey: this._componetManager.get(qn)
                   };
-                if (a.drawingType === Le.DRAWING_DOM) {
+                if (a.drawingType === Pe.DRAWING_DOM) {
                   const l = this._docPrintInterceptorService.getPrintComponent(a.componentKey);
                   return {
                     ...a,
@@ -2258,8 +2126,8 @@ let dt = class extends Ue {
                   };
                 }
                 return null;
-              }).filter(Boolean), c = bi(_r, this._injector);
-              return Bi(
+              }).filter(Boolean), c = xi(Sr, this._injector);
+              return Fi(
                 /* @__PURE__ */ m(
                   c,
                   {
@@ -2282,31 +2150,31 @@ let dt = class extends Ue {
     );
   }
 };
-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) => {
+ct = Or([
+  $e(0, Z(Ei)),
+  $e(1, Z(tn)),
+  $e(2, me),
+  $e(3, Z(on)),
+  $e(4, Z(en))
+], ct);
+var yr = Object.getOwnPropertyDescriptor, Tr = (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;
-}, it = (i, e) => (t, n) => e(t, n, i);
-const Tr = "__InlineDrawingAnchor__";
+}, nt = (i, e) => (t, n) => e(t, n, i);
+const Mr = "__InlineDrawingAnchor__";
 function Yt(i) {
   const { path: e } = i;
   return e.some((t) => t === "cells");
 }
-let lt = class extends Ue {
+let dt = class extends Le {
   constructor(e, t, n, r) {
     super();
-    _e(this, "_liquid", new nn());
-    _e(this, "_listenerOnImageMap", /* @__PURE__ */ new Set());
+    Ie(this, "_liquid", new nn());
+    Ie(this, "_listenerOnImageMap", /* @__PURE__ */ new Set());
     // Use to cache the drawings is under transforming or scaling.
-    _e(this, "_transformerCache", /* @__PURE__ */ new Map());
-    _e(this, "_anchorShape");
+    Ie(this, "_transformerCache", /* @__PURE__ */ new Map());
+    Ie(this, "_anchorShape");
     this._commandService = e, this._univerInstanceService = t, this._drawingManagerService = n, this._renderManagerService = r, this._init();
   }
   _init() {
@@ -2331,22 +2199,22 @@ let lt = class extends Ue {
     if (t == null)
       return;
     this.disposeWithMe(
-      ye(
+      De(
         t.changeStart$.subscribe((s) => {
           var c;
           this._transformerCache.clear();
           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)
+            const { oKey: a, width: l, height: g, left: u, top: h, angle: f } = d, v = this._drawingManagerService.getDrawingOKey(a);
+            if (v == null)
               continue;
-            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)
+            const p = this._univerInstanceService.getUniverDocInstance(v.unitId), w = (c = p == null ? void 0 : p.getSnapshot().drawings) == null ? void 0 : c[v.drawingId];
+            if ((w == null ? void 0 : w.layoutType) === k.INLINE)
               try {
                 d.setOpacity(0.2);
               } catch {
               }
-            w != null && this._transformerCache.set(p.drawingId, {
+            w != null && this._transformerCache.set(v.drawingId, {
               drawing: w,
               top: h,
               left: u,
@@ -2360,21 +2228,21 @@ let lt = class extends Ue {
     );
     const n = Et(this._updateMultipleDrawingDocTransform.bind(this), 50);
     Et(this._nonInlineDrawingTransform.bind(this), 50), this.disposeWithMe(
-      ye(
+      De(
         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)
+            const a = this._transformerCache.values().next().value, l = o.values().next().value, { width: g, height: u, top: h, left: f, angle: v } = l;
+            if (a && g === a.width && u === a.height && h === a.top && f === a.left && v === a.angle)
               return;
-            a && (a.drawing.layoutType, F.INLINE), a && a.drawing.layoutType === F.INLINE && c != null && d != null && this._updateInlineDrawingAnchor(a.drawing, c, d);
+            a && (a.drawing.layoutType, k.INLINE), a && a.drawing.layoutType === k.INLINE && c != null && d != null && this._updateInlineDrawingAnchor(a.drawing, c, d);
           }
         })
       )
     ), this.disposeWithMe(
-      ye(
+      De(
         // eslint-disable-next-line complexity
         t.changeEnd$.subscribe((s) => {
           const { objects: o, offsetX: c, offsetY: d } = s;
@@ -2383,7 +2251,7 @@ let lt = class extends Ue {
             if (l == null)
               continue;
             const g = this._transformerCache.get(l == null ? void 0 : l.drawingId);
-            if ((g == null ? void 0 : g.drawing.layoutType) === F.INLINE)
+            if ((g == null ? void 0 : g.drawing.layoutType) === k.INLINE)
               try {
                 a.setOpacity(1);
               } catch {
@@ -2392,10 +2260,10 @@ let lt = class extends Ue {
           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)
+            const a = this._transformerCache.values().next().value, l = o.values().next().value, { width: g, height: u, top: h, left: f, angle: v } = l;
+            if (a && g === a.width && u === a.height && h === a.top && f === a.left && v === a.angle)
               return;
-            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);
+            a && a.drawing.layoutType === k.INLINE ? g !== a.width || u !== 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);
           }
           this._transformerCache.clear();
         })
@@ -2418,8 +2286,8 @@ let lt = class extends Ue {
       const h = this._transformerCache.get(u.drawingId);
       if (h == null)
         continue;
-      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({
+      const { drawing: f, top: v, left: p, width: w, height: O, angle: D } = h, { width: y, height: x } = this._getPageContentSize(f);
+      if (l = Math.min(l, y), g = Math.min(g, x), (w !== l || O !== g) && t.push({
         drawingId: u.drawingId,
         key: "size",
         value: {
@@ -2430,8 +2298,8 @@ let lt = class extends Ue {
         drawingId: u.drawingId,
         key: "angle",
         value: a
-      }), p !== d || v !== c) {
-        const M = d - p, E = c - v;
+      }), v !== d || p !== c) {
+        const M = d - v, E = c - p;
         M !== 0 && t.push({
           drawingId: u.drawingId,
           key: "positionV",
@@ -2449,7 +2317,7 @@ let lt = class extends Ue {
         });
       }
     }
-    t.length > 0 && n && r && this._commandService.executeCommand(Ye.id, {
+    t.length > 0 && n && r && this._commandService.executeCommand(Ke.id, {
       unitId: n,
       subUnitId: r,
       drawings: t
@@ -2470,7 +2338,7 @@ let lt = class extends Ue {
     r != null && this._createOrUpdateInlineAnchor(e.unitId, r);
   }
   _getInlineDrawingAnchor(e, t, n) {
-    var A, H;
+    var A, G;
     const r = this._renderManagerService.getRenderById(e.unitId), s = r == null ? void 0 : r.with(te).getSkeleton();
     if (r == null)
       return;
@@ -2479,94 +2347,94 @@ let lt = class extends Ue {
       pageMarginLeft: g,
       pageMarginTop: u
     } = d.getOffsetConfig();
-    let h = null, f = !1, p = -1, v = "";
-    const w = 0.5, y = this._getTransformCoordForDocumentOffset(d, a, t, n);
-    if (y == null)
+    let h = null, f = !1, v = -1, p = "";
+    const w = 0.5, O = this._getTransformCoordForDocumentOffset(d, a, t, n);
+    if (O == null)
       return;
     const D = (A = this._renderManagerService.getRenderById(e.unitId)) == null ? void 0 : A.with(xe);
     if (D == null)
       return;
-    const O = s == null ? void 0 : s.findNodeByCoord(y, l, g, u, {
+    const y = s == null ? void 0 : s.findNodeByCoord(O, l, g, u, {
       strict: !1,
       segmentId: D.getSegment(),
       segmentPage: D.getSegmentPage()
     });
-    if (O) {
-      const { node: _, ratioX: S, segmentPage: x, segmentId: T } = O;
-      f = S < w, h = _, p = x, v = T;
+    if (y) {
+      const { node: _, ratioX: S, segmentPage: C, segmentId: T } = y;
+      f = S < w, h = _, v = C, p = T;
     }
     if (h == null)
       return;
-    const C = s == null ? void 0 : s.findPositionByGlyph(h, p), M = this._getDocObject();
-    if (C == null || s == null || M == null || Yt(C))
+    const x = s == null ? void 0 : s.findPositionByGlyph(h, v), M = this._getDocObject();
+    if (x == null || s == null || M == null || Yt(x))
       return;
     const E = {
-      ...C,
+      ...x,
       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 };
+    }, U = M.document.getOffsetConfig(), N = new kt(U, s), { cursorList: I, contentBoxPointGroup: P } = N.getRangePointData(E, E), { startOffset: H } = (G = Wt(I)) != null ? G : {};
+    if (H != null)
+      return { offset: H, contentBoxPointGroup: P, segmentId: p, segmentPage: v };
   }
   // eslint-disable-next-line max-lines-per-function, complexity
   _getDrawingAnchor(e, t) {
-    var Se, De, ce, Oe, Te, Ee, Re, Me, de, le, Ae;
+    var _e, Se, ce, Oe, ye, Ne, Ee, Te, de, le, Re;
     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: 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 { 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: v, docsLeft: p, docsTop: w } = g.getOffsetConfig(), { left: O, top: D, angle: y } = t;
+    let { width: x, 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, _ = {
+    x = Math.min(x, N), M = Math.min(M, I);
+    let P = null, H = "", A = -1;
+    const G = !1, _ = {
       ...e.docTransform,
       size: {
-        width: C,
+        width: x,
         height: M
       },
-      angle: O
-    }, { x: S, y: x } = l.getViewportScrollXY(u), T = this._getTransformCoordForDocumentOffset(g, u, y - S, D - x);
+      angle: y
+    }, { x: S, y: C } = l.getViewportScrollXY(u), T = this._getTransformCoordForDocumentOffset(g, u, O - S, D - C);
     if (T == null)
       return;
-    const L = (Se = this._renderManagerService.getRenderById(e.unitId)) == null ? void 0 : Se.with(xe);
+    const L = (_e = this._renderManagerService.getRenderById(e.unitId)) == null ? void 0 : _e.with(xe);
     if (L == null)
       return;
-    const B = r == null ? void 0 : r.findNodeByCoord(T, h, f, p, {
+    const B = r == null ? void 0 : r.findNodeByCoord(T, h, f, v, {
       strict: !1,
       segmentId: L.getSegment(),
       segmentPage: L.getSegmentPage()
     });
     if (B) {
-      const { node: pe, segmentPage: mt, segmentId: vt } = B;
-      P = pe, A = mt, W = vt;
+      const { node: pe, segmentPage: ht, segmentId: mt } = B;
+      P = pe, A = ht, H = mt;
     }
     if (P == null)
       return;
-    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)
+    const b = (Se = P.parent) == null ? void 0 : Se.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], F = (Oe = R == null ? void 0 : R.parent) == null ? void 0 : Oe.parent;
+    if (b == null || R == null || V == null || F == null)
       return;
     this._liquid.reset();
-    const K = k.type;
+    const K = F.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) {
+      const { headerId: ht, footerId: mt, pageHeight: Un, pageWidth: Ct, marginLeft: Nt, marginBottom: Bn } = pe, Fn = o.indexOf(pe);
+      if (A > -1 && Fn === A) {
         switch (K) {
-          case kt.HEADER: {
-            const Ve = (Te = c.get(mt)) == null ? void 0 : Te.get(xt);
-            if (Ve)
+          case Ft.HEADER: {
+            const je = (ye = c.get(ht)) == null ? void 0 : ye.get(Ct);
+            if (je)
               this._liquid.translatePagePadding({
-                marginTop: Ve.marginTop,
+                marginTop: je.marginTop,
                 marginLeft: Nt
               });
             else
               throw new Error("header skeleton not found");
             break;
           }
-          case kt.FOOTER: {
-            const Ve = (Ee = d.get(vt)) == null ? void 0 : Ee.get(xt);
-            if (Ve)
+          case Ft.FOOTER: {
+            const je = (Ne = d.get(mt)) == null ? void 0 : Ne.get(Ct);
+            if (je)
               this._liquid.translatePagePadding({
-                marginTop: Ln - Un + Ve.marginTop,
+                marginTop: Un - Bn + je.marginTop,
                 marginLeft: Nt
               });
             else
@@ -2576,20 +2444,20 @@ let lt = class extends Ue {
         }
         break;
       }
-      if (this._liquid.translatePagePadding(pe), pe === k)
+      if (this._liquid.translatePagePadding(pe), pe === F)
         break;
-      this._liquid.restorePagePadding(pe), this._liquid.translatePage(pe, h, f, p);
+      this._liquid.restorePagePadding(pe), this._liquid.translatePage(pe, h, f, v);
     }
-    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 = {
+    switch (E.relativeFrom === W.LINE ? P = b.divides[0].glyphGroup[0] : P = (le = (de = (Te = (Ee = V.divides) == null ? void 0 : Ee[0]) == null ? void 0 : Te.glyphGroup) == null ? void 0 : de[0]) != null ? le : P, _.positionH = {
       relativeFrom: U.relativeFrom,
-      posOffset: y - this._liquid.x - v
+      posOffset: O - this._liquid.x - p
     }, U.relativeFrom) {
       case J.MARGIN: {
-        _.positionH.posOffset = y - this._liquid.x - v - k.marginLeft;
+        _.positionH.posOffset = O - this._liquid.x - p - F.marginLeft;
         break;
       }
       case J.COLUMN: {
-        _.positionH.posOffset = y - this._liquid.x - v - R.left;
+        _.positionH.posOffset = O - this._liquid.x - p - R.left;
         break;
       }
     }
@@ -2597,30 +2465,30 @@ let lt = class extends Ue {
       relativeFrom: E.relativeFrom,
       posOffset: D - this._liquid.y - w
     }, E.relativeFrom) {
-      case j.PAGE: {
-        _.positionV.posOffset = D - this._liquid.y - w - k.marginTop;
+      case W.PAGE: {
+        _.positionV.posOffset = D - this._liquid.y - w - F.marginTop;
         break;
       }
-      case j.LINE: {
+      case W.LINE: {
         _.positionV.posOffset = D - this._liquid.y - w - b.top;
         break;
       }
-      case j.PARAGRAPH: {
+      case W.PARAGRAPH: {
         _.positionV.posOffset = D - this._liquid.y - w - V.top;
         break;
       }
     }
     if (P == null)
       return;
-    const oe = r == null ? void 0 : r.findPositionByGlyph(P, A), ke = this._getDocObject();
-    if (oe == null || r == null || ke == null || Yt(oe))
+    const oe = r == null ? void 0 : r.findPositionByGlyph(P, A), Be = this._getDocObject();
+    if (oe == null || r == null || Be == null || Yt(oe))
       return;
-    const Ne = {
+    const Ce = {
       ...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 : {};
+      isBack: G
+    }, Ge = Be.document.getOffsetConfig(), ae = new kt(Ge, r), { cursorList: ne } = ae.getRangePointData(Ce, Ce), { startOffset: ie } = (Re = Wt(ne)) != null ? Re : {};
     if (ie != null)
-      return { offset: ie, docTransform: _, segmentId: W, segmentPage: A };
+      return { offset: ie, docTransform: _, segmentId: H, segmentPage: A };
   }
   // Update drawing when use transformer to resize it.
   _updateDrawingSize(e, t) {
@@ -2638,7 +2506,7 @@ let lt = class extends Ue {
       drawingId: r.drawingId,
       key: "angle",
       value: u
-    }), n.length > 0 && d && a && this._commandService.executeCommand(Ye.id, {
+    }), n.length > 0 && d && a && this._commandService.executeCommand(Ke.id, {
       unitId: d,
       subUnitId: a,
       drawings: n
@@ -2647,7 +2515,7 @@ let lt = class extends Ue {
   // Update inline drawing when use transformer to move it.
   _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, {
+    return this._commandService.executeCommand(Mn.id, {
       unitId: e.unitId,
       subUnitId: e.unitId,
       drawing: e,
@@ -2669,27 +2537,27 @@ let lt = class extends Ue {
         height: c,
         angle: d
       };
-    const { mainComponent: u } = n, h = u, { top: f, pageLayoutType: p, pageMarginLeft: v, pageMarginTop: w } = h;
-    let y = s;
+    const { mainComponent: u } = n, h = u, { top: f, pageLayoutType: v, pageMarginLeft: p, pageMarginTop: w } = h;
+    let O = s;
     this._liquid.reset();
     for (const D of g) {
-      const { marginBottom: O, pageHeight: C } = D, M = g.indexOf(D), E = g[M + 1];
+      const { marginBottom: y, pageHeight: x } = D, M = g.indexOf(D), E = g[M + 1];
       if (E == null)
         continue;
-      if (Ce.hasIntersectionBetweenTwoRanges(
+      if (be.hasIntersectionBetweenTwoRanges(
         s,
         s + c,
-        this._liquid.y + f + C - O,
-        this._liquid.y + f + C + w + E.marginTop
+        this._liquid.y + f + x - y,
+        this._liquid.y + f + x + w + 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);
+        const N = s + c / 2, I = this._liquid.y + f + x + w / 2;
+        N < I ? O = Math.min(s, this._liquid.y + f + x - y - c) : O = Math.max(s, this._liquid.y + f + x + w + E.marginTop);
       }
-      this._liquid.translatePage(D, p, v, w);
+      this._liquid.translatePage(D, v, p, w);
     }
     return {
       left: r,
-      top: y,
+      top: O,
       width: o,
       height: c,
       angle: d
@@ -2700,7 +2568,7 @@ let lt = class extends Ue {
     if (n && r.top !== t.top)
       return;
     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, {
+    return o == null || c == null ? this._updateMultipleDrawingDocTransform(/* @__PURE__ */ new Map([[e.drawingId, t]])) : this._commandService.executeCommand(bn.id, {
       unitId: e.unitId,
       subUnitId: e.unitId,
       drawing: e,
@@ -2720,7 +2588,7 @@ let lt = class extends Ue {
     return { scene: n, transformer: r };
   }
   _getTransformCoordForDocumentOffset(e, t, n, r) {
-    const { documentTransform: s } = e.getOffsetConfig(), o = t.transformVector2SceneCoord(mi.FromArray([n, r]));
+    const { documentTransform: s } = e.getOffsetConfig(), o = t.transformVector2SceneCoord(pi.FromArray([n, r]));
     if (o)
       return s.clone().invert().applyPoint(o);
   }
@@ -2731,23 +2599,23 @@ let lt = class extends Ue {
     const { mainComponent: r, scene: s } = n, o = r, {
       docsLeft: c,
       docsTop: d
-    } = o.getOffsetConfig(), a = Ei(t), { left: l, top: g, height: u } = a, h = l + c, f = g + d;
+    } = o.getOffsetConfig(), a = Ri(t), { left: l, top: g, height: u } = a, h = l + c, f = g + d;
     if (this._anchorShape) {
       this._anchorShape.transformByState({ left: h, top: f, height: u }), this._anchorShape.show();
       return;
     }
-    const p = 6, v = new vi(Tr + Ce.generateRandomId(p), {
+    const v = 6, p = new vi(Mr + be.generateRandomId(v), {
       left: h,
       top: f,
       height: u,
       strokeWidth: 2,
-      stroke: pi(qn.darkGray, 1),
+      stroke: wi(Kn.darkGray, 1),
       evented: !1
     });
-    this._anchorShape = v, s.addObject(v, Ri);
+    this._anchorShape = p, s.addObject(p, Ai);
   }
   _getDocObject() {
-    return Ai(this._univerInstanceService, this._renderManagerService);
+    return Pi(this._univerInstanceService, this._renderManagerService);
   }
   _getPageContentSize(e) {
     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();
@@ -2778,25 +2646,25 @@ let lt = class extends Ue {
       };
   }
 };
-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--)
+dt = Tr([
+  nt(0, j),
+  nt(1, z),
+  nt(2, me),
+  nt(3, Q)
+], dt);
+var br = Object.getOwnPropertyDescriptor, xr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? br(e, t) : e, s = i.length - 1, o; s >= 0; s--)
     (o = i[s]) && (r = o(r) || r);
   return r;
-}, Xe = (i, e) => (t, n) => e(t, n, i);
-let ut = class extends Kn {
+}, ze = (i, e) => (t, n) => e(t, n, i);
+let lt = class extends Yn {
   constructor(e, t, n, r, s) {
     super();
-    _e(this, "_initImagePopupMenu", /* @__PURE__ */ new Set());
+    Ie(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$(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));
+    this._univerInstanceService.getCurrentTypeOfUnit$(we.UNIVER_DOC).pipe($t(this.dispose$)).subscribe((e) => this._create(e)), this._univerInstanceService.getTypeOfUnitDisposed$(we.UNIVER_DOC).pipe($t(this.dispose$)).subscribe((e) => this._dispose(e)), this._univerInstanceService.getAllUnitsForType(we.UNIVER_DOC).forEach((e) => this._create(e));
   }
   _dispose(e) {
     const t = e.getUnitId();
@@ -2811,7 +2679,7 @@ let ut = class extends Kn {
   _hasCropObject(e) {
     const t = e.getAllObjects();
     for (const n of t)
-      if (n instanceof di)
+      if (n instanceof li)
         return !0;
     return !1;
   }
@@ -2826,7 +2694,7 @@ let ut = class extends Kn {
       return;
     const r = [];
     this.disposeWithMe(
-      ye(
+      De(
         n.createControl$.subscribe(() => {
           if (this._hasCropObject(t))
             return;
@@ -2837,12 +2705,12 @@ let ut = class extends Kn {
           if (!c)
             return;
           const d = c.oKey, a = this._drawingManagerService.getDrawingOKey(d);
-          if (!a || a.drawingType === Le.DRAWING_DOM)
+          if (!a || a.drawingType === Pe.DRAWING_DOM)
             return;
           const { unitId: l, subUnitId: g, drawingId: u, drawingType: h } = a, f = this._canvasPopManagerService.attachPopupToObject(
             c,
             {
-              componentKey: li,
+              componentKey: ui,
               direction: "horizontal",
               offset: [2, 0],
               extraProps: {
@@ -2859,19 +2727,19 @@ let ut = class extends Kn {
         })
       )
     ), this.disposeWithMe(
-      ye(
+      De(
         n.clearControl$.subscribe(() => {
-          r.forEach((o) => o.dispose()), r.length = 0, this._contextService.setContextValue(rt, !1), this._drawingManagerService.focusDrawing(null);
+          r.forEach((o) => o.dispose()), r.length = 0, this._contextService.setContextValue(it, !1), this._drawingManagerService.focusDrawing(null);
         })
       )
     ), this.disposeWithMe(
-      ye(
+      De(
         n.changing$.subscribe(() => {
           r.forEach((o) => o.dispose()), r.length = 0;
         })
       )
     ), this.disposeWithMe(
-      ye(
+      De(
         n.changeStart$.subscribe(() => {
           r.forEach((o) => o.dispose()), r.length = 0;
         })
@@ -2883,7 +2751,7 @@ let ut = class extends Kn {
       {
         label: "image-popup.edit",
         index: 0,
-        commandId: xn.id,
+        commandId: Nn.id,
         commandParams: { unitId: e, subUnitId: t, drawingId: n },
         // disable: !!SHEET_EDITOR_UNITS.includes(unitId) || drawingType === DrawingTypeEnum.DRAWING_DOM,
         disable: !0
@@ -2898,7 +2766,7 @@ let ut = class extends Kn {
       {
         label: "image-popup.crop",
         index: 2,
-        commandId: ui.id,
+        commandId: gi.id,
         commandParams: { unitId: e, subUnitId: t, drawingId: n },
         disable: !0
         // TODO: @JOCS, feature is not ready.
@@ -2906,7 +2774,7 @@ let ut = class extends Kn {
       {
         label: "image-popup.reset",
         index: 3,
-        commandId: gi.id,
+        commandId: fi.id,
         commandParams: [{ unitId: e, subUnitId: t, drawingId: n }],
         disable: !0
         // TODO: @JOCS, feature is not ready.
@@ -2914,22 +2782,22 @@ let ut = class extends Kn {
     ];
   }
 };
-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) => {
+lt = xr([
+  ze(0, me),
+  ze(1, Z(Li)),
+  ze(2, Q),
+  ze(3, z),
+  ze(4, Qt)
+], lt);
+var Cr = Object.getOwnPropertyDescriptor, Nr = (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;
-}, Pe = (i, e) => (t, n) => e(t, n, i);
-let St = class extends Ue {
+}, Ae = (i, e) => (t, n) => e(t, n, i);
+let St = class extends Le {
   constructor(e, t, n, r, s, o, c, d) {
     super();
-    _e(this, "_liquid", new nn());
+    Ie(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() {
@@ -2953,7 +2821,7 @@ let St = class extends Ue {
           const c = this._docSkeletonManagerService.getSkeleton();
           if (c == null)
             return;
-          if (this._editorService.isEditor(s) && s !== yt) {
+          if (this._editorService.isEditor(s) && s !== Ot) {
             o == null || o.makeDirty();
             return;
           }
@@ -2965,8 +2833,8 @@ let St = class extends Ue {
   _initResize() {
     this.disposeWithMe(
       Jt(this._context.engine.onTransformChange$).pipe(
-        zt((e) => e.type === wi.resize),
-        ln(16)
+        zt((e) => e.type === Ii.resize),
+        un(16)
       ).subscribe(() => {
         var n;
         const e = this._docSkeletonManagerService.getSkeleton(), { scene: t } = this._context;
@@ -2975,16 +2843,16 @@ let St = class extends Ue {
     );
   }
   _refreshDrawing(e) {
-    var y, D;
+    var O, D;
     const t = e == null ? void 0 : e.getSkeletonData(), { mainComponent: n, unitId: r } = this._context, s = n;
     if (!t)
       return;
     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 O = 0, C = g.length; O < C; O++) {
-      const M = g[O], { headerId: E, footerId: U, pageWidth: N } = M;
+    for (let y = 0, x = g.length; y < x; y++) {
+      const M = g[y], { headerId: E, footerId: U, pageWidth: N } = M;
       if (E) {
-        const I = (y = u.get(E)) == null ? void 0 : y.get(N);
+        const I = (O = u.get(E)) == null ? void 0 : O.get(N);
         I && this._calculateDrawingPosition(
           r,
           I,
@@ -3009,8 +2877,8 @@ let St = class extends Ue {
       }
       this._calculateDrawingPosition(r, M, o, c, f, M.marginTop, M.marginLeft), this._liquid.translatePage(M, d, a, l);
     }
-    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);
+    const v = Object.values(f), p = v.filter((y) => !y.isMultiTransform), w = v.filter((y) => y.isMultiTransform);
+    p.length > 0 && this._drawingManagerService.refreshTransform(p), this._handleMultiDrawingsTransform(w);
   }
   _handleMultiDrawingsTransform(e) {
     const { scene: t, unitId: n } = this._context, r = t.getTransformerByCreate();
@@ -3031,22 +2899,22 @@ let St = class extends Ue {
       marginTop: o,
       marginLeft: c
     }), d.forEach((a) => {
-      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 = {
+      const { aLeft: l, aTop: g, height: u, width: h, angle: f, drawingId: v, drawingOrigin: p } = a, w = p.layoutType === k.WRAP_NONE && p.behindDoc === se.TRUE, { isMultiTransform: O = se.FALSE } = p, D = {
         left: l + n + this._liquid.x,
         top: g + r + this._liquid.y,
         width: h,
         height: u,
         angle: f
       };
-      s[p] == null ? s[p] = {
+      s[v] == null ? s[v] = {
         unitId: e,
         subUnitId: e,
-        drawingId: p,
+        drawingId: v,
         behindText: w,
         transform: D,
         transforms: [D],
-        isMultiTransform: y
-      } : y === se.TRUE && s[p].transforms.push(D);
+        isMultiTransform: O
+      } : O === se.TRUE && s[v].transforms.push(D);
     }), this._liquid.restorePagePadding({
       marginTop: o,
       marginLeft: c
@@ -3060,73 +2928,73 @@ let St = class extends Ue {
     this._lifecycleService.stage >= Rt.Rendered ? this._docSkeletonManagerService.getSkeleton() ? e() : setTimeout(e, 500) : this._lifecycleService.lifecycle$.pipe(zt((t) => t === Rt.Rendered)).subscribe(e);
   }
 };
-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 = Nr([
+  Ae(1, Z(te)),
+  Ae(2, j),
+  Ae(3, Ui),
+  Ae(4, me),
+  Ae(5, Z(ft)),
+  Ae(6, z),
+  Ae(7, Z(Zn))
 ], 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--)
+var Er = Object.defineProperty, Rr = Object.getOwnPropertyDescriptor, Ar = (i, e, t) => e in i ? Er(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t, Pr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Rr(e, t) : e, s = i.length - 1, o; s >= 0; s--)
     (o = i[s]) && (r = o(r) || r);
   return r;
-}, _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 {
+}, It = (i, e) => (t, n) => e(t, n, i), Ln = (i, e, t) => Ar(i, typeof e != "symbol" ? e + "" : e, t);
+const Lr = "DOC_DRAWING_UI_PLUGIN";
+let ut = class extends ei {
   constructor(i = Xt, e, t, n) {
     super(), this._config = i, this._injector = e, this._renderManagerSrv = t, this._configService = n;
-    const { ...r } = ei(
+    const { ...r } = ti(
       {},
       Xt,
       this._config
     );
-    this._configService.setConfig(Vi, r);
+    this._configService.setConfig($i, r);
   }
   onStarting() {
     [
-      [ot],
-      [ut],
+      [st],
       [lt],
+      [dt],
+      [ot],
+      [ft],
       [at],
-      [ht],
-      [ct],
-      [dt]
+      [ct]
     ].forEach((e) => this._injector.add(e));
   }
   onReady() {
     [
-      [st],
+      [rt],
       [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);
+    ].forEach((i) => this._renderManagerSrv.registerRenderModule(we.UNIVER_DOC, i)), this._injector.get(ot), this._injector.get(st), this._injector.get(dt), this._injector.get(ct);
   }
   onRendered() {
-    this._injector.get(ut), this._injector.get(ct);
+    this._injector.get(lt), this._injector.get(at);
   }
 };
-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);
+Ln(ut, "type", we.UNIVER_DOC);
+Ln(ut, "pluginName", Lr);
+ut = Pr([
+  Qn(hi, ci, ni, Ci),
+  It(1, Z(en)),
+  It(2, Q),
+  It(3, Jn)
+], ut);
 export {
-  Ji as ClearDocDrawingTransformerOperation,
-  En as DOCS_IMAGE_MENU_ID,
+  er as ClearDocDrawingTransformerOperation,
+  Rn 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,
+  at as DocFloatDomController,
+  Nn as EditDocDrawingOperation,
+  wn as GroupDocDrawingCommand,
+  xt as InsertDocDrawingCommand,
+  Sn as InsertDocImageCommand,
+  Ye as MoveDocDrawingsCommand,
   bt as RemoveDocDrawingCommand,
-  wn as SetDocDrawingArrangeCommand,
+  In as SetDocDrawingArrangeCommand,
   Cn as SidebarDocDrawingOperation,
-  In as UngroupDocDrawingCommand,
-  gt as UniverDocsDrawingUIPlugin
+  _n as UngroupDocDrawingCommand,
+  ut as UniverDocsDrawingUIPlugin
 };